@tririga/tri-template/lib/templates/ic-people/ic-people-profile.html

A simple tool for generating IBM TRIRIGA UX view skeletons from available templates.

<!-- IBM Confidential‌ - OCO Source Materials‌ - (C) COPYRIGHT IBM CORP. 2017 - The source code for this program is not published or otherwise‌ divested of its trade secrets, irrespective of what has been‌ deposited with the U.S. Copyright Office. -->

<link rel="import" href="../triplat-ds/triplat-ds.html">
<link rel="import" href="../triblock-popup/triblock-popup.html">
<link rel="import" href="../triblock-responsive-layout/triblock-view-responsive-behavior.html">
<link rel="import" href="../triplat-routing/triplat-routing.html">

<link rel="import" href="../paper-button/paper-button.html">

<link rel="import" href="ic-person-form.html">
<link rel="import" href="ic-people-shared-styles.html">

<dom-module is="ic-person-profile">
<template>
	<style include="ic-person-profile-styles">	
	</style>

	<triplat-route id="personProfileRoute" name="personProfile" params="{{personParams}}"></triplat-route>

	<triplat-ds id="personDs" name="person" data="{{person}}"> 
		<triplat-ds-instance instance-id="{{personParams.personId}}"></triplat-ds-instance>
	</triplat-ds>

	<triplat-ds id="spaceDs" name="space" data="{{space}}">
     		<triplat-ds-context name="person" context-id="{{person._id}}"></triplat-ds-context>
 	</triplat-ds>

	<div class="info-container">
		<div class="page-header">
			<div class="tri-h2">Person Information</div>
			<div class="action-bar previewBtn">
				<paper-button on-tap="_previewBeforeSave">Preview</paper-button>
			</div>
		</div>		
		<ic-person-form person="{{person}}" space="[[space]]" editable></ic-person-form>
	</div>
	
	<triblock-popup id="previewDialog" modal title="Preview before save">
		<div>
			<span class="page-header tri-h2">Preview before save</span>
		</div>
		<ic-person-form person="[[person]]"></ic-person-form>
		<div class="action-bar">
			<paper-button class="updateBtn"  dialog-confirm autofocus on-tap="_update">Update</paper-button>
			<paper-button class="cancelBtn"  dialog-dismiss autofocus>Cancel</paper-button>
		</div>
	</triblock-popup>
	
	<!-- work-around for the action-bar component -->
	<div class="action-bar-space"></div>
</template>
</dom-module>
<script>
	Polymer({
		is: "ic-person-profile",
        
        behaviors: [
			TriBlockViewResponsiveBehavior,
		],

        _previewBeforeSave: function(){
        	this.$.previewDialog.openPopup();
        },

        _update: function(){
        	this.$.personDs.updateRecord("actions", "update");
        	this.fire("record-is-updated");
        },

	});
</script>