Prudence_Creole
/
AssistDB_V2_Front
3
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

fix responsive

Browse Source
version_2
floxx2112 1 year ago
parent 5d2a682744
commit 45c5f85a62
7 changed files with 43 additions and 37 deletions
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Show Stats Download Patch File Download Diff File
  1. 4
      src/app/create-joins-page/create-joins-page.component.html
  2. 9
      src/app/create-joins-page/create-joins-page.component.ts
  3. 21
      src/app/landing-page/landing-page.component.html
  4. 16
      src/app/navbar/navbar.component.html
  5. 21
      src/app/script-management/script-management.component.html
  6. 4
      src/app/script-management/script-management.component.ts
  7. 1
      src/assets/svg/arrows.svg

4
src/app/create-joins-page/create-joins-page.component.html
Unescape View File

@ -43,7 +43,7 @@
<div *ngIf="baseTableName">
<div *ngFor="let hop of requestInfoJoin; index as i" >
<app-joins-table [allAlias]="aliasData" [passJoinData]="allData[i]" (data)="retrieveData($event, i)" id="{{hop}}"></app-joins-table>
<div class="flex inline-flex space-x-4">
<div class="sm:inline-flex sm:space-x-4">
<button (click)="addTable()" type="button" class="text-white bg-gradient-to-br from-pink-500 to-orange-400 hover:bg-gradient-to-bl focus:ring-4 focus:outline-none focus:ring-pink-200 font-medium rounded-lg text-sm px-5 py-2.5 text-center mr-2 mb-2">Ajouter une Jointure</button>
<button *ngIf="!oneJoinRemaining" (click)="removeTable(i)" type="button" class="text-gray-900 bg-gradient-to-r from-red-200 via-red-300 to-yellow-200 hover:bg-gradient-to-bl focus:ring-4 focus:outline-none focus:ring-red-100 font-medium rounded-lg text-sm px-5 py-2.5 text-center mr-2 mb-2">Supprimer cette jointure</button>
@ -56,7 +56,7 @@
<div *ngIf="whereCardList.length != 0">
<div *ngFor="let whereCards of whereCardList; index as i" >
<app-where-card [allAlias]="aliasData" [childIndex]="i" id="{{whereCards}}" (conditionData)="getConditionData($event, i)"></app-where-card>
<div class="flex inline-flex space-x-4">
<div class="sm:inline-flex sm:space-x-4">
<button (click)="addCondition()" type="button" class="text-white bg-gradient-to-br from-green-400 to-blue-600 hover:bg-gradient-to-bl focus:ring-4 focus:outline-none focus:ring-green-200 font-medium rounded-lg text-sm px-5 py-2.5 text-center mr-2 mb-2">Ajouter une Condition</button>
<button (click)="removeWhereCard(i)" type="button" class="text-white bg-gradient-to-r from-cyan-500 to-blue-500 hover:bg-gradient-to-bl focus:ring-4 focus:outline-none focus:ring-cyan-300 font-medium rounded-lg text-sm px-5 py-2.5 text-center mr-2 mb-2">Supprimer cette Condition</button>

9
src/app/create-joins-page/create-joins-page.component.ts
Unescape View File

@ -9,7 +9,6 @@ import { Join } from '../model/join';
import { Alias } from '../model/alias';
import { WhereCardComponent } from '../where-card/where-card.component';
import { Condition } from '../model/condition';
import { ColumnData } from '../model/column-data';
import { ClipboardModule } from '@angular/cdk/clipboard';
import { MatIconRegistry } from '@angular/material/icon';
import { DomSanitizer } from '@angular/platform-browser';
@ -441,10 +440,8 @@ export class CreateJoinsPageComponent implements OnInit, AfterViewInit{
}
public checkValue(event: any){
if(this.isChecked){
this.tablesByBaseSchema = this.tablesByBaseSchemaAll;
} else {
this.tablesByBaseSchema = this.tablesByBaseSchemaNoViews;
}
this.tablesByBaseSchema = this.isChecked ?
this.tablesByBaseSchemaAll
: this.tablesByBaseSchemaNoViews;
}
}

21
src/app/landing-page/landing-page.component.html
Unescape View File

