@sapui5/sap.suite.ui.generic.template 1.147.2 → 1.148.1

package/src/sap/suite/ui/generic/template/lib/ai/EasyFill/fragments/EasyFillDialog.fragment.xml

@@ -1,85 +1,155 @@
 <core:FragmentDefinition xmlns="sap.m" xmlns:core="sap.ui.core"
-xmlns:sfo="sap.ui.comp.smartform"
-xmlns:sfi="sap.ui.comp.smartfield"
-xmlns:fesr="http://schemas.sap.com/sapui5/extension/sap.ui.core.FESR/1"
+xmlns:smartForm="sap.ui.comp.smartform"
+xmlns:smartField="sap.ui.comp.smartfield"
+xmlns:uxap="sap.uxap"
+xmlns:layout="sap.ui.layout"
 xmlns:template="http://schemas.sap.com/sapui5/extension/sap.ui.core.template/1"
->
+template:require="{AH: 'sap/suite/ui/generic/template/js/AnnotationHelper',
+AHModel: 'sap/ui/model/odata/AnnotationHelper'}"
+xmlns:fesr="http://schemas.sap.com/sapui5/extension/sap.ui.core.FESR/1">
 
-    <Dialog id="EasyFillDialog" class = "sapSmartTemplatesObjectPageEasyFill" contentHeight="49.3125rem" title="{i18n>EASY_FILL_TITLE}"
-        titleAlignment="Start" horizontalScrolling="false" verticalScrolling="false" draggable="true" resizable="true">
+    <Dialog id="EasyFillDialog" contentWidth="72.25rem" class="sapSmartTemplatesObjectPageEasyFill" contentHeight="49.3125rem" title="{i18n>EASY_FILL_TITLE}" titleAlignment="Start" horizontalScrolling="false" verticalScrolling="false" draggable="true" resizable="true">
         <content>
             <FlexBox id="EasyFillMainFlex" direction="Row" renderType="Bare" width="100%" height="100%">
