95 lines
3.6 KiB
HTML
95 lines
3.6 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="zh-CN">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
|
<title>图纸工作台 - 切分识别与编辑系统</title>
|
|
<meta name="description" content="专业的图纸切分识别与编辑工作台，支持层级结构管理和数据编辑">
|
|
<meta name="keywords" content="图纸工作台,图纸切分,零件识别,数据编辑,料号管理">
|
|
<meta property="og:title" content="图纸工作台 - 切分识别与编辑系统">
|
|
<meta property="og:description" content="专业的图纸切分识别与编辑工作台，支持层级结构管理和数据编辑">
|
|
<meta name="twitter:title" content="图纸工作台 - 切分识别与编辑系统">
|
|
<meta name="twitter:description" content="专业的图纸切分识别与编辑工作台，支持层级结构管理和数据编辑">
|
|
|
|
<script src="https://resource.trickle.so/vendor_lib/unpkg/react@18/umd/react.production.min.js"></script>
|
|
<script src="https://resource.trickle.so/vendor_lib/unpkg/react-dom@18/umd/react-dom.production.min.js"></script>
|
|
<script src="https://resource.trickle.so/vendor_lib/unpkg/@babel/standalone/babel.min.js"></script>
|
|
<script src="https://cdn.tailwindcss.com"></script>
|
|
<link href="https://resource.trickle.so/vendor_lib/unpkg/lucide-static@0.516.0/font/lucide.css" rel="stylesheet">
|
|
|
|
<style type="text/tailwindcss">
|
|
@layer theme {
|
|
:root {
|
|
--primary-color: #2563eb;
|
|
--secondary-color: #f1f5f9;
|
|
--accent-color: #10b981;
|
|
--text-primary: #1e293b;
|
|
--text-secondary: #64748b;
|
|
--border-color: #e2e8f0;
|
|
--sidebar-width: 280px;
|
|
--header-height: 60px;
|
|
}
|
|
}
|
|
|
|
@layer base {
|
|
* {
|
|
margin: 0;
|
|
padding: 0;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
body {
|
|
font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
|
|
background-color: #f8fafc;
|
|
color: var(--text-primary);
|
|
}
|
|
}
|
|
|
|
@layer components {
|
|
.workspace-panel {
|
|
@apply bg-white border border-[var(--border-color)] rounded-lg shadow-sm;
|
|
}
|
|
|
|
.tree-item {
|
|
@apply flex items-center px-3 py-2 hover:bg-gray-50 cursor-pointer rounded-md transition-colors;
|
|
}
|
|
|
|
.tree-item.selected {
|
|
@apply bg-blue-50 border-l-4 border-l-[var(--primary-color)];
|
|
}
|
|
|
|
.btn-primary {
|
|
@apply bg-[var(--primary-color)] text-white px-4 py-2 rounded-lg hover:bg-blue-700 transition-colors;
|
|
}
|
|
|
|
.btn-secondary {
|
|
@apply bg-gray-100 text-gray-700 px-4 py-2 rounded-lg hover:bg-gray-200 transition-colors;
|
|
}
|
|
|
|
.form-input {
|
|
@apply w-full px-3 py-2 border border-[var(--border-color)] rounded-lg focus:outline-none focus:ring-2 focus:ring-[var(--primary-color)] focus:border-transparent;
|
|
}
|
|
}
|
|
|
|
@layer utilities {
|
|
.drag-handle {
|
|
cursor: grab;
|
|
}
|
|
|
|
.drag-handle:active {
|
|
cursor: grabbing;
|
|
}
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div id="root"></div>
|
|
|
|
<script type="text/babel" src="components/Header.js"></script>
|
|
<script type="text/babel" src="components/StructureTree.js"></script>
|
|
<script type="text/babel" src="components/DrawingViewer.js"></script>
|
|
<script type="text/babel" src="components/DataEditor.js"></script>
|
|
<script type="text/babel" src="utils/dragUtils.js"></script>
|
|
<script type="text/babel" src="app.js"></script>
|
|
</body>
|
|
</html> |