|
@@ -6,36 +6,242 @@ import 'css/newMenu/shopList.css';
|
|
|
import 'js/public.js';
|
|
|
|
|
|
$(function(){
|
|
|
- listData();
|
|
|
+ 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=[],
|
|
|
- imgs;
|
|
|
+ let divs=[];
|
|
|
data.map((item)=>{
|
|
|
- divs.push(`<tr dataId="${item.id}">
|
|
|
- <td>
|
|
|
- <p>${item.companyName}</p>
|
|
|
- <input type="checkbox">
|
|
|
- <img src="${item.img}"/>
|
|
|
- <p>${unescape(item.name)}</p>
|
|
|
- </td>
|
|
|
- <td>${item.price}</td>
|
|
|
- <td>
|
|
|
- <button class="reduce">-</button>
|
|
|
- <input type="text" value="${item.number}">
|
|
|
- <button class="add">+</button>
|
|
|
- </td>
|
|
|
- <td>${parseInt(item.price)>0?parseInt(item.price)*item.number:'面议'}</td>
|
|
|
- <td><a>删除</a></td>
|
|
|
- </tr>
|
|
|
+ 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)
|
|
|
+ }
|
|
|
})
|