<title>MEGAPLAN</title>
            <meta name="keywords" content="MEGAPLAN | lighting | 灯具|无主灯">
            <meta name="description" content="MEGAPLAN ">
            <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
            <link rel="stylesheet" href="http://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css" /> 
            <link href="/en_US/index/css/index.css?t=1765694398" rel="stylesheet" type="text/css"><script src="/src/jquery.1.8.2.min.js" type="text/javascript"></script>
<script src="/src/swiper.1.8.2.min.js" type="text/javascript"></script>
<script src="/src/touchslider.js" type="text/javascript"></script>
<script>
 $(document).ready(function(){
    console.log(window.innerHeight)
   // 代码
  $(".homebanner").height(window.innerHeight);
  $(".carousel-inner div:first").addClass("active");
});
</script>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no"><header class="container-fluid fixed-top" >
		<div class="lok_logo"><a href="/index.html"><img  src="/public/uploads/20250104/0a3565c5b1067766c022ea6764f57748.png"/></a></div>
		<div class="lok_nav">
			<ul>
				<!--- <li><i class="bi bi-search"></i></li> --->
				<li class="d-none d-md-inline" ><a href="/down.html">iCatalogue</a></li>
				<li class="lok_nav_item" ><a href="/aboutus.html">About</a></li>
				<li class="lok_nav_item" ><a href="http://cn.megaplan.com.cn/">CN</a></li>
                <li class="lok_nav_item" ><a href="zhaoshangjiameng.html"><i class="bi bi-heart align-middle " style="font-size:1.2em"></i><span class="badge badge-danger total-cart" >0</span></a></li> 
                <li class="lok_nav_item menuicon"><i class="bi bi-list align-middle" style="font-size:1.5em; "></i></li>
			</ul>
		</div>
    </header>

	<!-- menu -->
	<div id="menu" class="fixed-top">
		<div class="et_slide_in_menu_container et_slide_in_menu_container_left">
		<div id="menu-product-left" class="menu-product-left-oscuro" style="background-image: url(http://pic21_1.qiyeku.com/qiyeku_pic/2012/8/31/wmjd/product/product_pic/image/2022_04_24/20220424015805598.jpg);">
		  <div id="menu-product-left-name">MG-DY-0010A-6W
			<span>
			  <a href="product.html">See product  →</a>
			</span>
		  </div>
		  <div id="menu-product-left-cat">TRACK LIGHT</div>
		</div>
		</div>

		<div class="et_slide_in_menu_container">
  
 <div class="et_pb_fullscreen_nav_container">
    <ul id="mobile_menu_slide" class="et_mobile_menu">
      <li>
        <a href="index.html">Home</a>
      </li>
      <li class="products_ul">
        <a href="#">Products
          <i class="bi bi-chevron-down et_mobile_menu_arrow"></i>
        </a>
        <ul class="sub-menu">
           <li>
		       <a href="product.html">ALL</a>
          </li>
                      <li><a title="Track Light" href="product_3641897.html" target="_self">Track Light</a> </li>
                      <li><a title="Spot Light" href="product_3647468.html" target="_self">Spot Light</a> </li>
                      <li><a title="Down Light" href="product_3641895.html" target="_self">Down Light</a> </li>
                      <li><a title="Pendant  Light" href="product_3641894.html" target="_self">Pendant  Light</a> </li>
                      <li><a title="Wall Light" href="product_3641893.html" target="_self">Wall Light</a> </li>
                      <li><a title="Table Light" href="product_3647470.html" target="_self">Table Light</a> </li>
                      <li><a title=" Underground Light" href="product_3647471.html" target="_self"> Underground Light</a> </li>
                      <li><a title="Lawn Light" href="product_3647472.html" target="_self">Lawn Light</a> </li>
                      <li><a title="Outdoor Light" href="product_3647475.html" target="_self">Outdoor Light</a> </li>
               
        </ul>
      </li>
      <li>
        <a href="tshow-57.html">Why Megaplan?
          <i class="bi bi-chevron-down et_mobile_menu_arrow"></i>
        </a>
        <ul class="sub-menu">
   <li><a title="R&D&I" href="tshow-57.html">R&D&I</a></li>     
   <li><a title="Quality" href="tshow-58.html">Quality</a></li>     
   <li><a title="Design" href="tshow-59.html">Design</a></li>     
   <li><a title="We listen to you" href="tshow-60.html">We listen to you</a></li>     
  
        </ul>
      </li>
      <li>
        <a href="aboutus.html">About us</a>
      </li>
      <li>
        <a href="album.html">Projects</a> 
      </li>
      <li>
        <a href="news.html">Latest news</a>
      </li>
      <li>
        <a href="video.html">Videos</a>
      </li>
      <li>
        <a href="down.html">Downloads</a>
      </li>
      <li>
        <a href="Contactus.html">Contact
          <i class="bi bi-chevron-down et_mobile_menu_arrow"></i>
        </a>
        <ul class="sub-menu">
         <li>
        <a href="#">Contact</a>
          </li>
          <li>
        <a href="#">Export Agent</a>
          </li>
          <li>
        <a href="#">We listen to you</a>
          </li>
          <li>
        <a href="#">Work with us</a>
          </li>
        </ul>
      </li>
    </ul>
      <div id="menu-contact">
      <div id="et-info">
        <span id="et-info-phone">Tel.:00966 112920494</span>
        <ul class="sub-menu-follow-me">
			<li><a target="_blank" href="#" rel="noopener noreferrer"><i class="bi bi-instagram"></i></a></li>
			<li><a target="_blank" href="#" rel="noopener noreferrer"><i class="bi bi-facebook"></i></a></li>
			<li><a target="_blank" href="#" rel="noopener noreferrer"><i class="bi bi-twitter"></i></a></li>
			<li><a target="_blank" href="#" rel="noopener noreferrer"><i class="bi bi-google"></i></a></li>
			<li><a target="_blank" href="#" rel="noopener noreferrer"><i class="bi bi-linkedin"></i></a></li>
			<li><a target="_blank" href="#" rel="noopener noreferrer"><i class="bi bi-pinterest"></i></a></li>
			<li><a target="_blank" href="3" rel="noopener noreferrer"><i class="bi bi-youtube"></i></a></li>
			</ul>
      </div>
      <!-- #et-info -->
    </div>
  </div>