@ -1,17 +1,24 @@
<div class="grid grid-cols-2 gap-4">
<div class="text-justify text-white">
<div class="mx-auto">
<img src="assets/images/logo-apsidetop-blanc.png" alt="Apside logo" class="mx-auto">
<div class="text-center text-lg text-white">Produit créé par APSIDE TOP</div>
</div>
<div class="text-center text-white my-4">
<p>Cette application, AssistDB a pour objectif de vous aider à rechercher des informations, créer des jointures et gérer un ensemble de scripts et de requêtes de manière centralisée entre tous les membres de l'équipe.</p>
<p class="mt-4">L'application est composée de plusieurs pages correspondant à des fonctionnalités bien disctintes :</p>
</div>
<div class="grid md:grid-cols-2 gap-4">
<div class="text-justify text-white">
<p class="mt-2">-|- La page de Recherche : Permet de récupérer les informations d'une ou plusieurs colonnes spécifiques.</p>
<p class="mt-2">-|- La page de Jointures : Permet de générer automatiquement des jointures entre des tables possédant des colonnes identiques.</p>
</div>
<div class="text-justify text-white">
<p class="mt-2">-|- La page de Création : Permet de créer des requêtes SQL complexes avec des jointures sur plusieurs colonnes ainsi que des conditions.</p>
<p class="mt-2">-|- La page de Gestionnaire : Permet de voir, ajouter, modifier et supprimer des scripts ou requêtes. Un système de Tags permet aussi une classification et une catégorisation complète. Les tags peuvent aussi être ajoutés, modifiés et supprimés. L'ensemble de cette page est actualisé et centralisé via GitHub pour l'ensemble des utilisateurs de l'application.
</p>
</div>
<div class="my-auto">
<img src="assets/images/logo-apsidetop-blanc.png" alt="Apside logo">
<div class="text-center text-white">Produit créé par APSIDE TOP</div>
</div>
</div>

16
src/app/navbar/navbar.component.html
Unescape View File

@ -1,8 +1,8 @@
<nav class="sticky top-0 left-0 right-0 z-50 bg-slate-900 hover:border-solid hover:border-b-2 hover:border-white border-b-2 border-slate-900 hover:ease-in-out duration-300">
<div class="mx-auto max-w-7xl px-2 sm:px-6 lg:px-8">
<div class="mx-auto max-w-7xl px-2 md:px-6 lg:px-8">
<div class="relative flex h-16 items-center justify-between">
<div class="absolute inset-y-0 left-0 flex items-center sm:hidden">
<div class="absolute inset-y-0 left-0 flex items-center md:hidden">
<!-- Mobile menu button-->
<button type="button" class="inline-flex items-center justify-center rounded-md p-2 text-gray-400 hover:bg-gray-700 hover:text-white focus:outline-none focus:ring-2 focus:ring-inset focus:ring-white" aria-controls="mobile-menu" aria-expanded="false">
<svg (click)="openMobileMenu()" class="block h-6 w-6" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" aria-hidden="true">
@ -10,12 +10,12 @@
</svg>
</button>
</div>
<div class="flex flex-1 items-center justify-center sm:items-stretch sm:justify-start">
<div class="flex flex-1 items-center justify-center md:items-stretch md:justify-start">
<div class="flex flex-shrink-0 items-center">
<img routerLink="" class="block h-8 w-auto lg:hidden hover:cursor-pointer" src="../../assets/images/logo-apsidetop-blanc.png" alt="Your Company">
<img routerLink="" class="hidden h-8 w-auto lg:block hover:cursor-pointer" src="../../assets/images/logo-apsidetop-blanc.png" alt="Your Company">
</div>
<div class="hidden sm:ml-6 sm:block" id="extend-menu">
<div class="hidden md:ml-6 md:block" id="extend-menu">
<div class="flex space-x-4">
<a routerLinkActive="active" routerLink="request" class="text-gray-300 hover:bg-gray-700 hover:text-white px-3 py-2 rounded-md text-sm font-medium ">Recherche</a>
@ -32,7 +32,7 @@
</div>
</div>
</div>
<div class="absolute inset-y-0 right-0 flex items-center pr-2 sm:static sm:inset-auto sm:ml-6 sm:pr-0">
<div class="absolute inset-y-0 right-0 flex items-center pr-2 md:static md:inset-auto md:ml-6 md:pr-0">
<!-- Profile dropdown -->
<div class="relative ml-3">
@ -47,14 +47,16 @@
</div>
<!-- Mobile menu, show/hide based on menu state. -->
<div *ngIf="mobileOpen" class="sm:hidden" id="mobile-menu">
<div *ngIf="mobileOpen" class="md:hidden" id="mobile-menu">
<div class="space-y-1 px-2 pt-2 pb-3">
<!-- Current: "bg-gray-900 text-white", Default: "text-gray-300 hover:bg-gray-700 hover:text-white" -->
<a routerLink="request" class="text-gray-300 hover:bg-gray-700 hover:text-white block px-3 py-2 rounded-md text-base font-medium">Recherche</a>
<a routerLink="joins" class="text-gray-300 hover:bg-gray-700 hover:text-white block px-3 py-2 rounded-md text-base font-medium">Jointures</a>
<a href="#" class="text-gray-300 hover:bg-gray-700 hover:text-white block px-3 py-2 rounded-md text-base font-medium">Calendar</a>
<a routerLink="createjoins" class="text-gray-300 hover:bg-gray-700 hover:text-white block px-3 py-2 rounded-md text-base font-medium">Création</a>
<a routerLink="scriptmanagement" class="text-gray-300 hover:bg-gray-700 hover:text-white block px-3 py-2 rounded-md text-base font-medium">Gestionnaire</a>
<button (click)="applyResetDatabase()" class="ml-2 text-white bg-orange-400 hover:bg-gray-700 hover:text-white px-3 py-2 rounded-md text-sm font-medium hover:animate-pulse">MAJ BDD</button>

