feat: 完成代码编写

apps/user/components/main/OfferDialog/index.tsx

@@ -398,7 +398,23 @@ const OfferDialog = forwardRef<OfferDialogRef>((props, ref) => {
             value={tabValue}
             onValueChange={setTabValue}
           >
-            <TabsList className='mb-8 h-[74px] flex-wrap rounded-full bg-[#EAEAEA] p-2.5 md:mb-16'>
+            <TabsList className='relative mb-8 h-[74px] flex-wrap rounded-full bg-[#EAEAEA] p-2.5 md:mb-16'>
+              {tabValue === 'year' ? (
+                <span className='absolute -top-8 left-16 z-10 rounded-md bg-[#E22C2E] px-2 py-0.5 text-[10px] font-bold leading-none text-white shadow sm:text-xs'>
+                  -20%
+                  {/* 小三角箭头 */}
+                  {/* <span className="
+                  absolute right-0 top-full
+                  block h-0 w-0
+                  border-l-[6px] border-r-[6px] border-t-[16px]
+                  border-l-transparent border-r-transparent border-t-[#E22C2E]
+                " />*/}
+                  <span
+                    className='absolute right-0 top-[80%] h-10 w-2 bg-[#E22C2E]'
+                    style={{ clipPath: 'polygon(100% 0, 100% 100%, 0 0)' }}
+                  />
+                </span>
+              ) : null}
               <TabsTrigger
                 className={
                   'rounded-full px-10 py-3.5 text-xl data-[state=active]:bg-[#0F2C53] data-[state=active]:text-white md:px-12'