## 首頁
功能：
#### 【顯示數據】：
>[info]查詢 `yf_good_cat` 商品分類表
/*
分類點擊，顯示對應的商品
*/
var categoryVue = new Vue({
el:"#category",
data:{
category:[] ,
activeId: '' ,
show: 1
},
/*
初始化分類數據
*/
created:function(){
var this_ = this;
$.get(base_url+"/home/welcome/index",function(rs){
this_.category = rs.data;
},'json')
},
methods: {
/**
* 點分類時
*/
category_change: function (id) {
$(".all_cat").removeClass('active');
var this_ = this;
this_.activeId = id;
productsVue.query.cat_id = id;
load_product(productsVue,'set')
},
all_category:function(){
this.activeId = " ";
$(".all_cat").addClass('active');
var this_ = this;
productsVue.loadPage = 1;
productsVue.products = [];
productsVue.loading = 1;
productsVue.query = {};
productsVue.total = "";
productsVue.show = 1;
productsVue.is_search = 0;
load_product(productsVue,'set')
}
}
});
>[info] 通過 `yf_goods_shop_common`中間表 來查詢 `yf_goods_common` 商品數據表 顯示商品詳情；
/**
加載商品
*/
function load_product(this_ , method){
var query = this_.query;
if(method == 'push'){
++ this_.loadPage;
this_.prev = 1;
}
if(method == 'set'){
this_.loadPage = 1
}
if(method == 'prev'){
--this_.loadPage;
if(this_.loadPage == 1){
this_.prev = 0;
}
}
query.page = this_.loadPage;
console.log('load products method:'+method+" current page:"+this_.loadPage);
$.get(base_url+"/home/welcome/products",query,function(rs){
if(!rs.data || rs.total == this_.loadPage ){
this_.loading = 0;
this_.total = rs.total
}else{
this_.loading = 1
}
this_.products = rs.data;
/*判斷此分類下有沒有商品*/
if(this_.products == null){
productsVue.active = 1;
}else{
productsVue.active = 0;
}
//掃碼槍直接錄入產品
if(this_.products){
var i = 0;
$.each(this_.products, function(j){
i++
})
}
if(productsVue.is_search != 1){
if(i==1){
console.log('bind click');
var current_obj = this_.products[0];
this_.click_goods(current_obj);
searchVue.message = '';
}
this_.is_search = 0
}
},'json')
}
#### 【加入購物車】：
>[info]點擊商品 把商品拼成數組 加入到右側 購物車 如果此商品存在 購物車內 再點擊 就是增加此商品的數量；
/*
加入購物車
*/
var cartVue = new Vue({
el:"#carts",
data:{
carts:[],
totalPrice:0,
isShow: true
},
created:function(){
var obj = cookie_get_cart();
if(obj){
this.carts = obj
}
},
watch: {
/*
監聽carts內容變化
有變化寫COOKIE
*/
carts:function(obj){
cookie_set_cart(obj)
}
},
methods:{
add:function(obj){
console.log(obj)
productsVueSet( obj , 'add' )
},
reduce:function(obj){
productsVueSet( obj , 'reduce')
},
change: function(obj){
if(obj.number>0){
if(parseInt(obj.number)>=parseInt(obj.common_stock)){
obj.number = obj.common_stock;
Public.tips.error('購買數量不能超過庫存');
}
productsVueSet(obj,obj.number)
}
}
}
});
#### 【刪除購物車商品】：
>[info]當購物車商品數量為1的時候 再點擊 “-” 從購物車中刪除此商品
也可點擊 掃把 圖標 直接清除購物車中所有商品 ；
/*
清空購物車
*/
var clearCatVue = new Vue({
el:"#clearCat",
methods:{
sure:function(){
var cart = cookie_get_cart();
if(cart['length']==0){
Public.tips.error('沒有可刪除的商品');
return false;
}
clearCat();
$('#clearCat').fadeOut()
},
close:function(){
$('#clearCat').fadeOut()
}
}
});
>[info]區別：直接清空數組 清空數組中指定數據
#### 【掛單】：
>[info]存入緩存 設置過期時間
1）、商品加入右側購物車內 暫不結賬時 可點擊掛單 必須有商品才可以掛單 輸入掛單備注信息 掛單成功 掛單列表顯示紅點 結賬后或三小時后 消失。
>[info]2）、掛單列表可根據掛單備注信息 進行搜索 相應的掛單信息
/*
* 掛單
*/
var gdVue = new Vue({
el:"#confirm",
data:{
message : ''
},
methods:{
keyups: function(){
if(!/^.{0,20}$/.test(this.message)){
Public.tips.error('掛單備注限制在20個字符以內');
this.message='';
}
},
close: function() {
$('#confirm').hide();
},
sure: function(){
var cart = cookie_get_cart();
if(cart==''){
Public.tips.error('請選擇商品');
return false;
}else{
$('.red').addClass('icon-dot');
}
if(this.message == ''){
Public.tips.error('請輸入掛單信息');
return false;
}
var guadan = get_cache('guadan');
var message = get_cache('message');
var user = get_cache('user');
var carts = get_cache(user+"_carts");
var price = totalPrice(carts);
allVue.totalNum = totalNum(carts);
allVue.totalPrice = price;
if(!guadan) guadan = [];
if(!message)message = [];
if(guadan.toString().indexOf(user) == -1) {
if(!carts)carts = [];
message.unshift(this.message);
guadan.unshift(user);
if(!orderVue.orderList){
orderVue.orderList = [];
orderVue.priceList = [];
orderVue.goodsList = [];
}
orderVue.orderList.unshift(user);
orderVue.priceList.unshift(price);
orderVue.goodsList.unshift(carts);
orderVue.messageList = message;
} else {
for(var j in guadan) {
if(guadan[j] == user ) {
Vue.set(orderVue.messageList, j, this.message);
Vue.set(orderVue.goodsList, j, carts);
Vue.set(orderVue.priceList, j, price);
}
}
}
set_cache('guadan', guadan);
set_cache('message', orderVue.messageList);
clearCat('gd');
set_cache('user', new Date().toLocaleString());
$('#confirm').hide();
this.message = '';
}
}
});
#### 【搜索商品】：
/*
搜索
*/
var searchVue = new Vue({
el:"#search",
data:{
message:''
},
methods: {
keydown: function (ev) {
if(!orderVue.show){
productsVue.is_search = 0;
}
},
del: function(){
this.message='';
}
},
watch: {
/*
監聽serach內容變化
*/
message:function(wq){
if(!orderVue.show){
productsVue.query.wq = wq;
productsVue.is_search = 1;
load_product(productsVue,'set')
}else{
gdSearch(this.message);
}
}
}
});
#### 【搜索會員】：
>[info]通過 `wp_users_discount`關聯 `wp_users` 會員表
模糊查詢 出 要搜索的 會員卡號和手機號
1）、點擊左側結賬區域【點擊選擇會員】按鈕，右側跳轉【搜索會員】頁面；通過輸入手機號碼、會員名稱，進行搜索。
2）、搜索會員有折扣并且折扣未開啟狀態 則可以享受折扣
/*
搜索會員
*/
var searchUserVue = new Vue({
el:"#searchUser",
data:{
search_user:'',
show: 0,
users:{ },
infos:{ },
ulist:{ },
zkname:' ',
} ,
methods: {
click: function(){
var this_ = this;
$('.zhekou').css('display','none');
var wq = $('#code').val();
if(!wq){
Public.tips.error('請輸入正確的會員信息進行查詢');
return false;
}
$.get(base_url+"/home/user_search/index",{wq:wq},function(rs){
if(!rs.data){
Public.tips.error( "搜索的會員不存在");
}
this_.users = rs.data;
var Swipersearch = new Swiper('.swiper-container4', {
scrollbar: '.swiper-scrollbar4',
direction: 'vertical',
slidesPerView: 'auto',
slidesPerView:5,
mousewheelControl: true,
freeMode: true,
initialSlide :0,
observer:true,//修改swiper自己或子元素時，自動初始化
observeParents:true//修改swiper的父元素時，自動初始化swiper
});
},'json')
},
confirm: function(userId,ucname){
this.zkname = ucname;
$('.zhekou').css('display','block');
var this_ = this;
$.get(base_url+"/home/user_search/infos",{userId:userId},function(rs){
if(!rs.data){
Public.tips.error( "此會員暫無折扣");
}
this_.infos = rs.data;
},'json')
var user = get_cache('user');
var cart = get_cache(user + '_carts');
set_cache(user + '_carts', null);
set_cache('user' , "user_"+userId);
set_cache('user_' + userId +'_carts', cart);
},
zhekou:function(discount,status){
if(status == 0){
lessVue.disc = 0 ;
set_cache('discount_status',0);
}else{
if(discount != 0){
set_cache('discount_status',1);
lessVue.disc = discount;
$('.less').css('display','block')
}
}
controlVue.show = 0;
this.show = 0;
$('#leftProduct').show();
$('#searchUser').hide();
},
retu:function(){
controlVue.show = 0;
this.show = 0;
$('#leftProduct').show();
$('#searchUser').hide();
}
}
});
#### 【功能菜單】：
>[info]1）會員管理：新增會員/編輯會員資料
>[info]2）交接班記錄：收銀員的交接班記錄
>[info]3）退貨處理：門店規定要求內進行退貨處理。
>[info]4）小票掃碼訂單：通過掃描小票上的二維碼進行支付。
>[info]5）關于我們：系統版本信息。
/**
* 導航欄
*/
var slideVue = new Vue({
el: '#slide',
data:{
active:0
},
methods: {
slide: function(obj){
this.active = obj;
var url = '';
switch(obj)
{
case 1:
url = '/home/welcome/member';
break;
case 2:
url = '/home/welcome/shift';
break;
case 3:
url = '/home/welcome/equipment';
break;
case 4:
url = '/home/welcome/return_products';
break;
case 5:
url = '/home/welcome/ticket';
break;
case 6:
url = '/home/welcome/logo';
break;
}
$.ajax({
type: 'GET',
url: base_url+ url,
data: {},
dataType: "json",
success: function(data) {
if(data.status) {
$(" body").html(data.html);
}
}
});
}
}
});
#### 【結算】：
>[info]1、支付方式包含：
1）現金支付
2）支付寶支付：掃碼
3）微信支付：掃碼
4）銀聯POS支付
5）小票掃碼支付
>[info]實收金額 必須填寫 且不能小于應收金額
/*
* 結算
*/
var countVue = new Vue({
el:"#count",
data:{
num:0,
price:0
},
methods: {
total: function(){
var cart = cookie_get_cart();
if(!cart) {
Public.tips.error('請選擇商品');
return false;
}
this.num = totalNum(cart);
this.price = totalPrice(cart);
var that = this;
var user = get_cache('user');
var discount_status = get_cache('discount_status');
var goods = [];
for (var i in cart) {
var carts = [];
carts.push(cart[i].id);
carts.push(cart[i].number);
goods[i] = carts;
}
var prices = that.price.toFixed(2);
$.ajax({
type: "POST",
url: base_url+"/home/welcome/pay",
data: {user:user,discount_status:discount_status, goods:goods, price: prices, type:'common'},
dataType: "json",
success: function(data) {
if(data.status) {
$(" body").html(data.html);
}
}
});
}
}
});
#### 【作廢】：
>[info]刪除此訂單數組
點擊作廢 彈出提示框
點擊確定 返回首頁
點擊取消 彈出框消失 繼續操作結算
/*
* 彈出框
*/
abolish: function() {
this.cancel = 1;
},
/**
* 作廢訂單
*/
sure: function() {
if(this.type == 'ticket'){
Public.tips.error('小票訂單無法作廢');
return false;
}
var user = get_cache('user');
cookie_clear();
payVue.back();
},
/**
* 取消作廢
*/
not_sure: function() {
this.cancel = 0;
},
#### 【完成結算】：
>[info]生成訂單 插入到 `wp_order`
>[info]完成結算 生成小票 訂單結束
>[info]點擊打印小票 打印機打印小票
>[info]點擊繼續收銀 回到首頁繼續收銀
/**
* 完成結算
*/
total: function() {
var obj = this.show;
this.way = 'ok';
if(!this.actual && obj == <?php echo config('payment.cash');?>) {
Public.tips.error('請輸入實收金額');
return false;
}
if(parseFloat(this.actual) < parseFloat(this.price) && obj == "<?php echo config('payment.cash');?>") {
Public.tips.error('實收金額需大于等于訂單金額');
return false;
}
var that = this;
if(obj != <?php echo config('payment.cash');?> ){
that.actual = '';
}
if(this.type == 'common'){
var user = get_cache('user');
var discount_status = get_cache('discount_status');
var carts = get_cache(user+ '_carts');
var goods = [];
for (var i in carts) {
var cart = [];
cart.push(carts[i].id);
cart.push(carts[i].number);
goods[i] = cart;
}
$.ajax({
type: "POST",
url: base_url+"/home/welcome/settlement",
data: {user:user,discount_status:discount_status, type:obj, goods:goods, price:that.price,return_price:this.give, actual:that.actual, num:that.num, kind:'common',order_id:that.order_id },
dataType: "json",
success: function(data) {
if(data.status) {
cookie_clear();
common(that.order_id);
}
}
});
} else {
$.ajax({
type: "POST",
url: base_url+"/home/welcome/settlement",
data: {type:obj, price:that.price, actual:that.actual, num:that.num,order_id:that.order_id, kind:'ticket'},
dataType: "json",
success: function(data)
{
if (data.status)
{
common(that.order_id);
}
}
});
}
},