21
src/app/script-management/script-management.component.html
Unescape View File

@ -1,21 +1,20 @@
<div class="max-w-full rounded-2xl overflow-hidden shadow-lg bg-white">
<div class="m-2 grid grid-cols-12 gap-4 justify-items-center">
<div class="col-span-3 my-auto ">
<div class="m-2 justify-items-center grid grid-cols-1 sm:grid-cols-12 gap-4 ">
<div class="sm:col-span-3 my-auto">
<button class="flex text-white bg-gradient-to-br from-purple-600 to-blue-500 hover:bg-gradient-to-bl focus:ring-4 focus:outline-none focus:ring-blue-300 font-semibold py-2 px-4 rounded shadow m-2" (click)="getAllScriptsWithTags(); getAllScripts()">Rafraichir</button>
</div>
<div class="col-span-6 my-auto text-2xl font-bold">
|| Gestionnaire de Scripts ||
<div class="sm:col-span-6 my-auto text-2xl font-bold">
Gestionnaire de Scripts
</div>
<div class="col-span-3 my-auto flex">
<a routerLink="/tagsmanagement" class="flex text-black bg-gradient-to-r from-red-200 via-red-300 to-yellow-200 hover:bg-gradient-to-bl focus:ring-4 focus:outline-none focus:ring-red-100 dark:focus:ring-red-400 font-semibold py-2 px-4 rounded shadow m-2" >Gérer les Tags</a>
<div class="sm:col-span-3 my-auto md:flex">
<a routerLink="/tagsmanagement" class="flex text-black text-center bg-gradient-to-r from-red-200 via-red-300 to-yellow-200 hover:bg-gradient-to-bl focus:ring-4 focus:outline-none focus:ring-red-100 dark:focus:ring-red-400 font-semibold py-2 px-4 rounded shadow m-2" >Gérer les Tags</a>
<button (click)="addScript()" class="flex text-black bg-gradient-to-r from-red-200 via-red-300 to-yellow-200 hover:bg-gradient-to-bl focus:ring-4 focus:outline-none focus:ring-red-100 dark:focus:ring-red-400 font-semibold py-2 px-4 rounded shadow m-2" >Ajouter un Script</button>
</div>
</div>
</div>
<div class="max-w-full rounded-2xl overflow-hidden shadow-lg bg-white my-4 p-4">
<div class="grid grid-cols-3 gap-4">
<div class="grid grid-cols-1 md:grid-cols-3 md:gap-4">
<div class="col-span-2 rounded-lg overflow-hidden shadow-lg bg-slate-100 border-solid border-orange-400 border-2 p-4">
<div class="flex space-x-2">
<input [(ngModel)]="filterScriptName" type="text" class="block w-full my-2 pl-2 text-sm text-gray-900 border border-gray-300 rounded-lg bg-gray-50 focus:ring-slate-800 focus:border-slate-800" (ngModelChange)="sortWithFilter()" placeholder="Rechercher par nom ou description...">
@ -35,10 +34,10 @@
</ng-multiselect-dropdown>
</div>
<div class="overflow-y-auto h-96">
<div class="grid grid-cols-2">
<div class="grid grid-cols-1 md:grid-cols-2">
<div *ngFor="let script of allScripts, index as i" class="grid grid-cols-2 rounded-2xl overflow-hidden shadow-lg bg-gray-300 p-4 m-2 " (click)="displayText(script)">
<div class="flex justify-start">
<div class="font-bold font-mono mr-2 text-lg rounded-full overflow-hidden shadow-lg bg-green-300 p-2">
<div class="hidden xl:block font-bold font-mono mr-2 text-lg rounded-full overflow-hidden shadow-lg bg-green-300 p-2">
{{script.extension}}
</div>
<div class="my-auto font-bold ">
@ -54,7 +53,7 @@
</div>
</div>
<div>
<div class="mt-4 md:mt-0">
<cdk-accordion>

