我的日常工作经常需要中英混排工具来对文本内容进行格式化处理，之前常用的是在线的独特工具箱。不过前段时间，该工具曾短暂不可用，于是让 AI 复刻了一个可以离线使用的版本，并且没有冗余的说明文本，我也将其部署到了这里：https://www.czyouge.xyz/tools/typesetting/

<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>中英混排工具</title>
    <style>
        body {
            font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
            max-width: 800px;
            margin: 20px auto;
            padding: 0 20px;
        }
        .container {
            margin-top: 20px;
        }
        textarea {
            width: 100%;
            min-height: 200px;
            padding: 10px;
            margin: 10px 0;
            border: 1px solid #ddd;
            border-radius: 4px;
        }
        .button-group {
            margin: 10px 0;
        }
        button {
            padding: 8px 15px;
            margin-right: 10px;
            border: none;
            border-radius: 4px;
            cursor: pointer;
        }
        .btn-primary {
            background-color: #007bff;
            color: white;
        }
        .btn-secondary {
            background-color: #6c757d;
            color: white;
        }
        .checkbox-item {
            margin: 10px 0;
        }
    </style>
</head>
<body>
    <div class="container">
        <h1>中英混排工具</h1>
        <p>通过在中英文之间添加空格，提升文章排版质量和阅读体验。</p>
        
        <div class="input-area">
            <textarea id="text" placeholder="请输入要排版的文本..."></textarea>
        </div>
        
        <div class="checkbox-item">
            <label>
                <input type="checkbox" id="sbc-case-convert">
                排版时，把半角符号转换成全角符号
            </label>
        </div>
        
        <div class="checkbox-item">
            <label>
                <input type="checkbox" id="cn-quote-convert">
                排版时，把中文引号转换成直角引号
            </label>
        </div>

        <div class="checkbox-item">
            <label>
                <input type="checkbox" id="en-quote-convert">
                排版时，把英文引号转换成直角引号
            </label>
        </div>
        
        <div class="button-group">
            <button type="button" class="btn-primary" onclick="formatText()">文章一键排版</button>
            <button type="button" class="btn-primary" onclick="copyText()">复制文本</button>
            <button type="button" class="btn-secondary" onclick="clearText()">清空数据</button>
        </div>
    </div>

    <script>
        function formatText() {
            const text = document.getElementById('text').value;
            const convertToFullWidth = document.getElementById('sbc-case-convert').checked;
            const convertCnQuotes = document.getElementById('cn-quote-convert').checked;
            const convertEnQuotes = document.getElementById('en-quote-convert').checked;
            
            let formattedText = text
                // 在中英文之间添加空格
                .replace(/([\u4e00-\u9fa5])([\w])/g, '$1 $2')
                .replace(/([\w])([\u4e00-\u9fa5])/g, '$1 $2')
                // 处理数字与单位之间的空格
                .replace(/([\d])([\u4e00-\u9fa5])/g, '$1 $2');
            
            if (convertToFullWidth) {
                // 半角符号转全角符号
                formattedText = formattedText
                    .replace(/\!/g, '！')
                    .replace(/\?/g, '？')
                    .replace(/\,/g, '，')
                    .replace(/\./g, '。')
                    .replace(/\;/g, '；')
                    .replace(/\:/g, '：')
                    .replace(/\(/g, '（')
                    .replace(/\)/g, '）')
                    .replace(/\[/g, '【')
                    .replace(/\]/g, '】');
            }

            if (convertCnQuotes) {
                // 处理中文引号
                formattedText = formattedText
                    .replace(/“/g, '「')
                    .replace(/”/g, '」')
                    .replace(/‘/g, '『')
                    .replace(/’/g, '』');
            }

            if (convertEnQuotes) {
                // 处理英文引号
                formattedText = formattedText
                    .replace(/"/g, '「')
                    .replace(/"/g, '」')
                    .replace(/'/g, '『')
                    .replace(/'/g, '』');
            }
            
            document.getElementById('text').value = formattedText;
        }

        function copyText() {
            const textarea = document.getElementById('text');
            textarea.select();
            document.execCommand('copy');
        }

        function clearText() {
            document.getElementById('text').value = '';
            document.getElementById('sbc-case-convert').checked = false;
            document.getElementById('cn-quote-convert').checked = false;
            document.getElementById('en-quote-convert').checked = false;
        }
    </script>
</body>
</html>