A munkaelem űrlapjának kiterjesztése
Azure DevOps Services | Azure DevOps Server 2022 – Azure DevOps Server 2019
Megtudhatja, hogyan szabhatja testre, hogyan jelenik meg a munkaelem-űrlap a felhasználók számára egy bővítményen keresztül végzett hozzájárulásokon keresztül.
- Csoport hozzáadása a főoldalhoz
- Lap hozzáadása (lap)
- Művelet hozzáadása a helyi menühöz
- Egyéni vezérlő hozzáadása
- Események figyelése az űrlapon
- Hozzájárulások konfigurálása a munkaelem-űrlapon
A teljes forrásért tekintse meg a gitHubon található Azure DevOps-bővítményminták felhasználói felületi példáját.
Csoport hozzáadása
Ha csoportot szeretne hozzáadni a főoldalhoz, adjon hozzá egy hozzájárulást a bővítményjegyzékhez. Ennek a hozzájárulásnak a típusának kell lennie ms.vss-work-web.work-item-form-group , és meg kell céloznia a hozzájárulást ms.vss-work-web.work-item-form .
"contributions": [
{
"id": "sample-work-item-form-group",
"type": "ms.vss-work-web.work-item-form-group",
"description": "Custom work item form group",
"targets": [
"ms.vss-work-web.work-item-form"
],
"properties": {
"name": "My Group",
"uri": "workItemGroup.html",
"height": 600
}
}
]
Tulajdonságok
| Tulajdonság | Leírás |
|---|---|
name |
A csoportban megjelenő szöveg. |
uri |
URI egy olyan lapra, amely a munkaelem űrlapján és szkriptjeiben megjelenő HTML-t tárolja. |
height |
(Nem kötelező) Meghatározza a csoport magasságát. Ha nincs megadva, az 100%. |
JavaScript-minta
Ez a példa bemutatja, hogyan regisztrálhat egy objektumot, amely akkor van meghívva, amikor események történnek a munkaelem űrlapján, amely hatással lehet a közreműködő csoportra. További példákért tekintse meg a WorkItemFormGroup mintát .
import { IWorkItemFormService, WorkItemTrackingServiceIds } from "azure-devops-extension-api/WorkItemTracking";
import * as SDK from "azure-devops-extension-sdk";
// Get the WorkItemFormService. This service allows you to get/set fields/links on the 'active' work item (the work item
// that currently is displayed in the UI).
async function getWorkItemFormService()
{
const workItemFormService = await SDK.getService<IWorkItemFormService>(WorkItemTrackingServiceIds.WorkItemFormService);
return workItemFormService;
}
// Register a listener for the work item group contribution after initializing the SDK.
SDK.register(SDK.getContributionId(), function () {
return {
// Called when the active work item is modified
onFieldChanged: function(args) {
$(".events").append($("<div/>").text("onFieldChanged - " + JSON.stringify(args)));
},
// Called when a new work item is being loaded in the UI
onLoaded: function (args) {
getWorkItemFormService().then(function(service) {
// Get the current values for a few of the common fields
service.getFieldValues(["System.Id", "System.Title", "System.State", "System.CreatedDate"]).then(
function (value) {
$(".events").append($("<div/>").text("onLoaded - " + JSON.stringify(value)));
});
});
},
// Called when the active work item is being unloaded in the UI
onUnloaded: function (args) {
$(".events").empty();
$(".events").append($("<div/>").text("onUnloaded - " + JSON.stringify(args)));
},
// Called after the work item has been saved
onSaved: function (args) {
$(".events").append($("<div/>").text("onSaved - " + JSON.stringify(args)));
},
// Called when the work item is reset to its unmodified state (undo)
onReset: function (args) {
$(".events").append($("<div/>").text("onReset - " + JSON.stringify(args)));
},
// Called when the work item has been refreshed from the server
onRefreshed: function (args) {
$(".events").append($("<div/>").text("onRefreshed - " + JSON.stringify(args)));
}
}
});
esemény
| Esemény | Esemény leírása | Argumentum | Argumentum leírása |
|---|---|---|---|
| onFieldChanged | Egy mező módosítása után aktiválódott. Ha a mezőmódosítás olyan szabályokat futtatott, amelyek más mezőket frissítettek, ezek a módosítások egyetlen esemény részét képezik. | ID (Azonosító) | A munkaelem azonosítója. |
| changedFields | Tömb az összes módosított mező hivatkozási nevével. | ID (Azonosító) | A munkaelem azonosítója. |
| be van töltve | Miután az adatok betöltésre kerülnek a munkaeleműrlapra, amikor a felhasználó megnyit egy munkaelemet, vagy amikor a felhasználó egy másik munkaelemhez navigál a triázs nézetben. | ID (Azonosító) | A munkaelem azonosítója. |
| onReset | Azután aktiválódott, hogy a felhasználó visszavonta a munkaelem módosításait. | ID (Azonosító) | A munkaelem azonosítója. |
| onRefreshed | Azután aktiválódott, hogy a felhasználó manuálisan frissítette a munkaelemet. | ID (Azonosító) | A munkaelem azonosítója. |
| onSaved | A munkaelem mentése után aktiválódott. A párbeszédpanel munkaelemei esetében az "ms.vss-work-web.work-item-notifications" típust kell megcélolnia, hogy az esemény aktiválódik, mivel a párbeszédpanel bezárása után ez a hozzájárulástípus ki lesz ürítve. További információ: Események figyelése. | ID (Azonosító) | A munkaelem azonosítója. |
| onUnloaded | Aktiválva, mielőtt a felhasználó bezárja a párbeszédpanelt, vagy mielőtt a felhasználó átáll egy másik munkaelemre a Triage nézetben. | ID (Azonosító) | A munkaelem azonosítója. |
Oldal hozzáadása
A munkaelem űrlapján egy új lap jelenik meg lapként. Új lapok jelennek meg a Részletek lap mellett.
Ha egy lapot szeretne hozzáadni a munkaelem-űrlaphoz, adjon hozzá egy hozzájárulást a bővítményjegyzékhez. Ennek a hozzájárulásnak a típusának kell lennie ms.vss-work-web.work-item-form-page , és meg kell céloznia a hozzájárulást ms.vss-work-web.work-item-form .
"contributions": [
{
"id": "sample-work-item-form-page",
"type": "ms.vss-work-web.work-item-form-page",
"description": "Custom work item form page",
"targets": [
"ms.vss-work-web.work-item-form"
],
"properties": {
"name": "My Page",
"uri": "workItemPage.html"
}
}
]
Tulajdonságok
| Tulajdonság | Leírás |
|---|---|
| név | A lapon megjelenő szöveg. |
| Uri | URI egy olyan lapra, amely a munkaelem űrlapján és szkriptjeiben megjelenő HTML-t tárolja. |
JavaScript-minta
Tekintse meg a JavaScript-mintát az űrlapcsoport szakaszában. A regisztrált objektum nevének meg kell egyeznie a id hozzájárulás nevével.
esemény
| Esemény | Esemény leírása | Argumentum | Argumentum leírása |
|---|---|---|---|
| onFieldChanged | Egy mező módosítása után aktiválódott. Ha a mezőmódosítás olyan szabályokat futtatott, amelyek más mezőket frissítettek, ezek a módosítások egyetlen esemény részét képezik. | ID (Azonosító) | A munkaelem azonosítója. |
| changedFields | Tömb az összes módosított mező hivatkozási nevével. | ID (Azonosító) | A munkaelem azonosítója. |
| be van töltve | Miután az adatok betöltésre kerülnek a munkaeleműrlapra, amikor a felhasználó megnyit egy munkaelemet, vagy amikor a felhasználó egy másik munkaelemhez navigál a triázs nézetben. | ID (Azonosító) | A munkaelem azonosítója. |
| onReset | Azután aktiválódott, hogy a felhasználó visszavonta a munkaelem módosításait. | ID (Azonosító) | A munkaelem azonosítója. |
| onRefreshed | Azután aktiválódott, hogy a felhasználó manuálisan frissítette a munkaelemet. | ID (Azonosító) | A munkaelem azonosítója. |
| onSaved | A munkaelem mentése után aktiválódott. A párbeszédpanel munkaelemei esetében az "ms.vss-work-web.work-item-notifications" típust kell megcélolnia, hogy az esemény aktiválódik, mivel a párbeszédpanel bezárása után ez a hozzájárulástípus ki lesz ürítve. További információ: Események figyelése. | ID (Azonosító) | A munkaelem azonosítója. |
| onUnloaded | Aktiválva, mielőtt a felhasználó bezárja a párbeszédpanelt, vagy mielőtt a felhasználó átáll egy másik munkaelemre a Triage nézetben. | ID (Azonosító) | A munkaelem azonosítója. |
Hozzájárulások konfigurálása a munkaelem-űrlapon
Az Azure DevOps Servicesben alapértelmezés szerint a csoportbővítmények az űrlap második oszlopának végén jelennek meg, az oldalbedolgozások pedig az összes munkaelem űrlaplapja után lapként jelennek meg. A vezérlőelem-hozzájárulások alapértelmezés szerint nem jelennek meg az űrlapon, ezért a felhasználóknak manuálisan kell hozzáadniuk őket az űrlaphoz. Az Azure DevOps Serverben a munkaeleműrlap vezérlőelemeinek, csoportosítási és oldalbedolgozásainak megjelenítéséhez/elrejtéséhez vagy áthelyezéséhez lásd: Munkaelem-űrlapbővítmények konfigurálása.
Menüművelet hozzáadása
Ha elemet szeretne hozzáadni a munkaelem eszköztárához, vegye fel ezt a hozzájárulást a bővítményjegyzékbe. Az elem megjelenik a... legördülő lista a munkaelem űrlap jobb felső sarkában.
"contributions": [
{
"id": "sample-work-item-menu",
"type": "ms.vss-web.action",
"description": "Sample toolbar item which updates the title of a work item",
"targets": [
"ms.vss-work-web.work-item-context-menu"
],
"properties": {
"text": "Try me!",
"title": "Updates the title of the work item from the extension",
"toolbarText": "Try me!",
"icon": "images/show-properties.png",
"uri": "menu-workItemToolbarButton.html"
}
}
]
Tulajdonságok
| Tulajdonság | Leírás |
|---|---|
| text | Az eszköztárelemen megjelenő szöveg. |
| Cím | Elemleírás szöveg, amely a menüelemen jelenik meg. |
| toolbarText | Az elem rámutatásakor megjelenő szöveg. |
| Uri | URI az eszköztár-műveletkezelőt regisztráló lapra. |
| Ikon | A menüelemen megjelenő ikon URL-címe. A relatív URL-címek feloldása a baseUri használatával történik. |
| csoport | Meghatározza, hogy hol jelenik meg a menüelem másokkal kapcsolatban. Az azonos csoportnévvel rendelkező eszköztárelemek a többi elemtől származó elválasztóval vannak csoportosítva és elosztva. |
| registeredObjectId | (Nem kötelező) A regisztrált menü műveletkezelőjének neve. A hozzájárulás azonosítójának alapértelmezett értéke. |
Események figyelése
Ha megfigyelőt szeretne hozzáadni a munkaelemhez, amely figyeli a munkaelem eseményeit, vegye fel ezt a hozzájárulást a bővítményjegyzékbe. A munkaelem-űrlapon nincsenek vizualizációk a megfigyelők számára. Ez a legjobb módja annak, hogy meghallgatja a munkaelem-űrlapot a Mentett eseményen, mivel a megfigyelő az űrlapon kívül él, és nem pusztul el, amikor az űrlap bezárul, ami közvetlenül a mentés után történhet.
"contributions": [
{
"id": "sample-work-item-form-observer",
"type": "ms.vss-work-web.work-item-notifications",
"description": "Gets events about the current work item form for the 'Try Me!' toolbar button",
"targets": [
"ms.vss-work-web.work-item-form"
],
"properties": {
"uri": "myformobserver.html"
}
}
]
Tulajdonságok
| Tulajdonság | Leírás |
|---|---|
| Uri | URI egy olyan lapra, amelyen a szkriptek eseményeket figyelnek. |
esemény
| Esemény | Esemény leírása | Argumentum | Argumentum leírása |
|---|---|---|---|
| onFieldChanged | Egy mező módosítása után aktiválódott. Ha a mezőmódosítás olyan szabályokat futtatott, amelyek más mezőket frissítettek, ezek a módosítások egyetlen esemény részét képezik. | ID (Azonosító) | A munkaelem azonosítója. |
| changedFields | Tömb az összes módosított mező hivatkozási nevével. | ID (Azonosító) | A munkaelem azonosítója. |
| be van töltve | Miután az adatok betöltésre kerülnek a munkaeleműrlapra, amikor a felhasználó megnyit egy munkaelemet, vagy amikor a felhasználó egy másik munkaelemhez navigál a triázs nézetben. | ID (Azonosító) | A munkaelem azonosítója. |
| onReset | Azután aktiválódott, hogy a felhasználó visszavonta a munkaelem módosításait. | ID (Azonosító) | A munkaelem azonosítója. |
| onRefreshed | Azután aktiválódott, hogy a felhasználó manuálisan frissítette a munkaelemet. | ID (Azonosító) | A munkaelem azonosítója. |
| onSaved | A munkaelem mentése után aktiválódott. A párbeszédpanel munkaelemei esetében az "ms.vss-work-web.work-item-notifications" típust kell megcélolnia, hogy az esemény aktiválódik, mivel a párbeszédpanel bezárása után ez a hozzájárulástípus ki lesz ürítve. További információ: Események figyelése. | ID (Azonosító) | A munkaelem azonosítója. |
| onUnloaded | Aktiválva, mielőtt a felhasználó bezárja a párbeszédpanelt, vagy mielőtt a felhasználó átáll egy másik munkaelemre a Triage nézetben. | ID (Azonosító) | A munkaelem azonosítója. |
HTML/JavaScript-minta
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Work item extension page sample</title>
</head>
<body>
<script src="sdk/scripts/SDK.js"></script>
<script>
SDK.init({
usePlatformScripts: true
});
SDK.ready(function () {
// Register a listener for the work item page contribution.
SDK.register(SDK.getContributionId(), function () {
return {
// Called when the active work item is modified
onFieldChanged: function(args) {
},
// Called when a new work item is being loaded in the UI
onLoaded: function (args) {
},
// Called when the active work item is being unloaded in the UI
onUnloaded: function (args) {
},
// Called after the work item has been saved
onSaved: function (args) {
},
// Called when the work item is reset to its unmodified state (undo)
onReset: function (args) {
},
// Called when the work item has been refreshed from the server
onRefreshed: function (args) {
}
}
});
});
</script>
</body>
</html>
Változások a New Boards Hub használatával
Feljegyzés
Az új Boards Hub jelenleg előzetes verzióban érhető el, de 2024-ben mindenki számára elérhető lesz. Határozottan javasoljuk, hogy azonnal engedélyezze a New Boards Hubot, és tesztelje a belső bővítményeket.
A legújabb SDK-k használata
Győződjön meg arról, hogy a bővítmény az Azure-devops-extension-sdk legújabb verzióját használja
Az új SDK használatakor az azure-devops-extension-api csomagot is használnia kell REST API-khoz. Minden sprintben frissítjük a metódusokat és a felületeket, hogy az tartalmazza a legújabb funkciókat.
Mikor érdemes művelet- vagy műveletszolgáltatót használni?
A menüelemek getMenuItems dinamikus betöltésekor használja ms.vss-web.action-provider a menükezelőt. Kerülje a használatot ms.vss-web.action-provider , ha a menüelemek statikusak és a jegyzékben vannak definiálva. Ehelyett ms.vss-web.action azt kell használni.
A csomag megkövetelése("VSS/Events/Document") már nem támogatott
require("VSS/Events/Document") az importálás a New Boards Hub esetében már nem támogatott.
Visszajelzés
Hamarosan elérhető: 2024-ben fokozatosan kivezetjük a GitHub-problémákat a tartalom visszajelzési mechanizmusaként, és lecseréljük egy új visszajelzési rendszerre. További információ: https://aka.ms/ContentUserFeedback.
Visszajelzés küldése és megtekintése a következőhöz: