This is an automated email from the ASF dual-hosted git repository.
critas pushed a commit to branch main
in repository https://gitbox.apache.org/repos/asf/iotdb-docs.git
The following commit(s) were added to refs/heads/main by this push:
new ce573453 fix home display error (#919)
ce573453 is described below
commit ce573453da8ab2135a24ccce5ec4f230f45dfb95
Author: CritasWang <[email protected]>
AuthorDate: Fri Dec 5 17:28:01 2025 +0800
fix home display error (#919)
---
pnpm-lock.yaml | 20 +-
src/.vuepress/components/ResourceEvaluator.vue | 339 +++++++++++++------------
src/.vuepress/theme.ts | 1 -
src/zh/ResourceEvaluator.md | 7 +-
4 files changed, 198 insertions(+), 169 deletions(-)
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 25bb1d45..c6015021 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -853,51 +853,61 @@ packages:
resolution: {integrity:
sha512-88fSzjC5xeH9S2Vg3rPgXJULkHcLYMkh8faix8DX4h4TIAL65ekwuQMA/g2CXq8W+NJC43V6fUpYZNjaX3+IIg==}
cpu: [arm]
os: [linux]
+ libc: [glibc]
'@rollup/[email protected]':
resolution: {integrity:
sha512-wM4ztnutBqYFyvNeR7Av+reWI/enK9tDOTKNF+6Kk2Q96k9bwhDDOlnCUNRPvromlVXo04riSliMBs/Z7RteEg==}
cpu: [arm]
os: [linux]
+ libc: [musl]
'@rollup/[email protected]':
resolution: {integrity:
sha512-9RyprECbRa9zEjXLtvvshhw4CMrRa3K+0wcp3KME0zmBe1ILmvcVHnypZ/aIDXpRyfhSYSuN4EPdCCj5Du8FIA==}
cpu: [arm64]
os: [linux]
+ libc: [glibc]
'@rollup/[email protected]':
resolution: {integrity:
sha512-qTmklhCTyaJSB05S+iSovfo++EwnIEZxHkzv5dep4qoszUMX5Ca4WM4zAVUMbfdviLgCSQOu5oU8YoGk1s6M9Q==}
cpu: [arm64]
os: [linux]
+ libc: [musl]
'@rollup/[email protected]':
resolution: {integrity:
sha512-4Qmkaps9yqmpjY5pvpkfOerYgKNUGzQpFxV6rnS7c/JfYbDSU0y6WpbbredB5cCpLFGJEqYX40WUmxMkwhWCjw==}
cpu: [loong64]
os: [linux]
+ libc: [glibc]
'@rollup/[email protected]':
resolution: {integrity:
sha512-Zsrtux3PuaxuBTX/zHdLaFmcofWGzaWW1scwLU3ZbW/X+hSsFbz9wDIp6XvnT7pzYRl9MezWqEqKy7ssmDEnuQ==}
cpu: [ppc64]
os: [linux]
+ libc: [glibc]
'@rollup/[email protected]':
resolution: {integrity:
sha512-aK+Zp+CRM55iPrlyKiU3/zyhgzWBxLVrw2mwiQSYJRobCURb781+XstzvA8Gkjg/hbdQFuDw44aUOxVQFycrAg==}
cpu: [riscv64]
os: [linux]
+ libc: [glibc]
'@rollup/[email protected]':
resolution: {integrity:
sha512-WoKLVrY9ogmaYPXwTH326+ErlCIgMmsoRSx6bO+l68YgJnlOXhygDYSZe/qbUJCSiCiZAQ+tKm88NcWuUXqOzw==}
cpu: [s390x]
os: [linux]
+ libc: [glibc]
'@rollup/[email protected]':
resolution: {integrity:
sha512-Sht4aFvmA4ToHd2vFzwMFaQCiYm2lDFho5rPcvPBT5pCdC+GwHG6CMch4GQfmWTQ1SwRKS0dhDYb54khSrjDWw==}
cpu: [x64]
os: [linux]
+ libc: [glibc]
'@rollup/[email protected]':
resolution: {integrity:
sha512-zmmpOQh8vXc2QITsnCiODCDGXFC8LMi64+/oPpPx5qz3pqv0s6x46ps4xoycfUiVZps5PFn1gksZzo4RGTKT+A==}
cpu: [x64]
os: [linux]
+ libc: [musl]
'@rollup/[email protected]':
resolution: {integrity:
sha512-3/q1qUsO/tLqGBaD4uXsB6coVGB3usxw3qyeVb59aArCgedSF66MPdgRStUd7vbZOsko/CgVaY5fo2vkvPLWiA==}
@@ -1466,8 +1476,8 @@ packages:
resolution: {integrity:
sha512-L28STB170nwWS63UjtlEOE3dldQApaJXZkOI1uMFfzf3rRuPegHaHesyee+YxQ+W6SvRDQV6UrdOdRiR153wJg==}
engines: {node: '>=6'}
- [email protected]:
- resolution: {integrity:
sha512-b+uH5BakXZ9Do9iK+CkDmctUSEqZl+SP056vc5usa0PL+ev5OHw003rZXcnjNDv3L8P5j6rwT6C0BPKSikW08w==}
+ [email protected]:
+ resolution: {integrity:
sha512-Pzfx9fOKoKvevQf8oCXoyNRQ5QyxJj+3O0Rqx2V5oxT61KGx8+n6hV/IUyJeifUci2clnmmKVpvtiqRzgiWjSw==}
[email protected]:
resolution: {integrity:
sha512-eyrF0jiFpY+3drT6383f1qhkbGsLSifNAjA61IUjZjmLCWjItY6LB9ft9YhoDgwfmclB2zhu51Lc7+95b8NRAg==}
@@ -4481,7 +4491,7 @@ snapshots:
[email protected]([email protected]):
dependencies:
browserslist: 4.24.4
- caniuse-lite: 1.0.30001699
+ caniuse-lite: 1.0.30001759
fraction.js: 4.3.7
normalize-range: 0.1.2
picocolors: 1.1.1
@@ -4515,7 +4525,7 @@ snapshots:
[email protected]:
dependencies:
- caniuse-lite: 1.0.30001699
+ caniuse-lite: 1.0.30001759
electron-to-chromium: 1.5.97
node-releases: 2.0.19
update-browserslist-db: 1.1.2([email protected])
@@ -4528,7 +4538,7 @@ snapshots:
[email protected]: {}
- [email protected]: {}
+ [email protected]: {}
[email protected]: {}
diff --git a/src/.vuepress/components/ResourceEvaluator.vue
b/src/.vuepress/components/ResourceEvaluator.vue
index ccb43738..6be37d01 100644
--- a/src/.vuepress/components/ResourceEvaluator.vue
+++ b/src/.vuepress/components/ResourceEvaluator.vue
@@ -22,6 +22,7 @@ import { ElButton, ElIcon, ElForm, ElFormItem, ElInput,
ElSelect, ElOption, ElTo
import * as Icons from "@element-plus/icons-vue";
import 'element-plus/theme-chalk/index.css';
import ConfigItem from "./ConfigItem.vue";
+import { ClientOnly } from "vuepress/client";
class Calculator {
static add(...args: Array<string | number>): number {
@@ -183,256 +184,274 @@ class Calculator {
const totalSpaceInBytes = ref(0);
const singleSpaceStorage = computed(() => {
- let tmp = Calculator.toFixed(Calculator.divide(totalSpaceInBytes.value,
1024, 1024, 1024), 2);
- if (tmp >= 1024) {
- return Calculator.toFixed(Calculator.divide(totalSpaceInBytes.value,
1024, 1024, 1024, 1024), 2).toString() + ' TB';
- } else {
- return tmp.toString() + ' GB';
- }
+ let tmp = Calculator.toFixed(Calculator.divide(totalSpaceInBytes.value,
1024, 1024, 1024), 2);
+ if (tmp >= 1024) {
+ return Calculator.toFixed(Calculator.divide(totalSpaceInBytes.value, 1024,
1024, 1024, 1024), 2).toString() + ' TB';
+ } else {
+ return tmp.toString() + ' GB';
+ }
});
const doubleSpaceStorage = computed(() => {
- let tmp =
Calculator.toFixed(Calculator.divide(Calculator.multiply(totalSpaceInBytes.value,
2), 1024, 1024, 1024), 2);
- if (tmp >= 1024) {
- return
Calculator.toFixed(Calculator.divide(Calculator.multiply(totalSpaceInBytes.value,
2), 1024, 1024, 1024, 1024), 2).toString() + ' TB';
- } else {
- return tmp.toString() + ' GB';
- }
+ let tmp =
Calculator.toFixed(Calculator.divide(Calculator.multiply(totalSpaceInBytes.value,
2), 1024, 1024, 1024), 2);
+ if (tmp >= 1024) {
+ return
Calculator.toFixed(Calculator.divide(Calculator.multiply(totalSpaceInBytes.value,
2), 1024, 1024, 1024, 1024), 2).toString() + ' TB';
+ } else {
+ return tmp.toString() + ' GB';
+ }
});
const configItems = ref([{
- measurementCount: null,
- dataType: null,
- frequency: null,
- frequencyUnit: 'HZ',
- averageStringLength: null,
+ measurementCount: null,
+ dataType: null,
+ frequency: null,
+ frequencyUnit: 'HZ',
+ averageStringLength: null,
}]);
const storeInfo = ref({
- storePeriod: null,
- storePeriodUnit: 'DAY',
- compressionRatio: null,
+ storePeriod: null,
+ storePeriodUnit: 'DAY',
+ compressionRatio: 10,
});
const addConfigItem = () => {
- configItems.value.push({
- measurementCount: null,
- dataType: null,
- frequency: null,
- frequencyUnit: 'HZ',
- averageStringLength: null,
- });
+ configItems.value.push({
+ measurementCount: null,
+ dataType: null,
+ frequency: null,
+ frequencyUnit: 'HZ',
+ averageStringLength: null,
+ });
};
const removeConfigItem = (index: number) => {
- if (configItems.value.length > 1) {
- configItems.value.splice(index, 1);
- } else {
- alert('至少保留一个配置项');
- }
+ if (configItems.value.length > 1) {
+ configItems.value.splice(index, 1);
+ } else {
+ alert('至少保留一个配置项');
+ }
};
const dataTypeBytes: Record<string, number> = {
- 'BOOLEAN': 9,
- 'INT32': 12,
- 'INT64': 16,
- 'FLOAT': 12,
- 'DOUBLE': 16,
- 'TEXT': 8,
- 'STRING': 8,
- 'BLOB': 8,
- 'TIMESTAMP': 16,
- 'DATATIME': 12,
+ 'BOOLEAN': 9,
+ 'INT32': 12,
+ 'INT64': 16,
+ 'FLOAT': 12,
+ 'DOUBLE': 16,
+ 'TEXT': 8,
+ 'STRING': 8,
+ 'BLOB': 8,
+ 'TIMESTAMP': 16,
+ 'DATATIME': 12,
};
const storeDurationInDays: Record<string, number> = {
- 'DAY': 1,
- 'MONTH': 30,
- 'YEAR': 365,
+ 'DAY': 1,
+ 'MONTH': 30,
+ 'YEAR': 365,
};
const samplingPeriodInSec: Record<string, number> = {
- 'HZ': 1,
- 'SECOND': 1,
- 'MINUTE': 60,
- 'HOUR': 3600,
- 'DAY': 86400,
+ 'HZ': 1,
+ 'SECOND': 1,
+ 'MINUTE': 60,
+ 'HOUR': 3600,
+ 'DAY': 86400,
}
const calculateSpacePrecise = () => {
- let totalSpace = 0;
- configItems.value.forEach((item, index) => {
- if (item.measurementCount && item.frequency && item.dataType &&
item.frequencyUnit) {
- if (storeInfo.value.storePeriod &&
storeInfo.value.compressionRatio) {
- let measurementCount = item.measurementCount;
- let dataTypeSize = dataTypeBytes[item.dataType];
- if (item.dataType === 'STRING' || item.dataType === 'TEXT' ||
item.dataType === 'BLOB') {
- if (item.averageStringLength === null) {
- alert('请填写字符串平均长度');
- return;
- }
- dataTypeSize = Calculator.add(dataTypeSize,
Number(item.averageStringLength));
- }
- let samplingPeriod =
Calculator.multiply(samplingPeriodInSec[item.frequencyUnit], item.frequency);
- let samplePerDay = item.frequencyUnit === 'HZ' ?
Calculator.multiply(86400, item.frequency) : Calculator.divide(86400,
samplingPeriod);
- let storePeriodInDay =
Calculator.multiply(storeDurationInDays[storeInfo.value.storePeriodUnit],
Number(storeInfo.value.storePeriod));
- totalSpace = Calculator.add(totalSpace,
Calculator.divide(Calculator.multiply(measurementCount, dataTypeSize,
samplePerDay, storePeriodInDay), storeInfo.value.compressionRatio));
- } else {
- alert('请完整填写存储周期和压缩比');
- return;
- }
- } else {
- alert(`请完整填写配置项 ${index + 1} 的数据`);
+ let totalSpace = 0;
+ configItems.value.forEach((item, index) => {
+ if (item.measurementCount && item.frequency && item.dataType &&
item.frequencyUnit) {
+ if (storeInfo.value.storePeriod && storeInfo.value.compressionRatio) {
+ let measurementCount = item.measurementCount;
+ let dataTypeSize = dataTypeBytes[item.dataType];
+ if (item.dataType === 'STRING' || item.dataType === 'TEXT' ||
item.dataType === 'BLOB') {
+ if (item.averageStringLength === null) {
+ alert('请填写字符串平均长度');
return;
+ }
+ dataTypeSize = Calculator.add(dataTypeSize,
Number(item.averageStringLength));
}
- });
- totalSpaceInBytes.value = totalSpace;
+ let samplingPeriod =
Calculator.multiply(samplingPeriodInSec[item.frequencyUnit], item.frequency);
+ let samplePerDay = item.frequencyUnit === 'HZ' ?
Calculator.multiply(86400, item.frequency) : Calculator.divide(86400,
samplingPeriod);
+ let storePeriodInDay =
Calculator.multiply(storeDurationInDays[storeInfo.value.storePeriodUnit],
Number(storeInfo.value.storePeriod));
+ totalSpace = Calculator.add(totalSpace,
Calculator.divide(Calculator.multiply(measurementCount, dataTypeSize,
samplePerDay, storePeriodInDay), storeInfo.value.compressionRatio));
+ } else {
+ alert('请完整填写存储周期和压缩比');
+ return;
+ }
+ } else {
+ alert(`请完整填写配置项 ${index + 1} 的数据`);
+ return;
+ }
+ });
+ totalSpaceInBytes.value = totalSpace;
}
</script>
<template>
- <div class="content-area">
- <div class="title">IoTDB 磁盘资源评估器</div>
- <div v-for="(item, index) in configItems" :key="index"
class="relative-box">
- <el-button class="add-button" @click="addConfigItem">
- <el-icon><Icons.Plus /></el-icon>
- </el-button>
- <el-button class="remove-button" @click="removeConfigItem(index)"
:disabled="configItems.length <= 1">
- <el-icon><Icons.Minus /></el-icon>
- </el-button>
- <ConfigItem :index="index + 1" v-model:info="configItems[index]" />
- </div>
- <div class="outer-box">
- <el-form :inline="true" class="store-row">
+ <ClientOnly>
+ <div class="calc-content-area">
+ <div class="title">IoTDB 磁盘资源评估器</div>
+ <div v-for="(item, index) in configItems" :key="index"
class="relative-box">
+ <el-button class="add-button" @click="addConfigItem">
+ <el-icon>
+ <Icons.Plus />
+ </el-icon>
+ </el-button>
+ <el-button class="remove-button" @click="removeConfigItem(index)"
:disabled="configItems.length <= 1">
+ <el-icon>
+ <Icons.Minus />
+ </el-icon>
+ </el-button>
+ <ConfigItem :index="index + 1" v-model:info="configItems[index]" />
+ </div>
+ <div class="outer-box">
+ <el-form :inline="true" class="store-row">
<el-form-item label="存储周期：" label-width="90px">
- <el-input v-model="storeInfo.storePeriod" placeholder="请输入存储周期"
type="number" min="0" style="width: 205px;"></el-input>
- <el-select v-model="storeInfo.storePeriodUnit" style="width:
80px;">
- <el-option label="天" value="DAY"></el-option>
- <el-option label="月" value="MONTH"></el-option>
- <el-option label="年" value="YEAR"></el-option>
- </el-select>
+ <el-input v-model="storeInfo.storePeriod" placeholder="请输入存储周期"
type="number" min="0"
+ style="width: 205px;"></el-input>
+ <el-select v-model="storeInfo.storePeriodUnit" style="width:
80px;">
+ <el-option label="天" value="DAY"></el-option>
+ <el-option label="月" value="MONTH"></el-option>
+ <el-option label="年" value="YEAR"></el-option>
+ </el-select>
</el-form-item>
- <el-form-item label-width="130px" >
+ <el-form-item label-width="130px">
<template #label>
预估压缩比：
<client-only>
<el-tooltip placement="top" effect="light"
content="原始数据与压缩后数据的体积比值（压缩比 = 原始大小 / 压缩后大小）">
- <el-icon color=""><Icons.QuestionFilled /></el-icon>
+ <el-icon color="">
+ <Icons.QuestionFilled />
+ </el-icon>
</el-tooltip>
</client-only>
</template>
- <el-input v-model="storeInfo.compressionRatio" type="number"
min="0" placeholder="请输入预估压缩比" style="width: 180px;"></el-input>
+ <el-input v-model="storeInfo.compressionRatio" type="number"
min="0" placeholder="请输入预估压缩比"
+ style="width: 180px;"></el-input>
</el-form-item>
- </el-form>
- </div>
- <div class="button-row">
- <el-button class="calculate-button" color="#4c59c7"
@click="calculateSpacePrecise()">计算结果</el-button>
- </div>
- <div class="result-row">
- <el-form :inline="true">
- <el-form-item label-width="200px">
- <template #label>
- 每节点共需磁盘空间：
- <client-only>
- <el-tooltip placement="top" effect="light">
- <template #content>
- <ul>
- <li>双活为两节点单副本（每台机器按单副本规划资源）</li>
- <li>三节点分布式集群推荐使用双副本（每台机器按双副本规划资源）</li>
- </ul>
- </template>
- <el-icon><Icons.QuestionFilled /></el-icon>
- </el-tooltip>
- </client-only>
- </template>
- </el-form-item>
-
- <el-form-item label="单副本空间：" label-width="150px">
- <div class="result-text">{{ singleSpaceStorage }}</div>
- </el-form-item>
- <el-form-item label="双副本空间：" label-width="150px">
- <div class="result-text">{{ doubleSpaceStorage }}</div>
- </el-form-item>
- </el-form>
+ </el-form>
+ </div>
+ <div class="button-row">
+ <el-button class="calculate-button" color="#4c59c7"
@click="calculateSpacePrecise()">计算结果</el-button>
+ </div>
+ <div class="result-row">
+ <el-form :inline="true">
+ <el-form-item label-width="200px">
+ <template #label>
+ 每节点共需磁盘空间：
+ <client-only>
+ <el-tooltip placement="top" effect="light">
+ <template #content>
+ <ul>
+ <li>双活为两节点单副本（每台机器按单副本规划资源）</li>
+ <li>三节点分布式集群推荐使用双副本（每台机器按双副本规划资源）</li>
+ </ul>
+ </template>
+ <el-icon>
+ <Icons.QuestionFilled />
+ </el-icon>
+ </el-tooltip>
+ </client-only>
+ </template>
+ </el-form-item>
+
+ <el-form-item label="单副本空间：" label-width="150px">
+ <div class="result-text">{{ singleSpaceStorage }}</div>
+ </el-form-item>
+ <el-form-item label="双副本空间：" label-width="150px">
+ <div class="result-text">{{ doubleSpaceStorage }}</div>
+ </el-form-item>
+ </el-form>
+ </div>
</div>
- </div>
+ </ClientOnly>
</template>
-<style>
-#main-content .theme-hope-content {
- padding: 0;
-}
-
-header .vp-hero-info {
- visibility: hidden;
+<style lang="scss">
+.calc-page {
+ display: flex;
+ justify-content: center;
+ margin-top: 50px;
+ margin-bottom: 50px;
+
+ .vp-page-title,
+ .vp-page-meta,
+ .vp-breadcrumb {
+ display: none;
+ }
}
-#main-content .vp-hero-info-wrapper {
- visibility: hidden;
+.theme-hope-content {
+ width: 1230px;
+ max-width: 100% !important;
+ overflow: auto;
}
-.content-area {
- width: 1230px;
- margin-left: -35px;
-}
+.calc-content-area {
+ width: 1230px;
-.title {
+ .title {
text-align: center;
font-size: 28px;
font-weight: bold;
margin-bottom: 40px;
-}
+ }
-.relative-box {
+ .relative-box {
position: relative;
-}
+ }
-.add-button {
+ .add-button {
background-color: transparent;
border: none;
position: absolute;
right: 48px;
top: 8px;
-}
+ }
-.remove-button {
+ .remove-button {
background-color: transparent;
border: none;
position: absolute;
right: 8px;
top: 8px;
-}
+ }
-.store-row {
+ .store-row {
display: flex;
margin-top: 20px;
margin-bottom: 20px;
-}
+ }
-.button-row {
+ .button-row {
display: flex;
justify-content: center;
margin-top: 50px;
margin-bottom: 30px;
-}
+ }
-.calculate-button {
- padding: 20px 30px;
-}
+ .calculate-button {
+ padding: 20px 30px;
+ }
-.result-row {
+ .result-row {
display: flex;
justify-content: space-evenly;
background-color: #f2f5fc;
border-radius: 15px;
padding: 30px;
margin-bottom: 50px;
-}
+ }
-.result-text {
+ .result-text {
color: #4c59c7;
font-weight: bold;
+ }
}
</style>
\ No newline at end of file
diff --git a/src/.vuepress/theme.ts b/src/.vuepress/theme.ts
index 103997d6..b7ae2c21 100644
--- a/src/.vuepress/theme.ts
+++ b/src/.vuepress/theme.ts
@@ -19,7 +19,6 @@
import { hopeTheme } from 'vuepress-theme-hope';
import { enNavbar, zhNavbar } from './navbar/index.js';
import { enSidebar, zhSidebar } from './sidebar/index.js';
-import { error } from 'vuepress/utils';
export default hopeTheme(
{
diff --git a/src/zh/ResourceEvaluator.md b/src/zh/ResourceEvaluator.md
index e16bc100..027885c1 100644
--- a/src/zh/ResourceEvaluator.md
+++ b/src/zh/ResourceEvaluator.md
@@ -1,7 +1,8 @@
---
-home: true
-heroText: ''
+toc: false
+containerClass: 'calc-page'
---
+
<!--
Licensed to the Apache Software Foundation (ASF) under one
@@ -26,4 +27,4 @@ heroText: ''
<script setup>
import ResourceEvaluator from
'@source/.vuepress/components/ResourceEvaluator.vue'
-</script>
\ No newline at end of file
+</script>
