root
/
xugu_license


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174
							<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>XUGULicense</title>
    <link rel="stylesheet" href="license_info.css">
    <link rel="stylesheet" href="license_info_distribution.css">
</head>
<body>


    <header>
        <h1>XUGU License</h1>
        <div class="right-container">
            <div>左边的子div</div>
            <div class="login-button">点击显示用户信息</div>
        </div>
    </header>
    
    <!-- 模态框结构 -->
    <div id="loginModal" class="login-modal">
        <div class="login-modal-content">
            <span class="login-modal-close">&times;</span> <!-- 关闭按钮放在这里 -->
            <div id="userInfoContainer"></div>
        </div>
    </div>
    
    
    <div class="container">
        <aside>
            <nav>
                <ul>
                    <li><a href="#" class="active" id="license-info-link"><i class="fas fa-home"></i> License 信息</a></li>
                    <li><a href="#" id="user-management-link"><i class="fas fa-users"></i> 用户管理</a></li>
                    <li><a href="#" id="role-management-link"><i class="fas fa-users"></i> 角色管理</a></li>
                </ul>
            </nav>
        </aside>

<main>
 
         <!-- 包裹搜索框、下拉框、时间选择框和确定按钮的 div -->
         <div class="search-container">
            <!-- License 状态下拉框 -->
            <select id="license-status-filter" aria-label="选择 License 状态">
                <option value="">License 状态</option>
                <option value="已生成">已生成</option>
                <option value="未生成">未生成</option>
                <option value="已失效">已失效</option>
            </select>
        
            <!-- 开始时间选择框，类型改为 date -->
            <input type="date" id="start-date" placeholder="开始时间" />
        
            <!-- 结束时间选择框，类型改为 date -->
            <input type="date" id="end-date" placeholder="结束时间" />
        
            <!-- 搜索框 -->
            <input type="text" id="search-bar" style="display: none;" placeholder="搜索..." />
        
            <!-- 确定按钮 -->
            <button id="submit-button">确定</button>
            <button id="reset-button">返回</button>
        </div>
            <div class="license-info-container" id="license-info-restaurant-list">   </div>
              <!-- 这是显示内容的区域 -->
        </main> 
    </div>

<!-- 模态框结构 -->
<div id="license-info-modal" class="license-info-modal">
    <div class="license-info-modal-content">
        <!-- 关闭模态框的按钮 -->
        <span class="license-info-close">&times;</span>

        <!-- 上半部分: 按钮和项目信息 -->
        <div id="license-info-modal-header" class="license-info-modal-header">
          
        </div>
        

        <!-- 下半部分: 动态显示字段内容 -->
        <div id="license-info-modal-body" class="license-info-modal-body"></div>

        <!-- 分页按钮 -->
        <div class="license-info-modal-pagination">
            <button id="prev-page">上一页</button>
            <button id="next-page">下一页</button>
        </div>
    
    </div>
</div>


<!-- 分发模态框 -->
<div id="DistributeModal" class="DistributeModal">
    <div class="DistributeModal-content">
        <span class="DistributeModal-close">&times;</span>

  <!-- 上半部分: 分发邮箱 -->
<div id="DistributeModal-email-section" class="DistributeModal-section">
    <h2>分发邮箱</h2>
    <div class="DistributeModal-email-button-wrapper">
        <button id="DistributeModal-add-email-btn" class="DistributeModal-button">新增邮箱</button>
        <button id="DistributeModal-email-confirm-btn" class="DistributeModal-button">确认邮箱分发</button>
    </div>
    <div id="DistributeModal-email-inputs">
        <!-- 动态生成邮箱输入 -->
    </div>
    <!-- 新增：复选框行 -->
    <div id="DistributeModal-checkbox-row" class="DistributeModal-checkbox-wrapper">
        <label class="DistributeModal-checkbox-label">
            <input type="checkbox" id="salesEmailCheckbox" class="DistributeModal-checkbox">
            <span class="DistributeModal-checkbox-custom"></span>
            销售邮箱 (${item.SalesPerson}: ${item.SalesEmail})
        </label>
        <label class="DistributeModal-checkbox-label">
            <input type="checkbox" id="supportEmailCheckbox" class="DistributeModal-checkbox">
            <span class="DistributeModal-checkbox-custom"></span>
            运维邮箱 (${item.SupportPerson}: ${item.SupportEmail})
        </label>
    </div>
</div>


        <!-- 下半部分: 分发用户 -->
        <div id="DistributeModal-user-section" class="DistributeModal-section">
            <div class="DistributeModal-user-button-wrapper">
                <button id="distributeUser-add-select-btn" class="DistributeModal-button">新增用户下拉框</button>
                <button id="distributeUser-confirm-btn" class="DistributeModal-button">确认用户分发</button>
            </div>
            <div id="DistributeModal-user-inputs">
                <!-- 动态生成的用户选择框 -->
            </div>
        </div>
        
    </div>
</div>


<!-- 分发历史模态框 -->
<div id="distributionHistory-modal" class="distributionHistory-modal">
    <div class="distributionHistory-modal-content">
        <span class="distributionHistory-modal-close">&times;</span> <!-- 修改了关闭按钮的类名 -->
        <h2>分发历史</h2>
        <div id="distributionHistory-user-content"></div> <!-- 修改了用户分发记录的 ID -->
        <div id="distributionHistory-email-content"></div> <!-- 修改了邮箱分发记录的 ID -->
    </div>
</div>


    <script src="license_info.js"></script>
    <script src="license_info_modal.js"></script>
    <script src="license_info_distribution.js"></script>
    <script
    src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.7.1/jszip.min.js">
    </script>


</body>


</html>