</div>
 
	</div><!-- /menu -->
	<!--/header-->
<script>
    $(document).ready(function() {
    
      // 点击 "Products" 后展开或收起 sub-menu
      $('.products_ul').click(function() {
        $('.products_ul .sub-menu').slideToggle('slow');
        $(this).toggleClass('active'); // 切换 active 类
      });

      // 点击其他地方关闭 sub-menu
      $(document).click(function(event) {
        var target = event.target;
        if (!$(target).closest('li').hasClass('active')) {
          $('.products_ul .sub-menu').slideUp('slow');
          $('a[href="#"]').removeClass('active');
        }
      });
    });
  </script><!--HomeBanner-->
<div class="homebanner">
<div id="HomeBanner" class="carousel slide carousel-fade dropheaderanimation" data-ride="carousel">
  <div class="carousel-inner">
   
	<div class="carousel-item">
	<img title="ad1" alt="ad1" src="/public/uploads/20230801/03121df298e2bde8621c5d8e8a7802d4.jpg" class="d-block w-100"/>
    </div>
  </div>
</div>
</div>
  
<!--/HomeBanner-->
<!--Home Product category-->
<div id="HomeProductCategory" class="carousel slide" data-ride="carousel">
  <div class="carousel-inner">
    <div class="carousel-item active" data-interval="20000">
      <img src="/public/uploads/20230816/fb55bbc69697a39e7da8c937f453acb0.jpg" class="d-block w-100" alt="...">
      <div class="carousel-caption ">
        <h5>MAGNETIG SUCTION TRACK LIGHT</h5>
        <div class="carousel-caption-links"><a href="/product.html">SEE ALL</a> <a href="/product_3641897.html">SEE PRODUCT</a></div>
      </div>
    </div>
    <div class="carousel-item" data-interval="20000">
      <img src="http://pic21_1.qiyeku.com/qiyeku_pic/2012/8/31/wmjd/product/product_pic/image/2022_04_24/20220424021625946.jpg" class="d-block w-100" alt="...">
      <div class="carousel-caption ">
        <h5>SURFACE</h5>
        <div class="carousel-caption-links"><a href="/product.html">SEE ALL</a> <a href="/product_3641897.html">SEE PRODUCT</a></div>
      </div>
    </div>
    <div class="carousel-item" data-interval="20000">
      <img src="http://pic21_1.qiyeku.com/qiyeku_pic/2019/5/7/hkmjd/product/product_pic/image/2022_05_05/20220505093629939.jpg" class="d-block w-100" alt="...">
      <div class="carousel-caption ">
        <h5>SUSPENSION</h5>
        <div class="carousel-caption-links"><a href="/product.html">SEE ALL</a> <a href="/product_3641894.html">SEE PRODUCT</a></div>
      </div>
    </div>
	<div class="carousel-item" data-interval="20000">
      <img src="http://pic21_1.qiyeku.com/qiyeku_pic/2012/8/31/wmjd/product/product_pic/image/2022_05_05/20220505091611159.jpg" class="d-block w-100" alt="...">
      <div class="carousel-caption ">
        <h5>WALL, FLOOR & PORTABLE</h5>
        <div class="carousel-caption-links"><a href="/product.html">SEE ALL</a> <a href="/product_3641893.html">SEE PRODUCT</a></div>
      </div>
    </div>
	<div class="carousel-item" data-interval="20000">
      <img src="http://pic21_1.qiyeku.com/qiyeku_pic/2012/8/31/wmjd/product/product_pic/image/2022_04_24/20220424022723017.jpg" class="d-block w-100" alt="...">
      <div class="carousel-caption ">
        <h5>TRACK LIGHTS</h5>
        <div class="carousel-caption-links"><a href="/product.html">SEE ALL</a> <a href="/product_3641893.html">SEE PRODUCT</a></div>
      </div>
    </div>
	<div class="carousel-item" data-interval="20000">
      <img src="http://pic21_1.qiyeku.com/qiyeku_pic/2012/8/31/wmjd/product/product_pic/image/2022_04_24/20220424023359898.jpg" class="d-block w-100" alt="...">
      <div class="carousel-caption ">
        <h5>LAMPS</h5>
        <div class="carousel-caption-links"><a href="/product.html">SEE ALL</a> <a href="/product_3641890.html">SEE PRODUCT</a></div>
      </div>
    </div>
  </div>
  <button class="carousel-control-prev" type="button" data-target="#HomeProductCategory" data-slide="prev">
    <span class="carousel-control-prev-icon" aria-hidden="true"></span>
    <span class="sr-only">Previous</span>
  </button>
  <button class="carousel-control-next" type="button" data-target="#HomeProductCategory" data-slide="next">
    <span class="carousel-control-next-icon" aria-hidden="true"></span>
    <span class="sr-only">Next</span>
  </button>
