浏览代码

HUE-9381. ERD - Add className based styling for each entity (sree)

sreenaths 5 年之前
父节点
当前提交
cf7e3ccb03

+ 1 - 1
desktop/core/src/desktop/js/components/er-diagram/comps/literal-entity.vue

@@ -17,7 +17,7 @@
 -->
 
 <template>
-  <div class="literal-entity">
+  <div :class="`literal-entity ${entity.className || ''}`">
     <div class="left-point" />
     <div class="right-point" />
     <div class="literal-value">

+ 2 - 2
desktop/core/src/desktop/js/components/er-diagram/comps/table-entity.vue

@@ -17,7 +17,7 @@
 -->
 
 <template>
-  <div class="table-entity">
+  <div :class="`table-entity ${entity.className || ''}`">
     <div :title="entity.database" class="db-name">
       {{ entity.database }}
     </div>
@@ -32,7 +32,7 @@
         :key="column.id"
         :data-entity-id="column.id"
         :title="column.name"
-        class="column-entity"
+        :class="`column-entity ${column.className || ''}`"
       >
         <div class="left-point" />
         <div class="right-point" />

+ 1 - 1
desktop/core/src/desktop/js/components/er-diagram/index.vue

@@ -20,7 +20,7 @@
   <div class="er-diagram">
     <div class="buttons-panel">
       <button class="btn btn-default btn-sm" title="Toggle Fullscreen" @click="toggleFS">
-        <expand-icon class="fa fa-expand" />
+        <expand-icon v-pre class="fa fa-expand" />
       </button>
     </div>
 

+ 6 - 0
desktop/core/src/desktop/js/components/er-diagram/lib/entities.ts

@@ -27,6 +27,8 @@ export class Table implements IEntity {
   name: string;
   columns: Array<Column>;
 
+  className: string;
+
   constructor(database: string, name: string, columns: Array<Column>) {
     this.id = Table.buildId(database, name);
     this.database = database;
@@ -46,6 +48,8 @@ export class Column implements IEntity {
   tableId: string;
   name: string;
 
+  className: string;
+
   constructor(tableId: string, name: string) {
     this.id = Column.buildId(tableId, name);
     this.tableId = tableId;
@@ -63,6 +67,8 @@ export class Literal implements IEntity {
 
   value: string;
 
+  className: string;
+
   constructor(value: string) {
     this.id = value;
     this.value = value;

+ 2 - 0
desktop/core/src/desktop/js/components/er-diagram/lib/interfaces.ts

@@ -21,6 +21,8 @@ import { EntityTypes } from './enums';
 export interface IEntity {
   readonly id: string;
   readonly type: EntityTypes;
+
+  className: string;
 }
 
 export interface IRelation {