-                <FlexBox
-                direction="Column" renderType="Bare" width="40%" class = "sapSmartTemplatesObjectPageEasyFillInputArea"
-                >
-                    <FlexBox id="EasyFillInputArea" direction="Column" renderType="Bare" width="100%" gap="36px">
-                        <VBox gap="22px" class="sapSmartTemplatesObjectPageEasyFillInputAreaLabel">
-                            <Label text="{i18n>EASY_FILL_FIRST_LABEL_TEXT}" wrapping="true"/>
-                            <Label text="{i18n>EASY_FILL_SECOND_LABEL_TEXT}" wrapping="true"/>
-                        </VBox>
-                        <TextArea
-                            id="EasyFillInputTextArea"
-                            growing = "true"
-                            growingMaxLines = "30"
-                            maxLength = "2000"
-                            liveChange=".onLiveChange"
-                            placeholder = "{i18n>EASY_FILL_TEXTAREA_PLACEHOLDER}"
-                            rows = "20"
-                            width="100%"
-                            height="17.5rem"
-                            showExceededText = "true"
-                            ariaLabelledBy="EasyFillInputArea">
-                        </TextArea>
-                    </FlexBox>
-                    <FlexBox direction="Row" justifyContent="End" gap="1rem">
-                    <Button
-                            id="EasyFillSubmitButton"
-                            text="Easy Fill"
-                            type="Default"
-                            icon="sap-icon://ai"
-                            fesr:press="fe2:ef:analyzeText"
-                            enabled="{easyFillDialogModel>/isEasyFillButtonEnabled}"
-                            press=".onEasyFillSubmitInputToAI">
-                        </Button>
-                        <Button
-                            id="EasyFillClearAll"
-                            type = "Transparent"
-                            press=".onEasyFillClearAll"
-                            fesr:press="fe2:ef:clearAll"
-                            text="{i18n>EASYFILL_CLEAR_ALL}">
-                        </Button>
-                    </FlexBox>
-                </FlexBox>
-                <FlexBox  id="EasyFillReviewArea" busy="{easyFillDialogModel>/isBusy}" class = "sapSmartTemplatesObjectPageEasyFillReviewArea" renderType="Bare" width="72%" direction="Column">
-                    <IllustratedMessage
-                        illustrationSize = "Large"
-                        illustrationType="{path: 'easyFillDialogModel>/stateType', formatter: '.formatIllustrationType'}"
-                        visible="{easyFillDialogModel>/isIllustrationVisible}"
-                        title = "{path: 'easyFillDialogModel>/stateType', formatter: '.formatIllustrationTitle'}"
-                        description = "{path: 'easyFillDialogModel>/stateType', formatter: '.formatIllustrationDescription'}"/>
-                    <ScrollContainer vertical = "true" visible="{= ${easyFillDialogModel>/isUpdatableVisible} || ${easyFillDialogModel>/isNonUpdatableVisible} }">
-                        <HBox gap="0.5rem" justifyContent = "End" alignItems = "Center" renderType="Bare" class="sapSmartTemplatesObjectPageEasyFillReviewAreaBanner">
-                            <Link text="{i18n>AI_LINK_NOTICE_TITLE}" press=".onLinkPress"/>
-                            <Label text="{i18n>AI_WARNING_TEXT}"/>
-                            <ToggleButton icon = "sap-icon://thumb-up" type = "Transparent" fesr:press="fe2:ef:thumbsup" pressed="{easyFillDialogModel>/feedbackPressedUp}" enabled="{easyFillDialogModel>/feedbackEnabled}" press=".onFeedbackPress"/>
-                            <ToggleButton icon = "sap-icon://thumb-down" type="Transparent" fesr:press="fe2:ef:thumbsdown" pressed="{easyFillDialogModel>/feedbackPressedDown}" enabled="{easyFillDialogModel>/feedbackEnabled}" press=".onFeedbackPress"/>
-                        </HBox>
-                        <VBox class="sapSmartTemplatesObjectPageEasyFillReviewAreaSmartFormWrapper" renderType = "Bare" visible="{easyFillDialogModel>/isUpdatableVisible}">
-                            <core:Fragment fragmentName="sap.suite.ui.generic.template.lib.ai.EasyFill.fragments.EasyFillUpdatebleSmartForm" type="XML"/>
-                        </VBox>
+                <layout:ResponsiveSplitter defaultPane="default">
+                    <layout:PaneContainer>
+                        <layout:SplitPane requiredParentWidth="400" id="inputAreaSplitPane">
+                            <layout:layoutData>
+                                <layout:SplitterLayoutData size="40%"/>
+                            </layout:layoutData>
+                            <FlexBox direction="Column" renderType="Bare" class="sapSmartTemplatesObjectPageEasyFillInputArea">
+                                <FlexBox id="EasyFillInputArea" direction="Column" renderType="Bare" width="100%" gap="36px">
+                                    <VBox gap="22px" class="sapSmartTemplatesObjectPageEasyFillInputAreaLabel">
+                                        <Label text="{i18n>EASY_FILL_FIRST_LABEL_TEXT}" wrapping="true"/>
+                                        <Label text="{i18n>EASY_FILL_SECOND_LABEL_TEXT}" wrapping="true"/>
+                                    </VBox>
+                                    <TextArea
+                                        id="EasyFillInputTextArea"
+                                        growing="true"
+                                        growingMaxLines="30"
+                                        maxLength="2000"
+                                        liveChange=".onLiveChange"
+                                        placeholder="{i18n>EASY_FILL_TEXTAREA_PLACEHOLDER}"
+                                        rows="20"
+                                        width="100%"
+                                        height="17.5rem"
+                                        showExceededText="true"
+                                        ariaLabelledBy="EasyFillInputArea"/>
+                                </FlexBox>
+                                <FlexBox direction="Row" justifyContent="End" gap="1rem">
+                                    <Button
+                                        id="EasyFillSubmitButton"
+                                        text="Easy Fill"
+                                        type="Default"
+                                        icon="sap-icon://ai"
+                                        fesr:press="fe2:ef:analyzeText"
+                                        enabled="{easyFillDialogModel>/isEasyFillButtonEnabled}"
+                                        press=".onEasyFillSubmitInputToAI"/>
+                                    <Button
+                                        id="EasyFillClearAll"
+                                        type="Transparent"
+                                        press=".onEasyFillClearAll"
+                                        fesr:press="fe2:ef:clearAll"
+                                        enabled="{easyFillDialogModel>/isEasyFillButtonEnabled}"
+                                        text="{i18n>EASYFILL_CLEAR_ALL}"/>
+                                </FlexBox>
+                            </FlexBox>
+                        </layout:SplitPane>
+                        <layout:PaneContainer>
+                            <layout:SplitPane requiredParentWidth="600" id="reviewAreaSplitPane">
+                                <layout:layoutData>
+                                    <layout:SplitterLayoutData size="60%"/>
+                                </layout:layoutData>
+                                <FlexBox id="EasyFillReviewArea" busy="{easyFillDialogModel>/isBusy}" class="sapSmartTemplatesObjectPageEasyFillReviewArea" renderType="Bare" direction="Column">
+                                    <IllustratedMessage
+                                        illustrationSize="Large"
+                                        illustrationType="{path: 'easyFillDialogModel>/stateType', formatter: '.formatIllustrationType'}"
+                                        visible="{easyFillDialogModel>/isIllustrationVisible}"
+                                        title="{path: 'easyFillDialogModel>/stateType', formatter: '.formatIllustrationTitle'}"
+                                        description="{path: 'easyFillDialogModel>/stateType', formatter: '.formatIllustrationDescription'}"/>
+                                    <!-- <ScrollContainer height="100%"  horizontal = "true"> -->
+                                        <uxap:ObjectPageLayout visible="{easyFillDialogModel>/isFormVisible}" id="EasyFillObjectPageLayout" sections="{path: 'easyFillDialogModel>/sections', templateShareable: false}" alwaysShowContentHeader="true" upperCaseAnchorBar="false">
+                                            <uxap:headerTitle>
+                                                <uxap:ObjectPageDynamicHeaderTitle>
+                                                    <uxap:heading>
+                                                        <Title text="{i18n>EASY_FILL_FILLED_FIELDS}" wrapping="true" level="H2"/>
+                                                    </uxap:heading>
+                                                    <uxap:actions>
+                                                        <SegmentedButton selectedKey="{easyFillDialogModel>/easyFillMode}" selectionChange=".onSelectionChange">
+                                                            <items>
+                                                                <SegmentedButtonItem icon="sap-icon://increase-line-height" key="CondensedMode" tooltip="{i18n>EASY_FILL_CONDENSED_VIEW_TOOLTIP}"/>
+                                                                <SegmentedButtonItem icon="sap-icon://decrease-line-height" key="ObjectPageMode" tooltip="{i18n>EASY_FILL_DETAILED_VIEW_TOOLTIP}"/>
+                                                            </items>
+                                                        </SegmentedButton>
+                                                        <Button
+                                                            icon="{= ${easyFillDialogModel>/isFullScreen} ?  'sap-icon://full-screen' : 'sap-icon://exit-full-screen'}"
+                                                            type="Transparent"
+                                                            press=".onToggleFullScreen"/>
+                                                    </uxap:actions>
+                                                </uxap:ObjectPageDynamicHeaderTitle>
+                                            </uxap:headerTitle>
+                                            <uxap:headerContent>
+                                                <HBox gap="0.5rem" justifyContent="Start" alignItems="Center" renderType="Bare" class="sapSmartTemplatesObjectPageEasyFillReviewAreaBanner">
+                                                    <Link text="{i18n>AI_LINK_NOTICE_TITLE}" press=".onLinkPress"/>
+                                                    <ToggleButton icon = "sap-icon://thumb-up" type = "Transparent" fesr:press="fe2:ef:thumbsup" pressed="{easyFillDialogModel>/feedbackPressedUp}" enabled="{easyFillDialogModel>/feedbackEnabled}" press=".onFeedbackPress"/>
+                                                    <ToggleButton icon = "sap-icon://thumb-down" type = "Transparent" fesr:press="fe2:ef:thumbsdown" pressed="{easyFillDialogModel>/feedbackPressedDown}" enabled="{easyFillDialogModel>/feedbackEnabled}" press=".onFeedbackPress"/>
+                                                </HBox>
+                                            </uxap:headerContent>
+                                            <uxap:ObjectPageSection title="{path: 'easyFillDialogModel>title', formatter: '.formatSectionTitle'}" titleUppercase="false">
+                                                <uxap:ObjectPageSubSection>
+                                                    <smartForm:SmartForm  editable="true" id="EasyFillSmartForm" groups="{path: 'easyFillDialogModel>children', templateShareable: false}">
+                                                        <smartForm:layout>
+                                                            <smartForm:ColumnLayout
+                                                                columnsXL="3"
+                                                                columnsL="3"
+                                                                columnsM="2"
+                                                                labelCellsLarge="12"/>
+                                                        </smartForm:layout>
+                                                        <smartForm:Group
+                                                            title="{path: 'easyFillDialogModel>title', formatter: '.formatSectionTitle'}"
+                                                            visible="{
+                                                                parts: [
+                                                                    {path: 'easyFillDialogModel>id'},
+                                                                    {path: 'easyFillDialogModel>fields'},
+                                                                    {path: 'easyFillDialogModel>/easyFillMode'}
+                                                                ],
+                                                                formatter: '.populateSmartFields'
+                                                            }">
+                                                            <smartForm:customData>
+                                                                <core:CustomData key="id" value="{easyFillDialogModel>id}"/>
+                                                            </smartForm:customData>
+                                                        </smartForm:Group>
+                                                    </smartForm:SmartForm>
+                                                </uxap:ObjectPageSubSection>
+                                            </uxap:ObjectPageSection>
+                                        </uxap:ObjectPageLayout>
+                                        <VBox id="EasyFillTablePreviewContainer" fitContainer="true" renderType="Bare" visible="{easyFillDialogModel>/hasTableUpdates}"/>
+                                        <MessageStrip
+                                            visible="{easyFillDialogModel>/hasTableUpdates}"
+                                            text="{i18n>EASY_FILL_TABLE_UPDATES_INFO}"
+                                            showIcon="true"
+                                            type="Information"/>
 
