index.js 14 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337
  1. var isFormal = window.location.href.indexOf('www.caimei365.com') !== -1;
  2. if(isFormal){var _czc = _czc || [];_czc.push(["_setAccount", "1279558759"]);}
  3. var homeData = new Vue({
  4. el: '#container',
  5. data: {
  6. userId:0,
  7. asideNav: [],
  8. liveList:[],//右侧直播模块
  9. cmImageList:[],//右侧活动模块
  10. infoList:[],//右侧文章模块
  11. popupFlag:false
  12. },
  13. filters: {
  14. NumFormat: function(value) {//处理金额
  15. return Number(value).toFixed(2);
  16. },
  17. },
  18. methods: {
  19. // 美博会弹窗链接
  20. popupPage:function(){
  21. this.popupFlag=false;
  22. window.location.href='/activity/activityTopic.html?id=306&name=美博会';
  23. localStorage.setItem('lockTime',Date.now());
  24. window.localStorage.setItem('isActivityStatus',true);
  25. },
  26. // 关闭美博会弹窗
  27. closePopup:function(){
  28. this.popupFlag=false;
  29. $('.Popup').slideUp(100);
  30. localStorage.setItem('lockTime',Date.now());
  31. localStorage.setItem('isActivityStatus',true);
  32. },
  33. diffTime:function(time){
  34. var date = Date.now();
  35. console.log('缓存时间戳',time);
  36. console.log('当前时间戳',date);
  37. console.log('计算时间戳',(date-time));
  38. return (date -time) < 2*60*1000 ? false : true
  39. },
  40. // 页面主图轮播
  41. swiperBanner: function(){
  42. setTimeout(function(){
  43. if (isPC) {
  44. $('#swiper-container').slide({
  45. mainCell:".swiper-wrapper-banner",
  46. titCell:".swiper-pagination-banner span",
  47. effect: "leftLoop",
  48. prevCell:".swiper-button-prev",
  49. nextCell:".swiper-button-next",
  50. interTime: 3000,
  51. autoPlay: true,
  52. autoPage: false,
  53. trigger: "mouseover"
  54. });
  55. } else {
  56. var swiper = new Swiper('#swiper-container', {
  57. loop : true,
  58. autoplay: {
  59. delay: 3000,
  60. disableOnInteraction: false
  61. },
  62. navigation: {
  63. nextEl: '.swiper-button-next',
  64. prevEl: '.swiper-button-prev'
  65. },
  66. pagination: {
  67. el: '.swiper-pagination',
  68. clickable :true
  69. }
  70. });
  71. }
  72. },300);
  73. },
  74. GetHomeRightData: function(){
  75. var _self = this;
  76. PublicApi.GetHomeRightData({ source: 1 },function(response){
  77. if(response.code == 0){
  78. var data = response.data;
  79. _self.liveList = data.liveList;
  80. _self.cmImageList = data.cmImageList;
  81. _self.infoList = data.infoList;
  82. }else{
  83. CAIMEI.Alert(response.msg, '确定');
  84. }
  85. });
  86. },
  87. setAsideNav: function(){
  88. var _self = this;
  89. if (isPC) {
  90. var titArr = $('.section_page_title').find('h1');
  91. _self.asideNav = [];
  92. for (var i=0; i<titArr.length; i++){
  93. _self.asideNav.push({
  94. id: $(titArr[i]).attr("data-id"),
  95. value: $(titArr[i]).text()
  96. })
  97. }
  98. }
  99. },
  100. // 商品楼层轮播
  101. swiperFloor: function(){
  102. setTimeout(function(){
  103. // 商品轮播
  104. if (isPC) {
  105. var cell = $(".swiper-pagination-floor");
  106. var size = Math.ceil(cell.attr("data-id")/5);
  107. var span = '';
  108. for (var i = 0; i < size; i++) {
  109. span += '<span></span>';
  110. }
  111. cell.html(span);
  112. $('#recommendBox').slide({
  113. mainCell:".recommendBox-wrapper",
  114. titCell:".swiper-pagination-floor span",
  115. effect: "leftLoop",
  116. autoPlay: false,
  117. scroll:5,
  118. vis:5
  119. });
  120. } else {
  121. var swiper = new Swiper('#recommendBox', {
  122. slidesPerView: 2,
  123. slidesPerColumn: 2,
  124. spaceBetween:0,
  125. slidesPerGroup: 2,
  126. autoplay: {
  127. delay: 3000,
  128. disableOnInteraction: false
  129. },
  130. pagination: {
  131. el: '.swiper-pagination'
  132. }
  133. });
  134. }
  135. // 图片懒加载
  136. setTimeout(function(){
  137. $("#recommendBox img[data-original]").lazyload();
  138. },0)
  139. },500);
  140. },
  141. showSubNav: function(event){
  142. var el = event.currentTarget;
  143. var parent = $(el).parent();
  144. parent.siblings().removeAttr("style").removeClass("on").find(".navItem").hide();
  145. if (parent.hasClass("on")) {
  146. parent.removeAttr("style").removeClass("on").find(".navItem").slideUp(200);
  147. } else {
  148. var height = parent.height();
  149. parent.addClass("on").find(".navItem").slideDown(200);
  150. if (parent.find(".navItem").length>0) {
  151. setTimeout(function(){
  152. height += parent.find(".navItem").height();
  153. parent.css("height",height);
  154. },200);
  155. }
  156. }
  157. },
  158. // 设置页面查看更多按钮显示
  159. setReadeMore: function(){
  160. $(".section_page_more").each(function(){
  161. var id = $(this).attr('data-id')*1;
  162. var size = $(this).attr('data-size')*1;
  163. var el = $(this);
  164. var readMore = false;
  165. if (isPC) {
  166. if([1,3].indexOf(id) !== -1 && size>7) {
  167. readMore = true;
  168. }
  169. if([2,4,7].indexOf(id) !== -1 && size>5) {
  170. readMore = true;
  171. }
  172. if(5 === id && size>10) {
  173. readMore = true;
  174. }
  175. } else {
  176. if([1,3].indexOf(id) !== -1 && size>3) {
  177. readMore = true;
  178. }
  179. if([2,4].indexOf(id) !== -1 && size>2) {
  180. readMore = true;
  181. }
  182. if(5 === id && size>4) {
  183. readMore = true;
  184. }
  185. }
  186. if (readMore) {
  187. el.addClass("show");
  188. } else {
  189. el.parents(".section_page").find(".section_page_main").addClass("max");
  190. }
  191. });
  192. },
  193. // 点击查看更多
  194. showMoreItem: function(e){
  195. var el = e.currentTarget;
  196. $(el).parents(".section_page").find(".section_page_main").addClass("max");
  197. $(el).parents(".section_page_more").hide();
  198. },
  199. // 设置页面商品价格
  200. setPriceShown: function(){
  201. var productIds = [];
  202. var userId = GLOBAL_USER_ID;
  203. var shopId = GLOBAL_SHOP_ID;
  204. var userIdentity = GLOBAL_USER_IDENTITY;
  205. $(".main_price_text").each(function(){
  206. var id = $(this).attr('data-id');
  207. if (productIds.indexOf(id) === -1) {
  208. productIds .push(id);
  209. }
  210. });
  211. // 获取商品价格列表
  212. $.getJSON(coreServer+"/commodity/price/list",{
  213. userId: GLOBAL_USER_ID,
  214. productIds: productIds.join(',')
  215. }).done(function (res) {
  216. if (res.code === 0 && res.data) {
  217. var priceList = res.data;
  218. $(".main_price_none").hide();
  219. $(".price_grade_club").hide();
  220. $(".price_grade_shop").hide();
  221. $(".main_price_login").show();
  222. priceList.map(function(price){
  223. // 用户身份 0、个人 1、协销 2、会员机构 3、供应商 4,普通机构
  224. // priceFlag: 0公开价格 1不公开价格 2仅对会员机构公开
  225. var parent = $(".main_price_text.product_"+ price.productId);
  226. var priceFlag = parent.find(".main_price_login").attr('data-id')*1;
  227. if (priceFlag===3 || userIdentity===2 || (priceFlag === 0 && userIdentity===4 ) || (userIdentity===3 && shopId === price.shopId*1)) {
  228. parent.find(".price_o_num").text(Number(price.originalPrice).toFixed(2));
  229. parent.find(".price_num").text(Number(price.price).toFixed(2));
  230. if(price.promotions && price.promotions.type*1===1 && price.promotions.mode*1===1){
  231. parent.find(".main_price_show").hide();
  232. parent.find(".main_price_show.none").show();
  233. }
  234. } else if (userIdentity===4 && priceFlag === 2){
  235. parent.find(".main_price_show").hide();
  236. parent.find(".price_grade_club").show();
  237. } else {
  238. parent.find(".main_price_show").hide();
  239. parent.find(".price_grade_shop").show();
  240. }
  241. });
  242. }
  243. });
  244. }
  245. },
  246. created: function() {
  247. if(GLOBAL_TOKEN){
  248. this.userId = GLOBAL_USER_ID;
  249. }
  250. },
  251. mounted: function() {
  252. var _this = this;
  253. // 页面主图轮播
  254. this.swiperBanner();
  255. // 设置页面查看更多
  256. this.setReadeMore();
  257. // 推荐专区商品轮播
  258. this.swiperFloor();
  259. // 设置右侧导航
  260. this.setAsideNav();
  261. // 获取设置商品价格
  262. if (GLOBAL_USER_ID) {
  263. this.setPriceShown();
  264. }
  265. // Dom加载后
  266. this.$nextTick(function(){
  267. // 图片懒加载
  268. $("img[data-original]").lazyload();
  269. });
  270. // 侧边栏滚动判断
  271. var distance = 0;
  272. $(window).scroll(function () {
  273. if($('body').attr("style") && $('body').attr("style").indexOf('fixed')>0){
  274. return false;
  275. }
  276. var scrollSize = Math.max($('html').scrollTop(), $('body').scrollTop());
  277. if(scrollSize >300){
  278. $('#sideNav').show();
  279. if(isPC){
  280. // $('#advertising').show();
  281. // 鼠标滚动楼层
  282. setTimeout(function () {
  283. distance = scrollSize;
  284. },0);
  285. // 侧边导航栏高亮
  286. $('.section_page_title').each(function (i,e) {
  287. //每个元素距离顶部的距离
  288. var top = $(e).offset().top;
  289. if(scrollSize > distance){
  290. if(scrollSize >= (top-300)){
  291. $('#sideNav').find('a').eq(i).addClass('on').siblings().removeClass("on");
  292. }
  293. }else {
  294. if(scrollSize >= (top-600)){
  295. $('#sideNav').find('a').eq(i).addClass('on').siblings().removeClass("on");
  296. }
  297. }
  298. });
  299. // 侧边模块固定 fixed
  300. if($('#fixed-wrap').length>0 && $(window).width()>1400) {
  301. var tocWrap = $('#fixed-wrap'),
  302. changeSize = $("#globalHead").outerHeight() + $("#swiper-container").outerHeight() + $("#sidebar").outerHeight();
  303. //changeSize = document.getElementById("header").offsetHeight + document.getElementById("sidebar").offsetHeight;
  304. scrollSize >= changeSize ? tocWrap.addClass("fixed") : tocWrap.removeClass("fixed");
  305. }
  306. }
  307. }else {
  308. $('#sideNav').hide();
  309. $('#advertising').hide();
  310. }
  311. });
  312. // 侧边导航
  313. setTimeout(function(){
  314. $('#sideNav').on("click", 'a[data-id]',function () {
  315. var id = $(this).attr('data-id');
  316. var floorScroll = $('.section_page_title [data-id='+id+']').offset().top-200;
  317. $('html,body').animate({scrollTop: floorScroll},600);
  318. });
  319. },2000);
  320. //关闭广告图
  321. $('#advertising').on('click','.close',function () {
  322. $(this).parents('.item').hide();
  323. });
  324. // var isActivityStatus = localStorage.getItem('isActivityStatus');
  325. // //新加优惠券弹窗
  326. // if(isActivityStatus){
  327. // var lockTime = localStorage.getItem('lockTime');
  328. // var eTime = this.diffTime(lockTime);
  329. // _this.showflag = eTime;
  330. // }else{
  331. // setTimeout(function () {
  332. // _this.showflag = true;
  333. // },1000);
  334. // }
  335. }
  336. });