83 lines
6.8 KiB
HTML
83 lines
6.8 KiB
HTML
<!-- 角色权限 -->
|
|
<style>
|
|
.srl-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;}
|
|
.srl-header-title{font-size:15px;font-weight:600;color:var(--g-text);padding-left:10px;border-left:3px solid var(--primary);}
|
|
.srl-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-bottom:24px;}
|
|
.srl-role-card{background:#fff;border-radius:10px;border:1px solid var(--g-border);padding:20px;transition:var(--g-transition);position:relative;}
|
|
.srl-role-card:hover{box-shadow:var(--g-shadow-md);transform:translateY(-1px);}
|
|
.srl-role-name{font-size:18px;font-weight:700;color:var(--g-text);margin-bottom:4px;}
|
|
.srl-role-count{font-size:13px;color:var(--g-text-secondary);margin-bottom:8px;}
|
|
.srl-role-desc{font-size:13px;color:var(--g-text-muted);margin-bottom:14px;line-height:1.5;}
|
|
.srl-role-foot{display:flex;align-items:center;justify-content:space-between;}
|
|
.srl-role-foot a{color:var(--primary);font-size:13px;cursor:pointer;text-decoration:none;transition:var(--g-transition);}
|
|
.srl-role-foot a:hover{text-decoration:underline;}
|
|
.srl-perm-section{margin-top:8px;}
|
|
.srl-section-hd{font-size:15px;font-weight:600;color:var(--g-text);padding-left:10px;border-left:3px solid var(--primary);margin-bottom:16px;}
|
|
.srl-save-bar{display:flex;justify-content:flex-end;margin-top:16px;gap:10px;}
|
|
.srl-cb{accent-color:var(--primary);width:16px;height:16px;cursor:pointer;}
|
|
</style>
|
|
|
|
<!-- 角色卡片 -->
|
|
<div class="srl-header">
|
|
<span class="srl-header-title">角色管理</span>
|
|
<button class="g-btn g-btn-primary"><i data-lucide="plus" style="width:15px;height:15px;margin-right:4px;vertical-align:-2px;"></i>添加角色</button>
|
|
</div>
|
|
|
|
<div class="srl-grid">
|
|
<div class="srl-role-card">
|
|
<div class="srl-role-name">管理员</div>
|
|
<div class="srl-role-count">1 人</div>
|
|
<div class="srl-role-desc">拥有系统全部权限，可管理所有门店和员工</div>
|
|
<div class="srl-role-foot"><span class="g-tag g-tag-orange">系统角色，不可删除</span><a>编辑权限</a></div>
|
|
</div>
|
|
<div class="srl-role-card">
|
|
<div class="srl-role-name">店长</div>
|
|
<div class="srl-role-count">2 人</div>
|
|
<div class="srl-role-desc">管理所属门店的商品、订单、库存和会员</div>
|
|
<div class="srl-role-foot"><a class="g-action g-action-danger" style="font-size:13px;">删除</a><a>编辑权限</a></div>
|
|
</div>
|
|
<div class="srl-role-card">
|
|
<div class="srl-role-name">收银员</div>
|
|
<div class="srl-role-count">1 人</div>
|
|
<div class="srl-role-desc">处理门店订单，接单、出餐和退款操作</div>
|
|
<div class="srl-role-foot"><a class="g-action g-action-danger" style="font-size:13px;">删除</a><a>编辑权限</a></div>
|
|
</div>
|
|
<div class="srl-role-card">
|
|
<div class="srl-role-name">配送员</div>
|
|
<div class="srl-role-count">1 人</div>
|
|
<div class="srl-role-desc">查看待配送订单，更新配送状态</div>
|
|
<div class="srl-role-foot"><a class="g-action g-action-danger" style="font-size:13px;">删除</a><a>编辑权限</a></div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="g-divider"></div>
|
|
|
|
<!-- 权限矩阵 -->
|
|
<div class="srl-perm-section">
|
|
<div class="srl-section-hd">权限配置</div>
|
|
<div class="g-card" style="padding:0;overflow:hidden;">
|
|
<table class="g-table">
|
|
<thead><tr><th style="text-align:left;">功能模块</th><th>管理员</th><th>店长</th><th>收银员</th><th>配送员</th></tr></thead>
|
|
<tbody>
|
|
<tr><td style="font-weight:500;">商品管理</td><td style="text-align:center;"><input type="checkbox" class="srl-cb" checked disabled></td><td style="text-align:center;"><input type="checkbox" class="srl-cb" checked></td><td style="text-align:center;"><input type="checkbox" class="srl-cb"></td><td style="text-align:center;"><input type="checkbox" class="srl-cb"></td></tr>
|
|
<tr><td style="font-weight:500;">订单管理</td><td style="text-align:center;"><input type="checkbox" class="srl-cb" checked disabled></td><td style="text-align:center;"><input type="checkbox" class="srl-cb" checked></td><td style="text-align:center;"><input type="checkbox" class="srl-cb" checked></td><td style="text-align:center;"><input type="checkbox" class="srl-cb" checked></td></tr>
|
|
<tr><td style="font-weight:500;">门店管理</td><td style="text-align:center;"><input type="checkbox" class="srl-cb" checked disabled></td><td style="text-align:center;"><input type="checkbox" class="srl-cb" checked></td><td style="text-align:center;"><input type="checkbox" class="srl-cb"></td><td style="text-align:center;"><input type="checkbox" class="srl-cb"></td></tr>
|
|
<tr><td style="font-weight:500;">财务中心</td><td style="text-align:center;"><input type="checkbox" class="srl-cb" checked disabled></td><td style="text-align:center;"><input type="checkbox" class="srl-cb"></td><td style="text-align:center;"><input type="checkbox" class="srl-cb"></td><td style="text-align:center;"><input type="checkbox" class="srl-cb"></td></tr>
|
|
<tr><td style="font-weight:500;">数据统计</td><td style="text-align:center;"><input type="checkbox" class="srl-cb" checked disabled></td><td style="text-align:center;"><input type="checkbox" class="srl-cb"></td><td style="text-align:center;"><input type="checkbox" class="srl-cb"></td><td style="text-align:center;"><input type="checkbox" class="srl-cb"></td></tr>
|
|
<tr><td style="font-weight:500;">会员营销</td><td style="text-align:center;"><input type="checkbox" class="srl-cb" checked disabled></td><td style="text-align:center;"><input type="checkbox" class="srl-cb" checked></td><td style="text-align:center;"><input type="checkbox" class="srl-cb"></td><td style="text-align:center;"><input type="checkbox" class="srl-cb"></td></tr>
|
|
<tr><td style="font-weight:500;">库存管理</td><td style="text-align:center;"><input type="checkbox" class="srl-cb" checked disabled></td><td style="text-align:center;"><input type="checkbox" class="srl-cb" checked></td><td style="text-align:center;"><input type="checkbox" class="srl-cb"></td><td style="text-align:center;"><input type="checkbox" class="srl-cb"></td></tr>
|
|
<tr><td style="font-weight:500;">系统设置</td><td style="text-align:center;"><input type="checkbox" class="srl-cb" checked disabled></td><td style="text-align:center;"><input type="checkbox" class="srl-cb"></td><td style="text-align:center;"><input type="checkbox" class="srl-cb"></td><td style="text-align:center;"><input type="checkbox" class="srl-cb"></td></tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
|
|
<!-- 保存栏 -->
|
|
<div class="srl-save-bar">
|
|
<button class="g-btn">重置</button>
|
|
<button class="g-btn g-btn-primary"><i data-lucide="save" style="width:15px;height:15px;margin-right:4px;vertical-align:-2px;"></i>保存权限</button>
|
|
</div>
|
|
|
|
<script>
|
|
if(typeof lucide!=='undefined'){lucide.createIcons();}
|
|
</script> |