<ion-view class="opportunity" view-title="Opportunity" hide-nav-bar="true">
    <ion-content scroll="false" id="opportunityContents">
        <div class="app-main" id="main-content">
            <div compile-html="dataOppHtml.menuHeader" class="app-header"></div>
            <div class="app-content">
                <div class="app-content-inner content-pd" compile-html="dataOppHtml.mainContent"></div>
            </div>
            <div class="opportunity-app-create-button app-create-button show" ng-show="buttonAddOpportunity">
                <button class="button-add-plus-1 pd0-i w50px h50px" type="button" ng-click="openByGetTemplate('addOpportunity')"></button>
            </div>
        </div>

        <div class="app-content-popup-area">
            <div id="popupCallRecord" class="app-content-popup">
                <div class="app-header bg-header-1">
                    <div class="layout-fixed full-h text-center">
                        <div class="full-h v-bottom-i pdB15">
                            <div class="app-content-header bg-header-1">
                                <div class="text-title-header-1 nowrap mgT10">Call recording</div>
                            </div>
                        </div>
                    </div>
                    <button type="button" class="close-audio popup-back-button bg-transparent pd0-i biger-3-time" ng-click="closeTarget('#popupCallRecord')"></button>
                </div>
                <div class="app-content">
                    <div class="app-content-inner content-pd">
                        <div class="box-center full">
                            <div class="box-setting-4 w300px center form-field-container no-saperator rounded-15">
                                <div class="content content-in">
                                    <div class="itm">
                                        <div class="text-title-5 text-center">Client name :</div>
                                        <div class="text-title-5 text-center mgT5">{{audioInformation.name}}</div>
                                    </div>
                                    <div class="itm">
                                        <div class="text-title-5 text-center">Phone number :</div>
                                        <div class="text-title-5 text-center mgT5">{{audioInformation.phone}}</div>
                                    </div>
                                    <div class="itm">
                                        <div class="text-title-5 text-center">Representative :</div>
                                        <div class="text-title-5 text-center mgT5">{{audioInformation.representative}}</div>
                                    </div>
                                    <div class="itm">
                                        <div class="text-title-5 text-center">Leadsource:</div>
                                        <div class="text text-center mgT5">{{audioInformation.lead_source}}</div>
                                    </div>
                                    <div class="itm">
                                        <div class="text-title-5 text-center">Duration :</div>
                                        <div class="text text-center mgT5">{{audioInformation.durations}}</div>
                                    </div>
                                    <div class="itm">
                                        <div id="callRecordAudioArea"></div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div compile-html="dataOppHtml.popupOpportunityFilterReport" id="popupOpportunityFilterReport" class="app-content-popup"></div>
            <div compile-html="dataOppHtml.popupOpportunityFilterReportDisplay" id="popupOpportunityFilterReportDisplay" class="app-content-popup"></div>
            <div compile-html="dataOppHtml.popupOpportunityImport" id="popupOpportunityImport" class="app-content-popup"></div>
            <div compile-html="dataOppHtml.addOpportunity" id="addOpportunity" class="app-content-popup"></div>

            <div compile-html="dataOppHtml.popupOpportunityPending" id="popupOpportunityPending" class="app-content-popup"></div>
            <div compile-html="dataOppHtml.popupOpportunityAction" id="popupOpportunityAction" class="app-content-popup"></div>
            <div compile-html="dataOppHtml.popupOpportunityActionConfirmOpen" id="popupOpportunityActionConfirmOpen" class="app-content-popup popup-center"> </div>
            <div compile-html="dataOppHtml.popupOpportunityActionFlagNote" id="popupOpportunityActionFlagNote" class="app-content-popup"></div>
            <div compile-html="dataOppHtml.popupOpportunityHistory" id="popupOpportunityHistory" class="app-content-popup"></div>
            <div compile-html="dataOppHtml.popupOpportunityHistoryFilter" id="popupOpportunityHistoryFilter" class="app-content-popup"></div>
            <div compile-html="dataOppHtml.popupOpportunityHistoryCustomerNote" id="popupOpportunityHistoryCustomerNote" class="app-content-popup"></div>
            <div compile-html="dataOppHtml.popupCheckAdditionalPhones" id="popupCheckAdditionalPhones" class="app-content-popup"></div>
            <div id="popupOpportunityHistoryAddCustomerNote" compile-html="dataOppHtml.popupOpportunityHistoryAddCustomerNote" class="app-content-popup"></div>
            <div compile-html="dataOppHtml.popupOpportunityHistoryEditCustomerNote" id="popupOpportunityHistoryEditCustomerNote" class="app-content-popup"></div>
            <div compile-html="dataOppHtml.popupOpportunityHistoryOrder" id="popupOpportunityHistoryOrder" class="app-content-popup"></div>
            <div compile-html="dataOppHtml.popupOpportunityViewDescriptionLog" id="popupOpportunityViewDescriptionLog" class="app-content-popup"></div>
            <div compile-html="dataOppHtml.popupOpportunityChangeCustomerNote" id="popupOpportunityChangeCustomerNote" class="app-content-popup"></div>
            <div compile-html="dataOppHtml.popupWarningAddPhoneEmail" id="popupWarningAddPhoneEmail" class="app-content-popup popup-center"> </div>
            <div compile-html="dataOppHtml.popupWarningAddPhoneNumber" id="popupWarningAddPhoneNumber" class="app-content-popup popup-center"> </div>
            <div ng-controller="scheduleCtrl">
                <div compile-html="dataOppHtml.opportunityAppointmentSpecificInformation" id="opportunityAppointmentSpecificInformation" class="app-content-popup"></div>


                <div compile-html="dataAppHtml.scheduleDetailEdit" id="scheduleDetailEdit" class="schedule-detail-popup app-content-popup {{appIsCancel != 0 ? 'cancel':''}}"></div><!--Them class Cancel khi Appointmt bi huy-->
                <div compile-html="dataAppHtml.optionScheduleDetail" id="optionScheduleDetail" class="app-confirm-popup"></div>
                <div compile-html="dataAppHtml.optionScheduleDetailFileManagement" id="optionScheduleDetailFileManagement" class="app-confirm-popup"></div>
                <div compile-html="dataAppHtml.popupScheduleDetailFileManagementDetail" id="popupScheduleDetailFileManagementDetail" class="app-content-popup"></div>
                <div compile-html="dataAppHtml.popupAddScheduleDetailFileManagementDetail" id="popupAddScheduleDetailFileManagementDetail" class="app-content-popup"></div>
                <div compile-html="dataAppHtml.popupScheduleDetailJobStatus" id="popupScheduleDetailJobStatus" class="app-content-popup"></div>
                <div compile-html="dataAppHtml.popupScheduleDetailJobSites" id="popupScheduleDetailJobSites" class="app-content-popup"></div>
                <div compile-html="dataAppHtml.popupScheduleDetailHistories" id="popupScheduleDetailHistories" class="app-content-popup"></div>
                <div compile-html="dataAppHtml.customerDetailPopupAppointmentHistoryViewLog" id="customerDetailPopupAppointmentHistoryViewLog" class="app-content-popup"></div>
                <div compile-html="dataAppHtml.popupScheduleDetailFileManagement" id="popupScheduleDetailFileManagement" class="app-content-popup"></div>
                <div compile-html="dataAppHtml.scheduleEditModal" id="scheduleEditModal" class="app-content-popup"></div>
                <div compile-html="dataAppHtml.schedulesPopupViewMessLogmodal" id="schedulesPopupViewMessLogmodal" class="app-content-popup"></div>
                <div compile-html="dataAppHtml.schedulesPopupConfirmChangeFielworker" id="schedulesPopupConfirmChangeFielworker" class="app-confirm-popup"></div>
                <div id="optionScheduleDetailCustomerInfor" class="app-confirm-popup">
                    <div class="overlay-area" ng-click="closeTarget('#optionScheduleDetailCustomerInfor')"></div>
                    <div class="content-area popup-2">
                        <div class="title">
                            <div class="icon">
                                <svg class="h20px" viewBox="0 0 60 60"> <path d="M14,36C8.486,36,4,40.486,4,46s4.486,10,10,10s10-4.486,10-10S19.514,36,14,36z M14,54c-4.411,0-8-3.589-8-8s3.589-8,8-8   s8,3.589,8,8S18.411,54,14,54z" /> <path d="M46,32H14C6.28,32,0,38.28,0,46s6.28,14,14,14h32c7.72,0,14-6.28,14-14S53.72,32,46,32z M46,58H14C7.383,58,2,52.617,2,46   s5.383-12,12-12h32c6.617,0,12,5.383,12,12S52.617,58,46,58z" /> <path d="M14,28h32c7.72,0,14-6.28,14-14S53.72,0,46,0H14C6.28,0,0,6.28,0,14S6.28,28,14,28z M46,4c5.514,0,10,4.486,10,10   s-4.486,10-10,10s-10-4.486-10-10S40.486,4,46,4z" /> </svg>
                            </div>
                            Client options
                        </div>
                        <div class="content row-fixed-15 pdB0-i">
                            <ul class="list-item-03" ng-click="redirectTo('customers.html?customer_id=' + detailCustomerData.id + '#/board/customers')">
                                <li>
                                    <div class="layout-fixed">
                                        <div class="icon-area">
                                            <svg class="h15px" viewBox="0 0 55 55"> <path d="M55,27.5C55,12.337,42.663,0,27.5,0S0,12.337,0,27.5c0,8.009,3.444,15.228,8.926,20.258l-0.026,0.023l0.892,0.752  c0.058,0.049,0.121,0.089,0.179,0.137c0.474,0.393,0.965,0.766,1.465,1.127c0.162,0.117,0.324,0.234,0.489,0.348  c0.534,0.368,1.082,0.717,1.642,1.048c0.122,0.072,0.245,0.142,0.368,0.212c0.613,0.349,1.239,0.678,1.88,0.98  c0.047,0.022,0.095,0.042,0.142,0.064c2.089,0.971,4.319,1.684,6.651,2.105c0.061,0.011,0.122,0.022,0.184,0.033  c0.724,0.125,1.456,0.225,2.197,0.292c0.09,0.008,0.18,0.013,0.271,0.021C25.998,54.961,26.744,55,27.5,55  c0.749,0,1.488-0.039,2.222-0.098c0.093-0.008,0.186-0.013,0.279-0.021c0.735-0.067,1.461-0.164,2.178-0.287  c0.062-0.011,0.125-0.022,0.187-0.034c2.297-0.412,4.495-1.109,6.557-2.055c0.076-0.035,0.153-0.068,0.229-0.104  c0.617-0.29,1.22-0.603,1.811-0.936c0.147-0.083,0.293-0.167,0.439-0.253c0.538-0.317,1.067-0.648,1.581-1  c0.185-0.126,0.366-0.259,0.549-0.391c0.439-0.316,0.87-0.642,1.289-0.983c0.093-0.075,0.193-0.14,0.284-0.217l0.915-0.764  l-0.027-0.023C51.523,42.802,55,35.55,55,27.5z M2,27.5C2,13.439,13.439,2,27.5,2S53,13.439,53,27.5  c0,7.577-3.325,14.389-8.589,19.063c-0.294-0.203-0.59-0.385-0.893-0.537l-8.467-4.233c-0.76-0.38-1.232-1.144-1.232-1.993v-2.957  c0.196-0.242,0.403-0.516,0.617-0.817c1.096-1.548,1.975-3.27,2.616-5.123c1.267-0.602,2.085-1.864,2.085-3.289v-3.545  c0-0.867-0.318-1.708-0.887-2.369v-4.667c0.052-0.52,0.236-3.448-1.883-5.864C34.524,9.065,31.541,8,27.5,8  s-7.024,1.065-8.867,3.168c-2.119,2.416-1.935,5.346-1.883,5.864v4.667c-0.568,0.661-0.887,1.502-0.887,2.369v3.545  c0,1.101,0.494,2.128,1.34,2.821c0.81,3.173,2.477,5.575,3.093,6.389v2.894c0,0.816-0.445,1.566-1.162,1.958l-7.907,4.313  c-0.252,0.137-0.502,0.297-0.752,0.476C5.276,41.792,2,35.022,2,27.5z" /> </svg>
                                        </div>
                                        <div class="name-area text-link-1">
                                            About {{setCustomerName(detailCustomerData.company_name,detailCustomerData.first_name,detailCustomerData.last_name)}}
                                        </div>
                                    </div>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
                <div id="optionScheduleDetailAppointmentInfor" class="app-confirm-popup">
                    <div class="overlay-area" ng-click="closeTarget('#optionScheduleDetailAppointmentInfor')"></div>
                    <div class="content-area popup-2">
                        <div class="title">
                            <div class="icon">
                                <svg class="h20px" viewBox="0 0 60 60"> <path d="M14,36C8.486,36,4,40.486,4,46s4.486,10,10,10s10-4.486,10-10S19.514,36,14,36z M14,54c-4.411,0-8-3.589-8-8s3.589-8,8-8   s8,3.589,8,8S18.411,54,14,54z" /> <path d="M46,32H14C6.28,32,0,38.28,0,46s6.28,14,14,14h32c7.72,0,14-6.28,14-14S53.72,32,46,32z M46,58H14C7.383,58,2,52.617,2,46   s5.383-12,12-12h32c6.617,0,12,5.383,12,12S52.617,58,46,58z" /> <path d="M14,28h32c7.72,0,14-6.28,14-14S53.72,0,46,0H14C6.28,0,0,6.28,0,14S6.28,28,14,28z M46,4c5.514,0,10,4.486,10,10   s-4.486,10-10,10s-10-4.486-10-10S40.486,4,46,4z" /> </svg>
                            </div>
                            Appointment options
                        </div>
                        <div class="content row-fixed-15 pdB0-i">
                            <ul class="list-item-03" ng-click="viewAppnote(detailAppointmentData.logOffice, detailAppointmentData.logFieldworker)" ng-if="tier.t3">
                                <li>
                                    <div class="layout-fixed">
                                        <div class="icon-area">
                                            <svg class="h15px" viewBox="0 0 458.721 458.721"> <path d="M407.377,38.065h-20.934v30.737h20.934c0.868,0,1.575,0.706,1.575,1.575v76.208H49.769V70.377     c0-0.868,0.706-1.575,1.575-1.575h20.933V38.065H51.344c-17.817,0-32.312,14.495-32.312,32.312v356.032     c0,17.817,14.495,32.312,32.312,32.312h356.033c17.817,0,32.312-14.495,32.312-32.312V70.377     C439.689,52.56,425.194,38.065,407.377,38.065z M101.79,222.345h156.127c8.488,0,15.369,6.881,15.369,15.369     c0,8.488-6.881,15.368-15.369,15.368H101.79c-8.488,0-15.368-6.881-15.368-15.368S93.302,222.345,101.79,222.345z      M349.425,328.574H101.79c-8.488,0-15.368-6.881-15.368-15.368s6.88-15.368,15.368-15.368h247.635     c8.488,0,15.369,6.881,15.369,15.368S357.913,328.574,349.425,328.574z" /> <rect x="270.343" y="38.065" width="34.135" height="30.737" /> <rect x="154.243" y="38.065" width="34.134" height="30.737" /> <path d="M113.26,101.972c8.488,0,15.368-6.881,15.368-15.368V15.368C128.629,6.881,121.748,0,113.26,0     S97.892,6.881,97.892,15.368v71.235C97.892,95.091,104.772,101.972,113.26,101.972z" /> <path d="M229.36,101.972c8.488,0,15.368-6.881,15.368-15.368V15.368C244.729,6.881,237.848,0,229.36,0     c-8.488,0-15.369,6.881-15.369,15.368v71.235C213.992,95.091,220.872,101.972,229.36,101.972z" /> <path d="M345.461,101.972c8.488,0,15.369-6.881,15.369-15.368V15.368C360.829,6.881,353.948,0,345.461,0     s-15.368,6.881-15.368,15.368v71.235C330.092,95.091,336.973,101.972,345.461,101.972z" /> </svg>
                                        </div>
                                        <div class="name-area text-link-1">
                                            Appointment logs
                                        </div>
                                    </div>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>

                <div compile-html="dataAppHtml.popupPendingToEnroutemodal" id="popupPendingToEnroutemodal" class="app-content-popup popup-center"></div>
                <div compile-html="dataAppHtml.popupEnrouteToArivemodal" id="popupEnrouteToArivemodal" class="app-content-popup popup-center"></div>
                <div compile-html="dataAppHtml.popupAriveToWorkingmodal" id="popupAriveToWorkingmodal" class="app-content-popup popup-center"></div>
                <div compile-html="dataAppHtml.popupWorkingToFinishmodal" id="popupWorkingToFinishmodal" class="app-content-popup popup-center"></div>
                <div compile-html="dataAppHtml.popupPendingToEnrouteCAmodal" id="popupPendingToEnrouteCAmodal" class="app-content-popup popup-center"></div>
                <div compile-html="dataAppHtml.popupRetrySentMessegemodal" id="popupRetrySentMessegemodal" class="app-content-popup popup-center"></div>
                
                <div ng-controller="checklistCtrl">
                    <div compile-html="dataAppHtml.checklistPopup" class="app-content-popup" id="checklistPopup"></div>
                    <div compile-html="dataAppHtml.checklistPopupConfirm" class="app-confirm-popup" id="checklistPopupConfirm"></div>
                    <div compile-html="dataAppHtml.selectInvoice" class="app-content-popup" id="selectInvoice"></div>
                    <form ng-submit="Add_Payment()" compile-html="dataAppHtml.addpayment" class="app-content-popup" id="addpayment" novalidate="" name="formPaymentAdd"></form>
                    <div id="checklistPopupSubmitConfirm" class="app-confirm-popup" ng-include="'templates/dashboard/checklist/submit.tpl'"></div>
                </div>

                
            </div>
            <div compile-html="dataOppHtml.opportunityActionFollowUp" id="opportunityActionFollowUp" class="app-content-popup"></div>
            <div compile-html="dataOppHtml.opportunityActionAddTask" id="opportunityActionAddTask" class="app-content-popup"></div>
            <div compile-html="dataOppHtml.opportunityActionOther" id="opportunityActionOther" class="app-content-popup"></div>

            <div compile-html="dataOppHtml.opportunityFollowUpSubTab" id="opportunityFollowUpSubTab" class="app-content-popup"></div>
            <div compile-html="dataOppHtml.opportunityFollowUpContent" id="opportunityFollowUpContent" class="app-content-popup"></div>
            <div compile-html="dataOppHtml.opportunityFollowUpFollowUp" id="opportunityFollowUpFollowUp" class="app-content-popup"></div>
            <div compile-html="dataOppHtml.opportunityFollowToFail" id="opportunityFollowToFail" class="app-content-popup"></div>

            <div compile-html="dataOppHtml.opportunitySuccessContent" id="opportunitySuccessContent" class="app-content-popup"></div>

            <div compile-html="dataOppHtml.opportunityFailSubTab" id="opportunityFailSubTab" class="app-content-popup"></div>
            <div compile-html="dataOppHtml.opportunityFailContents" id="opportunityFailContents" class="app-content-popup"></div>
            <div compile-html="dataOppHtml.popupOpportunityFailNote" id="popupOpportunityFailNote" class="app-content-popup"></div>

            <div compile-html="dataOppHtml.opportunityOtherSubTab" id="opportunityOtherSubTab" class="app-content-popup"></div>
            <div compile-html="dataOppHtml.opportunityOtherContent" id="opportunityOtherContent" class="app-content-popup"></div>

            <div compile-html="dataOppHtml.opportunityCallListSubTab" id="opportunityCallListSubTab" class="app-content-popup"></div>
            <div compile-html="dataOppHtml.opportunityCallListContent" id="opportunityCallListContent" class="app-content-popup"></div>
            <div compile-html="dataOppHtml.searchOpp" class="app-setting"></div>
            <div id="popupAlertCheckPhonePrimary" class="app-confirm-popup">
            <div class="overlay-area" ng-click="closeTarget('#popupAlertCheckPhonePrimary')"></div>
                <div class="content-area popup-2">
                    <div class="title">
                        <div class="icon">
                            <svg class="h20px" viewBox="0 0 60 60"> <path d="M14,36C8.486,36,4,40.486,4,46s4.486,10,10,10s10-4.486,10-10S19.514,36,14,36z M14,54c-4.411,0-8-3.589-8-8s3.589-8,8-8   s8,3.589,8,8S18.411,54,14,54z" /> <path d="M46,32H14C6.28,32,0,38.28,0,46s6.28,14,14,14h32c7.72,0,14-6.28,14-14S53.72,32,46,32z M46,58H14C7.383,58,2,52.617,2,46   s5.383-12,12-12h32c6.617,0,12,5.383,12,12S52.617,58,46,58z" /> <path d="M14,28h32c7.72,0,14-6.28,14-14S53.72,0,46,0H14C6.28,0,0,6.28,0,14S6.28,28,14,28z M46,4c5.514,0,10,4.486,10,10   s-4.486,10-10,10s-10-4.486-10-10S40.486,4,46,4z" /> </svg>
                        </div>
                        {{dataOppHtml.titlePopup}}
                    </div>
                    <div class="content row-fixed-15 pdB0-i">
                        <ul class="list-item-03" ng-click="closeTarget('#popupAlertCheckPhonePrimary')">
                            <li>
                                <div class="layout-fixed">
                                    <div class="icon-area">
                                        <svg class="h15px" viewBox="0 0 491.4 491.4"> <path d="M491.4,0.7H2.9v354.7h488.4V0.7H491.4z M247.2,262.8c-46.7,0-84.8-37.7-84.8-84.8c0-46.7,37.7-84.8,84.8-84.8    c46.7,0,84.8,37.7,84.8,84.8C331.5,224.7,293.8,262.8,247.2,262.8z" /> <circle cx="87.5" cy="451.4" r="39.3" /> <g> <path d="M475,440.1H139.2c1.4,7.5,1.4,15.1,0,22.6H475c6.2,0,11.3-5.1,11.3-11.3C486.3,445.2,481.2,440.1,475,440.1z" /> <path d="M26.7,440.1H11.3c-6.2,0-11.3,5.1-11.3,11.3c0,6.2,5.1,11.3,11.3,11.3h15.4C25.4,455.2,25.4,447.6,26.7,440.1z" /> </g> <polygon points="214.9,228.6 279.4,178 214.9,127.5   " /> </svg>
                                    </div>
                                    <div class="name-area text-link-1" style="white-space: initial;">
                                        {{dataOppHtml.contentPopup}}
                                    </div>
                                </div>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
            <div compile-html="dataOppHtml.opptunityViewAppoimentNote" id="opptunityViewAppoimentNote" class="app-content-popup"></div>
            <div compile-html="dataOppHtml.opptunityViewNoteOfRecord" id="opptunityViewNoteOfRecord" class="app-content-popup"></div>
            <div compile-html="dataOppHtml.opportunityduplicatecustomer" id="opportunityduplicatecustomer" class="app-content-popup"></div>
            <div compile-html="dataOppHtml.popupConfirmDeletePhones" id="popupConfirmDeletePhones" class="app-content-popup popup-center"></div>
            <div compile-html="dataOppHtml.popupConfirmDeleteMail" id="popupConfirmDeleteMail" class="app-content-popup popup-center"></div>
        </div>
    </ion-content>
</ion-view>

<style type="text/css">
.bgred {
    background: rgba(242, 185, 179, 0.75) !important;
}  
</style>