</div>
<!--/Home Product category-->

<!-- HomePremios-->
<div id="HomePremios" class="container-fluid">
<div class="row no-gutters bg-light position-relative">
  <div class="col-md-6 mb-md-0 pt-md-0 pr-md-0 pb-md-0 pl-md-0">
    <img src="/public/uploads/20250104/9f6e6d43c16716e820b31d51390c1259.jpg" class="w-100">
  </div> 
  <div class="col-md-6 position-static p-4 pl-md-5">
    <h5 class="mt-5">MG-DZ-0072-7W</h5>
	<h2>Especially designed for:</h2>
	<p>Homes, living rooms, bedrooms, hallways, hotels, apartments,libraries, exhibition halls, museums, stations, hospitals, clothingstores, jewelry stores, cafes, shopping malls, showrooms, officespace, banks, opera houses, cinemas, showcases, etc.</p>
    <a href="/productshow-661.html">See all</a>
  </div>
</div>
</div>
<!-- /HomePremios-->
<!-- HomeProjects -->
<div id="homeprojects" class="container-fluid">
	<div class="swiper homeprojects">
	  <div class="swiper-wrapper">
		<div class="swiper-slide">
			
<div class="row no-gutters bg-light position-relative">
  <div class="col-md-6 position-static p-80">
    <h5 class="mt-5">PROJECTS</h5>
	<h2>Habitat.</h2>
	<p>Discover the projects carried out by Megaplan in the habitat sector. The best luminous solutions for projects in private houses and the most cutting-edge homes in the world. </p>
    <a href="/album.html">See PROJECTS</a>
  </div>
  <div class="col-md-6 et_pb_image">
    <img src="/public/uploads/20250104/d6abf8384240a7ce10bb28bf92baa70a.jpg" class="w-100" alt="...">
  </div> 
</div>
		</div>
		<div class="swiper-slide">
			
