figma-jsx

docs/figma-jsx/果蔬.md

@@ -0,0 +1,479 @@
+```jsx
+const imgProperty1 = "https://www.figma.com/api/mcp/asset/23a4fe58-9b99-45d1-baca-87381b78f92a";
+const imgGroup1597881806 = "https://www.figma.com/api/mcp/asset/5993277b-9e42-4990-ab4b-b049ff64e989";
+const img = "https://www.figma.com/api/mcp/asset/bfb95658-1ed8-4e46-8178-ddb70d970355";
+const img1 = "https://www.figma.com/api/mcp/asset/287a91ec-959e-4596-b3fc-a00d4957ec6c";
+const img2 = "https://www.figma.com/api/mcp/asset/6887d5bc-92ae-43cf-8a8f-340f0ff76b74";
+const img3 = "https://www.figma.com/api/mcp/asset/a13d48af-3b52-49f7-a495-4b896ac7c8b1";
+const imgGroup1597881805 = "https://www.figma.com/api/mcp/asset/dce760ad-f2f9-4f55-801b-f514b32892b3";
+const img4 = "https://www.figma.com/api/mcp/asset/550e4513-6ec9-485e-bea5-6822228fd8f2";
+const img5 = "https://www.figma.com/api/mcp/asset/3ab941dc-eeb8-45fe-b4e9-4aa2380fe27f";
+const imgUnion = "https://www.figma.com/api/mcp/asset/0418477a-a88e-4bbf-ad9f-2e2321665a20";
+const imgUnion1 = "https://www.figma.com/api/mcp/asset/0e143d8d-927b-46c1-9d3e-b4d0d80cefad";
+const imgUnion2 = "https://www.figma.com/api/mcp/asset/4f4d0e31-8c69-46ba-b9cb-0b48d6bff400";
+const imgUnion3 = "https://www.figma.com/api/mcp/asset/c0badf52-292d-4c27-95c1-864a9ee5ad1f";
+const imgUnion4 = "https://www.figma.com/api/mcp/asset/d6c391c3-4cc1-4b4f-aa33-2f6c199fe39e";
+const imgUnion5 = "https://www.figma.com/api/mcp/asset/627b821e-5473-4ce9-ad67-b44aab56e7be";
+const imgUnion6 = "https://www.figma.com/api/mcp/asset/1d4b26d1-bc04-4747-8acc-bb4f65af8074";
+const imgUnion7 = "https://www.figma.com/api/mcp/asset/d410f466-7673-4110-ab14-aa08d1c19f33";
+const imgUnion8 = "https://www.figma.com/api/mcp/asset/0096ecdb-47bf-4242-a4ae-2e1b31843b3b";
+const imgUnion9 = "https://www.figma.com/api/mcp/asset/ef33bfe4-7b3d-46de-913b-fdd31e33d090";
+const imgUnion10 = "https://www.figma.com/api/mcp/asset/076228c6-1534-482f-87d9-81e30d26df24";
+const imgUnion11 = "https://www.figma.com/api/mcp/asset/b0327193-6cbf-4593-bd53-6bd868c6ec2f";
+const imgUnion12 = "https://www.figma.com/api/mcp/asset/4f641069-8896-49e9-a03c-117aad78f5e8";
+const imgUnion13 = "https://www.figma.com/api/mcp/asset/4a0639dd-6760-4edc-bed2-c7b34497236c";
+const imgUnion14 = "https://www.figma.com/api/mcp/asset/babeb408-ac6a-450a-bcc5-e7cd3d34e702";
+const imgUnion15 = "https://www.figma.com/api/mcp/asset/3ef97e3a-354a-4ddf-a890-7bc30c0e6c27";
+const imgUnion16 = "https://www.figma.com/api/mcp/asset/f2c2e25a-1acc-49d5-ad5e-aeb4c828ab87";
+const imgUnion17 = "https://www.figma.com/api/mcp/asset/28fb485e-7b9c-4e23-8bbb-86b3abf12835";
+const img6 = "https://www.figma.com/api/mcp/asset/78c297cf-7e67-4e19-96be-039f370ae204";
+const img7 = "https://www.figma.com/api/mcp/asset/ca087d20-92e0-471e-a15d-a4d3fdc7b65e";
+const img8 = "https://www.figma.com/api/mcp/asset/5baf4d3f-002e-441d-86cb-99f22e32b5c8";
+const imgGroup1158 = "https://www.figma.com/api/mcp/asset/76d8e4f4-4ddf-4a82-b873-8868936a5ad4";
+const img9 = "https://www.figma.com/api/mcp/asset/7364defa-bb66-4dd8-abf0-0a6336e8dcdb";
+const img10 = "https://www.figma.com/api/mcp/asset/b816e549-539b-4634-bf9e-05990a57e72e";
+type TextProps = {
+  className?: string;
+  propValue?: "24px" | "26px" | "34px";
+  propValue1?: "特粗";
+  propValue2?: "左对齐" | "右对齐" | "居中对齐";
+};
+
+function Text({ className, propValue = "34px", propValue1 = "特粗", propValue2 = "左对齐" }: TextProps) {
+  if (propValue === "24px" && propValue1 === "特粗" && propValue2 === "左对齐") {
+    return (
+      <div className={className} data-name="字号=24px, 字重=特粗, 位置=左对齐" data-node-id="632:88182">
+        <div className="flex flex-col font-['HarmonyOS_Sans_SC:Bold',sans-serif] justify-center leading-[0] not-italic relative shrink-0 text-[24px] text-white whitespace-nowrap" data-node-id="632:88183">
+          <p className="leading-[32px]">Text line-24px</p>
+        </div>
+      </div>
+    );
+  }
+  if (propValue === "26px" && propValue1 === "特粗" && propValue2 === "左对齐") {
+    return (
+      <div className={className} data-name="字号=26px, 字重=特粗, 位置=左对齐" data-node-id="635:42943">
+        <div className="flex flex-col font-['HarmonyOS_Sans_SC:Bold',sans-serif] justify-center leading-[0] not-italic relative shrink-0 text-[26px] text-white whitespace-nowrap" data-node-id="635:42944">
+          <p className="leading-[32px]">Text line-26px</p>
+        </div>
+      </div>
+    );
+  }
+  if (propValue === "34px" && propValue1 === "特粗" && propValue2 === "居中对齐") {
+    return (
+      <div className={className} data-name="字号=34px, 字重=特粗, 位置=居中对齐" data-node-id="635:42955">
+        <div className="flex flex-col font-['HarmonyOS_Sans_SC:Bold',sans-serif] justify-center leading-[0] not-italic relative shrink-0 text-[34px] text-center text-white whitespace-nowrap" data-node-id="635:42956">
+          <p className="leading-[32px]">Text line-34px</p>
+        </div>
+      </div>
+    );
+  }
+  if (propValue === "34px" && propValue1 === "特粗" && propValue2 === "右对齐") {
+    return (
+      <div className={className} data-name="字号=34px, 字重=特粗, 位置=右对齐" data-node-id="635:42959">
+        <div className="flex flex-col font-['HarmonyOS_Sans_SC:Bold',sans-serif] justify-center leading-[0] not-italic relative shrink-0 text-[34px] text-right text-white whitespace-nowrap" data-node-id="635:42960">
+          <p className="leading-[32px]">Text line-34px</p>
+        </div>
+      </div>
+    );
+  }
+  return (
+    <div className={className} data-name="字号=34px, 字重=特粗, 位置=左对齐" data-node-id="635:42949">
+      <div className="flex flex-col font-['HarmonyOS_Sans_SC:Bold',sans-serif] justify-center leading-[0] not-italic relative shrink-0 text-[34px] text-white whitespace-nowrap" data-node-id="635:42950">
+        <p className="leading-[32px]">Text line-34px</p>
+      </div>
+    </div>
+  );
+}
+
+function Component2({ className }: { className?: string }) {
+  return (
+    <div className={className} data-name="弹出框样式2" data-node-id="741:54163">
+      <div className="flex h-[calc(1px*((var(--transform-inner-width)*1)+(var(--transform-inner-height)*0)))] items-center justify-center leading-[0] relative shrink-0 w-[calc(1px*((var(--transform-inner-height)*1)+(var(--transform-inner-width)*0)))]">
+        <div className="flex-none rotate-[90deg] scale-y-[-100%]">
+          <div className="grid-cols-[max-content] grid-rows-[max-content] inline-grid justify-items-start relative" data-node-id="1207:33739">
+            <div className="col-[1] h-[80px] ml-[7.5px] mt-[17px] relative row-[1] w-[2px]" data-node-id="1207:33513">
+              <div className="absolute bottom-[-1.25%] left-0 right-[-50%] top-[-1.25%]">
+                <img alt="" className="block max-w-none size-full" src={imgGroup1597881806} />
+              </div>
+            </div>
+            <div className="col-[1] ml-0 mt-0 relative row-[1] size-[17px]" data-name="圆圈圈" data-node-id="741:53539">
+              <img alt="" className="block max-w-none size-full" src={img} />
+            </div>
+          </div>
+        </div>
+      </div>
+      <div className="h-[320px] relative shrink-0 w-[476px]" data-name="框" data-node-id="741:53541">
+        <div className="absolute inset-[-0.06%_-0.09%_-0.06%_-0.04%]">
+          <img alt="" className="block max-w-none size-full" src={img1} />
+        </div>
+      </div>
+    </div>
+  );
+}
+
+function Component({ className }: { className?: string }) {
+  return (
+    <div className={className} data-name="定位点/产业链" data-node-id="1205:31870">
+      <div className="absolute inset-[10%_13.79%]" data-name="底部" data-node-id="1201:48987">
+        <img alt="" className="block max-w-none size-full" src={img2} />
+      </div>
+      <div className="absolute bottom-[40.42%] left-1/4 overflow-clip right-1/4 shadow-[0px_0px_6px_0px_#4593ff] top-[17.92%]" data-name="产业链" data-node-id="1205:31863">
+        <div className="absolute inset-[5.36%_10.72%]" data-name="Union" data-node-id="I1205:31863;1205:31861">
+          <img alt="" className="block max-w-none size-full" src={img3} />
+        </div>
+        <div className="absolute inset-0 pointer-events-none shadow-[inset_0px_0px_3px_0px_#ffffff]" />
+      </div>
+    </div>
+  );
+}
+
+function Component1({ className }: { className?: string }) {
+  return (
+    <div className={className} data-name="定位点/基地" data-node-id="1205:31871">
+      <div className="absolute inset-[12.5%_8.66%]" data-node-id="1205:32108">
+        <img alt="" className="block max-w-none size-full" src={imgGroup1597881805} />
+      </div>
+      <div className="absolute inset-[27.5%_23%] overflow-clip" data-name="产业icon" data-node-id="1204:31851">
+        <div className="absolute inset-[13%_21.7%]" data-name="Union" data-node-id="I1204:31851;1198:61730">
+          <div className="absolute inset-[-20.02%_-26.17%]">
+            <img alt="" className="block max-w-none size-full" src={img4} />
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}
+
+function Component3({ className }: { className?: string }) {
+  return (
+    <div className={className} data-name="边" data-node-id="84:21868">
+      <img alt="" className="block max-w-none size-full" src={img5} />
+    </div>
+  );
+}
+
+function Component4({ className }: { className?: string }) {
+  return (
+    <div className={className} data-name="线" data-node-id="84:21850">
+      <div className="absolute inset-[45.14%_13.47%_22.05%_68.8%]" data-name="Union" data-node-id="84:21851">
+        <div className="absolute inset-[-0.28%_-0.28%_-0.27%_-0.35%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion} />
+        </div>
+      </div>
+      <div className="absolute inset-[69.45%_7.91%_11.34%_79.45%]" data-name="Union" data-node-id="84:21852">
+        <div className="absolute inset-[-0.36%_-0.44%_-0.33%_-0.45%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion1} />
+        </div>
+      </div>
+      <div className="absolute bottom-[58.34%] left-[13.82%] right-[58.52%] top-0" data-name="Union" data-node-id="84:21853">
+        <div className="absolute inset-[-0.16%_-0.17%_-0.16%_-0.25%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion2} />
+        </div>
+      </div>
+      <div className="absolute inset-[40.22%_52.11%_21.49%_24.35%]" data-name="Union" data-node-id="84:21854">
+        <div className="absolute inset-[-0.17%_-0.21%_-0.2%_-0.28%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion3} />
+        </div>
+      </div>
+      <div className="absolute inset-[15.1%_38.74%_51.84%_30.9%]" data-name="Union" data-node-id="84:21855">
+        <div className="absolute inset-[-0.2%_-0.17%_-0.22%_-0.17%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion4} />
+        </div>
+      </div>
+      <div className="absolute inset-[62.63%_13.38%_23.24%_79.12%]" data-name="Union" data-node-id="84:21856">
+        <div className="absolute inset-[-0.45%_-0.62%_-0.6%_-0.65%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion5} />
+        </div>
+      </div>
+      <div className="absolute inset-[39.2%_33.9%_32.16%_45.04%]" data-name="Union" data-node-id="84:21857">
+        <div className="absolute inset-[-0.26%_-0.43%_-0.35%_-0.33%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion6} />
+        </div>
+      </div>
+      <div className="absolute inset-[33.43%_19.83%_31.88%_63.81%]" data-name="Union" data-node-id="84:21858">
+        <div className="absolute inset-[-0.19%_-0.36%_-0.2%_-0.31%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion7} />
+        </div>
+      </div>
+      <div className="absolute inset-[61.63%_26.15%_9.48%_37%]" data-name="Union" data-node-id="84:21859">
+        <div className="absolute inset-[-0.27%_-0.13%_-0.27%_-0.21%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion8} />
+        </div>
+      </div>
+      <div className="absolute bottom-[16.35%] left-[77.75%] right-0 top-[39.25%]" data-name="Union" data-node-id="84:21860">
+        <div className="absolute inset-[-0.15%_-0.22%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion9} />
+        </div>
+      </div>
+      <div className="absolute bottom-0 left-[66.67%] right-[14.92%] top-[70.14%]" data-name="Union" data-node-id="84:21861">
+        <div className="absolute inset-[-0.22%_-0.27%_-0.22%_-0.26%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion10} />
+        </div>
+      </div>
+      <div className="absolute inset-[19.86%_25.75%_54.08%_56.23%]" data-name="Union" data-node-id="84:21862">
+        <div className="absolute inset-[-0.28%_-0.27%_-0.49%_-0.27%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion11} />
+        </div>
+      </div>
+      <div className="absolute bottom-[2%] left-0 right-[70.7%] top-[44.26%]" data-name="Union" data-node-id="84:21863">
+        <div className="absolute inset-[-0.12%_-0.16%_-0.14%_-0.18%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion12} />
+        </div>
+      </div>
+      <div className="absolute inset-[64.64%_29.68%_24.46%_58.95%]" data-name="Union" data-node-id="84:21864">
+        <div className="absolute inset-[-0.59%_-0.41%_-0.67%_-0.42%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion13} />
+        </div>
+      </div>
+      <div className="absolute inset-[61.94%_39.82%_24.69%_53.29%]" data-name="Union" data-node-id="84:21865">
+        <div className="absolute inset-[-0.64%_-0.74%_-0.48%_-0.82%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion14} />
+        </div>
+      </div>
+      <div className="absolute inset-[55.88%_34.28%_31.77%_54.46%]" data-name="Union" data-node-id="84:21866">
+        <div className="absolute inset-[-0.54%_-0.41%_-0.57%_-0.41%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion15} />
+        </div>
+      </div>
+      <div className="absolute inset-[33.35%_66.33%_53.33%_20.28%]" data-name="Union" data-node-id="84:21867">
+        <div className="absolute inset-[-0.55%_-0.49%_-0.53%_-0.4%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion16} />
+        </div>
+      </div>
+    </div>
+  );
+}
+type iconProps = {
+  className?: string;
+  property1?: "果蔬" | "油脂" | "种业" | "粮食";
+};
+
+function icon({ className, property1 = "粮食" }: iconProps) {
+  return (
+    <div className={className} data-name="Property 1=粮食" data-node-id="1201:31235">
+      <div className="absolute inset-[13%_21.7%]" data-name="Union" data-node-id="1198:61730">
+        <img alt="" className="block max-w-none size-full" src={imgUnion17} />
+      </div>
+    </div>
+  );
+}
+type Component5Props = {
+  className?: string;
+  property1?: "上";
+};
+
+function Component5({ className, property1 = "上" }: Component5Props) {
+  return (
+    <div className={className} data-name="Property 1=上" data-node-id="1201:48133">
+      <div className="absolute content-stretch flex flex-col gap-[40px] h-[944px] items-center justify-center left-0 right-[37.7%] top-1/2 translate-y-[-50%]" data-name="导航内容" data-node-id="1201:47870">
+        <div className="bg-[rgba(255,255,255,0.05)] box-border content-stretch flex flex-col gap-[20px] h-[220px] items-center justify-center px-[20px] py-0 relative rounded-[10px] shrink-0 w-[60px]" data-name="111" data-node-id="1201:47862">
+          <icon className="overflow-clip relative shrink-0 size-[50px]" />
+          <div className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" data-name="text" data-node-id="1201:47859">
+            <div className="flex flex-col font-['HarmonyOS_Sans_SC:Bold',sans-serif] justify-center leading-[32px] not-italic relative shrink-0 text-[26px] text-white whitespace-nowrap" data-node-id="I1201:47859;635:42944">
+              <p className="mb-0">粮</p>
+              <p className="mb-0">&nbsp;</p>
+              <p>食</p>
+            </div>
+          </div>
+        </div>
+        <div className="box-border content-stretch flex flex-col gap-[20px] h-[220px] items-center justify-center px-[20px] py-0 relative rounded-[10px] shrink-0 w-[60px]" data-name="222" data-node-id="1201:47864">
+          <div className="overflow-clip relative shrink-0 size-[50px]" data-name="产业icon" data-node-id="1201:47865">
+            <div className="absolute inset-[13%_26.2%]" data-name="Vector" data-node-id="I1201:47865;1200:31218">
+              <div className="absolute inset-0" style={{ "--fill-0": "rgba(255, 255, 255, 1)" } as React.CSSProperties}>
+                <img alt="" className="block max-w-none size-full" src={img6} />
+              </div>
+            </div>
+          </div>
+          <div className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" data-name="text" data-node-id="1201:47866">
+            <div className="flex flex-col font-['HarmonyOS_Sans_SC:Bold',sans-serif] justify-center leading-[32px] not-italic relative shrink-0 text-[26px] text-[rgba(255,255,255,0.5)] whitespace-nowrap" data-node-id="I1201:47866;635:42944">
+              <p className="mb-0">油</p>
+              <p className="mb-0">&nbsp;</p>
+              <p>脂</p>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div className="absolute bottom-0 flex items-center justify-center left-[25.05%] right-0 top-0">
+        <div className="flex-none h-[1078.893px] rotate-[180deg] scale-y-[-100%] w-[113.088px]">
+          <div className="relative size-full" data-name="光标左侧" data-node-id="1201:48121">
+            <div className="absolute bottom-[-0.04%] left-0 right-0 top-[-0.04%]">
+              <img alt="" className="block max-w-none size-full" src={img7} />
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}
+
+function Component6({ className }: { className?: string }) {
+  return (
+    <div className={className} data-name="数据样式" data-node-id="1201:47976">
+      <div className="absolute bg-gradient-to-b border-2 border-[#5e697e] border-solid from-[#474e60] inset-0 rounded-[6px] to-[#2b2f39]" data-name="11" data-node-id="1201:47971" />
+      <div className="absolute flex flex-col font-['HarmonyOS_Sans_SC:Bold',sans-serif] inset-[16.16%_13.74%] justify-center leading-[0] not-italic text-[60px] text-center text-white tracking-[6px]" data-node-id="1201:47972">
+        <p className="leading-[normal] whitespace-pre-wrap">6</p>
+      </div>
+    </div>
+  );
+}
+
+function Component7({ className }: { className?: string }) {
+  return (
+    <div className={className} data-name="导航底框" data-node-id="631:36462">
+      <div className="absolute bottom-[18.95%] left-0 right-0 top-0" data-name="1" data-node-id="631:36440">
+        <div className="absolute inset-[-181.3%_-19.68%_-413.77%_-19.68%]">
+          <img alt="" className="block max-w-none size-full" src={img8} />
+        </div>
+      </div>
+      <div className="absolute bottom-0 left-[27.44%] right-[27.44%] top-[62.9%]" data-node-id="631:36441">
+        <div className="absolute inset-[-257.75%_-17.4%]">
+          <img alt="" className="block max-w-none size-full" src={imgGroup1158} />
+        </div>
+      </div>
+    </div>
+  );
+}
+
+function Component8({ className }: { className?: string }) {
+  return (
+    <div className={className} data-name="底部网格" data-node-id="631:69869">
+      <div className="absolute bottom-[-71.42%] content-stretch flex flex-col items-start left-0 mask-alpha mask-intersect mask-no-clip mask-no-repeat mask-position-[0px_175.624px] mask-size-[1920px_1080px] right-0 top-[-16.26%]" data-name="底部内容" data-node-id="631:69865" style={{ maskImage: `url('${img9}')` }}>
+        <div className="h-[1013.464px] relative shrink-0 w-[1920px]" data-name="网格" data-node-id="631:69866">
+          <img alt="" className="block max-w-none size-full" src={img10} />
+        </div>
+        <div className="h-[1013.464px] relative shrink-0 w-[1920px]" data-name="网格" data-node-id="631:69867">
+          <img alt="" className="block max-w-none size-full" src={img10} />
+        </div>
+      </div>
+    </div>
+  );
+}
+type Component9Props = {
+  className?: string;
+  property1?: "供应链专用界面";
+};
+
+function Component9({ className, property1 = "供应链专用界面" }: Component9Props) {
+  return (
+    <div className={className} data-name="Property 1=供应链专用界面" data-node-id="1486:134453">
+      <div aria-hidden="true" className="absolute inset-0 pointer-events-none">
+        <img alt="" className="absolute max-w-none object-50%-50% object-cover size-full" src={imgProperty1} />
+        <div className="absolute bg-[rgba(0,79,154,0.1)] inset-0" />
+      </div>
+      <div className="absolute contents left-0 top-0" data-node-id="1486:133993" />
+    </div>
+  );
+}
+
+export default function Component10() {
+  return (
+    <div className="bg-[rgba(33,33,33,0.6)] relative size-full" data-name="操控屏-2-种业•果蔬-果蔬首页-产业链企业弹出数据" data-node-id="1443:70583">
+      <div className="absolute contents left-0 top-0" data-name="我是底部" data-node-id="I1443:70583;1412:183688">
+        <Component9 className="absolute h-[1080px] left-0 overflow-clip top-0 w-[1920px]" />
+        <Component8 className="absolute h-[1080px] left-0 top-0 w-[1920px]" />
+        <Component7 className="absolute h-[71.119px] left-[526.95px] top-[40px] w-[866.265px]" />
+        <Text className="absolute box-border content-stretch flex gap-[10px] items-center justify-center left-1/2 px-0 py-[4px] top-[40px] translate-x-[-50%]" propValue2="居中对齐" />
+      </div>
+      <div className="absolute content-stretch flex flex-col gap-[10px] items-end right-[80px] top-[150px]" data-name="1+！" data-node-id="I1443:70583;1412:183706">
+        <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
+        <Text className="box-border content-stretch flex gap-[10px] h-[77px] items-center justify-end px-0 py-[4px] relative shrink-0 w-full" propValue2="右对齐" />
+        <Text className="box-border content-stretch flex gap-[10px] items-center justify-end px-0 py-[4px] relative shrink-0" propValue2="右对齐" />
+      </div>
+      <div className="absolute content-stretch flex flex-col gap-[11px] items-start left-[199.88px] top-[148.52px] w-[330px]" data-name="组合1" data-node-id="I1443:70583;1412:189889">
+        <Text className="box-border content-stretch flex gap-[10px] h-[80px] items-center px-[26px] py-[4px] relative shrink-0 w-full" />
+        <div className="grid-cols-[max-content] grid-rows-[max-content] inline-grid justify-items-start leading-[0] relative shrink-0" data-name="框框数据1" data-node-id="I1443:70583;1412:189891">
+          <div className="box-border col-[1] content-stretch flex flex-col h-[700px] items-center justify-between ml-0 mt-0 px-0 py-[20px] relative row-[1] w-[330px]" data-node-id="I1443:70583;1412:189893">
+            <div className="box-border content-stretch flex flex-col gap-[20px] items-start px-0 py-[20px] relative shrink-0 w-[278px]" data-name="总产值达" data-node-id="I1443:70583;1412:189894">
+              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0 w-full" />
+              <div className="content-stretch flex gap-[10px] h-[80px] items-end relative shrink-0 w-full" data-name="数据金额" data-node-id="I1443:70583;1412:189896">
+                <div className="content-stretch flex gap-[6px] items-center relative shrink-0" data-name="1" data-node-id="I1443:70583;1412:189897">
+                  <Component6 className="h-[80px] relative shrink-0 w-[53.333px]" />
+                  <Component6 className="h-[80px] relative shrink-0 w-[53.333px]" />
+                  <Component6 className="h-[80px] relative shrink-0 w-[53.333px]" />
+                  <Component6 className="h-[80px] relative shrink-0 w-[53.333px]" />
+                </div>
+                <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
+              </div>
+            </div>
+            <div className="box-border content-stretch flex flex-col gap-[20px] items-start px-0 py-[20px] relative shrink-0 w-[278px]" data-name="总产值达" data-node-id="I1443:70583;1412:189909">
+              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0 w-full" />
+              <div className="content-stretch flex gap-[10px] h-[80px] items-end relative shrink-0 w-full" data-name="数据金额" data-node-id="I1443:70583;1412:189911">
+                <div className="content-stretch flex gap-[6px] items-center relative shrink-0" data-name="1" data-node-id="I1443:70583;1412:189912">
+                  <Component6 className="h-[80px] relative shrink-0 w-[53.333px]" />
+                </div>
+                <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
+              </div>
+            </div>
+            <div className="box-border content-stretch flex flex-col gap-[20px] items-start px-0 py-[20px] relative shrink-0 w-[278px]" data-name="总产值达" data-node-id="I1443:70583;1412:189923">
+              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0 w-full" />
+              <div className="content-stretch flex gap-[10px] h-[80px] items-end relative shrink-0 w-full" data-name="数据金额" data-node-id="I1443:70583;1412:189925">
+                <div className="content-stretch flex gap-[6px] items-center relative shrink-0" data-name="1" data-node-id="I1443:70583;1412:189926">
+                  <Component6 className="h-[80px] relative shrink-0 w-[53.333px]" />
+                  <Component6 className="h-[80px] relative shrink-0 w-[53.333px]" />
+                </div>
+                <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+      <Component5 className="absolute h-[1078.893px] left-[40px] top-[0.43px] w-[150.879px]" />
+      <div className="absolute contents left-[529.88px] top-[calc(50%+33.79px)] translate-y-[-50%]" data-name="地图" data-node-id="I1443:70583;1412:189560">
+        <div className="absolute contents left-[27.6%] right-[4.17%] top-[calc(50%+33.79px)] translate-y-[-50%]" data-name="地图" data-node-id="I1443:70583;1412:189561">
+          <Component4 className="absolute inset-[19.27%_4.17%_13.01%_27.6%]" />
+          <Component3 className="absolute h-[731.454px] left-[27.6%] right-[4.17%] top-[calc(50%+33.79px)] translate-y-[-50%]" />
+        </div>
+        <Component1 className="absolute h-[48px] left-[985px] top-[610.22px] w-[40px]" />
+        <Component1 className="absolute h-[48px] left-[1125.81px] top-[409.52px] w-[40px]" />
+        <Component1 className="absolute h-[48px] left-[1229.57px] top-[570px] w-[40px]" />
+        <Component1 className="absolute h-[48px] left-[1445px] top-[560.35px] w-[40px]" />
+        <Component className="absolute h-[48px] left-[949.08px] top-[680.31px] w-[40px]" />
+        <Component className="absolute h-[48px] left-[1178.36px] top-[418.4px] w-[40px]" />
+        <Component className="absolute h-[48px] left-[1307.42px] top-[551.47px] w-[40px]" />
+        <Component className="absolute h-[48px] left-[1403.37px] top-[603.77px] w-[40px]" />
+      </div>
+      <div className="absolute bottom-[80px] content-stretch flex items-center left-1/2 translate-x-[-50%]" data-name="说明" data-node-id="I1443:70583;1412:189572">
+        <div className="box-border content-stretch flex gap-[20px] h-[54px] items-center justify-center px-[20px] py-0 relative rounded-[10px] shrink-0 w-[202px]" data-name="111" data-node-id="I1443:70583;1412:189573">
+          <Component1 className="h-[50px] relative shrink-0 w-[41.667px]" />
+          <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="26px" />
+        </div>
+        <div className="box-border content-stretch flex gap-[20px] h-[54px] items-center justify-center px-[20px] py-0 relative rounded-[10px] shrink-0 w-[202px]" data-name="112" data-node-id="I1443:70583;1412:189576">
+          <Component className="h-[50px] relative shrink-0 w-[41.667px]" />
+          <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="26px" />
+        </div>
+      </div>
+      <div className="absolute h-[351px] left-[757.42px] overflow-clip top-[398.91px] w-[580px]" data-name="基地弹出框" data-node-id="I1443:70583;1412:183765">
+        <div className="absolute flex items-center justify-center left-0 top-0">
+          <div className="flex-none rotate-[180deg] scale-y-[-100%]">
+            <Component2 className="content-stretch flex items-start overflow-clip relative" />
+          </div>
+        </div>
+        <div className="absolute content-stretch flex flex-col gap-[12px] items-center left-[29.94px] top-[calc(50%+-31.5px)] translate-y-[-50%] w-[420px]" data-name="粮食源头" data-node-id="I1443:70583;1700:135040">
+          <div className="content-stretch flex flex-col gap-[12px] items-start relative shrink-0 w-full" data-node-id="I1443:70583;1700:135041">
+            <Text className="box-border content-stretch flex gap-[10px] h-[62px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
+            <Text className="box-border content-stretch flex gap-[10px] h-[62px] items-center px-0 py-[4px] relative shrink-0 w-full" propValue="24px" />
+          </div>
+          <div className="content-stretch flex flex-col gap-[12px] items-start relative shrink-0 w-full" data-node-id="I1443:70583;1700:135044">
+            <div className="content-stretch flex gap-[20px] items-start relative shrink-0" data-node-id="I1443:70583;1700:135045">
+              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
+              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" />
+              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}
+```
+SUPER CRITICAL: The generated React+Tailwind code MUST be converted to match the target project's technology stack and styling system.
+1. Analyze the target codebase to identify: technology stack, styling approach, component patterns, and design tokens
+2. Convert React syntax to the target framework/library
+3. Transform all Tailwind classes to the target styling system while preserving exact visual design
+4. Follow the project's existing patterns and conventions
+DO NOT install any Tailwind as a dependency unless the user instructs you to do so.
+
+Node ids have been added to the code as data attributes, e.g. `data-node-id="1:2"`.
+These styles are contained in the design: 文字颜色/2-100%白色: #FFFFFF, 文字颜色/3-50%白色: #FFFFFF, 渐变/2-蓝色: , 主色/主色-2亮绿: #00FFFF, 主色/产业-果蔬: #FFF586, 边框-蓝色: #133BA0, 主色/icon色: .
+Images and SVGs will be stored as constants, e.g. const image = 'https://www.figma.com/api/mcp/asset/550e8400-e29b-41d4-a716-446655440000'. These constants will be used in the code as the source for the image, ex: <img src={image} />. Image assets are stored on a remote server for 7 days and can be fetched using the provided URLs until they expire.
+IMPORTANT: After you call this tool, you MUST call get_screenshot to get a screenshot of the node for context.

