Skip to content

Y
ybf
Commit a3953c2d authored by xd's avatar xd
Browse files
Options

前两个静态页面完成

parent 382ea8d7
Hide whitespace changes
Inline Side-by-side
Showing with 309 additions and 56 deletions
ybf_wx/src/router/index.js
View file @ a3953c2d
...@@ -19,6 +19,11 @@ const routes = [ ...@@ -19,6 +19,11 @@ const routes = [
path: '/createActive', path: '/createActive',
name: 'createActive', name: 'createActive',
component: () => import(/* webpackChunkName: "about" */ '../views/active/createActive.vue') component: () => import(/* webpackChunkName: "about" */ '../views/active/createActive.vue')
},
{
path: '/activeList',
name: 'activeList',
component: () => import(/* webpackChunkName: "about" */ '../views/active/activeList.vue')
} }
] ]
......
ybf_wx/src/views/active/activeList.vue 0 → 100644
View file @ a3953c2d
<template>
<div>
<div class="title">
<span>会员分裂</span>
<span class="fr">查看更多<span class="icon">></span></span>
</div>
<div class="active">
<div class="list">
<div class="left"></div>
<div class="right"></div>
</div>
</div>
</div>
</template>
<script>
export default {};
</script>
<style scoped>
.title {
height: 44px;
background: rgba(248, 248, 248, 1);
line-height: 44px;
padding: 0 16px;
font-size: 12px;
color: rgba(45, 71, 106, 1);
}
.icon {
font-weight: 800;
}
.active {
padding: 16px;
box-shadow:0px 2px 4px 0px rgba(221,221,221,1);
}
.list {
height: 104px;
width: 100%;
background-color: #fff;
display: flex;
justify-content: space-between
}
.left,.right {
background-color: pink;
height: 80px;
}
.left {
width: 80px;
}
.right {
width: 72%;
}
</style>
ybf_wx/src/views/active/createActive.vue
View file @ a3953c2d
<template> <template>
<div> <div class="container">
<div class="title">基础设置</div> <div class="title">基础设置</div>
<van-cell-group> <van-cell-group>
<van-cell <van-cell title="活动标题" style="font-size:14px;">
class="list" <template slot="default" >
title="活动标题" <van-field v-model="title" placeholder="请输入活动标题" class="right" style="font-size:14px;" />
value="新客有礼" </template>
style="font-size:14px;" </van-cell>
/>
<van-cell title="消费后领券" style="font-size:14px;"> <van-cell title="消费后领券" style="font-size:14px;">
<template slot="default"> <template slot="default">
<van-switch v-model="coupon" size="20px" /> <van-switch v-model="coupon" size="20px" class="right" />
</template> </template>
</van-cell> </van-cell>
<van-cell title="新客专享" style="font-size:14px;"> <van-cell title="新客专享" style="font-size:14px;">
<template slot="default"> <template slot="default">
<van-switch v-model="newCustomer" size="20px" /> <van-switch v-model="newCustomer" size="20px" class="right" />
</template> </template>
</van-cell> </van-cell>
<van-cell title="领券条件" style="font-size:14px;"> <van-cell title="领券条件" style="font-size:14px;">
...@@ -27,15 +26,14 @@ ...@@ -27,15 +26,14 @@
</van-cell-group> </van-cell-group>
<div class="title">券设置</div> <div class="title">券设置</div>
<van-cell-group> <van-cell-group>
<van-cell <van-cell title="活动标题" style="font-size:14px;">
class="list" <template slot="default">
title="活动标题" <van-field v-model="title2" placeholder="请输入活动标题" class="right" style="font-size:14px;" />
value="新客有礼" </template>
style="font-size:14px;" </van-cell>
/>
<van-cell title="券类型" style="font-size:14px;"> <van-cell title="券类型" style="font-size:14px;">
<template slot="default"> <template slot="default">
<van-radio-group v-model="type"> <van-radio-group v-model="type" class="right" >
<van-radio name="1" style="float:left;">代金券</van-radio> <van-radio name="1" style="float:left;">代金券</van-radio>
<van-radio name="2" style="float:right;">折扣券</van-radio> <van-radio name="2" style="float:right;">折扣券</van-radio>
</van-radio-group> </van-radio-group>
...@@ -44,6 +42,7 @@ ...@@ -44,6 +42,7 @@
<van-cell title="代金券金额" style="font-size:14px;"> <van-cell title="代金券金额" style="font-size:14px;">
<template slot="default"> <template slot="default">
<van-field <van-field
class="right noborder"
readonly readonly
clickable clickable
:value="cashCoupon" :value="cashCoupon"
...@@ -60,7 +59,7 @@ ...@@ -60,7 +59,7 @@
<van-cell title="使用门槛" style="font-size:14px;"> <van-cell title="使用门槛" style="font-size:14px;">
<template slot="default"> <template slot="default">
<van-field <van-field
class="limit" class="right noborder"
readonly readonly
clickable clickable
:value="limit" :value="limit"
...@@ -74,28 +73,69 @@ ...@@ -74,28 +73,69 @@
/> />
</template> </template>
</van-cell> </van-cell>
<van-cell title="活动开始时间" style="font-size:14px;"> <!-- <van-cell title="活动开始时间" style="font-size:14px;">
<template slot="default"> <template slot="default">
<span @click="handleSTimeShow">{{startTime==''?"请选择开始时间":startTime}}</span> <span @click="handleSTimeShow">{{ startTime }}</span>
<van-popup v-model="startShow" position="bottom"> <van-popup v-model="startShow" position="bottom">
<van-datetime-picker <van-datetime-picker
v-model="startTime" v-model="startTime"
type="dateTime" type="date"
@confirm = "handleSTimeClose" @confirm="handleSTimeClose"
@change="getStartTime" />
</van-popup>
</template>
</van-cell> -->
<van-cell title="活动开始时间" style="font-size:14px;">
<template slot="default">
<van-field
class="right"
v-model="startTime1"
placeholder="选择活动结束时间" readonly="readonly"
@click="startShow = true"
/>
<van-popup v-model="startShow" position="bottom" :overlay="true">
<van-datetime-picker
v-model="startTime"
type="datetime"
@cancel="startShow = false"
@confirm="startShow = false"
@change="startTimeChange"
/> />
</van-popup> </van-popup>
</template> </template>
</van-cell> </van-cell>
<van-cell title="活动结束时间" style="font-size:14px;"> <van-cell title="活动结束时间" style="font-size:14px;">
<template slot="default"> <template slot="default">
<van-datetime-picker <van-field
v-model="endTime" class="right"
type="datetime" v-model="endTime1"
placeholder="选择活动结束时间" readonly="readonly"
@click="endShow = true"
/> />
<van-popup v-model="endShow" position="bottom" :overlay="true">
<van-datetime-picker
v-model="endTime"
type="datetime"
@cancel="endShow = false"
@confirm="endShow = false"
@change="endTimeChange"
/>
</van-popup>
</template> </template>
</van-cell> </van-cell>
<div class="des">描述</div>
<van-field
class="area"
v-model="message"
rows="2"
autosize
type="textarea"
maxlength="50"
placeholder="请输入描述"
show-word-limit
/>
</van-cell-group> </van-cell-group>
<div class="creat">创建活动</div>
</div> </div>
</template> </template>
...@@ -103,6 +143,8 @@ ...@@ -103,6 +143,8 @@
export default { export default {
data() { data() {
return { return {
title: "",
title2: "",
coupon: "", coupon: "",
newCustomer: "", newCustomer: "",
condition: "", condition: "",
...@@ -111,49 +153,79 @@ export default { ...@@ -111,49 +153,79 @@ export default {
show2: false, show2: false,
cashCoupon: "", cashCoupon: "",
limit: "", limit: "",
startTime: '', startTime: new Date(),
endTime: new Date(), startTime1: "",
startShow: false endTime: "",
endTime1: "",
startShow: false,
endShow: false,
message: "",
}; };
}, },
methods: { methods: {
timeFormat(time) { // 时间格式化 2019-09-08 startTimeChange(e) {
let year = time.getFullYear(); let startTimeArr = e.getValues()
let month = time.getMonth() + 1; this.startTime1 = `${startTimeArr[0]}-${startTimeArr[1]}-${startTimeArr[2]} ${startTimeArr[3]}:${startTimeArr[4]}:00`
let day = time.getDate();
return year + '年' + month + '月' + day + '日'
}, },
handleSTimeShow() { endTimeChange(e) {
this.startShow = true let endTimeArr = e.getValues()
}, this.endTime1 = `${endTimeArr[0]}-${endTimeArr[1]}-${endTimeArr[2]} ${endTimeArr[3]}:${endTimeArr[4]}:00`
handleSTimeClose() {
this.startTime = this.timeFormat(this.startTime)
this.startShow = false
//console.log(getValues(),"???");
},
getStartTime(val) {
console.log(val,"开始时间");
} }
},
mounted() {
} }
}; };
</script> </script>
<style> <style>
</style> </style>
<style lang="scss" scoped> <style lang="scss" scoped>
// /deep/ .noborder .van-cell:not(:last-child)::after {
// display: none !important;
// }
.noborder .van-cell:not(:last-child)::after{
border: 0px solid red !important;
}
.creat {
margin-top: 80px;
width:96%;
height:40px;
background:rgba(117,178,253,1);
border-radius:10px;
text-align: center;
line-height: 40px;
font-size:16px;
font-weight:bold;
color: #fff;
margin-left: 2%;
}
.container {
background:rgba(248,248,248,1);
}
.van-field__body textarea {
background:rgba(248,248,248,1);
}
.area /deep/ [data-v-08d4afe1] .van-field__control {
margin: 0 12px;
background:rgba(248,248,248,1);
}
.des {
padding: 6px 16px;
font-size: 14px;
}
/deep/ .van-field__control { /deep/ .van-field__control {
height: 20px; height: 20px;
margin-left: 77px; // margin-left: 77px;
} }
/deep/ .van-cell { /deep/ .van-cell {
height: 46px; height: 46px;
} }
.phone { .phone {
float: left; float: left;
margin-top: 6px;
} }
.title { .title {
background-color: #f8f8f8; background-color: #f8f8f8;
...@@ -163,4 +235,13 @@ export default { ...@@ -163,4 +235,13 @@ export default {
padding-left: 16px; padding-left: 16px;
color: #2d476a; color: #2d476a;
} }
[data-v-08d4afe1] .van-cell {
height: 100%;
font-size: 14px;
// padding: 0;
}
.right {
padding: 0;
}
</style> </style>
ybf_wx/src/views/active/turntableDetail.vue
View file @ a3953c2d
<template> <template>
<div> <div class="container">
<div>大转盘详情</div> <div class="topb">
<img src="../../../public/img/zhuanpanbg.png" alt="" />
</div>
<div class="title">
<span class="bt">服装店幸运抽奖</span>
<div class="tb">
<img src="../../../public/img/zp.png" alt="" />
大转盘抽奖
</div>
</div>
<div class="wtitle">
<img src="../../../public/img/water.png" alt="" />
<span class="wan">玩法介绍</span>
</div>
<div class="content">
<p>
马几一民号传所把半米料己走专管每见严且具还京叫海公好速信调化眼务难心化二响住厂图电没速严义常象关更了低。由压反几风列线法再石究说布通总织第量回儿称从消片度音济学地通斯带老水亲东志报月者进放北传看术走形解林直动效提情影和复色米最只等。济交感去照象强手式性九己值正可心什体收并适部该置可山省十。
</p>
<p>
马几一民号传所把半米料己走专管每见严且具还京叫海公好速信调化眼务难心化二响住厂图电没速严义常象关更了低。由压反几风列线法再石究说布通总织第量回儿称从消片度音济学地通斯带老水亲东志报月者进放北传看术走形解林直动效提情影和复色米最只等。济交感去照象强手式性九己值正可心什体收并适部该置可山省十。
</p>
</div>
<div class="creat">创建同款活动</div>
</div> </div>
</template> </template>
<script> <script>
export default { export default {};
}
</script> </script>
<style> <style></style>
<style scoped>
</style> p {
\ No newline at end of file font-size: 12px;
font-weight: 400;
color: rgba(45, 71, 106, 0.8);
margin-top: 14px;
}
.wan {
position: absolute;
left: 77px;
top: 8px;
font-size: 16px;
font-weight: bold;
}
.wtitle {
width: 200px;
height: 24px;
position: absolute;
left: 50%;
transform: translate(-50%);
top: 268px;
z-index: 999;
}
.wtitle img {
width: 100%;
}
.topb {
width: 100%;
height: 200px;
}
.topb img {
width: 100%;
}
.title {
width: 100%;
height: 50px;
font-size: 18px;
background-color: #fff;
box-shadow: 0px 2px 4px 0px rgba(221, 221, 221, 1);
line-height: 50px;
padding-left: 16px;
position: relative;
}
.container {
background-color: rgba(248, 248, 248, 1);
height: 100%;
}
.bt {
font-size: 16px;
margin-left: 96px;
font-weight: bold;
color: rgba(45, 71, 106, 1);
}
.tb {
position: absolute;
height: 24px;
line-height: 24px;
left: 16px;
top: 14px;
border-radius: 2px;
border: 1px solid rgba(45, 71, 106, 1);
font-size: 10px;
font-weight: 500;
color: rgba(45, 71, 106, 1);
width: 88px;
text-align: center;
}
.tb img {
width: 12px;
height: 12px;
}
.content {
margin: 36px 16px 16px;
background: rgba(255, 255, 255, 1);
box-shadow: 0px 2px 4px 0px rgba(221, 221, 221, 1);
height: 376px;
position: relative;
padding: 16px 16px 30px 16px;
}
.creat {
position: absolute;
left: 50%;
transform: translate(-50%);
width: 343px;
height: 40px;
line-height: 40px;
background: rgba(117, 178, 253, 1);
border-radius: 10px;
font-size: 16px;
font-weight: bold;
color: rgba(255, 255, 255, 1);
text-align: center;
}
</style>
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