에 구성요소 추가 에이전트 작업 공간

사용자 지정 구성요소를 사용하여 사용자 지정 작업 공간 인터페이스를 생성하면 회사 에이전트의 특정 요구 사항을 충족할 수 있습니다.

여러 채널을 통해 고객과 소통하는 것은 시간이 많이 걸릴 수 있습니다. 이러한 옴니채널 상호작용을 효율적으로 수행하려면 에이전트가 고객 정보를 한 곳에서 확인하여 여러 도구 간의 컨텍스트 전환을 줄여야 합니다. 에 대한 작업 공간사용자 지정 구성요소를 개발하여 팀이 여러 채널의 통신을 하나의 인터페이스로 가져올 수 있습니다.

에 구성요소 추가 작업 공간

인스턴스에 배포되면 다음과 같은 방법으로 구성요소를 작업 공간 인스턴스에 추가할 수 있습니다.

모달에 구성요소 작업 공간 추가

UI 작업을 사용하여 모달에서 사용자 지정 구성요소를 시작하면 에이전트가 작업을 수행하기 위해 다른 화면으로 이동할 필요가 없습니다. 자세한 내용은 모달에서 구성요소 렌더링을 참조하십시오.

UI Builder를 작업 공간 사용하여 방문 페이지에 구성요소 추가

에이전트 UI 빌더 를 위한 사용자 지정 방문 페이지를 생성하는 데 사용합니다. UI 빌더 는 작업 공간 구성요소를 시각적으로 정렬할 수 있는 끌어서 놓기 도구입니다. 자세한 내용은 작업 공간에 대한 사용자 지정 방문 페이지 만들기를 참조하십시오.

UI Builder에서 배포된 구성요소를 사용하도록 now-ui.json 파일의 속성을 구성합니다. 에 구성요소 추가 UI 빌더 문서를 참조하십시오.

기록 뷰에 작업 공간 구성요소 추가

기록 뷰의 구성요소 영역에 사용자 지정 또는 표준 구성요소를 작업 공간 추가할 수 있습니다. 자세한 내용은 작업 공간에서 레코드 보기 설정을 참조하세요.

에 구성요소 추가 UI 빌더

구성 파일에서 속성을 설정하여 구성요소 UI 빌더 를 인스턴스에 추가합니다.

시작하기 전에

• 환경 설정
• 프로젝트 설정
• 구성요소 개발

프로시저

1. 프로젝트 디렉터리에서 now-ui.json 엽니다.
2. 구성 요소를 추가합니다.[ component-name].uiBuilder 개체를 파일에 추가합니다.
   이 객체는 구성 요소를 UI 빌더.

   이 객체에는 다음과 같은 키-값 쌍이 포함됩니다.

   키	데이터 유형	설명
   구성 요소. [component-name].uiBuilder	객체	UI 빌더에 구성요소를 추가하는 객체입니다.
   구성 요소. [component-name].uiBuilder.label	문자열	필수 UI Builder에서 구성요소의 표시 이름입니다.
   구성 요소. [component-name].uiBuilder.icon	문자열	필수 UI Builder에 나타나는 아이콘의 이름입니다.
   구성 요소. [component-name].uiBuilder.description	문자열	필수 구성요소의 기능에 대한 짧은 설명입니다.

   {
     "components": {
       "card": {
         "uiBuilder": {
           "label" : "Card",
           "icon" : "chat-fill", 
           "description" : "A visual card format for a record.",
           "associatedTypes": ["global.core"]
         },

3. 구성 요소에 속성이 포함되어 있으면 구성 요소를 추가합니다.[ component-name].properties 배열을 파일에 추가합니다.
   이렇게 하면 속성이 의 구성 요소에 UI 빌더대한 구성 옵션으로 추가됩니다.

   이 객체에는 다음과 같은 키-값 쌍이 포함됩니다.

   키	데이터 유형	설명
   구성 요소. [구성 요소 이름].properties	배열 <Object>	구성요소의 모든 속성과 해당 속성에 대한 모든 관련 정보를 포함하는 객체의 배열입니다.
   구성 요소. [component-name].properties[].name	문자열	구성 요소 코드의 속성 이름입니다.
   구성 요소. [component-name].properties[].label	문자열	해당하는 경우 표시할 UI 빌더속성의 표시 이름입니다.
   구성 요소. [component-name].properties[].description	문자열	속성이 수행하는 작업 또는 사용 방법에 대한 간단한 설명입니다.
   구성 요소. [component-name].properties[].readOnly	부울	예일 경우 사용자가 UI 빌더에서 속성을 구성할 수 없습니다. 기본값은 false입니다.
   구성 요소. [구성 요소 이름].properties[].required	부울	true인 경우 사용자가 속성을 구성해야 합니다. 기본값은 false입니다.
   구성 요소. [component-name].properties[].defaultValue	문자열	사용자가 제공하지 않은 경우의 기본값입니다.
   구성 요소. [component-name].properties[].associatedTypes	배열	UI Builder 도구 상자에서 구성요소가 나타나는 위치를 설명합니다. 값은 &quot;global.core&quot;여야 합니다.
   구성 요소. [component-name].properties[].typeMetadata	객체	참조 속성 및 선택 목록과 같은 일부 데이터 유형에 필요한 추가 구성 데이터입니다.

   {
     "components": {
       "properties": [
   		    {
   			"name": "backgroundColor",
   			"label": "Background Color",
   			"description": "Background Color",
   			"readOnly": false,
   			"required": false,
   			"defaultValue": "lightgray"
   		    },
   		    {
   		       "name": "cardType",
   			"label": "Type of card",
   			"description": "Type of card",
   			"readOnly": false,
   			"required": false,
   			"defaultValue": ""
   		    }
   			]

4. 파일을 저장합니다.

다음에 수행할 작업

인스턴스에 구성요소 배포.

관련 개념

• 사용자 지정 구성요소 작성기