<div class="row no-gutters bg-light position-relative">
  <div class="col-md-6 position-static p-80">
    <h5 class="mt-5">PROJECTS</h5>
	<h2>Contract.</h2>
	<p>The most demanding luminous designs to light up projects in the tertiary sector, public buildings, service areas, etc. Discover here some of our projects in this field.</p>
    <a href="/album.html">See PROJECTS</a>
  </div>
  <div class="col-md-6">
    <img src="/public/uploads/20250104/4339024c42af9752fd46d4496791003c.jpg" class="w-100" alt="...">
  </div> 
</div>

		</div>
		<div class="swiper-slide">
			
<div class="row no-gutters bg-light position-relative">
  <div class="col-md-6 position-static p-80">
    <h5 class="mt-5">PROJECTS</h5>
	<h2>Retail.</h2>
	<p>Discover Megaplan projects to light up shops, boutiques and shopping areas. The best lighting to highlight products on display for marketing purposes.</p>
    <a href="/album.html">See PROJECTS</a>
  </div>
  <div class="col-md-6">
    <img src="/public/uploads/20250104/b768c6e3d0ac4e852b0752fe81b2beda.jpg" class="w-100" alt="...">
  </div> 
</div>

		</div>
	  </div>
	  <div class="swiper-pagination "></div>
	</div>	
</div>
<!-- /HomeProjects -->
<!-- HomeVideo 
<div class="HomeVideo container-fluid">
	<video width="100%" controls="" preload="none" poster="images/homevideocover.jpg" style="background:transparent no-repeat url('http://pic21_1.qiyeku.com/qiyeku_pic/2012/8/31/wmjd/product/product_pic/image/2022_04_19/20220419103615712.jpg'); background-repeat: no-repeat;background-size: cover;">
		<source src="http://file19.qiyeku.com/qiyeku_file/2012_08_31/wmjd/file/20220423060226489.mp4">
	</video>
</div> -->
<!-- /HomeVideo -->
<!-- HomeNews -->
<div class="HomeNews container text-center">
	<h2>News</h2>
	<div class="row">
			</div>
	<div class="seeall"><a href="/news.html">SEE ALL</a></div>
</div>
<!-- /HomeNews -->
<!-- Newsletter -->
<div class="Newsletter container-fluid text-center">
	<h2>Newsletter</h2>
	<p>Sign up to receive the latest Megaplan news.<p>
	<div class="Newsletter-form">
		<form>
		<div class="mc-field-group">
 <input id="mce-EMAIL" class="required email" name="email" type="email" value="" placeholder="Email">
 <input id="mc-embedded-subscribe" class="button " name="subscribe" type="button" value="→"> </div>
		</form>
<script>

$(function() {
$("#mc-embedded-subscribe").click(function() { 
//let username =       $("input[name='your-name']").val(); 
let email =     $("input[name='email']").val();
let subject =     "Newsletter";
let yourmessage = "Sign up to receive the latest Megaplan news.";
if (email.indexOf("@")>=0)
{
	$.ajax({
						url: "/service_api.ashx?action=add_message",
						type: "POST",
						data: {
                            "key":"300314-2022415141438",
							"linkman": "username", 
                            "email":  email,
							"subject": subject, 
                            "tel": "13800138000",
                            "content": yourmessage
						},
						success: function(data) {
                          if(data.return){
                            alert("success！");
                             }else{
                               alert(data.message);
                             }
						}
					}); 
}
					
				
				});
			})
</script>

	</div>
</div>
<!-- /Newsletter --><!-- footer -->
<footer id="main-footer" class="container-fluid">
<div id="footer-widgets" class="container-fluid">
	<div class="clearfix row footer-widget">

		<div class="col-md-2">
			<h5><a href="/product.html">Products</a></h5>
			<ul class="sub-menu">
				<li><a href="/product.html">ALL</a></li>
                   
<li><a href="/product_3641897.html" title="Track Light">Track Light</a></li>
     
<li><a href="/product_3647468.html" title="Spot Light">Spot Light</a></li>
     
<li><a href="/product_3641895.html" title="Down Light">Down Light</a></li>
     
<li><a href="/product_3641894.html" title="Pendant  Light">Pendant  Light</a></li>
     
<li><a href="/product_3641893.html" title="Wall Light">Wall Light</a></li>
     
<li><a href="/product_3647470.html" title="Table Light">Table Light</a></li>
     
<li><a href="/product_3647471.html" title=" Underground Light"> Underground Light</a></li>
     
<li><a href="/product_3647472.html" title="Lawn Light">Lawn Light</a></li>
     
<li><a href="/product_3647475.html" title="Outdoor Light">Outdoor Light</a></li>
 
C
			</ul>
		</div>
		<div class="col-md-2">
			<h5><a href="/tshow-5775.html">Why Megaplan?</a></h5>
			<ul class="sub-menu">
     
<li><a href="/tshow-57.html" title="R&D&I">R&D&I</a></li>
     
<li><a href="/tshow-58.html" title="Quality">Quality</a></li>
     
<li><a href="/tshow-59.html" title="Design">Design</a></li>
     
<li><a href="/tshow-60.html" title="We listen to you">We listen to you</a></li>
 
			</ul>
		</div>
		<div class="col-md-2">
			<h5><a href="/aboutus.html">About us</a></h5>
			<h5><a href="/album.html">Projects</a></h5>
		</div>
		<div class="col-md-2">
			
			<h5><a href="/news.html">Latest news</a></h5>
			<h5><a href="/down.html">Downloads</a></h5>

		</div>
		<div class="col-md-2">
			<h5><a href="/Contactus.html">Contact</a></h5>
			<ul class="sub-menu">
				<li><a href="/news_2262625.html">Export Agent</a></li>
				<li><a href="/tshow-60.html">We listen to you</a></li>
				<li><a href="/job.html">Work with us</a></li>
			</ul>
		</div>
		<div class="col-md-2">
			<h5><a href="/news.html">Newsletter</a></h5>
			<h5><a href="/product.html">follow me</a></h5>
			<ul class="sub-menu-follow-me">
			<li><a target="_blank" href="#" rel="noopener noreferrer"><i class="bi bi-instagram"></i></a></li>
			<li><a target="_blank" href="#" rel="noopener noreferrer"><i class="bi bi-facebook"></i></a></li>
			<li><a target="_blank" href="#" rel="noopener noreferrer"><i class="bi bi-twitter"></i></a></li>
			<li><a target="_blank" href="#" rel="noopener noreferrer"><i class="bi bi-google"></i></a></li>
			<li><a target="_blank" href="#" rel="noopener noreferrer"><i class="bi bi-linkedin"></i></a></li>
			<li><a target="_blank" href="#" rel="noopener noreferrer"><i class="bi bi-pinterest"></i></a></li>
			<li><a target="_blank" href="3" rel="noopener noreferrer"><i class="bi bi-youtube"></i></a></li>
			</ul>
		</div> 
	</div>
	<!--- <div id="footer-logos" class="container-fluid">
		<a target="_blank" href="#"><img src="http://pic21_1.qiyeku.com/qiyeku_pic/2012/8/31/wmjd/product/product_pic/image/2022_04_19/20220419101947525.png"></a>
		<a target="_blank" href="#"><img src="http://pic21_1.qiyeku.com/qiyeku_pic/2012/8/31/wmjd/product/product_pic/image/2022_04_19/20220419101959337.png"></a>
		<a target="_blank" href="#"><img src="http://pic21_1.qiyeku.com/qiyeku_pic/2012/8/31/wmjd/product/product_pic/image/2022_04_19/20220419102007152.png"></a>
		<a target="_blank" href="#"><img src="http://pic21_1.qiyeku.com/qiyeku_pic/2012/8/31/wmjd/product/product_pic/image/2022_04_19/20220419102017527.png"></a>
	</div>
     --->
	<div id="footer-bottom" class="container-fluid">
		<div class="footer-bottom-language">
		Language: <a href="http://cn.megaplan.com.cn/" class="badge badge-warning">CN</a>
		</div>
		<div class="footer-bottom-copyright">
		&copy; 2023 MEGAPLAN.
		</div>
	</div>

</div>
</footer>
<!-- /footer -->

	
<script>
var product_show = false
const testtext = ['HABITAT','CONTRACT','RETAIL'];
var swiper = new Swiper(".homeprojects", {
	loop:"true",
	effect: 'slide',
	fadeEffect: {
		crossFade: true
	},
	pagination: {
	  el: ".swiper-pagination",
	  type:"custom",
	  renderCustom: function (swiper,current,total) {
		var htmlstr = "";
		var _current = "";
		const swipertitle = ["Title","Habitat","Contract","Retail"];
		for (var i=1;i<=total;i++)
		  {
			if (i == current)
			{
				htmlstr = htmlstr + "<li class='homeprojects-swiper-pagination-active'>" + swipertitle[i] + "</li>";
			}else{
				htmlstr = htmlstr + "<li onclick='javascrtip:swiper.slideTo("+i+");' class='homeprojects-swiper-pagination'>" + swipertitle[i] + "</li>";
			};
		  };
		htmlstr = "<ul id='swiper-pagination-list'>" + htmlstr + "</ul>";
		return htmlstr;
	  },

	},
});

