<rt-form id="{{vm.form.name}}" name="{{vm.form.name}}" novalidate>
    <div class="row rt-margin-bottom-before-box">
        <div class="col-sm-2">
            <button class="btn btn-link" type="button" id="btnClose" ng-click="vm.form.hide()">
                <i class="fa fa-sign-out"></i> 关闭
            </button>
        </div>
        <div class="col-sm-10">
            <div class="pull-right" ng-if="vm.form.isFlowApprover">
                <rt-button id="btnApprove" rt-style="link" rt-title="同意" rt-icon="floppy-o" ng-click="vm.form.flowApprove()">
                </rt-button>
                <rt-button id="btnReject" rt-style="link" rt-title="拒绝" rt-icon="floppy-o" ng-click="vm.form.flowReject()">
                </rt-button>
                <rt-button id="btnTransmit" rt-style="link" rt-title="转发" rt-icon="floppy-o" ng-click="vm.form.flowTransmit()">
                </rt-button>
            </div>

            <div class="pull-right" ng-if="vm.form.isFlowSubmitter">
                <rt-button id="btnRecall" rt-style="link" rt-title="撤销" rt-icon="floppy-o" ng-click="vm.form.flowRecall()">
                </rt-button>
            </div>

            <div class="pull-right" ng-if="vm.form.data.approval_result=='5'">
                <rt-button id="btnResubmit" rt-style="link" rt-title="重新提交" rt-icon="floppy-o" ng-click="vm.form.reSubmit()">
                </rt-button>
            </div>
        </div>
    </div>

    <div class="nav-tabs-custom">
        <ul class="nav nav-tabs">
            <li class="active">
                <a ng-click="chooseTab(1)" data-toggle="tab">出差信息</a>
            </li>
            <li>
                <a ng-click="chooseTab(2)" data-toggle="tab">审批流程</a>
            </li>
        </ul>

        <div class="tab-content" ng-if="vm.tabIndex===1">
            <div class="tab-pane active">
                <rt-section rt-title="基本信息">
                    <rt-section-row>
                        <rt-input rt-type="text" rt-title="出差天数" rt-disabled="true" rt-required="false" rt-col="4" ng-model="vm.form.data.total_days"></rt-input>
                    </rt-section-row>
                    <rt-section-row>
                        <rt-textarea rt-type="text" rt-title="出差事由" rt-disabled="true" rt-col="10" rt-row="2" ng-model="vm.form.data.content"></rt-textarea>
                    </rt-section-row>
                </rt-section>
                <rt-section rt-title="行程明细">
                    <rt-section-row>
                        <rt-data-grid-no-page rt-page-record-count="vm.page.recordCount" rt-page-index="vm.page.index" rt-page-size="vm.page.size"
                            rt-get-data="vm.view.search()" rt-sort-field="vm.view.sortField" rt-rows="vm.form.data.DetailList"
                            rt-selected-ids="vm.view.selectedIds" rt-auto-height="240">
                            <table class="table table-hover">
                                <thead>
                                    <tr>
                                        <th rt-field-code="name">出差地点
                                        </th>
                                        <th rt-field-code="name">开始时间</th>
                                        <th rt-field-code="name">结束时间</th>

                                    </tr>
                                </thead>
                                <tbody>
                                    <tr ng-repeat="row in vm.form.data.DetailList" ng-click="vm.form.delDetail($index)">
                                        <td>
                                            <span>{{row.location}}</span>
                                        </td>
                                        <td> {{row.start_date | date:'yyyy-MM-dd'}}</td>
                                        <td> {{row.end_date | date:'yyyy-MM-dd'}}</td>
                                    </tr>
                                </tbody>
                            </table>
                        </rt-data-grid-no-page>
                    </rt-section-row>
                </rt-section>
                <rt-section rt-title="附件">
                    <rt-section-row>
                        <rt-data-grid-no-page rt-page-record-count="vm.page.recordCount" rt-page-index="vm.page.index" rt-page-size="vm.page.size"
                            rt-get-data="vm.view.search()" rt-sort-field="vm.view.sortField" rt-rows="vm.data" rt-selected-ids="vm.view.selectedIds"
                            rt-auto-height="vm.view.autoHeight">
                            <table class="table table-condensed table-hover">
                                <thead>
                                    <tr>
                                        <th>
                                            <rt-header-checkbox></rt-header-checkbox>
                                        </th>
                                        <th rt-field-code="name">附件名称</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    <tr ng-repeat="row in fjs">
                                        <td>
                                            <rt-data-checkbox value="{{row.Id}}" />
                                        </td>
                                        <td>
                                            <button type="button" class="btn btn-link" ng-click="vm.form.downloadFile(row.Id)">
                                                {{row.FileName}}
                                            </button>
                                        </td>
                                    </tr>
                                </tbody>
                            </table>
                        </rt-data-grid-no-page>
                    </rt-section-row>
                </rt-section>
            </div>
        </div>
    </div>

    <div class="tab-content" ng-if="vm.tabIndex==2">
        <section id="cd-timeline" class="cd-container">
            <div ng-if="vm.form.approverList.length > 0">
                <div class="cd-timeline-block rt-flow-item">
                    <div class="cd-timeline-icon text-center" style="color:white;" ng-style="{{vm.form.getAvatarColor(3)}};">
                        {{vm.form.getAvatarName2(vm.form.approverList[0].SubmittedBy.Name)}}
                    </div>
                    <div class="cd-timeline-content" style="padding:10px;">
                        <p class="username-01">
                            {{vm.form.approverList[0].SubmittedBy.Name}}
                        </p>
                        <p class="status-02">
                            发起申请
                        </p>
                        <p class="datetime">
                            {{vm.form.approverList[0].CreatedOn | date:'yyyy-MM-dd HH:mm'}}
                        </p>
                    </div>
                </div>
            </div>
            <div ng-repeat="user in vm.form.approverList">
                <div class="cd-timeline-block rt-flow-item">
                    <div class="cd-timeline-icon text-center" style="color:white;" ng-style="{{vm.form.getAvatarColor($index)}};">
                        {{vm.form.getAvatarName2(user.OwnerId.Name)}}
                    </div>
                    <div class="cd-timeline-content" style="padding:10px;">
                        <p class="username-01" ng-show="user.approval_status.Value != 1">
                            {{user.OwnerId.Name}}
                        </p>
                        <p class="username-02" ng-show="user.approval_status.Value == 1">
                            {{user.OwnerId.Name}}
                        </p>
                        <p class="status-01" ng-show="user.approval_status.Value == 2">
                            审批中
                        </p>
                        <p class="status-02" ng-show="user.approval_status.Value == 3 && user.approval_result.Value == 2">
                            {{user.approval_result.Name}}{{user.remark!=null && user.remark!=''?"(":""}}{{user.remark}}{{user.remark!=null && user.remark!=''?")":""}}
                        </p>

                        <p class="status-03" ng-show="user.approval_status.Value == 3 && user.approval_result.Value == 3">
                            {{user.approval_result.Name}}{{user.remark!=null && user.remark!=''?"(":""}}{{user.remark}}{{user.remark!=null && user.remark!=''?")":""}}
                        </p>

                        <p class="status-02" ng-show="user.approval_status.Value == 3 && user.approval_result.Value == 4">
                            {{user.approval_result.Name}}{{user.remark!=null && user.remark!=''?"(":""}}{{user.remark}}{{user.remark!=null && user.remark!=''?")":""}}
                        </p>

                        <p class="datetime" ng-show="user.approval_result.Value == 4">
                            {{user.ModifiedOn | date:'yyyy-MM-dd HH:mm'}}
                        </p>

                        <p class="status-03" ng-show="user.approval_status.Value == 3 && user.approval_result.Value == 5">
                            {{user.approval_result.Name}}{{user.remark!=null && user.remark!=''?"(":""}}{{user.remark}}{{user.remark!=null && user.remark!=''?")":""}}
                        </p>

                        <p class="datetime" ng-show="user.approval_status.Value == 3">
                            {{user.ApprovedOn | date:'yyyy-MM-dd HH:mm'}}
                        </p>
                    </div>
                </div>
            </div>
        </section>
    </div>
</rt-form>