{$layout}
{$template "../menu"}
{$template "/left_menu_with_menu"}

<div class="left-right-box-container">

    <div class="right-box">
        {$template "menu"}

        <div class="ui message warning" style="margin-top: 1em;" v-if="results.length > 0 && !allOk">
            {{t('clusters_cluster_settings_services_status@有节点的Systemd服务配置未能生效')}}
        </div>

         <loading-message v-if="isRequesting">{{t('clusters_cluster_settings_services_status@正在节点服务状态检测中')}}</loading-message>

         <div v-if="!isRequesting">
            <b-table
                v-if="results.length > 0"
                :columns="[
                    {
                        title: t('clusters_cluster_settings_services_status@节点名'),
                        key: 'nodeName',
                        scopedSlots: { customRender: 'nameSlot' }
                    },
                    {
                        title: t('clusters_cluster_settings_services_status@是否已启用服务'),
                        key: 'isOk',
                        scopedSlots: { customRender: 'statusSlot' },
                        width: '200px',
                        align: 'center'
                    },
                     {
                        title: t('clusters_cluster_settings_services_status@提示消息'),
                        key: 'message',
                        scopedSlots: { customRender: 'messageSlot' }
                    }
                ]"
                :data-source="results"
                :row-key="'nodeId'"
                size="middle"
            >
                <!-- 节点名 -->
                <template slot="nameSlot" slot-scope="{ record }">
                    {{record.nodeName}}
                </template>

                <!-- 是否已启用服务 -->
                <template slot="statusSlot" slot-scope="{ record }">
                    <span v-if="record.isOk" class="green"><i class="icon check circle"></i> {{t('clusters_cluster_settings_services_status@是')}}</span>
                    <span v-else class="red"><i class="icon times circle"></i> {{t('clusters_cluster_settings_services_status@否')}}</span>
                </template>

                 <!-- 提示消息 -->
                 <template slot="messageSlot" slot-scope="{ record }">
                      <span :class="{red: !record.isOk}">{{record.message}}</span>
                </template>

            </b-table>

             <b-empty v-if="results.length == 0">{{t('clusters_cluster_settings_services_status@暂时还没有节点')}}</b-empty>
         </div>

    </div>
</div>