Skip to content

L
lumastoreapp
Commit 5edbb49b authored by xieyishang's avatar xieyishang
Browse files
Options

sss

parent 1f6ae507
Hide whitespace changes
Inline Side-by-side
Showing with 907 additions and 2 deletions
pages.json
View file @ 5edbb49b
......@@ -341,6 +341,12 @@
//机型列表
"navigationBarTitleText": "开启操作教程"
}
},
{
"path":"pages/CardSend/CardSend",
"style" : {
"navigationBarTitleText": "卡券发放"
}
}
......
pages/CardSend/CardSend.scss 0 → 100644
View file @ 5edbb49b
//卡券发放的样式
.CardSend{
min-height: 100vh;
background: #F5F2F2;
}
.cardhead{
height:88upx;
line-height: 88upx;
background:rgba(255,255,255,1);
position: relative;
z-index: 3;
.tabitems{
text-align: center;
.titles{
font-size:30upx;
font-family:PingFang SC;
font-weight:500;
color:rgba(0,0,0,1);
display: inline-block;
}
//选中的状态
&.active{
.titles{
border-bottom: 2px solid #FF6900;
}
}
}
}
//tab end
//list
.inoutlist{
margin: 0 24upx;
margin-top: 20upx;
border-radius: 14upx;
.inputitem{
border-bottom: 1px solid #f1f1f1;
height:99upx;
line-height: 99upx;
background:rgba(255,255,255,1);
//border-radius:14upx 14upx 0px 0px;
padding:0 20upx;
.names{
font-size:30upx;
color:rgba(0,0,0,1);
min-width: 286upx;
}
.inputs{
height:99upx;
line-height: 99upx;
//padding-left: 136upx;
color:#000000;
font-size: 30upx;
}
.plclass{
color:#B6B6B6;
}
}
.inputitem:nth-child(1){
border-radius:14upx 14upx 0px 0px;
}
.inputitem:nth-last-child(1){
border: 0;
}
}
//发放范围
.Range{
background:rgba(255,255,255,1);
margin: 0 24upx;
margin-bottom: 0;
padding: 0 20upx;
//height:165upx;
.title{
padding-top: 35upx;
padding-bottom: 35upx;
font-size:30upx;
color:rgba(0,0,0,1);
}
.chilidlistbox{
margin-bottom: 37upx;
width: 100%;
.itemname{
font-size:28upx;
color:rgba(178,178,178,1);
}
.mr_130{
margin-right: 98upx;
}
}
}
.Range1{
margin-top: 20upx;
border-bottom: 1px solid #f1f1f1;
}
//时间选择
.timeboxs{
margin: 20upx 24upx;
padding: 0 20upx;
height:99upx;
background:rgba(255,255,255,1);
border-radius:0px 0px 14upx 14upx;
.title{
font-size:30upx;
color:rgba(0,0,0,1);
}
.inputbox{
position: relative;
width:250upx;
height:72upx;
border:1px solid rgba(181,181,181,1);
margin-left: 20upx;
.jiantouicon{
position: absolute;
top: 12px;
right: 12px;
width:34upx;
height:20upx;
}
.inputs{
width:250upx;
height:72upx;
line-height: 72upx;
padding-left:10upx;
font-size:30upx;
color:rgba(0,0,0,1);
}
}
}
//提交的按钮
.submitbtns{
margin: 0 24upx;
margin-top: 60upx;
height:88upx;
line-height: 88upx;
text-align: center;
background:rgba(254,197,156,1);
border-radius:6upx;
font-size:32upx;
color:rgba(255,255,255,1);
}
.submitbtns.active{
background: #FF6900;
}
//弹窗内容 选择参与优惠的商品bg
.childboxmain{
background: #FFFFFF;
padding: 0 24upx;
padding-bottom: 55upx;
border-top-left-radius: 7px;
border-top-right-radius: 7px;
.title{
font-size:30upx;
font-family:PingFang SC;
font-weight:bold;
color:rgba(0,0,0,1);
}
.titlebox{
margin-bottom: 50upx;
padding-top: 37upx;
.imgs{
width:29upx;
height:29upx;
}
}
.chindlist{
.chilidlistbox{
.itemlable{
margin-bottom: 46upx;
//margin-right: 30upx;
}
.itemname{
font-size:30upx;
color:rgba(0,0,0,1);
margin-right: 20upx;
}
.checkbox{
//margin-right: 8upx;
}
}
}
}
//已发的卡券
.yfcardlist{
margin: 0 24upx;
margin-top: 20upx;
padding-bottom: 40upx;
.yfcardItem{
height:265upx;
width:698upx;
margin-bottom: 20upx;
.cardleft{
position: relative;
width: 500upx;
background: #EF612E;
padding-left: 30upx;
padding-top: 26upx;
}
.cardleft:after,.cardright:after{
content: '';
display: block;
width: 15px;
height: 100%;
height:265upx;
background-size: 17px 11px;
background-repeat: repeat-y;
background-image: -o-radial-gradient(#F5F2F2 8px, transparent 8px);
background-image: radial-gradient(#F5F2F2 8px, transparent 8px);
position: absolute;
}
.cardleft:after{
top: 0;
left: -12px;
}
.cardright:after{
top: 0;
right: -12px;
}
.cardright{
position: relative;
width: 198upx;
padding-right: 10upx;
background: #EF612E;
border-left:2px dashed #FFFFFF;
font-weight: bold;
text-align: center;
color:#FFFFFF;
.text{
font-size: 32upx;
}
.prcie{
font-size: 60upx;
}
}
//优惠券里面的内容
.kaiguanbox{
.leftkai{
.name{
font-size:32upx;
font-family:PingFang SC;
font-weight:bold;
color:rgba(255,255,255,1);
}
.status{
font-size:22upx;
color:rgba(255,255,255,1);
}
}
.kaiguan{
margin-right: 40upx;
.kgitem{
font-size:24upx;
width:97upx;
height:51upx;
color:#FFFFFF;
border:2px solid rgba(255,255,255,1);
background:#EF612E;
border-radius:4upx 0px 0px 4upx;
}
.guan{
color:rgba(255,255,255,1);
border:2px solid rgba(255,255,255,1);
border-radius:0px 4upx 4upx 0px;
}
.active{
background:#FFFFFF;
color:#FF5212;
}
}
}
.quaninfos{
margin-top: 25upx;
.text{
font-size: 26upx;
color:#FFFFFF;
}
.bj{
color: #007aff;
}
}
//中间的圆点
.cardleft:before,.cardright:before{
content: "";
width: 60upx;
height: 60upx;
border-radius: 50%;
background: #F5F2F2;
position: absolute;
z-index:2;
}
.cardleft:before{
right: -15px;
top:-20px;
}
.cardright:before{
left: -17px;
bottom:-20px;
}
}
}
\ No newline at end of file
pages/CardSend/CardSend.vue 0 → 100644
View file @ 5edbb49b
<template>
<!-- 卡券发放 -->
<!-- 卡券 -->
<view class="CardSend yicode">
<view class="cardhead flex ali-c ">
<view class="tabitems flex1" :class="{active:tabactive==1}" @tap="taggleTab(1)" >
<view class="titles">卡券发放</view>
</view>
<view class="tabitems flex1 " :class="{active:tabactive==2}" @tap="taggleTab(2)" >
<view class="titles ">已发卡券</view>
</view>
</view>
<!-- tab切换 -->
<!-- 卡券发放 -->
<view class="mainboxs" v-show="tabactive==1 && showshare==false">
<!-- 输入框列表 -->
<view class="inoutlist">
<view class="inputitem flex">
<view class="names">优惠券名称</view>
<input type="text" placeholder="请填写优惠券名称" v-model="parameter.coupon_name" class="inputs" placeholder-class="plclass" >
</view>
<view class="inputitem flex">
<view class="names">优惠金额</view>
<input type="number" placeholder="请填写优惠金额" v-model="parameter.money" class="inputs" placeholder-class="plclass" >
</view>
<view class="inputitem flex">
<view class="names">每人最大领取数</view>
<input type="number" placeholder="请填写领取数 " v-model="parameter.max_fetch" class="inputs" placeholder-class="plclass" >
</view>
<view class="inputitem flex">
<view class="names">满多少元可以使用</view>
<input type="number" placeholder="请填写满多少元可以使用" v-model="parameter.at_least" class="inputs" placeholder-class="plclass">
</view>
<view class="inputitem flex">
<view class="names">发放数量</view>
<input type="number" placeholder="请填写满多少元可以使用" v-model="parameter.count" class="inputs" placeholder-class="plclass">
</view>
</view>
<!-- 第一块结束 -->
<!-- 发放范围 -->
<view class="Range Range1">
<view class="title">发放范围</view>
<view class="chilidlist flex">
<radio-group class="flex ali-c jus-b chilidlistbox" @change="radioChange">
<label class="flex ali-c" >
<view>
<radio color="#FF6900" value="1" :checked="parameter.give_type==1" />
</view>
<view class="itemname">本店</view>
</label>
<label class="flex ali-c" >
<view>
<radio color="#FF6900" value="2" :checked="parameter.give_type==2" />
</view>
<view class="itemname">本地区</view>
</label>
<label class="flex ali-c" >
<view>
<radio color="#FF6900" value="3" :checked="parameter.give_type==3" />
</view>
<view class="itemname">全网</view>
</label>
</radio-group>
</view>
</view>
<view class="Range">
<view class="title" @tap="togglePopup">参与商品</view>
<view class="chilidlist flex">
<radio-group class="flex ali-c chilidlistbox" @change="radioChange1">
<label class="flex ali-c mr_130" >
<view>
<radio color="#FF6900" value="1" :checked="parameter.range_type==1" />
</view>
<view class="itemname">全部商品</view>
</label>
<label class="flex ali-c mr_130" @tap="showmodles">
<view>
<radio color="#FF6900" value="0" :checked="parameter.range_type==0" />
</view>
<view class="itemname">部分商品</view>
</label>
</radio-group>
</view>
</view>
<!-- 单选endn -->
<!-- //表单提交的参数
parameter:{
at_least: "10",//满多少可以用
count: "100",//发放数量
coupon_name: "测试优惠券",//优惠券名称
end_time: "2019年12月03日",//结束时间
start_time: "2019年12月03日",//开始时间
give_type: "1",//发放范围 1本地 2本地区 3全网
goods_id: ["1810", "5905", "5910"],//可用商品
max_fetch: "2",//每人最大可以使用
money: "9.9",//金额
range_type: "0",//参与的商品 1全部 0部分
}-->
<!-- timebox 时间选择 -->
<view class="timeboxs flex ali-c">
<view class="title">发放时间</view>
<view class="inputbox" @tap="showtime(1)">
<input type="text" class="inputs" value="" v-model="parameter.start_time" disabled="disabled" placeholder="投放时间" placeholder-class="plclass" />
<image class="jiantouicon" v-show="parameter.start_time==''" src="/static/news/xiamassfd.png" mode=""></image>
</view>
<view style="margin-left: 10;">-</view>
<view class="inputbox" style="margin-left: 0;" @tap="showtime(2)">
<input type="text" class="inputs" value="" v-model="parameter.end_time" disabled="disabled" placeholder="到期时间" placeholder-class="plclass" />
<image class="jiantouicon" v-show="parameter.start_time==''" src="/static/news/xiamassfd.png" mode=""></image>
</view>
</view>
<view class="submitbtns" v-show="!parameter.id" :class="{active:istruesub}" @tap="coupons" >确定发放</view>
<view class="submitbtns" v-show="parameter.id" :class="{active:istruesub}" @tap="coupons" >编辑提交</view>
</view>
<!-- 已发卡券 -->
<view class="yfcardlist" v-show="tabactive==2">
<view class="yfcardItem flex" v-for="(item,index) in cardlist" :key="index">
<view class="cardleft">
<view class="kaiguanbox flex jus-b ali-c">
<view class="leftkai">
<view class="name oneline">{{item.coupon_name}}</view>
<view class="status">当前状态：{{item.status==0?'投放中':'未投放'}}</view>
</view>
<view class="kaiguan flex ali-c">
<view class="kai kgitem flexc" @tap="switch_couponsFun(item,2,index)" :class="{active:item.status==0}">开启</view>
<view class="kai kgitem flexc" @tap="switch_couponsFun(item,0,index)" :class="{active:item.status==2}">关闭</view>
</view>
</view>
<view class="quaninfos">
<view class="text">每人领取{{item.max_fetch}}次 发放{{item.count}}张 已领取{{item.get_num}}张</view>
<view class="text">发放范围
<text class="ml-10 mr-10" v-if="item.give_type==3">全网</text>
<text class="ml-10 mr-10" v-else-if="item.give_type==2">本地区</text>
<text class="ml-10 mr-10" v-else>本店</text>
参与商品 <text class="ml-10 mr-10" v-if="item.range_type==1">全部</text>
<text class="ml-10 mr-10" v-else>部分商品</text>
满{{item.at_least}}元使用
</view>
<view class="text flex ali-c jus-b">
<text>有效期:{{item.start_time}}至{{item.end_time}}</text>
<text v-if="item.get_num==0" class="bj pr-10" @tap="detailsFun(item)">编辑</text>
</view>
</view>
</view>
<view class="cardright flexc">
<view>
<view class="text">优惠</view>
<view class="prcie">{{item.money}}元</view>
</view>
</view>
</view>
<!-- <empty v-if="cardlist.length==0"></empty> -->
</view>
<!-- 选择参与活动的商品的弹出 -->
<!-- 底部分享弹窗 -->
<uni-popup :show="showshare" :type="type" @change="change">
<view class="childboxmain">
<view class="titlebox flex ali-c jus-b">
<view class="title">选择参与优惠的商品</view>
<image class="imgs" @tap="showshare=false" src="/static/news/plicons.png" mode=""></image>
</view>
<!-- scroll scroll-left="120" -->
<!-- @scroll="" -->
<scroll-view class="scroll-view_H" style="height: 50vh;" scroll-y="true" >
<view class="chindlist ">
<checkbox-group class="flex ali-c flex-wrap chilidlistbox" @change="radioChange2" v-model="parameter.goods_id">
<label class="flex ali-c jus-b itemlable" v-for="(item,index) in shoplist" :key="index">
<view class="itemname">{{item.product_name}}</view>
<view class="checkbox">
<checkbox color="#FF6900" :value="item.product_id" :checked="item.checked" />
</view>
</label>
</checkbox-group>
</view>
</scroll-view>
<view class="submitbtns active" @tap="showshare=false" >确定</view>
<!-- 提交确认 -->
</view>
</uni-popup>
<!-- 时间弹窗 -->
<w-picker
mode="range"
startYear="2019"
endYear="2029"
:defaultVal="defaultVal"
:current="false"
@confirm="onConfirm"
themeColor="#ff6900"
ref="picker"
></w-picker>
</view>
</template>
<script>
import uniPopup from '@/components/uni-popup/uni-popup.vue'
import wPicker from "@/components/w-picker/w-picker.vue";//时间弹窗
import { couponList, closedCoupons,couponGoods,addEditCoupons} from "@/utils/api/coupon.js"
// import empty from "@/components/empty/empty.vue"
export default {
components:{
uniPopup,
wPicker,
// empty,
},
data() {
return {
istruesub:true,
tabactive:1,
showshare: false,//弹窗
type:"bottom",
shoplist:[],//自己店铺的商品列表
//表单提交的参数
parameter:{
at_least: "",//满多少可以用
count: "",//发放数量
coupon_name: "",//优惠券名称
end_time: "",//结束时间
start_time: "",//开始时间
give_type: "1",//发放范围 1本地 2本地区 3全网
goods_id: [],//可用商品 "1810", "5905", "5910"
max_fetch: "",//每人最大可以使用
money: "",//金额
range_type: "1",//参与的商品 1全部 0部分
//id:"", //优惠劵id 编辑必传
action:"add",//编辑必传 方式（添加add，修改edit）
},
parameter1:{
at_least: "10",//满多少可以用
count: "100",//发放数量
coupon_name: "测试优惠券",//优惠券名称
end_time: "2019-12-03",//结束时间
start_time: "2019-12-03",//开始时间
give_type: "1",//发放范围 1本地 2本地区 3全网
goods_id: [],//可用商品 "1810", "5905", "5910"
max_fetch: "2",//每人最大可以使用
money: "9.9",//金额
range_type: "1",//参与的商品 1全部 0部分
},
//时间弹窗
defaultVal:[],
selectList:[],
timetype:1,
cardlist:[],//已发的卡券
isallshow:false,
page:0,
};
},
onLoad(){
//获取商品列表
this.shop_goodsFun();
var d = new Date();
// this.defaultVal = [(d.getFullYear()).toString(),(d.getMonth()+1).toString()]
this.defaultVal = [(d.getFullYear()).toString(),(d.getMonth()+1).toString(),'01','-',(d.getFullYear()).toString(),(d.getMonth()+1).toString(),'01'];
},
//滚动到最底部
onReachBottom(){
console.log("11");
if(!this.isallshow && this.tabactive==2){
this.shop_couponFun();
}
},
methods:{
//接口start
//获取商城商品
async shop_goodsFun(){
let res = await couponGoods({
});
if(res.code==0){
let list = res.data;
list.map((item,index)=>{
item.product_id = item.product_id.toString();
return item;
})
this.shoplist = list;
}else{
this.parameter.range_type= 1;
// this.$api.msg(res.msg);
}
},
//coupons 商户发放卡券 提交发放卡券的方法 submit
async coupons(){
let can = this.parameter;
can.goods_id = can.goods_id.join(";");
let res = await addEditCoupons(can);
if(res.code==0){
this.$api.msg(res.msg);
setTimeout(()=>{
this.chongzhi();//重置
this.tabactive = 2;
},1000)
}else{
this.$api.msg(res.msg);
}
},
//已发卡券
async shop_couponFun(){
this.page++;
let res = await couponList({
page:1,
});
if(res.code==0){
if( res.data!=null){
this.cardlist = [...this.cardlist,...res.data];
}else{
this.isallshow = true;
this.$api.msg("没有更多了~");
}
}else{
this.$api.msg(res.msg);
}
},
//卡券单个的开关
async switch_couponsFun(item,valse,index){
let res = await closedCoupons({
id:item.id,
status:item.status==0?2:0,//开启（0），关闭 2
});
if(res.code==0){
this.$api.msg(res.msg);
console.log("status",this.cardlist[index].status);
this.cardlist[index].status = res.data.status;
console.log("status",this.cardlist[index].status);
}else{
this.$api.msg(res.msg);
}
},
//优惠券详情 编辑使用
async detailsFun(item){
//let res = await details(item.id);
if(item){
//this.shoplist = res.data.coupons_goods;
let parameter = {
at_least:item.at_least,
count:item.count,
coupon_name:item.coupon_name,
end_time:item.end_time,
start_time:item.start_time,
give_type:item.give_type,
goods_id:item.goods_id,
max_fetch:item.max_fetch,
money:item.money,
range_type:item.range_type,
id:item.id,
action:"edit",
}
let iddata = [];
this.shoplist.forEach((item,index)=>{
if(item.checked){
iddata.push(item.product_id);
}
})
parameter.goods_id = iddata;
this.parameter = parameter;
this.tabactive = 1;
}else{
this.$api.msg(res.msg);
}
},
//接口end
chongzhi(){
this.parameter = {
at_least: "",//满多少可以用
count: "",//发放数量
coupon_name: "",//优惠券名称
end_time: "",//结束时间
start_time: "",//开始时间
give_type: "1",//发放范围 1本地 2本地区 3全网
goods_id: [],//可用商品
max_fetch: "",//每人最大可以使用
money: "",//金额
range_type: "1",//参与的商品 1全部 0部分
};
},
taggleTab(inde){
this.tabactive = inde;
},
//发放范围
radioChange(e){
console.log(e.detail.value);
this.parameter.give_type = e.detail.value;
},
//参与的商品
radioChange1(e){
//console.log(e);
this.parameter.range_type = e.detail.value;
},
radioChange2(e){
//选择产品的单选
console.log(e);
this.parameter.goods_id = e.detail.value;
},
//弹窗里面的方法
togglePopup(type, open) {
this.type = "bottom"
this.showshare = true;
},
cancel(type) {
this.showshare = false
},
change(e) {
//console.log('是否打开:' + e.show)
if (!e.show) {
this.showshare = false
}
},
//时间组件事件
onConfirm(e){
console.log(e);
// this.parameter.start_time = e.checkArr[0]+"年"+e.checkArr[1]+"月"+e.checkArr[2]+"日";
// this.parameter.end_time = e.checkArr[3]+"年"+e.checkArr[4]+"月"+e.checkArr[5]+"日";
this.parameter.start_time = e.checkArr[0]+"-"+e.checkArr[1]+"-"+e.checkArr[2];
this.parameter.end_time = e.checkArr[3]+"-"+e.checkArr[4]+"-"+e.checkArr[5];
},
showtime(){
this.$refs.picker.show()
},
hiddetime(){
this.$refs.picker.hide()
},
//显示商品列表
showmodles(){
this.showshare = true;
}
},
watch:{
tabactive(e){
console.log(e);
if(e==2){
//已发卡券
this.page = 0;
this.cardlist = [];
this.isallshow = false;
this.shop_couponFun();
}
}
}
}
</script>
<style lang="scss">
@import "./CardSend.scss"
</style>
utils/api/coupon.js 0 → 100644
View file @ 5edbb49b
import request from "./../request.js";
/**
* 请求接口封装
*
* noAuth false 是需要鉴权的 true 是不用鉴权的
*
* 商家助手的接口封装
*
*/
//已发放劵列表
export function couponList(data)
{
return request.post("Coupon/couponList",data,{ noAuth : true});
}
//开启/关闭优惠劵
export function closedCoupons(data)
{
return request.post("Coupon/closedCoupons",data,{ noAuth : true});
}
//店铺产品
export function couponGoods(data)
{
return request.post("Coupon/couponGoods",data,{ noAuth : true});
}
//添加修改优惠劵
export function addEditCoupons(data)
{
return request.post("Coupon/addEditCoupons",data,{ noAuth : true});
}
utils/debug.js
View file @ 5edbb49b
......@@ -2,8 +2,8 @@
//环境变量 这个是 鹿马商家助手的 商家助手的~~~~
module.exports = {
//是否为开发调试环境 true为本地环境 false 为正式环境
// isdebug:true,//测试
isdebug:false,//正式
isdebug:true,//测试
// isdebug:false,//正式
xqdebug:false,//正式权限
// xqdebug:true,//发布审核权限 也是测试环境的 主要用于ios
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment