Del via


Oprette et brugerdefineret panellayout

 

Udgivet: november 2016

Gælder for: Dynamics 365 (online), Dynamics 365 (on-premises), Dynamics CRM 2013, Dynamics CRM 2015, Dynamics CRM 2016

Panellayouts i Unified Service Desk er tilknyttede kontrolelementer, som giver mulighed for at indlæse alle former for forskellige layouts i systemet.Unified Service Desk indeholder nogle foruddefinerede panellayouts til brug i dit Helpdesk medarbejderprogram. Du kan finde flere oplysninger under Panellayouts i Unified Service Desk.

Unified Service Desk giver dig også mulighed for at oprette definerede eller brugerdefinerede panellayouts, hvor du arrangerer Unified Service Desk-paneltyperne i henhold til dine behov og forbedrer oplevelsen ved bagvedliggende XAML-kode.Microsoft Dynamics 365 indeholder en Visual Studio-projektskabelon til at oprette brugerdefinerede panellayout med understøttelse af bagvedliggende kode.

Dette emne viser, hvordan du opretter et panellayout, hvor du skal omarrangere panelerne, så sessionsoplysninger, Helpdesk medarbejder, scripts, notestyring og tilknyttede sager vises i højre side af skrivebordet i stedet for venstre side. Desuden vises den rude, der indeholder alle disse oplysninger, automatisk, når en session startes i Unified Service Desk, og den forsvinder automatisk, når sessionen afsluttes, i stedet for at du manuelt skal udvide og skjule den.

Dette emne indeholder

Forudsætninger

Oprette et brugerdefineret panellayout

Teste det brugerdefinerede panellayout

Forudsætninger

  • Microsoft .NET Framework 4.5.2

  • Unified Service Desk-klientprogram. Klientprogrammet er påkrævet for at teste det kontrolelement, der er tilknyttet det brugerdefinerede panellayout, ved at logge på ved hjælp af Helpdesk medarbejderprogram.

  • Microsoft Visual Studio 2012, Visual Studio 2013 eller Visual Studio 2015

  • NuGet Package Manager for Visual Studio 2012, Visual Studio 2013 eller Visual Studio 2015

  • Microsoft Dynamics 365-SDK-skabeloner til Visual Studio, der indeholder projektskabelonen til det brugerdefinerede panellayout. Du kan få den på en af følgende måder:

Oprette et brugerdefineret panellayout

  1. Start Visual Studio, og opret et nyt projekt.

  2. I dialogboksen Nyt projekt:

    1. Fra listen over installerede skabeloner skal du udvide Visual C# og vælge Dynamics 365 SDK-skabeloner > Unified Service Desk > USD-brugerdefineret panellayout.

    2. Sørg for, at .NET Framework 4.5.2 er valgt.

    3. Angiv navnet på og placeringen af projektet, og klik på OK.

    Oprette et brugerdefineret panellayout

  3. I Solution Explorer skal du dobbeltklikke på filen CustomLayout.xaml for at få vist XAML designer.XAML-designeren viser panelets standardlayout i Unified Service Desk.

  4. Erstat XAML-koden i CustomLayout.xaml-filen med den kode, der er angivet i følgende eksempel. Det kan du gøre ved at markere al kode (CTRL + A) i XAML området (som vist i illustrationen), slette den og derefter indsætte XAML koden i det samme område. Dette gøres for at ændre placeringen af udviderruden fra venstre mod højre.

    Opdatere XAML-koden for det brugerdefinerede panellayout

    <USD:PanelLayoutBase           
            x:Class="MyUSDCustomPanelLayout.CustomLayout"
            xmlns="https://schemas.microsoft.com/winfx/2006/xaml/presentation"
            xmlns:x="https://schemas.microsoft.com/winfx/2006/xaml"
            xmlns:mc="https://schemas.openxmlformats.org/markup-compatibility/2006"
            xmlns:d="https://schemas.microsoft.com/expression/blend/2008"
            mc:Ignorable="d" 
            xmlns:local="clr-namespace:Microsoft.Crm.UnifiedServiceDesk.Dynamics;assembly=Microsoft.Crm.UnifiedServiceDesk.Dynamics"
            xmlns:USD="clr-namespace:Microsoft.Crm.UnifiedServiceDesk.Dynamics.PanelLayouts;assembly=Microsoft.Crm.UnifiedServiceDesk.Dynamics"
            d:DesignHeight="500" d:DesignWidth="500">
        <Grid x:Name="LayoutRoot">
            <Grid.Resources>
                <local:CRMImageConverter x:Key="CRMImageLoader" />
                <Style x:Key="ImageLogo" TargetType="{x:Type Image}">
                    <Setter Property="FlowDirection" Value="LeftToRight"/>
                    <Setter Property="Width" Value="161" />
                    <Setter Property="Height" Value="25" />
                    <Setter Property="Margin" Value="0" />
                    <Setter Property="HorizontalAlignment" Value="Left" />
                    <Setter Property="VerticalAlignment" Value="Center" />
                </Style>
            </Grid.Resources>
            <Grid.RowDefinitions>
                <RowDefinition Height="auto"/>
                <RowDefinition Height="*"/>
                <RowDefinition Height="auto"/>
            </Grid.RowDefinitions>
            <Border Grid.Row="0" BorderBrush="#d8d8d8" BorderThickness="0,1,0,1">
                <Grid Background="{DynamicResource WindowHeaderStyle}" Grid.Row="0"  Margin="0">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="auto" />
                        <ColumnDefinition Width="auto" />
                        <ColumnDefinition Width="*" />
                        <ColumnDefinition Width="Auto" />
                    </Grid.ColumnDefinitions>
                    <Image Grid.Column="0" Source="{Binding Source=msdyusd_Logo, Converter={StaticResource CRMImageLoader}}"  Style="{DynamicResource ImageLogo}"   />
                    <Rectangle Width="10" Grid.Column="1" />
                    <USD:USDDeckTabPanel x:Name="ToolbarPanel" Grid.Column="2" AutomationProperties.Name="Toolbar Panel" VerticalAlignment="Stretch" Focusable="False" Margin="1" />
                    <Grid Grid.Column="3">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="*" />
                            <ColumnDefinition Width="412"/>
                        </Grid.ColumnDefinitions>
                        <Grid.Background>
                            <ImageBrush ImageSource="{Binding Source=msdyusd_Office15, Converter={StaticResource CRMImageLoader}}" Stretch="Fill" ></ImageBrush>
                        </Grid.Background>
                        <USD:USDStackPanel Grid.Column="0" x:Name="CtiPanel"  Orientation="Horizontal" Focusable="False" VerticalAlignment="Center" AutomationProperties.Name="Cti Panel" SelectedAppChanged="SelectedAppChangedHander"/>
                        <USD:USDStackPanel Grid.Column="1" HorizontalAlignment="Right" x:Name="AboutPanel"  Orientation="Horizontal" Focusable="False" VerticalAlignment="Center" AutomationProperties.Name="AboutPanel"/>
                    </Grid>
                </Grid>
            </Border>
            <Grid Grid.Row="1" VerticalAlignment="Stretch" Margin="0" Background="{DynamicResource WindowBackgroundStyle}">
                <Grid.RowDefinitions>
                    <RowDefinition Height="auto" />
                    <RowDefinition Height="*" />
                    <RowDefinition Height="auto" />
                </Grid.RowDefinitions>
                <USD:USDDeckTabPanel x:Name="SessionTabsPanel" Grid.Row="0" Margin="5,5,0,5" AutomationProperties.Name="Session Tabs Panel" Focusable="False" ClipToBounds="True" />
                <Grid x:Name="MainGrid" Grid.Row="1" AutomationProperties.Name="Main Panels">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="*" />
                        <ColumnDefinition Width="auto"/>
                    </Grid.ColumnDefinitions>
                    <Expander Grid.Column="1" Style="{DynamicResource StretchExpanderStyle}"  ExpandDirection="Right" x:Name="RightExpander" IsExpanded="false" BorderBrush="White" Expanded="Expander_Expanded" Collapsed="Expander_Collapsed" >
                        <Grid Style="{DynamicResource LeftPanelGrid}">
                            <Grid.RowDefinitions>
                                <RowDefinition Height="auto" />
                                <RowDefinition Height="auto" />
                                <RowDefinition Height="auto" Name="ChatPanelRow" />
                                <RowDefinition Height="auto" />
                                <RowDefinition Height="auto" />
                                <RowDefinition Height="*" />
                            </Grid.RowDefinitions>
                            <USD:USDCollapsePanel x:Name="SessionExplorerPanel" AutomationProperties.Name="Session Explorer Panel" Grid.Row="0" Margin="1" SelectedAppChanged="SelectedAppChangedHander" />
                            <USD:USDCollapsePanel x:Name="WorkflowPanel" AutomationProperties.Name="Workflow Panel" Grid.Row="1" Margin="1" SelectedAppChanged="SelectedAppChangedHander" />
                            <USD:USDCollapsePanel x:Name="ChatPanel" AutomationProperties.Name="Workflow Panel" Grid.Row="2" Margin="1" SelectedAppChanged="SelectedAppChangedHander"/>
                            <USD:USDCollapsePanel x:Name="LeftPanel1" AutomationProperties.Name="Left Panel 1" Grid.Row="3" Margin="1" SelectedAppChanged="SelectedAppChangedHander"/>
                            <USD:USDCollapsePanel x:Name="LeftPanel2" AutomationProperties.Name="Left Panel 2" Grid.Row="4" Margin="1" SelectedAppChanged="SelectedAppChangedHander"/>
                            <USD:USDDeckTabPanel x:Name="LeftPanelFill" AutomationProperties.Name="Left Panel Fill" Grid.Row="5" Margin="1" SelectedAppChanged="SelectedAppChangedHander"/>
                        </Grid>
                    </Expander>
                    <Grid Grid.Column="0" Background="Transparent">
                        <Grid.RowDefinitions>
                            <RowDefinition Height="0" />
                            <RowDefinition Height="*" />
                        </Grid.RowDefinitions>
                        <USD:USDCollapsePanel x:Name="RibbonPanel" Grid.Row="0" Visibility="Collapsed"  AutomationProperties.Name="Ribbon Panel" Focusable="False" Margin="1" ClipToBounds="False" SnapsToDevicePixels="True" />
                        <USD:USDTabPanel x:Name="MainPanel" Grid.Row="1" AutomationProperties.Name="Main Panel" SelectedAppChanged="SelectedAppChangedHander"/>
                    </Grid>
                </Grid>
            </Grid>
            <StatusBar Margin="0" Background="{DynamicResource WindowHeaderStyle}"  Grid.Row="2" Height="auto" VerticalAlignment="Bottom">
                <StatusBarItem Background="{DynamicResource WindowHeaderStyle}" >
                    <USD:USDStackPanel x:Name="StatusPanel" Orientation="Horizontal" AutomationProperties.Name="Status Panel" Margin="1" SelectedAppChanged="SelectedAppChangedHander" />
                </StatusBarItem>
            </StatusBar>
        </Grid>
    </USD:PanelLayoutBase>
    
  5. Du kan også definere en tastaturgenvej for at få adgang til et panel i dit brugerdefinerede panellayout.Flere oplysninger:Tastaturgenveje til paneler

  6. I Løsningsoversigt skal du højreklikke på filen CustomLayout.xaml og klikke på View Code for at tilføje koden bag XAML. Dette åbner CustomLayout.xaml.cs-filen.

  7. Opdater NotifyContextChange-metodedefinitionen ved at tilføje følgende kode.

    if (context.Count != 0)
    {
       RightExpander.IsExpanded = true;
    }
    else
    { 
       RightExpander.IsExpanded = false;
    }
    

    Koden kontrollerer, om der er nogen aktive sessioner i Unified Service Desk og viser (udvider) eller skjuler automatisk udviderruden.

    Dette er den opdaterede NotifyContextChange-metodedefinition.

    Opdateret NotifyContextChange-metode

  8. Gem projektet, og byg det (Opbygning > Opbygge løsning) for at kontrollere, om det blev bygget korrekt.

    System_CAPS_noteBemærkning

    Notér navnet på den klasse, der bruges til at bygge dit brugerdefinerede panellayout i CustomLayout.xaml.cs-filen. I vores tilfælde er det CustomLayout. Du skal bruge navnet i det næste trin.

