Initial Commit
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
@ -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
@ -0,0 +1,3 @@
|
|||||||
|
{
|
||||||
|
"git.ignoreLimitWarning": true
|
||||||
|
}
|
||||||
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
@ -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
@ -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
@ -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
@ -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
@ -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
@ -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
@ -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
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
@ -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
@ -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
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
@ -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
@ -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
@ -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
@ -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
@ -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
@ -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
@ -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
@ -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
@ -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
@ -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
@ -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
@ -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
@ -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
@ -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
@ -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
@ -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
@ -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
@ -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
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
@ -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
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
@ -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
@ -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
@ -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
@ -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
@ -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
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
@ -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
@ -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
@ -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
@ -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
@ -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
@ -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
@ -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
@ -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
@ -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
@ -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
@ -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
@ -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
@ -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
@ -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
BIN
src/assets/images/1.jpg
Executable file
|
After Width: | Height: | Size: 78 KiB |
BIN
src/assets/images/2.jpg
Executable file
|
After Width: | Height: | Size: 102 KiB |
BIN
src/assets/images/3.jpg
Executable file
|
After Width: | Height: | Size: 58 KiB |
BIN
src/assets/images/4.jpg
Executable file
|
After Width: | Height: | Size: 70 KiB |
BIN
src/assets/images/PD.jpeg
Executable file
|
After Width: | Height: | Size: 40 KiB |
BIN
src/assets/images/PD_watermark.png
Executable file
|
After Width: | Height: | Size: 2.3 KiB |
BIN
src/assets/images/about.jpg
Executable file
|
After Width: | Height: | Size: 137 KiB |
BIN
src/assets/images/avatar.jpg
Executable file
|
After Width: | Height: | Size: 8.2 KiB |
BIN
src/assets/images/bg-1.jpg
Executable file
|
After Width: | Height: | Size: 23 KiB |
BIN
src/assets/images/bg-2.jpg
Executable file
|
After Width: | Height: | Size: 20 KiB |
BIN
src/assets/images/bg-3.jpg
Executable file
|
After Width: | Height: | Size: 26 KiB |
BIN
src/assets/images/bg-4.jpg
Executable file
|
After Width: | Height: | Size: 40 KiB |
BIN
src/assets/images/bg-5.jpg
Executable file
|
After Width: | Height: | Size: 62 KiB |
BIN
src/assets/images/bg.png
Executable file
|
After Width: | Height: | Size: 1.3 KiB |
BIN
src/assets/images/blog-1.jpg
Executable file
|
After Width: | Height: | Size: 134 KiB |
BIN
src/assets/images/blog-2.jpg
Executable file
|
After Width: | Height: | Size: 323 KiB |
BIN
src/assets/images/contact.jpg
Executable file
|
After Width: | Height: | Size: 714 KiB |
BIN
src/assets/images/coridoor.jpg
Executable file
|
After Width: | Height: | Size: 194 KiB |
BIN
src/assets/images/curve.jpg
Executable file
|
After Width: | Height: | Size: 257 KiB |
BIN
src/assets/images/defaultuserimage.png
Executable file
|
After Width: | Height: | Size: 16 KiB |
BIN
src/assets/images/face1.jpg
Executable file
|
After Width: | Height: | Size: 127 KiB |
BIN
src/assets/images/face2.jpg
Executable file
|
After Width: | Height: | Size: 195 KiB |
BIN
src/assets/images/face3.jpg
Executable file
|
After Width: | Height: | Size: 128 KiB |
BIN
src/assets/images/face4.jpg
Executable file
|
After Width: | Height: | Size: 5.8 KiB |
BIN
src/assets/images/face5.jpg
Executable file
|
After Width: | Height: | Size: 7.8 KiB |
BIN
src/assets/images/face6.jpg
Executable file
|
After Width: | Height: | Size: 3.6 KiB |
BIN
src/assets/images/face7.jpg
Executable file
|
After Width: | Height: | Size: 5.0 KiB |
BIN
src/assets/images/flower.jpg
Executable file
|
After Width: | Height: | Size: 225 KiB |
BIN
src/assets/images/flowers.jpg
Executable file
|
After Width: | Height: | Size: 231 KiB |
BIN
src/assets/images/green.jpg
Executable file
|
After Width: | Height: | Size: 117 KiB |