Initial Commit
This commit is contained in:
venbatechnologies@gmail.com
commit
f1bc627a79
13
.editorconfig
Normal file
13
.editorconfig
Normal file
@ -0,0 +1,13 @@
|
||||
# Editor configuration, see https://editorconfig.org
|
||||
root = true
|
||||
|
||||
[*]
|
||||
charset = utf-8
|
||||
indent_style = space
|
||||
indent_size = 2
|
||||
insert_final_newline = true
|
||||
trim_trailing_whitespace = true
|
||||
|
||||
[*.md]
|
||||
max_line_length = off
|
||||
trim_trailing_whitespace = false
|
||||
46
.gitignore
vendored
Normal file
46
.gitignore
vendored
Normal file
@ -0,0 +1,46 @@
|
||||
# See http://help.github.com/ignore-files/ for more about ignoring files.
|
||||
|
||||
# compiled output
|
||||
/dist
|
||||
/tmp
|
||||
/out-tsc
|
||||
# Only exists if Bazel was run
|
||||
/bazel-out
|
||||
|
||||
# dependencies
|
||||
/node_modules
|
||||
|
||||
# profiling files
|
||||
chrome-profiler-events*.json
|
||||
speed-measure-plugin*.json
|
||||
|
||||
# IDEs and editors
|
||||
/.idea
|
||||
.project
|
||||
.classpath
|
||||
.c9/
|
||||
*.launch
|
||||
.settings/
|
||||
*.sublime-workspace
|
||||
|
||||
# IDE - VSCode
|
||||
.vscode/*
|
||||
!.vscode/settings.json
|
||||
!.vscode/tasks.json
|
||||
!.vscode/launch.json
|
||||
!.vscode/extensions.json
|
||||
.history/*
|
||||
|
||||
# misc
|
||||
/.sass-cache
|
||||
/connect.lock
|
||||
/coverage
|
||||
/libpeerconnection.log
|
||||
npm-debug.log
|
||||
yarn-error.log
|
||||
testem.log
|
||||
/typings
|
||||
|
||||
# System Files
|
||||
.DS_Store
|
||||
Thumbs.db
|
||||
3
.vscode/settings.json
vendored
Normal file
3
.vscode/settings.json
vendored
Normal file
@ -0,0 +1,3 @@
|
||||
{
|
||||
"git.ignoreLimitWarning": true
|
||||
}
|
||||
27
README.md
Normal file
27
README.md
Normal file
@ -0,0 +1,27 @@
|
||||
# TelePdUser
|
||||
|
||||
This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 8.3.20.
|
||||
|
||||
## Development server
|
||||
|
||||
Run `ng serve` for a dev server. Navigate to `http://localhost:4200/`. The app will automatically reload if you change any of the source files.
|
||||
|
||||
## Code scaffolding
|
||||
|
||||
Run `ng generate component component-name` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module`.
|
||||
|
||||
## Build
|
||||
|
||||
Run `ng build` to build the project. The build artifacts will be stored in the `dist/` directory. Use the `--prod` flag for a production build.
|
||||
|
||||
## Running unit tests
|
||||
|
||||
Run `ng test` to execute the unit tests via [Karma](https://karma-runner.github.io).
|
||||
|
||||
## Running end-to-end tests
|
||||
|
||||
Run `ng e2e` to execute the end-to-end tests via [Protractor](http://www.protractortest.org/).
|
||||
|
||||
## Further help
|
||||
|
||||
To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI README](https://github.com/angular/angular-cli/blob/master/README.md).
|
||||
134
angular.json
Normal file
134
angular.json
Normal file
@ -0,0 +1,134 @@
|
||||
{
|
||||
"$schema": "./node_modules/@angular/cli/lib/config/schema.json",
|
||||
"version": 1,
|
||||
"newProjectRoot": "projects",
|
||||
"projects": {
|
||||
"tele-pd-user": {
|
||||
"projectType": "application",
|
||||
"schematics": {
|
||||
"@schematics/angular:component": {
|
||||
"style": "scss"
|
||||
}
|
||||
},
|
||||
"root": "",
|
||||
"sourceRoot": "src",
|
||||
"prefix": "app",
|
||||
"architect": {
|
||||
"build": {
|
||||
"builder": "@angular-devkit/build-angular:browser",
|
||||
"options": {
|
||||
"outputPath": "dist/tele-pd-user",
|
||||
"index": "src/index.html",
|
||||
"main": "src/main.ts",
|
||||
"polyfills": "src/polyfills.ts",
|
||||
"tsConfig": "tsconfig.app.json",
|
||||
"aot": true,
|
||||
"assets": [
|
||||
"src/favicon.ico",
|
||||
"src/assets"
|
||||
],
|
||||
"styles": [
|
||||
"src/styles.scss"
|
||||
],
|
||||
"scripts": []
|
||||
},
|
||||
"configurations": {
|
||||
"production": {
|
||||
"fileReplacements": [
|
||||
{
|
||||
"replace": "src/environments/environment.ts",
|
||||
"with": "src/environments/environment.prod.ts"
|
||||
}
|
||||
],
|
||||
"optimization": true,
|
||||
"outputHashing": "all",
|
||||
"sourceMap": false,
|
||||
"extractCss": true,
|
||||
"namedChunks": false,
|
||||
"extractLicenses": true,
|
||||
"vendorChunk": false,
|
||||
"buildOptimizer": true,
|
||||
"budgets": [
|
||||
{
|
||||
"type": "initial",
|
||||
"maximumWarning": "2mb",
|
||||
"maximumError": "5mb"
|
||||
},
|
||||
{
|
||||
"type": "anyComponentStyle",
|
||||
"maximumWarning": "6kb",
|
||||
"maximumError": "10kb"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
},
|
||||
"serve": {
|
||||
"builder": "@angular-devkit/build-angular:dev-server",
|
||||
"options": {
|
||||
"browserTarget": "tele-pd-user:build"
|
||||
},
|
||||
"configurations": {
|
||||
"production": {
|
||||
"browserTarget": "tele-pd-user:build:production"
|
||||
}
|
||||
}
|
||||
},
|
||||
"extract-i18n": {
|
||||
"builder": "@angular-devkit/build-angular:extract-i18n",
|
||||
"options": {
|
||||
"browserTarget": "tele-pd-user:build"
|
||||
}
|
||||
},
|
||||
"test": {
|
||||
"builder": "@angular-devkit/build-angular:karma",
|
||||
"options": {
|
||||
"main": "src/test.ts",
|
||||
"polyfills": "src/polyfills.ts",
|
||||
"tsConfig": "tsconfig.spec.json",
|
||||
"karmaConfig": "karma.conf.js",
|
||||
"assets": [
|
||||
"src/favicon.ico",
|
||||
"src/assets"
|
||||
],
|
||||
"styles": [
|
||||
"src/styles.scss"
|
||||
],
|
||||
"scripts": [
|
||||
"../node_modules/blueimp-canvas-to-blob/js/canvas-to-blob.min.js"
|
||||
]
|
||||
}
|
||||
},
|
||||
"lint": {
|
||||
"builder": "@angular-devkit/build-angular:tslint",
|
||||
"options": {
|
||||
"tsConfig": [
|
||||
"tsconfig.app.json",
|
||||
"tsconfig.spec.json",
|
||||
"e2e/tsconfig.json"
|
||||
],
|
||||
"exclude": [
|
||||
"**/node_modules/**"
|
||||
]
|
||||
}
|
||||
},
|
||||
"e2e": {
|
||||
"builder": "@angular-devkit/build-angular:protractor",
|
||||
"options": {
|
||||
"protractorConfig": "e2e/protractor.conf.js",
|
||||
"devServerTarget": "tele-pd-user:serve"
|
||||
},
|
||||
"configurations": {
|
||||
"production": {
|
||||
"devServerTarget": "tele-pd-user:serve:production"
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"defaultProject": "tele-pd-user",
|
||||
"cli": {
|
||||
"analytics": false
|
||||
}
|
||||
}
|
||||
12
browserslist
Normal file
12
browserslist
Normal file
@ -0,0 +1,12 @@
|
||||
# This file is used by the build system to adjust CSS and JS output to support the specified browsers below.
|
||||
# For additional information regarding the format and rule options, please see:
|
||||
# https://github.com/browserslist/browserslist#queries
|
||||
|
||||
# You can see what browsers were selected by your queries by running:
|
||||
# npx browserslist
|
||||
|
||||
> 0.5%
|
||||
last 2 versions
|
||||
Firefox ESR
|
||||
not dead
|
||||
not IE 9-11 # For IE 9-11 support, remove 'not'.
|
||||
32
e2e/protractor.conf.js
Normal file
32
e2e/protractor.conf.js
Normal file
@ -0,0 +1,32 @@
|
||||
// @ts-check
|
||||
// Protractor configuration file, see link for more information
|
||||
// https://github.com/angular/protractor/blob/master/lib/config.ts
|
||||
|
||||
const { SpecReporter } = require('jasmine-spec-reporter');
|
||||
|
||||
/**
|
||||
* @type { import("protractor").Config }
|
||||
*/
|
||||
exports.config = {
|
||||
allScriptsTimeout: 11000,
|
||||
specs: [
|
||||
'./src/**/*.e2e-spec.ts'
|
||||
],
|
||||
capabilities: {
|
||||
browserName: 'chrome'
|
||||
},
|
||||
directConnect: true,
|
||||
baseUrl: 'http://localhost:4200/',
|
||||
framework: 'jasmine',
|
||||
jasmineNodeOpts: {
|
||||
showColors: true,
|
||||
defaultTimeoutInterval: 30000,
|
||||
print: function() {}
|
||||
},
|
||||
onPrepare() {
|
||||
require('ts-node').register({
|
||||
project: require('path').join(__dirname, './tsconfig.json')
|
||||
});
|
||||
jasmine.getEnv().addReporter(new SpecReporter({ spec: { displayStacktrace: true } }));
|
||||
}
|
||||
};
|
||||
23
e2e/src/app.e2e-spec.ts
Normal file
23
e2e/src/app.e2e-spec.ts
Normal file
@ -0,0 +1,23 @@
|
||||
import { AppPage } from './app.po';
|
||||
import { browser, logging } from 'protractor';
|
||||
|
||||
describe('workspace-project App', () => {
|
||||
let page: AppPage;
|
||||
|
||||
beforeEach(() => {
|
||||
page = new AppPage();
|
||||
});
|
||||
|
||||
it('should display welcome message', () => {
|
||||
page.navigateTo();
|
||||
expect(page.getTitleText()).toEqual('tele-pd-user app is running!');
|
||||
});
|
||||
|
||||
afterEach(async () => {
|
||||
// Assert that there are no errors emitted from the browser
|
||||
const logs = await browser.manage().logs().get(logging.Type.BROWSER);
|
||||
expect(logs).not.toContain(jasmine.objectContaining({
|
||||
level: logging.Level.SEVERE,
|
||||
} as logging.Entry));
|
||||
});
|
||||
});
|
||||
11
e2e/src/app.po.ts
Normal file
11
e2e/src/app.po.ts
Normal file
@ -0,0 +1,11 @@
|
||||
import { browser, by, element } from 'protractor';
|
||||
|
||||
export class AppPage {
|
||||
navigateTo() {
|
||||
return browser.get(browser.baseUrl) as Promise<any>;
|
||||
}
|
||||
|
||||
getTitleText() {
|
||||
return element(by.css('app-root .content span')).getText() as Promise<string>;
|
||||
}
|
||||
}
|
||||
13
e2e/tsconfig.json
Normal file
13
e2e/tsconfig.json
Normal file
@ -0,0 +1,13 @@
|
||||
{
|
||||
"extends": "../tsconfig.json",
|
||||
"compilerOptions": {
|
||||
"outDir": "../out-tsc/e2e",
|
||||
"module": "commonjs",
|
||||
"target": "es5",
|
||||
"types": [
|
||||
"jasmine",
|
||||
"jasminewd2",
|
||||
"node"
|
||||
]
|
||||
}
|
||||
}
|
||||
32
karma.conf.js
Normal file
32
karma.conf.js
Normal file
@ -0,0 +1,32 @@
|
||||
// Karma configuration file, see link for more information
|
||||
// https://karma-runner.github.io/1.0/config/configuration-file.html
|
||||
|
||||
module.exports = function (config) {
|
||||
config.set({
|
||||
basePath: '',
|
||||
frameworks: ['jasmine', '@angular-devkit/build-angular'],
|
||||
plugins: [
|
||||
require('karma-jasmine'),
|
||||
require('karma-chrome-launcher'),
|
||||
require('karma-jasmine-html-reporter'),
|
||||
require('karma-coverage-istanbul-reporter'),
|
||||
require('@angular-devkit/build-angular/plugins/karma')
|
||||
],
|
||||
client: {
|
||||
clearContext: false // leave Jasmine Spec Runner output visible in browser
|
||||
},
|
||||
coverageIstanbulReporter: {
|
||||
dir: require('path').join(__dirname, './coverage/tele-pd-user'),
|
||||
reports: ['html', 'lcovonly', 'text-summary'],
|
||||
fixWebpackSourcePaths: true
|
||||
},
|
||||
reporters: ['progress', 'kjhtml'],
|
||||
port: 9876,
|
||||
colors: true,
|
||||
logLevel: config.LOG_INFO,
|
||||
autoWatch: true,
|
||||
browsers: ['Chrome'],
|
||||
singleRun: false,
|
||||
restartOnFileChange: true
|
||||
});
|
||||
};
|
||||
14391
package-lock.json
generated
Normal file
14391
package-lock.json
generated
Normal file
File diff suppressed because it is too large
Load Diff
65
package.json
Normal file
65
package.json
Normal file
@ -0,0 +1,65 @@
|
||||
{
|
||||
"name": "tele-pd-user",
|
||||
"version": "0.0.0",
|
||||
"scripts": {
|
||||
"ng": "ng",
|
||||
"start": "ng serve",
|
||||
"build": "ng build",
|
||||
"test": "ng test",
|
||||
"lint": "ng lint",
|
||||
"e2e": "ng e2e"
|
||||
},
|
||||
"private": true,
|
||||
"dependencies": {
|
||||
"@angular/animations": "~9.0.7",
|
||||
"@angular/cdk": "~8.2.3",
|
||||
"@angular/common": "~9.0.7",
|
||||
"@angular/compiler": "~9.0.7",
|
||||
"@angular/core": "~9.0.7",
|
||||
"@angular/flex-layout": "^9.0.0-beta.29",
|
||||
"@angular/forms": "~9.0.7",
|
||||
"@angular/material": "^8.2.3",
|
||||
"@angular/platform-browser": "~9.0.7",
|
||||
"@angular/platform-browser-dynamic": "~9.0.7",
|
||||
"@angular/router": "~9.0.7",
|
||||
"blueimp-canvas-to-blob": "^3.17.0",
|
||||
"cordova-plugin-request-location-accuracy": "^2.3.0",
|
||||
"cordova.plugins.diagnostic": "^5.0.1",
|
||||
"hammerjs": "^2.0.8",
|
||||
"ng2-img-max": "^2.2.4",
|
||||
"ngx-ui-loader": "^9.1.1",
|
||||
"rxjs": "^6.5.4",
|
||||
"rxjs-compat": "^6.5.4",
|
||||
"tslib": "^1.10.0",
|
||||
"watermarkjs": "^2.1.1",
|
||||
"zone.js": "~0.10.2"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@angular-devkit/build-angular": "~0.901.0-next.4",
|
||||
"@angular/cli": "~9.1.0-next.4",
|
||||
"@angular/compiler-cli": "~9.0.7",
|
||||
"@angular/language-service": "~9.0.7",
|
||||
"@babel/compat-data": "^7.8.0",
|
||||
"@babel/preset-env": "^7.8.0",
|
||||
"@types/jasmine": "~3.3.8",
|
||||
"@types/jasminewd2": "~2.0.3",
|
||||
"@types/node": "^12.11.1",
|
||||
"babel-loader": "^8.1.0",
|
||||
"codelyzer": "^5.1.2",
|
||||
"jasmine-core": "~3.4.0",
|
||||
"jasmine-spec-reporter": "~4.2.1",
|
||||
"karma": "~4.1.0",
|
||||
"karma-chrome-launcher": "~2.2.0",
|
||||
"karma-coverage-istanbul-reporter": "~2.0.1",
|
||||
"karma-jasmine": "~2.0.1",
|
||||
"karma-jasmine-html-reporter": "^1.4.0",
|
||||
"npm-force-resolutions": "0.0.3",
|
||||
"protractor": "~5.4.0",
|
||||
"ts-node": "~7.0.0",
|
||||
"tslint": "~5.15.0",
|
||||
"typescript": "~3.6.4"
|
||||
},
|
||||
"resolutions": {
|
||||
"@babel/preset-env": "^7.8.0"
|
||||
}
|
||||
}
|
||||
55
src/app/app-routing.module.ts
Normal file
55
src/app/app-routing.module.ts
Normal file
@ -0,0 +1,55 @@
|
||||
import { NgModule } from '@angular/core';
|
||||
import { Routes, RouterModule } from '@angular/router';
|
||||
import { PdComponent } from './pd/pd.component';
|
||||
import { SalesPdComponent } from './sales-pd/sales-pd.component';
|
||||
import { UrlCheckGuard } from './services/guards/url-check.guard';
|
||||
|
||||
|
||||
const routes: Routes = [
|
||||
{
|
||||
path:'',
|
||||
redirectTo:'error',
|
||||
pathMatch:'full'
|
||||
},
|
||||
{
|
||||
path:'',
|
||||
component:PdComponent,
|
||||
canActivate:[UrlCheckGuard],
|
||||
children:[
|
||||
{
|
||||
path:'pd-images/:randomStr',
|
||||
loadChildren:() => import('./pd/pd.module').then(m => m.PdModule)
|
||||
},
|
||||
{
|
||||
path:'pd-images/:randomStr/:type',
|
||||
loadChildren:() => import('./pd/pd.module').then(m => m.PdModule)
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
path:'',
|
||||
component:SalesPdComponent,
|
||||
canActivate:[UrlCheckGuard],
|
||||
children:[
|
||||
{
|
||||
path:'salespd-images/:pd_id',
|
||||
loadChildren:() => import('./sales-pd/sales-pd.module').then(m => m.SalesPdModule)
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
path: '**',
|
||||
redirectTo: 'session/404'
|
||||
},
|
||||
{
|
||||
path:'error',
|
||||
loadChildren:() => import('./error/error.module').then(m=>m.ErrorModule)
|
||||
}
|
||||
|
||||
];
|
||||
|
||||
@NgModule({
|
||||
imports: [RouterModule.forRoot(routes,{useHash:true})],
|
||||
exports: [RouterModule]
|
||||
})
|
||||
export class AppRoutingModule { }
|
||||
24
src/app/app.component.html
Normal file
24
src/app/app.component.html
Normal file
@ -0,0 +1,24 @@
|
||||
<!-- * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * -->
|
||||
<!-- * * * * * * * * * * * The content below * * * * * * * * * * * -->
|
||||
<!-- * * * * * * * * * * is only a placeholder * * * * * * * * * * -->
|
||||
<!-- * * * * * * * * * * and can be replaced. * * * * * * * * * * * -->
|
||||
<!-- * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * -->
|
||||
<!-- * * * * * * * * * Delete the template below * * * * * * * * * * -->
|
||||
<!-- * * * * * * * to get started with your project! * * * * * * * * -->
|
||||
<!-- * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * -->
|
||||
|
||||
<!-- -->
|
||||
|
||||
<!-- * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * -->
|
||||
<!-- * * * * * * * * * * * The content above * * * * * * * * * * * -->
|
||||
<!-- * * * * * * * * * * is only a placeholder * * * * * * * * * * -->
|
||||
<!-- * * * * * * * * * * and can be replaced. * * * * * * * * * * * -->
|
||||
<!-- * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * -->
|
||||
<!-- * * * * * * * * * * End of Placeholder * * * * * * * * * * * -->
|
||||
<!-- * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * -->
|
||||
|
||||
|
||||
|
||||
<router-outlet></router-outlet>
|
||||
<ngx-ui-loader overlayColor="rgba(40,40,40,0.51)" fgsType="wandering-cubes"
|
||||
fgsSize= "110" overlayColor ="rgba(40,40,40,0.51)" blur = "1" fgsColor = "red" pbColor = "red"></ngx-ui-loader>
|
||||
0
src/app/app.component.scss
Normal file
0
src/app/app.component.scss
Normal file
35
src/app/app.component.spec.ts
Normal file
35
src/app/app.component.spec.ts
Normal file
@ -0,0 +1,35 @@
|
||||
import { TestBed, async } from '@angular/core/testing';
|
||||
import { RouterTestingModule } from '@angular/router/testing';
|
||||
import { AppComponent } from './app.component';
|
||||
|
||||
describe('AppComponent', () => {
|
||||
beforeEach(async(() => {
|
||||
TestBed.configureTestingModule({
|
||||
imports: [
|
||||
RouterTestingModule
|
||||
],
|
||||
declarations: [
|
||||
AppComponent
|
||||
],
|
||||
}).compileComponents();
|
||||
}));
|
||||
|
||||
it('should create the app', () => {
|
||||
const fixture = TestBed.createComponent(AppComponent);
|
||||
const app = fixture.debugElement.componentInstance;
|
||||
expect(app).toBeTruthy();
|
||||
});
|
||||
|
||||
it(`should have as title 'tele-pd-user'`, () => {
|
||||
const fixture = TestBed.createComponent(AppComponent);
|
||||
const app = fixture.debugElement.componentInstance;
|
||||
expect(app.title).toEqual('tele-pd-user');
|
||||
});
|
||||
|
||||
it('should render title', () => {
|
||||
const fixture = TestBed.createComponent(AppComponent);
|
||||
fixture.detectChanges();
|
||||
const compiled = fixture.debugElement.nativeElement;
|
||||
expect(compiled.querySelector('.content span').textContent).toContain('tele-pd-user app is running!');
|
||||
});
|
||||
});
|
||||
20
src/app/app.component.ts
Normal file
20
src/app/app.component.ts
Normal file
@ -0,0 +1,20 @@
|
||||
import { Component } from '@angular/core';
|
||||
import { NgxUiLoaderService } from 'ngx-ui-loader';
|
||||
|
||||
@Component({
|
||||
selector: 'app-root',
|
||||
templateUrl: './app.component.html',
|
||||
styleUrls: ['./app.component.scss']
|
||||
})
|
||||
export class AppComponent {
|
||||
title = 'tele-pd-user';
|
||||
constructor(private ngxService:NgxUiLoaderService){
|
||||
// console.log("dssssssssssss")
|
||||
// this.ngxService.start(); // start foreground spinner of the master loader with 'default' taskId
|
||||
// // Stop the foreground loading after 5s
|
||||
// setTimeout(() => {
|
||||
// this.ngxService.stop(); // stop foreground spinner of the master loader with 'default' taskId
|
||||
// }, 5000);
|
||||
}
|
||||
}
|
||||
|
||||
32
src/app/app.module.ts
Normal file
32
src/app/app.module.ts
Normal file
@ -0,0 +1,32 @@
|
||||
import { BrowserModule } from '@angular/platform-browser';
|
||||
import { NgModule } from '@angular/core';
|
||||
|
||||
import { AppRoutingModule } from './app-routing.module';
|
||||
import { AppComponent } from './app.component';
|
||||
import { PdComponent } from './pd/pd.component';
|
||||
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
|
||||
import { MaterialModule } from './pd/shared/material/material.module';
|
||||
import { FlexLayoutModule } from "@angular/flex-layout";
|
||||
import { HttpClientModule } from '@angular/common/http';
|
||||
import { NgxUiLoaderModule } from 'ngx-ui-loader';
|
||||
import { SalesPdComponent } from './sales-pd/sales-pd.component';
|
||||
|
||||
@NgModule({
|
||||
declarations: [
|
||||
AppComponent,
|
||||
PdComponent,
|
||||
SalesPdComponent
|
||||
],
|
||||
imports: [
|
||||
BrowserModule,
|
||||
AppRoutingModule,
|
||||
BrowserAnimationsModule,
|
||||
MaterialModule,
|
||||
FlexLayoutModule,
|
||||
HttpClientModule,
|
||||
NgxUiLoaderModule
|
||||
],
|
||||
providers: [],
|
||||
bootstrap: [AppComponent]
|
||||
})
|
||||
export class AppModule { }
|
||||
22
src/app/error/404/error-404-component.html
Executable file
22
src/app/error/404/error-404-component.html
Executable file
@ -0,0 +1,22 @@
|
||||
<div class="relative">
|
||||
<div class="form-bg">
|
||||
|
||||
|
||||
<h3 class="page-title"><img src="../../../assets/images/PD.jpeg" style="height: 50px;;"> <span> PD Genie </span>
|
||||
</h3>
|
||||
|
||||
<div class="relative error-wrapper">
|
||||
<h1>
|
||||
Oops!</h1>
|
||||
<span class="error-text">{{errorMsgObject.title}}</span>
|
||||
<h2>
|
||||
{{errorMsgObject.subtitle}}</h2>
|
||||
<div class="error-details">
|
||||
<p>{{errorMsgObject.message}}</p>
|
||||
</div>
|
||||
<div class="error-actions" *ngIf="errorMsgObject.is_homebtn">
|
||||
<button class="mat-blue" mat-raised-button (click)="takeMeToHome()">Take me to Home</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
9
src/app/error/404/error-404-component.scss
Executable file
9
src/app/error/404/error-404-component.scss
Executable file
@ -0,0 +1,9 @@
|
||||
.form-bg {
|
||||
//background-image:url('http://www.ssa.sineedge.com/beta/assets/images/login.jpg') !important;
|
||||
//background-image: url(../../../assets/images/login_o.jpg);
|
||||
//background-color: #F44336;
|
||||
background: url(../../../assets/images/bg.png) repeat-x 0 0 #ffffff;
|
||||
height: 100vh !important;
|
||||
background-position: center !important;
|
||||
// min-height: calc(90vh + 90px) !important;
|
||||
}
|
||||
34
src/app/error/404/error-404.component.ts
Executable file
34
src/app/error/404/error-404.component.ts
Executable file
@ -0,0 +1,34 @@
|
||||
import { Component, OnInit,ViewEncapsulation } from '@angular/core';
|
||||
import { Router } from '@angular/router';
|
||||
import { DataServiceService, errorMsgInterface } from 'src/app/services/data-service/data-service.service';
|
||||
|
||||
@Component({
|
||||
selector: 'ms-error-404',
|
||||
templateUrl:'./error-404-component.html',
|
||||
styleUrls: ['./error-404-component.scss'],
|
||||
encapsulation: ViewEncapsulation.None
|
||||
})
|
||||
export class ErrorOneComponent implements OnInit {
|
||||
errorMsgObject:errorMsgInterface
|
||||
constructor(private router: Router,private dataService:DataServiceService) {}
|
||||
|
||||
ngOnInit() {
|
||||
// this.errorMsgObject ={
|
||||
// title:"404",
|
||||
// subtitle:'Not Found',
|
||||
// message:'The requested URL is not found on the server',
|
||||
// is_homebtn:false
|
||||
// }
|
||||
this.errorMsgObject = this.dataService.errorMsg
|
||||
|
||||
console.log(this.errorMsgObject);
|
||||
}
|
||||
|
||||
takeMeToHome() {
|
||||
this.router.navigate(['/home']);
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
23
src/app/error/503/error-503-component.html
Executable file
23
src/app/error/503/error-503-component.html
Executable file
@ -0,0 +1,23 @@
|
||||
<div class="relative">
|
||||
<div class="form-bg">
|
||||
<div fxLayout="row" fxLayoutAlign="center" class="pt-2">
|
||||
<!-- <p>SINEEDGE Login Details</p> -->
|
||||
<h3 class="page-title"><img src="../../../assets/images/PD.jpeg" style="height: 50px;;"> <span> PD Genie </span>
|
||||
</h3>
|
||||
</div>
|
||||
|
||||
<div class="relative error-wrapper">
|
||||
<h1>
|
||||
Error!</h1>
|
||||
<span class="error-text">505</span>
|
||||
<h2>
|
||||
Service is currently unavailbale</h2>
|
||||
<div class="error-details">
|
||||
<p>Sorry, but the page you were trying to view does not exist</p>
|
||||
</div>
|
||||
<div class="error-actions">
|
||||
<button class="mat-blue" mat-raised-button (click)="takeMeToHome()">Take me to Home</button>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
9
src/app/error/503/error-503-component.scss
Executable file
9
src/app/error/503/error-503-component.scss
Executable file
@ -0,0 +1,9 @@
|
||||
.form-bg {
|
||||
//background-image:url('http://www.ssa.sineedge.com/beta/assets/images/login.jpg') !important;
|
||||
//background-image: url(../../../assets/images/login_o.jpg);
|
||||
//background-color: #F44336;
|
||||
background: url(../../../assets/images/bg.png) repeat-x 0 0 #ffffff;
|
||||
height: 100vh !important;
|
||||
background-position: center !important;
|
||||
// min-height: calc(90vh + 90px) !important;
|
||||
}
|
||||
23
src/app/error/503/error-503.component.ts
Executable file
23
src/app/error/503/error-503.component.ts
Executable file
@ -0,0 +1,23 @@
|
||||
import { Component, OnInit,ViewEncapsulation } from '@angular/core';
|
||||
import { Router } from '@angular/router';
|
||||
|
||||
@Component({
|
||||
selector: 'ms-error-503',
|
||||
templateUrl:'./error-503-component.html',
|
||||
styleUrls: ['./error-503-component.scss'],
|
||||
encapsulation: ViewEncapsulation.None
|
||||
})
|
||||
export class ErrorTwoComponent implements OnInit {
|
||||
|
||||
constructor(private router: Router) {}
|
||||
|
||||
ngOnInit() {
|
||||
|
||||
}
|
||||
|
||||
takeMeToHome() {
|
||||
this.router.navigate(['/home']);
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
38
src/app/error/error.module.ts
Executable file
38
src/app/error/error.module.ts
Executable file
@ -0,0 +1,38 @@
|
||||
import { NgModule } from '@angular/core';
|
||||
import { RouterModule } from '@angular/router';
|
||||
import { CommonModule } from '@angular/common';
|
||||
import { FormsModule } from '@angular/forms';
|
||||
import { MatIconModule} from '@angular/material';
|
||||
import {
|
||||
MatCardModule,
|
||||
MatInputModule,
|
||||
MatRadioModule,
|
||||
MatButtonModule,
|
||||
MatProgressBarModule,
|
||||
MatToolbarModule } from '@angular/material';
|
||||
import { ErrorOneComponent} from './404/error-404.component';
|
||||
import { ErrorTwoComponent} from './503/error-503.component';
|
||||
|
||||
import { ErrorRoutes } from './error.routing';
|
||||
|
||||
@NgModule({
|
||||
imports: [
|
||||
CommonModule,
|
||||
FormsModule,
|
||||
MatIconModule,
|
||||
MatCardModule,
|
||||
MatIconModule,
|
||||
MatInputModule,
|
||||
MatRadioModule,
|
||||
MatButtonModule,
|
||||
MatProgressBarModule,
|
||||
MatToolbarModule,
|
||||
RouterModule.forChild(ErrorRoutes)
|
||||
],
|
||||
declarations: [
|
||||
ErrorOneComponent,
|
||||
ErrorTwoComponent,
|
||||
]
|
||||
})
|
||||
|
||||
export class ErrorModule {}
|
||||
19
src/app/error/error.routing.ts
Executable file
19
src/app/error/error.routing.ts
Executable file
@ -0,0 +1,19 @@
|
||||
import { Routes } from '@angular/router';
|
||||
|
||||
import { ErrorOneComponent} from './404/error-404.component';
|
||||
import { ErrorTwoComponent} from './503/error-503.component';
|
||||
|
||||
export const ErrorRoutes: Routes = [{
|
||||
path: '',
|
||||
redirectTo: '404',
|
||||
pathMatch: 'full',
|
||||
},{
|
||||
path: '',
|
||||
children: [{
|
||||
path: '404',
|
||||
component: ErrorOneComponent
|
||||
}, {
|
||||
path: '503',
|
||||
component: ErrorTwoComponent
|
||||
}]
|
||||
}];
|
||||
179
src/app/pd/img-recapture/img-recapture.component.html
Normal file
179
src/app/pd/img-recapture/img-recapture.component.html
Normal file
@ -0,0 +1,179 @@
|
||||
<!-- <input type="file" accept="image/*" capture="environment"> -->
|
||||
<mat-card>
|
||||
<div fxLayout="row">
|
||||
<span fxLayout="column" fxFlex="85" fxFlex.xs = "70" fxLayoutAlign="flex-start" >
|
||||
<mat-card-header >
|
||||
<mat-card-title><h5>Images to be Re-Captured</h5></mat-card-title>
|
||||
</mat-card-header>
|
||||
</span>
|
||||
<!-- <div fxLayout="column" fxFlex="15" fxFlex.xs = "30" fxLayoutAlign="flex-end" >
|
||||
<button mat-button mat-raised-button class="mr-1 mb-1" color="primary" (click)="openVideoChat()">
|
||||
<mat-icon>videocam</mat-icon>
|
||||
<strong>Call</strong>
|
||||
</button>
|
||||
</div> -->
|
||||
</div>
|
||||
<!-- </span> -->
|
||||
<mat-card-content>
|
||||
<div fxLayout="row wrap" fxLayoutAlign="start stretch" fxLayoutAlign.xs="space-between stretch" fxLayoutGap="28px" fxLayoutGap.xs="15px" style="flex-wrap: wrap">
|
||||
<!-- {{records.img_data | json}} -->
|
||||
<div *ngFor="let val of imageData;let i = index" [ngStyle]="{'flex-basis': val.is_multiple == 1 ? '100%' : ''}" >
|
||||
<!-- {{val.is_multiple}} -->
|
||||
<div *ngIf="(!val.hasOwnProperty('is_multiple')) || (val.hasOwnProperty('is_multiple') && val.is_multiple == '0')" style="flex-basis: 100%" class ="image-div" fxLayout="row" fxLayoutAlign.xs="start stretch" fxLayoutGap="8px" fxLayoutGap.xs="15px">
|
||||
<div fxLayout="column">
|
||||
<img *ngIf="val.img_url != '' && val.img_url != null"
|
||||
class="image-class" [src]="val.img_url" [alt]="val.img_key" alt="image" (click)="openImage(val,1)">
|
||||
<div class="dummy-img" *ngIf="val.img_url == '' || val.img_url == null">
|
||||
<p
|
||||
style="justify-content: center;align-content: center;text-align: center;align-items: center; margin-top: 10%;">
|
||||
<span>
|
||||
Image is Required.
|
||||
|
||||
</span>
|
||||
<!-- Capture >> <mat-icon>camera</mat-icon> -->
|
||||
</p>
|
||||
</div>
|
||||
<div class="image-label" fxLayout ="row" >
|
||||
<p fxFlex="60" >{{val.img_name || val.img_key}} - OLD </p>
|
||||
<!-- <span *ngIf="val.is_loader == true" fxFlex="20">
|
||||
|
||||
<img src="../../../assets/spinner/spinner.svg" alt="spinner"/>
|
||||
</span>
|
||||
<span *ngIf="val.is_saved == true && val.img_url != '' && val.img_url != null" fxFlex = "20" fxLayoutAlign="flex-end">
|
||||
<mat-icon style="color:green;font-size: 20px;">done</mat-icon>
|
||||
</span>
|
||||
<span *ngIf="val.is_saved == false && val.is_loader == false" fxFlex = "20" fxLayoutAlign="flex-end">
|
||||
<mat-icon style="color:rgb(255, 196, 0);font-size: 25px;">cloud_upload</mat-icon><br/>
|
||||
|
||||
</span> -->
|
||||
|
||||
<!-- <div> -->
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<!-- </div> -->
|
||||
|
||||
|
||||
<div fxLayout="column">
|
||||
<img *ngIf="val.img_url_new != '' && val.img_url_new != null"
|
||||
class="image-class" [src]="val.img_url_new" [alt]="val.img_key" alt="image" (click)="openImage(val,2)">
|
||||
<div class="dummy-img" *ngIf="(!val.hasOwnProperty('img_url_new')) || (val.img_url_new == '' || val.img_url_new == null)" >
|
||||
<p
|
||||
style="justify-content: center;align-content: center;text-align: center;align-items: center; margin-top: 10%;">
|
||||
<span>
|
||||
Image is not Captured.<br /> Click to
|
||||
</span>Capture <mat-icon>camera</mat-icon>
|
||||
</p>
|
||||
</div>
|
||||
<div class="image-label" fxLayout ="row" >
|
||||
<p fxFlex="60" >{{val.img_name || val.img_key}} - NEW </p>
|
||||
<!-- <span *ngIf="val.is_loader == true" fxFlex="20">
|
||||
|
||||
<img src="../../../assets/spinner/spinner.svg" alt="spinner"/>
|
||||
</span>
|
||||
<span *ngIf="val.is_saved == true && val.img_url != '' && val.img_url != null" fxFlex = "20" fxLayoutAlign="flex-end">
|
||||
<mat-icon style="color:green;font-size: 20px;">done</mat-icon>
|
||||
</span>
|
||||
<span *ngIf="val.is_saved == false && val.is_loader == false" fxFlex = "20" fxLayoutAlign="flex-end">
|
||||
<mat-icon style="color:rgb(255, 196, 0);font-size: 25px;">cloud_upload</mat-icon><br/>
|
||||
|
||||
</span> -->
|
||||
|
||||
<!-- <div> -->
|
||||
|
||||
</div>
|
||||
<span (click)="getIndex(i)">
|
||||
<app-capture-btn class="file-btn" (imageDataEmitter)="addImage($event,i)"></app-capture-btn>
|
||||
</span>
|
||||
</div>
|
||||
<!-- <div class="borderClass">
|
||||
</div> -->
|
||||
</div>
|
||||
|
||||
|
||||
<!-- <div *ngIf="val.is_multiple == 1" style="flex-basis: 100%;">
|
||||
<br/> <br/>
|
||||
<hr />
|
||||
<h5>{{val.img_name}}</h5>
|
||||
<div fxLayout="row wrap" fxLayoutAlign="start stretch" fxLayoutAlign.xs="space-between stretch">
|
||||
<div *ngFor="let multiple_img of val.img_data;let i=index" class ="image-div">
|
||||
<img *ngIf="multiple_img.img_url != '' && multiple_img.img_url != null"
|
||||
class="image-class" [src]="multiple_img.img_url" [alt]="val.img_key" alt="image" (click)="openImage(multiple_img)"/>
|
||||
|
||||
<div class="image-label" fxLayout ="row" >
|
||||
<p fxFlex="60">{{val.img_name}} {{i+1}} </p>
|
||||
<span *ngIf="multiple_img.is_loader == true" fxFlex="20">
|
||||
<img src="../../../assets/spinner/spinner.svg" alt="spinner"/>
|
||||
</span>
|
||||
<span *ngIf="multiple_img.is_saved == true && multiple_img.img_url != '' && multiple_img.img_url != null" fxLayoutAlign="flex-end">
|
||||
<mat-icon style="color:green;font-size: 20px;">done</mat-icon>
|
||||
</span>
|
||||
<span *ngIf="multiple_img.is_saved == false && multiple_img.is_loader == false" fxLayoutAlign="flex-end">
|
||||
<mat-icon style="color:rgb(255, 196, 0);font-size: 25px;">cloud_upload</mat-icon><br/>
|
||||
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div style="margin-right: -20px !important;padding:0!important;">
|
||||
<div class="dummy-img" style="margin: 30px 0 0 4px;
|
||||
padding: 1.4%;">
|
||||
<p
|
||||
style="justify-content: center;align-content: center;text-align: center;align-items: center; ">
|
||||
<span>
|
||||
Add More Image.<br /> Click to
|
||||
</span>Capture <mat-icon>add_a_photo</mat-icon>
|
||||
</p>
|
||||
</div>
|
||||
<div class="image-label" fxLayout ="column" >
|
||||
<p fxFlex="80">Add More {{val.img_name}} </p>
|
||||
</div>
|
||||
<span (click)="getIndex(i)">
|
||||
<app-capture-btn class="file-btn" addMoreBtn="true" (imageDataEmitter)="addImage($event,i)"></app-capture-btn>
|
||||
</span>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<br/> <br/>
|
||||
<hr *ngIf="imageData[i+1] && imageData[i+1].is_multiple != 1"/>
|
||||
</div> -->
|
||||
|
||||
|
||||
</div>
|
||||
<!-- <div style="padding: 1.5%;margin-top: 10px;" fxLayoutAlign.xs="flex-start stretch" >
|
||||
<div style="height: auto">
|
||||
<div class="dummy-img-more" #dummy_img_more>
|
||||
<p
|
||||
style="justify-content: center;align-content: center;text-align: center;align-items: center; margin-top: 10%;">
|
||||
<span>
|
||||
|
||||
Click to
|
||||
</span>Capture More..<mat-icon>add_a_photo</mat-icon>
|
||||
</p>
|
||||
|
||||
</div>
|
||||
<div class="image-label" fxLayout ="column" >
|
||||
<p fxFlex="60">Capture More</p>
|
||||
</div>
|
||||
<span (click)="getIndex('last')">
|
||||
<app-capture-btn class="file-btn" addMoreBtn="true" (imageDataEmitter)="addImage($event,'last')"></app-capture-btn>
|
||||
</span>
|
||||
</div>
|
||||
</div> -->
|
||||
<!-- <div >
|
||||
<img class="image-class" [src]="imageData"
|
||||
alt="image"><br/>
|
||||
<app-capture-btn class="file-btn" (imageDataEmitter)="addImage($event)"></app-capture-btn>
|
||||
</div>
|
||||
<div >
|
||||
<div class="dummy-img">
|
||||
<p style="justify-content: center;align-content: center;text-align: center;align-items: center; margin-top: 10%;"><span>
|
||||
Image is not Captured.<br/>
|
||||
</span>Capture <mat-icon >camera</mat-icon></p>
|
||||
</div>
|
||||
<button style="justify-content:center" mat-button mat-raised-button>Capture <mat-icon name="camera">camera</mat-icon></button>
|
||||
</div> -->
|
||||
</div>
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
|
||||
<!-- <input type="file" id="input-file" name="file" accept="image/*" capture="user"> -->
|
||||
129
src/app/pd/img-recapture/img-recapture.component.scss
Normal file
129
src/app/pd/img-recapture/img-recapture.component.scss
Normal file
@ -0,0 +1,129 @@
|
||||
// .custom-file-input::-webkit-file-upload-button {
|
||||
// visibility: hidden;
|
||||
// }
|
||||
// .custom-file-input::before {
|
||||
// content: 'Select some files';
|
||||
// display: inline-block;
|
||||
// background: linear-gradient(top, #f9f9f9, #e3e3e3);
|
||||
// border: 1px solid #999;
|
||||
// border-radius: 3px;
|
||||
// padding: 5px 8px;
|
||||
// outline: none;
|
||||
// white-space: nowrap;
|
||||
// -webkit-user-select: none;
|
||||
// cursor: pointer;
|
||||
// text-shadow: 1px 1px #fff;
|
||||
// font-weight: 700;
|
||||
// font-size: 10pt;
|
||||
// color:black;
|
||||
// // width: 20px;
|
||||
// }
|
||||
// .custom-file-input:hover::before {
|
||||
// border-color: black;
|
||||
// }
|
||||
// .custom-file-input:active::before {
|
||||
// background: -webkit-linear-gradient(top, #e3e3e3, #f9f9f9);
|
||||
// }
|
||||
// input[type='file'] {
|
||||
// // opacity:0
|
||||
// color: transparent;
|
||||
// width: 130px;
|
||||
// }
|
||||
.image-class{
|
||||
width: 170px;
|
||||
height: 200px;
|
||||
border: 1px solid lavender;
|
||||
border-radius: 7px;
|
||||
|
||||
}
|
||||
.image-div {
|
||||
// border:3px solid red;
|
||||
padding: 10px;
|
||||
border-right: 2px solid #cc161652;
|
||||
border-bottom: 2px solid #cc161652;
|
||||
border-bottom-right-radius: 12px;
|
||||
max-width: 100%;
|
||||
// width: auto;
|
||||
min-width: 170px;
|
||||
// height: 200px;
|
||||
margin-top: 25px;
|
||||
// padding: 1.4%;
|
||||
}
|
||||
.image-class:hover {
|
||||
-webkit-transform: scale(1.1);
|
||||
-ms-transform: scale(1.1);
|
||||
transform: scale(1.1);
|
||||
}
|
||||
.dummy-img {
|
||||
width: 170px;
|
||||
height: 200px;
|
||||
border: 3px dashed rgba(0, 0, 0, 0.2);
|
||||
border-radius: 7px;
|
||||
background: #eeee;
|
||||
color: gray;
|
||||
}
|
||||
.dummy-img-more{
|
||||
width: 170px;
|
||||
height: 200px;
|
||||
margin-top: 20px;
|
||||
border: 4px dashed #03a9f470;
|
||||
border-radius: 7px;
|
||||
box-shadow : 0px 3px 6px 3px rgba(160, 161, 188, 0.53);
|
||||
background: #eeee;
|
||||
color: #b53f3f;
|
||||
}
|
||||
.file-btn{
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
@media (max-width: 600px){
|
||||
.image-class {
|
||||
width: 125px;
|
||||
height: 120px;
|
||||
}
|
||||
.image-div {
|
||||
// width:auto;
|
||||
min-width: 125px;
|
||||
max-width: 100%;
|
||||
// height: 120px;
|
||||
}
|
||||
.dummy-img {
|
||||
width: 125px;
|
||||
height: 120px;
|
||||
}
|
||||
.dummy-img-more{
|
||||
width: 125px;
|
||||
height: 120px;
|
||||
}
|
||||
.image-label {
|
||||
min-height: 58px;
|
||||
min-width: 100% !important;
|
||||
max-width: 67% !important;
|
||||
|
||||
}
|
||||
}
|
||||
.borderClass {
|
||||
border-right: 5px solid red
|
||||
}
|
||||
.image-label {
|
||||
min-height: 58px;
|
||||
width: auto;
|
||||
// max-width: 67%;
|
||||
p{
|
||||
// margin: 7px;
|
||||
font-weight: bold;
|
||||
font-size : 14px;
|
||||
max-width: 70%!important;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
}
|
||||
.object {
|
||||
/* width: 110px; */
|
||||
height: 45px;
|
||||
}
|
||||
hr {
|
||||
background: #d23f2f;
|
||||
padding: 0.03em;
|
||||
margin: -2px;
|
||||
}
|
||||
25
src/app/pd/img-recapture/img-recapture.component.spec.ts
Normal file
25
src/app/pd/img-recapture/img-recapture.component.spec.ts
Normal file
@ -0,0 +1,25 @@
|
||||
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { ImgRecaptureComponent } from './img-recapture.component';
|
||||
|
||||
describe('ImgRecaptureComponent', () => {
|
||||
let component: ImgRecaptureComponent;
|
||||
let fixture: ComponentFixture<ImgRecaptureComponent>;
|
||||
|
||||
beforeEach(async(() => {
|
||||
TestBed.configureTestingModule({
|
||||
declarations: [ ImgRecaptureComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
}));
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(ImgRecaptureComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
302
src/app/pd/img-recapture/img-recapture.component.ts
Normal file
302
src/app/pd/img-recapture/img-recapture.component.ts
Normal file
@ -0,0 +1,302 @@
|
||||
import { Component, OnInit, ViewChild, ElementRef } from '@angular/core';
|
||||
import { CameraService } from 'src/app/services/camera.service';
|
||||
import { ApiServiceService } from 'src/app/services/api-service/api-service.service';
|
||||
import { ActivatedRoute, Router } from '@angular/router';
|
||||
import { DataServiceService } from 'src/app/services/data-service/data-service.service';
|
||||
import { NgxUiLoaderService } from 'ngx-ui-loader';
|
||||
|
||||
@Component({
|
||||
selector: 'app-img-recapture',
|
||||
templateUrl: './img-recapture.component.html',
|
||||
styleUrls: ['./img-recapture.component.scss']
|
||||
})
|
||||
export class ImgRecaptureComponent implements OnInit {
|
||||
|
||||
imageData: any;
|
||||
records:any
|
||||
// `[
|
||||
// {
|
||||
// "img_key": "selfie_with_person_met",
|
||||
// "img_name": "Person met",
|
||||
// "fk_form_id": "18",
|
||||
// "img_url": "https://test-lender16.s3.ap-south-1.amazonaws.com/pd1779/h01tk2020-07-20-18-06-20.jpeg?X-Amz-Content-Sha256=UNSIGNED-PAYLOAD&X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Credential=AKIAR7TQUR2J6HFMHQ4P%2F20200723%2Fap-south-1%2Fs3%2Faws4_request&X-Amz-Date=20200723T132749Z&X-Amz-SignedHeaders=host&X-Amz-Expires=432000&X-Amz-Signature=294c7f0422f58c06774b7eb12686e2ad3d8a8f7141eaebcaea0d93da5b39df68",
|
||||
// "is_multiple": 0,
|
||||
// "pd_document_id": "8756",
|
||||
// "is_loader": false,
|
||||
// "is_saved": true
|
||||
// },
|
||||
// {
|
||||
// "img_key": "name_board_seen",
|
||||
// "img_name": "Name Board Seen",
|
||||
// "img_url": "https://test-lender16.s3.ap-south-1.amazonaws.com/pd1779/dc2VY2020-07-20-20-09-30.jpeg?X-Amz-Content-Sha256=UNSIGNED-PAYLOAD&X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Credential=AKIAR7TQUR2J6HFMHQ4P%2F20200723%2Fap-south-1%2Fs3%2Faws4_request&X-Amz-Date=20200723T132749Z&X-Amz-SignedHeaders=host&X-Amz-Expires=432000&X-Amz-Signature=6e9a46b1b7decd51ca72a9cfb9a0400295ad63df6aca9899a73e3c29c84783fc",
|
||||
// "fk_form_id": "13",
|
||||
// "is_multiple": 0,
|
||||
// "pd_document_id": "8758",
|
||||
// "is_loader": false,
|
||||
// "is_saved": true
|
||||
// },
|
||||
// {
|
||||
// "img_key": "machinary_image",
|
||||
// "img_name": "Machinery Image",
|
||||
// "fk_form_id": "22",
|
||||
// "is_multiple": 0,
|
||||
// "img_url": "",
|
||||
// "is_loader": false,
|
||||
// "is_saved": true,
|
||||
// "pd_document_id": "machinary_image"
|
||||
// },
|
||||
// {
|
||||
// "img_key": "gst_Regn_cert_pic",
|
||||
// "img_name": "GST Regn Cert",
|
||||
// "img_url": "https://test-lender16.s3.ap-south-1.amazonaws.com/pd1779/1zJV82020-07-20-20-29-06.jpeg?X-Amz-Content-Sha256=UNSIGNED-PAYLOAD&X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Credential=AKIAR7TQUR2J6HFMHQ4P%2F20200723%2Fap-south-1%2Fs3%2Faws4_request&X-Amz-Date=20200723T132749Z&X-Amz-SignedHeaders=host&X-Amz-Expires=432000&X-Amz-Signature=996bd27a1989c01d2e0b11092db1674509537bafbd599ff7acdecc5b96e56cd7",
|
||||
// "fk_form_id": "13",
|
||||
// "is_multiple": 0,
|
||||
// "pd_document_id": "8760",
|
||||
// "is_loader": false,
|
||||
// "is_saved": true
|
||||
// },
|
||||
// {
|
||||
// "img_url": "https://test-lender16.s3.ap-south-1.amazonaws.com/pd1779/4SEzm2020-07-20-16-34-46.jpeg?X-Amz-Content-Sha256=UNSIGNED-PAYLOAD&X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Credential=AKIAR7TQUR2J6HFMHQ4P%2F20200723%2Fap-south-1%2Fs3%2Faws4_request&X-Amz-Date=20200723T132749Z&X-Amz-SignedHeaders=host&X-Amz-Expires=432000&X-Amz-Signature=be38e6fe6c43e632c3fafdd3eb5c75839cb2f15bae0fa796c64d0db044e8fa8d",
|
||||
// "img_name": "client_image",
|
||||
// "pd_document_id": "8731"
|
||||
// },
|
||||
// {
|
||||
// "img_url": "https://test-lender16.s3.ap-south-1.amazonaws.com/pd1779/fqoIA2020-07-20-16-37-39.jpeg?X-Amz-Content-Sha256=UNSIGNED-PAYLOAD&X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Credential=AKIAR7TQUR2J6HFMHQ4P%2F20200723%2Fap-south-1%2Fs3%2Faws4_request&X-Amz-Date=20200723T132749Z&X-Amz-SignedHeaders=host&X-Amz-Expires=432000&X-Amz-Signature=3d6cb2280c1abc941d3fb908b75f5b25ac80c968565225dd57b8a35151c20d90",
|
||||
// "img_name": "client_image",
|
||||
// "pd_document_id": "8732"
|
||||
// },
|
||||
// {
|
||||
// "img_key": "common_image",
|
||||
// "img_name": "sample Post 2",
|
||||
// "img_url": "https://test-lender16.s3.ap-south-1.amazonaws.com/pd1779/dKazP2020-07-20-16-26-21.jpeg?X-Amz-Content-Sha256=UNSIGNED-PAYLOAD&X-Amz-Algorithm=AWS4-HMAC-SHA256&X-Amz-Credential=AKIAR7TQUR2J6HFMHQ4P%2F20200723%2Fap-south-1%2Fs3%2Faws4_request&X-Amz-Date=20200723T132749Z&X-Amz-SignedHeaders=host&X-Amz-Expires=432000&X-Amz-Signature=2236edd8a14526d4077f6154cfeac2499469b1633c6578744570686e1df9648f",
|
||||
// "fk_form_id": null,
|
||||
// "pd_document_id": "8729",
|
||||
// "is_loader": false,
|
||||
// "is_saved": true
|
||||
// }
|
||||
// ]`
|
||||
current_index: any;
|
||||
@ViewChild('dummy_img_more') dummyImgMoreRef:ElementRef
|
||||
constructor(private cameraService:CameraService,private apiService:ApiServiceService,
|
||||
private dataService:DataServiceService, private actRoute:ActivatedRoute,private router:Router,
|
||||
private ngxService:NgxUiLoaderService) { }
|
||||
|
||||
ngOnInit() {
|
||||
// this.records = JSON.parse(this.records)
|
||||
// console.log(this.records);
|
||||
// // this.records =this.records.records.img_data;
|
||||
// // this.records = this.dataService.getPDImageData.img_data
|
||||
// this.imageData = this.records
|
||||
|
||||
console.log(this.records)
|
||||
console.log(typeof(this.records))
|
||||
// console.log();
|
||||
console.log(this.actRoute.snapshot.paramMap.getAll('randomStr'))
|
||||
this.getPDImageDetails();
|
||||
}
|
||||
getPDImageDetails() {
|
||||
this.ngxService.start();
|
||||
let randomStr = this.actRoute.snapshot.paramMap.get('randomStr')
|
||||
let params = {"pd_id":"","random_string":randomStr}
|
||||
this.apiService.getAuditedImages(params).subscribe(result=>{
|
||||
if(result.dataStatus) {
|
||||
this.records = result.records
|
||||
if(this.records.is_cus_link_disabled != '1') {
|
||||
this.imageData =this.records.img_data;
|
||||
this.imageData.forEach(val=>{
|
||||
val.is_loader = false
|
||||
val.is_saved = true
|
||||
})
|
||||
}
|
||||
else{
|
||||
let msgObj ={title:'',subtitle:'Link is Disabled',is_homebtn:false,message:'The requested url is Disabled. Please contact info@pdgenie.com'}
|
||||
this.goToErrorComponent(msgObj)
|
||||
}
|
||||
}
|
||||
else{
|
||||
let msgObj ={title:'',subtitle:result.msg?result.msg : 'Invalid Link',is_homebtn:false,message:'The requested url is Invalid. Please contact info@pdgenie.com'}
|
||||
this.goToErrorComponent(msgObj)
|
||||
}
|
||||
this.ngxService.stop();
|
||||
},err=>{
|
||||
this.ngxService.stop();
|
||||
let msgObj ={title:'404',subtitle:'Not Found',is_homebtn:false,message:'The requested url returns 404. Please check your internet connection'}
|
||||
this.goToErrorComponent(msgObj)
|
||||
})
|
||||
}
|
||||
goToErrorComponent(msgObj) {
|
||||
this.dataService.setErrorMsg({title:msgObj.title,subtitle:msgObj.subtitle,is_homebtn:false,message:msgObj.message})
|
||||
this.router.navigateByUrl('error');
|
||||
}
|
||||
addImage(event,index){
|
||||
this.ngxService.start();
|
||||
console.log(event,index);
|
||||
var reader = new FileReader();
|
||||
// let imagePath = event;
|
||||
reader.readAsDataURL(event);
|
||||
reader.onload = (_event) => {
|
||||
// this.imageData = reader.result;
|
||||
this.cameraService.getPosition().then(geoCords=>{
|
||||
let geoCoordinates
|
||||
if(geoCords != 'error') {
|
||||
geoCoordinates = geoCords
|
||||
}
|
||||
else {
|
||||
geoCoordinates = null;
|
||||
}
|
||||
console.log(geoCords);
|
||||
this.cameraService.addWatermarks(reader.result,geoCoordinates).then(watermarked_img=>{
|
||||
if(this.current_index != 'last') {
|
||||
if(this.imageData[this.current_index].is_multiple == 1) {
|
||||
console.log("multi");
|
||||
let img_param={img_url:watermarked_img,is_base64:true,link:geoCoordinates}
|
||||
this.imageData[this.current_index].img_data.push(img_param)
|
||||
this.sendImage(this.imageData,this.imageData[this.current_index].img_data.length-1)
|
||||
}
|
||||
else {
|
||||
this.imageData[this.current_index].img_url_new = watermarked_img;
|
||||
this.imageData[this.current_index].is_base64 = true;
|
||||
this.imageData[this.current_index].link = geoCoordinates
|
||||
this.sendImage(this.imageData)
|
||||
}
|
||||
}
|
||||
else{
|
||||
this.getImageName().then(result=>{
|
||||
console.log(result);
|
||||
this.imageData.push( {
|
||||
"img_key": "common_image",
|
||||
"img_name": result,
|
||||
"img_url": watermarked_img,
|
||||
"fk_form_id": "",
|
||||
"is_base64":true,
|
||||
"link":geoCoordinates
|
||||
})
|
||||
// let el = document.getElementById('dummy-img-more');
|
||||
// el.scrollIntoView();
|
||||
setTimeout(()=>{
|
||||
this.dummyImgMoreRef.nativeElement.scrollIntoView({behavior:"smooth",block:"end"})
|
||||
},1000)
|
||||
this.sendImage(this.imageData)
|
||||
})
|
||||
}
|
||||
console.log(watermarked_img)
|
||||
this.ngxService.stop();
|
||||
},err=>{
|
||||
console.log("dk",err);
|
||||
this.ngxService.stop();
|
||||
})
|
||||
})
|
||||
}
|
||||
}
|
||||
sendImage(imageData,multi_index?) {
|
||||
let index = this.current_index
|
||||
if(this.current_index == 'last') {
|
||||
index = imageData.length-1
|
||||
}
|
||||
if(imageData[index].is_multiple != 1) {
|
||||
imageData[index].is_loader = true;
|
||||
imageData[index].is_saved = false
|
||||
}
|
||||
else{
|
||||
imageData[index].img_data[multi_index].is_loader = true;
|
||||
imageData[index].img_data[multi_index].is_saved = false
|
||||
}
|
||||
let params = {
|
||||
"fk_pd_id": this.records.pd_id,
|
||||
"fk_form_id": imageData[index].fk_form_id,
|
||||
"image":imageData[index].is_multiple != 1 ? imageData[index].img_url_new : imageData[index].img_data[multi_index].img_url,
|
||||
"name":imageData[index].is_multiple != 1 ? imageData[index].img_name : imageData[index].img_name+' '+Number(multi_index),
|
||||
"image_key":imageData[index].img_key,
|
||||
"link":imageData.is_multiple != 1 ? imageData[index].link : imageData[index].img_data[multi_index].link,
|
||||
"is_multiple":imageData[index].is_multiple,
|
||||
"pd_document_id":imageData[index].pd_document_id,
|
||||
"retake_flag":1
|
||||
}
|
||||
// setTimeout(()=>{
|
||||
// imageData[index].is_loader =false
|
||||
// imageData[index].is_saved = true
|
||||
// },9000)
|
||||
this.apiService.uploadPDImgByApplicant(params).subscribe(result=> {
|
||||
if(result.dataStatus) {
|
||||
if(imageData[index].is_multiple != 1) {
|
||||
imageData[index].is_loader = false;
|
||||
imageData[index].is_saved = true;
|
||||
}
|
||||
else {
|
||||
imageData[index].img_data[multi_index].is_loader = false;
|
||||
imageData[index].img_data[multi_index].is_saved = true;
|
||||
}
|
||||
}
|
||||
},err=> {
|
||||
console.log(err);
|
||||
if(imageData[index].is_multiple != 1) {
|
||||
imageData[index].is_loader = false;
|
||||
imageData[index].is_saved = false;
|
||||
}
|
||||
else {
|
||||
imageData[index].img_data[multi_index].is_loader = false;
|
||||
imageData[index].img_data[multi_index].is_saved = false;
|
||||
}
|
||||
})
|
||||
}
|
||||
getImageName() {
|
||||
return new Promise((resolve,reject)=>{
|
||||
let img_name = prompt("Enter the Image Name");
|
||||
if (img_name != null) {
|
||||
console.log(img_name)
|
||||
// return img_name;
|
||||
resolve(img_name);
|
||||
}
|
||||
else{
|
||||
console.log("no name");
|
||||
}
|
||||
})
|
||||
}
|
||||
getIndex(index){
|
||||
console.log("curr",index)
|
||||
this.current_index = index
|
||||
}
|
||||
openImage(imgData , flag) {
|
||||
console.log(imgData,flag)
|
||||
// var image = new Image();
|
||||
// image.src = url;
|
||||
// var w = window.open("");
|
||||
// w.document.write(image.outerHTML);
|
||||
if(imgData.hasOwnProperty('is_base64') && imgData.is_base64 && flag == 2) {
|
||||
this.openBase64(imgData.img_url_new)
|
||||
}
|
||||
else {
|
||||
window.open(imgData.img_url,'_blank');
|
||||
}
|
||||
}
|
||||
openBase64(url) {
|
||||
const base64ImageData = url;
|
||||
const contentType = 'image/png';
|
||||
|
||||
const byteCharacters = atob(base64ImageData.substr(`data:${contentType};base64,`.length));
|
||||
const byteArrays = [];
|
||||
|
||||
for (let offset = 0; offset < byteCharacters.length; offset += 1024) {
|
||||
const slice = byteCharacters.slice(offset, offset + 1024);
|
||||
|
||||
const byteNumbers = new Array(slice.length);
|
||||
for (let i = 0; i < slice.length; i++) {
|
||||
byteNumbers[i] = slice.charCodeAt(i);
|
||||
}
|
||||
|
||||
const byteArray = new Uint8Array(byteNumbers);
|
||||
|
||||
byteArrays.push(byteArray);
|
||||
}
|
||||
const blob = new Blob(byteArrays, {type: contentType});
|
||||
const blobUrl = URL.createObjectURL(blob);
|
||||
|
||||
window.open(blobUrl, '_blank');
|
||||
}
|
||||
openVideoChat() {
|
||||
let randomStr = this.actRoute.snapshot.paramMap.get('randomStr')
|
||||
let cus_link = window.location.origin+'/vchat/#/chat/'+randomStr;
|
||||
window.open(cus_link);
|
||||
}
|
||||
|
||||
}
|
||||
@ -0,0 +1,6 @@
|
||||
<button (click)="capture($event)" mat-button mat-raised-button>Capture
|
||||
<mat-icon name="camera" *ngIf="!addMoreBtn">camera_alt</mat-icon>
|
||||
<mat-icon name="camera" *ngIf="addMoreBtn">add_a_photo</mat-icon>
|
||||
</button>
|
||||
<input type="file" (change)="capturedImage($event)" id="input-file" name="file" accept="image/*" capture="user" style="display: none">
|
||||
<!-- document.querySelector('#input-file').click() -->
|
||||
@ -0,0 +1,25 @@
|
||||
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { CaptureBtnComponent } from './capture-btn.component';
|
||||
|
||||
describe('CaptureBtnComponent', () => {
|
||||
let component: CaptureBtnComponent;
|
||||
let fixture: ComponentFixture<CaptureBtnComponent>;
|
||||
|
||||
beforeEach(async(() => {
|
||||
TestBed.configureTestingModule({
|
||||
declarations: [ CaptureBtnComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
}));
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(CaptureBtnComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
36
src/app/pd/pd-images/capture-btn/capture-btn.component.ts
Normal file
36
src/app/pd/pd-images/capture-btn/capture-btn.component.ts
Normal file
@ -0,0 +1,36 @@
|
||||
import { Component, OnInit, Output, EventEmitter, Input } from '@angular/core';
|
||||
import { Ng2ImgMaxService } from 'ng2-img-max';
|
||||
|
||||
@Component({
|
||||
selector: 'app-capture-btn',
|
||||
templateUrl: './capture-btn.component.html',
|
||||
styleUrls: ['./capture-btn.component.scss']
|
||||
})
|
||||
export class CaptureBtnComponent implements OnInit {
|
||||
|
||||
@Input() addMoreBtn;
|
||||
@Output() imageDataEmitter = new EventEmitter
|
||||
constructor(private ng2ImgMax:Ng2ImgMaxService) { }
|
||||
|
||||
ngOnInit(): void {
|
||||
console.log(this.addMoreBtn)
|
||||
}
|
||||
capturedImage(event){
|
||||
console.log(event);
|
||||
let imageData= event.target.files[0]
|
||||
this.ng2ImgMax.resizeImage(imageData, 450, 650).subscribe(
|
||||
result => {
|
||||
this.imageDataEmitter.emit(result)
|
||||
},
|
||||
error => {
|
||||
console.log('😢 Oh no!', error);
|
||||
}
|
||||
);
|
||||
|
||||
}
|
||||
capture(event){
|
||||
event.preventDefault();
|
||||
let element:HTMLElement = document.getElementById('input-file') as HTMLElement
|
||||
element.click();
|
||||
}
|
||||
}
|
||||
145
src/app/pd/pd-images/pd-images.component.html
Normal file
145
src/app/pd/pd-images/pd-images.component.html
Normal file
@ -0,0 +1,145 @@
|
||||
<!-- <input type="file" accept="image/*" capture="environment"> -->
|
||||
<mat-card>
|
||||
<div fxLayout="row">
|
||||
<span fxLayout="column" fxFlex="85" fxFlex.xs = "70" fxLayoutAlign="flex-start" >
|
||||
<mat-card-header >
|
||||
<mat-card-title><h5>PD Images</h5></mat-card-title>
|
||||
</mat-card-header>
|
||||
</span>
|
||||
<div fxLayout="column" fxFlex="15" fxFlex.xs = "30" fxLayoutAlign="flex-end" >
|
||||
<button mat-button mat-raised-button class="mr-1 mb-1" color="primary" (click)="openVideoChat()">
|
||||
<mat-icon>videocam</mat-icon>
|
||||
<strong>Call</strong>
|
||||
</button>
|
||||
</div>
|
||||
</div>
|
||||
<!-- </span> -->
|
||||
<mat-card-content>
|
||||
<div fxLayout="row wrap" fxLayoutAlign="start stretch" fxLayoutAlign.xs="space-between stretch" fxLayoutGap="28px" fxLayoutGap.xs="15px" style="flex-wrap: wrap">
|
||||
<!-- {{records.img_data | json}} -->
|
||||
<div *ngFor="let val of imageData;let i = index" [ngStyle]="{'flex-basis': val.is_multiple == 1 ? '100%' : ''}" >
|
||||
<!-- {{val.is_multiple}} -->
|
||||
<div *ngIf="(!val.hasOwnProperty('is_multiple')) || (val.hasOwnProperty('is_multiple') && val.is_multiple == '0')" style="flex-basis: 100%" class ="image-div" >
|
||||
|
||||
<img *ngIf="val.img_url != '' && val.img_url != null"
|
||||
class="image-class" [src]="val.img_url" [alt]="val.img_key" alt="image" (click)="openImage(val)">
|
||||
<div class="dummy-img" *ngIf="val.img_url == '' || val.img_url == null">
|
||||
<p
|
||||
style="justify-content: center;align-content: center;text-align: center;align-items: center; margin-top: 10%;">
|
||||
<span>
|
||||
Image is not Captured.<br /> Click to
|
||||
</span>Capture <mat-icon>camera</mat-icon>
|
||||
</p>
|
||||
</div>
|
||||
<div class="image-label" fxLayout ="row" >
|
||||
<p fxFlex="60" >{{val.img_name || val.img_key}} </p>
|
||||
<span *ngIf="val.is_loader == true" fxFlex="20">
|
||||
<!-- <object style="height: 35px" type="image/svg+xml" data="../../../assets/spinner/spinner.svg">
|
||||
Your browser does not support SVG
|
||||
</object> -->
|
||||
<img src="../../../assets/spinner/spinner.svg" alt="spinner"/>
|
||||
</span>
|
||||
<span *ngIf="val.is_saved == true && val.img_url != '' && val.img_url != null" fxFlex = "20" fxLayoutAlign="flex-end">
|
||||
<mat-icon style="color:green;font-size: 20px;">done</mat-icon>
|
||||
</span>
|
||||
<span *ngIf="val.is_saved == false && val.is_loader == false" fxFlex = "20" fxLayoutAlign="flex-end">
|
||||
<mat-icon style="color:rgb(255, 196, 0);font-size: 25px;">cloud_upload</mat-icon><br/>
|
||||
<!-- <span><p style="font-size: 6px">Click to ReUpload</p></span> -->
|
||||
</span>
|
||||
|
||||
<!-- <div> -->
|
||||
|
||||
</div>
|
||||
<!-- </div> -->
|
||||
|
||||
<span (click)="getIndex(i)">
|
||||
<app-capture-btn class="file-btn" (imageDataEmitter)="addImage($event,i)"></app-capture-btn>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div *ngIf="val.is_multiple == 1" style="flex-basis: 100%;">
|
||||
<br/> <br/>
|
||||
<hr />
|
||||
<h5>{{val.img_name}}</h5>
|
||||
<div fxLayout="row wrap" fxLayoutAlign="start stretch" fxLayoutAlign.xs="space-between stretch">
|
||||
<div *ngFor="let multiple_img of val.img_data;let i=index" class ="image-div">
|
||||
<img *ngIf="multiple_img.img_url != '' && multiple_img.img_url != null"
|
||||
class="image-class" [src]="multiple_img.img_url" [alt]="val.img_key" alt="image" (click)="openImage(multiple_img)"/>
|
||||
|
||||
<div class="image-label" fxLayout ="row" >
|
||||
<p fxFlex="60">{{val.img_name}} {{i+1}} </p>
|
||||
<span *ngIf="multiple_img.is_loader == true" fxFlex="20">
|
||||
<img src="../../../assets/spinner/spinner.svg" alt="spinner"/>
|
||||
</span>
|
||||
<span *ngIf="multiple_img.is_saved == true && multiple_img.img_url != '' && multiple_img.img_url != null" fxLayoutAlign="flex-end">
|
||||
<mat-icon style="color:green;font-size: 20px;">done</mat-icon>
|
||||
</span>
|
||||
<span *ngIf="multiple_img.is_saved == false && multiple_img.is_loader == false" fxLayoutAlign="flex-end">
|
||||
<mat-icon style="color:rgb(255, 196, 0);font-size: 25px;">cloud_upload</mat-icon><br/>
|
||||
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<div style="margin-right: -20px !important;padding:0!important;">
|
||||
<div class="dummy-img" style="margin: 30px 0 0 4px;
|
||||
padding: 1.4%;">
|
||||
<p
|
||||
style="justify-content: center;align-content: center;text-align: center;align-items: center; ">
|
||||
<span>
|
||||
Add More Image.<br /> Click to
|
||||
</span>Capture <mat-icon>add_a_photo</mat-icon>
|
||||
</p>
|
||||
</div>
|
||||
<div class="image-label" fxLayout ="column" >
|
||||
<p fxFlex="80">Add More {{val.img_name}} </p>
|
||||
</div>
|
||||
<span (click)="getIndex(i)">
|
||||
<app-capture-btn class="file-btn" addMoreBtn="true" (imageDataEmitter)="addImage($event,i)"></app-capture-btn>
|
||||
</span>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
<br/> <br/>
|
||||
<hr *ngIf="imageData[i+1] && imageData[i+1].is_multiple != 1"/>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
<div style="padding: 1.5%;margin-top: 10px;" fxLayoutAlign.xs="flex-start stretch" *ngIf="cus_type != 'MWISE'">
|
||||
<div style="height: auto">
|
||||
<div class="dummy-img-more" #dummy_img_more>
|
||||
<p
|
||||
style="justify-content: center;align-content: center;text-align: center;align-items: center; margin-top: 10%;">
|
||||
<span>
|
||||
<!-- Click to Capture More..<br /> -->
|
||||
Click to
|
||||
</span>Capture More..<mat-icon>add_a_photo</mat-icon>
|
||||
</p>
|
||||
|
||||
</div>
|
||||
<div class="image-label" fxLayout ="column" >
|
||||
<p fxFlex="60">Capture More</p>
|
||||
</div>
|
||||
<span (click)="getIndex('last')">
|
||||
<app-capture-btn class="file-btn" addMoreBtn="true" (imageDataEmitter)="addImage($event,'last')"></app-capture-btn>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div >
|
||||
<img class="image-class" [src]="imageData"
|
||||
alt="image"><br/>
|
||||
<app-capture-btn class="file-btn" (imageDataEmitter)="addImage($event)"></app-capture-btn>
|
||||
</div>
|
||||
<div >
|
||||
<div class="dummy-img">
|
||||
<p style="justify-content: center;align-content: center;text-align: center;align-items: center; margin-top: 10%;"><span>
|
||||
Image is not Captured.<br/>
|
||||
</span>Capture <mat-icon >camera</mat-icon></p>
|
||||
</div>
|
||||
<button style="justify-content:center" mat-button mat-raised-button>Capture <mat-icon name="camera">camera</mat-icon></button>
|
||||
</div> -->
|
||||
</div>
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
|
||||
<!-- <input type="file" id="input-file" name="file" accept="image/*" capture="user"> -->
|
||||
120
src/app/pd/pd-images/pd-images.component.scss
Normal file
120
src/app/pd/pd-images/pd-images.component.scss
Normal file
@ -0,0 +1,120 @@
|
||||
// .custom-file-input::-webkit-file-upload-button {
|
||||
// visibility: hidden;
|
||||
// }
|
||||
// .custom-file-input::before {
|
||||
// content: 'Select some files';
|
||||
// display: inline-block;
|
||||
// background: linear-gradient(top, #f9f9f9, #e3e3e3);
|
||||
// border: 1px solid #999;
|
||||
// border-radius: 3px;
|
||||
// padding: 5px 8px;
|
||||
// outline: none;
|
||||
// white-space: nowrap;
|
||||
// -webkit-user-select: none;
|
||||
// cursor: pointer;
|
||||
// text-shadow: 1px 1px #fff;
|
||||
// font-weight: 700;
|
||||
// font-size: 10pt;
|
||||
// color:black;
|
||||
// // width: 20px;
|
||||
// }
|
||||
// .custom-file-input:hover::before {
|
||||
// border-color: black;
|
||||
// }
|
||||
// .custom-file-input:active::before {
|
||||
// background: -webkit-linear-gradient(top, #e3e3e3, #f9f9f9);
|
||||
// }
|
||||
// input[type='file'] {
|
||||
// // opacity:0
|
||||
// color: transparent;
|
||||
// width: 130px;
|
||||
// }
|
||||
.image-class{
|
||||
width: 170px;
|
||||
height: 200px;
|
||||
border: 1px solid lavender;
|
||||
border-radius: 7px;
|
||||
|
||||
}
|
||||
.image-div {
|
||||
max-width: 200px;
|
||||
width: auto;
|
||||
// height: 200px;
|
||||
margin-top: 25px;
|
||||
padding: 1.4%;
|
||||
}
|
||||
.image-class:hover {
|
||||
-webkit-transform: scale(1.1);
|
||||
-ms-transform: scale(1.1);
|
||||
transform: scale(1.1);
|
||||
}
|
||||
.dummy-img {
|
||||
width: 170px;
|
||||
height: 200px;
|
||||
border: 3px dashed rgba(0, 0, 0, 0.2);
|
||||
border-radius: 7px;
|
||||
background: #eeee;
|
||||
color: gray;
|
||||
}
|
||||
.dummy-img-more{
|
||||
width: 170px;
|
||||
height: 200px;
|
||||
margin-top: 20px;
|
||||
border: 4px dashed #03a9f470;
|
||||
border-radius: 7px;
|
||||
box-shadow : 0px 3px 6px 3px rgba(160, 161, 188, 0.53);
|
||||
background: #eeee;
|
||||
color: #b53f3f;
|
||||
}
|
||||
.file-btn{
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
@media (max-width: 600px){
|
||||
.image-class {
|
||||
width: 125px;
|
||||
height: 120px;
|
||||
}
|
||||
.image-div {
|
||||
width:auto;
|
||||
max-width: 135px;
|
||||
// height: 120px;
|
||||
}
|
||||
.dummy-img {
|
||||
width: 125px;
|
||||
height: 120px;
|
||||
}
|
||||
.dummy-img-more{
|
||||
width: 125px;
|
||||
height: 120px;
|
||||
}
|
||||
.image-label {
|
||||
min-height: 58px;
|
||||
p{
|
||||
width: auto;
|
||||
max-width: 67% !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
.image-label {
|
||||
min-height: 58px;
|
||||
width: auto;
|
||||
// max-width: 67%;
|
||||
p{
|
||||
margin: 7px;
|
||||
font-weight: bold;
|
||||
font-size : 14px;
|
||||
max-width: 70%!important;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
}
|
||||
.object {
|
||||
/* width: 110px; */
|
||||
height: 45px;
|
||||
}
|
||||
hr {
|
||||
background: #d23f2f;
|
||||
padding: 0.03em;
|
||||
margin: -2px;
|
||||
}
|
||||
25
src/app/pd/pd-images/pd-images.component.spec.ts
Normal file
25
src/app/pd/pd-images/pd-images.component.spec.ts
Normal file
@ -0,0 +1,25 @@
|
||||
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { PdImagesComponent } from './pd-images.component';
|
||||
|
||||
describe('PdImagesComponent', () => {
|
||||
let component: PdImagesComponent;
|
||||
let fixture: ComponentFixture<PdImagesComponent>;
|
||||
|
||||
beforeEach(async(() => {
|
||||
TestBed.configureTestingModule({
|
||||
declarations: [ PdImagesComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
}));
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(PdImagesComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
259
src/app/pd/pd-images/pd-images.component.ts
Normal file
259
src/app/pd/pd-images/pd-images.component.ts
Normal file
File diff suppressed because one or more lines are too long
26
src/app/pd/pd-routing.module.ts
Normal file
26
src/app/pd/pd-routing.module.ts
Normal file
@ -0,0 +1,26 @@
|
||||
import { NgModule } from '@angular/core';
|
||||
import { Routes, RouterModule } from '@angular/router';
|
||||
import { PdImagesComponent } from './pd-images/pd-images.component';
|
||||
import { ImgRecaptureComponent } from './img-recapture/img-recapture.component';
|
||||
|
||||
|
||||
const routes: Routes = [
|
||||
// {
|
||||
// path:'',
|
||||
// redirectTo:'pd-images'
|
||||
// },
|
||||
{
|
||||
path:'',
|
||||
component:PdImagesComponent
|
||||
},
|
||||
{
|
||||
path:'recapture',
|
||||
component:ImgRecaptureComponent
|
||||
}
|
||||
];
|
||||
|
||||
@NgModule({
|
||||
imports: [RouterModule.forChild(routes)],
|
||||
exports: [RouterModule]
|
||||
})
|
||||
export class PdRoutingModule { }
|
||||
121
src/app/pd/pd.component.html
Normal file
121
src/app/pd/pd.component.html
Normal file
@ -0,0 +1,121 @@
|
||||
<mat-toolbar class="main-header" style="border-bottom:2px solid #f44336;">
|
||||
<div class="horizontal-top-bar w-100">
|
||||
<div fxFlex.sm="100" fxFlex.xs="100" fxFlex.md="33.33" fxFlex.lg="33.33" fxFlex.xl="33.33" fxFlex="100">
|
||||
<div class="horizontal-logo">
|
||||
<div class="branding">
|
||||
<!-- <h2><i class="fa fa-superpowers" aria-hidden="true"></i> <span> OPTIMA</span>
|
||||
</h2> -->
|
||||
<!--<h2><i class="fa fa-superpowers" aria-hidden="true"></i> <span> {{userDep}}({{fullName}})</span>
|
||||
</h2>-->
|
||||
<a>
|
||||
<!-- <img [routerLink]="['/dashboard']" [src]="'http://ssa.sineedge.com/sparqapi/logo/sineedge_red.png'" style="height: 35px;;"> <span> {{userDep}} </span> -->
|
||||
<!-- (click)="menunav('HOME')" -->
|
||||
<img src="assets/images/PD.jpeg" style="height: 35px;;"> <span> PD Genie </span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div fxFlex.sm="100" fxFlex.xs="100" fxFlex.md="33.33" fxFlex.lg="33.33" fxFlex.xl="33.33" fxFlex="100">
|
||||
|
||||
</div>
|
||||
|
||||
<!-- <div fxFlex.sm="100" fxFlex.xs="100" fxFlex.md="33.33" fxFlex.lg="33.33" fxFlex.xl="33.33" fxFlex="100">
|
||||
<div class="menu-links">
|
||||
<span *ngFor="let menuitem of horizontalMenuItems.getAll() | roleMenuItems:'1'">
|
||||
<button mat-icon-button matTooltip="{{ menuitem.name}}" matTooltipPosition="below" [routerLink]="['/'+menuitem.state]" *ngIf="menuitem.type === 'link'">
|
||||
<mat-icon>{{ menuitem.icon }}</mat-icon>
|
||||
|
||||
</button>
|
||||
</span>
|
||||
<span *ngFor="let menuitem of horizontalMenuItems.getAll() | roleMenuItems:'1'">
|
||||
<span *ngIf="menuitem.type === 'multi'">
|
||||
<button [mat-menu-trigger-for]="multi" matTooltip="{{ menuitem.name}}" matTooltipPosition="below" mat-icon-button class="ml-xs">
|
||||
<mat-icon>{{ menuitem.icon }}</mat-icon>
|
||||
</button>
|
||||
<mat-menu #multi="matMenu" class="opt-menu" x-position="before">
|
||||
<div mat-menu-item class="head-menu grad-blue">
|
||||
{{ menuitem.name}}
|
||||
</div>
|
||||
<div class="dropdown">
|
||||
<div *ngFor="let childitem of menuitem.children">
|
||||
<button mat-menu-item [routerLink]="['/'+childitem.state ]">{{ childitem.name | translate }}</button>
|
||||
</div>
|
||||
</div>
|
||||
</mat-menu>
|
||||
</span>
|
||||
</span>
|
||||
|
||||
|
||||
|
||||
<button appToggleFullscreen matTooltip="Fullscreen" matTooltipPosition="below" mat-icon-button>
|
||||
<mat-icon>fullscreen</mat-icon>
|
||||
</button>
|
||||
|
||||
<button *ngIf="permissionDeined" (click)="end.toggle()" matTooltip="Notifications" matTooltipPosition="below" mat-icon-button class="ml-xs overflow-visible">
|
||||
<mat-icon>notifications</mat-icon>
|
||||
|
||||
<span *ngIf="alertCount != 0" style = "width:23px" class="notification-label">{{alertCount}}</span>
|
||||
</button>
|
||||
<button [mat-menu-trigger-for]="user" mat-icon-button class="ml-xs">
|
||||
<mat-icon>person</mat-icon>
|
||||
</button>
|
||||
<mat-menu #user="matMenu" class="opt-menu" x-position="before">
|
||||
<div mat-menu-item class="head-menu grad-blue">
|
||||
Settings
|
||||
</div>
|
||||
<button mat-menu-item>
|
||||
<mat-icon>settings</mat-icon>
|
||||
Setting
|
||||
</button>
|
||||
<button mat-menu-item (click)="userprofile()">
|
||||
<mat-icon>account_box</mat-icon>
|
||||
Profile
|
||||
</button>
|
||||
<button mat-menu-item (click)="logout()">
|
||||
<mat-icon>exit_to_app</mat-icon>
|
||||
Sign Out
|
||||
</button>
|
||||
</mat-menu>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="vertical-menu w-100">
|
||||
<button (click)="menuToggleFunc()" mat-icon-button class="lines-btn">
|
||||
<mat-icon>menu</mat-icon>
|
||||
</button>
|
||||
|
||||
<span fxFlex></span>
|
||||
<button appToggleFullscreen mat-icon-button>
|
||||
<mat-icon>fullscreen</mat-icon>
|
||||
</button>
|
||||
|
||||
<button *ngIf="permissionDeined" (click)="end.toggle()" mat-icon-button class="ml-xs overflow-visible">
|
||||
<mat-icon>notifications</mat-icon>
|
||||
<span *ngIf="alertCount != 0" style = "width:23px" class="notification-label" >{{alertCount}}</span>
|
||||
</button>
|
||||
|
||||
<button [mat-menu-trigger-for]="user" matTooltip="Person" matTooltipPosition="below" mat-icon-button class="ml-xs">
|
||||
<mat-icon>person</mat-icon>
|
||||
</button>
|
||||
<mat-menu #user="matMenu" class="opt-menu" x-position="before">
|
||||
<div mat-menu-item class="head-menu grad-blue">
|
||||
{{fullName}}
|
||||
</div>
|
||||
|
||||
<button mat-menu-item (click)="userprofile()">
|
||||
<mat-icon>account_box</mat-icon>
|
||||
Profile
|
||||
</button>
|
||||
|
||||
<button mat-menu-item (click)="logout()">
|
||||
<mat-icon>exit_to_app</mat-icon>
|
||||
Sign Out
|
||||
</button>
|
||||
</mat-menu>-->
|
||||
</div>
|
||||
</mat-toolbar>
|
||||
<div class="body-container">
|
||||
|
||||
<router-outlet></router-outlet>
|
||||
|
||||
</div>
|
||||
0
src/app/pd/pd.component.scss
Normal file
0
src/app/pd/pd.component.scss
Normal file
25
src/app/pd/pd.component.spec.ts
Normal file
25
src/app/pd/pd.component.spec.ts
Normal file
@ -0,0 +1,25 @@
|
||||
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { PdComponent } from './pd.component';
|
||||
|
||||
describe('PdComponent', () => {
|
||||
let component: PdComponent;
|
||||
let fixture: ComponentFixture<PdComponent>;
|
||||
|
||||
beforeEach(async(() => {
|
||||
TestBed.configureTestingModule({
|
||||
declarations: [ PdComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
}));
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(PdComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
46
src/app/pd/pd.component.ts
Normal file
46
src/app/pd/pd.component.ts
Normal file
@ -0,0 +1,46 @@
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
import { NgxUiLoaderService } from 'ngx-ui-loader';
|
||||
|
||||
@Component({
|
||||
selector: 'app-pd',
|
||||
templateUrl: './pd.component.html',
|
||||
styleUrls: ['./pd.component.scss']
|
||||
})
|
||||
export class PdComponent implements OnInit {
|
||||
spinnerConfig = {
|
||||
"bgsColor": "red",
|
||||
"bgsOpacity": 0.5,
|
||||
"bgsPosition": "bottom-right",
|
||||
"bgsSize": 60,
|
||||
"bgsType": "ball-spin-clockwise",
|
||||
"blur": 1,
|
||||
"delay": 0,
|
||||
"fastFadeOut": true,
|
||||
"fgsColor": "red",
|
||||
"fgsPosition": "center-center",
|
||||
"fgsSize": 70,
|
||||
"fgsType": "wandering-cubes",
|
||||
"gap": 24,
|
||||
"logoPosition": "center-center",
|
||||
"logoSize": 120,
|
||||
"logoUrl": "",
|
||||
"masterLoaderId": "master",
|
||||
"overlayBorderRadius": "0",
|
||||
"overlayColor": "rgba(40,40,40,0.39)",
|
||||
"pbColor": "red",
|
||||
"pbDirection": "ltr",
|
||||
"pbThickness": 3,
|
||||
"hasProgressBar": true,
|
||||
"text": "",
|
||||
"textColor": "#FFFFFF",
|
||||
"textPosition": "center-center",
|
||||
"maxTime": -1,
|
||||
"minTime": 300
|
||||
}
|
||||
constructor() { }
|
||||
|
||||
ngOnInit() {
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
24
src/app/pd/pd.module.ts
Normal file
24
src/app/pd/pd.module.ts
Normal file
@ -0,0 +1,24 @@
|
||||
import { NgModule } from '@angular/core';
|
||||
import { CommonModule } from '@angular/common';
|
||||
|
||||
import { PdRoutingModule } from './pd-routing.module';
|
||||
import { PdImagesComponent } from './pd-images/pd-images.component';
|
||||
import { MaterialModule } from './shared/material/material.module';
|
||||
import { CaptureBtnComponent } from './pd-images/capture-btn/capture-btn.component';
|
||||
import { Ng2ImgMaxModule } from 'ng2-img-max';
|
||||
import { ImgRecaptureComponent } from './img-recapture/img-recapture.component';
|
||||
// import { ImageUploadModule } from 'ng2-imageupload';
|
||||
|
||||
|
||||
|
||||
@NgModule({
|
||||
declarations: [PdImagesComponent, CaptureBtnComponent, ImgRecaptureComponent],
|
||||
imports: [
|
||||
CommonModule,
|
||||
PdRoutingModule,
|
||||
MaterialModule,
|
||||
Ng2ImgMaxModule
|
||||
// ImageUploadModule
|
||||
]
|
||||
})
|
||||
export class PdModule { }
|
||||
32
src/app/pd/shared/material/material.module.ts
Normal file
32
src/app/pd/shared/material/material.module.ts
Normal file
@ -0,0 +1,32 @@
|
||||
import { NgModule } from '@angular/core';
|
||||
import { CommonModule } from '@angular/common';
|
||||
import {MatSidenavModule, MatButtonModule, MatIconModule, MatToolbarModule, MatFormFieldModule, MatInputModule, MatCardModule} from '@angular/material'
|
||||
import { FlexLayoutModule } from '@angular/flex-layout';
|
||||
|
||||
|
||||
|
||||
@NgModule({
|
||||
declarations: [],
|
||||
imports: [
|
||||
CommonModule,
|
||||
MatSidenavModule,
|
||||
MatButtonModule,
|
||||
MatIconModule,
|
||||
MatToolbarModule,
|
||||
MatFormFieldModule,
|
||||
MatInputModule,
|
||||
MatCardModule,
|
||||
FlexLayoutModule
|
||||
],
|
||||
exports:[
|
||||
MatSidenavModule,
|
||||
MatButtonModule,
|
||||
MatIconModule,
|
||||
MatToolbarModule,
|
||||
MatFormFieldModule,
|
||||
MatInputModule,
|
||||
MatCardModule,
|
||||
FlexLayoutModule
|
||||
]
|
||||
})
|
||||
export class MaterialModule { }
|
||||
18
src/app/sales-pd/sales-pd-routing.module.ts
Normal file
18
src/app/sales-pd/sales-pd-routing.module.ts
Normal file
@ -0,0 +1,18 @@
|
||||
import { NgModule } from '@angular/core';
|
||||
import { Routes, RouterModule } from '@angular/router';
|
||||
import { SalesPdComponent } from './sales-pd.component';
|
||||
import { SalespdImagesComponent } from './salespd-images/salespd-images.component';
|
||||
|
||||
|
||||
const routes: Routes = [
|
||||
{
|
||||
path:'',
|
||||
component:SalespdImagesComponent
|
||||
}
|
||||
];
|
||||
|
||||
@NgModule({
|
||||
imports: [RouterModule.forChild(routes)],
|
||||
exports: [RouterModule]
|
||||
})
|
||||
export class SalesPdRoutingModule { }
|
||||
121
src/app/sales-pd/sales-pd.component.html
Normal file
121
src/app/sales-pd/sales-pd.component.html
Normal file
@ -0,0 +1,121 @@
|
||||
<mat-toolbar class="main-header" style="border-bottom:2px solid #f44336;">
|
||||
<div class="horizontal-top-bar w-100">
|
||||
<div fxFlex.sm="100" fxFlex.xs="100" fxFlex.md="33.33" fxFlex.lg="33.33" fxFlex.xl="33.33" fxFlex="100">
|
||||
<div class="horizontal-logo">
|
||||
<div class="branding">
|
||||
<!-- <h2><i class="fa fa-superpowers" aria-hidden="true"></i> <span> OPTIMA</span>
|
||||
</h2> -->
|
||||
<!--<h2><i class="fa fa-superpowers" aria-hidden="true"></i> <span> {{userDep}}({{fullName}})</span>
|
||||
</h2>-->
|
||||
<a>
|
||||
<!-- <img [routerLink]="['/dashboard']" [src]="'http://ssa.sineedge.com/sparqapi/logo/sineedge_red.png'" style="height: 35px;;"> <span> {{userDep}} </span> -->
|
||||
<!-- (click)="menunav('HOME')" -->
|
||||
<img src="assets/images/PD.jpeg" style="height: 35px;;"> <span> PD Genie </span>
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div fxFlex.sm="100" fxFlex.xs="100" fxFlex.md="33.33" fxFlex.lg="33.33" fxFlex.xl="33.33" fxFlex="100">
|
||||
|
||||
</div>
|
||||
|
||||
<!-- <div fxFlex.sm="100" fxFlex.xs="100" fxFlex.md="33.33" fxFlex.lg="33.33" fxFlex.xl="33.33" fxFlex="100">
|
||||
<div class="menu-links">
|
||||
<span *ngFor="let menuitem of horizontalMenuItems.getAll() | roleMenuItems:'1'">
|
||||
<button mat-icon-button matTooltip="{{ menuitem.name}}" matTooltipPosition="below" [routerLink]="['/'+menuitem.state]" *ngIf="menuitem.type === 'link'">
|
||||
<mat-icon>{{ menuitem.icon }}</mat-icon>
|
||||
|
||||
</button>
|
||||
</span>
|
||||
<span *ngFor="let menuitem of horizontalMenuItems.getAll() | roleMenuItems:'1'">
|
||||
<span *ngIf="menuitem.type === 'multi'">
|
||||
<button [mat-menu-trigger-for]="multi" matTooltip="{{ menuitem.name}}" matTooltipPosition="below" mat-icon-button class="ml-xs">
|
||||
<mat-icon>{{ menuitem.icon }}</mat-icon>
|
||||
</button>
|
||||
<mat-menu #multi="matMenu" class="opt-menu" x-position="before">
|
||||
<div mat-menu-item class="head-menu grad-blue">
|
||||
{{ menuitem.name}}
|
||||
</div>
|
||||
<div class="dropdown">
|
||||
<div *ngFor="let childitem of menuitem.children">
|
||||
<button mat-menu-item [routerLink]="['/'+childitem.state ]">{{ childitem.name | translate }}</button>
|
||||
</div>
|
||||
</div>
|
||||
</mat-menu>
|
||||
</span>
|
||||
</span>
|
||||
|
||||
|
||||
|
||||
<button appToggleFullscreen matTooltip="Fullscreen" matTooltipPosition="below" mat-icon-button>
|
||||
<mat-icon>fullscreen</mat-icon>
|
||||
</button>
|
||||
|
||||
<button *ngIf="permissionDeined" (click)="end.toggle()" matTooltip="Notifications" matTooltipPosition="below" mat-icon-button class="ml-xs overflow-visible">
|
||||
<mat-icon>notifications</mat-icon>
|
||||
|
||||
<span *ngIf="alertCount != 0" style = "width:23px" class="notification-label">{{alertCount}}</span>
|
||||
</button>
|
||||
<button [mat-menu-trigger-for]="user" mat-icon-button class="ml-xs">
|
||||
<mat-icon>person</mat-icon>
|
||||
</button>
|
||||
<mat-menu #user="matMenu" class="opt-menu" x-position="before">
|
||||
<div mat-menu-item class="head-menu grad-blue">
|
||||
Settings
|
||||
</div>
|
||||
<button mat-menu-item>
|
||||
<mat-icon>settings</mat-icon>
|
||||
Setting
|
||||
</button>
|
||||
<button mat-menu-item (click)="userprofile()">
|
||||
<mat-icon>account_box</mat-icon>
|
||||
Profile
|
||||
</button>
|
||||
<button mat-menu-item (click)="logout()">
|
||||
<mat-icon>exit_to_app</mat-icon>
|
||||
Sign Out
|
||||
</button>
|
||||
</mat-menu>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="vertical-menu w-100">
|
||||
<button (click)="menuToggleFunc()" mat-icon-button class="lines-btn">
|
||||
<mat-icon>menu</mat-icon>
|
||||
</button>
|
||||
|
||||
<span fxFlex></span>
|
||||
<button appToggleFullscreen mat-icon-button>
|
||||
<mat-icon>fullscreen</mat-icon>
|
||||
</button>
|
||||
|
||||
<button *ngIf="permissionDeined" (click)="end.toggle()" mat-icon-button class="ml-xs overflow-visible">
|
||||
<mat-icon>notifications</mat-icon>
|
||||
<span *ngIf="alertCount != 0" style = "width:23px" class="notification-label" >{{alertCount}}</span>
|
||||
</button>
|
||||
|
||||
<button [mat-menu-trigger-for]="user" matTooltip="Person" matTooltipPosition="below" mat-icon-button class="ml-xs">
|
||||
<mat-icon>person</mat-icon>
|
||||
</button>
|
||||
<mat-menu #user="matMenu" class="opt-menu" x-position="before">
|
||||
<div mat-menu-item class="head-menu grad-blue">
|
||||
{{fullName}}
|
||||
</div>
|
||||
|
||||
<button mat-menu-item (click)="userprofile()">
|
||||
<mat-icon>account_box</mat-icon>
|
||||
Profile
|
||||
</button>
|
||||
|
||||
<button mat-menu-item (click)="logout()">
|
||||
<mat-icon>exit_to_app</mat-icon>
|
||||
Sign Out
|
||||
</button>
|
||||
</mat-menu>-->
|
||||
</div>
|
||||
</mat-toolbar>
|
||||
<div class="body-container">
|
||||
|
||||
<router-outlet></router-outlet>
|
||||
|
||||
</div>
|
||||
0
src/app/sales-pd/sales-pd.component.scss
Normal file
0
src/app/sales-pd/sales-pd.component.scss
Normal file
25
src/app/sales-pd/sales-pd.component.spec.ts
Normal file
25
src/app/sales-pd/sales-pd.component.spec.ts
Normal file
@ -0,0 +1,25 @@
|
||||
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { SalesPdComponent } from './sales-pd.component';
|
||||
|
||||
describe('SalesPdComponent', () => {
|
||||
let component: SalesPdComponent;
|
||||
let fixture: ComponentFixture<SalesPdComponent>;
|
||||
|
||||
beforeEach(async(() => {
|
||||
TestBed.configureTestingModule({
|
||||
declarations: [ SalesPdComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
}));
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(SalesPdComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
15
src/app/sales-pd/sales-pd.component.ts
Normal file
15
src/app/sales-pd/sales-pd.component.ts
Normal file
@ -0,0 +1,15 @@
|
||||
import { Component, OnInit } from '@angular/core';
|
||||
|
||||
@Component({
|
||||
selector: 'app-sales-pd',
|
||||
templateUrl: './sales-pd.component.html',
|
||||
styleUrls: ['./sales-pd.component.scss']
|
||||
})
|
||||
export class SalesPdComponent implements OnInit {
|
||||
|
||||
constructor() { }
|
||||
|
||||
ngOnInit(): void {
|
||||
}
|
||||
|
||||
}
|
||||
22
src/app/sales-pd/sales-pd.module.ts
Normal file
22
src/app/sales-pd/sales-pd.module.ts
Normal file
@ -0,0 +1,22 @@
|
||||
import { NgModule } from '@angular/core';
|
||||
import { CommonModule } from '@angular/common';
|
||||
|
||||
import { SalesPdRoutingModule } from './sales-pd-routing.module';
|
||||
import { SalesPdComponent } from './sales-pd.component';
|
||||
import { MaterialModule } from '../pd/shared/material/material.module';
|
||||
import { SalespdImagesComponent } from './salespd-images/salespd-images.component';
|
||||
import { CaptureBtnComponent } from './salespd-images/capture-btn/capture-btn.component';
|
||||
import { Ng2ImgMaxModule } from 'ng2-img-max';
|
||||
|
||||
|
||||
|
||||
@NgModule({
|
||||
declarations: [ SalespdImagesComponent,CaptureBtnComponent],
|
||||
imports: [
|
||||
CommonModule,
|
||||
SalesPdRoutingModule,
|
||||
MaterialModule,
|
||||
Ng2ImgMaxModule
|
||||
]
|
||||
})
|
||||
export class SalesPdModule { }
|
||||
@ -0,0 +1,6 @@
|
||||
<button (click)="capture($event)" mat-button mat-raised-button>Capture
|
||||
<mat-icon name="camera" *ngIf="!addMoreBtn">photo_camera</mat-icon>
|
||||
<mat-icon name="camera" *ngIf="addMoreBtn">add_a_photo</mat-icon>
|
||||
</button>
|
||||
<input type="file" (change)="capturedImage($event)" id="input-file" name="file" accept="image/*" capture="user" style="display: none">
|
||||
<!-- document.querySelector('#input-file').click() -->
|
||||
@ -0,0 +1,25 @@
|
||||
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { CaptureBtnComponent } from './capture-btn.component';
|
||||
|
||||
describe('CaptureBtnComponent', () => {
|
||||
let component: CaptureBtnComponent;
|
||||
let fixture: ComponentFixture<CaptureBtnComponent>;
|
||||
|
||||
beforeEach(async(() => {
|
||||
TestBed.configureTestingModule({
|
||||
declarations: [ CaptureBtnComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
}));
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(CaptureBtnComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
@ -0,0 +1,36 @@
|
||||
import { Component, OnInit, Output, EventEmitter, Input } from '@angular/core';
|
||||
import { Ng2ImgMaxService } from 'ng2-img-max';
|
||||
|
||||
@Component({
|
||||
selector: 'app-salescapture-btn',
|
||||
templateUrl: './capture-btn.component.html',
|
||||
styleUrls: ['./capture-btn.component.scss']
|
||||
})
|
||||
export class CaptureBtnComponent implements OnInit {
|
||||
|
||||
@Input() addMoreBtn;
|
||||
@Output() imageDataEmitter = new EventEmitter
|
||||
constructor(private ng2ImgMax:Ng2ImgMaxService) { }
|
||||
|
||||
ngOnInit(): void {
|
||||
console.log(this.addMoreBtn)
|
||||
}
|
||||
capturedImage(event){
|
||||
console.log(event);
|
||||
let imageData= event.target.files[0]
|
||||
this.ng2ImgMax.resizeImage(imageData, 450, 650).subscribe(
|
||||
result => {
|
||||
this.imageDataEmitter.emit(result)
|
||||
},
|
||||
error => {
|
||||
console.log('😢 Oh no!', error);
|
||||
}
|
||||
);
|
||||
|
||||
}
|
||||
capture(event){
|
||||
event.preventDefault();
|
||||
let element:HTMLElement = document.getElementById('input-file') as HTMLElement
|
||||
element.click();
|
||||
}
|
||||
}
|
||||
147
src/app/sales-pd/salespd-images/salespd-images.component.html
Normal file
147
src/app/sales-pd/salespd-images/salespd-images.component.html
Normal file
@ -0,0 +1,147 @@
|
||||
<!-- <input type="file" accept="image/*" capture="environment"> -->
|
||||
<mat-card>
|
||||
<div fxLayout="row">
|
||||
<span fxLayout="column" fxFlex="85" fxFlex.xs = "70" fxLayoutAlign="flex-start" >
|
||||
<mat-card-header >
|
||||
<mat-card-title><h5>PD Images</h5></mat-card-title>
|
||||
</mat-card-header>
|
||||
</span>
|
||||
</div>
|
||||
<!-- </span> -->
|
||||
<mat-card-content>
|
||||
|
||||
<!-- {{records.img_data | json}} -->
|
||||
<span fxLayout="row wrap" fxLayoutAlign="start stretch" fxLayoutAlign.xs="start stretch" fxLayoutGap.xs="2px" fxLayoutGap="15px" style="flex-wrap: wrap">
|
||||
<div *ngFor="let val of imageData;let i = index" [ngStyle]="{'flex-basis': val.is_multiple == 1 ? '100%' : '100%'}">
|
||||
<div *ngIf="val.is_multiple == 0" style="flex-basis: 100%">
|
||||
<hr style="width: 100%"/>
|
||||
<h5>{{val.section_heading}}</h5> <br/>
|
||||
</div>
|
||||
<div class ="image-div" *ngIf="val.is_multiple == 0" >
|
||||
<!-- <h5>{{val.img_name}}</h5> -->
|
||||
|
||||
<img *ngIf="val.img_url != '' && val.img_url != null"
|
||||
class="image-class" [src]="val.img_url" [alt]="val.img_key" alt="image" (click)="openImage(val)"/>
|
||||
<div class="dummy-img" *ngIf="val.img_url == '' || val.img_url == null">
|
||||
<p
|
||||
style="justify-content: center;align-content: center;text-align: center;align-items: center; margin-top: 10%;">
|
||||
<span>
|
||||
Image is not Captured.<br /> Click to
|
||||
</span>Capture <mat-icon>photo_camera</mat-icon>
|
||||
</p>
|
||||
</div>
|
||||
<div class="image-label" fxLayout ="row" >
|
||||
<p fxFlex="90"> </p>
|
||||
<span *ngIf="val.is_loader == true" fxFlex="10">
|
||||
<!-- <object style="height: 35px" type="image/svg+xml" data="../../../assets/spinner/spinner.svg">
|
||||
Your browser does not support SVG
|
||||
</object> -->
|
||||
<img src="../../../assets/spinner/spinner.svg" alt="spinner"/>
|
||||
</span>
|
||||
<span *ngIf="val.is_saved == true && val.img_url != '' && val.img_url != null" fxLayoutAlign="flex-end">
|
||||
<mat-icon style="color:green;font-size: 20px;">done</mat-icon>
|
||||
</span>
|
||||
<span *ngIf="val.is_saved == false && val.is_loader == false" fxLayoutAlign="flex-end">
|
||||
<mat-icon style="color:rgb(255, 196, 0);font-size: 25px;">cloud_upload</mat-icon><br/>
|
||||
<!-- <span><p style="font-size: 6px">Click to ReUpload</p></span> -->
|
||||
</span>
|
||||
|
||||
<!-- <div> -->
|
||||
|
||||
</div>
|
||||
<!-- </div> -->
|
||||
|
||||
<span (click)="getIndex(i)">
|
||||
<app-salescapture-btn class="file-btn" (imageDataEmitter)="addImage($event,i)"></app-salescapture-btn>
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div *ngIf="val.is_multiple == 1" style="flex-basis: 100%;">
|
||||
<br/> <br/>
|
||||
<hr />
|
||||
<h5>{{val.section_heading}}</h5>
|
||||
<div fxLayout="row wrap" fxLayoutAlign="start stretch" fxLayoutAlign.xs="start stretch">
|
||||
<div *ngFor="let multiple_img of val.img_data;let i=index" class ="image-div">
|
||||
<img *ngIf="multiple_img.img_url != '' && multiple_img.img_url != null"
|
||||
class="image-class" [src]="multiple_img.img_url" [alt]="val.img_key" alt="image" (click)="openImage(multiple_img)"/>
|
||||
|
||||
<div class="image-label" fxLayout ="row" >
|
||||
<p fxFlex="60">{{val.img_name}} {{i+1}} </p>
|
||||
<span *ngIf="multiple_img.is_loader == true" fxFlex="20">
|
||||
<!-- <object style="height: 35px" type="image/svg+xml" data="../../../assets/spinner/spinner.svg">
|
||||
Your browser does not support SVG
|
||||
</object> -->
|
||||
<img src="../../../assets/spinner/spinner.svg" alt="spinner"/>
|
||||
</span>
|
||||
<span *ngIf="multiple_img.is_saved == true && multiple_img.img_url != '' && multiple_img.img_url != null" fxLayoutAlign="flex-end">
|
||||
<mat-icon style="color:green;font-size: 20px;">done</mat-icon>
|
||||
</span>
|
||||
<span *ngIf="multiple_img.is_saved == false && multiple_img.is_loader == false" fxLayoutAlign="flex-end">
|
||||
<mat-icon style="color:rgb(255, 196, 0);font-size: 25px;">cloud_upload</mat-icon><br/>
|
||||
<!-- <span><p style="font-size: 6px">Click to ReUpload</p></span> -->
|
||||
</span>
|
||||
|
||||
<!-- <div> -->
|
||||
|
||||
</div>
|
||||
<!-- </div> -->
|
||||
</div>
|
||||
<div >
|
||||
<div class="dummy-img" style="margin: 15px 0 0 4px;
|
||||
padding: 1.4%;">
|
||||
<p
|
||||
style="justify-content: center;align-content: center;text-align: center;align-items: center; margin-top: 10%;">
|
||||
<span>
|
||||
Add More Image.<br /> Click to
|
||||
</span>Capture <mat-icon>add_a_photo</mat-icon>
|
||||
</p>
|
||||
</div>
|
||||
<div class="image-label" fxLayout ="column" >
|
||||
<!-- <p fxFlex="60">Add More </p> -->
|
||||
</div>
|
||||
<span (click)="getIndex(i)">
|
||||
<app-salescapture-btn addMoreBtn="true" class="file-btn" (imageDataEmitter)="addImage($event,i)"></app-salescapture-btn>
|
||||
</span>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <div style="padding: 1.5%;margin-top: 10px;" fxLayoutAlign.xs="flex-start stretch" >
|
||||
<div style="height: auto">
|
||||
<div class="dummy-img-more" #dummy_img_more>
|
||||
<p
|
||||
style="justify-content: center;align-content: center;text-align: center;align-items: center; margin-top: 10%;">
|
||||
<span>
|
||||
|
||||
Click to
|
||||
</span>Capture More..<mat-icon>add_a_photo</mat-icon>
|
||||
</p>
|
||||
|
||||
</div>
|
||||
<div class="image-label" fxLayout ="column" >
|
||||
<p fxFlex="60">Capture More</p>
|
||||
</div>
|
||||
<span (click)="getIndex('last')">
|
||||
<app-salescapture-btn class="file-btn" addMoreBtn="true" (imageDataEmitter)="addImage($event,'last')"></app-salescapture-btn>
|
||||
</span>
|
||||
</div>
|
||||
</div> -->
|
||||
<!-- <div >
|
||||
<img class="image-class" [src]="imageData"
|
||||
alt="image"><br/>
|
||||
<app-salescapture-btn class="file-btn" (imageDataEmitter)="addImage($event)"></app-salescapture-btn>
|
||||
</div>
|
||||
<div >
|
||||
<div class="dummy-img">
|
||||
<p style="justify-content: center;align-content: center;text-align: center;align-items: center; margin-top: 10%;"><span>
|
||||
Image is not Captured.<br/>
|
||||
</span>Capture <mat-icon >camera</mat-icon></p>
|
||||
</div>
|
||||
<button style="justify-content:center" mat-button mat-raised-button>Capture <mat-icon name="camera">camera</mat-icon></button>
|
||||
</div> -->
|
||||
</div>
|
||||
</span>
|
||||
</mat-card-content>
|
||||
</mat-card>
|
||||
|
||||
<!-- <input type="file" id="input-file" name="file" accept="image/*" capture="user"> -->
|
||||
121
src/app/sales-pd/salespd-images/salespd-images.component.scss
Normal file
121
src/app/sales-pd/salespd-images/salespd-images.component.scss
Normal file
@ -0,0 +1,121 @@
|
||||
// .custom-file-input::-webkit-file-upload-button {
|
||||
// visibility: hidden;
|
||||
// }
|
||||
// .custom-file-input::before {
|
||||
// content: 'Select some files';
|
||||
// display: inline-block;
|
||||
// background: linear-gradient(top, #f9f9f9, #e3e3e3);
|
||||
// border: 1px solid #999;
|
||||
// border-radius: 3px;
|
||||
// padding: 5px 8px;
|
||||
// outline: none;
|
||||
// white-space: nowrap;
|
||||
// -webkit-user-select: none;
|
||||
// cursor: pointer;
|
||||
// text-shadow: 1px 1px #fff;
|
||||
// font-weight: 700;
|
||||
// font-size: 10pt;
|
||||
// color:black;
|
||||
// // width: 20px;
|
||||
// }
|
||||
// .custom-file-input:hover::before {
|
||||
// border-color: black;
|
||||
// }
|
||||
// .custom-file-input:active::before {
|
||||
// background: -webkit-linear-gradient(top, #e3e3e3, #f9f9f9);
|
||||
// }
|
||||
// input[type='file'] {
|
||||
// // opacity:0
|
||||
// color: transparent;
|
||||
// width: 130px;
|
||||
// }
|
||||
.image-class{
|
||||
width: 170px;
|
||||
height: 200px;
|
||||
border: 1px solid lavender;
|
||||
border-radius: 7px;
|
||||
|
||||
}
|
||||
.image-div {
|
||||
max-width: 200px;
|
||||
width: auto;
|
||||
// height: 200px;
|
||||
margin-top: 10px;
|
||||
padding: 1.4%;
|
||||
}
|
||||
.image-class:hover {
|
||||
-webkit-transform: scale(1.1);
|
||||
-ms-transform: scale(1.1);
|
||||
transform: scale(1.1);
|
||||
}
|
||||
.dummy-img {
|
||||
width: 170px;
|
||||
height: 200px;
|
||||
border: 3px dashed rgba(0, 0, 0, 0.2);
|
||||
border-radius: 7px;
|
||||
background: #eeee;
|
||||
color: gray;
|
||||
}
|
||||
.dummy-img-more{
|
||||
width: 170px;
|
||||
height: 200px;
|
||||
border: 4px dashed #03a9f470;
|
||||
border-radius: 7px;
|
||||
box-shadow : 0px 3px 6px 3px rgba(160, 161, 188, 0.53);
|
||||
background: #eeee;
|
||||
color: #b53f3f;
|
||||
}
|
||||
.file-btn{
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
@media (max-width: 600px){
|
||||
.image-class {
|
||||
width: 125px;
|
||||
height: 120px;
|
||||
}
|
||||
.image-div {
|
||||
width:auto;
|
||||
max-width: 135px;
|
||||
// height: 120px;
|
||||
}
|
||||
.dummy-img {
|
||||
width: 125px;
|
||||
height: 120px;
|
||||
}
|
||||
.dummy-img-more{
|
||||
width: 125px;
|
||||
height: 120px;
|
||||
}
|
||||
.image-label {
|
||||
min-height: 18px;
|
||||
p{
|
||||
width: auto;
|
||||
max-width: 67% !important;
|
||||
text-align: left!important;
|
||||
float: left !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
.image-label {
|
||||
min-height: 18px;
|
||||
width: auto;
|
||||
// max-width: 67%;
|
||||
p{
|
||||
margin: 7px;
|
||||
font-weight: bold;
|
||||
font-size : 14px;
|
||||
max-width: 70%!important;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
}
|
||||
.object {
|
||||
/* width: 110px; */
|
||||
height: 45px;
|
||||
}
|
||||
hr {
|
||||
background: #d23f2f;
|
||||
padding: 0.03em;
|
||||
margin: -2px;
|
||||
}
|
||||
@ -0,0 +1,25 @@
|
||||
import { async, ComponentFixture, TestBed } from '@angular/core/testing';
|
||||
|
||||
import { SalespdImagesComponent } from './salespd-images.component';
|
||||
|
||||
describe('SalespdImagesComponent', () => {
|
||||
let component: SalespdImagesComponent;
|
||||
let fixture: ComponentFixture<SalespdImagesComponent>;
|
||||
|
||||
beforeEach(async(() => {
|
||||
TestBed.configureTestingModule({
|
||||
declarations: [ SalespdImagesComponent ]
|
||||
})
|
||||
.compileComponents();
|
||||
}));
|
||||
|
||||
beforeEach(() => {
|
||||
fixture = TestBed.createComponent(SalespdImagesComponent);
|
||||
component = fixture.componentInstance;
|
||||
fixture.detectChanges();
|
||||
});
|
||||
|
||||
it('should create', () => {
|
||||
expect(component).toBeTruthy();
|
||||
});
|
||||
});
|
||||
287
src/app/sales-pd/salespd-images/salespd-images.component.ts
Normal file
287
src/app/sales-pd/salespd-images/salespd-images.component.ts
Normal file
@ -0,0 +1,287 @@
|
||||
import { Component, OnInit, ViewChild, ElementRef } from '@angular/core';
|
||||
import { ActivatedRoute, Router } from '@angular/router';
|
||||
import { NgxUiLoaderService } from 'ngx-ui-loader';
|
||||
import { ApiServiceService } from 'src/app/services/api-service/api-service.service';
|
||||
import { DataServiceService } from 'src/app/services/data-service/data-service.service';
|
||||
import { CameraService } from 'src/app/services/camera.service';
|
||||
|
||||
@Component({
|
||||
selector: 'app-salespd-images',
|
||||
templateUrl: './salespd-images.component.html',
|
||||
styleUrls: ['./salespd-images.component.scss']
|
||||
})
|
||||
export class SalespdImagesComponent implements OnInit {
|
||||
imageData: any;
|
||||
records:any= `{
|
||||
"dataStatus": true,
|
||||
"status": 200,
|
||||
"records": {
|
||||
"pd_id": "1500",
|
||||
"random_string": "nvngDBShJtLlpy5v",
|
||||
"is_cus_link_disabled": "1",
|
||||
"section_id": "9",
|
||||
"img_data": [
|
||||
{
|
||||
"img_key": "selfie_with_person_met",
|
||||
"img_name": "Person met",
|
||||
"img_url": "",
|
||||
"is_multiple": 0
|
||||
},
|
||||
{
|
||||
"heading":"Name Board Seen",
|
||||
"img_key": "name_board_seen",
|
||||
"img_name": "Name Board Seen",
|
||||
"img_data":[ ],
|
||||
"is_multiple": 1
|
||||
},
|
||||
{
|
||||
"heading":"Stock Photograph",
|
||||
"img_key": "stock_photograph",
|
||||
"img_name": "stock photo",
|
||||
"img_data":[],
|
||||
"is_multiple": 1
|
||||
},
|
||||
{
|
||||
"heading":"Workplace Interior Photograph",
|
||||
"img_key": "workplace_interior_photograph",
|
||||
"img_name": "Workplace Interior Photograph",
|
||||
"img_data":[],
|
||||
"is_multiple": 1
|
||||
}
|
||||
]
|
||||
}
|
||||
}`
|
||||
current_index: any;
|
||||
@ViewChild('dummy_img_more') dummyImgMoreRef:ElementRef
|
||||
constructor(private actRoute:ActivatedRoute,private apiService:ApiServiceService,private ngxService:NgxUiLoaderService,private dataService:DataServiceService,private router:Router,private cameraService:CameraService) { }
|
||||
|
||||
ngOnInit() {
|
||||
// this.records = JSON.parse(this.records)
|
||||
// console.log(this.records);
|
||||
// this.records =this.records.records.img_data;
|
||||
// // this.records = this.dataService.getPDImageData.img_data
|
||||
// this.imageData = this.records
|
||||
|
||||
console.log(this.records)
|
||||
console.log(typeof(this.records))
|
||||
// console.log();
|
||||
console.log(this.actRoute.snapshot.paramMap.getAll('pd_id'))
|
||||
this.getSalesPDImageDetails();
|
||||
}
|
||||
getSalesPDImageDetails() {
|
||||
this.ngxService.start();
|
||||
let pd_id = this.actRoute.snapshot.paramMap.get('pd_id')
|
||||
// let params = {"sales_pd_id":pd_id}
|
||||
let params = {"rand_string":pd_id}
|
||||
this.apiService.getSalesPDImageDetails(params).subscribe(result=>{
|
||||
if(result.dataStatus) {
|
||||
this.records = result.records
|
||||
// this.records.pd_id = pd_id
|
||||
if(this.records.is_cus_link_disabled != '1') {
|
||||
this.imageData =this.records.img_data;
|
||||
this.imageData.forEach(val=>{
|
||||
val.is_loader = false
|
||||
val.is_saved = true
|
||||
})
|
||||
}
|
||||
else{
|
||||
let msgObj ={title:'',subtitle:'Link is Disabled',is_homebtn:false,message:'The requested url is Disabled.'}
|
||||
this.goToErrorComponent(msgObj)
|
||||
}
|
||||
}
|
||||
else{
|
||||
let msgObj ={title:'',subtitle:result.msg?result.msg : 'Invalid Link',is_homebtn:false,message:'The requested url is Invalid.'}
|
||||
this.goToErrorComponent(msgObj)
|
||||
}
|
||||
this.ngxService.stop();
|
||||
},err=>{
|
||||
this.ngxService.stop();
|
||||
let msgObj ={title:'404',subtitle:'Not Found',is_homebtn:false,message:'The requested url returns 404. Please check your internet connection'}
|
||||
this.goToErrorComponent(msgObj)
|
||||
})
|
||||
}
|
||||
goToErrorComponent(msgObj) {
|
||||
this.dataService.setErrorMsg({title:msgObj.title,subtitle:msgObj.subtitle,is_homebtn:false,message:msgObj.message})
|
||||
this.router.navigateByUrl('error');
|
||||
}
|
||||
addImage(event,index){
|
||||
this.ngxService.start();
|
||||
console.log(event,index);
|
||||
var reader = new FileReader();
|
||||
// let imagePath = event;
|
||||
reader.readAsDataURL(event);
|
||||
reader.onload = (_event) => {
|
||||
// this.imageData = reader.result;
|
||||
this.cameraService.getPosition().then(geoCords=>{
|
||||
let geoCoordinates
|
||||
if(geoCords != 'error') {
|
||||
geoCoordinates = geoCords
|
||||
}
|
||||
else {
|
||||
geoCoordinates = null;
|
||||
}
|
||||
console.log(geoCords);
|
||||
this.cameraService.addWatermarks(reader.result,geoCoordinates).then(watermarked_img=>{
|
||||
if(this.current_index != 'last' ) {
|
||||
if(this.imageData[this.current_index].is_multiple != 1) {
|
||||
this.imageData[this.current_index].img_url = watermarked_img;
|
||||
this.imageData[this.current_index].is_base64 = true;
|
||||
this.imageData[this.current_index].link = geoCoordinates
|
||||
this.sendImage(this.imageData)
|
||||
}
|
||||
else{
|
||||
let img_data={img_url:watermarked_img,is_base64:true,link:geoCoordinates}
|
||||
this.imageData[this.current_index].img_data.push(img_data)
|
||||
console.log(this.imageData,JSON.stringify(this.imageData));
|
||||
this.sendImage(this.imageData,this.imageData[this.current_index].img_data.length-1)
|
||||
}
|
||||
}
|
||||
// else{
|
||||
// this.getImageName().then(result=>{
|
||||
// console.log(result);
|
||||
// this.imageData.push( {
|
||||
// "img_key": "common_image",
|
||||
// "img_name": result,
|
||||
// "img_url": watermarked_img,
|
||||
// "fk_form_id": "",
|
||||
// "is_base64":true,
|
||||
// "link":geoCoordinates
|
||||
// })
|
||||
// // let el = document.getElementById('dummy-img-more');
|
||||
// // el.scrollIntoView();
|
||||
// setTimeout(()=>{
|
||||
// this.dummyImgMoreRef.nativeElement.scrollIntoView({behavior:"smooth",block:"end"})
|
||||
// },1000)
|
||||
// this.sendImage(this.imageData)
|
||||
// })
|
||||
// }
|
||||
console.log(watermarked_img)
|
||||
this.ngxService.stop();
|
||||
},err=>{
|
||||
console.log("dk",err);
|
||||
this.ngxService.stop();
|
||||
})
|
||||
})
|
||||
}
|
||||
}
|
||||
sendImage(imageData,multi_index?) {
|
||||
let index = this.current_index
|
||||
if(this.current_index == 'last') {
|
||||
index = imageData.length-1
|
||||
}
|
||||
if(imageData[index].is_multiple != 1) {
|
||||
imageData[index].is_loader = true;
|
||||
imageData[index].is_saved = false
|
||||
}
|
||||
else{
|
||||
imageData[index].img_data[multi_index].is_loader = true;
|
||||
imageData[index].img_data[multi_index].is_saved = false
|
||||
}
|
||||
let Salesparams={"fk_sales_pd_id":this.records.sales_pd_id,
|
||||
"img":imageData[index].is_multiple != 1 ? imageData[index].img_url : imageData[index].img_data[multi_index].img_url,
|
||||
"img_name":imageData[index].img_key,
|
||||
"location":imageData[index].is_multiple != 1 ? imageData[index].link : imageData[index].img_data[multi_index].link
|
||||
}
|
||||
let params = {
|
||||
"fk_pd_id": this.records.sales_pd_id,
|
||||
"image":imageData.is_multiple != 1 ? imageData[index].img_url : imageData[index].img_data[multi_index].img_url,
|
||||
"name":imageData[index].img_name,
|
||||
"image_key":imageData[index].img_key,
|
||||
"link":imageData.is_multiple != 1 ? imageData[index].link : imageData[index].img_data[multi_index].link}
|
||||
// setTimeout(()=>{
|
||||
// imageData[index].is_loader =false
|
||||
// imageData[index].is_saved = true
|
||||
// },9000)
|
||||
this.apiService.saveSalesPDImage(Salesparams).subscribe(result=> {
|
||||
if(result.dataStatus) {
|
||||
if(imageData[index].is_multiple != 1) {
|
||||
imageData[index].is_loader = false;
|
||||
imageData[index].is_saved = true;
|
||||
}
|
||||
else {
|
||||
imageData[index].img_data[multi_index].is_loader = false;
|
||||
imageData[index].img_data[multi_index].is_saved = true
|
||||
}
|
||||
if(imageData[index].img_key == 'selfie_with_person_met') {
|
||||
let geo_coords = imageData.is_multiple != 1 ? imageData[index].link : imageData[index].img_data[multi_index].link
|
||||
this.sendGeoCordsForSatellite(geo_coords);
|
||||
}
|
||||
}
|
||||
},err=> {
|
||||
console.log(err);
|
||||
if(imageData[index].is_multiple != 1) {
|
||||
imageData[index].is_loader = false;
|
||||
imageData[index].is_saved = false;
|
||||
}
|
||||
else {
|
||||
imageData[index].img_data[multi_index].is_loader = false;
|
||||
imageData[index].img_data[multi_index].is_saved = false
|
||||
}
|
||||
})
|
||||
}
|
||||
getImageName() {
|
||||
return new Promise((resolve,reject)=>{
|
||||
let img_name = prompt("Enter the Image Name");
|
||||
if (img_name != null) {
|
||||
console.log(img_name)
|
||||
// return img_name;
|
||||
resolve(img_name);
|
||||
}
|
||||
else{
|
||||
console.log("no name");
|
||||
}
|
||||
})
|
||||
}
|
||||
getIndex(index){
|
||||
console.log("curr",index)
|
||||
this.current_index = index
|
||||
}
|
||||
openImage(imgData) {
|
||||
console.log(imgData)
|
||||
// var image = new Image();
|
||||
// image.src = url;
|
||||
// var w = window.open("");
|
||||
// w.document.write(image.outerHTML);
|
||||
console.log(imgData.img_url.includes('data:image'))
|
||||
if((imgData.hasOwnProperty('is_base64') && imgData.is_base64) || imgData.img_url.includes('data:image')) {
|
||||
this.openBase64(imgData.img_url)
|
||||
}
|
||||
else {
|
||||
console.log("url image");
|
||||
window.open(imgData.img_url,'_blank');
|
||||
}
|
||||
}
|
||||
openBase64(url) {
|
||||
const base64ImageData = url;
|
||||
const contentType = url.includes('jpeg') ? 'image/jpeg' : url.includes('png') ? 'image/png' : 'image/jpg';
|
||||
|
||||
const byteCharacters = atob(base64ImageData.substr(`data:${contentType};base64,`.length));
|
||||
const byteArrays = [];
|
||||
|
||||
for (let offset = 0; offset < byteCharacters.length; offset += 1024) {
|
||||
const slice = byteCharacters.slice(offset, offset + 1024);
|
||||
|
||||
const byteNumbers = new Array(slice.length);
|
||||
for (let i = 0; i < slice.length; i++) {
|
||||
byteNumbers[i] = slice.charCodeAt(i);
|
||||
}
|
||||
|
||||
const byteArray = new Uint8Array(byteNumbers);
|
||||
|
||||
byteArrays.push(byteArray);
|
||||
}
|
||||
const blob = new Blob(byteArrays, {type: contentType});
|
||||
const blobUrl = URL.createObjectURL(blob);
|
||||
|
||||
window.open(blobUrl, '_blank');
|
||||
}
|
||||
// openVideoChat() {
|
||||
// let randomStr = this.actRoute.snapshot.paramMap.get('randomStr')
|
||||
// let cus_link = window.location.origin+'/vchat/#/chat/'+randomStr;
|
||||
// window.open(cus_link);
|
||||
// }
|
||||
sendGeoCordsForSatellite(geoCords){
|
||||
let params = {"sales_pd_id":this.records.sales_pd_id,"geo_location":geoCords}
|
||||
this.apiService.generateSatelliteImg(params).subscribe(val=>{})
|
||||
}
|
||||
}
|
||||
32
src/app/sales-pd/shared/material/material.module.ts
Normal file
32
src/app/sales-pd/shared/material/material.module.ts
Normal file
@ -0,0 +1,32 @@
|
||||
import { NgModule } from '@angular/core';
|
||||
import { CommonModule } from '@angular/common';
|
||||
import {MatSidenavModule, MatButtonModule, MatIconModule, MatToolbarModule, MatFormFieldModule, MatInputModule, MatCardModule} from '@angular/material'
|
||||
import { FlexLayoutModule } from '@angular/flex-layout';
|
||||
|
||||
|
||||
|
||||
@NgModule({
|
||||
declarations: [],
|
||||
imports: [
|
||||
CommonModule,
|
||||
MatSidenavModule,
|
||||
MatButtonModule,
|
||||
MatIconModule,
|
||||
MatToolbarModule,
|
||||
MatFormFieldModule,
|
||||
MatInputModule,
|
||||
MatCardModule,
|
||||
FlexLayoutModule
|
||||
],
|
||||
exports:[
|
||||
MatSidenavModule,
|
||||
MatButtonModule,
|
||||
MatIconModule,
|
||||
MatToolbarModule,
|
||||
MatFormFieldModule,
|
||||
MatInputModule,
|
||||
MatCardModule,
|
||||
FlexLayoutModule
|
||||
]
|
||||
})
|
||||
export class MaterialModule { }
|
||||
16
src/app/services/api-service/api-service.service.spec.ts
Normal file
16
src/app/services/api-service/api-service.service.spec.ts
Normal file
@ -0,0 +1,16 @@
|
||||
import { TestBed } from '@angular/core/testing';
|
||||
|
||||
import { ApiServiceService } from './api-service.service';
|
||||
|
||||
describe('ApiServiceService', () => {
|
||||
let service: ApiServiceService;
|
||||
|
||||
beforeEach(() => {
|
||||
TestBed.configureTestingModule({});
|
||||
service = TestBed.inject(ApiServiceService);
|
||||
});
|
||||
|
||||
it('should be created', () => {
|
||||
expect(service).toBeTruthy();
|
||||
});
|
||||
});
|
||||
64
src/app/services/api-service/api-service.service.ts
Normal file
64
src/app/services/api-service/api-service.service.ts
Normal file
@ -0,0 +1,64 @@
|
||||
import { Injectable } from '@angular/core';
|
||||
import { HttpClient ,HttpHeaders} from '@angular/common/http';
|
||||
import { Observable } from 'rxjs';
|
||||
import { environment } from 'src/environments/environment';
|
||||
const apiUrl = environment.apiEndpoint
|
||||
const Authorization = environment.authorization
|
||||
@Injectable({
|
||||
providedIn: 'root'
|
||||
})
|
||||
export class ApiServiceService {
|
||||
|
||||
constructor(private _http:HttpClient) {
|
||||
}
|
||||
createAuthorizationHeader() {
|
||||
// let headerss = new HttpHeaders();
|
||||
// headerss.append('Authorization', Authorization);
|
||||
const headers = new HttpHeaders({'Authorization':Authorization});
|
||||
return headers
|
||||
}
|
||||
// START OF PD FUNCTIONS
|
||||
getPDImgDetails(params):Observable<any> {
|
||||
let headers = this.createAuthorizationHeader()
|
||||
return this._http.post(apiUrl+'getPDImgDetails',params,{headers:headers});
|
||||
}
|
||||
getSMCPDImgSectionData(params):Observable<any> {
|
||||
// {"pd_id":"1234","rand_string":"b6r8o7rqswW7F8Il"}
|
||||
let headers = this.createAuthorizationHeader()
|
||||
return this._http.post(apiUrl+'getSMCPDImgSectionData', params,{headers:headers})
|
||||
}
|
||||
getAuditedImages(params):Observable<any> {
|
||||
let headers = this.createAuthorizationHeader()
|
||||
return this._http.post(apiUrl+'getAuditedImages',params,{headers:headers});
|
||||
}
|
||||
uploadPDImgByApplicant(params):Observable<any> {
|
||||
let headers = this.createAuthorizationHeader()
|
||||
return this._http.post(apiUrl+'uploadPDImgByApplicant',{records:params},{headers:headers})
|
||||
}
|
||||
|
||||
saveSMCCreditPDImage(params):Observable<any> {
|
||||
let headers = this.createAuthorizationHeader()
|
||||
// {"fk_smc_credit_pd_id":"1234","img":"BLOB2","img_name":"person_met","is_multiple":"0","location":"28.6871753,77.0252074"}
|
||||
return this._http.post(apiUrl+'saveSMCCreditPDImage',{records:params},{headers:headers})
|
||||
}
|
||||
// END OF PD FUNCTIONS
|
||||
|
||||
|
||||
|
||||
// START OF SALES PD FUNCTIONS
|
||||
|
||||
getSalesPDImageDetails(params):Observable<any> {
|
||||
let headers = this.createAuthorizationHeader()
|
||||
return this._http.post(apiUrl+'getSalesPDImgDataCusLink',params,{headers:headers})
|
||||
}
|
||||
saveSalesPDImage(params):Observable<any> {
|
||||
let headers = this.createAuthorizationHeader()
|
||||
params.is_customer_app = '1'
|
||||
return this._http.post(apiUrl+'saveSalesPDImage',{records:params},{headers:headers})
|
||||
}
|
||||
generateSatelliteImg(params){
|
||||
let headers = this.createAuthorizationHeader()
|
||||
return this._http.post(apiUrl+'generateSatelliteImg',params,{headers:headers})
|
||||
}
|
||||
// END OF SALES PD FUNCTIONS
|
||||
}
|
||||
16
src/app/services/camera.service.spec.ts
Normal file
16
src/app/services/camera.service.spec.ts
Normal file
@ -0,0 +1,16 @@
|
||||
import { TestBed } from '@angular/core/testing';
|
||||
|
||||
import { CameraService } from './camera.service';
|
||||
|
||||
describe('CameraService', () => {
|
||||
let service: CameraService;
|
||||
|
||||
beforeEach(() => {
|
||||
TestBed.configureTestingModule({});
|
||||
service = TestBed.inject(CameraService);
|
||||
});
|
||||
|
||||
it('should be created', () => {
|
||||
expect(service).toBeTruthy();
|
||||
});
|
||||
});
|
||||
111
src/app/services/camera.service.ts
Normal file
111
src/app/services/camera.service.ts
Normal file
@ -0,0 +1,111 @@
|
||||
import { Injectable } from '@angular/core';
|
||||
import { DatePipe } from '@angular/common';
|
||||
import * as watermark from 'watermarkjs';
|
||||
|
||||
|
||||
@Injectable({
|
||||
providedIn: 'root'
|
||||
})
|
||||
export class CameraService {
|
||||
pipe = new DatePipe('en-US')
|
||||
constructor() {
|
||||
setTimeout(()=>{
|
||||
this.getPosition().then(res=>{
|
||||
console.log("geolocation",res)
|
||||
},err=>{
|
||||
console.log("Error in geo",err);
|
||||
})
|
||||
},2000)
|
||||
}
|
||||
addWatermarks(base64Img,geoCords?) {
|
||||
|
||||
return new Promise((resolve, reject) => {
|
||||
|
||||
// this.constant.getGeoTag().then(geoCoordinates => {
|
||||
// this.getPosition().then(geoCords=>{
|
||||
// console.log(geoCords);
|
||||
// this.geoCords = geoCoordinates
|
||||
// });
|
||||
// this.geoCords=localStorage.getItem('current_coordinates')
|
||||
// console.log("corrds",this.geoCords)
|
||||
let raw_img = base64Img
|
||||
var today = new Date();
|
||||
// let today_loc = today.toLocaleString('en-US', { timeZone: "Asia/Kolkata" })
|
||||
let today_loc=this.pipe.transform(today, 'yyyy-MM-dd, h:mm a')
|
||||
var date = today.getFullYear() + '-' + (today.getMonth() + 1) + '-' + today.getDate();
|
||||
// var time = today.getHours() + ":" + today.getMinutes() + ":" + today.getSeconds();
|
||||
var dateTime = 'Date : ' + today_loc;
|
||||
|
||||
console.log(date)
|
||||
|
||||
// fetch(raw_img)
|
||||
// .then(res => res.blob())
|
||||
// .then(blob => {
|
||||
watermark([raw_img, 'assets/images/PD_watermark.png'])
|
||||
.image(watermark.image.upperRight())
|
||||
.then(img => {
|
||||
raw_img = img.src;
|
||||
|
||||
let text = watermark.text
|
||||
watermark([raw_img])
|
||||
.image(text.upperLeft(dateTime, '19px sans-serif', '#ff0000', 1.0))
|
||||
// .image(text.upperLeft(dateTime, '20px sans-serif', '#ff0000', 1.0))
|
||||
.then(img => {
|
||||
raw_img = img.src;
|
||||
console.log("2d", raw_img)
|
||||
// resolve(img.src)
|
||||
console.log(geoCords)
|
||||
// let geoCoordinates = geoCords ? geoCords : '-'
|
||||
if(geoCords) {
|
||||
let Location = `Location : ` + geoCords
|
||||
watermark([raw_img])
|
||||
.image(text.upperLeft(Location, '19px sans-serif', '#ff0000', 1.0, 40 ))
|
||||
.then(img => {
|
||||
raw_img = img.src
|
||||
console.log("3rd", raw_img)
|
||||
resolve(img.src)
|
||||
// localStorage.removeItem('current_coordinates')
|
||||
});
|
||||
}
|
||||
else {
|
||||
resolve(img.src)
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
|
||||
// },err=>{
|
||||
// console.log("Error in geo",err);
|
||||
// switch(err.code) {
|
||||
// case 1:
|
||||
// alert("Geolocation permission is denied. Please allow the permission to capture");
|
||||
// break;
|
||||
// case 2:
|
||||
// alert("Do not get the geolocation of your place");
|
||||
// break;
|
||||
// case 2:
|
||||
// alert("Something went wrong");
|
||||
// break;
|
||||
// }
|
||||
// reject(err);
|
||||
// })
|
||||
})
|
||||
// });
|
||||
}
|
||||
getPosition(): Promise<any>
|
||||
{
|
||||
return new Promise((resolve, reject) => {
|
||||
|
||||
navigator.geolocation.getCurrentPosition(resp => {
|
||||
console.log("Geo",resp.coords);
|
||||
let latLong:string = resp.coords.latitude+', '+resp.coords.longitude
|
||||
// resolve({lng: resp.coords.longitude, lat: resp.coords.latitude});
|
||||
resolve(latLong)
|
||||
},
|
||||
err => {
|
||||
resolve('error');
|
||||
});
|
||||
});
|
||||
|
||||
}
|
||||
}
|
||||
16
src/app/services/data-service/data-service.service.spec.ts
Normal file
16
src/app/services/data-service/data-service.service.spec.ts
Normal file
@ -0,0 +1,16 @@
|
||||
import { TestBed } from '@angular/core/testing';
|
||||
|
||||
import { DataServiceService } from './data-service.service';
|
||||
|
||||
describe('DataServiceService', () => {
|
||||
let service: DataServiceService;
|
||||
|
||||
beforeEach(() => {
|
||||
TestBed.configureTestingModule({});
|
||||
service = TestBed.inject(DataServiceService);
|
||||
});
|
||||
|
||||
it('should be created', () => {
|
||||
expect(service).toBeTruthy();
|
||||
});
|
||||
});
|
||||
25
src/app/services/data-service/data-service.service.ts
Normal file
25
src/app/services/data-service/data-service.service.ts
Normal file
@ -0,0 +1,25 @@
|
||||
import { Injectable } from '@angular/core';
|
||||
export interface errorMsgInterface {
|
||||
title:string;
|
||||
subtitle:string;
|
||||
message:string;
|
||||
is_homebtn:boolean
|
||||
}
|
||||
@Injectable({
|
||||
providedIn: 'root'
|
||||
})
|
||||
export class DataServiceService {
|
||||
errorMsg:errorMsgInterface
|
||||
getPDImageData:any;
|
||||
constructor() {
|
||||
this.errorMsg ={
|
||||
title:"404",
|
||||
subtitle:'Not Found',
|
||||
message:'The requested URL is not found on the server',
|
||||
is_homebtn:false
|
||||
}
|
||||
}
|
||||
setErrorMsg(obj:errorMsgInterface) {
|
||||
this.errorMsg = obj
|
||||
}
|
||||
}
|
||||
16
src/app/services/guards/url-check.guard.spec.ts
Normal file
16
src/app/services/guards/url-check.guard.spec.ts
Normal file
@ -0,0 +1,16 @@
|
||||
import { TestBed } from '@angular/core/testing';
|
||||
|
||||
import { UrlCheckGuard } from './url-check.guard';
|
||||
|
||||
describe('UrlCheckGuard', () => {
|
||||
let guard: UrlCheckGuard;
|
||||
|
||||
beforeEach(() => {
|
||||
TestBed.configureTestingModule({});
|
||||
guard = TestBed.inject(UrlCheckGuard);
|
||||
});
|
||||
|
||||
it('should be created', () => {
|
||||
expect(guard).toBeTruthy();
|
||||
});
|
||||
});
|
||||
29
src/app/services/guards/url-check.guard.ts
Normal file
29
src/app/services/guards/url-check.guard.ts
Normal file
@ -0,0 +1,29 @@
|
||||
import { Injectable } from '@angular/core';
|
||||
import { CanActivate, ActivatedRouteSnapshot, RouterStateSnapshot, UrlTree, Router, ActivatedRoute } from '@angular/router';
|
||||
import { Observable } from 'rxjs';
|
||||
import { DataServiceService } from '../data-service/data-service.service';
|
||||
import { ApiServiceService } from '../api-service/api-service.service';
|
||||
// import { resolve } from 'url';
|
||||
// import { reject } from 'q';
|
||||
|
||||
@Injectable({
|
||||
providedIn: 'root'
|
||||
})
|
||||
export class UrlCheckGuard implements CanActivate {
|
||||
constructor(private router: Router, private actRoute:ActivatedRoute, private dataService: DataServiceService,private apiService:ApiServiceService) {}
|
||||
canActivate(
|
||||
next: ActivatedRouteSnapshot,
|
||||
state: RouterStateSnapshot): Observable<boolean | UrlTree> | Promise<boolean | UrlTree> | boolean | UrlTree {
|
||||
// this.router.navigateByUrl('error',{skipLocationChange:true});
|
||||
this.dataService.setErrorMsg({title:'404',subtitle:'Not Found',is_homebtn:false,message:'Url is Invalid. Contant info@pdgenie.com'})
|
||||
// console.log(this.actRoute.snapshot.paramMap.get('randomStr'));
|
||||
// console.log(this.actRoute.snapshot.paramMap.getAll('randomStr'))
|
||||
// return new Promise((resolve,reject)=>{
|
||||
// let params = {"pd_id":"","random_string":"nvngDBShJtLlpy5v"}
|
||||
|
||||
// })
|
||||
return true;
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
0
src/assets/.gitkeep
Normal file
0
src/assets/.gitkeep
Normal file
BIN
src/assets/images/1.jpg
Executable file
BIN
src/assets/images/1.jpg
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 78 KiB |
BIN
src/assets/images/2.jpg
Executable file
BIN
src/assets/images/2.jpg
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 102 KiB |
BIN
src/assets/images/3.jpg
Executable file
BIN
src/assets/images/3.jpg
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 58 KiB |
BIN
src/assets/images/4.jpg
Executable file
BIN
src/assets/images/4.jpg
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 70 KiB |
BIN
src/assets/images/PD.jpeg
Executable file
BIN
src/assets/images/PD.jpeg
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 40 KiB |
BIN
src/assets/images/PD_watermark.png
Executable file
BIN
src/assets/images/PD_watermark.png
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 2.3 KiB |
BIN
src/assets/images/about.jpg
Executable file
BIN
src/assets/images/about.jpg
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 137 KiB |
BIN
src/assets/images/avatar.jpg
Executable file
BIN
src/assets/images/avatar.jpg
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 8.2 KiB |
BIN
src/assets/images/bg-1.jpg
Executable file
BIN
src/assets/images/bg-1.jpg
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 23 KiB |
BIN
src/assets/images/bg-2.jpg
Executable file
BIN
src/assets/images/bg-2.jpg
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 20 KiB |
BIN
src/assets/images/bg-3.jpg
Executable file
BIN
src/assets/images/bg-3.jpg
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 26 KiB |
BIN
src/assets/images/bg-4.jpg
Executable file
BIN
src/assets/images/bg-4.jpg
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 40 KiB |
BIN
src/assets/images/bg-5.jpg
Executable file
BIN
src/assets/images/bg-5.jpg
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 62 KiB |
BIN
src/assets/images/bg.png
Executable file
BIN
src/assets/images/bg.png
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 1.3 KiB |
BIN
src/assets/images/blog-1.jpg
Executable file
BIN
src/assets/images/blog-1.jpg
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 134 KiB |
BIN
src/assets/images/blog-2.jpg
Executable file
BIN
src/assets/images/blog-2.jpg
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 323 KiB |
BIN
src/assets/images/contact.jpg
Executable file
BIN
src/assets/images/contact.jpg
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 714 KiB |
BIN
src/assets/images/coridoor.jpg
Executable file
BIN
src/assets/images/coridoor.jpg
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 194 KiB |
BIN
src/assets/images/curve.jpg
Executable file
BIN
src/assets/images/curve.jpg
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 257 KiB |
BIN
src/assets/images/defaultuserimage.png
Executable file
BIN
src/assets/images/defaultuserimage.png
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 16 KiB |
BIN
src/assets/images/face1.jpg
Executable file
BIN
src/assets/images/face1.jpg
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 127 KiB |
BIN
src/assets/images/face2.jpg
Executable file
BIN
src/assets/images/face2.jpg
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 195 KiB |
BIN
src/assets/images/face3.jpg
Executable file
BIN
src/assets/images/face3.jpg
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 128 KiB |
BIN
src/assets/images/face4.jpg
Executable file
BIN
src/assets/images/face4.jpg
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 5.8 KiB |
BIN
src/assets/images/face5.jpg
Executable file
BIN
src/assets/images/face5.jpg
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 7.8 KiB |
BIN
src/assets/images/face6.jpg
Executable file
BIN
src/assets/images/face6.jpg
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 3.6 KiB |
BIN
src/assets/images/face7.jpg
Executable file
BIN
src/assets/images/face7.jpg
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 5.0 KiB |
BIN
src/assets/images/flower.jpg
Executable file
BIN
src/assets/images/flower.jpg
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 225 KiB |
BIN
src/assets/images/flowers.jpg
Executable file
BIN
src/assets/images/flowers.jpg
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 231 KiB |
BIN
src/assets/images/green.jpg
Executable file
BIN
src/assets/images/green.jpg
Executable file
Binary file not shown.
|
After Width: | Height: | Size: 117 KiB |
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue
Block a user