4
src/app/script-management/script-management.component.ts
Unescape View File

@ -16,7 +16,6 @@ import { LinkScriptTag } from '../model/link-script-tag';
styleUrls: ['./script-management.component.scss']
})
export class ScriptManagementComponent implements OnInit {
listScript: String[] = ['INNER JOIN', 'LEFT JOIN', 'RIGHT JOIN', 'FULL JOIN', 'LEFT JOIN', 'RIGHT JOIN', 'FULL JOIN', 'LEFT JOIN', 'RIGHT JOIN', 'FULL JOIN', 'LEFT JOIN', 'RIGHT JOIN', 'FULL JOIN'];
textTo: String | undefined;
descText: String | undefined;
tagsListOfSpecScript: String[] | undefined;
@ -39,7 +38,8 @@ export class ScriptManagementComponent implements OnInit {
private domSanitizer: DomSanitizer
){
this.matIconRegistry.addSvgIcon('edit', this.domSanitizer.bypassSecurityTrustResourceUrl('../../assets/svg/edit.svg')),
this.matIconRegistry.addSvgIcon('trash', this.domSanitizer.bypassSecurityTrustResourceUrl('../../assets/svg/trash.svg'))
this.matIconRegistry.addSvgIcon('trash', this.domSanitizer.bypassSecurityTrustResourceUrl('../../assets/svg/trash.svg')),
this.matIconRegistry.addSvgIcon('refresh', this.domSanitizer.bypassSecurityTrustResourceUrl('../../assets/svg/arrows.svg'))
}

1
src/assets/svg/arrows.svg
Unescape View File

@ -0,0 +1 @@
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--! Font Awesome Pro 6.4.0 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) Copyright 2023 Fonticons, Inc. --><path d="M105.1 202.6c7.7-21.8 20.2-42.3 37.8-59.8c62.5-62.5 163.8-62.5 226.3 0L386.3 160H336c-17.7 0-32 14.3-32 32s14.3 32 32 32H463.5c0 0 0 0 0 0h.4c17.7 0 32-14.3 32-32V64c0-17.7-14.3-32-32-32s-32 14.3-32 32v51.2L414.4 97.6c-87.5-87.5-229.3-87.5-316.8 0C73.2 122 55.6 150.7 44.8 181.4c-5.9 16.7 2.9 34.9 19.5 40.8s34.9-2.9 40.8-19.5zM39 289.3c-5 1.5-9.8 4.2-13.7 8.2c-4 4-6.7 8.8-8.1 14c-.3 1.2-.6 2.5-.8 3.8c-.3 1.7-.4 3.4-.4 5.1V448c0 17.7 14.3 32 32 32s32-14.3 32-32V396.9l17.6 17.5 0 0c87.5 87.4 229.3 87.4 316.7 0c24.4-24.4 42.1-53.1 52.9-83.7c5.9-16.7-2.9-34.9-19.5-40.8s-34.9 2.9-40.8 19.5c-7.7 21.8-20.2 42.3-37.8 59.8c-62.5 62.5-163.8 62.5-226.3 0l-.1-.1L125.6 352H176c17.7 0 32-14.3 32-32s-14.3-32-32-32H48.4c-1.6 0-3.2 .1-4.8 .3s-3.1 .5-4.6 1z"/></svg>
Side by Side

After

Width:  |  Height:  |  Size: 996 B

Write Preview
Loading…
Cancel
Save