Skip to content

Commit

Permalink
翻译自述文件 + 新增人民币大写转换器 + 修复输出区域宽度溢出 (#3)
Browse files Browse the repository at this point in the history
* 修复 format-transformer 输出区域宽度溢出

* 新增工具:人民币大写转换器

* 翻译自述文件

* -
  • Loading branch information
angelofan committed Jan 2, 2024
1 parent f01f0c2 commit 6297c10
Show file tree
Hide file tree
Showing 7 changed files with 165 additions and 66 deletions.
105 changes: 40 additions & 65 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,47 +1,25 @@
![logo](.github/logo.png)

Useful tools for developer and people working in IT. [Have a look !](https://it-tools.tech).
对于开发人员和 IT 工作人员来说非常有用的工具。

## Functionalities and roadmap
[[在线预览](https://it-tools.haokudelei.com/)]

Please check the [issues](https://github.com/angelofan/it-tools/issues) to see if some feature listed to be implemented.
## 建议新工具

You have an idea of a tool? Submit a [feature request](https://github.com/angelofan/it-tools/issues/new/choose)!
请前往 issues 提出新工具的想法,并查看列出的某些功能是否已实现。

## Self host
## 指北

Self host solutions for your homelab
### 推荐的 IDE 设置

**From docker hub:**
建议安装 [VSCode](https://code.visualstudio.com/) 扩展:

```sh
docker run -d --name it-tools --restart unless-stopped -p 8080:80 corentinth/it-tools:latest
```

**From github packages:**

```sh
docker run -d --name it-tools --restart unless-stopped -p 8080:80 ghcr.io/corentinth/it-tools:latest
```

**Other solutions:**

- [Cloudron](https://www.cloudron.io/store/tech.ittools.cloudron.html)
- [Tipi](https://www.runtipi.io/docs/apps-available)
- [Unraid](https://unraid.net/community/apps?q=it-tools)

## Contribute

### Recommended IDE Setup

[VSCode](https://code.visualstudio.com/) with the following extensions:

- [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar) (and disable Vetur)
- [Volar](https://marketplace.visualstudio.com/items?itemName=Vue.volar) (需要禁用 Vetur)
- [TypeScript Vue Plugin (Volar)](https://marketplace.visualstudio.com/items?itemName=Vue.vscode-typescript-vue-plugin).
- [ESLint](https://marketplace.visualstudio.com/items?itemName=dbaeumer.vscode-eslint)
- [i18n Ally](https://marketplace.visualstudio.com/items?itemName=lokalise.i18n-ally)

with the following settings:
建议的扩展设置:

```json
{
Expand All @@ -54,74 +32,71 @@ with the following settings:
}
```

### Type Support for `.vue` Imports in TS
### TS 中对“.vue”导入的类型支持

TypeScript cannot handle type information for `.vue` imports by default, so we replace the `tsc` CLI with `vue-tsc` for type checking. In editors, we need [TypeScript Vue Plugin (Volar)](https://marketplace.visualstudio.com/items?itemName=Vue.vscode-typescript-vue-plugin) to make the TypeScript language service aware of `.vue` types.
默认情况下,TypeScript 无法处理“.vue”导入的类型信息,因此我们将“tscCLI 替换为“vue-tsc”来进行类型检查。 在编辑器中,我们需要 [TypeScript Vue Plugin (Volar)](https://marketplace.visualstudio.com/items?itemName=Vue.vscode-typescript-vue-plugin) 来使 TypeScript 语言服务识别 `.vue` 类型。

If the standalone TypeScript plugin doesn't feel fast enough to you, Volar has also implemented a [Take Over Mode](https://github.com/johnsoncodehk/volar/discussions/471#discussioncomment-1361669) that is more performant. You can enable it by the following steps:
如果您觉得独立的 TypeScript 插件不够快,Volar 还实现了性能更高的[接管模式](https://github.com/johnsoncodehk/volar/discussions/471#discussioncomment-1361669)。 您可以通过以下步骤启用它:

1. Disable the built-in TypeScript Extension
1. Run `Extensions: Show Built-in Extensions` from VSCode's command palette
2. Find `TypeScript and JavaScript Language Features`, right click and select `Disable (Workspace)`
2. Reload the VSCode window by running `Developer: Reload Window` from the command palette.
1.禁用内置的TypeScript扩展
1. VSCode 的命令面板运行 “扩展:显示内置扩展”
2. 找到 “TypeScript JavaScript 语言功能” ,右键单击并选择 “禁用(工作区)”
2. 通过从命令面板运行 “Developer: Reload Window” 来重新加载 VSCode 窗口。

### Project Setup
### 下载

```sh
pnpm install
git clone https://gitee.com/angelofan/it-tools.git
```

### Compile and Hot-Reload for Development
### 安装依赖

```sh
pnpm dev
cd it-tools
```

### Type-Check, Compile and Minify for Production

```sh
pnpm build
npm install
```

### Run Unit Tests with [Vitest](https://vitest.dev/)
### 启动实时重载开发

```sh
pnpm test
npm run dev
```

### Lint with [ESLint](https://eslint.org/)
### 编译

```sh
pnpm lint
npm run build
```

### Create a new tool

To create a new tool, there is a script that generate the boilerplate of the new tool, simply run:
### 使用 [ESLint](https://eslint.org/) 进行检查

```sh
pnpm run script:create:tool my-tool-name
npm run lint
```

It will create a directory in `src/tools` with the correct files, and a the import in `src/tools/index.ts`. You will just need to add the imported tool in the proper category and develop the tool.
### 创建一个新工具

## Contributors
要创建新工具,有一个脚本可以生成新工具的样板文件,只需运行:

Big thanks to all the people who have already contributed!
```sh
npm run script:create:tool your-tool-name
```

[![contributors](https://contrib.rocks/image?repo=corentinth/it-tools)](https://github.com/angelofan/it-tools/graphs/contributors)
它将在 “src/tools” 中创建一个包含正确文件的目录,并在 “src/tools/index.ts” 中自动导入。您只需要将导入的工具添加到适当的类别中并开发该工具。

## Credits
## 贡献

Coded with ❤️ by [Corentin Thomasset](//corentin-thomasset.fr).
非常感谢所有已经做出贡献的人!

This project is continuously deployed using [vercel.com](https://vercel.com).
由作者 [Corentin Thomasset](//corentin-thomasset.fr) 编写。

Contributor graph is generated using [contrib.rocks](https://contrib.rocks/preview?repo=corentinth/it-tools).
该项目使用 [vercel.com](https://vercel.com) 持续部署。

<a href="https://www.producthunt.com/posts/it-tools?utm_source=badge-featured&utm_medium=badge&utm_souce=badge-it&#0045;tools" target="_blank"><img src="https://api.producthunt.com/widgets/embed-image/v1/featured.svg?post_id=345793&theme=light" alt="IT&#0032;Tools - Collection&#0032;of&#0032;handy&#0032;online&#0032;tools&#0032;for&#0032;devs&#0044;&#0032;with&#0032;great&#0032;UX | Product Hunt" style="width: 250px; height: 54px;" width="250" height="54" /></a>
<a href="https://www.producthunt.com/posts/it-tools?utm_source=badge-top-post-badge&utm_medium=badge&utm_souce=badge-it&#0045;tools" target="_blank"><img src="https://api.producthunt.com/widgets/embed-image/v1/top-post-badge.svg?post_id=345793&theme=light&period=daily" alt="IT&#0032;Tools - Collection&#0032;of&#0032;handy&#0032;online&#0032;tools&#0032;for&#0032;devs&#0044;&#0032;with&#0032;great&#0032;UX | Product Hunt" style="width: 250px; height: 54px;" width="250" height="54" /></a>
贡献者图是使用 [contrib.rocks](https://contrib.rocks/preview?repo=corentinth/it-tools) 生成的。

## License
## 许可证

This project is under the [GNU GPLv3](LICENSE).
[GNU GPLv3](LICENSE)
1 change: 1 addition & 0 deletions components.d.ts
Original file line number Diff line number Diff line change
Expand Up @@ -180,6 +180,7 @@ declare module 'vue' {
QrCodeGenerator: typeof import('./src/tools/qr-code-generator/qr-code-generator.vue')['default']
RandomPortGenerator: typeof import('./src/tools/random-port-generator/random-port-generator.vue')['default']
ResultRow: typeof import('./src/tools/ipv4-range-expander/result-row.vue')['default']
RmbD: typeof import('./src/tools/rmb-d/rmb-d.vue')['default']
RomanNumeralConverter: typeof import('./src/tools/roman-numeral-converter/roman-numeral-converter.vue')['default']
RouterLink: typeof import('vue-router')['RouterLink']
RouterView: typeof import('vue-router')['RouterView']
Expand Down
2 changes: 1 addition & 1 deletion src/components/FormatTransformer.vue
Original file line number Diff line number Diff line change
Expand Up @@ -48,7 +48,7 @@ const output = computed(() => transformer.value(input.value));
monospace
/>

<div style="width: 100%;">
<div overflow-auto>
<div mb-5px>
{{ outputLabel }}
</div>
Expand Down
2 changes: 2 additions & 0 deletions src/tools/index.ts
Original file line number Diff line number Diff line change
@@ -1,6 +1,7 @@
import { tool as base64FileConverter } from './base64-file-converter';
import { tool as base64StringConverter } from './base64-string-converter';
import { tool as basicAuthGenerator } from './basic-auth-generator';
import { tool as rmbD } from './rmb-d';
import { tool as pdfSignatureChecker } from './pdf-signature-checker';
import { tool as numeronymGenerator } from './numeronym-generator';
import { tool as macAddressGenerator } from './mac-address-generator';
Expand Down Expand Up @@ -96,6 +97,7 @@ export const toolsByCategory: ToolCategory[] = [
{
name: 'Converter',
components: [
rmbD,
dateTimeConverter,
baseConverter,
romanNumeralConverter,
Expand Down
12 changes: 12 additions & 0 deletions src/tools/rmb-d/index.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
import { CurrencyYen } from '@vicons/tabler';
import { defineTool } from '../tool';

export const tool = defineTool({
name: '人民币大写转换器',
path: '/rmb-d',
description: '人民币大写转换工具,提供在线人民币大写转换服务',
keywords: ['人民币', '大写', '转换'],
component: () => import('./rmb-d.vue'),
icon: CurrencyYen,
createdAt: new Date('2023-12-11'),
});
66 changes: 66 additions & 0 deletions src/tools/rmb-d/rmb-d.models.ts
Original file line number Diff line number Diff line change
@@ -0,0 +1,66 @@
export { rmb };

const numbers = ['零', '壹', '贰', '叁', '肆', '伍', '陆', '柒', '捌', '玖'];
const leftUnits = ['元', '拾', '佰', '仟', '万', '拾', '佰', '仟', '亿', '拾', '佰', '仟', '万', '拾', '佰', '仟', '万'];
const rightUnits = ['角', '分'];

function rmb(value: number) {
if (Object.prototype.toString.call(value) === '[object Number]' && value >= 0.01) {
const fragment: any = [];
const [leftValues, rightValues] = String(value).split('.').map(part => part.split('').map(i => Number(i)));

const leftValueLength = leftValues.length; // 整数部分位数
const unit1 = leftValueLength - 1; // 元位
const unit5 = leftValueLength - 5; // 万位
const unit9 = leftValueLength - 9; // 亿位
const unit13 = leftValueLength - 13; // 万亿位
const unit17 = leftValueLength - 17; // 万万亿位
const hasLeftValue = leftValueLength > 1 || leftValues[0] > 0; // 整数部分不为0
const hasRightValue = rightValues && (rightValues[0] > 0 || rightValues[1] > 0); // 小数部分不为0
const has678Value = leftValues[unit5 - 1] > 0 || leftValues[unit5 - 2] > 0 || leftValues[unit5 - 3] > 0; // 拾万、佰万或仟万位不为0
const overflowIndex = leftValueLength - leftUnits.length; // 溢出位索引

let leftUnitIndex = 0;
for (let i = leftValueLength - 1; i >= 0; i--) {
if (leftValues[i] === 0 && (i === unit5 || i === unit9 || i === unit13 || i === unit17) && leftValues[i + 1] > 0) {
// 当前位为0,且当前位为万、亿、万亿、万万亿,且低一位不为0
fragment.unshift({type:'number', value:numbers[leftValues[i]]});
}

if ((leftValues[i] > 0) || (i === unit1 && hasLeftValue) || (i === unit5 && has678Value) || i === unit9 || i === unit13 || i === unit17) {
// 元、万、亿、万亿、万万亿或当前位不为0
fragment.unshift({type:'unit', value:leftUnits[leftUnitIndex]});
}

if (leftValues[i] > 0 || (leftValues[i + 1] > 0 && i !== unit5 && i !== unit9 && i !== unit13 && i !== unit17) || i <= overflowIndex) {
// 当前位不为0,或低一位不为0且当前位非万、亿、万亿、万万亿,或当前为溢出位
fragment.unshift({type:'number', value:numbers[leftValues[i]]});
}

leftUnitIndex++;
}

if (hasRightValue) {
// 角
if (rightValues[0] > 0 || hasLeftValue) { // 角位不为0,或整数位不为0
fragment.push({type:'number', value:numbers[rightValues[0]]});
}
if (rightValues[0] > 0) { // 角位不为0
fragment.push({type:'unit', value:rightUnits[0]});
}
// 分
if (rightValues[1] > 0) {
fragment.push({type:'number', value:numbers[rightValues[1]]});
fragment.push({type:'unit', value:rightUnits[1]});
}
} else { // 没有小数位
fragment.push({type:'cut', value:'整'});
}
return fragment;
}
return [
{type:'number', value:'零'},
{type:'unit', value:'元'},
{type:'cut', value:'整'},
];
};
43 changes: 43 additions & 0 deletions src/tools/rmb-d/rmb-d.vue
Original file line number Diff line number Diff line change
@@ -0,0 +1,43 @@
<script setup lang="ts">
import { rmb } from './rmb-d.models';
import { useThemeVars } from 'naive-ui';
const themeVars = useThemeVars();
const inputRmb = ref(23);
const outputRmb = computed(() => rmb(inputRmb.value));;
</script>

<template>
<div flex flex-col gap-2>
<c-card title="小写金额">
<n-input-number v-model:value="inputRmb" max="100000000000" min="0" placeholder="输入小写金额 (例:1314.52)" :show-button="false" w-full />
</c-card>

<div my-16px divider />

<c-card title="大写金额" flex flex-col>
<div m-0 m-x-auto>
<span :class="item.type"
v-for="(item, index) in outputRmb"
:key="index"
>
{{ item.value }}
</span>
</div>
</c-card>
</div>
</template>

<style lang="less" scoped>
.unit {
font-size: 1.4em;
color: v-bind('themeVars.successColor');
}
.number {
font-size: 2.4em;
}
.cut {
font-size: 1.4em;
color: v-bind('themeVars.errorColor');
}
</style>

0 comments on commit 6297c10

Please sign in to comment.