419 lines
16 KiB
HTML
Executable File
419 lines
16 KiB
HTML
Executable File
<!DOCTYPE html>
|
|
<html lang="en">
|
|
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
|
<meta name="description" content="Certified Quality. Fair Pricing.">
|
|
|
|
<title>Orzar</title>
|
|
|
|
<!-- Favicon -->
|
|
<link rel="shortcut icon" type="image/x-icon" href="assets/media/user/favicon.png">
|
|
|
|
<!-- All CSS files -->
|
|
<link rel="stylesheet" href="assets/css/vendor/font-awesome.css">
|
|
<link rel="stylesheet" href="assets/css/vendor/bootstrap.min.css">
|
|
<link rel="stylesheet" href="assets/css/vendor/vue-select.css">
|
|
<!-- <link rel="stylesheet" href="assets/css/vendor/slick.css"> -->
|
|
<!-- <link rel="stylesheet" href="assets/css/vendor/slick-theme.css"> -->
|
|
<!-- <link rel="stylesheet" href="assets/css/vendor/classic.css"> -->
|
|
<!-- <link rel="stylesheet" href="assets/css/vendor/classic.date.css"> -->
|
|
<!-- <link rel="stylesheet" href="assets/css/vendor/smoothScorllbar.css"> -->
|
|
<link rel="stylesheet" href="assets/css/app.css">
|
|
<link rel="stylesheet" href="assets/css/index.css">
|
|
<link rel="stylesheet" href="assets/css/newcar.css">
|
|
|
|
</head>
|
|
|
|
<body class="x-hidden">
|
|
|
|
<!-- PRELOADER START -->
|
|
<div id="preloader">
|
|
<div class="spinner">
|
|
<img src="assets/media/loing.png" alt="" />
|
|
</div>
|
|
</div>
|
|
<!-- PRELOADER END -->
|
|
|
|
<!-- Main Wrapper Start -->
|
|
|
|
<!-- HEADER MENU START -->
|
|
<!-- 头部 -->
|
|
<header class="header my-40">
|
|
<div class="container-fluid">
|
|
<nav class="navigation d-flex align-items-center justify-content-between">
|
|
<a href="index.html" class="d-flex align-items-center">
|
|
<img src="assets/media/user/logo.png" alt="/logo" class="header-logo">
|
|
</a>
|
|
|
|
<div class="menu-button-right">
|
|
<div class="main-menu__nav">
|
|
<ul class="main-menu__list position-relative" id="menu-main">
|
|
<li>
|
|
<a href="index.html" data-i18n="home"></a>
|
|
</li>
|
|
<!-- <li>
|
|
<a href="about.html" data-i18n="about"></a>
|
|
</li> -->
|
|
<li class="dropdown">
|
|
<a href="rental-sidebar.html"><span><span data-i18n="UsedCar"></span><i class="fa-solid fa-angle-down ml8-i navnone"></i></span></a>
|
|
<ul>
|
|
<li><a href="rental-sidebar.html?store_status=1"
|
|
data-i18n="inventoryStatus.inStock"></a></li>
|
|
<li><a href="rental-sidebar.html?store_status=2"
|
|
data-i18n="inventoryStatus.inTransit"></a></li>
|
|
<li><a href="rental-sidebar.html?store_status=3"
|
|
data-i18n="inventoryStatus.onOrder"></a></li>
|
|
</ul>
|
|
</li>
|
|
<li class="has_lv3 dropdown">
|
|
<!-- <a href="https://hesucar.com/shop/" data-i18n="newcar" target="_blank"></a> -->
|
|
<a href="newcar.html" class="branditems">
|
|
<span><span data-i18n="newcar"></span><i class="fa-solid fa-angle-down ml8-i navnone"></i></span>
|
|
</a>
|
|
<ul class="sub-menu flex-layout">
|
|
</ul>
|
|
</li>
|
|
<li>
|
|
<a href="contact.html" data-i18n="Contactus"></a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<div class="main-menu__right">
|
|
<div class="d-md-inline d-none">
|
|
<a href="tel:+375(29)524803" class="pic mb-8">
|
|
<i class="fa-solid fa-phone-volume"></i>
|
|
<div class="text">
|
|
<p class="" data-i18n="companyinfo.tel"></p>
|
|
</div>
|
|
</a>
|
|
<a href="https://api.whatsapp.com/send/?phone=+86-18603858592&text=Hello&type=phone_number&app_absent=0" class="pic">
|
|
<img src="assets/media/icons/whatsapp1.png" class="whatsapp" alt="whatsapp">
|
|
<div class="text">
|
|
<p data-i18n="companyinfo.phone"></p>
|
|
</div>
|
|
</a>
|
|
</div>
|
|
<div class="d-flex custom-select position-relative">
|
|
<div class="select-selected" data-i18n="lang"></div>
|
|
<div class="select-items">
|
|
<!-- <div data-id="zh" data-i18n="zh"></div> -->
|
|
<div data-id="en" data-i18n="en"></div>
|
|
<div data-id="ru" data-i18n="ru"></div>
|
|
<!-- <div data-id="ar" data-i18n="ar"></div> -->
|
|
</div>
|
|
</div>
|
|
<div class="search-heart-icon d-md-flex d-none align-items-center gap-24">
|
|
<a href="contact.html" class="cus-btn">
|
|
<span class="btn-text" data-i18n="consult"></span>
|
|
<span data-i18n="consult"></span>
|
|
</a>
|
|
</div>
|
|
<a href="#" class="d-xl-none d-flex main-menu__toggler mobile-nav__toggler">
|
|
<i class="fa-light fa-bars"></i>
|
|
</a>
|
|
</div>
|
|
</nav>
|
|
</div>
|
|
</header>
|
|
<!-- HEADER MENU END -->
|
|
|
|
<!-- About-area start -->
|
|
<!-- 导航 -->
|
|
<section class="breadcrumbs">
|
|
<div class="txt-block container-fluid">
|
|
<span><a href="index.html">Home</a></span>/
|
|
<span data-i18n="newcar"></span>
|
|
</div>
|
|
</section>
|
|
<!-- About-area start end -->
|
|
<div id="app">
|
|
<!-- 搜索 -->
|
|
<div class="container-fluid pt-40">
|
|
<div class="mobile-filter-toggle d-md-none">
|
|
<button class="filter-btn" @click="toggleFilter">
|
|
<i class="fa fa-search"></i>
|
|
<span data-i18n="search.filter">筛选</span>
|
|
</button>
|
|
</div>
|
|
<div class="filter-container" :class="{ active: isFilterOpen }">
|
|
<div class="filter-section row">
|
|
<div class="col-lg-1 col-sm-2 text-c" data-i18n="search.brand">
|
|
</div>
|
|
<div class="alphabet-filter col-lg-11 col-sm-10">
|
|
|
|
<div class="alphabet-item" :class="{active: selectedLetter === 'hot'}" @click="filterByLetter('hot')" data-i18n="sectionTitles.hot"></div>
|
|
<div
|
|
v-for="letter in letters"
|
|
:key="letter"
|
|
class="alphabet-item"
|
|
:class="{active: selectedLetter === letter}"
|
|
@click="filterByLetter(letter)"
|
|
>{{letter}}</div>
|
|
<div class="alphabet-item" :class="{active: selectedLetter === 'all'}" @click="filterByLetter('all')" data-i18n="sectionTitles.all"></div>
|
|
</div>
|
|
</div>
|
|
<div class="filter-section row">
|
|
<div class="col-lg-1 col-sm-2">
|
|
</div>
|
|
<div class="col-lg-11 col-sm-10 brand">
|
|
<div v-for="brand in brandListAll"
|
|
:key="brand.id"
|
|
class="brand-item brand_brands"
|
|
:class="{brandactive: selectedBrand === brand.id}"
|
|
@click="selectBrand(brand.id)"
|
|
><img :src="brand.logo_full" alt="" />{{brand.name}}</div>
|
|
</div>
|
|
|
|
</div>
|
|
<div class="filter-section row pt-40 al-c">
|
|
<div class="col-lg-1 col-sm-2 text-c" data-i18n="search.Type"></div>
|
|
<div class="col-lg-11 col-sm-10 brand">
|
|
<div class="energy-item" :class="{brandactive: selectedenergy == ''}" @click="selectenergy('all')" data-i18n="sectionTitles.all"></div>
|
|
<div
|
|
v-for="energy in energyList"
|
|
:key="energy.id"
|
|
class="energy-item"
|
|
:class="{brandactive: selectedenergy === energy.id}"
|
|
@click="selectenergy(energy)"
|
|
>{{energy.name}}</div>
|
|
</div>
|
|
|
|
</div>
|
|
</div>
|
|
<div class="title-container my-24">
|
|
<h6 class="title" data-i18n="newcar"></h6>
|
|
</div>
|
|
<div class="row row-gap-3 carlist">
|
|
<div class="col-xxl-3 col-xl-4 col-lg-4 col-md-6" v-for="(item,index) in dataList" :key="index">
|
|
<div class="vehicle-card">
|
|
<div @click="godetil(item)" class="cursorpointer">
|
|
<img :src="item.cover_full" alt="car">
|
|
<h3 class="h3 title">{{item.name}}</h3>
|
|
<h6>￥{{item.price}}</h6>
|
|
<div class="vehica-car-card__separator"></div>
|
|
</div>
|
|
<div class="vehica-car-card__info">
|
|
<div class="vehica-car-card__info__single" >
|
|
<a href="https://api.whatsapp.com/send/?phone=+86-18603858592&text=Hello&type=phone_number&app_absent=0" data-i18n="bay"></a>
|
|
</div>
|
|
|
|
<div class="vehica-car-card__info__single">
|
|
{{item.brand_name}}
|
|
</div>
|
|
<div class="vehica-car-card__info__single">
|
|
{{item.model_name }}
|
|
</div>
|
|
<div class="vehica-car-card__info__single">
|
|
{{item.energy_name }}
|
|
</div>
|
|
<div class="vehica-car-card__info__single">
|
|
{{item.type_name }}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
</div>
|
|
<div class="pagination my-80" v-if="dataList.length>0">
|
|
<ul id="border-pagination">
|
|
<li class="page-item">
|
|
<button class="page-link" data-page="prev" @click="prevPage" :disabled="currentPage === 1">
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="15" height="29" viewBox="0 0 15 29"
|
|
fill="none">
|
|
<path fill-rule="evenodd" clip-rule="evenodd"
|
|
d="M12.6122 1.2927L0.465342 13.439C-0.120283 14.0246 -0.120283 14.9746 0.465342 15.5602L12.6116 27.7071C13.1972 28.2927 14.1472 28.2927 14.7328 27.7071C15.0532 27.3868 15.0532 26.8674 14.7329 26.5471L3.74659 15.5602C3.16097 14.9746 3.16097 14.0246 3.74659 13.439L14.7335 2.45269C15.0538 2.13237 15.0538 1.61303 14.7335 1.2927C14.1478 0.707079 13.1978 0.707079 12.6122 1.2927Z"
|
|
fill="#2D74BA" />
|
|
</svg>
|
|
</button>
|
|
</li>
|
|
<li class="page-item" v-for="page in visiblePages" :key="page" @click="gotoPage(page)">
|
|
<a href="#" class="page-link" :class="{ active: page === currentPage }">{{ page }}</a>
|
|
</li>
|
|
<li class="page-item">
|
|
<button class="page-link" data-page="next" :disabled="currentPage === totalPages"
|
|
@click="nextPage">
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="15" height="29" viewBox="0 0 15 29"
|
|
fill="none">
|
|
<path fill-rule="evenodd" clip-rule="evenodd"
|
|
d="M2.38778 1.2927L14.5347 13.439C15.1203 14.0246 15.1203 14.9746 14.5347 15.5602L2.38841 27.7071C1.80278 28.2927 0.852784 28.2927 0.267159 27.7071C-0.0531683 27.3868 -0.053175 26.8674 0.267144 26.5471L11.2534 15.5602C11.839 14.9746 11.839 14.0246 11.2534 13.439L0.266548 2.45269C-0.0537834 2.13237 -0.0537891 1.61303 0.266534 1.2927C0.852159 0.707079 1.80216 0.707079 2.38778 1.2927Z"
|
|
fill="#2D74BA" />
|
|
</svg>
|
|
</button>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<div v-if="isnone">
|
|
<p data-i18n="errors" class="error"></p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<!--Footer-start -->
|
|
<!-- 底部 -->
|
|
<footer class="pt-40">
|
|
<div class="container-fluid">
|
|
<div class="row mb-16 row-gap-4">
|
|
<div class="col-lg-4">
|
|
<div class="txt-block">
|
|
<a href="index.html">
|
|
<img src="assets/media/user/logo1.png" alt="/logo" class="header-logo">
|
|
</a>
|
|
</div>
|
|
<h5 class="white mb-32" data-i18n="title"> </h5>
|
|
<h6 class="white mb-16" data-i18n="Subscribe"></h6>
|
|
<form action="#" class="newsletter-form">
|
|
<input type="email" name="email" id="emailinput" class="form-input"
|
|
data-i18n-placeholder="placeholder.youremali">
|
|
<button type="button" id="subscribeFn">
|
|
<svg xmlns="http://www.w3.org/2000/svg" width="20" height="20" viewBox="0 0 20 20"
|
|
fill="none">
|
|
<g clip-path="url(#clip0_383_5670)">
|
|
<path
|
|
d="M19.8284 0.171647C19.6626 0.00586635 19.414 -0.0451101 19.1965 0.041921L0.36834 7.57308C0.152911 7.65925 0.00865304 7.86441 0.00037181 8.09632C-0.00787036 8.32819 0.121504 8.54308 0.330254 8.64433L7.75477 12.2451L11.3556 19.6697C11.4538 19.8722 11.6589 19.9999 11.8827 19.9999C11.8896 19.9999 11.8966 19.9998 11.9036 19.9995C12.1355 19.9913 12.3407 19.847 12.4268 19.6316L19.9581 0.803599C20.0451 0.585943 19.9941 0.337389 19.8284 0.171647ZM2.0349 8.16862L16.9812 2.19016L8.07383 11.0974L2.0349 8.16862ZM11.8313 17.9651L8.90246 11.926L17.8099 3.01875L11.8313 17.9651Z"
|
|
fill="#2D74BA" />
|
|
</g>
|
|
</svg>
|
|
</button>
|
|
</form>
|
|
</div>
|
|
<div class="col-lg-7 col-md-8 offset-lg-1">
|
|
<div class="row">
|
|
<div class="col-6">
|
|
<div class="links-block">
|
|
<h6 class="mb-32" data-i18n="sectionTitles.QuickLinks"></h6>
|
|
<ul class="unstyled">
|
|
<li class="mb-12">
|
|
<a href="index.html" data-i18n="home"> </a>
|
|
</li>
|
|
<li class="mb-12">
|
|
<a href="rental-sidebar.html" data-i18n="UsedCar"></a>
|
|
</li>
|
|
<li class="mb-12">
|
|
<a href="contact.html" data-i18n="Contactus"></a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
</div>
|
|
<div class="col-6">
|
|
<div class="links-block">
|
|
<div class="mb-24">
|
|
<h6 class="mb-32" data-i18n="sectionTitles.Contactinfo"></h6>
|
|
</div>
|
|
<ul class="unstyled">
|
|
<li class="mb-16">
|
|
<a href="tel:+375(29)524803"class="contact">
|
|
<img src="assets/media/footer/uil-outgoing-call.png" alt="call">
|
|
<p data-i18n="companyinfo.tel"></p>
|
|
</a>
|
|
</li>
|
|
<li class="mb-16">
|
|
<a href="https://api.whatsapp.com/send/?phone=+86-18603858592&text=Hello&type=phone_number&app_absent=0" class="contact">
|
|
<img src="assets/media/icons/whatsappw.png" class="whatsapp" alt="whatsapp">
|
|
<p data-i18n="companyinfo.phone"></p>
|
|
</a>
|
|
</li>
|
|
<li class="mb-24">
|
|
<div class="contact">
|
|
<img src="assets/media/footer/uil-envelope.png" alt="logo">
|
|
<a href="mailto:info@orzar.shop">info@orzar.shop</a>
|
|
</div>
|
|
</li>
|
|
</ul>
|
|
<!-- <h5 data-i18n="sectionTitles.Followus"></h5> -->
|
|
<!-- <div class="social-icons mb-12">
|
|
<ul class="d-flex unstyled gap-12">
|
|
<li>
|
|
<a href="">
|
|
<img src="assets/media/footer/Instagram.png" alt="logo">
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href="">
|
|
<img src="assets/media/footer/Twitter.png" alt="logo">
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href="">
|
|
<img src="assets/media/footer/Dribbble.png" alt="logo">
|
|
</a>
|
|
</li>
|
|
<li>
|
|
<a href="">
|
|
<img src="assets/media/footer/Linkedin.png " alt="logo">
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</div> -->
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<div class="hr-line bg-light-gray"></div>
|
|
<p class="mt-32 pb-32 text-center">@2025 All Rights Copyright <span
|
|
class="fw-700 color-sec">Orzar.</span>
|
|
Design & Developed By XINYOUHE <a href="privacypolicy.html" data-i18n="PrivacyPolicy" style="text-decoration:revert;"></a></p>
|
|
</div>
|
|
</footer>
|
|
<!--Footer-end -->
|
|
|
|
<!-- Back To Top Start -->
|
|
<button class="scrollToTopBtn"><i class="fa fa-arrow-up"></i></button>
|
|
|
|
<!-- Mobile Menu Start -->
|
|
<div class="mobile-nav__wrapper">
|
|
<div class="mobile-nav__overlay mobile-nav__toggler"></div>
|
|
<div class="mobile-nav__content">
|
|
<span class="mobile-nav__close mobile-nav__toggler"><i class="fa fa-times"></i></span>
|
|
<div class="logo-box">
|
|
<a href="index.html" aria-label="logo image"><img src="assets/media/user/logo.png" alt=""></a>
|
|
</div>
|
|
<div class="mobile-nav__container"></div>
|
|
<ul class="mobile-nav__contact list-unstyled">
|
|
<li>
|
|
<i class="fas fa-envelope"></i>
|
|
<a href="mailto:info@orzar.shop">info@orzar.shop</a>
|
|
</li>
|
|
<li>
|
|
<i class="fa fa-phone-alt"></i>
|
|
<a href="tel:+375(29)524803" data-i18n="companyinfo.tel"></a>
|
|
</li>
|
|
<li>
|
|
<img src="assets/media/icons/whatsapp.png" class="whatsapp1" alt="whatsapp">
|
|
<a href="https://api.whatsapp.com/send/?phone=+86-18603858592&text=Hello&type=phone_number&app_absent=0" data-i18n="companyinfo.phone"></a>
|
|
</li>
|
|
</ul>
|
|
<!-- <div class="mobile-nav__social">
|
|
<a href=""><i class="fa-brands fa-x-twitter"></i></a>
|
|
<a href=""><i class="fab fa-facebook"></i></a>
|
|
<a href=""><i class="fab fa-instagram"></i></a>
|
|
</div> -->
|
|
</div>
|
|
</div>
|
|
<!-- Mobile Menu End -->
|
|
|
|
<!-- Jquery Js -->
|
|
<script src="assets/js/vendor/bootstrap.min.js"></script>
|
|
<script src="assets/js/vendor/jquery-3.6.3.min.js"></script>
|
|
<!-- <script src="assets/js/vendor/vue.js"></script> -->
|
|
<!-- <script src="https://cdn.jsdelivr.net/npm/vue@2/dist/vue.js"></script> -->
|
|
<script src="assets/js/vendor/vue.js"></script>
|
|
<script src="assets/js/vendor/vue-select.js"></script>
|
|
<script src="assets/js/vendor/slick.min.js"></script>
|
|
<script src="assets/js/vendor/smooth-scrollbar.js"></script>
|
|
<script src="assets/js/vendor/picker.js"></script>
|
|
<script src="assets/js/vendor/picker.date.js"></script>
|
|
<script src="assets/js/i18n.js"></script>
|
|
<script src="assets/js/date.js"></script>
|
|
<!-- <script src="assets/js/vendor/ion.rangeSlider.js"></script> -->
|
|
<script src="assets/js/app.js"></script>
|
|
<script src="assets/js/ajax.js"></script>
|
|
<script src="assets/js/main.js"></script>
|
|
<script src="assets/js/newcar.js"></script>
|
|
</body>
|
|
|
|
</html> |