한국어 번역 완료

범용 Bahmni 표시 컨트롤 추가 단계

환자 대시보드에 환자 이름과 식별자를 보여주는 간단한 표시 컨트롤을 추가해 보겠습니다. 표시 컨트롤 구성은 다음과 같습니다.

"TestPatientInfo": {
   "name":"TestPatientInfo",
   "type":"patient",
     "displayOrder":2
}

1단계

‘patient’라는 이름의 HTML 파일을 생성합니다. 구성의 type은 HTML 파일 이름이어야 합니다. 이 HTML 파일에는 디렉티브가 포함됩니다.

<test-patient patient-uuid="{{::patient.uuid}}"
             config="section">
</test-patient>

뷰에서 환자 세부 정보를 사용할 수 있도록 patient.uuid와 section을 <test-patient/> 디렉티브에 전달해야 합니다.

모든 Bahmni 모듈에서 표시 컨트롤을 사용하려면 모든 표시 컨트롤 파일을 공통 폴더(예: ui/app/common/displaycontrols/dashboard/views/sections/)에 추가합니다. 그렇지 않으면 특정 모듈(예: ui/app/<clinical>/dashboard/views/)에 추가합니다. Bahmni는 임상 환자 대시보드, 방문 페이지, 입원 대시보드 및 프로그램 대시보드에 표시 컨트롤을 추가할 수 있습니다.

2단계

ui/app/common/displaycontrols/ 경로에 폴더 구조를 생성합니다.

Screen Shot 2018-01-24 at 4.49.04 PM.png

다음은 testPatient.js 파일의 코드 조각입니다.

'use strict';
angular.module('bahmni.common.displaycontrol.testPatient')
   .directive('testPatient', ['patientService', 'spinner', '$sce', '$rootScope', '$stateParams', '$window', '$translate',
       'configurations', '$q', 'visitService',
       function (patientService, spinner, $sce, $rootScope, $stateParams, $window, $translate, configurations, $q) {
           var controller = function ($scope) {
               var assignPatientDetails = function () {
                   var patientMapper = new Bahmni.PatientMapper(configurations.patientConfig(), $rootScope, $translate);
                   return patientService.getPatient($scope.patientUuid).then(function (response) {
                       var openMrsPatient = response.data;
                       $scope.patient = patientMapper.map(openMrsPatient);
                   });
               };
               var initPromise = $q.all([assignPatientDetails()]);
               $scope.initialization = initPromise;
           };

           var link = function ($scope, element) {
               spinner.forPromise($scope.initialization, element);
           };

           return {
               restrict: 'E',
               controller: controller,
               link: link,
               scope: {
                   patientUuid: "@",
                   visitUuid: "@",
                   config: "="
               },
               templateUrl: "../common/displaycontrols/testPatient/views/testPatient.html"
           };

testPatient.html 파일의 코드 조각

<section bindonce="patient" class="dashboard-section ng-scope pacs-order">
   <h2 class="section-title">{{ ::config.name }}</h2>
               <div class="patient-value">
                    <span class="patient-name">
                       {{::patient.name }} ({{::patient.identifier}})</span>
               </div>
</section>

init.js 파일의 코드 조각

'use strict';
var Bahmni = Bahmni || {};
Bahmni.Common = Bahmni.Common || {};
Bahmni.Common.DisplayControl = Bahmni.Common.DisplayControl || {};
Bahmni.Common.DisplayControl.testPatient = Bahmni.Common.DisplayControl.testPatient || {};
angular.module('bahmni.common.displaycontrol.testPatient', []);

3단계

표시 컨트롤에 필요한 파일을 추가한 뒤 다음을 추가합니다.

ui/app/<clinical>/app.js 파일에 모듈 이름 bahmni.common.displaycontrol.testPatient 추가 ...models/dashboardSection.js의 commonDisplayControlNames 변수에 patient.html 파일 이름 추가 ui/app/<clinical>/index.html 파일에 init.js와 testPatient.js 파일 경로 추가

이제 환자 대시보드에서 아래 표시 컨트롤을 볼 수 있습니다.

Screen Shot 2018-01-24 at 5.20.44 PM.png

원문 정보

Bahmni Wiki · CC BY-SA 4.0

원문 보기 ↗