다보리 파라메터의 개념
다보리 파라메터
다보리 컴포저블에서는 모든 구성요소들을 파라메터를 통해 관리, 구성하고 있습니다. 다보리 파라메터를 통해 다음과 같이 구현이 가능합니다. 몇가지 예시를 소개합니다.
고객입력창 구현을 위한 파라메터
{
"General": {
"Title": "고객입력",
"PickApi": "slip-form-book",
"ActApi": "company-act"
},
"QueryVars": {
"QueryName": "pos/customer"
},
"SelectButtonOptions": [
{
"Value": "new",
"Caption": "새 레코드"
},
{
"Value": "del",
"Caption": "레코드 삭제"
},
{
"Value": "copy",
"Caption": "레코드 복사"
},
{
"Value": "rpt-print-pdf",
"Caption": "연말정산(pdf)"
},
{
"Value": "rpt-print-paper",
"Caption": "연말정산(종이)"
}
],
"//FormVars": "ListVars[0]-Caption",
"FormVars": [
{
"SaveButton": "저장",
"CompanyName": "고객번호(자동채번)*",
"MainContact": "고객명* / 성별",
"MobileNo": "휴대전화*",
"TelNo": "유선전화",
"BirthDate": "생년월일*",
"Email": "이메일*",
"CgroupId": "고객분류*",
"ZipCode": "우편번호*",
"Addr1": "주소*",
"Addr2": "주소상세",
"IsOkText": "문자발송",
"IsOkEmail": "이메일발송",
"IsOkDm": "디엠발송",
"Remarks": "관리자메모",
"UserCredit": "적립금",
"CurrUserCredit": "현재 적립금",
"AvailUserCredit": "가용 적립금(적용-버튼)"
},
{
"SaveButton": "",
"CompanyName": "left",
"MainContact": "left",
"MobileNo": "left",
"TelNo": "left",
"BirthDate": "left",
"Email": "left",
"CgroupId": "left",
"ZipCode": "left",
"Addr1": "left",
"Addr2": "left",
"IsOkText": "left",
"IsOkEmail": "left",
"IsOkDm": "left",
"Remarks": "left",
"UserCredit": "left",
"CurrUserCredit": "left",
"AvailUserCredit": "left"
},
{
"SaveButton": "0",
"CompanyName": "20",
"MainContact": "20",
"MobileNo": "20",
"TelNo": "20",
"BirthDate": "20",
"Email": "20",
"CgroupId": "20",
"ZipCode": "20",
"Addr1": "20",
"Addr2": "100",
"IsOkText": "20",
"IsOkEmail": "20",
"IsOkDm": "20",
"Remarks": "",
"UserCredit": "20",
"CurrUserCredit": "20",
"AvailUserCredit": "20"
},
{
"SaveButton": "",
"CompanyName": "required",
"MainContact": "required",
"MobileNo": "required",
"TelNo": "",
"BirthDate": "required",
"Email": "required",
"CgroupId": "required",
"ZipCode": "required",
"Addr1": "required",
"Addr2": "",
"IsOkText": "",
"IsOkEmail": "",
"IsOkDm": "",
"Remarks": "",
"UserCredit": "",
"CurrUserCredit": "",
"AvailUserCredit": ""
}
]
}['General']['Title'] : view page에서 페이지의 title로 사용
['General']['PickApi'] : view page 혹은 비지니스 로직에서 api 서버로 특정 pick-api를 호출 가능
['QueryVars']['QueryName'] : api 서버에 특정 api 호출시 백엔드서버에 요청할 query를 지정
let response = await call_slip_form_book(formA['General']['PickApi'], formA['QueryVars']['QueryName'],
customer_name, {!! json_encode($menuCode) !!});$('.customer-eyetest-act').on('click', function () {
// console.log($(this).data('value'))
switch( $(this).data('value') ) {
case 'save': customer_eyetest_btn_act_save(); break;
case 'new': atype_custom_btn_act_new(); break;
case 'copy': customer_eyetest_btn_act_copy(); break;
case 'del': customer_eyetest_btn_act_del(); break;
case 'rpt-print-pdf': Stype.rpt_print('#customer-eyetest .frm'); break;
case 'rpt-print-paper': print_test(); break;
}
});<ul class="dropdown-menu dropdown-menu-right" role="menu">
@foreach ($formA['SelectButtonOptions'] as $key => $btn)
<li class="dropdown-item">`{{ $btn['Caption'] }}`</li>
@endforeach
</ul>['FormVars'][0] : label, input등의 title
['FormVars'][1] : label, input css 정렬
['FormVars'][2] : label, input등의 maxlength 설정
['FormVars'][2] : label, input등의 필수요소 설정
<div class="form-group w-100 d-flex flex-column" style="width: 143px">
<label class="m-0 overflow-hidden text-nowrap">{{ $formA['FormVars']['Title']['CompanyName'] }}</label>
<div class="col-12 d-flex p-0">
<input type="text" class="auto-slip-no-txt rounded w-100 radius-l0" autocomplete="off" disabled
maxlength="{{ $formA['FormVars']['MaxLength']['CompanyName'] }}"
{{ $formA['FormVars']['Required']['CompanyName'] }}>
</div>
</div>품목찾기 모달창 구현을 위한 파라메터
{
"General": {
"Title": "품목 찾기",
"PageApi": "item-search-page"
},
"QueryVars": {
"QueryName": "master/item",
"FilterName": "is_material",
"FilterValue": "0"
},
"//FormVars": "ListVars[0]-Caption, ListVars[0]-format",
"FormVars": [
{
"SelectButton": "",
"ItemCode": "품목코드",
"ItemName": "품명",
"SubName": "서브명",
"CountUnit": "수량단위",
"CurrStockQty": "현재고",
"PurchPrc": "표준매입가",
"SalesPrc": "표준매출가",
"ItemDesc": "품목설명",
"FilterOption": "검색조건",
"SimpleOption": "상태별 검색"
},
{
"SelectButton": "left",
"ItemCode": "left",
"ItemName": "left",
"SubName": "left",
"CountUnit": "left",
"CurrStockQty": "decimal('stock_qty')",
"PurchPrc": "decimal('purch_prc')",
"SalesPrc": "decimal('sales_prc')",
"ItemDesc": "left",
"FilterOption": "left",
"SimpleOption": "left"
}
],
"// OrderByOptions": "OrderBy Options//첫번째 Value가 Default, 필수(Required)",
"OrderByOptions": [
{
"Value": "item_code asc",
"Caption": "품목코드 정렬"
},
{
"Value": "item_name asc",
"Caption": "품명 정렬"
},
{
"Value": "sub_name asc",
"Caption": "서브명 정렬"
}
],
"FilterSelectOptions": [
{
"Value": "",
"Caption": "=검색 조건="
},
{
"Value": "mx.item_code",
"Caption": "품목코드"
},
{
"Value": "mx.item_name",
"Caption": "품명"
},
{
"Value": "mx.sub_name",
"Caption": "서브명"
}
],
"SimpleSelectOptions": [
{
"Value": "mx.expose_type='0'",
"Caption": "온라인 게시"
},
{
"Value": "mx.expose_type='1'",
"Caption": "온라인 누락"
},
{
"Value": "mx.expose_type='2'",
"Caption": "쿠폰신청 상품"
},
{
"Value": "",
"Caption": "전체"
}
],
"// ListVars": "ListVars[0]-caption, ListVars[1]-size(%), ListVars[2]-align",
"// Price": "Prices show with comma and truncate numbers under decimal !!",
"ListVars": [
{
"$Radio": "$Radio",
"$Check": "",
"No": "번호",
"ItemCode": "품목 코드",
"ItemName": "품명",
"SubName": "서브명",
"IgroupName": "품목구분",
"SalesPrc": "매출가",
"PurchPrc": "매입가",
"MoreInfo": "추가정보"
},
{
"$Radio": "3",
"$Check": "3",
"No": "10",
"ItemCode": "15",
"ItemName": "12",
"SubName": "12",
"IgroupName": "13",
"SalesPrc": "10",
"PurchPrc": "10",
"MoreInfo": "10"
},
{
"$Radio": "center",
"$Check": "center",
"No": "center",
"ItemCode": "left",
"ItemName": "left",
"SubName": "left",
"IgroupName": "left",
"SalesPrc": "decimal('sales_qty')",
"PurchPrc": "decimal('purch_prc')",
"MoreInfo": "left"
}
]
}