Worked out a better way to handle the phrases in the words table

This commit is contained in:
Leonard Smith 2021-05-05 20:26:21 -05:00
parent fb7c8f193b
commit 24fca6f8b9
5 changed files with 31 additions and 17 deletions

View File

@ -1,14 +1,7 @@
{{#each this.phraseWords as |pw|}}
{{#if pw.rootRow}}
<tr class="{{this.selected}}" ...attributes>
<td rowspan="{{this.rowCount}}">{{pw.ulb}}</td>
<td>{{pw.greek}}</td>
<td>{{pw.morph}}</td>
</tr>
<Words::WordRow @model={{pw}} @rowspan={{this.rowCount}} />
{{else}}
<tr {{on "click" (fn this.select pw)}} class="{{this.selected}}" ...attributes>
<td>{{pw.greek}}</td>
<td>{{pw.morph}}</td>
</tr>
<Words::WordRow @model={{pw}} @isPartial={{true}} />
{{/if}}
{{/each}}

View File

@ -1,7 +1,8 @@
import WordsWordRowComponent from "./word-row";
import Component from '@glimmer/component';
import { tracked } from "@glimmer/tracking";
export default class WordsPhraseRowComponent extends WordsWordRowComponent {
export default class WordsPhraseRowComponent extends Component {
@tracked phraseWords = [];
constructor(...args) {

View File

@ -1,5 +1,15 @@
<tr {{on "click" (fn this.select @model)}} class="{{this.selected}}" ...attributes>
<td>{{@model.ulb}}</td>
<td>{{@model.greek}}</td>
<td>{{@model.morph}}</td>
</tr>
{{#if @model.rootRow}}
<tr {{on "click" (fn this.select @model)}} ...attributes>
<td rowspan="{{@rowspan}}">{{@model.ulb}}</td>
<td class="{{this.selected}}">{{@model.greek}}</td>
<td class="{{this.selected}}">{{@model.morph}}</td>
</tr>
{{else}}
<tr {{on "click" (fn this.select @model)}} class="{{this.selected}}" ...attributes>
{{#if this.isNotPhrasePartial}}
<td>{{@model.ulb}}</td>
{{/if}}
<td>{{@model.greek}}</td>
<td>{{@model.morph}}</td>
</tr>
{{/if}}

View File

@ -21,4 +21,13 @@ export default class WordsWordRowComponent extends Component {
return "";
}
}
get
isNotPhrasePartial() {
if (this.args.isPartial == true) {
return false;
} else {
return true;
}
}
}

View File

@ -9,7 +9,8 @@ table.word-details td {
cursor: pointer;
}
table.word-details tr.selected {
table.word-details tr.selected,
table.word-details td.selected {
background-color: lightblue;
}