-                        <VBox renderType = "Bare" visible="{easyFillDialogModel>/isNonUpdatableVisible}">
-                            <core:Fragment fragmentName="sap.suite.ui.generic.template.lib.ai.EasyFill.fragments.EasyFillNonUpdatableSmartForm" type="XML"/>
-                        </VBox>
-                    </ScrollContainer>
-                </FlexBox>
+                                        <MessageStrip
+                                            visible="{easyFillDialogModel>/hasTableValidationErrors}"
+                                            text="{easyFillDialogModel>/tableValidationMessage}"
+                                            showIcon="true"
+                                            type="Error"/>
+                                </FlexBox>
+                            </layout:SplitPane>
+
+                        </layout:PaneContainer>
+
+                    </layout:PaneContainer>
+
+                </layout:ResponsiveSplitter>
             </FlexBox>
         </content>
         <beginButton>
-            <Button text="{i18n>EASY_FILL_CONFIRM}"  fesr:press="fe2:ef:confirm" enabled="{easyFillDialogModel>/isSaveEnabled}" press=".onSaveFromEasyFillDialog" type="Emphasized"/>
+            <Button text="{i18n>EASY_FILL_CONFIRM}" fesr:press="fe2:ef:confirm" enabled="{easyFillDialogModel>/isSaveEnabled}" press=".onSaveFromEasyFillDialog" type="Emphasized"/>
         </beginButton>
         <endButton>
-            <Button text="{i18n>CANCEL}"  press=".onCancelEasyFillDialog" fesr:press="fe2:ef:cancel"/>
+            <Button text="{i18n>CANCEL}" press=".onCancelEasyFillDialog" fesr:press="fe2:ef:cancel"/>
         </endButton>
-   </Dialog>
+    </Dialog>
 </core:FragmentDefinition>