Teste det brugerdefinerede panellayout

Når projektet er bygget korrekt, kan du teste det brugerdefinerede panellayout. Testen består af to dele: definere det tilknyttede kontrolelement for det brugerdefinerede panellayout på serveren og derefter logge på Unified Service Desk på serveren ved hjælp af klientprogrammet med samlingen af brugerdefineret kode i klientmappen.

Definere det tilknyttede kontrolelement for det brugerdefinerede layoutpanel på serveren

  1. Log på Microsoft Dynamics 365.

  2. Vælg Microsoft Dynamics 365 på navigationslinjen, og vælg Indstillinger.

  3. Vælg Indstillinger > Unified Service Desk > Tilknyttede kontrolelementer.

  4. Vælg NY, og angiv derefter værdierne på skærmen Nyt tilknyttet kontrolelement som vist her.

    definition af tilknyttet kontrolelement for brugerdefineret panel

    System_CAPS_noteBemærkning

    Assembly-URI er navnet på din assembly, og Assembly Type er navnet på din assembly-fil (dll) efterfulgt af et punktum (.) og derefter navnet på klassen i dit Visual Studio-projekt. I dette eksempel er navnet på assemblyen MyUSDCustomPanelLayout, og navnet på klassen er CustomLayout, som er standardklassenavnet, når du opretter et brugerdefineret panellayout.

  5. Gem det tilknyttede kontrolelement.

