Convenios

1<#macro treeview_item 

2	cssClassTreeItem = "" 

3	frequency = 0 

4	id = "" 

5	frequencyVisible = true 

6	name = "" 

7	selectable = false 

8	selected = false 

9	termDisplayContexts = "" 

10> 

11	<li class="treeview-item" role="none"> 

12		<#if name?has_content> 

13			<div 

14				aria-controls="${namespace}treeItem${id}" 

15				aria-expanded="true" 

16				class="treeview-link ${cssClassTreeItem}" 

17				data-target="#${namespace}treeItem${id}" 

18				data-toggle="collapse" 

19				onClick="${namespace}toggleTreeItem('${namespace}treeItem${id}');" 

20				role="treeitem" 

21				tabindex="0" 

22			> 

23				<span class="c-inner" tabindex="-2"> 

24					<span class="autofit-row"> 

25						<#if termDisplayContexts?has_content> 

26							<span class="autofit-col"> 

27								<button 

28									aria-controls="${namespace}treeItem${id}" 

29									aria-expanded="true" 

30									class="btn btn-monospaced component-expander" 

31									data-target="#${namespace}treeItem${id}" 

32									data-toggle="collapse" 

33									tabindex="-1" 

34									type="button" 

35								> 

36									<span class="c-inner" tabindex="-2"> 

37										<@clay["icon"] symbol="angle-down" /> 

38 

39										<@clay["icon"] 

40											cssClass="component-expanded-d-none" 

41											symbol="angle-right" 

42										/> 

43									</span> 

44								</button> 

45							</span> 

46						</#if> 

47 

48						<#if selectable> 

49							<div class="autofit-col autofit-col-expand"> 

50								<div class="custom-checkbox custom-control"> 

51									<label> 

52										<input 

53											${selected?then("checked", "")} 

54											class="custom-control-input facet-term" 

55											data-term-id=${id} 

56											disabled 

57											onChange="Liferay.Search.FacetUtil.changeSelection(event);" 

58											type="checkbox" 

59										/> 

60 

61										<span class="custom-control-label"> 

62											<span class="custom-control-label-text"> 

63												${name} 

64 

65												<#if frequencyVisible> 

66													(${frequency}) 

67												</#if> 

68											</span> 

69										</span> 

70									</label> 

71								</div> 

72							</div> 

73						<#else> 

74							<span class="autofit-col autofit-col-expand"> 

75								<span class="component-text"> 

76									<span 

77										class="text-truncate-inline" 

78										title="${name}" 

79									> 

80										<span class="text-truncate"> 

81											${name} 

82 

83											<#if frequencyVisible> 

84												(${frequency}) 

85											</#if> 

86										</span> 

87									</span> 

88								</span> 

89							</span> 

90						</#if> 

91					</span> 

92				</span> 

93			</div> 

94		</#if> 

95 

96		<#if termDisplayContexts?has_content> 

97			<div class="collapse show" id="${namespace}treeItem${id}"> 

98				<ul class="treeview-group" role="group"> 

99					<#list termDisplayContexts as termDisplayContext> 

100						<@treeview_item 

101							cssClassTreeItem="tree-item-category" 

102							frequency=termDisplayContext.getFrequency() 

103							frequencyVisible=termDisplayContext.isFrequencyVisible() 

104							id=termDisplayContext.getFilterValue() 

105							name=htmlUtil.escape(termDisplayContext.getBucketText()) 

106							selectable=true 

107							selected=termDisplayContext.isSelected() 

108						/> 

109					</#list>                     

110				</ul> 

111                <div class="more">${languageUtil.get(locale,'general.ver-todos')}</div> 

112			</div> 

113		</#if> 

114	</li> 

115     

116</#macro> 

117 

118<@liferay_ui["panel-container"] 

119	extended=true 

120	id="${namespace + 'facetAssetCategoriesPanelContainer'}" 

121	markupView="lexicon" 

122	persistState=true 

123> 

124	<#assign vocabularyNames = assetCategoriesSearchFacetDisplayContext.getVocabularyNames() /> 

125 

126	<@liferay_ui.panel 

127		collapsible=true 

128		cssClass="search-facet search-facet-display-vocabulary" 

129		id="${namespace + 'facetAssetCategoriesPanel'}" 

130		markupView="lexicon" 

131		persistState=true 

132		title="${(vocabularyNames?size == 1)?then(vocabularyNames[0]!'', 'category')}" 

133	> 

134		<#if vocabularyNames?has_content> 

135			<ul class="treeview treeview-light treeview-nested treeview-vocabulary-display" role="tree"> 

136				<#list vocabularyNames as vocabularyName> 

137					<@treeview_item 

138						cssClassTreeItem="tree-item-vocabulary" 

139						frequencyVisible=false 

140						id=vocabularyName + vocabularyName?index 

141						name="${(vocabularyNames?size == 1)?then('', htmlUtil.escape(vocabularyName))}" 

142						termDisplayContexts=assetCategoriesSearchFacetDisplayContext.getBucketDisplayContexts(vocabularyName) 

143					/> 

144                     

145				</#list>                 

146			</ul> 

147		</#if> 

148 

149		<#if !assetCategoriesSearchFacetDisplayContext.isNothingSelected()> 

150			<@liferay_aui.button 

151				cssClass="btn-link btn-unstyled facet-clear-btn" 

152				onClick="Liferay.Search.FacetUtil.clearSelections(event);" 

153				value="clear" 

154			/> 

155		</#if> 

156	</@> 

157</@> 

158 

159<@liferay_aui.script> 

160	function ${namespace}toggleTreeItem(dataTarget) { 

161		const dataTargetElements = document.querySelectorAll("[data-target=\"#" + dataTarget + "\"]"); 

162 

163		dataTargetElements.forEach( 

164			element => { 

165				if (element.classList.contains('collapsed')) { 

166					element.classList.remove('collapsed'); 

167					element.setAttribute('aria-expanded', true); 

168				} 

169				else { 

170					element.classList.add('collapsed'); 

171					element.setAttribute('aria-expanded', false); 

172				} 

173			} 

174		); 

175 

176		const subtreeCategoryTreeElement = document.getElementById(dataTarget); 

177 

178		if (subtreeCategoryTreeElement) { 

179			if (subtreeCategoryTreeElement.classList.contains('show')) { 

180				subtreeCategoryTreeElement.classList.remove('show'); 

181			} 

182			else { 

183				subtreeCategoryTreeElement.classList.add('show'); 

184			} 

185		} 

186	} 

187</@>