Files
SMANAGE/backup/pages/private/CreateE/enterprise.html
T

1349 lines
72 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters
This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.
<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}">&times;</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>