docs/figma-jsx/水产.md

@@ -0,0 +1,474 @@
+const imgProperty1 = "https://www.figma.com/api/mcp/asset/f3377c33-0ff1-436b-838d-594033d07972";
+const imgUnion = "https://www.figma.com/api/mcp/asset/994fe03b-ebc5-4880-b4b6-4e8ad57171c5";
+const img = "https://www.figma.com/api/mcp/asset/38abd39c-8cec-403f-abeb-ee27d6d32de4";
+const img1 = "https://www.figma.com/api/mcp/asset/a2240274-1b5d-4e1b-9388-4045465804ac";
+const imgGroup1597881806 = "https://www.figma.com/api/mcp/asset/fc6fc6d7-c3c5-49ea-a332-f440130ee2c4";
+const img2 = "https://www.figma.com/api/mcp/asset/2b8e86e0-2467-4508-bab4-8fc00fc8f151";
+const img3 = "https://www.figma.com/api/mcp/asset/152fa4e0-b458-4058-81fc-5e8d9daf4990";
+const img4 = "https://www.figma.com/api/mcp/asset/29deeafc-056d-44fc-8be6-838a60faebe6";
+const img5 = "https://www.figma.com/api/mcp/asset/20500f82-a7ad-49ab-915b-882037ca7f69";
+const imgGroup1597881805 = "https://www.figma.com/api/mcp/asset/2c842a15-164d-4664-a7f5-e53b057b6733";
+const img6 = "https://www.figma.com/api/mcp/asset/d039acbd-93cf-411e-a901-1284ff2bb186";
+const img7 = "https://www.figma.com/api/mcp/asset/990911a4-f2be-4844-b331-4ac59c04af9f";
+const imgUnion1 = "https://www.figma.com/api/mcp/asset/0dc58639-4b1e-41c5-a198-a3066e4b35c7";
+const imgUnion2 = "https://www.figma.com/api/mcp/asset/ad215a2f-1527-4351-ac87-0bc05a1e05bb";
+const imgUnion3 = "https://www.figma.com/api/mcp/asset/26bdab1f-81f7-427b-ba05-e98dcdf1a991";
+const imgUnion4 = "https://www.figma.com/api/mcp/asset/bd854808-764d-4e15-9355-23b2bf80e218";
+const imgUnion5 = "https://www.figma.com/api/mcp/asset/68466a05-d3cb-4bad-a693-6bef86a49b29";
+const imgUnion6 = "https://www.figma.com/api/mcp/asset/2ea9d2b3-86cf-417a-8480-9810591ee66a";
+const imgUnion7 = "https://www.figma.com/api/mcp/asset/4c83f696-72e9-48e1-933c-ccd08ac60423";
+const imgUnion8 = "https://www.figma.com/api/mcp/asset/1b2c4df0-65a7-49b2-b771-b05ce0dc1ea2";
+const imgUnion9 = "https://www.figma.com/api/mcp/asset/9aac283f-d45b-4282-9a76-063b1f4011e0";
+const imgUnion10 = "https://www.figma.com/api/mcp/asset/389535d1-24ed-4ca0-a78e-cc9b8c3a7c89";
+const imgUnion11 = "https://www.figma.com/api/mcp/asset/2d2e8a51-f9ed-4cd5-a9ac-6af9760f7490";
+const imgUnion12 = "https://www.figma.com/api/mcp/asset/0876e78e-ac63-4029-b2dc-fde323a3723c";
+const imgUnion13 = "https://www.figma.com/api/mcp/asset/92c6c86f-2592-437f-aaa7-1f0424dc52df";
+const imgUnion14 = "https://www.figma.com/api/mcp/asset/bbad0d73-b55d-46de-8540-756c6b22b702";
+const imgUnion15 = "https://www.figma.com/api/mcp/asset/6fc3fcbd-1844-442c-80c8-5272453b0187";
+const imgUnion16 = "https://www.figma.com/api/mcp/asset/ea7ff6bd-69fd-4fba-b6a6-1b8ed76314c1";
+const imgUnion17 = "https://www.figma.com/api/mcp/asset/a2a5a65d-aa51-47fa-a6fc-d5afd5753b19";
+const img8 = "https://www.figma.com/api/mcp/asset/0c1e0d67-5d1d-4051-af49-de8e15a45773";
+const imgGroup1158 = "https://www.figma.com/api/mcp/asset/eb79bced-5c6a-4bfc-ae94-04c4e19641b8";
+const img9 = "https://www.figma.com/api/mcp/asset/af9304fe-855a-4dea-9454-b3293f55661f";
+const img10 = "https://www.figma.com/api/mcp/asset/14771528-5792-4155-8ea8-596c262f4378";
+type iconProps = {
+  className?: string;
+  property1?: "水产" | "油脂" | "畜牧" | "粮食";
+};
+
+function icon({ className, property1 = "粮食" }: iconProps) {
+  return (
+    <div className={className} data-name="Property 1=粮食" data-node-id="1201:31235">
+      <div className="absolute inset-[13%_21.7%]" data-name="Union" data-node-id="1198:61730">
+        <img alt="" className="block max-w-none size-full" src={imgUnion} />
+      </div>
+    </div>
+  );
+}
+type ComponentProps = {
+  className?: string;
+  property1?: "上";
+};
+
+function Component({ className, property1 = "上" }: ComponentProps) {
+  return (
+    <div className={className} data-name="Property 1=上" data-node-id="1201:48133">
+      <div className="absolute content-stretch flex flex-col gap-[40px] h-[944px] items-center justify-center left-0 right-[37.7%] top-1/2 translate-y-[-50%]" data-name="导航内容" data-node-id="1201:47870">
+        <div className="bg-[rgba(255,255,255,0.05)] box-border content-stretch flex flex-col gap-[20px] h-[220px] items-center justify-center px-[20px] py-0 relative rounded-[10px] shrink-0 w-[60px]" data-name="111" data-node-id="1201:47862">
+          <icon className="overflow-clip relative shrink-0 size-[50px]" />
+          <div className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" data-name="text" data-node-id="1201:47859">
+            <div className="flex flex-col font-['HarmonyOS_Sans_SC:Bold',sans-serif] justify-center leading-[32px] not-italic relative shrink-0 text-[26px] text-white whitespace-nowrap" data-node-id="I1201:47859;635:42944">
+              <p className="mb-0">粮</p>
+              <p className="mb-0">&nbsp;</p>
+              <p>食</p>
+            </div>
+          </div>
+        </div>
+        <div className="box-border content-stretch flex flex-col gap-[20px] h-[220px] items-center justify-center px-[20px] py-0 relative rounded-[10px] shrink-0 w-[60px]" data-name="222" data-node-id="1201:47864">
+          <div className="overflow-clip relative shrink-0 size-[50px]" data-name="产业icon" data-node-id="1201:47865">
+            <div className="absolute inset-[13%_26.2%]" data-name="Vector" data-node-id="I1201:47865;1200:31218">
+              <div className="absolute inset-0" style={{ "--fill-0": "rgba(255, 255, 255, 1)" } as React.CSSProperties}>
+                <img alt="" className="block max-w-none size-full" src={img} />
+              </div>
+            </div>
+          </div>
+          <div className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" data-name="text" data-node-id="1201:47866">
+            <div className="flex flex-col font-['HarmonyOS_Sans_SC:Bold',sans-serif] justify-center leading-[32px] not-italic relative shrink-0 text-[26px] text-[rgba(255,255,255,0.5)] whitespace-nowrap" data-node-id="I1201:47866;635:42944">
+              <p className="mb-0">油</p>
+              <p className="mb-0">&nbsp;</p>
+              <p>脂</p>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div className="absolute bottom-0 flex items-center justify-center left-[25.05%] right-0 top-0">
+        <div className="flex-none h-[1078.893px] rotate-[180deg] scale-y-[-100%] w-[113.088px]">
+          <div className="relative size-full" data-name="光标左侧" data-node-id="1201:48121">
+            <div className="absolute bottom-[-0.04%] left-0 right-0 top-[-0.04%]">
+              <img alt="" className="block max-w-none size-full" src={img1} />
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}
+type TextProps = {
+  className?: string;
+  propValue?: "24px" | "26px" | "34px";
+  propValue1?: "特粗";
+  propValue2?: "左对齐" | "右对齐" | "居中对齐";
+};
+
+function Text({ className, propValue = "34px", propValue1 = "特粗", propValue2 = "左对齐" }: TextProps) {
+  if (propValue === "24px" && propValue1 === "特粗" && propValue2 === "左对齐") {
+    return (
+      <div className={className} data-name="字号=24px, 字重=特粗, 位置=左对齐" data-node-id="632:88182">
+        <div className="flex flex-col font-['HarmonyOS_Sans_SC:Bold',sans-serif] justify-center leading-[0] not-italic relative shrink-0 text-[24px] text-white whitespace-nowrap" data-node-id="632:88183">
+          <p className="leading-[32px]">Text line-24px</p>
+        </div>
+      </div>
+    );
+  }
+  if (propValue === "26px" && propValue1 === "特粗" && propValue2 === "左对齐") {
+    return (
+      <div className={className} data-name="字号=26px, 字重=特粗, 位置=左对齐" data-node-id="635:42943">
+        <div className="flex flex-col font-['HarmonyOS_Sans_SC:Bold',sans-serif] justify-center leading-[0] not-italic relative shrink-0 text-[26px] text-white whitespace-nowrap" data-node-id="635:42944">
+          <p className="leading-[32px]">Text line-26px</p>
+        </div>
+      </div>
+    );
+  }
+  if (propValue === "34px" && propValue1 === "特粗" && propValue2 === "居中对齐") {
+    return (
+      <div className={className} data-name="字号=34px, 字重=特粗, 位置=居中对齐" data-node-id="635:42955">
+        <div className="flex flex-col font-['HarmonyOS_Sans_SC:Bold',sans-serif] justify-center leading-[0] not-italic relative shrink-0 text-[34px] text-center text-white whitespace-nowrap" data-node-id="635:42956">
+          <p className="leading-[32px]">Text line-34px</p>
+        </div>
+      </div>
+    );
+  }
+  if (propValue === "34px" && propValue1 === "特粗" && propValue2 === "右对齐") {
+    return (
+      <div className={className} data-name="字号=34px, 字重=特粗, 位置=右对齐" data-node-id="635:42959">
+        <div className="flex flex-col font-['HarmonyOS_Sans_SC:Bold',sans-serif] justify-center leading-[0] not-italic relative shrink-0 text-[34px] text-right text-white whitespace-nowrap" data-node-id="635:42960">
+          <p className="leading-[32px]">Text line-34px</p>
+        </div>
+      </div>
+    );
+  }
+  return (
+    <div className={className} data-name="字号=34px, 字重=特粗, 位置=左对齐" data-node-id="635:42949">
+      <div className="flex flex-col font-['HarmonyOS_Sans_SC:Bold',sans-serif] justify-center leading-[0] not-italic relative shrink-0 text-[34px] text-white whitespace-nowrap" data-node-id="635:42950">
+        <p className="leading-[32px]">Text line-34px</p>
+      </div>
+    </div>
+  );
+}
+
+function Component1({ className }: { className?: string }) {
+  return (
+    <div className={className} data-name="数据样式" data-node-id="1201:47976">
+      <div className="absolute bg-gradient-to-b border-2 border-[#5e697e] border-solid from-[#474e60] inset-0 rounded-[6px] to-[#2b2f39]" data-name="11" data-node-id="1201:47971" />
+      <div className="absolute flex flex-col font-['HarmonyOS_Sans_SC:Bold',sans-serif] inset-[16.16%_13.74%] justify-center leading-[0] not-italic text-[60px] text-center text-white tracking-[6px]" data-node-id="1201:47972">
+        <p className="leading-[normal] whitespace-pre-wrap">6</p>
+      </div>
+    </div>
+  );
+}
+
+function Component2({ className }: { className?: string }) {
+  return (
+    <div className={className} data-name="弹出框样式2" data-node-id="741:54163">
+      <div className="flex h-[calc(1px*((var(--transform-inner-width)*1)+(var(--transform-inner-height)*0)))] items-center justify-center leading-[0] relative shrink-0 w-[calc(1px*((var(--transform-inner-height)*1)+(var(--transform-inner-width)*0)))]">
+        <div className="flex-none rotate-[90deg] scale-y-[-100%]">
+          <div className="grid-cols-[max-content] grid-rows-[max-content] inline-grid justify-items-start relative" data-node-id="1207:33739">
+            <div className="col-[1] h-[80px] ml-[7.5px] mt-[17px] relative row-[1] w-[2px]" data-node-id="1207:33513">
+              <div className="absolute bottom-[-1.25%] left-0 right-[-50%] top-[-1.25%]">
+                <img alt="" className="block max-w-none size-full" src={imgGroup1597881806} />
+              </div>
+            </div>
+            <div className="col-[1] ml-0 mt-0 relative row-[1] size-[17px]" data-name="圆圈圈" data-node-id="741:53539">
+              <img alt="" className="block max-w-none size-full" src={img2} />
+            </div>
+          </div>
+        </div>
+      </div>
+      <div className="h-[320px] relative shrink-0 w-[476px]" data-name="框" data-node-id="741:53541">
+        <div className="absolute inset-[-0.06%_-0.09%_-0.06%_-0.04%]">
+          <img alt="" className="block max-w-none size-full" src={img3} />
+        </div>
+      </div>
+    </div>
+  );
+}
+
+function Component3({ className }: { className?: string }) {
+  return (
+    <div className={className} data-name="定位点/产业链" data-node-id="1205:31870">
+      <div className="absolute inset-[10%_13.79%]" data-name="底部" data-node-id="1201:48987">
+        <img alt="" className="block max-w-none size-full" src={img4} />
+      </div>
+      <div className="absolute bottom-[40.42%] left-1/4 overflow-clip right-1/4 shadow-[0px_0px_6px_0px_#4593ff] top-[17.92%]" data-name="产业链" data-node-id="1205:31863">
+        <div className="absolute inset-[5.36%_10.72%]" data-name="Union" data-node-id="I1205:31863;1205:31861">
+          <img alt="" className="block max-w-none size-full" src={img5} />
+        </div>
+        <div className="absolute inset-0 pointer-events-none shadow-[inset_0px_0px_3px_0px_#ffffff]" />
+      </div>
+    </div>
+  );
+}
+
+function Component4({ className }: { className?: string }) {
+  return (
+    <div className={className} data-name="定位点/基地" data-node-id="1205:31871">
+      <div className="absolute inset-[12.5%_8.66%]" data-node-id="1205:32108">
+        <img alt="" className="block max-w-none size-full" src={imgGroup1597881805} />
+      </div>
+      <div className="absolute inset-[27.5%_23%] overflow-clip" data-name="产业icon" data-node-id="1204:31851">
+        <div className="absolute inset-[13%_21.7%]" data-name="Union" data-node-id="I1204:31851;1198:61730">
+          <div className="absolute inset-[-20.02%_-26.17%]">
+            <img alt="" className="block max-w-none size-full" src={img6} />
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}
+
+function Component5({ className }: { className?: string }) {
+  return (
+    <div className={className} data-name="边" data-node-id="84:21868">
+      <img alt="" className="block max-w-none size-full" src={img7} />
+    </div>
+  );
+}
+
+function Component6({ className }: { className?: string }) {
+  return (
+    <div className={className} data-name="线" data-node-id="84:21850">
+      <div className="absolute inset-[45.14%_13.47%_22.05%_68.8%]" data-name="Union" data-node-id="84:21851">
+        <div className="absolute inset-[-0.28%_-0.28%_-0.27%_-0.35%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion1} />
+        </div>
+      </div>
+      <div className="absolute inset-[69.45%_7.91%_11.34%_79.45%]" data-name="Union" data-node-id="84:21852">
+        <div className="absolute inset-[-0.36%_-0.44%_-0.33%_-0.45%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion2} />
+        </div>
+      </div>
+      <div className="absolute bottom-[58.34%] left-[13.82%] right-[58.52%] top-0" data-name="Union" data-node-id="84:21853">
+        <div className="absolute inset-[-0.16%_-0.17%_-0.16%_-0.25%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion3} />
+        </div>
+      </div>
+      <div className="absolute inset-[40.22%_52.11%_21.49%_24.35%]" data-name="Union" data-node-id="84:21854">
+        <div className="absolute inset-[-0.17%_-0.21%_-0.2%_-0.28%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion4} />
+        </div>
+      </div>
+      <div className="absolute inset-[15.1%_38.74%_51.84%_30.9%]" data-name="Union" data-node-id="84:21855">
+        <div className="absolute inset-[-0.2%_-0.17%_-0.22%_-0.17%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion5} />
+        </div>
+      </div>
+      <div className="absolute inset-[62.63%_13.38%_23.24%_79.12%]" data-name="Union" data-node-id="84:21856">
+        <div className="absolute inset-[-0.45%_-0.62%_-0.6%_-0.65%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion6} />
+        </div>
+      </div>
+      <div className="absolute inset-[39.2%_33.9%_32.16%_45.04%]" data-name="Union" data-node-id="84:21857">
+        <div className="absolute inset-[-0.26%_-0.43%_-0.35%_-0.33%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion7} />
+        </div>
+      </div>
+      <div className="absolute inset-[33.43%_19.83%_31.88%_63.81%]" data-name="Union" data-node-id="84:21858">
+        <div className="absolute inset-[-0.19%_-0.36%_-0.2%_-0.31%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion8} />
+        </div>
+      </div>
+      <div className="absolute inset-[61.63%_26.15%_9.48%_37%]" data-name="Union" data-node-id="84:21859">
+        <div className="absolute inset-[-0.27%_-0.13%_-0.27%_-0.21%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion9} />
+        </div>
+      </div>
+      <div className="absolute bottom-[16.35%] left-[77.75%] right-0 top-[39.25%]" data-name="Union" data-node-id="84:21860">
+        <div className="absolute inset-[-0.15%_-0.22%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion10} />
+        </div>
+      </div>
+      <div className="absolute bottom-0 left-[66.67%] right-[14.92%] top-[70.14%]" data-name="Union" data-node-id="84:21861">
+        <div className="absolute inset-[-0.22%_-0.27%_-0.22%_-0.26%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion11} />
+        </div>
+      </div>
+      <div className="absolute inset-[19.86%_25.75%_54.08%_56.23%]" data-name="Union" data-node-id="84:21862">
+        <div className="absolute inset-[-0.28%_-0.27%_-0.49%_-0.27%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion12} />
+        </div>
+      </div>
+      <div className="absolute bottom-[2%] left-0 right-[70.7%] top-[44.26%]" data-name="Union" data-node-id="84:21863">
+        <div className="absolute inset-[-0.12%_-0.16%_-0.14%_-0.18%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion13} />
+        </div>
+      </div>
+      <div className="absolute inset-[64.64%_29.68%_24.46%_58.95%]" data-name="Union" data-node-id="84:21864">
+        <div className="absolute inset-[-0.59%_-0.41%_-0.67%_-0.42%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion14} />
+        </div>
+      </div>
+      <div className="absolute inset-[61.94%_39.82%_24.69%_53.29%]" data-name="Union" data-node-id="84:21865">
+        <div className="absolute inset-[-0.64%_-0.74%_-0.48%_-0.82%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion15} />
+        </div>
+      </div>
+      <div className="absolute inset-[55.88%_34.28%_31.77%_54.46%]" data-name="Union" data-node-id="84:21866">
+        <div className="absolute inset-[-0.54%_-0.41%_-0.57%_-0.41%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion16} />
+        </div>
+      </div>
+      <div className="absolute inset-[33.35%_66.33%_53.33%_20.28%]" data-name="Union" data-node-id="84:21867">
+        <div className="absolute inset-[-0.55%_-0.49%_-0.53%_-0.4%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion17} />
+        </div>
+      </div>
+    </div>
+  );
+}
+
+function Component7({ className }: { className?: string }) {
+  return (
+    <div className={className} data-name="导航底框" data-node-id="631:36462">
+      <div className="absolute bottom-[18.95%] left-0 right-0 top-0" data-name="1" data-node-id="631:36440">
+        <div className="absolute inset-[-181.3%_-19.68%_-413.77%_-19.68%]">
+          <img alt="" className="block max-w-none size-full" src={img8} />
+        </div>
+      </div>
+      <div className="absolute bottom-0 left-[27.44%] right-[27.44%] top-[62.9%]" data-node-id="631:36441">
+        <div className="absolute inset-[-257.75%_-17.4%]">
+          <img alt="" className="block max-w-none size-full" src={imgGroup1158} />
+        </div>
+      </div>
+    </div>
+  );
+}
+
+function Component8({ className }: { className?: string }) {
+  return (
+    <div className={className} data-name="底部网格" data-node-id="631:69869">
+      <div className="absolute bottom-[-71.42%] content-stretch flex flex-col items-start left-0 mask-alpha mask-intersect mask-no-clip mask-no-repeat mask-position-[0px_175.624px] mask-size-[1920px_1080px] right-0 top-[-16.26%]" data-name="底部内容" data-node-id="631:69865" style={{ maskImage: `url('${img9}')` }}>
+        <div className="h-[1013.464px] relative shrink-0 w-[1920px]" data-name="网格" data-node-id="631:69866">
+          <img alt="" className="block max-w-none size-full" src={img10} />
+        </div>
+        <div className="h-[1013.464px] relative shrink-0 w-[1920px]" data-name="网格" data-node-id="631:69867">
+          <img alt="" className="block max-w-none size-full" src={img10} />
+        </div>
+      </div>
+    </div>
+  );
+}
+type Component9Props = {
+  className?: string;
+  property1?: "供应链专用界面";
+};
+
+function Component9({ className, property1 = "供应链专用界面" }: Component9Props) {
+  return (
+    <div className={className} data-name="Property 1=供应链专用界面" data-node-id="1486:134453">
+      <div aria-hidden="true" className="absolute inset-0 pointer-events-none">
+        <img alt="" className="absolute max-w-none object-50%-50% object-cover size-full" src={imgProperty1} />
+        <div className="absolute bg-[rgba(0,79,154,0.1)] inset-0" />
+      </div>
+      <div className="absolute contents left-0 top-0" data-node-id="1486:133993" />
+    </div>
+  );
+}
+
+export default function Component10() {
+  return (
+    <div className="bg-[rgba(33,33,33,0.6)] relative size-full" data-name="操控屏-3-畜牧•水产-水产首页-基地弹出数据" data-node-id="1443:76051">
+      <div className="absolute contents left-0 top-0" data-name="我是底部" data-node-id="I1443:76051;1412:190478">
+        <Component9 className="absolute h-[1080px] left-0 overflow-clip top-0 w-[1920px]" />
+        <Component8 className="absolute h-[1080px] left-0 top-0 w-[1920px]" />
+        <Component7 className="absolute h-[71.119px] left-[526.95px] top-[40px] w-[866.265px]" />
+        <Text className="absolute box-border content-stretch flex gap-[10px] items-center justify-center left-1/2 px-0 py-[4px] top-[40px] translate-x-[-50%]" propValue2="居中对齐" />
+      </div>
+      <div className="absolute content-stretch flex flex-col gap-[10px] items-end right-[80px] top-[150px]" data-name="1+！" data-node-id="I1443:76051;1412:190484">
+        <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
+        <Text className="box-border content-stretch flex gap-[10px] h-[77px] items-center justify-end px-0 py-[4px] relative shrink-0 w-full" propValue2="右对齐" />
+        <Text className="box-border content-stretch flex gap-[10px] items-center justify-end px-0 py-[4px] relative shrink-0" propValue2="右对齐" />
+      </div>
+      <div className="absolute contents left-[529.88px] top-[calc(50%+33.79px)] translate-y-[-50%]" data-name="地图" data-node-id="I1443:76051;1412:196080">
+        <div className="absolute contents left-[27.6%] right-[4.17%] top-[calc(50%+33.79px)] translate-y-[-50%]" data-name="地图" data-node-id="I1443:76051;1412:196081">
+          <Component6 className="absolute inset-[19.27%_4.17%_13.01%_27.6%]" />
+          <Component5 className="absolute h-[731.454px] left-[27.6%] right-[4.17%] top-[calc(50%+33.79px)] translate-y-[-50%]" />
+        </div>
+        <Component4 className="absolute h-[48px] left-[985px] top-[610.22px] w-[40px]" />
+        <Component4 className="absolute h-[48px] left-[1125.81px] top-[409.52px] w-[40px]" />
+        <Component4 className="absolute h-[48px] left-[1229.57px] top-[570px] w-[40px]" />
+        <Component4 className="absolute h-[48px] left-[1445px] top-[560.35px] w-[40px]" />
+        <Component3 className="absolute h-[48px] left-[949.08px] top-[680.31px] w-[40px]" />
+        <Component3 className="absolute h-[48px] left-[1178.36px] top-[418.4px] w-[40px]" />
+        <Component3 className="absolute h-[48px] left-[1307.42px] top-[551.47px] w-[40px]" />
+        <Component3 className="absolute h-[48px] left-[1403.37px] top-[603.77px] w-[40px]" />
+      </div>
+      <div className="absolute bottom-[80px] content-stretch flex items-center left-1/2 translate-x-[-50%]" data-name="说明" data-node-id="I1443:76051;1412:196092">
+        <div className="box-border content-stretch flex gap-[20px] h-[54px] items-center justify-center px-[20px] py-0 relative rounded-[10px] shrink-0 w-[202px]" data-name="111" data-node-id="I1443:76051;1412:196093">
+          <Component4 className="h-[50px] relative shrink-0 w-[41.667px]" />
+          <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="26px" />
+        </div>
+        <div className="box-border content-stretch flex gap-[20px] h-[54px] items-center justify-center px-[20px] py-0 relative rounded-[10px] shrink-0 w-[202px]" data-name="112" data-node-id="I1443:76051;1412:196096">
+          <Component3 className="h-[50px] relative shrink-0 w-[41.667px]" />
+          <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="26px" />
+        </div>
+      </div>
+      <div className="absolute h-[351px] left-[757.42px] overflow-clip top-[398.91px] w-[580px]" data-name="基地弹出框" data-node-id="I1443:76051;1412:190556">
+        <div className="absolute bottom-0 flex items-center justify-center left-0">
+          <div className="flex-none rotate-[180deg] scale-y-[-100%]">
+            <Component2 className="content-stretch flex items-start overflow-clip relative" />
+          </div>
+        </div>
+        <div className="absolute content-stretch flex flex-col gap-[12px] items-center left-[calc(50%+-50px)] top-[calc(50%+8.5px)] translate-x-[-50%] translate-y-[-50%] w-[420px]" data-name="粮食源头" data-node-id="I1443:76051;1700:135227">
+          <div className="content-stretch flex flex-col gap-[12px] items-start relative shrink-0 w-full" data-node-id="I1443:76051;1700:135228">
+            <Text className="box-border content-stretch flex gap-[10px] h-[62px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
+            <Text className="box-border content-stretch flex gap-[10px] h-[62px] items-center px-0 py-[4px] relative shrink-0 w-full" propValue="24px" />
+          </div>
+          <div className="content-stretch flex flex-col gap-[12px] items-start relative shrink-0 w-full" data-node-id="I1443:76051;1700:135231">
+            <div className="content-stretch flex gap-[20px] items-start relative shrink-0" data-node-id="I1443:76051;1700:135232">
+              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
+              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" />
+              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
+            </div>
+          </div>
+        </div>
+      </div>
+      <div className="absolute content-stretch flex flex-col gap-[11px] items-start left-[199.88px] top-[calc(50%+4.02px)] translate-y-[-50%] w-[330px]" data-name="组合1" data-node-id="I1443:76051;1412:195684">
+        <Text className="box-border content-stretch flex gap-[10px] h-[80px] items-center px-[26px] py-[4px] relative shrink-0 w-full" />
+        <div className="box-border content-stretch flex flex-col h-[700px] items-center justify-between px-0 py-[20px] relative shrink-0 w-full" data-node-id="I1443:76051;1412:195688">
+          <div className="box-border content-stretch flex flex-col gap-[20px] items-start px-0 py-[20px] relative shrink-0 w-[278px]" data-name="总产值达" data-node-id="I1443:76051;1412:195689">
+            <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0 w-full" />
+            <div className="content-stretch flex gap-[10px] h-[80px] items-end relative shrink-0 w-full" data-name="数据金额" data-node-id="I1443:76051;1412:195691">
+              <div className="content-stretch flex gap-[6px] items-center relative shrink-0" data-name="1" data-node-id="I1443:76051;1412:195692">
+                <Component1 className="h-[80px] relative shrink-0 w-[53.333px]" />
+                <Component1 className="h-[80px] relative shrink-0 w-[53.333px]" />
+              </div>
+              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
+            </div>
+          </div>
+          <div className="box-border content-stretch flex flex-col gap-[20px] items-start px-0 py-[20px] relative shrink-0 w-[278px]" data-name="总产值达" data-node-id="I1443:76051;1412:195704">
+            <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0 w-full" />
+            <div className="content-stretch flex gap-[10px] h-[80px] items-end relative shrink-0 w-full" data-name="数据金额" data-node-id="I1443:76051;1412:195706">
+              <div className="content-stretch flex gap-[6px] items-center relative shrink-0" data-name="1" data-node-id="I1443:76051;1412:195707">
+                <Component1 className="h-[80px] relative shrink-0 w-[53.333px]" />
+                <Component1 className="h-[80px] relative shrink-0 w-[53.333px]" />
+                <Component1 className="h-[80px] relative shrink-0 w-[53.333px]" />
+              </div>
+              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
+            </div>
+          </div>
+          <div className="box-border content-stretch flex flex-col gap-[20px] items-start px-0 py-[20px] relative shrink-0 w-[278px]" data-name="总产值达" data-node-id="I1443:76051;1412:195718">
+            <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0 w-full" />
+            <div className="content-stretch flex gap-[10px] h-[80px] items-end relative shrink-0 w-full" data-name="数据金额" data-node-id="I1443:76051;1412:195720">
+              <div className="content-stretch flex gap-[6px] items-center relative shrink-0" data-name="1" data-node-id="I1443:76051;1412:195721">
+                <Component1 className="h-[80px] relative shrink-0 w-[53.333px]" />
+              </div>
+              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
+            </div>
+          </div>
+        </div>
+      </div>
+      <Component className="absolute h-[1078.893px] left-[40px] top-[0.43px] w-[150.879px]" />
+    </div>
+  );
+}
+SUPER CRITICAL: The generated React+Tailwind code MUST be converted to match the target project's technology stack and styling system.
+1. Analyze the target codebase to identify: technology stack, styling approach, component patterns, and design tokens
+2. Convert React syntax to the target framework/library
+3. Transform all Tailwind classes to the target styling system while preserving exact visual design
+4. Follow the project's existing patterns and conventions
+DO NOT install any Tailwind as a dependency unless the user instructs you to do so.
+
+Node ids have been added to the code as data attributes, e.g. `data-node-id="1:2"`.
+These styles are contained in the design: 文字颜色/2-100%白色: #FFFFFF, 文字颜色/3-50%白色: #FFFFFF, 渐变/2-蓝色: , 主色/主色-2亮绿: #00FFFF, 边框-蓝色: #133BA0, 主色/icon色: , 主色/产业-水产: #6BE9FF, 文字颜色/4-30%白色: #FFFFFF.
+Images and SVGs will be stored as constants, e.g. const image = 'https://www.figma.com/api/mcp/asset/550e8400-e29b-41d4-a716-446655440000'. These constants will be used in the code as the source for the image, ex: <img src={image} />. Image assets are stored on a remote server for 7 days and can be fetched using the provided URLs until they expire.
+IMPORTANT: After you call this tool, you MUST call get_screenshot to get a screenshot of the node for context.

docs/figma-jsx/油脂.md

@@ -0,0 +1,495 @@
+```jsx
+const imgProperty1 = "https://www.figma.com/api/mcp/asset/554787cc-412a-480d-be57-dae1e08f1200";
+const imgGroup1597881806 = "https://www.figma.com/api/mcp/asset/6d7edb0f-3381-4509-afa7-84c2e4279f1f";
+const img = "https://www.figma.com/api/mcp/asset/52362dc6-775c-4ee1-a11a-0798363b4270";
+const img1 = "https://www.figma.com/api/mcp/asset/e7867417-5cd4-492f-ae21-a281136bde1a";
+const img2 = "https://www.figma.com/api/mcp/asset/d98b7593-0f7b-4c2c-b8f3-5d0e3fcc7138";
+const img3 = "https://www.figma.com/api/mcp/asset/7aaf9b07-74ca-4e0b-af08-2b5baa74ed19";
+const imgGroup1597881805 = "https://www.figma.com/api/mcp/asset/6ffbbfb7-34e9-4ae8-a1cc-124ecf429b8c";
+const img4 = "https://www.figma.com/api/mcp/asset/e817eb70-6ff5-4c26-aee5-0c0a6b57d96d";
+const imgVector = "https://www.figma.com/api/mcp/asset/a0c43fa6-60c0-4423-910e-9626cb274857";
+const imgUnion = "https://www.figma.com/api/mcp/asset/467c61a6-b84f-4e22-a749-27fd459eb79a";
+const img5 = "https://www.figma.com/api/mcp/asset/4e63bc02-3cc1-4508-92b8-1ef53e70733d";
+const img6 = "https://www.figma.com/api/mcp/asset/f642eda8-a1c3-4efc-8539-818a95dc38ac";
+const img7 = "https://www.figma.com/api/mcp/asset/18bdf0f9-a298-4a7e-89b3-de50746cf73c";
+const imgUnion1 = "https://www.figma.com/api/mcp/asset/7c3ecfd9-25f1-46d9-87ee-30802d84ed29";
+const imgUnion2 = "https://www.figma.com/api/mcp/asset/c46eca3c-617d-45f9-b34a-97a97147b7ca";
+const imgUnion3 = "https://www.figma.com/api/mcp/asset/5a6e1676-db09-4c41-8ddc-7ef3e0bc09c9";
+const imgUnion4 = "https://www.figma.com/api/mcp/asset/65803ac7-e88a-44e0-9464-f016ab5652c2";
+const imgUnion5 = "https://www.figma.com/api/mcp/asset/fdf924ac-c5aa-46fa-afb8-e632ea4cf526";
+const imgUnion6 = "https://www.figma.com/api/mcp/asset/5f36b7d7-6ce7-4e35-85f2-00cecc90f29f";
+const imgUnion7 = "https://www.figma.com/api/mcp/asset/e0807617-5506-42ac-b248-1f81ffafbdb4";
+const imgUnion8 = "https://www.figma.com/api/mcp/asset/7f219557-e253-428f-ac1a-c15cf543b090";
+const imgUnion9 = "https://www.figma.com/api/mcp/asset/aae16b71-0ebd-47a8-82f1-485b67fe24d4";
+const imgUnion10 = "https://www.figma.com/api/mcp/asset/0698c8e2-c557-42d5-aa9b-b20b8106a303";
+const imgUnion11 = "https://www.figma.com/api/mcp/asset/fd15adb9-6a7e-4992-adc0-9a66cd278fce";
+const imgUnion12 = "https://www.figma.com/api/mcp/asset/27b935a4-dba6-48c9-b496-52f1047f9aaf";
+const imgUnion13 = "https://www.figma.com/api/mcp/asset/8806c353-2d1b-48ea-a0ff-6fdfcbe341ff";
+const imgUnion14 = "https://www.figma.com/api/mcp/asset/aa8024a9-a48c-4a86-a86d-e813152ae897";
+const imgUnion15 = "https://www.figma.com/api/mcp/asset/602df580-9408-4499-8dfc-b04c0567d823";
+const imgUnion16 = "https://www.figma.com/api/mcp/asset/35f7b954-138b-4a88-8824-740c68fe2642";
+const imgUnion17 = "https://www.figma.com/api/mcp/asset/a24e4239-2836-4dbf-9eeb-45665e369b4e";
+const img8 = "https://www.figma.com/api/mcp/asset/d4f3527b-4637-4474-86a3-42320b582411";
+const imgGroup1158 = "https://www.figma.com/api/mcp/asset/3ccf8360-d9ff-449e-a053-09cc95a914be";
+const img9 = "https://www.figma.com/api/mcp/asset/dcc6fdd5-ecb0-4d89-9b91-4fee368a5888";
+const img10 = "https://www.figma.com/api/mcp/asset/f0b58083-9314-4a4f-936d-53f3ba557272";
+type TextProps = {
+  className?: string;
+  propValue?: "24px" | "26px" | "34px";
+  propValue1?: "特粗";
+  propValue2?: "左对齐" | "右对齐" | "居中对齐";
+};
+
+function Text({ className, propValue = "34px", propValue1 = "特粗", propValue2 = "左对齐" }: TextProps) {
+  if (propValue === "24px" && propValue1 === "特粗" && propValue2 === "左对齐") {
+    return (
+      <div className={className} data-name="字号=24px, 字重=特粗, 位置=左对齐" data-node-id="632:88182">
+        <div className="flex flex-col font-['HarmonyOS_Sans_SC:Bold',sans-serif] justify-center leading-[0] not-italic relative shrink-0 text-[24px] text-white whitespace-nowrap" data-node-id="632:88183">
+          <p className="leading-[32px]">Text line-24px</p>
+        </div>
+      </div>
+    );
+  }
+  if (propValue === "26px" && propValue1 === "特粗" && propValue2 === "左对齐") {
+    return (
+      <div className={className} data-name="字号=26px, 字重=特粗, 位置=左对齐" data-node-id="635:42943">
+        <div className="flex flex-col font-['HarmonyOS_Sans_SC:Bold',sans-serif] justify-center leading-[0] not-italic relative shrink-0 text-[26px] text-white whitespace-nowrap" data-node-id="635:42944">
+          <p className="leading-[32px]">Text line-26px</p>
+        </div>
+      </div>
+    );
+  }
+  if (propValue === "34px" && propValue1 === "特粗" && propValue2 === "居中对齐") {
+    return (
+      <div className={className} data-name="字号=34px, 字重=特粗, 位置=居中对齐" data-node-id="635:42955">
+        <div className="flex flex-col font-['HarmonyOS_Sans_SC:Bold',sans-serif] justify-center leading-[0] not-italic relative shrink-0 text-[34px] text-center text-white whitespace-nowrap" data-node-id="635:42956">
+          <p className="leading-[32px]">Text line-34px</p>
+        </div>
+      </div>
+    );
+  }
+  if (propValue === "34px" && propValue1 === "特粗" && propValue2 === "右对齐") {
+    return (
+      <div className={className} data-name="字号=34px, 字重=特粗, 位置=右对齐" data-node-id="635:42959">
+        <div className="flex flex-col font-['HarmonyOS_Sans_SC:Bold',sans-serif] justify-center leading-[0] not-italic relative shrink-0 text-[34px] text-right text-white whitespace-nowrap" data-node-id="635:42960">
+          <p className="leading-[32px]">Text line-34px</p>
+        </div>
+      </div>
+    );
+  }
+  return (
+    <div className={className} data-name="字号=34px, 字重=特粗, 位置=左对齐" data-node-id="635:42949">
+      <div className="flex flex-col font-['HarmonyOS_Sans_SC:Bold',sans-serif] justify-center leading-[0] not-italic relative shrink-0 text-[34px] text-white whitespace-nowrap" data-node-id="635:42950">
+        <p className="leading-[32px]">Text line-34px</p>
+      </div>
+    </div>
+  );
+}
+
+function Component({ className }: { className?: string }) {
+  return (
+    <div className={className} data-name="数据样式" data-node-id="1201:47976">
+      <div className="absolute bg-gradient-to-b border-2 border-[#5e697e] border-solid from-[#474e60] inset-0 rounded-[6px] to-[#2b2f39]" data-name="11" data-node-id="1201:47971" />
+      <div className="absolute flex flex-col font-['HarmonyOS_Sans_SC:Bold',sans-serif] inset-[16.16%_13.74%] justify-center leading-[0] not-italic text-[60px] text-center text-white tracking-[6px]" data-node-id="1201:47972">
+        <p className="leading-[normal] whitespace-pre-wrap">6</p>
+      </div>
+    </div>
+  );
+}
+
+function Component2({ className }: { className?: string }) {
+  return (
+    <div className={className} data-name="弹出框样式2" data-node-id="741:54163">
+      <div className="flex h-[calc(1px*((var(--transform-inner-width)*1)+(var(--transform-inner-height)*0)))] items-center justify-center leading-[0] relative shrink-0 w-[calc(1px*((var(--transform-inner-height)*1)+(var(--transform-inner-width)*0)))]">
+        <div className="flex-none rotate-[90deg] scale-y-[-100%]">
+          <div className="grid-cols-[max-content] grid-rows-[max-content] inline-grid justify-items-start relative" data-node-id="1207:33739">
+            <div className="col-[1] h-[80px] ml-[7.5px] mt-[17px] relative row-[1] w-[2px]" data-node-id="1207:33513">
+              <div className="absolute bottom-[-1.25%] left-0 right-[-50%] top-[-1.25%]">
+                <img alt="" className="block max-w-none size-full" src={imgGroup1597881806} />
+              </div>
+            </div>
+            <div className="col-[1] ml-0 mt-0 relative row-[1] size-[17px]" data-name="圆圈圈" data-node-id="741:53539">
+              <img alt="" className="block max-w-none size-full" src={img} />
+            </div>
+          </div>
+        </div>
+      </div>
+      <div className="h-[320px] relative shrink-0 w-[476px]" data-name="框" data-node-id="741:53541">
+        <div className="absolute inset-[-0.06%_-0.09%_-0.06%_-0.04%]">
+          <img alt="" className="block max-w-none size-full" src={img1} />
+        </div>
+      </div>
+    </div>
+  );
+}
+
+function Component1({ className }: { className?: string }) {
+  return (
+    <div className={className} data-name="定位点/产业链" data-node-id="1205:31870">
+      <div className="absolute inset-[10%_13.79%]" data-name="底部" data-node-id="1201:48987">
+        <img alt="" className="block max-w-none size-full" src={img2} />
+      </div>
+      <div className="absolute bottom-[40.42%] left-1/4 overflow-clip right-1/4 shadow-[0px_0px_6px_0px_#4593ff] top-[17.92%]" data-name="产业链" data-node-id="1205:31863">
+        <div className="absolute inset-[5.36%_10.72%]" data-name="Union" data-node-id="I1205:31863;1205:31861">
+          <img alt="" className="block max-w-none size-full" src={img3} />
+        </div>
+        <div className="absolute inset-0 pointer-events-none shadow-[inset_0px_0px_3px_0px_#ffffff]" />
+      </div>
+    </div>
+  );
+}
+
+function Component3({ className }: { className?: string }) {
+  return (
+    <div className={className} data-name="定位点/基地" data-node-id="1205:31871">
+      <div className="absolute inset-[12.5%_8.66%]" data-node-id="1205:32108">
+        <img alt="" className="block max-w-none size-full" src={imgGroup1597881805} />
+      </div>
+      <div className="absolute inset-[27.5%_23%] overflow-clip" data-name="产业icon" data-node-id="1204:31851">
+        <div className="absolute inset-[13%_21.7%]" data-name="Union" data-node-id="I1204:31851;1198:61730">
+          <div className="absolute inset-[-20.02%_-26.17%]">
+            <img alt="" className="block max-w-none size-full" src={img4} />
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}
+type iconProps = {
+  className?: string;
+  property1?: "油脂" | "粮食";
+};
+
+function icon({ className, property1 = "粮食" }: iconProps) {
+  if (property1 === "油脂") {
+    return (
+      <div className={className} data-name="Property 1=油脂" data-node-id="1201:31233">
+        <div className="absolute inset-[13%_26.2%]" data-name="Vector" data-node-id="1200:31218">
+          <img alt="" className="block max-w-none size-full" src={imgVector} />
+        </div>
+      </div>
+    );
+  }
+  return (
+    <div className={className} data-name="Property 1=粮食" data-node-id="1201:31235">
+      <div className="absolute inset-[13%_21.7%]" data-name="Union" data-node-id="1198:61730">
+        <img alt="" className="block max-w-none size-full" src={imgUnion} />
+      </div>
+    </div>
+  );
+}
+type Component4Props = {
+  className?: string;
+  property1?: "下";
+};
+
+function Component4({ className, property1 = "下" }: Component4Props) {
+  return (
+    <div className={className} data-name="Property 1=下" data-node-id="1201:48179">
+      <div className="absolute content-stretch flex flex-col gap-[40px] h-[944px] items-center justify-center left-0 right-[37.7%] top-1/2 translate-y-[-50%]" data-name="导航内容" data-node-id="1201:48158">
+        <div className="box-border content-stretch flex flex-col gap-[20px] h-[220px] items-center justify-center px-[20px] py-0 relative rounded-[10px] shrink-0 w-[60px]" data-name="111" data-node-id="1201:48159">
+          <div className="overflow-clip relative shrink-0 size-[50px]" data-name="产业icon" data-node-id="1201:48160">
+            <div className="absolute inset-[13%_21.7%]" data-name="Union" data-node-id="I1201:48160;1198:61730">
+              <div className="absolute inset-0" style={{ "--fill-0": "rgba(255, 255, 255, 1)" } as React.CSSProperties}>
+                <img alt="" className="block max-w-none size-full" src={img5} />
+              </div>
+            </div>
+          </div>
+          <div className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" data-name="text" data-node-id="1201:48161">
+            <div className="flex flex-col font-['HarmonyOS_Sans_SC:Bold',sans-serif] justify-center leading-[32px] not-italic relative shrink-0 text-[26px] text-[rgba(255,255,255,0.5)] whitespace-nowrap" data-node-id="I1201:48161;635:42944">
+              <p className="mb-0">粮</p>
+              <p className="mb-0">&nbsp;</p>
+              <p>食</p>
+            </div>
+          </div>
+        </div>
+        <div className="bg-[rgba(255,255,255,0.05)] box-border content-stretch flex flex-col gap-[20px] h-[220px] items-center justify-center px-[20px] py-0 relative rounded-[10px] shrink-0 w-[60px]" data-name="222" data-node-id="1201:48162">
+          <icon className="overflow-clip relative shrink-0 size-[50px]" property1="油脂" />
+          <div className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" data-name="text" data-node-id="1201:48164">
+            <div className="flex flex-col font-['HarmonyOS_Sans_SC:Bold',sans-serif] justify-center leading-[32px] not-italic relative shrink-0 text-[26px] text-white whitespace-nowrap" data-node-id="I1201:48164;635:42944">
+              <p className="mb-0">油</p>
+              <p className="mb-0">&nbsp;</p>
+              <p>脂</p>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div className="absolute bottom-0 flex items-center justify-center left-[25.05%] right-0 top-0">
+        <div className="flex-none h-[1078.893px] rotate-[180deg] scale-y-[-100%] w-[113.088px]">
+          <div className="relative size-full" data-name="光标左侧" data-node-id="1201:48165">
+            <div className="absolute bottom-[-0.04%] left-0 right-0 top-[-0.04%]">
+              <img alt="" className="block max-w-none size-full" src={img6} />
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}
+
+function Component5({ className }: { className?: string }) {
+  return (
+    <div className={className} data-name="边" data-node-id="84:21868">
+      <img alt="" className="block max-w-none size-full" src={img7} />
+    </div>
+  );
+}
+
+function Component6({ className }: { className?: string }) {
+  return (
+    <div className={className} data-name="线" data-node-id="84:21850">
+      <div className="absolute inset-[45.14%_13.47%_22.05%_68.8%]" data-name="Union" data-node-id="84:21851">
+        <div className="absolute inset-[-0.28%_-0.28%_-0.27%_-0.35%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion1} />
+        </div>
+      </div>
+      <div className="absolute inset-[69.45%_7.91%_11.34%_79.45%]" data-name="Union" data-node-id="84:21852">
+        <div className="absolute inset-[-0.36%_-0.44%_-0.33%_-0.45%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion2} />
+        </div>
+      </div>
+      <div className="absolute bottom-[58.34%] left-[13.82%] right-[58.52%] top-0" data-name="Union" data-node-id="84:21853">
+        <div className="absolute inset-[-0.16%_-0.17%_-0.16%_-0.25%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion3} />
+        </div>
+      </div>
+      <div className="absolute inset-[40.22%_52.11%_21.49%_24.35%]" data-name="Union" data-node-id="84:21854">
+        <div className="absolute inset-[-0.17%_-0.21%_-0.2%_-0.28%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion4} />
+        </div>
+      </div>
+      <div className="absolute inset-[15.1%_38.74%_51.84%_30.9%]" data-name="Union" data-node-id="84:21855">
+        <div className="absolute inset-[-0.2%_-0.17%_-0.22%_-0.17%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion5} />
+        </div>
+      </div>
+      <div className="absolute inset-[62.63%_13.38%_23.24%_79.12%]" data-name="Union" data-node-id="84:21856">
+        <div className="absolute inset-[-0.45%_-0.62%_-0.6%_-0.65%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion6} />
+        </div>
+      </div>
+      <div className="absolute inset-[39.2%_33.9%_32.16%_45.04%]" data-name="Union" data-node-id="84:21857">
+        <div className="absolute inset-[-0.26%_-0.43%_-0.35%_-0.33%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion7} />
+        </div>
+      </div>
+      <div className="absolute inset-[33.43%_19.83%_31.88%_63.81%]" data-name="Union" data-node-id="84:21858">
+        <div className="absolute inset-[-0.19%_-0.36%_-0.2%_-0.31%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion8} />
+        </div>
+      </div>
+      <div className="absolute inset-[61.63%_26.15%_9.48%_37%]" data-name="Union" data-node-id="84:21859">
+        <div className="absolute inset-[-0.27%_-0.13%_-0.27%_-0.21%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion9} />
+        </div>
+      </div>
+      <div className="absolute bottom-[16.35%] left-[77.75%] right-0 top-[39.25%]" data-name="Union" data-node-id="84:21860">
+        <div className="absolute inset-[-0.15%_-0.22%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion10} />
+        </div>
+      </div>
+      <div className="absolute bottom-0 left-[66.67%] right-[14.92%] top-[70.14%]" data-name="Union" data-node-id="84:21861">
+        <div className="absolute inset-[-0.22%_-0.27%_-0.22%_-0.26%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion11} />
+        </div>
+      </div>
+      <div className="absolute inset-[19.86%_25.75%_54.08%_56.23%]" data-name="Union" data-node-id="84:21862">
+        <div className="absolute inset-[-0.28%_-0.27%_-0.49%_-0.27%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion12} />
+        </div>
+      </div>
+      <div className="absolute bottom-[2%] left-0 right-[70.7%] top-[44.26%]" data-name="Union" data-node-id="84:21863">
+        <div className="absolute inset-[-0.12%_-0.16%_-0.14%_-0.18%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion13} />
+        </div>
+      </div>
+      <div className="absolute inset-[64.64%_29.68%_24.46%_58.95%]" data-name="Union" data-node-id="84:21864">
+        <div className="absolute inset-[-0.59%_-0.41%_-0.67%_-0.42%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion14} />
+        </div>
+      </div>
+      <div className="absolute inset-[61.94%_39.82%_24.69%_53.29%]" data-name="Union" data-node-id="84:21865">
+        <div className="absolute inset-[-0.64%_-0.74%_-0.48%_-0.82%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion15} />
+        </div>
+      </div>
+      <div className="absolute inset-[55.88%_34.28%_31.77%_54.46%]" data-name="Union" data-node-id="84:21866">
+        <div className="absolute inset-[-0.54%_-0.41%_-0.57%_-0.41%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion16} />
+        </div>
+      </div>
+      <div className="absolute inset-[33.35%_66.33%_53.33%_20.28%]" data-name="Union" data-node-id="84:21867">
+        <div className="absolute inset-[-0.55%_-0.49%_-0.53%_-0.4%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion17} />
+        </div>
+      </div>
+    </div>
+  );
+}
+
+function Component7({ className }: { className?: string }) {
+  return (
+    <div className={className} data-name="导航底框" data-node-id="631:36462">
+      <div className="absolute bottom-[18.95%] left-0 right-0 top-0" data-name="1" data-node-id="631:36440">
+        <div className="absolute inset-[-181.3%_-19.68%_-413.77%_-19.68%]">
+          <img alt="" className="block max-w-none size-full" src={img8} />
+        </div>
+      </div>
+      <div className="absolute bottom-0 left-[27.44%] right-[27.44%] top-[62.9%]" data-node-id="631:36441">
+        <div className="absolute inset-[-257.75%_-17.4%]">
+          <img alt="" className="block max-w-none size-full" src={imgGroup1158} />
+        </div>
+      </div>
+    </div>
+  );
+}
+
+function Component8({ className }: { className?: string }) {
+  return (
+    <div className={className} data-name="底部网格" data-node-id="631:69869">
+      <div className="absolute bottom-[-71.42%] content-stretch flex flex-col items-start left-0 mask-alpha mask-intersect mask-no-clip mask-no-repeat mask-position-[0px_175.624px] mask-size-[1920px_1080px] right-0 top-[-16.26%]" data-name="底部内容" data-node-id="631:69865" style={{ maskImage: `url('${img9}')` }}>
+        <div className="h-[1013.464px] relative shrink-0 w-[1920px]" data-name="网格" data-node-id="631:69866">
+          <img alt="" className="block max-w-none size-full" src={img10} />
+        </div>
+        <div className="h-[1013.464px] relative shrink-0 w-[1920px]" data-name="网格" data-node-id="631:69867">
+          <img alt="" className="block max-w-none size-full" src={img10} />
+        </div>
+      </div>
+    </div>
+  );
+}
+type Component9Props = {
+  className?: string;
+  property1?: "供应链专用界面";
+};
+
+function Component9({ className, property1 = "供应链专用界面" }: Component9Props) {
+  return (
+    <div className={className} data-name="Property 1=供应链专用界面" data-node-id="1486:134453">
+      <div aria-hidden="true" className="absolute inset-0 pointer-events-none">
+        <img alt="" className="absolute max-w-none object-50%-50% object-cover size-full" src={imgProperty1} />
+        <div className="absolute bg-[rgba(0,79,154,0.1)] inset-0" />
+      </div>
+      <div className="absolute contents left-0 top-0" data-node-id="1486:133993" />
+    </div>
+  );
+}
+
+export default function Component10() {
+  return (
+    <div className="bg-[rgba(33,33,33,0.6)] relative size-full" data-name="操控屏-1-粮食•油脂-油脂首页-产业链企业弹出数据" data-node-id="1214:73938">
+      <div className="absolute contents left-0 top-0" data-node-id="I1214:73938;1214:35482">
+        <div className="absolute contents left-0 top-0" data-name="我是底部" data-node-id="I1214:73938;1214:34626">
+          <Component9 className="absolute h-[1080px] left-0 overflow-clip top-0 w-[1920px]" />
+          <Component8 className="absolute h-[1080px] left-0 top-0 w-[1920px]" />
+          <Component7 className="absolute h-[71.119px] left-[526.95px] top-[40px] w-[866.265px]" />
+          <Text className="absolute box-border content-stretch flex gap-[10px] items-center justify-center left-1/2 px-0 py-[4px] top-[40px] translate-x-[-50%]" propValue2="居中对齐" />
+        </div>
+        <div className="absolute contents left-[529.88px] top-[calc(50%+33.79px)] translate-y-[-50%]" data-node-id="I1214:73938;1214:34632">
+          <div className="absolute contents left-[27.6%] right-[4.17%] top-[calc(50%+33.79px)] translate-y-[-50%]" data-name="地图" data-node-id="I1214:73938;1214:34633">
+            <Component6 className="absolute inset-[19.27%_4.17%_13.01%_27.6%]" />
+            <Component5 className="absolute h-[731.454px] left-[27.6%] right-[4.17%] top-[calc(50%+33.79px)] translate-y-[-50%]" />
+          </div>
+          <Component3 className="absolute h-[48px] left-[985px] top-[610.22px] w-[40px]" />
+          <Component3 className="absolute h-[48px] left-[1322px] top-[412.43px] w-[40px]" />
+          <Component3 className="absolute h-[48px] left-[1229.57px] top-[570px] w-[40px]" />
+          <Component3 className="absolute h-[48px] left-[1445px] top-[560.35px] w-[40px]" />
+          <Component1 className="absolute h-[48px] left-[949.08px] top-[680.31px] w-[40px]" />
+          <Component1 className="absolute h-[72px] left-[1394.45px] top-[444.4px] w-[60px]" />
+          <Component1 className="absolute h-[48px] left-[1307.42px] top-[551.47px] w-[40px]" />
+          <Component1 className="absolute h-[48px] left-[1403.37px] top-[603.77px] w-[40px]" />
+        </div>
+        <div className="absolute content-stretch flex flex-col gap-[10px] items-end right-[80px] top-[150px]" data-name="1+！" data-node-id="I1214:73938;1214:34644">
+          <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
+          <Text className="box-border content-stretch flex gap-[10px] h-[77px] items-center justify-end px-0 py-[4px] relative shrink-0 w-full" propValue2="右对齐" />
+          <Text className="box-border content-stretch flex gap-[10px] items-center justify-end px-0 py-[4px] relative shrink-0" propValue2="右对齐" />
+        </div>
+        <Component4 className="absolute h-[1078.893px] left-[40px] top-0 w-[150.879px]" />
+      </div>
+      <div className="absolute bottom-[80px] content-stretch flex items-center left-1/2 translate-x-[-50%]" data-node-id="I1214:73938;1214:34696">
+        <div className="box-border content-stretch flex gap-[20px] h-[54px] items-center justify-center px-[20px] py-0 relative rounded-[10px] shrink-0 w-[202px]" data-name="111" data-node-id="I1214:73938;1214:34697">
+          <Component3 className="h-[50px] relative shrink-0 w-[41.667px]" />
+          <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="26px" />
+        </div>
+        <div className="box-border content-stretch flex gap-[20px] h-[54px] items-center justify-center px-[20px] py-0 relative rounded-[10px] shrink-0 w-[202px]" data-name="112" data-node-id="I1214:73938;1214:34700">
+          <Component1 className="h-[50px] relative shrink-0 w-[41.667px]" />
+          <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="26px" />
+        </div>
+      </div>
+      <div className="absolute h-[351px] left-[814.45px] overflow-clip top-[464.02px] w-[580px]" data-name="基地弹出框" data-node-id="I1214:73938;1214:35483">
+        <div className="absolute flex items-center justify-center left-0 top-0">
+          <div className="flex-none rotate-[180deg] scale-y-[-100%]">
+            <Component2 className="content-stretch flex items-start overflow-clip relative" />
+          </div>
+        </div>
+        <div className="absolute content-stretch flex flex-col gap-[12px] items-center left-[30px] top-[40px] w-[420px]" data-name="粮食源头" data-node-id="I1214:73938;1700:134457">
+          <div className="content-stretch flex flex-col gap-[12px] items-start relative shrink-0 w-full" data-node-id="I1214:73938;1700:134458">
+            <Text className="box-border content-stretch flex gap-[10px] h-[62px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
+            <Text className="box-border content-stretch flex gap-[10px] h-[62px] items-center px-0 py-[4px] relative shrink-0 w-full" propValue="24px" />
+          </div>
+          <div className="content-stretch flex flex-col gap-[12px] items-start relative shrink-0 w-full" data-node-id="I1214:73938;1700:134461">
+            <div className="content-stretch flex gap-[20px] items-start relative shrink-0" data-node-id="I1214:73938;1700:134462">
+              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
+              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" />
+              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
+            </div>
+            <div className="content-stretch flex gap-[20px] items-start relative shrink-0" data-node-id="I1214:73938;1700:134466">
+              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
+            </div>
+          </div>
+        </div>
+      </div>
+      <div className="absolute content-stretch flex flex-col gap-[11px] items-start left-[199.88px] top-[calc(50%+4.02px)] translate-y-[-50%] w-[330px]" data-name="组合1" data-node-id="I1214:73938;1699:120684">
+        <Text className="box-border content-stretch flex gap-[10px] h-[80px] items-center px-[26px] py-[4px] relative shrink-0 w-full" />
+        <div className="grid-cols-[max-content] grid-rows-[max-content] inline-grid justify-items-start leading-[0] relative shrink-0" data-name="框框数据1" data-node-id="I1214:73938;1699:120686">
+          <div className="box-border col-[1] content-stretch flex flex-col h-[700px] items-center justify-between ml-0 mt-0 px-0 py-[20px] relative row-[1] w-[330px]" data-node-id="I1214:73938;1699:120688">
+            <div className="box-border content-stretch flex flex-col gap-[20px] items-start px-0 py-[20px] relative shrink-0 w-[278px]" data-name="总产值达" data-node-id="I1214:73938;1699:120689">
+              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0 w-full" />
+              <div className="content-stretch flex gap-[10px] h-[80px] items-end relative shrink-0 w-full" data-name="数据金额" data-node-id="I1214:73938;1699:120691">
+                <div className="content-stretch flex gap-[6px] items-center relative shrink-0" data-name="1" data-node-id="I1214:73938;1699:120692">
+                  <Component className="h-[80px] relative shrink-0 w-[53.333px]" />
+                  <Component className="h-[80px] relative shrink-0 w-[53.333px]" />
+                </div>
+                <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
+              </div>
+            </div>
+            <div className="box-border content-stretch flex flex-col gap-[20px] items-start px-0 py-[20px] relative shrink-0 w-[278px]" data-name="总产值达" data-node-id="I1214:73938;1699:120703">
+              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0 w-full" />
+              <div className="content-stretch flex gap-[10px] h-[80px] items-end relative shrink-0 w-full" data-name="数据金额" data-node-id="I1214:73938;1699:120705">
+                <div className="content-stretch flex gap-[6px] items-center relative shrink-0" data-name="1" data-node-id="I1214:73938;1699:120706">
+                  <Component className="h-[80px] relative shrink-0 w-[53.333px]" />
+                  <Component className="h-[80px] relative shrink-0 w-[53.333px]" />
+                </div>
+                <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
+              </div>
+            </div>
+            <div className="box-border content-stretch flex flex-col gap-[20px] items-start px-0 py-[20px] relative shrink-0 w-[278px]" data-name="总产值达" data-node-id="I1214:73938;1699:120717">
+              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0 w-full" />
+              <div className="content-stretch flex gap-[10px] h-[80px] items-end relative shrink-0 w-full" data-name="数据金额" data-node-id="I1214:73938;1699:120719">
+                <div className="content-stretch flex gap-[6px] items-center relative shrink-0" data-name="1" data-node-id="I1214:73938;1699:120720">
+                  <Component className="h-[80px] relative shrink-0 w-[53.333px]" />
+                  <Component className="h-[80px] relative shrink-0 w-[53.333px]" />
+                  <Component className="h-[80px] relative shrink-0 w-[53.333px]" />
+                  <Component className="h-[80px] relative shrink-0 w-[53.333px]" />
+                </div>
+                <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}
+```
+SUPER CRITICAL: The generated React+Tailwind code MUST be converted to match the target project's technology stack and styling system.
+1. Analyze the target codebase to identify: technology stack, styling approach, component patterns, and design tokens
+2. Convert React syntax to the target framework/library
+3. Transform all Tailwind classes to the target styling system while preserving exact visual design
+4. Follow the project's existing patterns and conventions
+DO NOT install any Tailwind as a dependency unless the user instructs you to do so.
+
+Node ids have been added to the code as data attributes, e.g. `data-node-id="1:2"`.
+These styles are contained in the design: 文字颜色/2-100%白色: #FFFFFF, 渐变/2-蓝色: , 边框-蓝色: #133BA0, 主色/icon色: , 文字颜色/3-50%白色: #FFFFFF, 主色/主色-2亮绿: #00FFFF, 主色/产业-菜籽油颜色: #F6B02E.
+Images and SVGs will be stored as constants, e.g. const image = 'https://www.figma.com/api/mcp/asset/550e8400-e29b-41d4-a716-446655440000'. These constants will be used in the code as the source for the image, ex: <img src={image} />. Image assets are stored on a remote server for 7 days and can be fetched using the provided URLs until they expire.
+IMPORTANT: After you call this tool, you MUST call get_screenshot to get a screenshot of the node for context.

docs/figma-jsx/畜牧.md

@@ -0,0 +1,485 @@
+const imgProperty1 = "https://www.figma.com/api/mcp/asset/6486cc00-1597-4bd2-9774-2b4cb8f6c782";
+const imgUnion = "https://www.figma.com/api/mcp/asset/34ddbe4f-aeb7-4470-88a0-50d35f88b84e";
+const img = "https://www.figma.com/api/mcp/asset/5b8f04b7-be6b-49ca-b478-f4befe689966";
+const img1 = "https://www.figma.com/api/mcp/asset/2550597b-faf7-45a0-939a-42a52170a349";
+const imgGroup1597881806 = "https://www.figma.com/api/mcp/asset/5d4baf5c-6621-4469-8bf8-2255dd4d8c25";
+const img2 = "https://www.figma.com/api/mcp/asset/72e6603e-1f4e-4f41-85ed-b3fa2013a3fc";
+const img3 = "https://www.figma.com/api/mcp/asset/9bd200ef-9bcb-4052-bb8e-faeb450adc56";
+const img4 = "https://www.figma.com/api/mcp/asset/f25540cb-52cb-42c6-9d52-ce24572a4a1c";
+const img5 = "https://www.figma.com/api/mcp/asset/a400dbd5-185f-4679-a294-dad4ba9a6da4";
+const imgGroup1597881805 = "https://www.figma.com/api/mcp/asset/e16dc4db-d5ed-436c-94f7-105e08f58c90";
+const img6 = "https://www.figma.com/api/mcp/asset/1783cbd4-c8ce-4cdb-8aaa-9ff2476395e5";
+const img7 = "https://www.figma.com/api/mcp/asset/65ee869b-27d1-4ede-b315-3d640c6469e6";
+const imgUnion1 = "https://www.figma.com/api/mcp/asset/108ed812-04ae-4e2b-a8e4-be22cd49d4b8";
+const imgUnion2 = "https://www.figma.com/api/mcp/asset/24860769-e72d-465f-be84-930414cee470";
+const imgUnion3 = "https://www.figma.com/api/mcp/asset/60d9fbb3-793f-4a77-9b12-11dc3469b4fb";
+const imgUnion4 = "https://www.figma.com/api/mcp/asset/3ddd8af1-a226-4864-92dc-20c56d75fc6b";
+const imgUnion5 = "https://www.figma.com/api/mcp/asset/7dc27585-58e8-459f-bdf0-7f0a8242d0ca";
+const imgUnion6 = "https://www.figma.com/api/mcp/asset/91dd4a45-0826-42bb-9e17-7622adca1c62";
+const imgUnion7 = "https://www.figma.com/api/mcp/asset/e3f89b5c-a256-4187-aeaa-bad3dba9f0cc";
+const imgUnion8 = "https://www.figma.com/api/mcp/asset/fffbdfd5-5caf-42ac-8105-fb9a03240a11";
+const imgUnion9 = "https://www.figma.com/api/mcp/asset/b2d22c75-a0e6-4add-9904-b0c6d892d35a";
+const imgUnion10 = "https://www.figma.com/api/mcp/asset/8946c408-b117-4cdb-891f-de19ce5d3f76";
+const imgUnion11 = "https://www.figma.com/api/mcp/asset/348b57e3-824b-4f39-ade3-ceeac83bdee8";
+const imgUnion12 = "https://www.figma.com/api/mcp/asset/7987f56b-7d3e-469a-8e6c-195560bf93ec";
+const imgUnion13 = "https://www.figma.com/api/mcp/asset/14593df3-7432-4e45-930a-02580e9105db";
+const imgUnion14 = "https://www.figma.com/api/mcp/asset/0502a9e7-b702-4043-a54c-a09154409dc8";
+const imgUnion15 = "https://www.figma.com/api/mcp/asset/c7a6d28a-61eb-4f3c-970f-cc24a3788453";
+const imgUnion16 = "https://www.figma.com/api/mcp/asset/b8bf7ce6-ee6c-43f8-92c2-8ff055d8bf37";
+const imgUnion17 = "https://www.figma.com/api/mcp/asset/17c54de0-c843-467b-a6f8-8c993be538d5";
+const img8 = "https://www.figma.com/api/mcp/asset/3ffbcaba-0922-4e10-846d-8e90b80b3e4a";
+const imgGroup1158 = "https://www.figma.com/api/mcp/asset/3c226908-de77-4167-b03d-c6951372286f";
+const img9 = "https://www.figma.com/api/mcp/asset/212174d4-8e0b-4cb9-979c-a0cb2c3aec4a";
+const img10 = "https://www.figma.com/api/mcp/asset/39a4ad1e-22e2-4527-b6cf-8d5d653d465a";
+type iconProps = {
+  className?: string;
+  property1?: "水产" | "油脂" | "畜牧" | "粮食";
+};
+
+function icon({ className, property1 = "粮食" }: iconProps) {
+  return (
+    <div className={className} data-name="Property 1=粮食" data-node-id="1201:31235">
+      <div className="absolute inset-[13%_21.7%]" data-name="Union" data-node-id="1198:61730">
+        <img alt="" className="block max-w-none size-full" src={imgUnion} />
+      </div>
+    </div>
+  );
+}
+type ComponentProps = {
+  className?: string;
+  property1?: "上";
+};
+
+function Component({ className, property1 = "上" }: ComponentProps) {
+  return (
+    <div className={className} data-name="Property 1=上" data-node-id="1201:48133">
+      <div className="absolute content-stretch flex flex-col gap-[40px] h-[944px] items-center justify-center left-0 right-[37.7%] top-1/2 translate-y-[-50%]" data-name="导航内容" data-node-id="1201:47870">
+        <div className="bg-[rgba(255,255,255,0.05)] box-border content-stretch flex flex-col gap-[20px] h-[220px] items-center justify-center px-[20px] py-0 relative rounded-[10px] shrink-0 w-[60px]" data-name="111" data-node-id="1201:47862">
+          <icon className="overflow-clip relative shrink-0 size-[50px]" />
+          <div className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" data-name="text" data-node-id="1201:47859">
+            <div className="flex flex-col font-['HarmonyOS_Sans_SC:Bold',sans-serif] justify-center leading-[32px] not-italic relative shrink-0 text-[26px] text-white whitespace-nowrap" data-node-id="I1201:47859;635:42944">
+              <p className="mb-0">粮</p>
+              <p className="mb-0">&nbsp;</p>
+              <p>食</p>
+            </div>
+          </div>
+        </div>
+        <div className="box-border content-stretch flex flex-col gap-[20px] h-[220px] items-center justify-center px-[20px] py-0 relative rounded-[10px] shrink-0 w-[60px]" data-name="222" data-node-id="1201:47864">
+          <div className="overflow-clip relative shrink-0 size-[50px]" data-name="产业icon" data-node-id="1201:47865">
+            <div className="absolute inset-[13%_26.2%]" data-name="Vector" data-node-id="I1201:47865;1200:31218">
+              <div className="absolute inset-0" style={{ "--fill-0": "rgba(255, 255, 255, 1)" } as React.CSSProperties}>
+                <img alt="" className="block max-w-none size-full" src={img} />
+              </div>
+            </div>
+          </div>
+          <div className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" data-name="text" data-node-id="1201:47866">
+            <div className="flex flex-col font-['HarmonyOS_Sans_SC:Bold',sans-serif] justify-center leading-[32px] not-italic relative shrink-0 text-[26px] text-[rgba(255,255,255,0.5)] whitespace-nowrap" data-node-id="I1201:47866;635:42944">
+              <p className="mb-0">油</p>
+              <p className="mb-0">&nbsp;</p>
+              <p>脂</p>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div className="absolute bottom-0 flex items-center justify-center left-[25.05%] right-0 top-0">
+        <div className="flex-none h-[1078.893px] rotate-[180deg] scale-y-[-100%] w-[113.088px]">
+          <div className="relative size-full" data-name="光标左侧" data-node-id="1201:48121">
+            <div className="absolute bottom-[-0.04%] left-0 right-0 top-[-0.04%]">
+              <img alt="" className="block max-w-none size-full" src={img1} />
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}
+type TextProps = {
+  className?: string;
+  propValue?: "24px" | "26px" | "34px";
+  propValue1?: "特粗";
+  propValue2?: "左对齐" | "右对齐" | "居中对齐";
+};
+
+function Text({ className, propValue = "34px", propValue1 = "特粗", propValue2 = "左对齐" }: TextProps) {
+  if (propValue === "24px" && propValue1 === "特粗" && propValue2 === "左对齐") {
+    return (
+      <div className={className} data-name="字号=24px, 字重=特粗, 位置=左对齐" data-node-id="632:88182">
+        <div className="flex flex-col font-['HarmonyOS_Sans_SC:Bold',sans-serif] justify-center leading-[0] not-italic relative shrink-0 text-[24px] text-white whitespace-nowrap" data-node-id="632:88183">
+          <p className="leading-[32px]">Text line-24px</p>
+        </div>
+      </div>
+    );
+  }
+  if (propValue === "26px" && propValue1 === "特粗" && propValue2 === "左对齐") {
+    return (
+      <div className={className} data-name="字号=26px, 字重=特粗, 位置=左对齐" data-node-id="635:42943">
+        <div className="flex flex-col font-['HarmonyOS_Sans_SC:Bold',sans-serif] justify-center leading-[0] not-italic relative shrink-0 text-[26px] text-white whitespace-nowrap" data-node-id="635:42944">
+          <p className="leading-[32px]">Text line-26px</p>
+        </div>
+      </div>
+    );
+  }
+  if (propValue === "34px" && propValue1 === "特粗" && propValue2 === "居中对齐") {
+    return (
+      <div className={className} data-name="字号=34px, 字重=特粗, 位置=居中对齐" data-node-id="635:42955">
+        <div className="flex flex-col font-['HarmonyOS_Sans_SC:Bold',sans-serif] justify-center leading-[0] not-italic relative shrink-0 text-[34px] text-center text-white whitespace-nowrap" data-node-id="635:42956">
+          <p className="leading-[32px]">Text line-34px</p>
+        </div>
+      </div>
+    );
+  }
+  if (propValue === "34px" && propValue1 === "特粗" && propValue2 === "右对齐") {
+    return (
+      <div className={className} data-name="字号=34px, 字重=特粗, 位置=右对齐" data-node-id="635:42959">
+        <div className="flex flex-col font-['HarmonyOS_Sans_SC:Bold',sans-serif] justify-center leading-[0] not-italic relative shrink-0 text-[34px] text-right text-white whitespace-nowrap" data-node-id="635:42960">
+          <p className="leading-[32px]">Text line-34px</p>
+        </div>
+      </div>
+    );
+  }
+  return (
+    <div className={className} data-name="字号=34px, 字重=特粗, 位置=左对齐" data-node-id="635:42949">
+      <div className="flex flex-col font-['HarmonyOS_Sans_SC:Bold',sans-serif] justify-center leading-[0] not-italic relative shrink-0 text-[34px] text-white whitespace-nowrap" data-node-id="635:42950">
+        <p className="leading-[32px]">Text line-34px</p>
+      </div>
+    </div>
+  );
+}
+
+function Component1({ className }: { className?: string }) {
+  return (
+    <div className={className} data-name="数据样式" data-node-id="1201:47976">
+      <div className="absolute bg-gradient-to-b border-2 border-[#5e697e] border-solid from-[#474e60] inset-0 rounded-[6px] to-[#2b2f39]" data-name="11" data-node-id="1201:47971" />
+      <div className="absolute flex flex-col font-['HarmonyOS_Sans_SC:Bold',sans-serif] inset-[16.16%_13.74%] justify-center leading-[0] not-italic text-[60px] text-center text-white tracking-[6px]" data-node-id="1201:47972">
+        <p className="leading-[normal] whitespace-pre-wrap">6</p>
+      </div>
+    </div>
+  );
+}
+
+function Component2({ className }: { className?: string }) {
+  return (
+    <div className={className} data-name="弹出框样式2" data-node-id="741:54163">
+      <div className="flex h-[calc(1px*((var(--transform-inner-width)*1)+(var(--transform-inner-height)*0)))] items-center justify-center leading-[0] relative shrink-0 w-[calc(1px*((var(--transform-inner-height)*1)+(var(--transform-inner-width)*0)))]">
+        <div className="flex-none rotate-[90deg] scale-y-[-100%]">
+          <div className="grid-cols-[max-content] grid-rows-[max-content] inline-grid justify-items-start relative" data-node-id="1207:33739">
+            <div className="col-[1] h-[80px] ml-[7.5px] mt-[17px] relative row-[1] w-[2px]" data-node-id="1207:33513">
+              <div className="absolute bottom-[-1.25%] left-0 right-[-50%] top-[-1.25%]">
+                <img alt="" className="block max-w-none size-full" src={imgGroup1597881806} />
+              </div>
+            </div>
+            <div className="col-[1] ml-0 mt-0 relative row-[1] size-[17px]" data-name="圆圈圈" data-node-id="741:53539">
+              <img alt="" className="block max-w-none size-full" src={img2} />
+            </div>
+          </div>
+        </div>
+      </div>
+      <div className="h-[320px] relative shrink-0 w-[476px]" data-name="框" data-node-id="741:53541">
+        <div className="absolute inset-[-0.06%_-0.09%_-0.06%_-0.04%]">
+          <img alt="" className="block max-w-none size-full" src={img3} />
+        </div>
+      </div>
+    </div>
+  );
+}
+
+function Component3({ className }: { className?: string }) {
+  return (
+    <div className={className} data-name="定位点/产业链" data-node-id="1205:31870">
+      <div className="absolute inset-[10%_13.79%]" data-name="底部" data-node-id="1201:48987">
+        <img alt="" className="block max-w-none size-full" src={img4} />
+      </div>
+      <div className="absolute bottom-[40.42%] left-1/4 overflow-clip right-1/4 shadow-[0px_0px_6px_0px_#4593ff] top-[17.92%]" data-name="产业链" data-node-id="1205:31863">
+        <div className="absolute inset-[5.36%_10.72%]" data-name="Union" data-node-id="I1205:31863;1205:31861">
+          <img alt="" className="block max-w-none size-full" src={img5} />
+        </div>
+        <div className="absolute inset-0 pointer-events-none shadow-[inset_0px_0px_3px_0px_#ffffff]" />
+      </div>
+    </div>
+  );
+}
+
+function Component4({ className }: { className?: string }) {
+  return (
+    <div className={className} data-name="定位点/基地" data-node-id="1205:31871">
+      <div className="absolute inset-[12.5%_8.66%]" data-node-id="1205:32108">
+        <img alt="" className="block max-w-none size-full" src={imgGroup1597881805} />
+      </div>
+      <div className="absolute inset-[27.5%_23%] overflow-clip" data-name="产业icon" data-node-id="1204:31851">
+        <div className="absolute inset-[13%_21.7%]" data-name="Union" data-node-id="I1204:31851;1198:61730">
+          <div className="absolute inset-[-20.02%_-26.17%]">
+            <img alt="" className="block max-w-none size-full" src={img6} />
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}
+
+function Component5({ className }: { className?: string }) {
+  return (
+    <div className={className} data-name="边" data-node-id="84:21868">
+      <img alt="" className="block max-w-none size-full" src={img7} />
+    </div>
+  );
+}
+
+function Component6({ className }: { className?: string }) {
+  return (
+    <div className={className} data-name="线" data-node-id="84:21850">
+      <div className="absolute inset-[45.14%_13.47%_22.05%_68.8%]" data-name="Union" data-node-id="84:21851">
+        <div className="absolute inset-[-0.28%_-0.28%_-0.27%_-0.35%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion1} />
+        </div>
+      </div>
+      <div className="absolute inset-[69.45%_7.91%_11.34%_79.45%]" data-name="Union" data-node-id="84:21852">
+        <div className="absolute inset-[-0.36%_-0.44%_-0.33%_-0.45%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion2} />
+        </div>
+      </div>
+      <div className="absolute bottom-[58.34%] left-[13.82%] right-[58.52%] top-0" data-name="Union" data-node-id="84:21853">
+        <div className="absolute inset-[-0.16%_-0.17%_-0.16%_-0.25%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion3} />
+        </div>
+      </div>
+      <div className="absolute inset-[40.22%_52.11%_21.49%_24.35%]" data-name="Union" data-node-id="84:21854">
+        <div className="absolute inset-[-0.17%_-0.21%_-0.2%_-0.28%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion4} />
+        </div>
+      </div>
+      <div className="absolute inset-[15.1%_38.74%_51.84%_30.9%]" data-name="Union" data-node-id="84:21855">
+        <div className="absolute inset-[-0.2%_-0.17%_-0.22%_-0.17%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion5} />
+        </div>
+      </div>
+      <div className="absolute inset-[62.63%_13.38%_23.24%_79.12%]" data-name="Union" data-node-id="84:21856">
+        <div className="absolute inset-[-0.45%_-0.62%_-0.6%_-0.65%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion6} />
+        </div>
+      </div>
+      <div className="absolute inset-[39.2%_33.9%_32.16%_45.04%]" data-name="Union" data-node-id="84:21857">
+        <div className="absolute inset-[-0.26%_-0.43%_-0.35%_-0.33%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion7} />
+        </div>
+      </div>
+      <div className="absolute inset-[33.43%_19.83%_31.88%_63.81%]" data-name="Union" data-node-id="84:21858">
+        <div className="absolute inset-[-0.19%_-0.36%_-0.2%_-0.31%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion8} />
+        </div>
+      </div>
+      <div className="absolute inset-[61.63%_26.15%_9.48%_37%]" data-name="Union" data-node-id="84:21859">
+        <div className="absolute inset-[-0.27%_-0.13%_-0.27%_-0.21%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion9} />
+        </div>
+      </div>
+      <div className="absolute bottom-[16.35%] left-[77.75%] right-0 top-[39.25%]" data-name="Union" data-node-id="84:21860">
+        <div className="absolute inset-[-0.15%_-0.22%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion10} />
+        </div>
+      </div>
+      <div className="absolute bottom-0 left-[66.67%] right-[14.92%] top-[70.14%]" data-name="Union" data-node-id="84:21861">
+        <div className="absolute inset-[-0.22%_-0.27%_-0.22%_-0.26%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion11} />
+        </div>
+      </div>
+      <div className="absolute inset-[19.86%_25.75%_54.08%_56.23%]" data-name="Union" data-node-id="84:21862">
+        <div className="absolute inset-[-0.28%_-0.27%_-0.49%_-0.27%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion12} />
+        </div>
+      </div>
+      <div className="absolute bottom-[2%] left-0 right-[70.7%] top-[44.26%]" data-name="Union" data-node-id="84:21863">
+        <div className="absolute inset-[-0.12%_-0.16%_-0.14%_-0.18%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion13} />
+        </div>
+      </div>
+      <div className="absolute inset-[64.64%_29.68%_24.46%_58.95%]" data-name="Union" data-node-id="84:21864">
+        <div className="absolute inset-[-0.59%_-0.41%_-0.67%_-0.42%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion14} />
+        </div>
+      </div>
+      <div className="absolute inset-[61.94%_39.82%_24.69%_53.29%]" data-name="Union" data-node-id="84:21865">
+        <div className="absolute inset-[-0.64%_-0.74%_-0.48%_-0.82%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion15} />
+        </div>
+      </div>
+      <div className="absolute inset-[55.88%_34.28%_31.77%_54.46%]" data-name="Union" data-node-id="84:21866">
+        <div className="absolute inset-[-0.54%_-0.41%_-0.57%_-0.41%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion16} />
+        </div>
+      </div>
+      <div className="absolute inset-[33.35%_66.33%_53.33%_20.28%]" data-name="Union" data-node-id="84:21867">
+        <div className="absolute inset-[-0.55%_-0.49%_-0.53%_-0.4%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion17} />
+        </div>
+      </div>
+    </div>
+  );
+}
+
+function Component7({ className }: { className?: string }) {
+  return (
+    <div className={className} data-name="导航底框" data-node-id="631:36462">
+      <div className="absolute bottom-[18.95%] left-0 right-0 top-0" data-name="1" data-node-id="631:36440">
+        <div className="absolute inset-[-181.3%_-19.68%_-413.77%_-19.68%]">
+          <img alt="" className="block max-w-none size-full" src={img8} />
+        </div>
+      </div>
+      <div className="absolute bottom-0 left-[27.44%] right-[27.44%] top-[62.9%]" data-node-id="631:36441">
+        <div className="absolute inset-[-257.75%_-17.4%]">
+          <img alt="" className="block max-w-none size-full" src={imgGroup1158} />
+        </div>
+      </div>
+    </div>
+  );
+}
+
+function Component8({ className }: { className?: string }) {
+  return (
+    <div className={className} data-name="底部网格" data-node-id="631:69869">
+      <div className="absolute bottom-[-71.42%] content-stretch flex flex-col items-start left-0 mask-alpha mask-intersect mask-no-clip mask-no-repeat mask-position-[0px_175.624px] mask-size-[1920px_1080px] right-0 top-[-16.26%]" data-name="底部内容" data-node-id="631:69865" style={{ maskImage: `url('${img9}')` }}>
+        <div className="h-[1013.464px] relative shrink-0 w-[1920px]" data-name="网格" data-node-id="631:69866">
+          <img alt="" className="block max-w-none size-full" src={img10} />
+        </div>
+        <div className="h-[1013.464px] relative shrink-0 w-[1920px]" data-name="网格" data-node-id="631:69867">
+          <img alt="" className="block max-w-none size-full" src={img10} />
+        </div>
+      </div>
+    </div>
+  );
+}
+type Component9Props = {
+  className?: string;
+  property1?: "供应链专用界面";
+};
+
+function Component9({ className, property1 = "供应链专用界面" }: Component9Props) {
+  return (
+    <div className={className} data-name="Property 1=供应链专用界面" data-node-id="1486:134453">
+      <div aria-hidden="true" className="absolute inset-0 pointer-events-none">
+        <img alt="" className="absolute max-w-none object-50%-50% object-cover size-full" src={imgProperty1} />
+        <div className="absolute bg-[rgba(0,79,154,0.1)] inset-0" />
+      </div>
+      <div className="absolute contents left-0 top-0" data-node-id="1486:133993" />
+    </div>
+  );
+}
+
+export default function Component10() {
+  return (
+    <div className="bg-[rgba(33,33,33,0.6)] relative size-full" data-name="操控屏-3-畜牧•水产-畜牧首页-基地弹出数据" data-node-id="1443:76048">
+      <div className="absolute contents left-0 top-0" data-name="我是底部" data-node-id="I1443:76048;1412:190152">
+        <Component9 className="absolute h-[1080px] left-0 overflow-clip top-0 w-[1920px]" />
+        <Component8 className="absolute h-[1080px] left-0 top-0 w-[1920px]" />
+        <Component7 className="absolute h-[71.119px] left-[526.95px] top-[40px] w-[866.265px]" />
+        <Text className="absolute box-border content-stretch flex gap-[10px] items-center justify-center left-1/2 px-0 py-[4px] top-[40px] translate-x-[-50%]" propValue2="居中对齐" />
+      </div>
+      <div className="absolute contents left-[529.88px] top-[calc(50%+33.79px)] translate-y-[-50%]" data-name="地图" data-node-id="I1443:76048;1412:195780">
+        <div className="absolute contents left-[27.6%] right-[4.17%] top-[calc(50%+33.79px)] translate-y-[-50%]" data-name="地图" data-node-id="I1443:76048;1412:195781">
+          <Component6 className="absolute inset-[19.27%_4.17%_13.01%_27.6%]" />
+          <Component5 className="absolute h-[731.454px] left-[27.6%] right-[4.17%] top-[calc(50%+33.79px)] translate-y-[-50%]" />
+        </div>
+        <Component4 className="absolute h-[48px] left-[1142.89px] top-[717.84px] w-[40px]" />
+        <Component4 className="absolute h-[48px] left-[1664.25px] top-[530.82px] w-[40px]" />
+        <Component4 className="absolute h-[48px] left-[1435px] top-[527.14px] w-[40px]" />
+        <Component4 className="absolute h-[48px] left-[1203.07px] top-[514.31px] w-[40px]" />
+        <Component3 className="absolute h-[48px] left-[1273.12px] top-[551.14px] w-[40px]" />
+        <Component3 className="absolute h-[48px] left-[1403px] top-[597.5px] w-[40px]" />
+        <Component3 className="absolute h-[48px] left-[1694.25px] top-[645.5px] w-[40px]" />
+        <Component3 className="absolute h-[48px] left-[1237.87px] top-[761.84px] w-[40px]" />
+      </div>
+      <div className="absolute bottom-[80px] content-stretch flex items-center left-1/2 translate-x-[-50%]" data-name="说明" data-node-id="I1443:76048;1412:195792">
+        <div className="box-border content-stretch flex gap-[20px] h-[54px] items-center justify-center px-[20px] py-0 relative rounded-[10px] shrink-0 w-[202px]" data-name="111" data-node-id="I1443:76048;1412:195793">
+          <Component4 className="h-[50px] relative shrink-0 w-[41.667px]" />
+          <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="26px" />
+        </div>
+        <div className="box-border content-stretch flex gap-[20px] h-[54px] items-center justify-center px-[20px] py-0 relative rounded-[10px] shrink-0 w-[202px]" data-name="112" data-node-id="I1443:76048;1412:195796">
+          <Component3 className="h-[50px] relative shrink-0 w-[41.667px]" />
+          <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="26px" />
+        </div>
+      </div>
+      <div className="absolute content-stretch flex flex-col gap-[10px] items-end right-[80px] top-[150px]" data-name="1+！" data-node-id="I1443:76048;1412:190177">
+        <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
+        <Text className="box-border content-stretch flex gap-[10px] h-[77px] items-center justify-end px-0 py-[4px] relative shrink-0 w-full" propValue2="右对齐" />
+        <Text className="box-border content-stretch flex gap-[10px] items-center justify-end px-0 py-[4px] relative shrink-0" propValue2="右对齐" />
+      </div>
+      <div className="absolute h-[351px] left-[943.94px] overflow-clip top-[420.75px] w-[580px]" data-name="基地弹出框" data-node-id="I1443:76048;1412:190230">
+        <div className="absolute flex items-center justify-center left-0 top-0">
+          <div className="flex-none rotate-[180deg]">
+            <Component2 className="content-stretch flex items-start overflow-clip relative" />
+          </div>
+        </div>
+        <div className="absolute content-stretch flex flex-col gap-[10px] items-center left-[30px] top-[calc(50%+-15.5px)] translate-y-[-50%] w-[420px]" data-name="粮食源头" data-node-id="I1443:76048;1700:136564">
+          <div className="content-stretch flex flex-col items-start relative shrink-0 w-full" data-node-id="I1443:76048;1700:136565">
+            <Text className="box-border content-stretch flex gap-[10px] h-[62px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
+            <Text className="box-border content-stretch flex gap-[10px] h-[62px] items-center px-0 py-[4px] relative shrink-0 w-full" propValue="24px" />
+          </div>
+          <div className="content-stretch flex flex-col gap-[6px] items-start relative shrink-0 w-full" data-node-id="I1443:76048;1700:136568">
+            <div className="content-stretch flex gap-[20px] items-start relative shrink-0" data-node-id="I1443:76048;1700:136569">
+              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
+              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" />
+              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
+            </div>
+            <div className="content-stretch flex gap-[20px] items-start relative shrink-0" data-node-id="I1443:76048;1700:136656">
+              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
+              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" />
+              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
+            </div>
+            <div className="content-stretch flex gap-[20px] items-start relative shrink-0" data-node-id="I1443:76048;1700:136762">
+              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
+              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" />
+              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
+            </div>
+          </div>
+        </div>
+      </div>
+      <div className="absolute content-stretch flex flex-col gap-[11px] items-start left-[199.88px] top-[calc(50%+4.02px)] translate-y-[-50%] w-[330px]" data-name="组合1" data-node-id="I1443:76048;1412:195584">
+        <Text className="box-border content-stretch flex gap-[10px] h-[80px] items-center px-[26px] py-[4px] relative shrink-0 w-full" />
+        <div className="grid-cols-[max-content] grid-rows-[max-content] inline-grid justify-items-start leading-[0] relative shrink-0" data-name="框框数据1" data-node-id="I1443:76048;1412:195586">
+          <div className="box-border col-[1] content-stretch flex flex-col h-[700px] items-center justify-between ml-0 mt-0 px-0 py-[20px] relative row-[1] w-[330px]" data-node-id="I1443:76048;1412:195588">
+            <div className="box-border content-stretch flex flex-col gap-[20px] items-start px-0 py-[20px] relative shrink-0 w-[278px]" data-name="总产值达" data-node-id="I1443:76048;1412:195589">
+              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0 w-full" />
+              <div className="content-stretch flex gap-[10px] h-[80px] items-end relative shrink-0 w-full" data-name="数据金额" data-node-id="I1443:76048;1412:195591">
+                <div className="content-stretch flex gap-[6px] items-center relative shrink-0" data-name="1" data-node-id="I1443:76048;1412:195592">
+                  <Component1 className="h-[80px] relative shrink-0 w-[53.333px]" />
+                  <Component1 className="h-[80px] relative shrink-0 w-[53.333px]" />
+                </div>
+                <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
+              </div>
+            </div>
+            <div className="box-border content-stretch flex flex-col gap-[20px] items-start px-0 py-[20px] relative shrink-0 w-[278px]" data-name="总产值达" data-node-id="I1443:76048;1412:195603">
+              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0 w-full" />
+              <div className="content-stretch flex gap-[10px] h-[80px] items-end relative shrink-0 w-full" data-name="数据金额" data-node-id="I1443:76048;1412:195605">
+                <div className="content-stretch flex gap-[6px] items-center relative shrink-0" data-name="1" data-node-id="I1443:76048;1412:195606">
+                  <Component1 className="h-[80px] relative shrink-0 w-[53.333px]" />
+                </div>
+                <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
+              </div>
+            </div>
+            <div className="box-border content-stretch flex flex-col gap-[20px] items-start px-0 py-[20px] relative shrink-0 w-[278px]" data-name="总产值达" data-node-id="I1443:76048;1412:195617">
+              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0 w-full" />
+              <div className="content-stretch flex gap-[10px] h-[80px] items-end relative shrink-0 w-full" data-name="数据金额" data-node-id="I1443:76048;1412:195619">
+                <div className="content-stretch flex gap-[6px] items-center relative shrink-0" data-name="1" data-node-id="I1443:76048;1412:195621">
+                  <Component1 className="h-[80px] relative shrink-0 w-[53.333px]" />
+                  <Component1 className="h-[80px] relative shrink-0 w-[53.333px]" />
+                </div>
+                <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+      <Component className="absolute h-[1078.893px] left-[40px] top-0 w-[150.879px]" />
+    </div>
+  );
+}
+SUPER CRITICAL: The generated React+Tailwind code MUST be converted to match the target project's technology stack and styling system.
+1. Analyze the target codebase to identify: technology stack, styling approach, component patterns, and design tokens
+2. Convert React syntax to the target framework/library
+3. Transform all Tailwind classes to the target styling system while preserving exact visual design
+4. Follow the project's existing patterns and conventions
+DO NOT install any Tailwind as a dependency unless the user instructs you to do so.
+
+Node ids have been added to the code as data attributes, e.g. `data-node-id="1:2"`.
+These styles are contained in the design: 文字颜色/2-100%白色: #FFFFFF, 渐变/2-蓝色: , 边框-蓝色: #133BA0, 主色/icon色: , 文字颜色/3-50%白色: #FFFFFF, 主色/主色-2亮绿: #00FFFF, 主色/产业-畜牧: #F593A5.
+Images and SVGs will be stored as constants, e.g. const image = 'https://www.figma.com/api/mcp/asset/550e8400-e29b-41d4-a716-446655440000'. These constants will be used in the code as the source for the image, ex: <img src={image} />. Image assets are stored on a remote server for 7 days and can be fetched using the provided URLs until they expire.
+IMPORTANT: After you call this tool, you MUST call get_screenshot to get a screenshot of the node for context.

docs/figma-jsx/种业.md

@@ -0,0 +1,439 @@
+const imgProperty1 = "https://www.figma.com/api/mcp/asset/87856a0b-f34b-4765-b551-40cc84fcd209";
+const imgUnion = "https://www.figma.com/api/mcp/asset/8c591b74-7bae-4158-b8b5-8db25caba320";
+const img = "https://www.figma.com/api/mcp/asset/b739f303-d22d-4089-9e82-90a396198c7d";
+const img1 = "https://www.figma.com/api/mcp/asset/e483e868-a149-45c2-ac0e-eac64e1ab210";
+const imgGroup1597881806 = "https://www.figma.com/api/mcp/asset/81d458a5-f3a1-4300-b4b4-965729c0a641";
+const img2 = "https://www.figma.com/api/mcp/asset/7d8835c6-a516-49d3-8f0f-1099df7593a0";
+const img3 = "https://www.figma.com/api/mcp/asset/8676d1dd-ea43-4448-9f78-daa3a9d6e869";
+const img4 = "https://www.figma.com/api/mcp/asset/5519a672-8a4e-4a0b-8a72-fe9e49a97d4a";
+const img5 = "https://www.figma.com/api/mcp/asset/eb8c9635-a13f-430b-be82-83ea70e90106";
+const imgGroup1597881805 = "https://www.figma.com/api/mcp/asset/172045fd-44df-4bbb-8d27-8d0b180229b3";
+const img6 = "https://www.figma.com/api/mcp/asset/6b283b86-b80e-45c2-8a6f-dca28327345c";
+const img7 = "https://www.figma.com/api/mcp/asset/267e9f23-e79e-41fe-8a1f-a957b8fad5d7";
+const imgUnion1 = "https://www.figma.com/api/mcp/asset/aafbd6ca-f85d-42fe-b418-dc30052e84fb";
+const imgUnion2 = "https://www.figma.com/api/mcp/asset/55eb6770-bb8a-472b-a6d5-19057c3dbb9e";
+const imgUnion3 = "https://www.figma.com/api/mcp/asset/29728396-6e97-44d1-b2ee-2e4819ecde7a";
+const imgUnion4 = "https://www.figma.com/api/mcp/asset/9dc78fcd-a46f-435c-84f7-58dec056557b";
+const imgUnion5 = "https://www.figma.com/api/mcp/asset/dfb1eaf1-fb1a-4bcd-aa98-587690df6092";
+const imgUnion6 = "https://www.figma.com/api/mcp/asset/ed55e539-1df7-436a-b1f0-235c4805eca2";
+const imgUnion7 = "https://www.figma.com/api/mcp/asset/339154e6-1b1f-4fa4-b9a8-62dd67bcd096";
+const imgUnion8 = "https://www.figma.com/api/mcp/asset/4dfd2f47-f9f2-4020-8d8e-5490a6926533";
+const imgUnion9 = "https://www.figma.com/api/mcp/asset/4819cd4f-2bd2-4f85-9bd7-f2564133ac7a";
+const imgUnion10 = "https://www.figma.com/api/mcp/asset/e3523f9a-e402-44a7-bf80-07cc1cf927fd";
+const imgUnion11 = "https://www.figma.com/api/mcp/asset/25fb95b0-5273-4e9e-8ccf-147fd8a9032b";
+const imgUnion12 = "https://www.figma.com/api/mcp/asset/80e920c5-0947-4b47-b626-93e5f3eff400";
+const imgUnion13 = "https://www.figma.com/api/mcp/asset/080e349c-771e-4dc6-bcef-ea11cfb86473";
+const imgUnion14 = "https://www.figma.com/api/mcp/asset/d857d54c-f3e5-4401-b17a-34c8722b9fa7";
+const imgUnion15 = "https://www.figma.com/api/mcp/asset/6fdbda6a-a911-48a9-b62b-56051700537a";
+const imgUnion16 = "https://www.figma.com/api/mcp/asset/a7bfd856-a00b-47f7-a21d-fe4fc4450318";
+const imgUnion17 = "https://www.figma.com/api/mcp/asset/4b9c4859-31bf-4624-9f44-56d09821da82";
+const img8 = "https://www.figma.com/api/mcp/asset/e1846ff4-73ec-45b0-b27c-f62bfbe11a16";
+const imgGroup1158 = "https://www.figma.com/api/mcp/asset/dee2a79d-90a3-4294-a060-523f9893d457";
+const img9 = "https://www.figma.com/api/mcp/asset/d76f8d35-ce1f-4f25-b48c-473ec91e7531";
+const img10 = "https://www.figma.com/api/mcp/asset/a7a109e5-dc8f-4f44-9137-0aab121c1619";
+type iconProps = {
+  className?: string;
+  property1?: "果蔬" | "油脂" | "种业" | "粮食";
+};
+
+function icon({ className, property1 = "粮食" }: iconProps) {
+  return (
+    <div className={className} data-name="Property 1=粮食" data-node-id="1201:31235">
+      <div className="absolute inset-[13%_21.7%]" data-name="Union" data-node-id="1198:61730">
+        <img alt="" className="block max-w-none size-full" src={imgUnion} />
+      </div>
+    </div>
+  );
+}
+type ComponentProps = {
+  className?: string;
+  property1?: "上";
+};
+
+function Component({ className, property1 = "上" }: ComponentProps) {
+  return (
+    <div className={className} data-name="Property 1=上" data-node-id="1201:48133">
+      <div className="absolute content-stretch flex flex-col gap-[40px] h-[944px] items-center justify-center left-0 right-[37.7%] top-1/2 translate-y-[-50%]" data-name="导航内容" data-node-id="1201:47870">
+        <div className="bg-[rgba(255,255,255,0.05)] box-border content-stretch flex flex-col gap-[20px] h-[220px] items-center justify-center px-[20px] py-0 relative rounded-[10px] shrink-0 w-[60px]" data-name="111" data-node-id="1201:47862">
+          <icon className="overflow-clip relative shrink-0 size-[50px]" />
+          <div className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" data-name="text" data-node-id="1201:47859">
+            <div className="flex flex-col font-['HarmonyOS_Sans_SC:Bold',sans-serif] justify-center leading-[32px] not-italic relative shrink-0 text-[26px] text-white whitespace-nowrap" data-node-id="I1201:47859;635:42944">
+              <p className="mb-0">粮</p>
+              <p className="mb-0">&nbsp;</p>
+              <p>食</p>
+            </div>
+          </div>
+        </div>
+        <div className="box-border content-stretch flex flex-col gap-[20px] h-[220px] items-center justify-center px-[20px] py-0 relative rounded-[10px] shrink-0 w-[60px]" data-name="222" data-node-id="1201:47864">
+          <div className="overflow-clip relative shrink-0 size-[50px]" data-name="产业icon" data-node-id="1201:47865">
+            <div className="absolute inset-[13%_26.2%]" data-name="Vector" data-node-id="I1201:47865;1200:31218">
+              <div className="absolute inset-0" style={{ "--fill-0": "rgba(255, 255, 255, 1)" } as React.CSSProperties}>
+                <img alt="" className="block max-w-none size-full" src={img} />
+              </div>
+            </div>
+          </div>
+          <div className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" data-name="text" data-node-id="1201:47866">
+            <div className="flex flex-col font-['HarmonyOS_Sans_SC:Bold',sans-serif] justify-center leading-[32px] not-italic relative shrink-0 text-[26px] text-[rgba(255,255,255,0.5)] whitespace-nowrap" data-node-id="I1201:47866;635:42944">
+              <p className="mb-0">油</p>
+              <p className="mb-0">&nbsp;</p>
+              <p>脂</p>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div className="absolute bottom-0 flex items-center justify-center left-[25.05%] right-0 top-0">
+        <div className="flex-none h-[1078.893px] rotate-[180deg] scale-y-[-100%] w-[113.088px]">
+          <div className="relative size-full" data-name="光标左侧" data-node-id="1201:48121">
+            <div className="absolute bottom-[-0.04%] left-0 right-0 top-[-0.04%]">
+              <img alt="" className="block max-w-none size-full" src={img1} />
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}
+type TextProps = {
+  className?: string;
+  propValue?: "24px" | "26px" | "34px";
+  propValue1?: "特粗";
+  propValue2?: "左对齐" | "右对齐" | "居中对齐";
+};
+
+function Text({ className, propValue = "34px", propValue1 = "特粗", propValue2 = "左对齐" }: TextProps) {
+  if (propValue === "24px" && propValue1 === "特粗" && propValue2 === "左对齐") {
+    return (
+      <div className={className} data-name="字号=24px, 字重=特粗, 位置=左对齐" data-node-id="632:88182">
+        <div className="flex flex-col font-['HarmonyOS_Sans_SC:Bold',sans-serif] justify-center leading-[0] not-italic relative shrink-0 text-[24px] text-white whitespace-nowrap" data-node-id="632:88183">
+          <p className="leading-[32px]">Text line-24px</p>
+        </div>
+      </div>
+    );
+  }
+  if (propValue === "26px" && propValue1 === "特粗" && propValue2 === "左对齐") {
+    return (
+      <div className={className} data-name="字号=26px, 字重=特粗, 位置=左对齐" data-node-id="635:42943">
+        <div className="flex flex-col font-['HarmonyOS_Sans_SC:Bold',sans-serif] justify-center leading-[0] not-italic relative shrink-0 text-[26px] text-white whitespace-nowrap" data-node-id="635:42944">
+          <p className="leading-[32px]">Text line-26px</p>
+        </div>
+      </div>
+    );
+  }
+  if (propValue === "34px" && propValue1 === "特粗" && propValue2 === "居中对齐") {
+    return (
+      <div className={className} data-name="字号=34px, 字重=特粗, 位置=居中对齐" data-node-id="635:42955">
+        <div className="flex flex-col font-['HarmonyOS_Sans_SC:Bold',sans-serif] justify-center leading-[0] not-italic relative shrink-0 text-[34px] text-center text-white whitespace-nowrap" data-node-id="635:42956">
+          <p className="leading-[32px]">Text line-34px</p>
+        </div>
+      </div>
+    );
+  }
+  if (propValue === "34px" && propValue1 === "特粗" && propValue2 === "右对齐") {
+    return (
+      <div className={className} data-name="字号=34px, 字重=特粗, 位置=右对齐" data-node-id="635:42959">
+        <div className="flex flex-col font-['HarmonyOS_Sans_SC:Bold',sans-serif] justify-center leading-[0] not-italic relative shrink-0 text-[34px] text-right text-white whitespace-nowrap" data-node-id="635:42960">
+          <p className="leading-[32px]">Text line-34px</p>
+        </div>
+      </div>
+    );
+  }
+  return (
+    <div className={className} data-name="字号=34px, 字重=特粗, 位置=左对齐" data-node-id="635:42949">
+      <div className="flex flex-col font-['HarmonyOS_Sans_SC:Bold',sans-serif] justify-center leading-[0] not-italic relative shrink-0 text-[34px] text-white whitespace-nowrap" data-node-id="635:42950">
+        <p className="leading-[32px]">Text line-34px</p>
+      </div>
+    </div>
+  );
+}
+
+function Component2({ className }: { className?: string }) {
+  return (
+    <div className={className} data-name="弹出框样式2" data-node-id="741:54163">
+      <div className="flex h-[calc(1px*((var(--transform-inner-width)*1)+(var(--transform-inner-height)*0)))] items-center justify-center leading-[0] relative shrink-0 w-[calc(1px*((var(--transform-inner-height)*1)+(var(--transform-inner-width)*0)))]">
+        <div className="flex-none rotate-[90deg] scale-y-[-100%]">
+          <div className="grid-cols-[max-content] grid-rows-[max-content] inline-grid justify-items-start relative" data-node-id="1207:33739">
+            <div className="col-[1] h-[80px] ml-[7.5px] mt-[17px] relative row-[1] w-[2px]" data-node-id="1207:33513">
+              <div className="absolute bottom-[-1.25%] left-0 right-[-50%] top-[-1.25%]">
+                <img alt="" className="block max-w-none size-full" src={imgGroup1597881806} />
+              </div>
+            </div>
+            <div className="col-[1] ml-0 mt-0 relative row-[1] size-[17px]" data-name="圆圈圈" data-node-id="741:53539">
+              <img alt="" className="block max-w-none size-full" src={img2} />
+            </div>
+          </div>
+        </div>
+      </div>
+      <div className="h-[320px] relative shrink-0 w-[476px]" data-name="框" data-node-id="741:53541">
+        <div className="absolute inset-[-0.06%_-0.09%_-0.06%_-0.04%]">
+          <img alt="" className="block max-w-none size-full" src={img3} />
+        </div>
+      </div>
+    </div>
+  );
+}
+
+function Component1({ className }: { className?: string }) {
+  return (
+    <div className={className} data-name="定位点/产业链" data-node-id="1205:31870">
+      <div className="absolute inset-[10%_13.79%]" data-name="底部" data-node-id="1201:48987">
+        <img alt="" className="block max-w-none size-full" src={img4} />
+      </div>
+      <div className="absolute bottom-[40.42%] left-1/4 overflow-clip right-1/4 shadow-[0px_0px_6px_0px_#4593ff] top-[17.92%]" data-name="产业链" data-node-id="1205:31863">
+        <div className="absolute inset-[5.36%_10.72%]" data-name="Union" data-node-id="I1205:31863;1205:31861">
+          <img alt="" className="block max-w-none size-full" src={img5} />
+        </div>
+        <div className="absolute inset-0 pointer-events-none shadow-[inset_0px_0px_3px_0px_#ffffff]" />
+      </div>
+    </div>
+  );
+}
+
+function Component3({ className }: { className?: string }) {
+  return (
+    <div className={className} data-name="定位点/基地" data-node-id="1205:31871">
+      <div className="absolute inset-[12.5%_8.66%]" data-node-id="1205:32108">
+        <img alt="" className="block max-w-none size-full" src={imgGroup1597881805} />
+      </div>
+      <div className="absolute inset-[27.5%_23%] overflow-clip" data-name="产业icon" data-node-id="1204:31851">
+        <div className="absolute inset-[13%_21.7%]" data-name="Union" data-node-id="I1204:31851;1198:61730">
+          <div className="absolute inset-[-20.02%_-26.17%]">
+            <img alt="" className="block max-w-none size-full" src={img6} />
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}
+
+function Component4({ className }: { className?: string }) {
+  return (
+    <div className={className} data-name="边" data-node-id="84:21868">
+      <img alt="" className="block max-w-none size-full" src={img7} />
+    </div>
+  );
+}
+
+function Component5({ className }: { className?: string }) {
+  return (
+    <div className={className} data-name="线" data-node-id="84:21850">
+      <div className="absolute inset-[45.14%_13.47%_22.05%_68.8%]" data-name="Union" data-node-id="84:21851">
+        <div className="absolute inset-[-0.28%_-0.28%_-0.27%_-0.35%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion1} />
+        </div>
+      </div>
+      <div className="absolute inset-[69.45%_7.91%_11.34%_79.45%]" data-name="Union" data-node-id="84:21852">
+        <div className="absolute inset-[-0.36%_-0.44%_-0.33%_-0.45%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion2} />
+        </div>
+      </div>
+      <div className="absolute bottom-[58.34%] left-[13.82%] right-[58.52%] top-0" data-name="Union" data-node-id="84:21853">
+        <div className="absolute inset-[-0.16%_-0.17%_-0.16%_-0.25%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion3} />
+        </div>
+      </div>
+      <div className="absolute inset-[40.22%_52.11%_21.49%_24.35%]" data-name="Union" data-node-id="84:21854">
+        <div className="absolute inset-[-0.17%_-0.21%_-0.2%_-0.28%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion4} />
+        </div>
+      </div>
+      <div className="absolute inset-[15.1%_38.74%_51.84%_30.9%]" data-name="Union" data-node-id="84:21855">
+        <div className="absolute inset-[-0.2%_-0.17%_-0.22%_-0.17%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion5} />
+        </div>
+      </div>
+      <div className="absolute inset-[62.63%_13.38%_23.24%_79.12%]" data-name="Union" data-node-id="84:21856">
+        <div className="absolute inset-[-0.45%_-0.62%_-0.6%_-0.65%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion6} />
+        </div>
+      </div>
+      <div className="absolute inset-[39.2%_33.9%_32.16%_45.04%]" data-name="Union" data-node-id="84:21857">
+        <div className="absolute inset-[-0.26%_-0.43%_-0.35%_-0.33%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion7} />
+        </div>
+      </div>
+      <div className="absolute inset-[33.43%_19.83%_31.88%_63.81%]" data-name="Union" data-node-id="84:21858">
+        <div className="absolute inset-[-0.19%_-0.36%_-0.2%_-0.31%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion8} />
+        </div>
+      </div>
+      <div className="absolute inset-[61.63%_26.15%_9.48%_37%]" data-name="Union" data-node-id="84:21859">
+        <div className="absolute inset-[-0.27%_-0.13%_-0.27%_-0.21%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion9} />
+        </div>
+      </div>
+      <div className="absolute bottom-[16.35%] left-[77.75%] right-0 top-[39.25%]" data-name="Union" data-node-id="84:21860">
+        <div className="absolute inset-[-0.15%_-0.22%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion10} />
+        </div>
+      </div>
+      <div className="absolute bottom-0 left-[66.67%] right-[14.92%] top-[70.14%]" data-name="Union" data-node-id="84:21861">
+        <div className="absolute inset-[-0.22%_-0.27%_-0.22%_-0.26%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion11} />
+        </div>
+      </div>
+      <div className="absolute inset-[19.86%_25.75%_54.08%_56.23%]" data-name="Union" data-node-id="84:21862">
+        <div className="absolute inset-[-0.28%_-0.27%_-0.49%_-0.27%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion12} />
+        </div>
+      </div>
+      <div className="absolute bottom-[2%] left-0 right-[70.7%] top-[44.26%]" data-name="Union" data-node-id="84:21863">
+        <div className="absolute inset-[-0.12%_-0.16%_-0.14%_-0.18%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion13} />
+        </div>
+      </div>
+      <div className="absolute inset-[64.64%_29.68%_24.46%_58.95%]" data-name="Union" data-node-id="84:21864">
+        <div className="absolute inset-[-0.59%_-0.41%_-0.67%_-0.42%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion14} />
+        </div>
+      </div>
+      <div className="absolute inset-[61.94%_39.82%_24.69%_53.29%]" data-name="Union" data-node-id="84:21865">
+        <div className="absolute inset-[-0.64%_-0.74%_-0.48%_-0.82%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion15} />
+        </div>
+      </div>
+      <div className="absolute inset-[55.88%_34.28%_31.77%_54.46%]" data-name="Union" data-node-id="84:21866">
+        <div className="absolute inset-[-0.54%_-0.41%_-0.57%_-0.41%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion16} />
+        </div>
+      </div>
+      <div className="absolute inset-[33.35%_66.33%_53.33%_20.28%]" data-name="Union" data-node-id="84:21867">
+        <div className="absolute inset-[-0.55%_-0.49%_-0.53%_-0.4%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion17} />
+        </div>
+      </div>
+    </div>
+  );
+}
+
+function Component6({ className }: { className?: string }) {
+  return (
+    <div className={className} data-name="导航底框" data-node-id="631:36462">
+      <div className="absolute bottom-[18.95%] left-0 right-0 top-0" data-name="1" data-node-id="631:36440">
+        <div className="absolute inset-[-181.3%_-19.68%_-413.77%_-19.68%]">
+          <img alt="" className="block max-w-none size-full" src={img8} />
+        </div>
+      </div>
+      <div className="absolute bottom-0 left-[27.44%] right-[27.44%] top-[62.9%]" data-node-id="631:36441">
+        <div className="absolute inset-[-257.75%_-17.4%]">
+          <img alt="" className="block max-w-none size-full" src={imgGroup1158} />
+        </div>
+      </div>
+    </div>
+  );
+}
+
+function Component7({ className }: { className?: string }) {
+  return (
+    <div className={className} data-name="底部网格" data-node-id="631:69869">
+      <div className="absolute bottom-[-71.42%] content-stretch flex flex-col items-start left-0 mask-alpha mask-intersect mask-no-clip mask-no-repeat mask-position-[0px_175.624px] mask-size-[1920px_1080px] right-0 top-[-16.26%]" data-name="底部内容" data-node-id="631:69865" style={{ maskImage: `url('${img9}')` }}>
+        <div className="h-[1013.464px] relative shrink-0 w-[1920px]" data-name="网格" data-node-id="631:69866">
+          <img alt="" className="block max-w-none size-full" src={img10} />
+        </div>
+        <div className="h-[1013.464px] relative shrink-0 w-[1920px]" data-name="网格" data-node-id="631:69867">
+          <img alt="" className="block max-w-none size-full" src={img10} />
+        </div>
+      </div>
+    </div>
+  );
+}
+type Component8Props = {
+  className?: string;
+  property1?: "供应链专用界面";
+};
+
+function Component8({ className, property1 = "供应链专用界面" }: Component8Props) {
+  return (
+    <div className={className} data-name="Property 1=供应链专用界面" data-node-id="1486:134453">
+      <div aria-hidden="true" className="absolute inset-0 pointer-events-none">
+        <img alt="" className="absolute max-w-none object-50%-50% object-cover size-full" src={imgProperty1} />
+        <div className="absolute bg-[rgba(0,79,154,0.1)] inset-0" />
+      </div>
+      <div className="absolute contents left-0 top-0" data-node-id="1486:133993" />
+    </div>
+  );
+}
+
+export default function Component9() {
+  return (
+    <div className="bg-[rgba(33,33,33,0.6)] relative size-full" data-name="操控屏-2-种业•果蔬-种业首页-" data-node-id="1443:70580">
+      <div className="absolute contents left-0 top-0" data-name="我是底部" data-node-id="I1443:70580;1412:183818">
+        <Component8 className="absolute h-[1080px] left-0 overflow-clip top-0 w-[1920px]" />
+        <Component7 className="absolute h-[1080px] left-0 top-0 w-[1920px]" />
+        <Component6 className="absolute h-[71.119px] left-[526.95px] top-[40px] w-[866.265px]" />
+        <Text className="absolute box-border content-stretch flex gap-[10px] items-center justify-center left-1/2 px-0 py-[4px] top-[40px] translate-x-[-50%]" propValue2="居中对齐" />
+      </div>
+      <div className="absolute contents left-[529.88px] top-[calc(50%+33.79px)] translate-y-[-50%]" data-name="地图" data-node-id="I1443:70580;1412:189260">
+        <div className="absolute contents left-[27.6%] right-[4.17%] top-[calc(50%+33.79px)] translate-y-[-50%]" data-name="地图" data-node-id="I1443:70580;1412:189261">
+          <Component5 className="absolute inset-[19.27%_4.17%_13.01%_27.6%]" />
+          <Component4 className="absolute h-[731.454px] left-[27.6%] right-[4.17%] top-[calc(50%+33.79px)] translate-y-[-50%]" />
+        </div>
+        <Component3 className="absolute h-[48px] left-[1142.89px] top-[717.84px] w-[40px]" />
+        <Component3 className="absolute h-[48px] left-[1664.25px] top-[530.82px] w-[40px]" />
+        <Component3 className="absolute h-[48px] left-[1435px] top-[527.14px] w-[40px]" />
+        <Component3 className="absolute h-[48px] left-[1203.07px] top-[514.31px] w-[40px]" />
+        <Component1 className="absolute h-[72px] left-[1273.12px] top-[551.14px] w-[60px]" />
+        <Component1 className="absolute h-[48px] left-[1403px] top-[597.5px] w-[40px]" />
+        <Component1 className="absolute h-[48px] left-[1694.25px] top-[645.5px] w-[40px]" />
+        <Component1 className="absolute h-[48px] left-[1237.87px] top-[761.84px] w-[40px]" />
+      </div>
+      <div className="absolute bottom-[80px] content-stretch flex items-center left-1/2 translate-x-[-50%]" data-name="说明" data-node-id="I1443:70580;1412:189272">
+        <div className="box-border content-stretch flex gap-[20px] h-[54px] items-center justify-center px-[20px] py-0 relative rounded-[10px] shrink-0 w-[202px]" data-name="111" data-node-id="I1443:70580;1412:189273">
+          <Component3 className="h-[50px] relative shrink-0 w-[41.667px]" />
+          <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="26px" />
+        </div>
+        <div className="box-border content-stretch flex gap-[20px] h-[54px] items-center justify-center px-[20px] py-0 relative rounded-[10px] shrink-0 w-[202px]" data-name="112" data-node-id="I1443:70580;1412:189276">
+          <Component1 className="h-[50px] relative shrink-0 w-[41.667px]" />
+          <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="26px" />
+        </div>
+      </div>
+      <div className="absolute content-stretch flex flex-col gap-[10px] items-end right-[80px] top-[150px]" data-name="1+！" data-node-id="I1443:70580;1412:183865">
+        <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
+        <Text className="box-border content-stretch flex gap-[10px] h-[77px] items-center justify-end px-0 py-[4px] relative shrink-0 w-full" propValue2="右对齐" />
+        <Text className="box-border content-stretch flex gap-[10px] items-center justify-end px-0 py-[4px] relative shrink-0" propValue2="右对齐" />
+      </div>
+      <div className="absolute h-[351px] left-[697.87px] overflow-clip top-[272.14px] w-[580px]" data-name="基地弹出框" data-node-id="I1443:70580;1412:183925">
+        <div className="absolute bottom-[31px] flex items-center justify-center left-0">
+          <div className="flex-none rotate-[180deg]">
+            <Component2 className="content-stretch flex items-start overflow-clip relative" />
+          </div>
+        </div>
+        <div className="absolute content-stretch flex flex-col gap-[12px] items-center left-[30px] top-[50px] w-[420px]" data-name="粮食源头" data-node-id="I1443:70580;1700:134693">
+          <div className="content-stretch flex flex-col gap-[12px] items-start relative shrink-0 w-full" data-node-id="I1443:70580;1700:134694">
+            <Text className="box-border content-stretch flex gap-[10px] h-[62px] items-center px-0 py-[4px] relative shrink-0 w-full" propValue="24px" />
+          </div>
+          <div className="content-stretch flex flex-col gap-[12px] items-start relative shrink-0 w-full" data-node-id="I1443:70580;1700:134697">
+            <div className="content-stretch flex gap-[10px] items-start relative shrink-0 w-full" data-node-id="I1443:70580;1700:134698">
+              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0 w-[301px]" propValue="24px" />
+              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" />
+              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
+            </div>
+            <div className="content-stretch flex gap-[10px] items-start relative shrink-0" data-node-id="I1443:70580;1700:134702">
+              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
+              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" />
+              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
+              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
+            </div>
+            <div className="content-stretch flex gap-[10px] items-start relative shrink-0" data-node-id="I1443:70580;1700:134952">
+              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
+              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" />
+              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
+              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
+            </div>
+          </div>
+        </div>
+      </div>
+      <Component className="absolute h-[1078.893px] left-[40px] top-0 w-[150.879px]" />
+    </div>
+  );
+}
+SUPER CRITICAL: The generated React+Tailwind code MUST be converted to match the target project's technology stack and styling system.
+1. Analyze the target codebase to identify: technology stack, styling approach, component patterns, and design tokens
+2. Convert React syntax to the target framework/library
+3. Transform all Tailwind classes to the target styling system while preserving exact visual design
+4. Follow the project's existing patterns and conventions
+DO NOT install any Tailwind as a dependency unless the user instructs you to do so.
+
+Node ids have been added to the code as data attributes, e.g. `data-node-id="1:2"`.
+These styles are contained in the design: 文字颜色/2-100%白色: #FFFFFF, 渐变/2-蓝色: , 边框-蓝色: #133BA0, 主色/icon色: , 文字颜色/3-50%白色: #FFFFFF, 主色/主色-2亮绿: #00FFFF, 主色/产业-种业: #5DEF8B.
+Images and SVGs will be stored as constants, e.g. const image = 'https://www.figma.com/api/mcp/asset/550e8400-e29b-41d4-a716-446655440000'. These constants will be used in the code as the source for the image, ex: <img src={image} />. Image assets are stored on a remote server for 7 days and can be fetched using the provided URLs until they expire.
+IMPORTANT: After you call this tool, you MUST call get_screenshot to get a screenshot of the node for context.

docs/figma-jsx/粮食.md

@@ -0,0 +1,486 @@
+```jsx
+const imgProperty1 = "https://www.figma.com/api/mcp/asset/f1b31b1a-fc46-483d-8c7c-984e9188d0a4";
+const img = "https://www.figma.com/api/mcp/asset/140db880-85c0-42dd-9fb0-d8eca4c5399f";
+const img1 = "https://www.figma.com/api/mcp/asset/7285594c-ec02-4bcd-8abf-d8892ec21897";
+const imgGroup1597881805 = "https://www.figma.com/api/mcp/asset/4461e313-c3a0-4737-8b1c-613f707c6358";
+const img2 = "https://www.figma.com/api/mcp/asset/7d9107e2-d211-42c9-8a1d-d8e69c3fbd05";
+const imgGroup1597881806 = "https://www.figma.com/api/mcp/asset/2350c9be-bbfd-4860-9e88-090700053f3d";
+const img3 = "https://www.figma.com/api/mcp/asset/35a79ca3-fa5d-4311-8cfd-a8c7cb7745fe";
+const img4 = "https://www.figma.com/api/mcp/asset/7888fc0e-a22f-4980-b0e1-0c6a1043a30f";
+const imgUnion = "https://www.figma.com/api/mcp/asset/3eea11b3-4b4d-4cd4-8a96-5b06f96929c4";
+const img5 = "https://www.figma.com/api/mcp/asset/8bd23a84-6799-4c49-a101-cf2afa9646f5";
+const img6 = "https://www.figma.com/api/mcp/asset/23755b5b-f3f4-42a4-b74e-9be6b67dd303";
+const img7 = "https://www.figma.com/api/mcp/asset/33272e19-47ca-49bc-9bc3-af2a98194329";
+const imgUnion1 = "https://www.figma.com/api/mcp/asset/07a5ecd5-f58c-425e-9302-d08ed2a783db";
+const imgUnion2 = "https://www.figma.com/api/mcp/asset/fc99fa61-fe0b-4cb7-a2d7-c5caaba46fc8";
+const imgUnion3 = "https://www.figma.com/api/mcp/asset/b4cda69d-ae1c-4b48-8bd7-a0a69f11b734";
+const imgUnion4 = "https://www.figma.com/api/mcp/asset/1fc6ff05-5916-4af9-9150-ffa6496be462";
+const imgUnion5 = "https://www.figma.com/api/mcp/asset/040ce0a5-e1ec-40e5-951a-f5400a294d91";
+const imgUnion6 = "https://www.figma.com/api/mcp/asset/a60a0ce3-8ccd-411c-a1ac-418a185810a7";
+const imgUnion7 = "https://www.figma.com/api/mcp/asset/6da76aaa-dc39-4688-9fb1-3e74e2868fe4";
+const imgUnion8 = "https://www.figma.com/api/mcp/asset/6f7eb162-4681-4d3f-a7c1-2949ad11d6eb";
+const imgUnion9 = "https://www.figma.com/api/mcp/asset/9c76fa16-d8f9-40ca-8ab0-f793cadd196d";
+const imgUnion10 = "https://www.figma.com/api/mcp/asset/c4c039e0-5722-42eb-901d-adb45bbe9757";
+const imgUnion11 = "https://www.figma.com/api/mcp/asset/9646ef56-5584-42b7-b0d8-227735b58598";
+const imgUnion12 = "https://www.figma.com/api/mcp/asset/8882035f-ad42-42cc-aefb-ff642bbeee22";
+const imgUnion13 = "https://www.figma.com/api/mcp/asset/53b8320f-85d3-4edd-a32c-09dc4f16f264";
+const imgUnion14 = "https://www.figma.com/api/mcp/asset/1ea99b87-975c-4ffe-98f3-4e20c5db5a0b";
+const imgUnion15 = "https://www.figma.com/api/mcp/asset/01b67ffd-c10a-432a-847d-e40f3ba107b7";
+const imgUnion16 = "https://www.figma.com/api/mcp/asset/b3d6bb5b-f99d-4e17-adde-8df68cf618be";
+const imgUnion17 = "https://www.figma.com/api/mcp/asset/ff47fac6-f5b7-49cd-8b9e-16999787785e";
+const img8 = "https://www.figma.com/api/mcp/asset/431ecfa7-8885-4d91-b948-7c00392aebca";
+const imgGroup1158 = "https://www.figma.com/api/mcp/asset/7bd34fa0-835c-4789-be71-f7a6e6f81730";
+const img9 = "https://www.figma.com/api/mcp/asset/2470d904-cd9e-4461-b0dc-648f72ac4158";
+const img10 = "https://www.figma.com/api/mcp/asset/32c15e7f-55e3-49a9-bb3e-9b3189cd3d1d";
+type TextProps = {
+  className?: string;
+  propValue?: "24px" | "26px" | "34px";
+  propValue1?: "特粗";
+  propValue2?: "左对齐" | "右对齐" | "居中对齐";
+};
+
+function Text({ className, propValue = "34px", propValue1 = "特粗", propValue2 = "左对齐" }: TextProps) {
+  if (propValue === "24px" && propValue1 === "特粗" && propValue2 === "左对齐") {
+    return (
+      <div className={className} data-name="字号=24px, 字重=特粗, 位置=左对齐" data-node-id="632:88182">
+        <div className="flex flex-col font-['HarmonyOS_Sans_SC:Bold',sans-serif] justify-center leading-[0] not-italic relative shrink-0 text-[24px] text-white whitespace-nowrap" data-node-id="632:88183">
+          <p className="leading-[32px]">Text line-24px</p>
+        </div>
+      </div>
+    );
+  }
+  if (propValue === "26px" && propValue1 === "特粗" && propValue2 === "左对齐") {
+    return (
+      <div className={className} data-name="字号=26px, 字重=特粗, 位置=左对齐" data-node-id="635:42943">
+        <div className="flex flex-col font-['HarmonyOS_Sans_SC:Bold',sans-serif] justify-center leading-[0] not-italic relative shrink-0 text-[26px] text-white whitespace-nowrap" data-node-id="635:42944">
+          <p className="leading-[32px]">Text line-26px</p>
+        </div>
+      </div>
+    );
+  }
+  if (propValue === "34px" && propValue1 === "特粗" && propValue2 === "居中对齐") {
+    return (
+      <div className={className} data-name="字号=34px, 字重=特粗, 位置=居中对齐" data-node-id="635:42955">
+        <div className="flex flex-col font-['HarmonyOS_Sans_SC:Bold',sans-serif] justify-center leading-[0] not-italic relative shrink-0 text-[34px] text-center text-white whitespace-nowrap" data-node-id="635:42956">
+          <p className="leading-[32px]">Text line-34px</p>
+        </div>
+      </div>
+    );
+  }
+  if (propValue === "34px" && propValue1 === "特粗" && propValue2 === "右对齐") {
+    return (
+      <div className={className} data-name="字号=34px, 字重=特粗, 位置=右对齐" data-node-id="635:42959">
+        <div className="flex flex-col font-['HarmonyOS_Sans_SC:Bold',sans-serif] justify-center leading-[0] not-italic relative shrink-0 text-[34px] text-right text-white whitespace-nowrap" data-node-id="635:42960">
+          <p className="leading-[32px]">Text line-34px</p>
+        </div>
+      </div>
+    );
+  }
+  return (
+    <div className={className} data-name="字号=34px, 字重=特粗, 位置=左对齐" data-node-id="635:42949">
+      <div className="flex flex-col font-['HarmonyOS_Sans_SC:Bold',sans-serif] justify-center leading-[0] not-italic relative shrink-0 text-[34px] text-white whitespace-nowrap" data-node-id="635:42950">
+        <p className="leading-[32px]">Text line-34px</p>
+      </div>
+    </div>
+  );
+}
+
+function Component({ className }: { className?: string }) {
+  return (
+    <div className={className} data-name="数据样式" data-node-id="1201:47976">
+      <div className="absolute bg-gradient-to-b border-2 border-[#5e697e] border-solid from-[#474e60] inset-0 rounded-[6px] to-[#2b2f39]" data-name="11" data-node-id="1201:47971" />
+      <div className="absolute flex flex-col font-['HarmonyOS_Sans_SC:Bold',sans-serif] inset-[16.16%_13.74%] justify-center leading-[0] not-italic text-[60px] text-center text-white tracking-[6px]" data-node-id="1201:47972">
+        <p className="leading-[normal] whitespace-pre-wrap">6</p>
+      </div>
+    </div>
+  );
+}
+
+function Component1({ className }: { className?: string }) {
+  return (
+    <div className={className} data-name="定位点/产业链" data-node-id="1205:31870">
+      <div className="absolute inset-[10%_13.79%]" data-name="底部" data-node-id="1201:48987">
+        <img alt="" className="block max-w-none size-full" src={img} />
+      </div>
+      <div className="absolute bottom-[40.42%] left-1/4 overflow-clip right-1/4 shadow-[0px_0px_6px_0px_#4593ff] top-[17.92%]" data-name="产业链" data-node-id="1205:31863">
+        <div className="absolute inset-[5.36%_10.72%]" data-name="Union" data-node-id="I1205:31863;1205:31861">
+          <img alt="" className="block max-w-none size-full" src={img1} />
+        </div>
+        <div className="absolute inset-0 pointer-events-none shadow-[inset_0px_0px_3px_0px_#ffffff]" />
+      </div>
+    </div>
+  );
+}
+
+function Component2({ className }: { className?: string }) {
+  return (
+    <div className={className} data-name="定位点/基地" data-node-id="1205:31871">
+      <div className="absolute inset-[12.5%_8.66%]" data-node-id="1205:32108">
+        <img alt="" className="block max-w-none size-full" src={imgGroup1597881805} />
+      </div>
+      <div className="absolute inset-[27.5%_23%] overflow-clip" data-name="产业icon" data-node-id="1204:31851">
+        <div className="absolute inset-[13%_21.7%]" data-name="Union" data-node-id="I1204:31851;1198:61730">
+          <div className="absolute inset-[-20.02%_-26.17%]">
+            <img alt="" className="block max-w-none size-full" src={img2} />
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}
+
+function Component3({ className }: { className?: string }) {
+  return (
+    <div className={className} data-name="弹出框样式2" data-node-id="741:54163">
+      <div className="flex h-[calc(1px*((var(--transform-inner-width)*1)+(var(--transform-inner-height)*0)))] items-center justify-center leading-[0] relative shrink-0 w-[calc(1px*((var(--transform-inner-height)*1)+(var(--transform-inner-width)*0)))]">
+        <div className="flex-none rotate-[90deg] scale-y-[-100%]">
+          <div className="grid-cols-[max-content] grid-rows-[max-content] inline-grid justify-items-start relative" data-node-id="1207:33739">
+            <div className="col-[1] h-[80px] ml-[7.5px] mt-[17px] relative row-[1] w-[2px]" data-node-id="1207:33513">
+              <div className="absolute bottom-[-1.25%] left-0 right-[-50%] top-[-1.25%]">
+                <img alt="" className="block max-w-none size-full" src={imgGroup1597881806} />
+              </div>
+            </div>
+            <div className="col-[1] ml-0 mt-0 relative row-[1] size-[17px]" data-name="圆圈圈" data-node-id="741:53539">
+              <img alt="" className="block max-w-none size-full" src={img3} />
+            </div>
+          </div>
+        </div>
+      </div>
+      <div className="h-[320px] relative shrink-0 w-[476px]" data-name="框" data-node-id="741:53541">
+        <div className="absolute inset-[-0.06%_-0.09%_-0.06%_-0.04%]">
+          <img alt="" className="block max-w-none size-full" src={img4} />
+        </div>
+      </div>
+    </div>
+  );
+}
+type iconProps = {
+  className?: string;
+  property1?: "油脂" | "粮食";
+};
+
+function icon({ className, property1 = "粮食" }: iconProps) {
+  return (
+    <div className={className} data-name="Property 1=粮食" data-node-id="1201:31235">
+      <div className="absolute inset-[13%_21.7%]" data-name="Union" data-node-id="1198:61730">
+        <img alt="" className="block max-w-none size-full" src={imgUnion} />
+      </div>
+    </div>
+  );
+}
+type Component4Props = {
+  className?: string;
+  property1?: "上";
+};
+
+function Component4({ className, property1 = "上" }: Component4Props) {
+  return (
+    <div className={className} data-name="Property 1=上" data-node-id="1201:48133">
+      <div className="absolute content-stretch flex flex-col gap-[40px] h-[944px] items-center justify-center left-0 right-[37.7%] top-1/2 translate-y-[-50%]" data-name="导航内容" data-node-id="1201:47870">
+        <div className="bg-[rgba(255,255,255,0.05)] box-border content-stretch flex flex-col gap-[20px] h-[220px] items-center justify-center px-[20px] py-0 relative rounded-[10px] shrink-0 w-[60px]" data-name="111" data-node-id="1201:47862">
+          <icon className="overflow-clip relative shrink-0 size-[50px]" />
+          <div className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" data-name="text" data-node-id="1201:47859">
+            <div className="flex flex-col font-['HarmonyOS_Sans_SC:Bold',sans-serif] justify-center leading-[32px] not-italic relative shrink-0 text-[26px] text-white whitespace-nowrap" data-node-id="I1201:47859;635:42944">
+              <p className="mb-0">粮</p>
+              <p className="mb-0">&nbsp;</p>
+              <p>食</p>
+            </div>
+          </div>
+        </div>
+        <div className="box-border content-stretch flex flex-col gap-[20px] h-[220px] items-center justify-center px-[20px] py-0 relative rounded-[10px] shrink-0 w-[60px]" data-name="222" data-node-id="1201:47864">
+          <div className="overflow-clip relative shrink-0 size-[50px]" data-name="产业icon" data-node-id="1201:47865">
+            <div className="absolute inset-[13%_26.2%]" data-name="Vector" data-node-id="I1201:47865;1200:31218">
+              <div className="absolute inset-0" style={{ "--fill-0": "rgba(255, 255, 255, 1)" } as React.CSSProperties}>
+                <img alt="" className="block max-w-none size-full" src={img5} />
+              </div>
+            </div>
+          </div>
+          <div className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" data-name="text" data-node-id="1201:47866">
+            <div className="flex flex-col font-['HarmonyOS_Sans_SC:Bold',sans-serif] justify-center leading-[32px] not-italic relative shrink-0 text-[26px] text-[rgba(255,255,255,0.5)] whitespace-nowrap" data-node-id="I1201:47866;635:42944">
+              <p className="mb-0">油</p>
+              <p className="mb-0">&nbsp;</p>
+              <p>脂</p>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div className="absolute bottom-0 flex items-center justify-center left-[25.05%] right-0 top-0">
+        <div className="flex-none h-[1078.893px] rotate-[180deg] scale-y-[-100%] w-[113.088px]">
+          <div className="relative size-full" data-name="光标左侧" data-node-id="1201:48121">
+            <div className="absolute bottom-[-0.04%] left-0 right-0 top-[-0.04%]">
+              <img alt="" className="block max-w-none size-full" src={img6} />
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}
+
+function Component5({ className }: { className?: string }) {
+  return (
+    <div className={className} data-name="边" data-node-id="84:21868">
+      <img alt="" className="block max-w-none size-full" src={img7} />
+    </div>
+  );
+}
+
+function Component6({ className }: { className?: string }) {
+  return (
+    <div className={className} data-name="线" data-node-id="84:21850">
+      <div className="absolute inset-[45.14%_13.47%_22.05%_68.8%]" data-name="Union" data-node-id="84:21851">
+        <div className="absolute inset-[-0.28%_-0.28%_-0.27%_-0.35%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion1} />
+        </div>
+      </div>
+      <div className="absolute inset-[69.45%_7.91%_11.34%_79.45%]" data-name="Union" data-node-id="84:21852">
+        <div className="absolute inset-[-0.36%_-0.44%_-0.33%_-0.45%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion2} />
+        </div>
+      </div>
+      <div className="absolute bottom-[58.34%] left-[13.82%] right-[58.52%] top-0" data-name="Union" data-node-id="84:21853">
+        <div className="absolute inset-[-0.16%_-0.17%_-0.16%_-0.25%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion3} />
+        </div>
+      </div>
+      <div className="absolute inset-[40.22%_52.11%_21.49%_24.35%]" data-name="Union" data-node-id="84:21854">
+        <div className="absolute inset-[-0.17%_-0.21%_-0.2%_-0.28%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion4} />
+        </div>
+      </div>
+      <div className="absolute inset-[15.1%_38.74%_51.84%_30.9%]" data-name="Union" data-node-id="84:21855">
+        <div className="absolute inset-[-0.2%_-0.17%_-0.22%_-0.17%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion5} />
+        </div>
+      </div>
+      <div className="absolute inset-[62.63%_13.38%_23.24%_79.12%]" data-name="Union" data-node-id="84:21856">
+        <div className="absolute inset-[-0.45%_-0.62%_-0.6%_-0.65%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion6} />
+        </div>
+      </div>
+      <div className="absolute inset-[39.2%_33.9%_32.16%_45.04%]" data-name="Union" data-node-id="84:21857">
+        <div className="absolute inset-[-0.26%_-0.43%_-0.35%_-0.33%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion7} />
+        </div>
+      </div>
+      <div className="absolute inset-[33.43%_19.83%_31.88%_63.81%]" data-name="Union" data-node-id="84:21858">
+        <div className="absolute inset-[-0.19%_-0.36%_-0.2%_-0.31%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion8} />
+        </div>
+      </div>
+      <div className="absolute inset-[61.63%_26.15%_9.48%_37%]" data-name="Union" data-node-id="84:21859">
+        <div className="absolute inset-[-0.27%_-0.13%_-0.27%_-0.21%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion9} />
+        </div>
+      </div>
+      <div className="absolute bottom-[16.35%] left-[77.75%] right-0 top-[39.25%]" data-name="Union" data-node-id="84:21860">
+        <div className="absolute inset-[-0.15%_-0.22%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion10} />
+        </div>
+      </div>
+      <div className="absolute bottom-0 left-[66.67%] right-[14.92%] top-[70.14%]" data-name="Union" data-node-id="84:21861">
+        <div className="absolute inset-[-0.22%_-0.27%_-0.22%_-0.26%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion11} />
+        </div>
+      </div>
+      <div className="absolute inset-[19.86%_25.75%_54.08%_56.23%]" data-name="Union" data-node-id="84:21862">
+        <div className="absolute inset-[-0.28%_-0.27%_-0.49%_-0.27%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion12} />
+        </div>
+      </div>
+      <div className="absolute bottom-[2%] left-0 right-[70.7%] top-[44.26%]" data-name="Union" data-node-id="84:21863">
+        <div className="absolute inset-[-0.12%_-0.16%_-0.14%_-0.18%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion13} />
+        </div>
+      </div>
+      <div className="absolute inset-[64.64%_29.68%_24.46%_58.95%]" data-name="Union" data-node-id="84:21864">
+        <div className="absolute inset-[-0.59%_-0.41%_-0.67%_-0.42%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion14} />
+        </div>
+      </div>
+      <div className="absolute inset-[61.94%_39.82%_24.69%_53.29%]" data-name="Union" data-node-id="84:21865">
+        <div className="absolute inset-[-0.64%_-0.74%_-0.48%_-0.82%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion15} />
+        </div>
+      </div>
+      <div className="absolute inset-[55.88%_34.28%_31.77%_54.46%]" data-name="Union" data-node-id="84:21866">
+        <div className="absolute inset-[-0.54%_-0.41%_-0.57%_-0.41%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion16} />
+        </div>
+      </div>
+      <div className="absolute inset-[33.35%_66.33%_53.33%_20.28%]" data-name="Union" data-node-id="84:21867">
+        <div className="absolute inset-[-0.55%_-0.49%_-0.53%_-0.4%]">
+          <img alt="" className="block max-w-none size-full" src={imgUnion17} />
+        </div>
+      </div>
+    </div>
+  );
+}
+
+function Component7({ className }: { className?: string }) {
+  return (
+    <div className={className} data-name="导航底框" data-node-id="631:36462">
+      <div className="absolute bottom-[18.95%] left-0 right-0 top-0" data-name="1" data-node-id="631:36440">
+        <div className="absolute inset-[-181.3%_-19.68%_-413.77%_-19.68%]">
+          <img alt="" className="block max-w-none size-full" src={img8} />
+        </div>
+      </div>
+      <div className="absolute bottom-0 left-[27.44%] right-[27.44%] top-[62.9%]" data-node-id="631:36441">
+        <div className="absolute inset-[-257.75%_-17.4%]">
+          <img alt="" className="block max-w-none size-full" src={imgGroup1158} />
+        </div>
+      </div>
+    </div>
+  );
+}
+
+function Component8({ className }: { className?: string }) {
+  return (
+    <div className={className} data-name="底部网格" data-node-id="631:69869">
+      <div className="absolute bottom-[-71.42%] content-stretch flex flex-col items-start left-0 mask-alpha mask-intersect mask-no-clip mask-no-repeat mask-position-[0px_175.624px] mask-size-[1920px_1080px] right-0 top-[-16.26%]" data-name="底部内容" data-node-id="631:69865" style={{ maskImage: `url('${img9}')` }}>
+        <div className="h-[1013.464px] relative shrink-0 w-[1920px]" data-name="网格" data-node-id="631:69866">
+          <img alt="" className="block max-w-none size-full" src={img10} />
+        </div>
+        <div className="h-[1013.464px] relative shrink-0 w-[1920px]" data-name="网格" data-node-id="631:69867">
+          <img alt="" className="block max-w-none size-full" src={img10} />
+        </div>
+      </div>
+    </div>
+  );
+}
+type Component9Props = {
+  className?: string;
+  property1?: "供应链专用界面";
+};
+
+function Component9({ className, property1 = "供应链专用界面" }: Component9Props) {
+  return (
+    <div className={className} data-name="Property 1=供应链专用界面" data-node-id="1486:134453">
+      <div aria-hidden="true" className="absolute inset-0 pointer-events-none">
+        <img alt="" className="absolute max-w-none object-50%-50% object-cover size-full" src={imgProperty1} />
+        <div className="absolute bg-[rgba(0,79,154,0.1)] inset-0" />
+      </div>
+      <div className="absolute contents left-0 top-0" data-node-id="1486:133993" />
+    </div>
+  );
+}
+
+export default function Component10() {
+  return (
+    <div className="relative size-full" data-name="操控屏-1-粮食•油脂-粮食首页-产业链企业弹出数据" data-node-id="1214:73934">
+      <div className="absolute contents left-0 top-0" data-name="我是底部" data-node-id="I1214:73934;1207:32536">
+        <Component9 className="absolute h-[1080px] left-0 overflow-clip top-0 w-[1920px]" />
+        <Component8 className="absolute h-[1080px] left-0 top-0 w-[1920px]" />
+        <Component7 className="absolute h-[71.119px] left-[526.95px] top-[40px] w-[866.265px]" />
+        <Text className="absolute box-border content-stretch flex gap-[10px] items-center justify-center left-1/2 px-0 py-[4px] top-[40px] translate-x-[-50%]" propValue2="居中对齐" />
+      </div>
+      <div className="absolute contents left-[529.88px] top-[calc(50%+33.79px)] translate-y-[-50%]" data-name="地图" data-node-id="I1214:73934;1207:32542">
+        <div className="absolute contents left-[27.6%] right-[4.17%] top-[calc(50%+33.79px)] translate-y-[-50%]" data-name="地图" data-node-id="I1214:73934;1207:32543">
+          <Component6 className="absolute inset-[19.27%_4.17%_13.01%_27.6%]" />
+          <Component5 className="absolute h-[731.454px] left-[27.6%] right-[4.17%] top-[calc(50%+33.79px)] translate-y-[-50%]" />
+        </div>
+        <Component2 className="absolute h-[48px] left-[1142.89px] top-[717.84px] w-[40px]" />
+        <Component2 className="absolute h-[48px] left-[1664.25px] top-[530.82px] w-[40px]" />
+        <Component2 className="absolute h-[48px] left-[1435px] top-[527.14px] w-[40px]" />
+        <Component2 className="absolute h-[48px] left-[1201.36px] top-[508px] w-[40px]" />
+        <Component1 className="absolute h-[72px] left-[1289px] top-[558px] w-[60px]" />
+        <Component1 className="absolute h-[48px] left-[1403px] top-[597.5px] w-[40px]" />
+        <Component1 className="absolute h-[48px] left-[1694.25px] top-[645.5px] w-[40px]" />
+        <Component1 className="absolute h-[48px] left-[1237.87px] top-[761.84px] w-[40px]" />
+      </div>
+      <div className="absolute content-stretch flex flex-col gap-[10px] items-end right-[80px] top-[150px]" data-name="1+！" data-node-id="I1214:73934;1207:32583">
+        <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
+        <Text className="box-border content-stretch flex gap-[10px] h-[77px] items-center justify-end px-0 py-[4px] relative shrink-0 w-full" propValue2="右对齐" />
+        <Text className="box-border content-stretch flex gap-[10px] items-center justify-end px-0 py-[4px] relative shrink-0" propValue2="右对齐" />
+      </div>
+      <Component4 className="absolute h-[1078.893px] left-[40px] top-0 w-[150.879px]" />
+      <div className="absolute h-[351px] left-[717.28px] overflow-clip top-[273.13px] w-[580px]" data-name="基地弹出框" data-node-id="I1214:73934;1207:33866">
+        <div className="absolute flex items-center justify-center left-0 top-0">
+          <div className="flex-none rotate-[180deg]">
+            <Component3 className="content-stretch flex items-start overflow-clip relative" />
+          </div>
+        </div>
+        <div className="absolute content-stretch flex flex-col gap-[12px] items-center left-[29.81px] top-[31.73px] w-[420px]" data-name="粮食源头" data-node-id="I1214:73934;1214:33885">
+          <div className="content-stretch flex flex-col gap-[12px] items-start relative shrink-0 w-full" data-node-id="I1214:73934;1700:134414">
+            <Text className="box-border content-stretch flex gap-[10px] h-[62px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
+            <Text className="box-border content-stretch flex gap-[10px] h-[62px] items-center px-0 py-[4px] relative shrink-0 w-full" propValue="24px" />
+          </div>
+          <div className="content-stretch flex flex-col gap-[12px] items-start relative shrink-0 w-full" data-node-id="I1214:73934;1207:72261">
+            <div className="content-stretch flex gap-[20px] items-start relative shrink-0" data-node-id="I1214:73934;1207:72255">
+              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
+              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" />
+              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
+            </div>
+            <div className="content-stretch flex gap-[20px] items-start relative shrink-0" data-node-id="I1214:73934;1207:72262">
+              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
+              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" />
+              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
+            </div>
+          </div>
+        </div>
+      </div>
+      <div className="absolute bottom-[80px] content-stretch flex items-center left-1/2 translate-x-[-50%]" data-name="基地和供应链" data-node-id="I1214:73934;1699:119049">
+        <div className="box-border content-stretch flex gap-[20px] h-[54px] items-center justify-center px-[20px] py-0 relative rounded-[10px] shrink-0 w-[202px]" data-name="111" data-node-id="I1214:73934;1699:119050">
+          <Component2 className="h-[50px] relative shrink-0 w-[41.667px]" />
+          <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="26px" />
+        </div>
+        <div className="box-border content-stretch flex gap-[20px] h-[54px] items-center justify-center px-[20px] py-0 relative rounded-[10px] shrink-0 w-[202px]" data-name="112" data-node-id="I1214:73934;1699:119053">
+          <Component1 className="h-[50px] relative shrink-0 w-[41.667px]" />
+          <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="26px" />
+        </div>
+      </div>
+      <div className="absolute content-stretch flex flex-col gap-[11px] items-start left-[199.88px] top-[calc(50%+4.02px)] translate-y-[-50%] w-[330px]" data-name="组合1" data-node-id="I1214:73934;1699:122887">
+        <Text className="box-border content-stretch flex gap-[10px] h-[80px] items-center px-[26px] py-[4px] relative shrink-0 w-full" />
+        <div className="grid-cols-[max-content] grid-rows-[max-content] inline-grid justify-items-start leading-[0] relative shrink-0" data-name="框框数据1" data-node-id="I1214:73934;1699:122889">
+          <div className="box-border col-[1] content-stretch flex flex-col h-[700px] items-center justify-between ml-0 mt-0 px-0 py-[20px] relative row-[1] w-[330px]" data-node-id="I1214:73934;1699:122891">
+            <div className="box-border content-stretch flex flex-col gap-[20px] items-start px-0 py-[20px] relative shrink-0 w-[278px]" data-name="总产值达" data-node-id="I1214:73934;1699:122892">
+              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0 w-full" />
+              <div className="content-stretch flex gap-[10px] h-[80px] items-end relative shrink-0 w-full" data-name="数据金额" data-node-id="I1214:73934;1699:122894">
+                <div className="content-stretch flex gap-[6px] items-center relative shrink-0" data-name="1" data-node-id="I1214:73934;1699:122895">
+                  <Component className="h-[80px] relative shrink-0 w-[53.333px]" />
+                  <Component className="h-[80px] relative shrink-0 w-[53.333px]" />
+                  <Component className="h-[80px] relative shrink-0 w-[53.333px]" />
+                </div>
+                <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
+              </div>
+            </div>
+            <div className="box-border content-stretch flex flex-col gap-[20px] items-start px-0 py-[20px] relative shrink-0 w-[278px]" data-name="总产值达" data-node-id="I1214:73934;1699:122906">
+              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0 w-full" />
+              <div className="content-stretch flex gap-[10px] h-[80px] items-end relative shrink-0 w-full" data-name="数据金额" data-node-id="I1214:73934;1699:122908">
+                <div className="content-stretch flex gap-[6px] items-center relative shrink-0" data-name="1" data-node-id="I1214:73934;1699:122909">
+                  <Component className="h-[80px] relative shrink-0 w-[53.333px]" />
+                  <Component className="h-[80px] relative shrink-0 w-[53.333px]" />
+                </div>
+                <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
+              </div>
+            </div>
+            <div className="box-border content-stretch flex flex-col gap-[20px] items-start px-0 py-[20px] relative shrink-0 w-[278px]" data-name="总产值达" data-node-id="I1214:73934;1699:122920">
+              <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0 w-full" />
+              <div className="content-stretch flex gap-[10px] h-[80px] items-end relative shrink-0 w-full" data-name="数据金额" data-node-id="I1214:73934;1699:122922">
+                <div className="content-stretch flex gap-[6px] items-center relative shrink-0" data-name="1" data-node-id="I1214:73934;1699:122923">
+                  <Component className="h-[80px] relative shrink-0 w-[53.333px]" />
+                  <Component className="h-[80px] relative shrink-0 w-[53.333px]" />
+                  <Component className="h-[80px] relative shrink-0 w-[53.333px]" />
+                </div>
+                <Text className="box-border content-stretch flex gap-[10px] items-center px-0 py-[4px] relative shrink-0" propValue="24px" />
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  );
+}
+```
+
+SUPER CRITICAL: The generated React+Tailwind code MUST be converted to match the target project's technology stack and styling system.
+1. Analyze the target codebase to identify: technology stack, styling approach, component patterns, and design tokens
+2. Convert React syntax to the target framework/library
+3. Transform all Tailwind classes to the target styling system while preserving exact visual design
+4. Follow the project's existing patterns and conventions
+DO NOT install any Tailwind as a dependency unless the user instructs you to do so.
+
+Node ids have been added to the code as data attributes, e.g. `data-node-id="1:2"`.
+These styles are contained in the design: 文字颜色/2-100%白色: #FFFFFF, 渐变/2-蓝色: , 边框-蓝色: #133BA0, 主色/icon色: , 文字颜色/3-50%白色: #FFFFFF, 主色/主色-2亮绿: #00FFFF, 主色/产业-粮食颜色: #C5FF92.
+Images and SVGs will be stored as constants, e.g. const image = 'https://www.figma.com/api/mcp/asset/550e8400-e29b-41d4-a716-446655440000'. These constants will be used in the code as the source for the image, ex: <img src={image} />. Image assets are stored on a remote server for 7 days and can be fetched using the provided URLs until they expire.
+IMPORTANT: After you call this tool, you MUST call get_screenshot to get a screenshot of the node for context.