<div data-options="dxView : { name: 'RegularCheckSchedulePopup' } ">
    <div data-bind="dxPopup: popupOptions ">
        <div class="dx-clearfix" data-options="dxTemplate: { name: 'title' } " style="margin: 0 auto;">
            <div data-bind="dxToolbar: { dataSource: toolbarItems2 }"></div>
        </div>
        <div class="dx-clearfix" data-options="dxTemplate: { name: 'content' } ">
            <div id="popupDetail" data-bind="dxscrollview: { }">
                <div class="dx-fieldset" style="float: left; width: 480px">
                    <div class="dx-field">
                        <div class="dx-field-label">@registerUserName</div>
                        <div class="dx-field-value" data-bind="text: dataModel.UpdateUserName"></div>
                    </div>
                    <div class="dx-field">
                        <div class="dx-field-label">@businessFieldName (*)</div>
                        <div class="dx-field-value" data-bind="css: {'dx-state-invisible': isEditModeInPopup }, text: dataModel.BusinessFieldName"></div>
                        <!-- ko if: isEditModeInPopup -->
                        <div class="dx-field-value" data-bind="dxSelectBox: {
                            dataSource: businessFields,
                            displayExpr: 'Name' ,
                            valueExpr: 'BusinessFieldId' ,
                            value: dataModel.BusinessFieldId
                        }"></div>
                        <!-- /ko -->
                    </div>
                    <div class="dx-field">
                        <div class="dx-field-label">@facilityCheckScheduleName (*)</div>
                        <div class="dx-field-value" style="width:290px" data-bind="css: {'dx-state-invisible': isEditModeInPopup }, text: dataModel.Name"></div>
                        <div class="dx-field-value" style="width:290px" data-bind="dxTextBox: { value: dataModel.Name }, css: {'dx-state-invisible': !isEditModeInPopup() }"></div>
                    </div>
                    <div class="dx-field">
                        <div class="dx-field-label">@workDueDate</div>
                        <div class="dx-field-value" data-bind="css: {'dx-state-invisible': isEditModeInPopup }, text: $G.date( dataModel.WorkDueDate() )"></div>
                        <!-- jks 2015.12.04 달력아이콘 위치 수정 -->
                        <div class="dx-field-value dxDateBox_IconLocation" data-bind="dxDateBox: { value: dataModel.WorkDueDate, format: 'date' , min: new Date(moment().add(-1,'M'))}, css: {'dx-state-invisible': !isEditModeInPopup() }">
                            <!--valueChangeAction: processValueChange-->
                        </div>
                    </div>

                    <div class="dx-field cw-multi-field">
                        <div class="dx-field-label">@facilityCheckScheduleHoliday (*)</div>
                        <div class="dx-field-value" data-bind="css: {'dx-state-invisible': isEditModeInPopup }, text: dataModel.HolidayWorkTypeName"></div>
                        <!-- ko if: isEditModeInPopup -->
                        <div class="dx-field-value" data-bind="dxSelectBox: {
                            dataSource: holidayWorkTypes,
                            displayExpr: 'Name' ,
                            valueExpr: 'HolidayWorkTypeId' ,
                            value: dataModel.HolidayWorkTypeId }">
                        </div>
                        <!-- /ko -->
                    </div>

                    <div class="dx-field">
                        <div class="dx-field-label">@facilityCheckScheduleCycleUnit (*)</div>
                        <div class="dx-field-value" data-bind="css: {'dx-state-invisible': isEditModeInPopup }, text: dataModel.CycleSizeText"></div>
                        <div class="dx-field-value" data-bind="dxNumberBox: { value: dataModel.CycleSize, min:1 }, css: {'dx-state-invisible': !isEditModeInPopup() }"></div>
                        <!-- ko if: isEditModeInPopup -->
                        <div class="dx-field-value" data-bind="dxSelectBox: {
                            dataSource: cycleUnits,
                            displayExpr: 'Name' ,
                            valueExpr: 'CycleUnitId' ,
                            value: dataModel.CycleUnitId }" style="margin-left:140px">
                        </div>
                        <!-- /ko -->
                    </div>

                    <!-- ko if: legalCheckOptions -->
                    <div class="dx-field">
                        <div class="dx-field-label">@legalInspectionAgency</div>
                        <div class="dx-field-value" data-bind="css: {'dx-state-invisible': isEditModeInPopup }, text: dataModel.InspectionAgencyName"></div>
                        <!-- ko if: isEditModeInPopup -->
                        <div class="dx-field-value" data-bind="dxSelectBox: {
                            dataSource: agencies,
                            displayExpr: 'Name' ,
                            valueExpr: 'PartnerId' ,
                            value: dataModel.InspectionAgencyId }">
                        </div>
                        <!-- /ko -->
                    </div>
                    <!-- /ko -->

                    <div class="dx-field">
                        <div class="dx-field-label">@autoOrder</div>
                        <div class="dx-field-value" data-bind="css: {'dx-state-invisible': isEditModeInPopup }, text: $G.isUse( dataModel.IsAutoOrder() )"></div>
                        <!-- ko if: isEditModeInPopup -->
                        <div class="dx-field-value" data-bind="dxSwitch: { value: dataModel.IsAutoOrder, onText: $G('use'), offText: $G('nonUse')  }"></div>
                        <!-- /ko -->
                    </div>
                    <div class="dx-field">
                        <div class="dx-field-label">@isUse</div>
                        <div class="dx-field-value" data-bind="css: {'dx-state-invisible': isEditModeInPopup }, text: $G.isUse( dataModel.IsUse() )"></div>
                        <!-- ko if: isEditModeInPopup -->
                        <div class="dx-field-value" data-bind="dxSwitch: { value: dataModel.IsUse, onText: $G('use'), offText: $G('nonUse')  }"></div>
                        <!-- /ko -->
                    </div>

                    <div class="result_popup_table_wrap" style="border:0; padding:0 0 10px 0">
                        <table>
                            <caption class="skip">요청내용</caption>
                            <tbody>
                                <tr>
                                    <td class="result_item result_item_var minimal_height">@requestCheck</td>
                                </tr>
                                <tr>
                                    <td class="result_con">
                                        <!-- jks 2015.12.07 입력영역 확대 -->
                                        <div class="dx-field-value dxTextArea_InputArea" data-bind="dxTextArea: { value: dataModel.Content, height: 80 }, css: {'dx-state-invisible': !isEditModeInPopup() }"></div>
                                        <div class="dx-field-value cw-wordwrap" style="height: 80px;" data-bind="text: dataModel.Content, css: {'dx-state-invisible': isEditModeInPopup }"></div>
                                    </td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>

                <div class="dx-fieldset" style="float: left; width:700px; padding-left: 0px !important;">
                    <p class="body_sub_title_2depth">@facilityList</p>
                    <div id="gridContainer2" class="dx-field-value" style="height: 340px; width:680px;" data-bind="dxDataGrid: popup.facilityDataGridOptions"></div>
                    <!-- ko if: popup.modifiableFacilityDataGridOptions -->
                    <div id="gridContainer3"  class="dx-field-value" style="height: 340px; width: 680px; " data-bind="dxDataGrid: popup.modifiableFacilityDataGridOptions"></div>
                    <!-- /ko -->
                </div>
            </div>
        </div>
    </div>
</div>