1349 lines
72 KiB
HTML
1349 lines
72 KiB
HTML
<script src="/assets/gerp/GERPThemeSync.js"></script>
|
||
<link rel="stylesheet" href="/assets/css/GERP.css">
|
||
<script src="https://cdn.tailwindcss.com"></script>
|
||
<link href="https://cdn.gvsds.com/font-awesome/css/all.min.css" rel="stylesheet">
|
||
<link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap" rel="stylesheet">
|
||
|
||
<!-- Tailwind 配置 -->
|
||
<script>
|
||
tailwind.config = {
|
||
theme: {
|
||
extend: {
|
||
colors: {
|
||
primary: 'var(--PrimaryColor, #3b82f6)',
|
||
secondary: 'var(--SecondaryColor, #8b5cf6)',
|
||
accent: 'var(--SuccessColor, #10b981)',
|
||
danger: 'var(--DangerColor, #ef4444)',
|
||
warning: 'var(--WarningColor, #f59e0b)',
|
||
info: '#06b6d4',
|
||
dark: {
|
||
100: '#1e293b',
|
||
200: '#0f172a',
|
||
300: '#020617'
|
||
},
|
||
light: {
|
||
100: 'var(--CardBackground, #f8fafc)',
|
||
200: 'var(--BackgroundColor, #f1f5f9)',
|
||
300: 'var(--BorderColor, #e2e8f0)'
|
||
},
|
||
minecraft: {
|
||
gold: '#FFD700',
|
||
iron: '#C0C0C0',
|
||
diamond: '#B9F2FF',
|
||
emerald: '#50C878',
|
||
redstone: '#FF0000',
|
||
lapis: '#2E5894',
|
||
netherite: '#443A49'
|
||
}
|
||
},
|
||
fontFamily: {
|
||
inter: ['Inter', 'sans-serif'],
|
||
minecraft: ['"Minecraft"', 'Inter', 'sans-serif']
|
||
},
|
||
boxShadow: {
|
||
'glow': '0 0 15px rgba(59, 130, 246, 0.5)',
|
||
'glow-dark': '0 0 15px rgba(139, 92, 246, 0.5)',
|
||
'glow-accent': '0 0 15px rgba(16, 185, 129, 0.5)'
|
||
},
|
||
animation: {
|
||
'float': 'float 3s ease-in-out infinite',
|
||
'pulse-slow': 'pulse 4s cubic-bezier(0.4, 0, 0.6, 1) infinite'
|
||
},
|
||
keyframes: {
|
||
float: {
|
||
'0%, 100%': { transform: 'translateY(0)' },
|
||
'50%': { transform: 'translateY(-10px)' }
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
</script>
|
||
|
||
<style type="text/tailwindcss">
|
||
@layer utilities {
|
||
.content-auto {
|
||
content-visibility: auto;
|
||
}
|
||
.text-shadow {
|
||
text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
|
||
}
|
||
.text-shadow-glow {
|
||
text-shadow: 0 0 10px rgba(59, 130, 246, 0.7);
|
||
}
|
||
.text-shadow-dark {
|
||
text-shadow: 0 0 10px rgba(139, 92, 246, 0.7);
|
||
}
|
||
.bg-blur {
|
||
backdrop-filter: blur(8px);
|
||
}
|
||
.transition-transform-slow {
|
||
transition: transform 0.5s ease;
|
||
}
|
||
.hover-scale {
|
||
transition: transform 0.3s ease;
|
||
}
|
||
.hover-scale:hover {
|
||
transform: scale(1.03);
|
||
}
|
||
.card-gradient {
|
||
background: linear-gradient(135deg, rgba(59, 130, 246, 0.05) 0%, rgba(139, 92, 246, 0.05) 100%);
|
||
}
|
||
.dark .card-gradient {
|
||
background: linear-gradient(135deg, rgba(59, 130, 246, 0.1) 0%, rgba(139, 92, 246, 0.1) 100%);
|
||
}
|
||
.scrollbar-hide::-webkit-scrollbar {
|
||
display: none;
|
||
}
|
||
.scrollbar-hide {
|
||
-ms-overflow-style: none;
|
||
scrollbar-width: none;
|
||
}
|
||
.tag-container {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
gap: 0.5rem;
|
||
padding: 0.5rem;
|
||
border: 1px solid #d1d5db;
|
||
border-radius: 0.375rem;
|
||
min-height: 2.5rem;
|
||
}
|
||
.tag {
|
||
display: inline-flex;
|
||
align-items: center;
|
||
padding: 0.25rem 0.5rem;
|
||
background-color: rgba(59, 130, 246, 0.1);
|
||
border-radius: 9999px;
|
||
font-size: 0.875rem;
|
||
}
|
||
.tag-remove {
|
||
margin-left: 0.25rem;
|
||
cursor: pointer;
|
||
font-weight: bold;
|
||
color: #ef4444;
|
||
}
|
||
}
|
||
</style>
|
||
<div class="font-inter bg-light-200 dark:bg-dark-200 text-dark-300 dark:text-light-100 transition-colors duration-300 min-h-screen flex flex-col">
|
||
<!-- 导航栏 -->
|
||
<header class="sticky top-0 z-50 bg-light-100/80 dark:bg-dark-100/80 bg-blur border-b border-light-300/30 dark:border-dark-300/30 shadow-md">
|
||
<div class="container mx-auto px-4 py-3 flex justify-between items-center">
|
||
<div class="flex items-center space-x-2">
|
||
<div class="text-primary dark:text-secondary text-3xl">
|
||
<i class="fa fa-bank"></i>
|
||
</div>
|
||
<div>
|
||
<h1 class="text-xl md:text-2xl font-bold text-primary dark:text-secondary">枢机信用储备银行附属红光证券</h1>
|
||
<p class="text-xs md:text-sm text-[var(--TextSecondary)]">银河锋锐软件开发工作室</p>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="flex items-center space-x-4">
|
||
<button id="refresh-btn" class="hidden md:flex items-center space-x-1 px-3 py-1.5 rounded-full bg-[var(--PrimaryAlpha10)] dark:bg-[rgba(100,116,139,0.1)] hover:bg-[var(--PrimaryAlpha15)] dark:hover:bg-[rgba(100,116,139,0.2)] transition-colors">
|
||
<i class="fa fa-sync text-primary dark:text-secondary"></i>
|
||
<span>刷新列表</span>
|
||
</button>
|
||
|
||
<button id="add-enterprise-btn" class="hidden md:flex items-center space-x-1 px-3 py-1.5 rounded-full bg-[var(--SuccessAlpha10)] dark:bg-[var(--SuccessAlpha10)] hover:bg-[var(--SuccessAlpha10)] dark:hover:bg-[var(--SuccessAlpha10)] transition-colors">
|
||
<i class="fa fa-plus text-accent"></i>
|
||
<span>添加企业</span>
|
||
</button>
|
||
|
||
<button id="theme-toggle" class="p-2 rounded-full bg-light-300 dark:bg-dark-300 hover:bg-light-200 dark:hover:bg-dark-100 transition-colors">
|
||
<i class="fa fa-moon dark:hidden text-dark-300"></i>
|
||
<i class="fa fa-sun hidden dark:inline text-light-100"></i>
|
||
</button>
|
||
|
||
<button class="md:hidden p-2 rounded-full bg-light-300 dark:bg-dark-300 hover:bg-light-200 dark:hover:bg-dark-100 transition-colors" id="mobile-menu-button">
|
||
<i class="fa fa-bars text-dark-300 dark:text-light-100"></i>
|
||
</button>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 移动端菜单 -->
|
||
<div id="mobile-menu" class="hidden md:hidden bg-light-100 dark:bg-dark-100 border-b border-light-300/30 dark:border-dark-300">
|
||
<div class="container mx-auto px-4 py-2 flex flex-col space-y-2">
|
||
<button id="mobile-refresh-btn" class="flex items-center space-x-2 px-3 py-2 rounded-lg hover:bg-light-200 dark:hover:bg-dark-200 transition-colors">
|
||
<i class="fa fa-sync text-primary dark:text-secondary"></i>
|
||
<span>刷新列表</span>
|
||
</button>
|
||
<button id="mobile-add-enterprise-btn" class="flex items-center space-x-2 px-3 py-2 rounded-lg hover:bg-light-200 dark:hover:bg-dark-200 transition-colors">
|
||
<i class="fa fa-plus text-accent"></i>
|
||
<span>添加企业</span>
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</header>
|
||
|
||
<main class="flex-grow">
|
||
<!-- 企业列表区域 -->
|
||
<section class="py-8 bg-light-100 dark:bg-dark-100">
|
||
<div class="container mx-auto px-4">
|
||
<div class="mb-6 flex flex-col md:flex-row justify-between items-start md:items-center gap-4">
|
||
<div>
|
||
<h2 class="text-2xl font-bold mb-1">企业管理列表</h2>
|
||
<p class="text-[var(--TextSecondary)] text-sm">管理所有注册企业信息,支持查看、编辑和刷新操作</p>
|
||
</div>
|
||
<div class="flex gap-2 w-full md:w-auto">
|
||
<div class="relative flex-grow md:flex-grow-0 md:w-64">
|
||
<input type="text" id="search-input" placeholder="搜索企业名称..."
|
||
class="w-full px-4 py-2 pl-10 rounded-lg border border-light-300 dark:border-dark-300 bg-light-200 dark:bg-dark-300 focus:outline-none focus:ring-2 focus:ring-primary dark:focus:ring-secondary transition-all">
|
||
<i class="fa fa-search absolute left-3 top-1/2 -translate-y-1/2 text-[var(--TextMuted)]"></i>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 列表容器 -->
|
||
<div class="overflow-x-auto bg-light-200 dark:bg-dark-300 rounded-xl shadow-sm">
|
||
<table class="w-full min-w-[1200px]">
|
||
<thead>
|
||
<tr class="bg-light-300/50 dark:bg-dark-100/50 border-b border-light-300 dark:border-dark-100">
|
||
<th class="px-4 py-3 text-left text-sm font-semibold">企业UUID</th>
|
||
<th class="px-4 py-3 text-left text-sm font-semibold">企业名称</th>
|
||
<th class="px-4 py-3 text-left text-sm font-semibold">企业类型</th>
|
||
<th class="px-4 py-3 text-left text-sm font-semibold">状态</th>
|
||
<th class="px-4 py-3 text-left text-sm font-semibold">法人</th>
|
||
<th class="px-4 py-3 text-left text-sm font-semibold">注册资本</th>
|
||
<th class="px-4 py-3 text-left text-sm font-semibold">创建时间</th>
|
||
<th class="px-4 py-3 text-left text-sm font-semibold">操作</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody id="enterprise-list-body">
|
||
<!-- 列表内容将通过JS动态生成 -->
|
||
<tr>
|
||
<td colspan="8" class="px-4 py-12 text-center text-[var(--TextSecondary)]">
|
||
<div class="flex flex-col items-center">
|
||
<i class="fa fa-building-o text-4xl mb-3 opacity-30"></i>
|
||
<p>暂无企业数据,请点击"添加企业"按钮创建</p>
|
||
</div>
|
||
</td>
|
||
</tr>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
|
||
<!-- 分页控件 -->
|
||
<div class="mt-6 flex justify-between items-center">
|
||
<div class="text-sm text-[var(--TextSecondary)]">
|
||
显示 <span id="showing-range">0-0</span> 条,共 <span id="total-count">0</span> 条
|
||
</div>
|
||
<div class="flex space-x-1">
|
||
<button id="prev-page" class="px-3 py-1 rounded border border-light-300 dark:border-dark-300 bg-light-100 dark:bg-dark-100 hover:bg-light-300 dark:hover:bg-dark-200 transition-colors disabled:opacity-50 disabled:cursor-not-allowed" disabled>
|
||
<i class="fa fa-chevron-left"></i>
|
||
</button>
|
||
<button id="next-page" class="px-3 py-1 rounded border border-light-300 dark:border-dark-300 bg-light-100 dark:bg-dark-100 hover:bg-light-300 dark:hover:bg-dark-200 transition-colors disabled:opacity-50 disabled:cursor-not-allowed" disabled>
|
||
<i class="fa fa-chevron-right"></i>
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
</main>
|
||
|
||
<!-- 企业注册/编辑窗口 -->
|
||
<div id="enterprise-modal" class="fixed inset-0 z-50 flex items-center justify-center hidden">
|
||
<div class="absolute inset-0 bg-black/50 backdrop-blur-sm" id="modal-overlay"></div>
|
||
<div class="relative bg-light-100 dark:bg-dark-100 rounded-xl shadow-xl w-full max-w-4xl max-h-[90vh] overflow-y-auto scrollbar-hide">
|
||
<div class="p-6 border-b border-light-300 dark:border-dark-300">
|
||
<div class="flex justify-between items-center">
|
||
<h3 id="modal-title" class="text-xl font-bold">企业注册</h3>
|
||
<button id="close-modal" class="p-1.5 rounded-full hover:bg-light-300 dark:hover:bg-dark-300 transition-colors">
|
||
<i class="fa fa-times"></i>
|
||
</button>
|
||
</div>
|
||
</div>
|
||
|
||
<form id="enterprise-form" class="p-6 space-y-6">
|
||
<!-- 隐藏字段存储企业UUID(编辑时使用) -->
|
||
<input type="hidden" id="EnterpriseUUID" name="EnterpriseUUID">
|
||
|
||
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
|
||
<!-- 基本信息 -->
|
||
<div class="space-y-4">
|
||
<div>
|
||
<label for="EnterpriseName" class="block text-sm font-medium mb-1">企业名称 <span class="text-danger">*</span></label>
|
||
<input type="text" id="EnterpriseName" name="EnterpriseName" required
|
||
class="w-full px-4 py-2 rounded-lg border border-light-300 dark:border-dark-300 bg-light-200 dark:bg-dark-300 focus:outline-none focus:ring-2 focus:ring-primary dark:focus:ring-secondary transition-all">
|
||
</div>
|
||
|
||
<div>
|
||
<label for="EnterpriseType" class="block text-sm font-medium mb-1">企业类型 <span class="text-danger">*</span></label>
|
||
<select id="EnterpriseType" name="EnterpriseType" required
|
||
class="w-full px-4 py-2 rounded-lg border border-light-300 dark:border-dark-300 bg-light-200 dark:bg-dark-300 focus:outline-none focus:ring-2 focus:ring-primary dark:focus:ring-secondary transition-all">
|
||
<option value="">请选择企业类型</option>
|
||
<option value="0">股份有限公司</option>
|
||
<option value="1">国有企业</option>
|
||
</select>
|
||
</div>
|
||
|
||
<div>
|
||
<label for="EnterpriseFatherUUID" class="block text-sm font-medium mb-1">上级企业UUID</label>
|
||
<input type="text" id="EnterpriseFatherUUID" name="EnterpriseFatherUUID"
|
||
class="w-full px-4 py-2 rounded-lg border border-light-300 dark:border-dark-300 bg-light-200 dark:bg-dark-300 focus:outline-none focus:ring-2 focus:ring-primary dark:focus:ring-secondary transition-all"
|
||
placeholder="无上级企业可留空">
|
||
</div>
|
||
|
||
<div>
|
||
<label for="EnterpriseRegisteredCapital" class="block text-sm font-medium mb-1">注册资本(万元) <span class="text-danger">*</span></label>
|
||
<input type="number" id="EnterpriseRegisteredCapital" name="EnterpriseRegisteredCapital" required min="0" step="0.01"
|
||
class="w-full px-4 py-2 rounded-lg border border-light-300 dark:border-dark-300 bg-light-200 dark:bg-dark-300 focus:outline-none focus:ring-2 focus:ring-primary dark:focus:ring-secondary transition-all">
|
||
</div>
|
||
|
||
<div>
|
||
<label for="EnterpriseCapitalGC" class="block text-sm font-medium mb-1">资本币种 <span class="text-danger">*</span></label>
|
||
<select id="EnterpriseCapitalGC" name="EnterpriseCapitalGC" required
|
||
class="w-full px-4 py-2 rounded-lg border border-light-300 dark:border-dark-300 bg-light-200 dark:bg-dark-300 focus:outline-none focus:ring-2 focus:ring-primary dark:focus:ring-secondary transition-all">
|
||
<option value="GC">银币 (GC)</option>
|
||
<option value="CNY">人民币 (CNY)</option>
|
||
<option value="USD">美元 (USD)</option>
|
||
</select>
|
||
</div>
|
||
|
||
<div>
|
||
<label for="EnterpriseStatus" class="block text-sm font-medium mb-1">企业状态 <span class="text-danger">*</span></label>
|
||
<select id="EnterpriseStatus" name="EnterpriseStatus" required
|
||
class="w-full px-4 py-2 rounded-lg border border-light-300 dark:border-dark-300 bg-light-200 dark:bg-dark-300 focus:outline-none focus:ring-2 focus:ring-primary dark:focus:ring-secondary transition-all">
|
||
<option value="0">正常</option>
|
||
<option value="1">停业</option>
|
||
<option value="2">注销</option>
|
||
<option value="3">吊销</option>
|
||
<option value="4">筹建</option>
|
||
</select>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 联系信息 -->
|
||
<div class="space-y-4">
|
||
<div>
|
||
<label for="Enterprise3C" class="block text-sm font-medium mb-1">企业创建许可证(E3C)</label>
|
||
<input type="text" id="Enterprise3C" name="Enterprise3C"
|
||
class="w-full px-4 py-2 rounded-lg border border-light-300 dark:border-dark-300 bg-light-200 dark:bg-dark-300 focus:outline-none focus:ring-2 focus:ring-primary dark:focus:ring-secondary transition-all"
|
||
placeholder="必填">
|
||
</div>
|
||
|
||
<div>
|
||
<label for="EnterpriseTele" class="block text-sm font-medium mb-1">联系电话 <span class="text-danger">*</span></label>
|
||
<input type="tel" id="EnterpriseTele" name="EnterpriseTele"
|
||
class="w-full px-4 py-2 rounded-lg border border-light-300 dark:border-dark-300 bg-light-200 dark:bg-dark-300 focus:outline-none focus:ring-2 focus:ring-primary dark:focus:ring-secondary transition-all">
|
||
</div>
|
||
|
||
<div>
|
||
<label for="EnterpriseEmail" class="block text-sm font-medium mb-1">电子邮箱</label>
|
||
<input type="email" id="EnterpriseEmail" name="EnterpriseEmail"
|
||
class="w-full px-4 py-2 rounded-lg border border-light-300 dark:border-dark-300 bg-light-200 dark:bg-dark-300 focus:outline-none focus:ring-2 focus:ring-primary dark:focus:ring-secondary transition-all">
|
||
</div>
|
||
|
||
<div>
|
||
<label for="EnterpriseWebsite" class="block text-sm font-medium mb-1">企业网站</label>
|
||
<input type="url" id="EnterpriseWebsite" name="EnterpriseWebsite" placeholder="http://或https://"
|
||
class="w-full px-4 py-2 rounded-lg border border-light-300 dark:border-dark-300 bg-light-200 dark:bg-dark-300 focus:outline-none focus:ring-2 focus:ring-primary dark:focus:ring-secondary transition-all">
|
||
</div>
|
||
|
||
<div>
|
||
<label for="EnterpriseAddress" class="block text-sm font-medium mb-1">企业地址 <span class="text-danger">*</span></label>
|
||
<input type="text" id="EnterpriseAddress" name="EnterpriseAddress" required placeholder="X Y Z minecraft:overworld(例如 0 64 0 minecraft:overworld)"
|
||
class="w-full px-4 py-2 rounded-lg border border-light-300 dark:border-dark-300 bg-light-200 dark:bg-dark-300 focus:outline-none focus:ring-2 focus:ring-primary dark:focus:ring-secondary transition-all">
|
||
</div>
|
||
|
||
<div>
|
||
<label for="EnterpriseAdministrativeDivisions" class="block text-sm font-medium mb-1">行政区划 <span class="text-danger">*</span></label>
|
||
<input type="text" id="EnterpriseAdministrativeDivisions" name="EnterpriseAdministrativeDivisions" required
|
||
class="w-full px-4 py-2 rounded-lg border border-light-300 dark:border-dark-300 bg-light-200 dark:bg-dark-300 focus:outline-none focus:ring-2 focus:ring-primary dark:focus:ring-secondary transition-all"
|
||
placeholder="例如:无、龙门">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 法人信息 - 标签式输入 -->
|
||
<div>
|
||
<label class="block text-sm font-medium mb-2">法人(MC玩家名) <span class="text-danger">*</span>
|
||
<span class="text-xs text-[var(--TextMuted)] ml-1">(输入MC玩家名后按回车添加,可添加多个,第一个是法人,其他是监事,第一个必须是您当前绑定的玩家名)</span>
|
||
</label>
|
||
<div id="juridical-persons-container" class="tag-container">
|
||
<input type="text" id="juridical-person-input" placeholder="输入MC玩家名并按回车添加..."
|
||
class="tag-input">
|
||
</div>
|
||
<input type="hidden" id="EnterpriseJuridicalPerson" name="EnterpriseJuridicalPerson" required>
|
||
</div>
|
||
|
||
<!-- 经营范围 - 标签式输入 -->
|
||
<div>
|
||
<label class="block text-sm font-medium mb-2">经营范围 <span class="text-danger">*</span>
|
||
<span class="text-xs text-[var(--TextMuted)] ml-1">(输入后按回车添加,可添加多个)</span>
|
||
</label>
|
||
<div id="business-scope-container" class="tag-container">
|
||
<input type="text" id="business-scope-input" placeholder="输入经营范围并按回车添加..."
|
||
class="tag-input">
|
||
</div>
|
||
<input type="hidden" id="EnterpriseBusinessScope" name="EnterpriseBusinessScope" required>
|
||
</div>
|
||
|
||
<!-- 企业描述 -->
|
||
<div>
|
||
<label for="EnterpriseDesc" class="block text-sm font-medium mb-1">企业描述</label>
|
||
<textarea id="EnterpriseDesc" name="EnterpriseDesc" rows="3"
|
||
class="w-full px-4 py-2 rounded-lg border border-light-300 dark:border-dark-300 bg-light-200 dark:bg-dark-300 focus:outline-none focus:ring-2 focus:ring-primary dark:focus:ring-secondary transition-all"></textarea>
|
||
</div>
|
||
|
||
<!-- 表单按钮 -->
|
||
<div class="flex justify-end space-x-3 pt-4 border-t border-light-300 dark:border-dark-300">
|
||
<button type="button" id="cancel-form" class="px-5 py-2 rounded-lg border border-light-300 dark:border-dark-300 bg-light-200 dark:bg-dark-300 hover:bg-light-300 dark:hover:bg-dark-200 transition-colors">
|
||
取消
|
||
</button>
|
||
<button type="submit" class="px-5 py-2 rounded-lg bg-accent text-white hover:bg-accent transition-colors shadow-sm">
|
||
<span id="submit-btn-text">提交注册</span>
|
||
</button>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 企业详情窗口 -->
|
||
<div id="detail-modal" class="fixed inset-0 z-50 flex items-center justify-center hidden">
|
||
<div class="absolute inset-0 bg-black/50 backdrop-blur-sm" id="detail-overlay"></div>
|
||
<div class="relative bg-light-100 dark:bg-dark-100 rounded-xl shadow-xl w-full max-w-4xl max-h-[90vh] overflow-y-auto scrollbar-hide">
|
||
<div class="p-6 border-b border-light-300 dark:border-dark-300">
|
||
<div class="flex justify-between items-center">
|
||
<h3 class="text-xl font-bold">企业详情</h3>
|
||
<button id="close-detail" class="p-1.5 rounded-full hover:bg-light-300 dark:hover:bg-dark-300 transition-colors">
|
||
<i class="fa fa-times"></i>
|
||
</button>
|
||
</div>
|
||
</div>
|
||
|
||
<div id="enterprise-detail-content" class="p-6 space-y-6">
|
||
<!-- 详情内容将通过JS动态生成 -->
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 注销确认模态框 -->
|
||
<div id="deregister-modal" class="fixed inset-0 z-50 flex items-center justify-center hidden">
|
||
<div class="absolute inset-0 bg-black/50 backdrop-blur-sm" id="deregister-overlay"></div>
|
||
<div class="relative bg-light-100 dark:bg-dark-100 rounded-xl shadow-xl w-full max-w-md">
|
||
<div class="p-6 border-b border-light-300 dark:border-dark-300">
|
||
<div class="flex justify-between items-center">
|
||
<h3 class="text-xl font-bold text-danger">确认注销企业</h3>
|
||
<button id="close-deregister" class="p-1.5 rounded-full hover:bg-light-300 dark:hover:bg-dark-300 transition-colors">
|
||
<i class="fa fa-times"></i>
|
||
</button>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="p-6">
|
||
<p class="mb-4 text-sm text-[var(--TextSecondary)]">
|
||
注销后将由系统审核,你不可再次操作这个企业,管理员审核后将会完全删除数据,如有需要请第一时间联系管理员
|
||
</p>
|
||
<p class="mb-6 text-sm font-medium">
|
||
<span class="text-[var(--TextSecondary)]">企业名称: </span>
|
||
<span id="deregister-enterprise-name"></span>
|
||
</p>
|
||
<p class="mb-6 text-sm font-medium">
|
||
<span class="text-[var(--TextSecondary)]">企业UUID: </span>
|
||
<span id="deregister-enterprise-uuid" class="font-mono text-xs"></span>
|
||
</p>
|
||
<input type="hidden" id="deregister-uuid">
|
||
<div class="flex justify-end space-x-3">
|
||
<button id="cancel-deregister" class="px-5 py-2 rounded-lg border border-light-300 dark:border-dark-300 bg-light-200 dark:bg-dark-300 hover:bg-light-300 dark:hover:bg-dark-200 transition-colors">
|
||
取消
|
||
</button>
|
||
<button id="confirm-deregister" class="px-5 py-2 rounded-lg bg-danger text-white hover:bg-danger transition-colors shadow-sm">
|
||
确认注销
|
||
</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<footer class="bg-light-100 dark:bg-dark-100 border-t border-light-300/30 dark:border-dark-300/30 py-8">
|
||
<div class="container mx-auto px-4">
|
||
<div class="flex flex-col md:flex-row justify-between items-center">
|
||
<div class="mb-4 md:mb-0">
|
||
<div class="flex items-center space-x-2">
|
||
<div class="text-primary dark:text-secondary text-2xl">
|
||
<i class="fa fa-bank"></i>
|
||
</div>
|
||
<div>
|
||
<h2 class="text-lg font-bold">枢机信用储备银行</h2>
|
||
<p class="text-xs text-[var(--TextSecondary)]">银河锋锐软件开发工作室</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="text-sm text-[var(--TextSecondary)]">
|
||
<p>© 2025 枢机信用储备银行. 保留所有权利.</p>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</footer>
|
||
|
||
<script>
|
||
// 全局变量
|
||
let enterprises = [];
|
||
let currentPage = 1;
|
||
const pageSize = 10;
|
||
let filteredEnterprises = [];
|
||
let currentEditingUuid = null; // 当前编辑的企业UUID
|
||
|
||
// 初始化页面
|
||
document.addEventListener('DOMContentLoaded', function() {
|
||
// 初始化主题
|
||
if (localStorage.getItem('darkMode') === 'true') {
|
||
document.documentElement.classList.add('dark');
|
||
}
|
||
|
||
// 主题切换
|
||
const themeToggle = document.getElementById('theme-toggle');
|
||
themeToggle.addEventListener('click', () => {
|
||
document.documentElement.classList.toggle('dark');
|
||
localStorage.setItem('darkMode', document.documentElement.classList.contains('dark'));
|
||
});
|
||
|
||
// 移动端菜单
|
||
const mobileMenuButton = document.getElementById('mobile-menu-button');
|
||
const mobileMenu = document.getElementById('mobile-menu');
|
||
mobileMenuButton.addEventListener('click', () => {
|
||
mobileMenu.classList.toggle('hidden');
|
||
});
|
||
|
||
// 注册标签式输入功能
|
||
initTagInput('juridical-persons-container', 'juridical-person-input', 'EnterpriseJuridicalPerson');
|
||
initTagInput('business-scope-container', 'business-scope-input', 'EnterpriseBusinessScope');
|
||
|
||
// 模态框控制
|
||
const addEnterpriseBtn = document.getElementById('add-enterprise-btn');
|
||
const mobileAddEnterpriseBtn = document.getElementById('mobile-add-enterprise-btn');
|
||
const enterpriseModal = document.getElementById('enterprise-modal');
|
||
const closeModal = document.getElementById('close-modal');
|
||
const cancelForm = document.getElementById('cancel-form');
|
||
const modalOverlay = document.getElementById('modal-overlay');
|
||
|
||
function openModal(isEdit = false, enterprise = null) {
|
||
enterpriseModal.classList.remove('hidden');
|
||
|
||
if (isEdit && enterprise) {
|
||
// 编辑模式
|
||
currentEditingUuid = enterprise.EnterpriseUUID;
|
||
document.getElementById('modal-title').textContent = '编辑企业';
|
||
document.getElementById('submit-btn-text').textContent = '保存修改';
|
||
document.getElementById('EnterpriseUUID').value = enterprise.EnterpriseUUID;
|
||
|
||
// 加载企业数据到表单
|
||
loadEnterpriseDataToForm(enterprise);
|
||
} else {
|
||
// 创建模式
|
||
currentEditingUuid = null;
|
||
document.getElementById('modal-title').textContent = '企业注册';
|
||
document.getElementById('submit-btn-text').textContent = '提交注册';
|
||
|
||
// 重置表单
|
||
document.getElementById('enterprise-form').reset();
|
||
document.getElementById('EnterpriseUUID').value = '';
|
||
// 清空标签
|
||
clearTags('juridical-persons-container');
|
||
clearTags('business-scope-container');
|
||
}
|
||
}
|
||
window.openModal=openModal;
|
||
|
||
function closeModalFunc() {
|
||
enterpriseModal.classList.add('hidden');
|
||
}
|
||
|
||
addEnterpriseBtn.addEventListener('click', () => openModal());
|
||
mobileAddEnterpriseBtn.addEventListener('click', () => {
|
||
mobileMenu.classList.add('hidden');
|
||
openModal();
|
||
});
|
||
closeModal.addEventListener('click', closeModalFunc);
|
||
cancelForm.addEventListener('click', closeModalFunc);
|
||
modalOverlay.addEventListener('click', closeModalFunc);
|
||
|
||
// 企业表单提交
|
||
const enterpriseForm = document.getElementById('enterprise-form');
|
||
enterpriseForm.addEventListener('submit', function(e) {
|
||
e.preventDefault();
|
||
|
||
// 验证标签是否至少有一个
|
||
const juridicalPersons = document.getElementById('EnterpriseJuridicalPerson').value;
|
||
const businessScope = document.getElementById('EnterpriseBusinessScope').value;
|
||
|
||
if (!juridicalPersons) {
|
||
alert('请至少添加一个MC玩家名(法人)');
|
||
return;
|
||
}
|
||
|
||
if (!businessScope) {
|
||
alert('请至少添加一个经营范围');
|
||
return;
|
||
}
|
||
|
||
// 创建表单数据
|
||
const formData = new FormData(enterpriseForm);
|
||
const enterpriseData = {
|
||
EnterpriseUUID: formData.get('EnterpriseUUID') || '',
|
||
EnterpriseFatherUUID: formData.get('EnterpriseFatherUUID') || '',
|
||
Enterprise3C: formData.get('Enterprise3C') || '',
|
||
EnterpriseName: formData.get('EnterpriseName'),
|
||
EnterpriseType: formData.get('EnterpriseType'),
|
||
EnterpriseStatus: formData.get('EnterpriseStatus'),
|
||
EnterpriseJuridicalPerson: juridicalPersons,
|
||
EnterpriseRegisteredCapital: formData.get('EnterpriseRegisteredCapital'),
|
||
EnterpriseCapitalGC: formData.get('EnterpriseCapitalGC'),
|
||
EnterpriseTele: formData.get('EnterpriseTele'),
|
||
EnterpriseEmail: formData.get('EnterpriseEmail') || '',
|
||
EnterpriseWebsite: formData.get('EnterpriseWebsite') || '',
|
||
EnterpriseAddress: formData.get('EnterpriseAddress'),
|
||
EnterpriseDesc: formData.get('EnterpriseDesc') || '',
|
||
EnterpriseAdministrativeDivisions: formData.get('EnterpriseAdministrativeDivisions'),
|
||
EnterpriseBusinessScope: businessScope
|
||
};
|
||
|
||
// 区分创建和编辑
|
||
const apiUrl = "/API/Enterprise/NewEnterprise";
|
||
|
||
fetch(apiUrl, {
|
||
method: "POST",
|
||
headers: {
|
||
"Content-Type": "application/json"
|
||
},
|
||
credentials: 'include',
|
||
body: JSON.stringify(enterpriseData)
|
||
}).then(res => res.json()).then(data => {
|
||
if (data.status === 0) {
|
||
showNotification(currentEditingUuid ? '企业修改成功' : '企业注册成功');
|
||
// 刷新列表
|
||
refreshEnterpriseList();
|
||
// 关闭模态框
|
||
closeModalFunc();
|
||
} else {
|
||
showNotification((currentEditingUuid ? '企业修改失败' : '企业注册失败') + ',原因:' + data.msg);
|
||
}
|
||
}).catch(error => {
|
||
showNotification('请求失败: ' + error.message);
|
||
});
|
||
});
|
||
|
||
// 刷新按钮
|
||
const refreshBtn = document.getElementById('refresh-btn');
|
||
const mobileRefreshBtn = document.getElementById('mobile-refresh-btn');
|
||
|
||
refreshBtn.addEventListener('click', refreshEnterpriseList);
|
||
mobileRefreshBtn.addEventListener('click', () => {
|
||
mobileMenu.classList.add('hidden');
|
||
refreshEnterpriseList();
|
||
});
|
||
|
||
// 搜索功能
|
||
const searchInput = document.getElementById('search-input');
|
||
searchInput.addEventListener('input', function() {
|
||
const searchTerm = this.value.toLowerCase().trim();
|
||
filteredEnterprises = enterprises.filter(ent =>
|
||
ent.EnterpriseName.toLowerCase().includes(searchTerm) ||
|
||
ent.EnterpriseUUID.toLowerCase().includes(searchTerm)
|
||
);
|
||
currentPage = 1; // 重置到第一页
|
||
renderEnterpriseList();
|
||
});
|
||
|
||
// 分页控制
|
||
const prevPageBtn = document.getElementById('prev-page');
|
||
const nextPageBtn = document.getElementById('next-page');
|
||
|
||
prevPageBtn.addEventListener('click', () => {
|
||
if (currentPage > 1) {
|
||
currentPage--;
|
||
renderEnterpriseList();
|
||
}
|
||
});
|
||
|
||
nextPageBtn.addEventListener('click', () => {
|
||
const totalPages = Math.ceil(filteredEnterprises.length / pageSize);
|
||
if (currentPage < totalPages) {
|
||
currentPage++;
|
||
renderEnterpriseList();
|
||
}
|
||
});
|
||
|
||
// 企业详情模态框控制
|
||
const detailModal = document.getElementById('detail-modal');
|
||
const closeDetail = document.getElementById('close-detail');
|
||
const detailOverlay = document.getElementById('detail-overlay');
|
||
|
||
function closeDetailModal() {
|
||
detailModal.classList.add('hidden');
|
||
}
|
||
|
||
closeDetail.addEventListener('click', closeDetailModal);
|
||
detailOverlay.addEventListener('click', closeDetailModal);
|
||
|
||
// 注销模态框控制
|
||
const deregisterModal = document.getElementById('deregister-modal');
|
||
const closeDeregister = document.getElementById('close-deregister');
|
||
const cancelDeregister = document.getElementById('cancel-deregister');
|
||
const deregisterOverlay = document.getElementById('deregister-overlay');
|
||
const confirmDeregister = document.getElementById('confirm-deregister');
|
||
|
||
function closeDeregisterModal() {
|
||
deregisterModal.classList.add('hidden');
|
||
}
|
||
|
||
window.deregisterModal = deregisterModal;
|
||
|
||
closeDeregister.addEventListener('click', closeDeregisterModal);
|
||
cancelDeregister.addEventListener('click', closeDeregisterModal);
|
||
deregisterOverlay.addEventListener('click', closeDeregisterModal);
|
||
|
||
// 确认注销按钮事件
|
||
confirmDeregister.addEventListener('click', function() {
|
||
const uuid = document.getElementById('deregister-uuid').value;
|
||
if (!uuid) return;
|
||
|
||
// 发送注销请求
|
||
fetch('/API/Enterprise/Deregistration', {
|
||
method: 'POST',
|
||
headers: {
|
||
'Content-Type': 'application/json'
|
||
},
|
||
credentials: 'include',
|
||
body: JSON.stringify({EnterpriseUUID: uuid})
|
||
})
|
||
.then(response => {
|
||
if (!response.ok) {
|
||
throw new Error('网络响应不正常');
|
||
}
|
||
return response.json();
|
||
})
|
||
.then(data => {
|
||
if (data.status === 0) {
|
||
showNotification('企业注销申请已提交,等待系统审核');
|
||
closeDeregisterModal();
|
||
refreshEnterpriseList(); // 刷新企业列表
|
||
} else {
|
||
showNotification('注销失败: ' + data.msg);
|
||
}
|
||
})
|
||
.catch(error => {
|
||
showNotification('注销请求失败: ' + error.message);
|
||
});
|
||
});
|
||
|
||
// 初始加载企业数据
|
||
refreshEnterpriseList();
|
||
});
|
||
|
||
/**
|
||
* 将企业数据加载到表单中
|
||
* @param {Object} enterprise 企业数据对象
|
||
*/
|
||
function loadEnterpriseDataToForm(enterprise) {
|
||
// 填充普通输入框
|
||
document.getElementById('EnterpriseName').value = enterprise.EnterpriseName || '';
|
||
document.getElementById('EnterpriseType').value = enterprise.EnterpriseType === '股份有限公司' ? '0' :
|
||
enterprise.EnterpriseType === '国有企业' ? '1' : '';
|
||
document.getElementById('EnterpriseFatherUUID').value = enterprise.EnterpriseFatherUUID || '';
|
||
document.getElementById('Enterprise3C').value = enterprise.Enterprise3C || '';
|
||
document.getElementById('EnterpriseRegisteredCapital').value = enterprise.EnterpriseRegisteredCapital || '';
|
||
document.getElementById('EnterpriseCapitalGC').value = enterprise.EnterpriseCapitalGC || 'GC';
|
||
document.getElementById('EnterpriseStatus').value = enterprise.EnterpriseStatus === '正常' ? 0 :
|
||
enterprise.EnterpriseStatus === '停业' ? 1 :
|
||
enterprise.EnterpriseStatus === '注销' ? 2 :
|
||
enterprise.EnterpriseStatus === '吊销' ? 3 :
|
||
enterprise.EnterpriseStatus === '筹建' ? 4 : '';
|
||
document.getElementById('Enterprise3C').value = enterprise.Enterprise3C || '';
|
||
document.getElementById('EnterpriseTele').value = enterprise.EnterpriseTele || '';
|
||
document.getElementById('EnterpriseEmail').value = enterprise.EnterpriseEmail || '';
|
||
document.getElementById('EnterpriseWebsite').value = enterprise.EnterpriseWebsite || '';
|
||
document.getElementById('EnterpriseAddress').value = enterprise.EnterpriseAddress || '';
|
||
document.getElementById('EnterpriseAdministrativeDivisions').value = enterprise.EnterpriseAdministrativeDivisions || '';
|
||
document.getElementById('EnterpriseDesc').value = enterprise.EnterpriseDesc || '';
|
||
|
||
// 填充标签
|
||
clearTags('juridical-persons-container');
|
||
if (enterprise.EnterpriseJuridicalPerson) {
|
||
const juridicalPersons = typeof enterprise.EnterpriseJuridicalPerson === 'string'
|
||
? enterprise.EnterpriseJuridicalPerson.split(',')
|
||
: enterprise.EnterpriseJuridicalPerson || [];
|
||
|
||
juridicalPersons.forEach(person => {
|
||
addTag('juridical-persons-container', person);
|
||
});
|
||
// 更新隐藏字段
|
||
updateHiddenInput('juridical-persons-container', 'EnterpriseJuridicalPerson');
|
||
}
|
||
|
||
clearTags('business-scope-container');
|
||
if (enterprise.EnterpriseBusinessScope) {
|
||
const businessScope = typeof enterprise.EnterpriseBusinessScope === 'string'
|
||
? enterprise.EnterpriseBusinessScope.split(',')
|
||
: enterprise.EnterpriseBusinessScope || [];
|
||
|
||
businessScope.forEach(scope => {
|
||
addTag('business-scope-container', scope);
|
||
});
|
||
// 更新隐藏字段
|
||
updateHiddenInput('business-scope-container', 'EnterpriseBusinessScope');
|
||
}
|
||
}
|
||
|
||
/**
|
||
* 初始化标签式输入
|
||
* @param {string} containerId 容器ID
|
||
* @param {string} inputId 输入框ID
|
||
* @param {string} hiddenInputId 隐藏输入框ID,用于表单提交
|
||
*/
|
||
function initTagInput(containerId, inputId, hiddenInputId) {
|
||
const container = document.getElementById(containerId);
|
||
const input = document.getElementById(inputId);
|
||
const hiddenInput = document.getElementById(hiddenInputId);
|
||
|
||
// 确保输入框样式正确
|
||
input.classList.add('tag-input', 'flex-grow', 'min-w-[120px]', 'py-1', 'px-2', 'outline-none', 'bg-transparent');
|
||
|
||
input.addEventListener('keydown', function(e) {
|
||
// 按回车添加标签
|
||
if (e.key === 'Enter' && this.value.trim()) {
|
||
e.preventDefault();
|
||
addTag(containerId, this.value.trim());
|
||
this.value = '';
|
||
updateHiddenInput(containerId, hiddenInputId);
|
||
}
|
||
});
|
||
|
||
// 点击容器其他区域时聚焦输入框
|
||
container.addEventListener('click', function() {
|
||
input.focus();
|
||
});
|
||
}
|
||
|
||
/**
|
||
* 添加标签
|
||
* @param {string} containerId 容器ID
|
||
* @param {string} text 标签文本
|
||
*/
|
||
function addTag(containerId, text) {
|
||
const container = document.getElementById(containerId);
|
||
const input = container.querySelector('input');
|
||
|
||
const tag = document.createElement('div');
|
||
tag.className = 'tag';
|
||
tag.innerHTML = `
|
||
<span>${text}</span>
|
||
<span class="tag-remove" data-text="${text}">×</span>
|
||
`;
|
||
|
||
// 添加删除事件
|
||
tag.querySelector('.tag-remove').addEventListener('click', function(e) {
|
||
e.stopPropagation(); // 防止事件冒泡到容器
|
||
tag.remove();
|
||
// 更新隐藏输入框
|
||
const hiddenInputId = containerId === 'juridical-persons-container' ?
|
||
'EnterpriseJuridicalPerson' : 'EnterpriseBusinessScope';
|
||
updateHiddenInput(containerId, hiddenInputId);
|
||
});
|
||
|
||
// 在输入框前插入标签
|
||
container.insertBefore(tag, input);
|
||
}
|
||
|
||
/**
|
||
* 清空所有标签
|
||
* @param {string} containerId 容器ID
|
||
*/
|
||
function clearTags(containerId) {
|
||
const container = document.getElementById(containerId);
|
||
const tags = container.querySelectorAll('.tag');
|
||
tags.forEach(tag => tag.remove());
|
||
// 更新隐藏输入框
|
||
const hiddenInputId = containerId === 'juridical-persons-container' ?
|
||
'EnterpriseJuridicalPerson' : 'EnterpriseBusinessScope';
|
||
document.getElementById(hiddenInputId).value = '';
|
||
}
|
||
|
||
/**
|
||
* 更新隐藏输入框的值(以逗号分隔的标签文本)
|
||
* @param {string} containerId 容器ID
|
||
* @param {string} hiddenInputId 隐藏输入框ID
|
||
*/
|
||
function updateHiddenInput(containerId, hiddenInputId) {
|
||
const container = document.getElementById(containerId);
|
||
const tags = container.querySelectorAll('.tag');
|
||
const tagTexts = Array.from(tags).map(tag => tag.querySelector('span:first-child').textContent);
|
||
document.getElementById(hiddenInputId).value = tagTexts.join(',');
|
||
}
|
||
|
||
/**
|
||
* 刷新企业列表 - 从API获取数据
|
||
*/
|
||
function refreshEnterpriseList() {
|
||
// 显示加载状态
|
||
const listBody = document.getElementById('enterprise-list-body');
|
||
listBody.innerHTML = `
|
||
<tr>
|
||
<td colspan="8" class="px-4 py-12 text-center text-[var(--TextSecondary)]">
|
||
<div class="flex flex-col items-center">
|
||
<i class="fa fa-circle-o-notch fa-spin text-4xl mb-3 text-primary dark:text-secondary"></i>
|
||
<p>正在加载企业数据...</p>
|
||
</div>
|
||
</td>
|
||
</tr>
|
||
`;
|
||
|
||
// 从API获取企业数据
|
||
fetch('/API/Enterprise/GetEnterprise', {credentials: 'include'})
|
||
.then(response => {
|
||
if (!response.ok) {
|
||
throw new Error('网络响应不正常');
|
||
}
|
||
return response.json();
|
||
})
|
||
.then(data => {
|
||
if (data.status === 0) {
|
||
// 请求成功,更新企业数据
|
||
enterprises = data.data || [];
|
||
|
||
// 处理企业类型和状态的显示文本
|
||
enterprises.forEach(enterprise => {
|
||
// 转换企业类型ID为文本
|
||
switch(enterprise.EnterpriseType) {
|
||
case 0:
|
||
enterprise.EnterpriseType = '股份有限公司';
|
||
break;
|
||
case 1:
|
||
enterprise.EnterpriseType = '国有企业';
|
||
break;
|
||
default:
|
||
enterprise.EnterpriseType = '未知类型';
|
||
}
|
||
|
||
// 转换企业状态ID为文本
|
||
switch(enterprise.EnterpriseStatus) {
|
||
case 0:
|
||
enterprise.EnterpriseStatus = '正常';
|
||
break;
|
||
case 1:
|
||
enterprise.EnterpriseStatus = '停业';
|
||
break;
|
||
case 2:
|
||
enterprise.EnterpriseStatus = '注销';
|
||
break;
|
||
case 3:
|
||
enterprise.EnterpriseStatus = '吊销';
|
||
break;
|
||
case 4:
|
||
enterprise.EnterpriseStatus = '筹建';
|
||
break;
|
||
default:
|
||
enterprise.EnterpriseStatus = '未知状态';
|
||
}
|
||
});
|
||
|
||
// 重置过滤
|
||
filteredEnterprises = [...enterprises];
|
||
currentPage = 1;
|
||
renderEnterpriseList();
|
||
|
||
showNotification('列表已刷新,共 ' + enterprises.length + ' 家企业');
|
||
} else {
|
||
// 请求成功但返回错误状态
|
||
listBody.innerHTML = `
|
||
<tr>
|
||
<td colspan="8" class="px-4 py-12 text-center text-[var(--TextSecondary)]">
|
||
<div class="flex flex-col items-center">
|
||
<i class="fa fa-exclamation-triangle text-4xl mb-3 text-warning"></i>
|
||
<p>加载失败: ${data.msg}</p>
|
||
</div>
|
||
</td>
|
||
</tr>
|
||
`;
|
||
showNotification('加载失败: ' + data.msg);
|
||
}
|
||
})
|
||
.catch(error => {
|
||
// 请求失败
|
||
listBody.innerHTML = `
|
||
<tr>
|
||
<td colspan="8" class="px-4 py-12 text-center text-[var(--TextSecondary)]">
|
||
<div class="flex flex-col items-center">
|
||
<i class="fa fa-times-circle text-4xl mb-3 text-danger"></i>
|
||
<p>请求失败: ${error.message}</p>
|
||
</div>
|
||
</td>
|
||
</tr>
|
||
`;
|
||
showNotification('请求失败: ' + error.message);
|
||
});
|
||
}
|
||
|
||
/**
|
||
* 渲染企业列表
|
||
*/
|
||
function renderEnterpriseList() {
|
||
const listBody = document.getElementById('enterprise-list-body');
|
||
const totalCountEl = document.getElementById('total-count');
|
||
const showingRangeEl = document.getElementById('showing-range');
|
||
const prevPageBtn = document.getElementById('prev-page');
|
||
const nextPageBtn = document.getElementById('next-page');
|
||
|
||
const totalCount = filteredEnterprises.length;
|
||
totalCountEl.textContent = totalCount;
|
||
|
||
// 计算分页
|
||
const totalPages = Math.ceil(totalCount / pageSize);
|
||
const startIndex = (currentPage - 1) * pageSize;
|
||
const endIndex = Math.min(startIndex + pageSize, totalCount);
|
||
const currentPageData = filteredEnterprises.slice(startIndex, endIndex);
|
||
|
||
// 更新显示范围
|
||
showingRangeEl.textContent = totalCount > 0 ? `${startIndex + 1}-${endIndex}` : '0-0';
|
||
|
||
// 更新分页按钮状态
|
||
prevPageBtn.disabled = currentPage === 1;
|
||
nextPageBtn.disabled = currentPage >= totalPages;
|
||
|
||
// 渲染列表
|
||
if (currentPageData.length === 0) {
|
||
listBody.innerHTML = `
|
||
<tr>
|
||
<td colspan="8" class="px-4 py-12 text-center text-[var(--TextSecondary)]">
|
||
<div class="flex flex-col items-center">
|
||
<i class="fa fa-search text-4xl mb-3 opacity-30"></i>
|
||
<p>没有找到匹配的企业数据</p>
|
||
</div>
|
||
</td>
|
||
</tr>
|
||
`;
|
||
return;
|
||
}
|
||
|
||
// 生成列表内容(添加编辑和注销按钮)
|
||
listBody.innerHTML = currentPageData.map(enterprise => `
|
||
<tr class="border-b border-light-300 dark:border-dark-300 hover:bg-light-300/30 dark:hover:bg-dark-200/30 transition-colors">
|
||
<td class="px-4 py-3 text-sm font-mono">${truncateText(enterprise.EnterpriseUUID, 12)}</td>
|
||
<td class="px-4 py-3">${enterprise.EnterpriseName}</td>
|
||
<td class="px-4 py-3">${enterprise.EnterpriseType}</td>
|
||
<td class="px-4 py-3">
|
||
<span class="px-2 py-1 rounded-full text-xs ${getStatusClass(enterprise.EnterpriseStatus)}">
|
||
${enterprise.EnterpriseStatus}
|
||
</span>
|
||
</td>
|
||
<td class="px-4 py-3">${truncateText(enterprise.EnterpriseJuridicalPerson, 20)}</td>
|
||
<td class="px-4 py-3">${enterprise.EnterpriseRegisteredCapital} 万 ${enterprise.EnterpriseCapitalGC}</td>
|
||
<td class="px-4 py-3 text-sm">${enterprise.EnterpriseCreateTime || '未知时间'}</td>
|
||
<td class="px-4 py-3">
|
||
<button class="view-detail px-2 py-1 text-sm rounded bg-[var(--PrimaryAlpha10)] dark:bg-[var(--PrimaryAlpha15)] text-primary dark:text-secondary hover:bg-[var(--PrimaryAlpha15)] dark:hover:bg-[var(--PrimaryAlpha15)] transition-colors mr-1"
|
||
data-uuid="${enterprise.EnterpriseUUID}">
|
||
查看
|
||
</button>
|
||
${(enterprise.EnterpriseUserType === 0 || enterprise.EnterpriseUserType === 1) ?
|
||
`<button class="edit-enterprise px-2 py-1 text-sm rounded bg-[rgba(100,116,139,0.1)] dark:bg-[rgba(100,116,139,0.2)] text-secondary dark:text-secondary hover:bg-[rgba(100,116,139,0.2)] dark:hover:bg-[rgba(100,116,139,0.2)] transition-colors mr-1"
|
||
data-uuid="${enterprise.EnterpriseUUID}">
|
||
编辑
|
||
</button>
|
||
<button class="deregister-enterprise px-2 py-1 text-sm rounded bg-[var(--DangerAlpha10)] dark:bg-[var(--DangerAlpha10)] text-danger hover:bg-[var(--DangerAlpha10)] dark:hover:bg-[var(--DangerAlpha10)] transition-colors"
|
||
data-uuid="${enterprise.EnterpriseUUID}" data-name="${enterprise.EnterpriseName}">
|
||
注销
|
||
</button>` : ''}
|
||
</td>
|
||
</tr>
|
||
`).join('');
|
||
|
||
// 为查看按钮添加事件
|
||
document.querySelectorAll('.view-detail').forEach(btn => {
|
||
btn.addEventListener('click', function() {
|
||
const uuid = this.getAttribute('data-uuid');
|
||
showEnterpriseDetail(uuid);
|
||
});
|
||
});
|
||
|
||
// 为编辑按钮添加事件
|
||
document.querySelectorAll('.edit-enterprise').forEach(btn => {
|
||
btn.addEventListener('click', function() {
|
||
const uuid = this.getAttribute('data-uuid');
|
||
const enterprise = enterprises.find(ent => ent.EnterpriseUUID === uuid);
|
||
if (enterprise) {
|
||
// 关闭移动端菜单(如果打开)
|
||
document.getElementById('mobile-menu').classList.add('hidden');
|
||
// 打开编辑模态框
|
||
document.dispatchEvent(new CustomEvent('openModal', {
|
||
detail: { isEdit: true, enterprise: enterprise }
|
||
}));
|
||
}
|
||
});
|
||
});
|
||
|
||
// 为注销按钮添加事件
|
||
document.querySelectorAll('.deregister-enterprise').forEach(btn => {
|
||
btn.addEventListener('click', function() {
|
||
const uuid = this.getAttribute('data-uuid');
|
||
const name = this.getAttribute('data-name');
|
||
|
||
// 填充注销模态框数据
|
||
document.getElementById('deregister-uuid').value = uuid;
|
||
document.getElementById('deregister-enterprise-name').textContent = name;
|
||
document.getElementById('deregister-enterprise-uuid').textContent = uuid;
|
||
|
||
// 显示注销模态框
|
||
deregisterModal.classList.remove('hidden');
|
||
});
|
||
});
|
||
|
||
// 监听自定义事件打开编辑模态框
|
||
document.addEventListener('openModal', function(e) {
|
||
const { isEdit, enterprise } = e.detail;
|
||
openModal(isEdit, enterprise);
|
||
});
|
||
}
|
||
|
||
/**
|
||
* 根据状态获取样式类
|
||
* @param {string} status 状态文本
|
||
* @returns {string} 样式类名
|
||
*/
|
||
function getStatusClass(status) {
|
||
switch(status) {
|
||
case '正常':
|
||
return 'bg-[var(--SuccessAlpha10)] text-accent';
|
||
case '停业':
|
||
return 'bg-[var(--WarningAlpha10)] text-warning';
|
||
case '注销':
|
||
case '吊销':
|
||
return 'bg-[var(--DangerAlpha10)] text-danger';
|
||
case '筹建':
|
||
return 'bg-info/20 text-info';
|
||
default:
|
||
return 'bg-[var(--HoverBackground)] text-[var(--TextPrimary)]';
|
||
}
|
||
}
|
||
|
||
/**
|
||
* 显示企业详情
|
||
* @param {string} uuid 企业UUID
|
||
*/
|
||
function showEnterpriseDetail(uuid) {
|
||
const enterprise = enterprises.find(ent => ent.EnterpriseUUID === uuid);
|
||
if (!enterprise) return;
|
||
|
||
const detailContent = document.getElementById('enterprise-detail-content');
|
||
|
||
// 处理法人信息和经营范围为数组
|
||
const juridicalPersons = typeof enterprise.EnterpriseJuridicalPerson === 'string'
|
||
? enterprise.EnterpriseJuridicalPerson.split(',')
|
||
: enterprise.EnterpriseJuridicalPerson || [];
|
||
|
||
const businessScope = typeof enterprise.EnterpriseBusinessScope === 'string'
|
||
? enterprise.EnterpriseBusinessScope.split(',')
|
||
: enterprise.EnterpriseBusinessScope || [];
|
||
|
||
// 生成详情HTML
|
||
detailContent.innerHTML = `
|
||
<div class="grid grid-cols-1 md:grid-cols-2 gap-6">
|
||
<div>
|
||
<h4 class="text-lg font-semibold mb-4 pb-2 border-b border-light-300 dark:border-dark-300">基本信息</h4>
|
||
<dl class="space-y-3">
|
||
<div class="flex">
|
||
<dt class="w-1/3 text-sm text-[var(--TextSecondary)]">企业UUID</dt>
|
||
<dd class="w-2/3 font-mono text-sm break-all">${enterprise.EnterpriseUUID}</dd>
|
||
</div>
|
||
<div class="flex">
|
||
<dt class="w-1/3 text-sm text-[var(--TextSecondary)]">上级企业UUID</dt>
|
||
<dd class="w-2/3 font-mono text-sm break-all">${enterprise.EnterpriseFatherUUID || '-'}</dd>
|
||
</div>
|
||
<div class="flex">
|
||
<dt class="w-1/3 text-sm text-[var(--TextSecondary)]">企业许可证(E3C)</dt>
|
||
<dd class="w-2/3 font-mono text-sm break-all">${enterprise.Enterprise3C || '-'}</dd>
|
||
</div>
|
||
<div class="flex">
|
||
<dt class="w-1/3 text-sm text-[var(--TextSecondary)]">企业名称</dt>
|
||
<dd class="w-2/3 font-medium">${enterprise.EnterpriseName}</dd>
|
||
</div>
|
||
<div class="flex">
|
||
<dt class="w-1/3 text-sm text-[var(--TextSecondary)]">企业类型</dt>
|
||
<dd class="w-2/3">${enterprise.EnterpriseType}</dd>
|
||
</div>
|
||
<div class="flex">
|
||
<dt class="w-1/3 text-sm text-[var(--TextSecondary)]">企业状态</dt>
|
||
<dd class="w-2/3">
|
||
<span class="px-2 py-1 rounded-full text-xs ${getStatusClass(enterprise.EnterpriseStatus)}">
|
||
${enterprise.EnterpriseStatus}
|
||
</span>
|
||
</dd>
|
||
</div>
|
||
<div class="flex">
|
||
<dt class="w-1/3 text-sm text-[var(--TextSecondary)]">注册资本</dt>
|
||
<dd class="w-2/3">${enterprise.EnterpriseRegisteredCapital} 万 ${enterprise.EnterpriseCapitalGC}</dd>
|
||
</div>
|
||
<div class="flex">
|
||
<dt class="w-1/3 text-sm text-[var(--TextSecondary)]">创建时间</dt>
|
||
<dd class="w-2/3">${enterprise.EnterpriseCreateTime || '未知时间'}</dd>
|
||
</div>
|
||
</dl>
|
||
</div>
|
||
|
||
<div>
|
||
<h4 class="text-lg font-semibold mb-4 pb-2 border-b border-light-300 dark:border-dark-300">联系信息</h4>
|
||
<dl class="space-y-3">
|
||
<div class="flex">
|
||
<dt class="w-1/3 text-sm text-[var(--TextSecondary)]">联系电话</dt>
|
||
<dd class="w-2/3">${enterprise.EnterpriseTele || '-'}</dd>
|
||
</div>
|
||
<div class="flex">
|
||
<dt class="w-1/3 text-sm text-[var(--TextSecondary)]">电子邮箱</dt>
|
||
<dd class="w-2/3">${enterprise.EnterpriseEmail || '-'}</dd>
|
||
</div>
|
||
<div class="flex">
|
||
<dt class="w-1/3 text-sm text-[var(--TextSecondary)]">企业网站</dt>
|
||
<dd class="w-2/3">
|
||
${enterprise.EnterpriseWebsite ?
|
||
`<a href="${enterprise.EnterpriseWebsite}" target="_blank" class="text-primary dark:text-secondary hover:underline">${truncateText(enterprise.EnterpriseWebsite, 30)}</a>` :
|
||
'-'}
|
||
</dd>
|
||
</div>
|
||
<div class="flex">
|
||
<dt class="w-1/3 text-sm text-[var(--TextSecondary)]">企业地址</dt>
|
||
<dd class="w-2/3">${enterprise.EnterpriseAddress}</dd>
|
||
</div>
|
||
<div class="flex">
|
||
<dt class="w-1/3 text-sm text-[var(--TextSecondary)]">行政区划</dt>
|
||
<dd class="w-2/3">${enterprise.EnterpriseAdministrativeDivisions}</dd>
|
||
</div>
|
||
<div class="flex">
|
||
<dt class="w-1/3 text-sm text-[var(--TextSecondary)]">营业期限</dt>
|
||
<dd class="w-2/3">${enterprise.EnterpriseBusinessPeriod || '长期'}</dd>
|
||
</div>
|
||
<div class="flex">
|
||
<dt class="w-1/3 text-sm text-[var(--TextSecondary)]">核准日期</dt>
|
||
<dd class="w-2/3">${enterprise.EnterpriseApprovalDate || '未知'}</dd>
|
||
</div>
|
||
</dl>
|
||
</div>
|
||
</div>
|
||
|
||
<div>
|
||
<h4 class="text-lg font-semibold mb-4 pb-2 border-b border-light-300 dark:border-dark-300">法人信息</h4>
|
||
<div class="flex flex-wrap gap-2">
|
||
${juridicalPersons.map(person => `
|
||
<span class="px-3 py-1 bg-[var(--PrimaryAlpha10)] dark:bg-[var(--PrimaryAlpha15)] rounded-full text-sm">${person}</span>
|
||
`).join('')}
|
||
</div>
|
||
</div>
|
||
|
||
<div>
|
||
<h4 class="text-lg font-semibold mb-4 pb-2 border-b border-light-300 dark:border-dark-300">经营范围</h4>
|
||
<div class="flex flex-wrap gap-2">
|
||
${businessScope.map(scope => `
|
||
<span class="px-3 py-1 bg-[rgba(100,116,139,0.1)] dark:bg-[rgba(100,116,139,0.2)] rounded-full text-sm">${scope}</span>
|
||
`).join('')}
|
||
</div>
|
||
</div>
|
||
|
||
<div>
|
||
<h4 class="text-lg font-semibold mb-4 pb-2 border-b border-light-300 dark:border-dark-300">企业描述</h4>
|
||
<p class="whitespace-pre-line bg-light-200 dark:bg-dark-300 p-4 rounded-lg">${enterprise.EnterpriseDesc || '无描述信息'}</p>
|
||
</div>
|
||
|
||
<div class="flex justify-end pt-4 border-t border-light-300 dark:border-dark-300">
|
||
<button id="con-detail-btn" class="px-5 py-2 rounded-lg border border-light-300 dark:border-dark-300 bg-light-200 dark:bg-dark-300 hover:bg-light-300 dark:hover:bg-dark-200 transition-colors">
|
||
打开控制面板 & 分享链接(动态权限)
|
||
</button>
|
||
</div>
|
||
|
||
<div class="flex justify-end pt-4 border-t border-light-300 dark:border-dark-300">
|
||
<button id="close-detail-btn" class="px-5 py-2 rounded-lg border border-light-300 dark:border-dark-300 bg-light-200 dark:bg-dark-300 hover:bg-light-300 dark:hover:bg-dark-200 transition-colors">
|
||
关闭
|
||
</button>
|
||
</div>
|
||
`;
|
||
|
||
// 显示详情模态框
|
||
document.getElementById('detail-modal').classList.remove('hidden');
|
||
|
||
// 添加关闭事件
|
||
document.getElementById('close-detail-btn').addEventListener('click', function() {
|
||
document.getElementById('detail-modal').classList.add('hidden');
|
||
});
|
||
|
||
// 添加打开控制面板事件
|
||
document.getElementById('con-detail-btn').addEventListener('click', function() {
|
||
window.open(`enterprisecard.html?EnterpriseUUID=${enterprise.EnterpriseUUID}`);
|
||
});
|
||
}
|
||
|
||
/**
|
||
* 截断文本并添加省略号
|
||
* @param {string} text 文本
|
||
* @param {number} maxLength 最大长度
|
||
* @returns {string} 处理后的文本
|
||
*/
|
||
function truncateText(text, maxLength) {
|
||
if (!text) return '';
|
||
return text.length > maxLength ? text.substring(0, maxLength) + '...' : text;
|
||
}
|
||
|
||
/**
|
||
* 显示通知消息
|
||
* @param {string} message 消息内容
|
||
*/
|
||
function showNotification(message) {
|
||
// 检查是否已存在通知
|
||
let notification = document.getElementById('notification');
|
||
if (notification) {
|
||
notification.remove();
|
||
}
|
||
|
||
// 创建通知元素
|
||
notification = document.createElement('div');
|
||
notification.id = 'notification';
|
||
notification.className = 'fixed bottom-4 right-4 px-4 py-3 bg-dark-200 dark:bg-dark-100 text-light-100 rounded-lg shadow-lg z-50 transform translate-y-10 opacity-0 transition-all duration-300';
|
||
notification.innerHTML = `
|
||
<div class="flex items-center">
|
||
<i class="fa fa-info-circle mr-2 text-primary dark:text-secondary"></i>
|
||
<span>${message}</span>
|
||
</div>
|
||
`;
|
||
|
||
// 添加到页面
|
||
document.body.appendChild(notification);
|
||
|
||
// 显示通知
|
||
setTimeout(() => {
|
||
notification.classList.remove('translate-y-10', 'opacity-0');
|
||
}, 10);
|
||
|
||
// 3秒后隐藏
|
||
setTimeout(() => {
|
||
notification.classList.add('translate-y-10', 'opacity-0');
|
||
setTimeout(() => {
|
||
notification.remove();
|
||
}, 300);
|
||
}, 3000);
|
||
}
|
||
</script>
|
||
<script>
|
||
// ==================== GERP 主题同步 ====================
|
||
window.addEventListener('load', function() {
|
||
const checkAndInit = () => {
|
||
if (window.GERPThemeSync) {
|
||
window.GERPThemeSync.init();
|
||
return;
|
||
}
|
||
setTimeout(checkAndInit, 100);
|
||
};
|
||
checkAndInit();
|
||
if (window.parent !== window) {
|
||
window.parent.postMessage({ type: 'GET_THEME' }, '*');
|
||
}
|
||
});
|
||
window.addEventListener('message', function(e) {
|
||
if (e.data && e.data.type === 'THEME_CHANGE') {
|
||
const colors = e.data.colors || (e.data.data && e.data.data.colors);
|
||
if (colors) {
|
||
const root = document.documentElement;
|
||
Object.entries(colors).forEach(([key, value]) => {
|
||
root.style.setProperty('--' + key, value);
|
||
});
|
||
}
|
||
}
|
||
});
|
||
</script>
|
||
</div>
|