{$layout}
{$template "/clusters/cluster/node/node_menu"}
{$template "/left_menu_with_menu"}

<div class="left-right-box-container">
    <div class="right-box">
        <b-settings-header
            @action="editSchedule"
            :action-text="scheduleIsEditing?t('schedule_index@取消修改'):t('schedule_index@修改')"
        >
            {{t('schedule_index@基础设置')}}
        </b-settings-header>
        <!-- <h4>{{t('schedule_index@基础设置_1')}} &nbsp; <a href="" @click.prevent="editSchedule" style="font-size: 0.8em"><span v-if="!scheduleIsEditing">[{{t('schedule_index@修改_1')}}]</span><span v-else>[{{t('schedule_index@取消修改_1')}}]</span></a> </h4> -->

        <form class="ui form">
            <div class="config-section" v-show="!scheduleIsEditing">
                <div class="section-title">
                    <i class="pi pi-calendar"></i> {{t('schedule_index@节点调度设置')}}
                </div>
                
                <div class="config-item">
                    <div class="item-label">{{t('schedule_index@当前节点租期结束日期')}}</div>
                    <div class="item-content">
                        <span v-if="schedule.offlineDay.length > 0">{{schedule.offlineDay}}</span>
                        <span v-else class="disabled">{{t('schedule_index@没有设置')}}</span>
                        <p class="comment" v-if="schedule.isOffline"><span class="red">{{t('schedule_index@已到期')}}</span></p>
                        <p class="comment" v-else-if="schedule.isNearlyOffline"><span class="red">{{t('schedule_index@即将到期')}}</span></p>
                    </div>
                </div>
                
                <div class="config-item">
                    <div class="item-label">{{t('schedule_index@当前节点为集群备用节点')}}</div>
                    <div class="item-content">
                        <span v-if="schedule.isBackupForCluster" class="green">Y</span>
                        <span v-else class="disabled">N</span>
                    </div>
                </div>
                
                <div class="config-item">
                    <div class="item-label">{{t('schedule_index@当前节点为分组备用节点')}}</div>
                    <div class="item-content">
                        <span v-if="schedule.isBackupForGroup" class="green">Y</span>
                        <span v-else class="disabled">N</span>
                    </div>
                </div>
                
                <div class="config-item">
                    <div class="item-label">{{t('schedule_index@当前节点备用IP')}}</div>
                    <div class="item-content">
                        <div v-if="schedule.backupIPs != null && schedule.backupIPs.length > 0">
                            <span v-for="backupIP in schedule.backupIPs" class="ui basic tiny label">{{backupIP}}</span>
                        </div>
                        <span v-else class="disabled">{{t('schedule_index@无')}}</span>
                    </div>
                </div>
                
                <div class="config-item">
                    <div class="item-label">{{t('schedule_index@当前触发动作')}}</div>
                    <div class="item-content">
                        <div v-if="schedule.actionStatus != null && schedule.actionStatus.actionId > 0">
                            <div class="ui fields inline">
                                <div class="ui field">
                                    <node-schedule-conds-viewer :v-params="params" :v-operators="operators" v-model="schedule.actionStatus.conds"></node-schedule-conds-viewer>
                                </div>
                                <div class="ui field"><span class="red">-&gt;</span></div>
                                <div class="ui field">
                                    <span class="red">{{actionMap[schedule.actionStatus.action.code].name}}</span>
                                </div>
                                <div class="ui field" v-if="schedule.actionStatusExpiresTime.length > 0">
                                <span class="red">| &nbsp; &nbsp; {{t('schedule_index@有效期至')}}{{schedule.actionStatusExpiresTime}}</span>
                                </div>
                                <div class="ui field">
                                    <a href="" @click.prevent="resetActionStatus" class="action-button"><i class="pi pi-refresh"></i> {{t('schedule_index@重置')}}</a>
                                </div>
                            </div>
                        </div>
                        <div v-else>
                            <span class="disabled">{{t('schedule_index@无')}}</span>
                        </div>
                    </div>
                </div>
            </div>
        </form>

        <form class="ui form" data-tea-success="success" data-tea-action="$" v-show="scheduleIsEditing">
            <csrf-token></csrf-token>
            <input type="hidden" name="nodeId" :value="schedule.id"/>

            <div class="config-section">
                <div class="section-title">
                    <i class="pi pi-calendar"></i> {{t('schedule_index@节点调度设置')}}
                </div>
                
                <div class="config-item">
                    <div class="item-label">{{t('schedule_index@当前节点租期结束日期')}}</div>
                    <div class="item-content">
                        <datepicker name="offlineDay" v-model="schedule.offlineDay" class="ui input"></datepicker>
                        <p class="comment">{{t('schedule_index@当前节点租期结束日期到此日期后当前节点将会被自动下线如果为空则表示永远不下线')}}</p>
                    </div>
                </div>
                
                <div class="config-item">
                    <div class="item-label">{{t('schedule_index@当前节点为集群备用节点')}}</div>
                    <div class="item-content">
                        <checkbox :v-value="1" name="isBackupForCluster" v-model="schedule.isBackupForCluster"></checkbox>
                        <p class="comment">{{t('schedule_index@选中后标识当前节点为所在集群')}}<span v-if="schedule.nodeClusterName.length > 0">（<code-label>{{schedule.nodeClusterName}}</code-label>）</span>{{t('schedule_index@的备用节点同集群的其他节点可以通过调度动作切换到此节点备用节点未被调度触发时不会加入DNS域名解析')}}</p>
                    </div>
                </div>
                
                <div class="config-item">
                    <div class="item-label">{{t('schedule_index@当前节点为分组备用节点')}}</div>
                    <div class="item-content">
                        <checkbox :v-value="1" name="isBackupForGroup" v-model="schedule.isBackupForGroup"></checkbox>
                        <p class="comment">{{t('schedule_index@选中后标识当前节点为所在分组')}}<span v-if="schedule.nodeGroupName.length > 0">（<code-label>{{schedule.nodeGroupName}}</code-label>）</span>{{t('schedule_index@的备用节点同分组的其他节点可以通过调度动作切换到此节点')}}<span v-if="schedule.nodeGroupName.length == 0">{{t('schedule_index@如果暂时还没有分组则当前设置不会起作用')}}</span>{{t('schedule_index@备用节点未被调度触发时不会加入DNS域名解析')}}</p>
                    </div>
                </div>
                
                <div class="config-item">
                    <div class="item-label">{{t('schedule_index@当前节点备用IP')}}</div>
                    <div class="item-content">
                        <values-box name="backupIPs" :v-values="schedule.backupIPs" :placeholder="t('schedule_index@IP')" class="ui input"></values-box>
                        <p class="comment">{{t('schedule_index@可以通过调度动作切换到这些备用IP')}}</p>
                    </div>
                </div>
            </div>

            <div class="form-actions">
                <submit-btn></submit-btn>
            </div>
        </form>

        <div class="config-section" v-show="!scheduleIsEditing">
            <div class="section-title">
                <i class="pi pi-sync"></i> {{t('schedule_index@调度动作')}}
                <div style="margin-left: auto; display: flex; align-items: center; gap: 0.5em;">
                    <a href="" @click.prevent="createAction" class="action-button"><i class="pi pi-plus"></i> {{t('schedule_index@添加')}}</a>
                    <a href="" v-if="!showActionsCopyOps" @click.prevent="showActionsCopyOps = !showActionsCopyOps" :title="t('schedule_index@更多操作')" class="action-button"><i class="pi pi-ellipsis-h"></i>{{t('schedule_index@更多操作')}}</a>
                    <span v-show="showActionsCopyOps">
                        <a href="" v-if="schedule.nodeGroupName.length > 0" @click.prevent="copyActionsToGroup" class="action-button"><i class="pi pi-copy"></i>{{t('schedule_index@复制到分组')}}"{{schedule.nodeGroupName}}"</a>
                        <a href="" @click.prevent="copyActionsToCluster" class="action-button"><i class="pi pi-copy"></i>{{t('schedule_index@复制到集群')}}"{{schedule.nodeClusterName}}"</a>
                    </span>
                </div>
            </div>
            <div class="config-content" style="padding: 0.5em;">
                <b-empty v-if="actions.length == 0">{{t('schedule_index@暂时还没有任何调度动作')}}</b-empty>
                <div v-if="actions.length > 0">
                    <div class="ui message warning" v-if="schedule.isBackupForCluster || schedule.isBackupForGroup">
                        <i class="pi pi-exclamation-triangle"></i> {{t('schedule_index@当前节点为备用节点这里设置的调度动作将不会被触发')}}
                    </div>
    
                    <table class="ui table celled selectable" id="sortable-table">
                        <thead>
                            <tr>
                                <th style="width:3em"></th>
                                <th>{{t('schedule_index@条件')}}</th>
                                <th class="three wide">{{t('schedule_index@动作')}}</th>
                                <th class="two wide">{{t('schedule_index@持续时间')}}</th>
                                <th class="width5">{{t('schedule_index@状态')}}</th>
                                <th class="two op">{{t('schedule_index@操作')}}</th>
                            </tr>
                        </thead>
                        <tbody v-for="action in actions" :v-id="action.id">
                            <tr>
                                <td style="text-align: center;"><i class="icon bars handle grey"></i> </td>
                                <td>
                                    <node-schedule-conds-viewer :v-params="params" :v-operators="operators" v-model="action.conds"></node-schedule-conds-viewer>
                                </td>
                                <td>
                                    <span :class="{red: schedule.actionStatus != null && schedule.actionStatus.actionId > 0 && schedule.actionStatus.actionId == action.id}">{{action.actionName}}</span>
                                </td>
                                <td>{{action.durationDescription}}</td>
                                <td>
                                    <div v-if="schedule.actionStatus != null && schedule.actionStatus.actionId > 0 && schedule.actionStatus.actionId == action.id">
                                        <span class="red">{{t('schedule_index@已触发')}}</span>
                                    </div>
                                    <div v-else>
                                        <label-on :v-is-on="action.isOn"></label-on>
                                    </div>
                                </td>
                                <td>
                                    <a href="" @click.prevent="updateAction(action.id)" class="action-button"><i class="pi pi-pencil"></i> {{t('schedule_index@修改')}}</a>
                                    <a href="" @click.prevent="deleteAction(action.id)" class="action-button"><i class="pi pi-trash"></i> {{t('schedule_index@删除')}}</a>
                                </td>
                            </tr>
                        </tbody>
                    </table>
                    <p v-if="actions.length > 0" class="comment">{{t('schedule_index@可以拖动左侧的')}}<i class="icon bars"></i>{{t('schedule_index@排序')}}</p>
                </div>
            </div>
           
        </div>
    </div>
</div>