Køre Unified Service Desk-klienten for at arbejde med det brugerdefinerede panellayout

  1. Kopier den assemblyfil (dll), der indeholder definitionen af dit brugerdefinerede tilknyttede kontrolelement fra fejlfindingsmappen for dit Visual Studio-projekt til Unified Service Desk-programmappen, der som standard er c:\Program Files\Microsoft Dynamics CRM USD\USD.

  2. Kør Unified Service Desk-klienten for at oprette forbindelse til Dynamics 365-serveren.

  3. Når du har logget på, kan du se det brugerdefinerede panellayout uden udviderruden i venstre side. Udviderruden er nu i højre side.

    Skærmbillede af brugerdefineret panellayout

  4. Vælg Søg på værktøjslinjen, og vælg derefter en post, der skal vises i en session. I dette tilfælde kan du vælge Kontakter i vinduet Søg og derefter vælge Maria Campbell (eksempel). Ruden til højre vises automatisk og viser de tilknyttede sessionsdata, Helpdesk medarbejderscripting og andre oplysninger om den aktuelle kontaktpost.

    Den højre udviderrude vises automatisk

  5. Luk sessionen ved at klikke på krydset i sessionsfanen øverst. Den højre rude lukkes/skjules automatisk.

    System_CAPS_noteBemærkning

    I tilfælde af flere sessioner vises den højre rude, indtil du har lukket alle sessionsfanerne.

Se også

Få vist tilknyttede kontrolelementer i det brugerdefinerede panellayout
Paneler, paneltyper og panellayout i Unified Service Desk

Unified Service Desk 2.0

© 2017 Microsoft. Alle rettigheder forbeholdes. Ophavsret