123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247 |
- import 'css/bootstrap.less';
- import 'bootstrap/dist/js/bootstrap.js';
- import 'css/newMenu/public.css';
- import 'css/newMenu/header.css'
- import 'css/newMenu/shopList.css';
- import 'js/public.js';
- $(function(){
- var shopData={};
- init();
- function init(){
- listData();
- add();
- selectFun()
- };
- function listData(){
- var data = localStorage.getItem('shopList');
- if(data){
- let shops = JSON.parse(data);
- shopData.data=shops.data
- list(shops.data);
- if((shops.data).length){
- $('.totalFooter').show();
- }else{
- $('.totalFooter').hide();
- }
-
- }
- };
- function list(data){
- let divs=[];
- data.map((item)=>{
- divs.push(`<li dataId="${item.id}" type="${item.type}">
- <p><span class="companyImg"></span>${'有限公司'}</p>
- <div class="shopBox">
- <div class="shopTr">
- <div class="checkIcon">
- <span class="checkImg checkNoImg"></span>
- <input type="checkbox" class='checkSingle'>
- </div>
- <div class="tdImg">
- <img src="${item.img}"/>
- <div class="tdText">
- <p>${unescape(item.name)}</p>
- </div>
- </div>
- </div>
- <div><span class="price">${item.price?'¥'+item.price:'面议'}</span></div>
- <div class="inpG">
- <button class="reduce">-</button>
- <input type="text" class="number" value="${item.number}">
- <button class="add">+</button>
- </div>
- <div><p class="priceTotal">${parseInt(item.price)>0?'¥'+parseInt(item.price)*item.number:'面议'}</p></div>
- <div><a class="del">删除</a></div>
- </div>
- </li>
- ` )
- })
- $('.shopLists').html(divs);
- }
- //数量加减;
- var nub=0;
- function add(){
- $('.add').click(function(){
- nub = $(this).siblings('.number').val();
- nub++;
- if(nub>99){
- nub=99
- }
- $(this).siblings('.number').val(nub);
- let index=$(this).parents('li').index();
- shopData.data[index].number=nub;
- nubTol();
- lacStor();
- })
- $('.reduce').click(function(){
- nub = $(this).siblings('.number').val();
- nub--;
- if(nub<1){
- nub=1
- }
- $(this).siblings('.number').val(nub);
- let index=$(this).parents('li').index();
- shopData.data[index].number=nub;
- nubTol();
- lacStor();
- })
- $('.number').keyup(function(){
- let val = $(this).val();
- if(isNaN(val)){
- $(this).val(1)
- };
- if(val>99){
- $(this).val(99)
- };
- if(val<1){
- $(this).val(1)
- };
- })
- }
- //单选图像处理
- $('.checkSingle').prop('checked',false);
- $('.checkboxAll').prop('checked',false);
- var nub=0;
- function selectFun(){
- let checkArr =[];
- $('.checkSingle').click(function(){
- let checks = $(this).prop('checked');
- if(checks){
- checkArr.push(checks);
- $(this).parents('li').addClass('active')
- $(this).siblings('.checkImg').removeClass('checkNoImg');
- }else{
- checkArr.pop();
- $(this).parents('li').removeClass('active')
- $(this).siblings('.checkImg').addClass('checkNoImg');
- }
- if(checkArr.length==$('.shopLists li').length){
- $('.checkboxAll').prop('checked',true);
- $('.checkboxAll').siblings('.checkImg').removeClass('checkNoImg')
- }else{
- $('.checkboxAll').prop('checked',false);
- $('.checkboxAll').siblings('.checkImg').addClass('checkNoImg')
- }
- if(checkArr.length){
- $('.orderOk').addClass('active');
- }else{
- $('.orderOk').removeClass('active');
- }
- nubTol();
- })
- //全选
- $('.checkboxAll').click(function(){
- let checkS = $(this).prop('checked');
- if(checkS){
- $('.shopLists li').addClass('active');
- $('.checkSingle').prop('checked',true);
- $('.checkImg').removeClass('checkNoImg');
- $('.orderOk').addClass('active');
- }else{
- checkArr=[];
- $('.checkSingle').prop('checked',false);
- $('.checkImg').addClass('checkNoImg');
- $('.shopLists li').removeClass('active');
- $('.orderOk').removeClass('active');
- }
- nubTol()
- })
- }
- //数量计算
- function nubTol(){
- let liCheck = $('.shopLists li.active'),nub=0,
- licheckOk = $('.shopLists li'),totalNub=0;
- for(let i =0;i<liCheck.length;i++){
- let num = liCheck.eq(i).find('.number').val();
- nub+=parseInt(num);
- }
- for(let i =0;i<licheckOk.length;i++){
- let num = licheckOk.eq(i).find('.number').val();
- totalNub+=parseInt(num);
- }
- $('.numberTotal').text(totalNub);
- $('.nubTotal').text(nub)
- }
- //删除
- $('.del').click(function(){
- $(this).parents('li').remove();
- lacStor()
- })
- function lacStor(){
- let lis= $('.shopLists li'),shopArr=[];
- for(let i=0;i<lis.length;i++){
- for(let j=0;j<(shopData.data).length;j++){
- if(lis.eq(i).attr('dataid')==(shopData.data)[j].id){
- shopArr.push((shopData.data)[j])
- }
- }
- }
- nubTol();
- let datas=new Object();
- datas.data=shopArr;
- if(!(datas.data.length)){
- $('.totalFooter').hide();
- $('.checkboxAll').prop('checked',false);
- $('.checkboxAll').siblings('.checkImg').addClass('checkNoImg');
- }
- let setData = JSON.stringify(datas);
- //本地存储
- localStorage.setItem('shopList',setData);
- }
- //删除选中的商品
- $('.btnDel').click(function(){
- if($('.shopLists li.active').length){
- $('.shopLists li.active').remove();
- lacStor();
- }else{
- msg('请选择需要删除的商品.')
- }
- })
- //提交订单
- $('.totalFooter .orderOk').click(function(){
- let lis= $('.shopLists li.active'),list=[];
- if(!lis.length){
- msg('亲,请选择商品!')
- return;
- }
- for(let i=0;i<lis.length;i++){
- let id=lis.eq(i).attr('dataid'),
- number=lis.eq(i).find('.number').val(),
- type=lis.eq(i).attr('type');
- list.push({
- commodityId:id,
- commodityQuantity:number,
- commodityType:type,
- orderChannel:1
- })
- };
- $.ajax({
- method: "get",
- dataType: "json",
- url: globalConfig.context + "/api/user/jtOrder/apply",
- data: {
- orderList:JSON.stringify(list)
- },
- success: function (data) {
- if(data&&data.error.length){
-
- }else{
-
- };
- }
- })
- })
- //提示框渐隐函数
- function msg(txt) {
- if($('.smg').hasClass('active')){
- return ;
- }
- $('.smg').addClass('active');
- var lit = $('#msg').val(txt);
- setTimeout(function () {
- $('.smg').removeClass('active');
- $('#msg').val('');
- }, 2000)
- }
- })
|