数据演示对话框

hongjli

2025-04-09 e74b631e0687a38f8163943cc84a8cd76a970c98

 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} />