数据演示对话框

hongjli

2025-04-09 e74b631e0687a38f8163943cc84a8cd76a970c98

数据演示对话框

 src/app/ai-scene/page.tsx

@@ -18,7 +18,7 @@
### 工位信息

| 工位 | 原材料需求 | 原材料消耗速率 | 生产的产品 | 产线名 |
|------|------------|----------------|------------|--------|
| :--: | :--: | :--: | :--: | :--: |
| 1 | A1 | 2/小时 | P | 产线1 |
| 2 | A2 | 1/小时 | P | 产线1 |
| 3 | A3 | 2/小时 | P | 产线1 |
@@ -32,7 +32,7 @@
### 产线现场库存量

| 原材料 | 数量 | 产线名 |
|--------|------|--------|
| :--: | :--: | :--: |
| A1 | 10 | 产线1 |
| A2 | 10 | 产线1 |
| A3 | 10 | 产线1 |
@@ -46,7 +46,7 @@
### 原材料库存

| 原材料 | 库位 | 数量 |
|--------|------|------|
| :--: | :--: | :--: |
| A1 | 3-2 | 100 |
| A2 | 3-1 | 100 |
| A3 | 1-1 | 100 |

 src/components/DataPreviewDialog.tsx

@@ -62,7 +62,7 @@
                  </Dialog.Title>
                  <button
                    onClick={onClose}
                    className="text-gray-500 hover:text-gray-700 transition-colors duration-300"
                    className="text-gray-500 hover:text-gray-700 transition-colors duration-300 cursor-pointer"
                  >
                    <svg xmlns="http://www.w3.org/2000/svg" className="h-6 w-6" fill="none" viewBox="0 0 24 24" stroke="currentColor">
                      <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M6 18L18 6M6 6l12 12" />
@@ -85,11 +85,25 @@
                        thead: ({ node, ...props }) => (
                          <thead className="bg-gray-50" {...props} />
                        ),
                        th: ({ node, ...props }) => (
                          <th className="px-4 py-3 text-left text-sm font-semibold text-gray-700" {...props} />
                        ),
                        th: ({ node, children, ...props }) => {
                          // 根据表头内容动态调整宽度
                          let className = "px-4 py-3 text-center text-sm font-semibold text-gray-700";
                          
                          if (typeof children === 'string') {
                            // 根据表头内容设置合适的宽度类
                            if (children === '工位' || children === '数量' || children === '库位') {
                              className += " w-[15%]";
                            } else if (children === '原材料' || children === '原材料需求' || children === '产线名') {
                              className += " w-[20%]";
                            } else if (children === '原材料消耗速率' || children === '生产的产品') {
                              className += " w-[25%]";
                            }
                          }
                          
                          return <th className={className} {...props}>{children}</th>;
                        },
                        td: ({ node, ...props }) => (
                          <td className="px-4 py-3 text-sm text-gray-600 border-t border-gray-200" {...props} />
                          <td className="px-4 py-3 text-sm text-gray-600 border-t border-gray-200 text-center whitespace-nowrap" {...props} />
                        ),
                        tr: ({ node, ...props }) => (
                          <tr className="hover:bg-gray-50 transition-colors duration-150" {...props} />