$(document).ready(function(){
	$("#menu-product-left").height(window.innerHeight).width($(window).width()/2);
	$(".menuicon").click(function () { 
var scroll_top = Math.max($("html").scrollTop(), $("body").scrollTop()); 
var header_black_css= {'background-color':'#fff','color':'#000'};
var header_wihte_css= {'background':'transparent','color':'#fff'};
var logo_wihte_img = "/public/uploads/20250104/0a3565c5b1067766c022ea6764f57748.png";
var logo_black_img = "/public/uploads/20250104/8f29a6dcdca4f27017ab4d45eb23efcb.png";
if ($(this).children("i").hasClass('bi-x-lg'))
{
	$(this).children("i").removeClass("bi-x-lg").addClass("bi-list");
	$(".et_slide_in_menu_container_left").animate({'left': '-100%'}, "100");
	$(".et_slide_in_menu_container").animate({'right': '-100%'}, "100");
	if (scroll_top >50)
	  {
		$("header").css(header_black_css);
		$("header a").css({color:'#000'});
		$(".lok_logo img").attr("src",logo_black_img); 
		$(this).children("i").css('color','#000');
	  }else{
		
		$("header").css(header_wihte_css);
		$("header a").css({color:'#fff'});
		$(".lok_logo img").attr("src",logo_wihte_img); 
		$(this).children("i").css('color','#fff');
	  }
}else{
	$(this).children("i").removeClass("bi-list").addClass("bi-x-lg").css('color','#ff0000');
	$("header").css({'background-color':'transparent','color':'#000'});
	$("header a").css({color:'#000'});
	
	$('.et_slide_in_menu_container_left').animate({left: '0'}, "100");
	$('.et_slide_in_menu_container').animate({right: '0'}, "100");
	//$("#menu-contact").animate({'right': '0'}, "100");
	
}		

	});



	$(".homebanner").height(window.innerHeight).width($(window).width());
	$(window).scroll(function(){ 
	if ($(".menuicon i").hasClass('bi-list'))
	{
	  var scroll_top = Math.max($("html").scrollTop(), $("body").scrollTop()); 
	  var header_black_css= {'background-color':'#fff','color':'#000'};
	  var header_wihte_css= {'background':'transparent','color':'#fff'};
var logo_wihte_img = "/public/uploads/20250104/0a3565c5b1067766c022ea6764f57748.png";
var logo_black_img = "/public/uploads/20250104/8f29a6dcdca4f27017ab4d45eb23efcb.png";
	   
      if (scroll_top > 50 || product_show == true)
	  {
		$("header").css(header_black_css);
		$("header a").css({color:'#000'});
		$(".lok_logo img").attr("src",logo_black_img); 
		$(".menuicon i").css('color','#000');
	  }else{
		
		$("header").css(header_wihte_css);
		$("header a").css({color:'#fff'});
		$(".lok_logo img").attr("src",logo_wihte_img); 
		$(".menuicon i").css('color','#fff');
	  }
	}
	  
	});

});
</script><script>
 
var dbName = 'myDatabase1234';
var dbVersion = 1;
let db1; // 声明 db 变量

var request1 = indexedDB.open(dbName, dbVersion);
 
request1.onerror = function(event) {
  console.log('无法打开数据库');
};

request1.onsuccess = function(event) {
  db1 = event.target.result; // 将数据库赋值给全局变量 db
  // 进行后续操作，如存储数据或执行查询
  // addLight(light); // 在成功打开数据库后，添加示例数据
  console.log('打开数据库');
  updateTotalCount(); 
};

