gtech-world · YongZL · Jun 25, 2024 · Oct 30, 2023 · Oct 30, 2023 · Oct 31, 2023
diff --git a/public/label.jpg b/public/label.jpg
diff --git a/src/components/common/DivText.tsx b/src/components/common/DivText.tsx
@@ -10,7 +10,7 @@ const DivText: FC<TextType> = ({ textArray = [] }) => {
       {textArray.length &&
         textArray.map((item, key) => {
           return (
-            <div key={`text_${key}`}>
+            <div key={`text_${key}`} className="break-all ">
               <span className=" font-bold leading-7 text-[#000000] mo:text-[15px]">{item.text}：</span>
               <span className=" font-normal text-[#666666] text-[15px]  mo:text-[15px]">{item.value}</span>
             </div>

diff --git a/src/components/common/header.tsx b/src/components/common/header.tsx
@@ -1,12 +1,14 @@
 import { Aicp } from '@/components/svgr';
-import { useIntl } from '@umijs/max';
+import { SelectLang, useIntl } from '@umijs/max';
 import classNames from 'classnames';
 import { HTMLAttributes } from 'react';
 import { useTitle } from 'react-use';
 import { WrapLink } from '../ant/Link';
 import MenuAction from '../ant/MenuAction';
 import { useIsMobile } from './context';
 import { HEADER_HEIGHT } from '../../../config/defaultSettings';
+import { LngList, LngsText } from '../const';
+import { Button } from './button';
 
 export function HeaderTitle() {
   const { locale } = useIntl();
@@ -29,6 +31,7 @@ export function HeaderTitle() {
 export function Header(p: HTMLAttributes<HTMLDivElement>) {
   const { className, ...props } = p;
   const isMobile = useIsMobile();
+
   return (
     <div
       {...props}
@@ -37,9 +40,13 @@ export function Header(p: HTMLAttributes<HTMLDivElement>) {
     >
       <WrapLink to={isMobile ? '#' : '/'} className="flex gap-3 items-center !text-white">
         <Aicp height="30" />
-        <HeaderTitle />
       </WrapLink>
-      {!isMobile && <MenuAction key="menu" />}
+
+      <div className="flex items-center gap-5">
+        <SelectLang postLocalesData={() => LngList} reload={false} />
+
+        {!isMobile && <MenuAction key="menu" />}
+      </div>
     </div>
   );
 }
@@ -54,7 +61,7 @@ export function HomeHeader(p: HTMLAttributes<HTMLDivElement>) {
         'h-[6.75rem] z-50 max-w-[75rem] mx-auto bg-transparent w-full text-white flex justify-between items-center px-5 mo:h-[56px] mo:sticky mo:top-0 mo:bg-white mo:text-green-2',
       )}
     >
-      <WrapLink to="/" className="flex gap-3 items-center">
+      <WrapLink to="/" className="flex items-center gap-3">
         <Aicp height="32" />
         <HeaderTitle />
       </WrapLink>

diff --git a/src/components/common/productQrcode.tsx b/src/components/common/productQrcode.tsx
@@ -1,6 +1,7 @@
 import classNames from 'classnames';
 import QRCode from 'qrcode.react';
-import { Carbon3Name, DisableQrcode } from '../svgr';
+import { Border, Carbon3Name, DisableQrcode } from '../svgr';
+import { Fragment } from 'react';
 
 export function ProductQrcode(p: any) {
   const { qrText, className, qrcodeDisable, data, name = 'Certified' } = p;
@@ -20,10 +21,14 @@ export function ProductQrcode(p: any) {
             <p className="text-[0.6875rem] text-center mb-2 leading-[0.945rem] font-semibold mo:leading-[0.865rem]">
               {qrText ? qrText : `Product Carbon Footprint ${name}`}
             </p>
+
+            <Border className={'relative z-100'} />
             {qrcodeDisable ? (
-              <DisableQrcode width="92" height="92" />
+              <DisableQrcode className="" width="77" height="77" />
             ) : (
-              <QRCode className="w-[5.75rem]" size={92} value={data} />
+              <>
+                <QRCode className="w-[5.75rem] absolute z-1000 mo:mt-12 md:mt-13 mt-[50px]" size={76} value={data} />
+              </>
             )}
           </div>
         </div>

diff --git a/src/components/const.ts b/src/components/const.ts
@@ -8,3 +8,18 @@ export const SIZE = {
   small: 'py-1',
   big: 'py-3',
 };
+
+export const LngList = [
+  {
+    lang: 'en-US',
+    label: 'English',
+    icon: '🇺🇸',
+    title: 'Language',
+  },
+  {
+    lang: 'zh-CN',
+    label: '简体中文',
+    icon: '🇨🇳',
+    title: '语言',
+  },
+];
diff --git a/src/components/routes/chain.tsx b/src/components/routes/chain.tsx
@@ -209,7 +209,9 @@ export function Blockchain() {
                     </span>
                     {!isMobile && <p>#{tokenId}</p>}
                   </div>
-                  <span className="text-sm ml-3 mo:ml-0 mt-[0.3rem] mo:mt-2 mo:text-gray-6">{t('by AIAG')}</span>
+                  <span className="text-sm ml-3 mo:ml-0 mt-[0.3rem] mo:mt-2 mo:text-gray-6">
+                    {t('Recognized by AIAG & IAOB')}
+                  </span>
                 </div>
               </div>
               <div className="px-12 py-5 bg-white rounded-lg mo:pl-10 mo:pr-3">
@@ -229,7 +231,7 @@ export function Blockchain() {
             <SVGAICP fill="#29953A" className="w-[6.125rem] mb-5" />
             <p className="font-bold">{t('Platform powered by:')}</p>
             <p className="text-green-2">
-              <WrapLink className="!text-base" to="https://aicp.gtech.world/" target="_blank">
+              <WrapLink className="!text-base" to="https://aicp.gtech.world/">
                 {t('Automotive Industry Carbon Platform')}
               </WrapLink>
             </p>

diff --git a/src/components/routes/label.tsx b/src/components/routes/label.tsx
@@ -13,6 +13,8 @@ export function Label() {
   const [sq] = useSearchParams();
   const vin: string = sq.get('vin') as string;
   const { data: tagInfo, isLoading } = useTagInfo(vin);
+  const { t } = useT();
+
   const {
     evaluationAgency = '-',
     evaluationExpireTime = '-',
@@ -26,65 +28,65 @@ export function Label() {
     evaluationBoundary = '-',
     evaluationBasis = '-',
     pcfResult = '-',
-    certificateNumber = '当前无证书',
+    certificateNumber = t('0000001'),
   } = tagInfo || {};
+
   const productInfo = [
-    { text: '标签编号', value: uuid },
-    { text: '产品型号', value: productName },
-    { text: '产品唯一标识符', value: loadNumber },
-    { text: '标签申请主体', value: orgName },
+    { text: t('Label Number'), value: uuid },
+    { text: t('Product System'), value: productName },
+    { text: t('Product UID'), value: loadNumber },
+    { text: t('Label Applicant'), value: orgName },
   ];
 
   const productTagInfo = [
-    { text: '评价类型', value: evaluationType !== 'aicp' ? '第三方认证' : 'AICP平台审核' },
-    { text: '证书编号', value: certificateNumber },
-    { text: '功能单位', value: functionalUnit },
-    { text: '评价边界', value: evaluationBoundary },
-    { text: '评价依据', value: evaluationBasis },
-    { text: '评价机构', value: evaluationAgency },
-    { text: '评价有效期', value: evaluationExpireTime },
+    { text: t('Evaluation'), value: evaluationType !== 'aicp' ? t('Third-party Certification') : 'AICP平台审核' },
+    { text: t('Certification Number'), value: certificateNumber },
+    { text: t('Functional Unit'), value: functionalUnit },
+    { text: t('Assessment Boundary'), value: evaluationBoundary },
+    { text: t('Reference Standard'), value: evaluationBasis },
+    { text: t('Evaluation by'), value: evaluationAgency },
+    { text: t('Effective Date'), value: evaluationExpireTime },
     {
-      text: '区块链SBT证书编号',
+      text: t('Blockchain SBT Number'),
       value: tokenId,
       link: genScanUrl('address', '0x7BC6afe0cDc6DE9191dfC6d68A3bad45E270F695'),
     },
   ];
 
-  const { t } = useT();
-
   const noHeader = () => {
     return (
       <Fragment>
         <div className="flex w-full gap-5 mo:flex-none mo:flex-col ">
-          <div className="w-[420px] max-h-[450px] p-5 mo:h-auto  bg-[#FFFFFF] text-center  flex justify-center mo:justify-start   mo:flex-row mo:w-full flex-col items-center rounded-lg ">
-            <SVGCarbon3 className="text-[5.375rem] w-[5.375rem] mt-[.625rem] mb-5 mo:mb-2  shrink-0" />
+          <div className="w-[420px] max-h-[480px] p-5 mo:h-auto  bg-[#FFFFFF] text-center  flex justify-center mo:justify-start   mo:flex-row mo:w-full flex-col items-center rounded-lg ">
+            <img src="label.jpg" className="text-[5.375rem] w-[5.375rem] mt-[.625rem] mb-5 mo:mb-2  shrink-0" />
             <div className="mo:ml-[2.5rem] mo:flex-1 ">
               <div className="text-[#29953A] text-[1.75rem] leading-8 font-semibold max-w-full break-all">
                 {pcfResult}
               </div>
-              <div className="font-[1.75rem] leading-8   ">二氧化碳等效排放</div>
+              <div className="font-[1.75rem] leading-8   ">{t('Cradle-to-Grave Footprint')}</div>
             </div>
           </div>
-          <div className="w-[420px]  mo:w-full  max-h-[450px] bg-[#FFFFFF] mo:max-h-[350px] rounded-lg">
+          <div className="w-[420px]  mo:w-full  max-h-[480px] bg-[#FFFFFF] mo:max-h-[350px] rounded-lg">
             <div className="mx-5 mt-5 mb-5 mmd:mt-10">
               <div className="mb-5 mo:mb-[15px]  md:text-[18px]   font-bold mo:text-[18px] text-[20px] leading-7">
-                产品信息
+                {t('Product Info')}
               </div>
               <DivText textArray={productInfo} />
             </div>
           </div>
-          <div className="w-[420px]  mo:w-full  max-h-[450px] bg-[#FFFFFF] mo:max-h-[350px] rounded-lg">
+          <div className="w-[420px]  mo:w-full  max-h-[480px] bg-[#FFFFFF] mo:max-h-[370px] rounded-lg">
             <div className="mx-5 mt-5 mb-5 mmd:mt-10">
               <div className="mb-5 mo:mb-[15px] md:text-[18px]   font-bold mo:text-[18px] text-[20px] leading-7">
-                产品碳足迹评价信息
+                {t('Product Carbon Footprint')}
               </div>
               <DivText textArray={productTagInfo} />
             </div>
           </div>
         </div>
         <div className="flex gap-5 mt-5 mo:flex-none mo:flex-col ">
           <div className="w-[640px] py-5 mo:pt-[1.875rem] mo:w-full bg-[#FFFFFF] flex flex-col items-center rounded-lg gap-5 mo:gap-[.9375rem]">
-            <SVGCarbon3 className="text-[5.375rem] w-[5.375rem]" />
+            {/* <SVGCarbon3 className="text-[5.375rem] w-[5.375rem]" /> */}
+            <img src="label.jpg" className="text-[5.375rem] w-[5.375rem]" />
             <div
               className="text-lg font-bold mo:mx-5 "
               dangerouslySetInnerHTML={{
@@ -96,7 +98,7 @@ export function Label() {
               dangerouslySetInnerHTML={{
                 __html: handleCarbonStr(
                   t(
-                    'The AIAG Digital3 Carbon Trust Label is an industry-level certification framework for every vehicle produced under {{value}}. The Trust Label guarantees that any raw data behind the label is verified and recorded in an immutable manner for the ultimate transparency and traceability for the vehicle’s carbon performance.',
+                    'An AIAG EPD/CFP Label stands for an EPD/CFP declaration that is registered on the AIAG EPD Platform and recognized by AIAG and IAOB.',
                   ).replace(
                     '{{value}}',
                     `<a class="text-green-2 cursor-pointer" target="_blank" href="https://aiag.org.cn/ACAC/Automotive-Carbon-Advisory-Committee" rel="noreferrer">${t(
@@ -115,7 +117,7 @@ export function Label() {
               className="text-[.9375rem] font-normal text-center mx-5"
               dangerouslySetInnerHTML={{
                 __html: t(
-                  'A Soul-bounded Token (a special type of NFT that is not allowed to transfer after created) has been generated on blockchain to make sure the information in this label is immutable and will be maintain for traceability forever. Check {{value}} to verify the SBT on blockchain explorer.',
+                  'Every AIAG EPD/CFP Label is backed by an dedicated NFT on blockchain to guarantee long term immutability and traceability on the underlying data. Check {{value}} to view NFT information from the blockchain explorer.',
                 ).replace(
                   '{{value}}',
                   `<a class="text-green-2 cursor-pointer" href="${wrapPath(
@@ -145,7 +147,7 @@ export function Label() {
           ) : (
             <Fragment>
               <div className="mb-5 text-2xl font-bold leading-normal">
-                {t('Product Carbon Footprint Certified')} <span className="text-base font-medium">{t('by AIAG')}</span>
+                {t('CFP Label')} <span className="text-base font-medium">{t('Recognized by AIAG & IAOB')}</span>
               </div>
               {noHeader()}
             </Fragment>

diff --git a/src/components/routes/tools/inventory.tsx b/src/components/routes/tools/inventory.tsx
@@ -8,7 +8,7 @@ import { history } from '@umijs/max';
 import classNames from 'classnames';
 import { useMemo, useRef, useState } from 'react';
 import InventoryResultModal from './inventoryResultModal';
-import { tryParse } from '@/lib/utils';
+import { scrollToTop, tryParse } from '@/lib/utils';
 
 const colorText: any = {
   [-1]: { color: 'text-[red]', text: '计算失败' },
@@ -165,9 +165,8 @@ export function Inventory() {
         )
       : ({} as _.Dictionary<ApiModel.LcaParamList>);
     const bases = (params[0]?.parameters || []) as any[];
-
     return bases
-      .map((item) => [item.name, item.context.name, item.value, inputMap[item.name]?.paramValue || ''])
+      .map((item) => [item.name, item.context.name, item.value, inputMap[item.name]?.paramValue])
       .map(([name, uuid, optName, inputData]) => ({
         name,
         uuid,
@@ -200,6 +199,7 @@ export function Inventory() {
             current: pgNum,
             onChange: (page) => {
               setPgNum(page);
+              scrollToTop();
             },
           }}
         />

diff --git a/src/components/routes/tools/model.tsx b/src/components/routes/tools/model.tsx
@@ -8,6 +8,7 @@ import { EditorProductSystem } from '@/components/modal/EditorProductSystem';
 import { NewProductSystem } from '@/components/modal/NewProductSystem';
 import { useProductList } from '@/lib/hooks/useDatas';
 import { useUnVerifier } from '@/lib/hooks/useUser';
+import { scrollToTop } from '@/lib/utils';
 import { useMemo, useState } from 'react';
 
 export function Model() {
@@ -130,6 +131,7 @@ export function Model() {
             current: pgNum,
             onChange: (page) => {
               setPgNum(page);
+              scrollToTop();
             },
           }}
         />

diff --git a/src/components/routes/tools/verificationManagement/components/AddOrEditVerification.tsx b/src/components/routes/tools/verificationManagement/components/AddOrEditVerification.tsx
@@ -150,19 +150,27 @@ const AddOrEditVerification: FC<ApiModel.VerificationManagementModal> = ({ close
     return shortStr(name, 10, 10);
   }, [state.files, disableFiles]);
 
+  const dealFiles = (event: any) => {
+    const selectedFiles = event.target.files;
+    const filteredFiles: any = Array.from(selectedFiles).filter((file: any) => {
+      return !file.name.startsWith('.');
+    });
+    const dataTransfer = new DataTransfer();
+    filteredFiles.forEach((file: File) => {
+      dataTransfer.items.add(file);
+    });
+    const fileList = dataTransfer.files;
+
+    setState({ files: fileList });
+  };
+
   const renderInputVerifyFiles = {
     label: isVerify ? '验证文档' : '附件',
     dataIndex: 'verifyDoc',
     render: () => (
       <Fragment>
         <div className="flex flex-row items-center gap-2 mt-[-15px]">
-          <input
-            {...otherAtt}
-            ref={FileRef}
-            type="file"
-            hidden
-            onChange={(e) => setState({ files: e.target.files as any })}
-          />
+          <input {...otherAtt} ref={FileRef} type="file" hidden onChange={(e) => dealFiles(e)} />
           <VectorIcon />
           <TextDiv value={folderName} />
           <AButton onClick={(e) => !busy && FileRef.current?.click()} busy={busy} btnText={' 选择文件夹'} />

diff --git a/src/components/routes/tools/verificationManagement/index.tsx b/src/components/routes/tools/verificationManagement/index.tsx
@@ -8,6 +8,7 @@ import _ from 'lodash';
 import { useCallback, useMemo, useRef, useState } from 'react';
 import AddVerification from './components/AddOrEditVerification';
 import ViewVerification from './components/ViewVerification';
+import { scrollToTop } from '@/lib/utils';
 
 export function VerificationManagementList() {
   const { userData } = useStore();
@@ -187,6 +188,7 @@ export function VerificationManagementList() {
             current: pgNum,
             onChange: (page) => {
               setPgNum(page);
+              scrollToTop();
             },
           }}
         />

diff --git a/src/components/svgr/Border.js b/src/components/svgr/Border.js
@@ -0,0 +1,22 @@
+import * as React from 'react';
+const SvgBorder = (props) => (
+  <svg {...props} width="100" height="100" viewBox="0 0 100 100" fill="none" xmlns="http://www.w3.org/2000/svg">
+    <path
+      d="M24.9546 0.253342H17.7344C8.16406 0.253342 0.405762 8.01165 0.405762 17.582V25.0429H8.10738V17.582C8.10738 12.2651 12.4175 7.95497 17.7344 7.95497H24.9546V0.253342Z"
+      fill="black"
+    />
+    <path
+      d="M74.7744 7.95497V0.253342H82.2355C91.8058 0.253342 99.5641 8.01165 99.5641 17.582V25.0429H91.8625V17.582C91.8625 12.2651 87.5523 7.95497 82.2355 7.95497H74.7744Z"
+      fill="black"
+    />
+    <path
+      d="M74.7744 91.7102H82.2355C87.5523 91.7102 91.8625 87.4 91.8625 82.0831V74.8629H99.5641V82.0831C99.5641 91.6535 91.8058 99.4118 82.2355 99.4118H74.7744V91.7102Z"
+      fill="black"
+    />
+    <path
+      d="M8.10738 74.8628V82.0831C8.10738 87.4 12.4175 91.7102 17.7344 91.7102H24.9546V99.4118H17.7344C8.16406 99.4118 0.405762 91.6535 0.405762 82.0831V74.8628H8.10738Z"
+      fill="black"
+    />
+  </svg>
+);
+export default SvgBorder;
diff --git a/src/components/svgr/index.js b/src/components/svgr/index.js
@@ -40,3 +40,4 @@ export { default as VerifiedIcon } from './VerifiedIcon';
 export { default as Nft } from './Nft';
 export { default as GGX } from './Ggx';
 export { default as Detail } from './Detail';
+export { default as Border } from './Border';
diff --git a/src/lib/utils.ts b/src/lib/utils.ts
@@ -189,6 +189,8 @@ export function tryParse<T>(data: any) {
 export const scrollToTop = () => {
   document.body.scrollTop = 0;
   document.documentElement.scrollTop = 0;
+  const table: any = document.querySelector('.ant-table-content');
+  table.scrollLeft = 0;
 };
 
 export const handleContentRender = (text: string, width: number) => {