<div class="overlay-area" ng-click="closeTarget('#popupOrderInvoiceDetailSaleDetailOption')"></div>
<div class="content-area" style="width: 360px;">
    <div class="content">
        <div class="content-inner">
            <ion-scroll class="scroll-area" direction="y" has-bouncing="false" overflow-scroll="false">
                <div class="box-setting-4 form-field-container no-saperator">
                    <div class="content content-in">
                        <div class="itm">
                            <div class="layout-fixed">
                                <div class="w120px text-title-4 text-right pdR10">
                                    Sale:
                                </div>
                                <div class="pdL5">
                                    <div class="text">{{Representative}}</div>
                                    <div class="text-date-1">{{Date_Sale}}</div>
                                </div>
                            </div>
                        </div>
                        <div class="itm" ng-if="Installer != '' && Installer_date != ''">
                            <div class="layout-fixed">
                                <div class="w120px text-title-4 text-right pdR10">
                                    Installer:
                                </div>
                                <div class="pdL5">
                                    <div class="text">{{Representative_Installer}}</div>
                                    <div class="text-date-1">{{installer_date}}</div>
                                </div>
                            </div>
                        </div>
                        <div class="itm">
                            <div class="layout-fixed">
                                <div class="w120px text-title-4 text-right pdR10">
                                    Type of Service:
                                </div>
                                <div>
                                    <div class="input-form-field-1">
                                        <input type="text" class="h32px" name="" value="{{Input_value.service}}" placeholder="" disabled>
                                        <div class="sign-r clear">
                                            <button class="bg-transparent full-h right pdR10" type="button">
                                                <svg class="h17px clr-symbol-clickable" viewBox="0 0 63.215 63.215"> <g> <g> <path fill="#1075BB" d="M59.807,15.717L31.491,43.791L3.419,15.475c-0.777-0.785-2.044-0.789-2.828-0.012c-0.784,0.777-0.789,2.044-0.012,2.827    l29.194,29.448c0.365,0.368,0.835,0.563,1.312,0.589c0.139,0.008,0.278-0.001,0.415-0.021c0.054,0.008,0.106,0.021,0.16,0.022    c0.544,0.029,1.099-0.162,1.515-0.576l29.447-29.196c0.785-0.777,0.79-2.043,0.012-2.828    C61.856,14.943,60.59,14.939,59.807,15.717z" /> </g> </g> </svg>
                                            </button>
                                        </div>
                                        <select class="field-overlay" ng-model="Service" ng-options="item.id as item.name for item in typeOfService" ng-change="changeIputValue('service',Service) ; selectService(Service,'')" disabled></select>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <!-- <div class="itm">
                            <div class="layout-fixed">
                                <div class="w120px text-title-4 text-right pdR10">
                                    Service:
                                </div>
                                <div>
                                    <div class="input-form-field-1">
                                        <input type="text" class="h32px" name="" value="{{Input_value.optionService}}" disabled>
                                        <div class="sign-r clear">
                                            <button class="bg-transparent full-h right pdR10" type="button">
                                                <svg class="h17px clr-symbol-clickable" viewBox="0 0 63.215 63.215"> <g> <g> <path fill="#1075BB" d="M59.807,15.717L31.491,43.791L3.419,15.475c-0.777-0.785-2.044-0.789-2.828-0.012c-0.784,0.777-0.789,2.044-0.012,2.827    l29.194,29.448c0.365,0.368,0.835,0.563,1.312,0.589c0.139,0.008,0.278-0.001,0.415-0.021c0.054,0.008,0.106,0.021,0.16,0.022    c0.544,0.029,1.099-0.162,1.515-0.576l29.447-29.196c0.785-0.777,0.79-2.043,0.012-2.828    C61.856,14.943,60.59,14.939,59.807,15.717z" /> </g> </g> </svg>
                                            </button>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div> -->
                        <div class="itm" ng-show="Input_value.service == 'Repair' || Input_value.service == 'Installation'">
                            <div class="layout-fixed">
                                <div class="w120px text-title-4 text-right pdR10">
                                    Service:
                                </div>
                                <div>
                                    <div class="input-form-field-1">
                                        <input type="text" class="h32px" name="" value="{{Input_value.optionService}}" placeholder="Select" disabled>
                                        <div class="sign-r clear">
                                            <button class="bg-transparent full-h right pdR10" type="button">
                                                <svg class="h17px clr-symbol-clickable" viewBox="0 0 63.215 63.215"> <g> <g> <path fill="#1075BB" d="M59.807,15.717L31.491,43.791L3.419,15.475c-0.777-0.785-2.044-0.789-2.828-0.012c-0.784,0.777-0.789,2.044-0.012,2.827    l29.194,29.448c0.365,0.368,0.835,0.563,1.312,0.589c0.139,0.008,0.278-0.001,0.415-0.021c0.054,0.008,0.106,0.021,0.16,0.022    c0.544,0.029,1.099-0.162,1.515-0.576l29.447-29.196c0.785-0.777,0.79-2.043,0.012-2.828    C61.856,14.943,60.59,14.939,59.807,15.717z" /> </g> </g> </svg>
                                            </button>
                                        </div>
                                        <select class="field-overlay" ng-model="OptionService" ng-options="item.id as item.name for item in optionOfService" ng-change="changeIputValue('typeofservice',OptionService) ; selectService(Service, OptionService)" disabled></select>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="itm" ng-show="Service == '6' || Service == 6">
                            <div class="layout-fixed">
                                <div class="w120px text-title-4 text-right pdR10">
                                    Service:
                                </div>
                                <div>
                                    <div class="input-form-field-1">
                                        <input type="text" class="h32px" name="" value="{{StoreLocation}}" placeholder="Select" disabled>
                                        <div class="sign-r clear">
                                            <button class="bg-transparent full-h right pdR10" type="button">
                                                <svg class="h17px clr-symbol-clickable" viewBox="0 0 63.215 63.215"> <g> <g> <path fill="#1075BB" d="M59.807,15.717L31.491,43.791L3.419,15.475c-0.777-0.785-2.044-0.789-2.828-0.012c-0.784,0.777-0.789,2.044-0.012,2.827    l29.194,29.448c0.365,0.368,0.835,0.563,1.312,0.589c0.139,0.008,0.278-0.001,0.415-0.021c0.054,0.008,0.106,0.021,0.16,0.022    c0.544,0.029,1.099-0.162,1.515-0.576l29.447-29.196c0.785-0.777,0.79-2.043,0.012-2.828    C61.856,14.943,60.59,14.939,59.807,15.717z" /> </g> </g> </svg>
                                            </button>
                                        </div>
                                        <select class="field-overlay" ng-model="StoreLocation" ng-change="selectStoreLocation(StoreLocation)" disabled>
                                            <option value="Burnsville">Burnsville</option>
                                            <option value="Plymouth">Plymouth</option>
                                            <option value="Coon Rapids">Coon Rapids</option>
                                        </select>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </ion-scroll>
        </div>
    </div>
    <div class="buttons">
        <div class="layout-fixed" ng-click="closeTarget('#popupOrderInvoiceDetailSaleDetailOption')">
            <div>
                <button class="button-form-field-1 position-right w150px block-i center">
                    <svg class="icon h12px" viewBox="0 0 497.5 497.5"> <path d="M487.75,78.125c-13-13-33-13-46,0l-272,272l-114-113c-13-13-33-13-46,0s-13,33,0,46l137,136   c6,6,15,10,23,10s17-4,23-10l295-294C500.75,112.125,500.75,91.125,487.75,78.125z" /> </svg>
                    Apply
                </button>
            </div>
        </div>
    </div>
</div>