request1.onupgradeneeded = function(event) {
  db = event.target.result; // 将数据库赋值给全局变量 db

  // 创建对象存储空间
  const objectStore = db.createObjectStore('lights', { keyPath: 'id', autoIncrement: true });

  // 定义字段
  const fields = [
    'sid',
    'name', 
    'color',
    'image',
    'url',
    'light_source',
    'luminous_flux',
    'colour_temperature',
    'cri',
    'light_beam_angle', 
    'dimming', 
    'create_time',
    'language',
    'sort',
    'recommend'
  ];

  // 创建索引
  fields.forEach(field => {
    objectStore.createIndex(field, field, { unique: false });
  });
};
  
var dataArray = []; 
var sendhtml = ""; 
  function updateTotalCount() {
  var transaction = db1.transaction(["lights"], "readonly");
  var objectStore = transaction.objectStore("lights");
  var request = objectStore.count();
  console.log(request)
  request.onsuccess = function(event) {
    var totalCount = event.target.result;
    var totalCartElement = document.querySelector(".total-cart");
    console.log(totalCount)
    if (totalCartElement) {
      totalCartElement.textContent = totalCount || "0";
    }
    
    var cursorRequest = objectStore.openCursor();
 
	   cursorRequest.onsuccess = function(event) {
    	var cursor = event.target.result;
    	if (cursor) {
          var data = cursor.value;
          dataArray.push(data);
          cursor.continue();
          
        // Append the table to a container element in your HTML// For example, if you have a container element with the id "tableContainer", you can append the table to it like this:
      
        }else{
          var data = dataArray;
          console.log(data)
          var table = $('<table class="tableFixHead"></table>');
          var thead = $('<thead></thead>').appendTo(table);
          var tbody = $('<tbody></tbody>').appendTo(table);
       
          // Create table headers
          var headers = $('<tr></tr>');
          headers.append('<th style="border:1px solid #ccc;"></th>');
          headers.append('<th style="border:1px solid #ccc;">Model</th>'); 
          headers.append('<th style="border:1px solid #ccc;">Color</th>');
          headers.append('<th style="border:1px solid #ccc;">Light source</th>');
          headers.append('<th style="border:1px solid #ccc;">Luminous flux</th>');
          headers.append('<th style="border:1px solid #ccc;">Power</th>');
          headers.append('<th style="border:1px solid #ccc;">Colour temperature</th>');
          headers.append('<th style="border:1px solid #ccc;">CRI</th>');
          headers.append('<th style="border:1px solid #ccc;">Light beam angle</th>');  
          headers.append('<th style="border:1px solid #ccc;">Dimming</th>'); 
          thead.append(headers);
          var currentDomain = window.location.protocol + '//' + window.location.hostname;
          // Create table rows
          $.each(data, function(index, item) {
            var row = $('<tr></tr>');
            row.append('<td style="border:1px solid #ccc;"><img src="' + currentDomain + item.image + '" style="width:100px;"></td>');
            row.append('<td style="border:1px solid #ccc;"><span class="hide-desktop">Model:</span>' + item.name + '</td>'); 
            row.append('<td style="border:1px solid #ccc;"><span class="hide-desktop">Color:</span>' + item.color + '</td>');
            row.append('<td style="border:1px solid #ccc;"><span class="hide-desktop">Light source:</span>' + item.light_source + '</td>');
            row.append('<td style="border:1px solid #ccc;"><span class="hide-desktop">Luminous flux:</span>' + item.luminous_flux + '</td>');
            row.append('<td style="border:1px solid #ccc;"><span class="hide-desktop">Power:</span>' + item.power + '</td>');
            row.append('<td style="border:1px solid #ccc;"><span class="hide-desktop">Colour temperature:</span>' + item.colour_temperature + '</td>');
            row.append('<td style="border:1px solid #ccc;"><span class="hide-desktop">CRI:</span>' + item.cri + '</td>');
            row.append('<td style="border:1px solid #ccc;"><span class="hide-desktop">Light beam angle:</span>' + item.light_beam_angle + '</td>');
            row.append('<td style="border:1px solid #ccc;"><span class="hide-desktop">Lighting efficiency:</span>' + item.lighting_efficiency + '</td>');
            row.append('<td style="border:1px solid #ccc;"><span class="hide-desktop">Dimming:</span>' + item.dimming + '</td>');  
            tbody.append(row);
          });

          table.append(tbody);
          
          sendhtml = table[0].innerHTML
          console.log(sendhtml)
        }
      }
    };
     

  request.onerror = function(event) {
    console.error("Error counting data:", event.target.error);
  };
} 
 
 
</script><script src="/en_US/index/src/index.js?t=1765694398" type="text/javascript"></script> 