-
Notifications
You must be signed in to change notification settings - Fork 129
Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
Merge pull request #6983 from deutschebank/db-contrib/waltz-6820-prim…
…ary-ratings-to-app-overview Db contrib/waltz 6820 primary ratings to app overview
- Loading branch information
Showing
7 changed files
with
204 additions
and
21 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
107 changes: 107 additions & 0 deletions
107
waltz-ng/client/measurable-rating/svelte/PrimaryRatingOverviewSubSection.svelte
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,107 @@ | ||
<script> | ||
import SubSection from "../../common/svelte/SubSection.svelte"; | ||
import {measurableRatingStore} from "../../svelte-stores/measurable-rating-store"; | ||
import {mkSelectionOptions} from "../../common/selector-utils"; | ||
import _ from "lodash"; | ||
import RatingIndicatorCell from "../../ratings/components/rating-indicator-cell/RatingIndicatorCell.svelte"; | ||
import Icon from "../../common/svelte/Icon.svelte"; | ||
import {activeSections} from "../../dynamic-section/section-store"; | ||
import {dynamicSections} from "../../dynamic-section/dynamic-section-definitions"; | ||
import Tooltip from "../../common/svelte/Tooltip.svelte"; | ||
import PrimaryRatingTooltipContent from "./PrimaryRatingTooltipContent.svelte"; | ||
export let parentEntityRef; | ||
let primaryRatingsCall; | ||
let measurablesById = {}; | ||
let categoriesById = {}; | ||
let ratingsById = {}; | ||
$: { | ||
if(parentEntityRef) { | ||
const opts = mkSelectionOptions(parentEntityRef); | ||
primaryRatingsCall = measurableRatingStore.getPrimaryRatingsViewBySelector(opts); | ||
} | ||
} | ||
$: primaryRatingsView = $primaryRatingsCall?.data; | ||
$: { | ||
if(primaryRatingsView){ | ||
measurablesById = _.keyBy(primaryRatingsView.measurables, d => d.id); | ||
categoriesById = _.keyBy(primaryRatingsView.measurableCategories, d => d.id); | ||
ratingsById = _.keyBy(primaryRatingsView.ratingSchemeItems, d => d.id); | ||
} | ||
} | ||
$: ratingsRows = _ | ||
.chain(primaryRatingsView?.measurableRatings || []) | ||
.map(d => { | ||
const measurable = measurablesById[d?.measurableId]; | ||
const category = categoriesById[measurable?.categoryId]; | ||
const ratingSchemeItem = ratingsById[d.ratingId]; | ||
return { | ||
rating: d, | ||
measurable, | ||
category, | ||
ratingSchemeItem | ||
} | ||
}) | ||
.orderBy(["category.position", "category.name"]) | ||
.value(); | ||
function mkRatingTooltipProps(row) { | ||
return { | ||
rating: row.rating, | ||
ratingSchemeItem: row.ratingSchemeItem, | ||
measurable: row.measurable | ||
} | ||
} | ||
</script> | ||
<SubSection> | ||
<div slot="header"> | ||
Primary Viewpoint Ratings | ||
</div> | ||
<div slot="content"> | ||
{#if !_.isEmpty(primaryRatingsView?.measurableRatings)} | ||
<table class="waltz-field-table waltz-field-table-border" style="width: 100%"> | ||
<tbody> | ||
{#each ratingsRows as rating} | ||
<tr> | ||
<td class="wft-label" style="padding: 3px; width: 30%"> | ||
{_.get(rating, ["category", "name"], "Unknown Category")} | ||
</td> | ||
<td style="padding: 3px 6px; width: 70%"> | ||
<Tooltip content={PrimaryRatingTooltipContent} | ||
placement="left-start" | ||
props={mkRatingTooltipProps(rating)}> | ||
<svelte:fragment slot="target"> | ||
<RatingIndicatorCell {...rating.ratingSchemeItem} | ||
showName={false}/> | ||
{_.get(rating, ["measurable", "name"], "Unknown Measurable")} | ||
</svelte:fragment> | ||
</Tooltip> | ||
</td> | ||
</tr> | ||
{/each} | ||
</tbody> | ||
</table> | ||
{:else} | ||
<div class="help-block"> | ||
<Icon name="info-circle"/> No primary ratings have been set for this application | ||
</div> | ||
{/if} | ||
</div> | ||
<div slot="controls"> | ||
<span class="small pull-right"> | ||
<button class="btn btn-skinny btn-sm" | ||
on:click={() => activeSections.add(dynamicSections.measurableRatingAppSection)}> | ||
More | ||
</button> | ||
</span> | ||
</div> | ||
</SubSection> |
40 changes: 40 additions & 0 deletions
40
waltz-ng/client/measurable-rating/svelte/PrimaryRatingTooltipContent.svelte
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,40 @@ | ||
<script> | ||
import DescriptionFade from "../../common/svelte/DescriptionFade.svelte"; | ||
import RatingIndicatorCell from "../../ratings/components/rating-indicator-cell/RatingIndicatorCell.svelte"; | ||
export let rating; | ||
export let ratingSchemeItem; | ||
export let measurable; | ||
</script> | ||
|
||
|
||
{#if measurable} | ||
<div> | ||
<h4>{measurable.name}</h4> | ||
<span class="text-muted">{measurable.externalId}</span> | ||
<DescriptionFade text={measurable.description}/> | ||
</div> | ||
<hr> | ||
{/if} | ||
|
||
<div> | ||
<RatingIndicatorCell {...ratingSchemeItem} | ||
showName={true}/> | ||
<div> | ||
{ratingSchemeItem.description} | ||
</div> | ||
</div> | ||
|
||
{#if rating.description} | ||
<hr> | ||
<div> | ||
<div> | ||
Rating Comment: | ||
</div> | ||
<DescriptionFade text={rating.description || ""}/> | ||
</div> | ||
{:else } | ||
<br> | ||
{/if} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters