path: root/web/html/index.html

{{ template "page/head_start" .}}
{{ template "page/head_end" .}}

{{ template "page/body_start" .}}
<style>
  body.dark .custom-geo-section code.custom-geo-ext-code {
    color: var(--dark-color-text-primary, rgba(255, 255, 255, 0.85));
    background: var(--dark-color-surface-200, #222d42);
    border: 1px solid var(--dark-color-stroke, #2c3950);
    padding: 2px 6px;
    border-radius: 3px;
  }

  html[data-theme="ultra-dark"] body.dark .custom-geo-section code.custom-geo-ext-code {
    color: var(--dark-color-text-primary, rgba(255, 255, 255, 0.88));
    background: var(--dark-color-surface-700, #111929);
    border-color: var(--dark-color-stroke, #2c3950);
  }
</style>
<a-layout id="app" v-cloak :class="themeSwitcher.currentTheme + ' index-page'">
  <a-sidebar></a-sidebar>
  <a-layout id="content-layout">
    <a-layout-content>
      <a-spin :spinning="loadingStates.spinning" :delay="200" :tip="loadingTip" size="large">
        <transition name="list" appear>
          <a-alert type="error" v-if="showAlert && loadingStates.fetched" class="mb-10"
            message='{{ i18n "secAlertTitle" }}' color="red" description='{{ i18n "secAlertSsl" }}' show-icon closable>
          </a-alert>
        </transition>
        <transition name="list" appear>
          <template>
            <a-row v-if="!loadingStates.fetched">
              <div :style="{ minHeight: 'calc(100vh - 120px)' }"></div>
            </a-row>
            <a-row :gutter="[isMobile ? 8 : 16, isMobile ? 0 : 12]" v-else>
              <a-col>
                <a-card hoverable>
                  <a-row :gutter="[0, isMobile ? 16 : 0]">
                    <a-col :sm="24" :md="12">
                      <a-row>
                        <a-col :span="12" class="text-center">
                          <a-progress type="dashboard" status="normal" :stroke-color="status.cpu.color"
                            :percent="status.cpu.percent"></a-progress>
                          <div>
                            <b>{{ i18n "pages.index.cpu" }}:</b> [[ CPUFormatter.cpuCoreFormat(status.cpuCores) ]]
                            <a-tooltip>
                              <a-icon type="area-chart"></a-icon>
                              <template slot="title">
                                <div><b>{{ i18n "pages.index.logicalProcessors" }}:</b> [[ (status.logicalPro) ]]</div>
                                <div><b>{{ i18n "pages.index.frequency" }}:</b> [[
                                  CPUFormatter.cpuSpeedFormat(status.cpuSpeedMhz) ]]</div>
                              </template>
                            </a-tooltip>
                            <a-tooltip :overlay-class-name="themeSwitcher.currentTheme">
                              <a-button size="small" shape="circle" class="ml-8" @click="openCpuHistory()">
                                <a-icon type="history" />
                              </a-button>
                            </a-tooltip>
                          </div>
                        </a-col>
                        <a-col :span="12" class="text-center">
                          <a-progress type="dashboard" status="normal" :stroke-color="status.mem.color"
                            :percent="status.mem.percent"></a-progress>
                          <div>
                            <b>{{ i18n "pages.index.memory"}}:</b> [[ SizeFormatter.sizeFormat(status.mem.current) ]] /
                            [[ SizeFormatter.sizeFormat(status.mem.total) ]]
                          </div>
                        </a-col>
                      </a-row>
                    </a-col>
                    <a-col :sm="24" :md="12">
                      <a-row>
                        <a-col :span="12" class="text-center">
                          <a-progress type="dashboard" status="normal" :stroke-color="status.swap.color"
                            :percent            

                

                    
                        contacts: admin@thfree.ru
                    
                
                

                    
                        mirrors for living