{"version":3,"sources":["webpack://_N_E/./node_modules/core-js/modules/es.array.last-index-of.js","webpack://_N_E/./new/home/components/home-usedcar/index.tsx","webpack://_N_E/./new/home/components/home-usedcar/index.module.scss"],"names":["$","lastIndexOf","target","proto","forced","cityMap","require","ContentList","memo","data","prevEl","nextEl","slideCount","length","cols","sm","md","lg","xl","rows","gap","slideClass","navigation","index","carInfo","onClick","sendTeaCommEvent","authentication_method","car_source_type","event_id","module_id","car_series_id","String","series_id","car_series_name","series_name","car_style_id","car_id","car_style_name","car_name","src","image","isVideo","is_video","seriesId","sku_id","title","sub_title","cityName","car_source_city_name","tips","tags","price","sh_price","office_price","official_price","transfer_cnt","Header","classname","className","HotBrands","car_brand_list","limit","useResponsive","slice","map","item","href","brand_id","car_brand_id","car_brand_name","brand_name","style","brand_logo","HotSeries","car_series_list","responsive","Object","values","classNames","Price","name","str","button_name","FindCar","tab_list","findList","herf","splice","useState","usedCarList","setUsedCarList","shSkuTabData","setShSkuTabData","aroundCityList","setAroundCityList","fontStyleString","setFontStyleString","setPrevEl","setNextEl","useCityName","fetchData","Promise","allSettled","getCars","sh_city_name","page","getShSkuTab","getAroundCityList","d","status","value","search_sh_sku_info_list","Set","PubSub","publish","UPDATE_ANCHOR_STATUS","id","join","hidden","useEffect","tempCityList","concat","cityList","city","find","city_id","code","city_name","marginTop","data-log-view-config","JSON","stringify","repeated","data-log-view","event","params","ref","type","left_right","module","exports"],"mappings":"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","file":"static/chunks/9530.de7b925d7ea33202226f.js","sourcesContent":["var $ = require('../internals/export');\nvar lastIndexOf = require('../internals/array-last-index-of');\n\n// `Array.prototype.lastIndexOf` method\n// https://tc39.github.io/ecma262/#sec-array.prototype.lastindexof\n$({ target: 'Array', proto: true, forced: lastIndexOf !== [].lastIndexOf }, {\n  lastIndexOf: lastIndexOf\n});\n","import React, { useEffect, memo, useState } from 'react'\nimport { sendTeaCommEvent } from 'lib/tea-analyze'\nimport ResponsiveSwiper from 'Components/new/responsive-swiper'\nimport Head from 'next/head'\nimport SwiperButton from 'Components/swiper-button'\nimport UsedcarCard from 'Components/new/usedcar-card'\nimport classNames from 'classnames'\nimport useLazyRender from 'Components/hooks/use-lazy-render'\nimport { useResponsive } from 'Components/hooks/use-responsive'\nimport { useCityName } from 'Components/hooks'\nimport { getAroundCityList, getShSkuTab } from '../../services/home'\nimport { getCars } from '../../..//used-car/list/components/helper'\nimport style from './index.module.scss'\nimport { UPDATE_ANCHOR_STATUS } from '../anchor'\nconst cityMap = require('../../../used-car/list/components/static/city-map.json')\nconst ContentList: React.FC<{\n  data: any\n  prevEl: HTMLElement | null | undefined\n  nextEl: HTMLElement | null | undefined\n}> = memo(({ data, prevEl, nextEl }) => {\n  const cols = {\n    sm: 3,\n    md: 3,\n    lg: 3,\n    xl: 3,\n    '2xl': 4,\n  }\n\n  const rows = {\n    sm: 2,\n    md: 2,\n    lg: 2,\n    xl: 2,\n    '2xl': 2,\n  }\n\n  return (\n    <React.Fragment>\n      <ResponsiveSwiper\n        slideCount={data?.length || 0}\n        cols={cols}\n        rows={rows}\n        gap={12}\n        slideClass=\"tw-w-1/3 2xl:tw-w-1/4\"\n        navigation={{ prevEl, nextEl }}\n      >\n        {({ index }) => {\n          const carInfo = data[index]\n\n          return (\n            <div\n              onClick={() => {\n                sendTeaCommEvent('clk_event', {\n                  authentication_method: carInfo?.authentication_method,\n                  car_source_type: carInfo?.car_source_type,\n                  event_id: 'used_car_source_card',\n                  module_id: 'home_page_used_car_module',\n                  car_series_id: String(carInfo?.series_id),\n                  car_series_name: carInfo?.series_name,\n                  car_style_id: carInfo?.car_id,\n                  car_style_name: carInfo?.car_name,\n                })\n              }}\n            >\n              <UsedcarCard\n                src={carInfo?.image || ''}\n                isVideo={carInfo?.is_video || false}\n                seriesId={carInfo?.series_id || 0}\n                sku_id={carInfo?.sku_id || 0}\n                title={carInfo?.title || ''}\n                sub_title={carInfo?.sub_title || ''}\n                cityName={carInfo?.car_source_city_name}\n                tips={carInfo?.tags || []}\n                price={carInfo?.sh_price || ''}\n                office_price={carInfo?.official_price || ''}\n                transfer_cnt={carInfo?.transfer_cnt}\n              />\n            </div>\n          )\n        }}\n      </ResponsiveSwiper>\n    </React.Fragment>\n  )\n})\n\ninterface IHeaderProps {\n  title: string\n  classname?: string\n}\nconst Header: React.FC<IHeaderProps> = ({ title, classname }) => {\n  return (\n    <>\n      <h2\n        className={`tw-h-40 tw-w-full tw-flex tw-items-center tw-text-14 tw-font-semibold title ${classname}`}\n      >\n        {title}\n      </h2>\n    </>\n  )\n}\n\ninterface IBrandsItem {\n  brand_id: number\n  brand_logo: string\n  brand_name: string\n}\ninterface IHotBrandsProps {\n  car_brand_list?: IBrandsItem[]\n}\nconst HotBrands: React.FC<IHotBrandsProps> = ({ car_brand_list = [] }) => {\n  const responsive = useResponsive()\n  const limit = responsive['xl'] ? 12 : 8\n  return (\n    <div className=\"tw-border-color-gray-400  tw-border-b-1 tw-border-solid\">\n      <div className=\"tw-pb-12  \">\n        <Header title={'热门品牌'} classname=\"tw-px-16\" />\n        <div className=\"tw-grid  tw-grid-cols-4 tw-gap-y-12\">\n          {car_brand_list.slice(0, limit)?.map((item) => {\n            return (\n              <a\n                key={item?.brand_name}\n                target=\"_blank\"\n                href={`/usedcar/x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-${item?.brand_id}-x-x-x-x-x-x-x`}\n                onClick={() => {\n                  sendTeaCommEvent('clk_event', {\n                    event_id: 'hot_used_car_specific_brand',\n                    module_id: 'home_page_used_car_module',\n                    car_brand_id: item.brand_id,\n                    car_brand_name: item.brand_name,\n                  })\n                }}\n                className={`${style.brand}`}\n              >\n                <div className=\"tw-flex tw-justify-center \">\n                  <img src={item?.brand_logo} className=\"tw-w-30 tw-h-30 \" />\n                </div>\n\n                <p className=\"tw-text-12 xl:tw-text-14 tw-block tw-text-center line-1 \">\n                  {item?.brand_name}\n                </p>\n              </a>\n            )\n          })}\n        </div>\n      </div>\n    </div>\n  )\n}\ninterface ISeriesItem {\n  series_id: number\n  series_name: string\n  image_url: string\n}\n\ninterface IHotSeriesProps {\n  car_series_list?: ISeriesItem[]\n}\nconst HotSeries: React.FC<IHotSeriesProps> = ({ car_series_list = [] }) => {\n  const responsive = useResponsive()\n  const index = Object.values(responsive)?.lastIndexOf(true)\n  let limit = 12\n  switch (index) {\n    case 0:\n      limit = 12\n      break\n    case 1:\n      limit = 15\n      break\n    case 2:\n      limit = 21\n      break\n    case 3:\n      limit = 18\n      break\n    case 4:\n      limit = 18\n      break\n    default:\n      limit = 12\n  }\n\n  return (\n    <div className=\"tw-border-color-gray-400  tw-border-b-1 tw-border-solid\">\n      <div className=\"tw-pb-12  tw-px-16\">\n        <Header title={'热门车系'} />\n        <div className=\"tw-grid  tw-grid-cols-3 tw-gap-y-8 tw-gap-x-12\">\n          {car_series_list?.slice(0, limit)?.map((item, index) => {\n            return (\n              <a\n                key={item?.series_name}\n                target=\"_blank\"\n                href={`/usedcar/x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-${item.series_id}-x-x-x-x-x-x`}\n                className={classNames({\n                  'tw-border-color-gray-500  tw-border-r-1 tw-border-solid ':\n                    index !== car_series_list?.length - 1 &&\n                    (index + 1) % 3 !== 0,\n                })}\n                onClick={() => {\n                  sendTeaCommEvent('clk_event', {\n                    event_id: 'hot_car_series_specific',\n                    module_id: 'home_page_used_car_module',\n                    car_series_id: item.series_id,\n                    car_series_name: item.series_name,\n                  })\n                }}\n              >\n                <p className=\"tw-text-14 line-1 tw-text-color-gray-800 hover:tw-text-common-orange\">\n                  {item?.series_name}\n                </p>\n              </a>\n            )\n          })}\n        </div>\n      </div>\n    </div>\n  )\n}\nconst Price: React.FC = () => {\n  const price_List = [\n    { name: '3万以下', str: '0,3' },\n    { name: '3-5万', str: '3,5' },\n    { name: '5-10万', str: '5,10' },\n    { name: '10-15万', str: '10,15' },\n    { name: '15-20万', str: '15,20' },\n    { name: '20万以上', str: '20,!1' },\n  ]\n  return (\n    <div className=\"tw-border-color-gray-400  tw-border-b-1 tw-border-solid\">\n      <div className=\"tw-pb-12  tw-px-16\">\n        <Header title={'价格'} />\n        <div className=\"tw-grid  tw-grid-cols-3 tw-gap-y-8 tw-gap-x-12\">\n          {price_List.map((item, index) => {\n            return (\n              <a\n                key={item?.name}\n                target=\"_blank\"\n                href={`/usedcar/${item.str}-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x`}\n                className={classNames({\n                  'tw-border-color-gray-500  tw-border-r-1 tw-border-solid ':\n                    (index + 1) % 3 !== 0,\n                })}\n                onClick={() => {\n                  sendTeaCommEvent('clk_event', {\n                    event_id: 'price_region_specific_classification',\n                    module_id: 'home_page_used_car_module',\n                    button_name: item.name,\n                  })\n                }}\n              >\n                <p className=\"tw-text-14 line-1 tw-text-color-gray-800 hover:tw-text-common-orange\">\n                  {item?.name}\n                </p>\n              </a>\n            )\n          })}\n        </div>\n      </div>\n    </div>\n  )\n}\n\ninterface IFindCarItem {\n  tab_name: string\n  tab_key: string\n}\n\ninterface IFindCarProps {\n  tab_list?: IFindCarItem[]\n}\nconst FindCar: React.FC<IFindCarProps> = ({ tab_list }) => {\n  const findList = [\n    {\n      name: '视频看车',\n      herf: `/usedcar/x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-has_related_video-x-x`,\n    },\n    {\n      name: '4s店专区',\n      herf: `/usedcar/x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-car_source_types-x-x`,\n    },\n    {\n      name: '城市代步车',\n      herf: `usedcar/0,20-x-x-2-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x`,\n    },\n    {\n      name: '准新车',\n      herf: `usedcar/x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-0,3-1,3-x-x-x-x-x-x-x-x-x-x`,\n    },\n    {\n      name: '练手车',\n      herf: `/usedcar/0,5-0-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x`,\n    },\n    {\n      name: '轿车',\n      herf: `/usedcar/x-0-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x`,\n    },\n    {\n      name: 'SUV',\n      herf: `/usedcar/x-1-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x`,\n    },\n    {\n      name: 'MPV',\n      herf: `/usedcar/x-2-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x`,\n    },\n  ]\n  if (tab_list?.length === 0) {\n    findList.splice(1, 1)\n  }\n  return (\n    <div className=\"tw-pb-12  tw-px-16\">\n      <Header title={'功能找车'} />\n      <div className=\"tw-grid  tw-grid-cols-2 tw-gap-6\">\n        {findList.map((item) => {\n          return (\n            <a\n              key={item?.name}\n              target=\"_blank\"\n              href={item.herf}\n              className=\"tw-bg-color-gray-300 tw-border-color-gray-500  tw-border-1 tw-border-solid tw-rounded-2 tw-h-34 tw-flex tw-items-center tw-justify-center hover:tw-bg-common-yellow hover:tw-bg-opacity-24 hover:tw-border-common-yellow \"\n              onClick={() => {\n                sendTeaCommEvent('clk_event', {\n                  event_id: 'quick_search_car_specific_option',\n                  module_id: 'home_page_used_car_module',\n                  button_name: item.name,\n                })\n              }}\n            >\n              <p className=\"tw-text-14 line-1 tw-text-common-black  \">\n                {item?.name}\n              </p>\n            </a>\n          )\n        })}\n      </div>\n    </div>\n  )\n}\nconst HomeUsedcar: React.FC = () => {\n  const [usedCarList, setUsedCarList] = useState<any>([])\n  const [shSkuTabData, setShSkuTabData] = useState<any>([])\n  const [aroundCityList, setAroundCityList] = useState<any>([])\n  const [fontStyleString, setFontStyleString] = useState<string>()\n  const [prevEl, setPrevEl] = useState<HTMLElement | null>()\n  const [nextEl, setNextEl] = useState<HTMLElement | null>()\n  const cityName = useCityName()\n  const responsive = useResponsive()\n  const fetchData = async (cityName: string) => {\n    const [usedCarList, shSkuTabData, aroundCityList] = (\n      await Promise.allSettled([\n        getCars(\n          {\n            sh_city_name: cityName,\n            page: 1,\n          },\n          48,\n          null\n        ),\n        getShSkuTab(cityName, null),\n        getAroundCityList(cityName, null),\n      ])\n    ).map((d) => (d.status === 'fulfilled' ? d.value : null))\n    // const usedCarList = await getCars(\n    //   {\n    //     sh_city_name: cityName,\n    //     page: 1,\n    //   },\n    //   48,\n    //   null\n    // )\n    // const shSkuTabData = await getShSkuTab(cityName, null)\n    // const aroundCityList = await getAroundCityList(cityName, null)\n    setFontStyleString(usedCarList?.fontStyleString)\n    setUsedCarList(usedCarList?.search_sh_sku_info_list)\n    setShSkuTabData(shSkuTabData)\n    setAroundCityList([...new Set(aroundCityList || [])])\n    // 切换楼层锚点可见状态\n    PubSub.publish(UPDATE_ANCHOR_STATUS, {\n      id: 'usedcar',\n      name: [cityName, '二手车'].join('·'),\n      hidden: (usedCarList?.search_sh_sku_info_list?.length || 0) <= 7,\n    })\n  }\n  useEffect(() => {\n    if (cityName) {\n      fetchData(cityName)\n    }\n  }, [cityName])\n\n  const limit = responsive?.['xl'] ? 10 : 6\n  const tempCityList = aroundCityList?.slice(0, limit)?.concat(['更多'])\n  const cityList = tempCityList?.map((item: string, index: number) => {\n    const city = cityMap?.find((city: any) => city.name === item)\n    const city_id = city?.code\n    return {\n      city_name: item,\n      href:\n        index === tempCityList?.length - 1\n          ? `/usedcar/x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x`\n          : `/usedcar/x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-${city_id}-x-x-x-x-x`,\n    }\n  })\n\n  return usedCarList?.length > 7 ? (\n    <div\n      className=\"home-video-card tw-grid tw-grid-cols-40 tw-gap-x-12 fix-swiper-mutil-row-mt-16 \"\n      style={{ marginTop: 25 }}\n    >\n      <Head>\n        <style>{fontStyleString}</style>\n      </Head>\n      <React.Fragment>\n        <div\n          className=\"tw-col-span-30 2xl:tw-col-span-32 \"\n          data-log-view-config={JSON.stringify({\n            repeated: true,\n          })}\n          data-log-view={JSON.stringify({\n            event: 'show_event',\n            params: {\n              event_id: 'home_page_used_car_floor',\n              module_id: 'home_page_used_car_module',\n            },\n          })}\n        >\n          <div className=\"tw-flex tw-pr-16 tw-items-center tw-justify-between  tw-h-54\">\n            <div className=\"tw-flex line-1\">\n              <a\n                className=\"tw-text-18 xl:tw-text-20 tw-font-semibold header tw-pl-20 tw-whitespace-nowrap\"\n                href={`/usedcar/x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x-x`}\n                target=\"_blank\"\n                onClick={() => {\n                  sendTeaCommEvent('clk_event', {\n                    event_id: 'used_car_module_title',\n                    module_id: 'home_page_used_car_module',\n                    button_name: `${cityName}·二手车`,\n                  })\n                }}\n              >\n                {cityName}·二手车\n              </a>\n              <div className=\"tw-h-28 tw-inline-flex tw-items-center tw-ml-12 \">\n                {cityList?.map((item: any, index: number) => {\n                  return (\n                    <a\n                      key={item.city_name}\n                      target=\"_blank\"\n                      href={item.href}\n                      className={`tw-mr-25 ${style.tag}  tw-text-14  tw-text-color-gray-800  hover:tw-text-common-orange tw-relative `}\n                      onClick={() => {\n                        sendTeaCommEvent('clk_event', {\n                          event_id: 'specific_city_option',\n                          module_id: 'home_page_used_car_module',\n                          button_name: item.city_name,\n                        })\n                      }}\n                    >\n                      {item.city_name}\n                      {index === cityList?.length - 1 && (\n                        <i className=\"DCD_Icon icon_into_12 tw-text-14\" />\n                      )}\n                    </a>\n                  )\n                })}\n              </div>\n            </div>\n\n            <div className=\"tw-flex \">\n              <SwiperButton\n                ref={setPrevEl}\n                type=\"prev\"\n                className=\"swiper-button-disabled\"\n                onClick={() => {\n                  sendTeaCommEvent('clk_event', {\n                    event_id: 'used_car_module_switch_button',\n                    module_id: 'home_page_used_car_module',\n                    left_right: 'left',\n                  })\n                }}\n              />\n              <SwiperButton\n                ref={setNextEl}\n                type=\"next\"\n                onClick={() => {\n                  sendTeaCommEvent('clk_event', {\n                    event_id: 'used_car_module_switch_button',\n                    module_id: 'home_page_used_car_module',\n                    left_right: 'right',\n                  })\n                }}\n              />\n            </div>\n          </div>\n\n          <ContentList\n            data={usedCarList?.slice(0, 48) || []}\n            prevEl={prevEl}\n            nextEl={nextEl}\n          />\n        </div>\n        <div className=\"tw-col-span-10 2xl:tw-col-span-8 \">\n          <h1 className=\"tw-text-18 xl:tw-text-20 tw-font-semibold   tw-h-54 tw-flex tw-items-center\">\n            快捷筛选·二手车\n          </h1>\n          <div className=\"tw-w-full tw-h-auto  tw-bg-white\">\n            <HotBrands car_brand_list={shSkuTabData?.car_brand_list} />\n            <HotSeries car_series_list={shSkuTabData?.car_series_list} />\n            <Price />\n            <FindCar tab_list={shSkuTabData?.tab_list || []} />\n          </div>\n        </div>\n        <style jsx>\n          {`\n            .header {\n              background: url(${require('static/position.svg')}) left/18px\n                no-repeat;\n            }\n          `}\n        </style>\n      </React.Fragment>\n    </div>\n  ) : null\n}\n\nexport default HomeUsedcar\n","// extracted by mini-css-extract-plugin\nmodule.exports = {\"tag\":\"home-usedcar_tag__1e9Va\",\"brand\":\"home-usedcar_brand__21kzo\"};"],"sourceRoot":""}