查看“︁Card”︁的源代码

<div class="cm-wrapper">
    <h2>卡牌数据管理器</h2>
    
    <div class="cm-container">
        <!-- 左侧：输入区域 -->
        <div class="cm-section cm-input-section">
            <div class="cm-section-title">卡牌数据</div>
            
            <div class="cm-form-group">
                <label>卡牌名称:</label>
                <input type="text" id="card-name" class="cm-input" placeholder="请输入卡牌名称...">
            </div>
            
            <div class="cm-form-group">
                <label>卡组类型:</label>
                <select id="deck-type" class="cm-select">
                    <option value="">请选择</option>
                    <option value="起始卡牌">起始卡牌</option>
                    <option value="独特卡牌">独特卡牌</option>
                    <option value="灵光一闪">灵光一闪</option>
                    <option value="衍生卡牌">衍生卡牌</option>
                </select>
            </div>
            
            <div class="cm-form-group">
                <label>图片文件:</label>
                <input type="text" id="card-art" class="cm-input" placeholder="如: unique_1003_01.png">
            </div>
            
            <div class="cm-form-group">
                <label>属性:</label>
                <select id="card-attr" class="cm-select">
                    <option value="">请选择</option>
                    <option value="热情">热情</option>
                    <option value="秩序">秩序</option>
                    <option value="正义">正义</option>
                    <option value="本能">本能</option>
                    <option value="虚无">虚无</option>
                </select>
            </div>
            
            <div class="cm-form-group">
                <label>稀有度:</label>
                <select id="card-rarity" class="cm-select">
                    <option value="">请选择</option>
                    <option value="白">白</option>
                    <option value="蓝">蓝</option>
                    <option value="橙">橙</option>
                    <option value="彩">彩</option>
                </select>
            </div>
            
            <div class="cm-form-group">
                <label>AP (行动点):</label>
                <input type="text" id="card-ap" class="cm-input" placeholder="输入数字或X">
            </div>
            
            <div class="cm-form-group">
                <label>卡牌类型:</label>
                <select id="card-type" class="cm-select">
                    <option value="">请选择</option>
                    <option value="攻击">攻击</option>
                    <option value="技能">技能</option>
                    <option value="强化">强化</option>
                    <option value="状态异常">状态异常</option>
                </select>
            </div>
            
            <div class="cm-form-group">
                <label>卡牌机制:</label>
                <input type="text" id="card-mechanism" class="cm-input" placeholder="如：消灭">
            </div>
            
            <div class="cm-form-group">
                <label>卡牌描述:</label>
                <div class="cm-format-buttons">
                    <button id="blue-text-btn" class="cm-btn cm-btn-small cm-btn-blue">蓝色文本</button>
                    <button id="green-text-btn" class="cm-btn cm-btn-small cm-btn-green">绿色文本</button>
                    <button id="green-stroke-btn" class="cm-btn cm-btn-small cm-btn-green">绿色描边</button>
                    <button id="br-btn" class="cm-btn cm-btn-small cm-btn-orange">插入&lt;br&gt;</button>
                </div>
                <textarea id="card-desc" class="cm-textarea" placeholder="请输入卡牌描述..."></textarea>
            </div>
            
            <div class="cm-form-group">
                <label>衍生卡牌:</label>
                <input type="text" id="card-derived" class="cm-input" placeholder="请输入衍生卡牌名称">
            </div>
            
            <div class="cm-button-group">
                <button id="add-card-btn" class="cm-btn cm-btn-success">添加卡牌</button>
                <button id="add-variant-btn" class="cm-btn cm-btn-success">添加变体</button>
            </div>
            
            <div class="cm-button-group">
                <button id="save-card-btn" class="cm-btn">保存数据</button>
                <button id="clear-form-btn" class="cm-btn">清空表单</button>
            </div>
        </div>
        
        <!-- 中间：列表区域 -->
        <div class="cm-section cm-list-section">
            <div class="cm-section-title">卡牌列表</div>
            <div id="card-list" class="cm-list"></div>
            
            <div class="cm-section-title" style="margin-top: 20px;">变体列表</div>
            <div id="variant-list" class="cm-list"></div>
            
            <div class="cm-button-group">
                <button id="delete-card-btn" class="cm-btn cm-btn-danger">删除卡牌</button>
                <button id="delete-variant-btn" class="cm-btn cm-btn-danger">删除变体</button>
            </div>
        </div>
        
        <!-- 右侧：代码预览 -->
        <div class="cm-section cm-preview-section">
            <div class="cm-section-title">Lua代码预览</div>
            <pre id="code-preview" class="cm-code-preview">-- 暂无数据</pre>
            
            <div class="cm-button-group">
                <button id="export-btn" class="cm-btn">导出到模块</button>
                <button id="import-btn" class="cm-btn">从模块导入</button>
            </div>