Commit f760b91b authored by xd's avatar xd

P01: 20200110194200:创建活动样式修改

parent 44c70323
...@@ -423,10 +423,6 @@ export default { ...@@ -423,10 +423,6 @@ export default {
</script> </script>
<style scoped> <style scoped>
.tree {
/* height: 100%;
overflow: auto; */
}
.mail { .mail {
display: flex; display: flex;
width: 100%; width: 100%;
...@@ -481,7 +477,6 @@ export default { ...@@ -481,7 +477,6 @@ export default {
.bottom { .bottom {
padding: 12px; padding: 12px;
margin-bottom: 20px; margin-bottom: 20px;
/* margin-bottom: 194px; */
} }
.title { .title {
height: 48px; height: 48px;
......
...@@ -8,7 +8,7 @@ ...@@ -8,7 +8,7 @@
"lint": "vue-cli-service lint" "lint": "vue-cli-service lint"
}, },
"dependencies": { "dependencies": {
"axios": "^0.19.0", "axios": "^0.19.1",
"core-js": "^3.4.4", "core-js": "^3.4.4",
"js-md5": "^0.7.3", "js-md5": "^0.7.3",
"vant": "^2.3.3", "vant": "^2.3.3",
......
...@@ -15,6 +15,11 @@ const routes = [ ...@@ -15,6 +15,11 @@ const routes = [
name: 'turntableDetail', name: 'turntableDetail',
component: () => import('../views/active/turntableDetail.vue') component: () => import('../views/active/turntableDetail.vue')
}, },
{
path: '/couponDetail',
name: 'couponDetail',
component: () => import('../views/active/couponDetail.vue')
},
{ {
path: '/createActive', path: '/createActive',
name: 'createActive', name: 'createActive',
......
<template>
<div class="container">
<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" @click="createActive">创建同款活动</div>
</div>
</template>
<script>
export default {
data() {
return {
}
},
methods: {
createActive() {
this.$router.push({
name: 'createActive'
})
}
},
};
</script>
<style>
</style>
<style scoped>
p {
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;
margin-bottom: 16px;
}
</style>
...@@ -3,18 +3,23 @@ ...@@ -3,18 +3,23 @@
<div class="title">基础设置</div> <div class="title">基础设置</div>
<van-cell-group class="all"> <van-cell-group class="all">
<van-cell title="活动标题" style="font-size:14px;"> <van-cell title="活动标题" style="font-size:14px;">
<template slot="default" > <template slot="default">
<van-field v-model="title" placeholder="请输入活动标题" class="right" style="font-size:14px;" /> <van-field
v-model="title"
placeholder="请输入活动标题"
class="right"
style="font-size:14px;"
/>
</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="coupon" size="20px" class="right" /> <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" class="right" /> <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;">
...@@ -28,12 +33,17 @@ ...@@ -28,12 +33,17 @@
<van-cell-group class="all"> <van-cell-group class="all">
<van-cell title="活动标题" style="font-size:14px;"> <van-cell title="活动标题" style="font-size:14px;">
<template slot="default"> <template slot="default">
<van-field v-model="title2" placeholder="请输入活动标题" class="right" style="font-size:14px;" /> <van-field
v-model="title2"
placeholder="请输入活动标题"
class="right"
style="font-size:14px;"
/>
</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-radio-group v-model="type" class="right" > <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>
...@@ -41,38 +51,42 @@ ...@@ -41,38 +51,42 @@
</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-field <div class="npbr">
class="right noborder" <van-field
readonly class="right noborder"
clickable readonly
:value="cashCoupon" clickable
placeholder="输入代金券金额" :value="cashCoupon"
@touchstart.native.stop="show = true" placeholder="输入代金券金额"
/> @touchstart.native.stop="show = true"
<van-number-keyboard />
v-model="cashCoupon" <van-number-keyboard
:show="show" v-model="cashCoupon"
:maxlength="6" :show="show"
@blur="show = false" :maxlength="6"
/> @blur="show = false"
/>
</div>
</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-field <div class="npbr">
class="right noborder" <van-field
readonly class="right noborder"
clickable readonly
:value="limit" clickable
placeholder="输入使用门槛" :value="limit"
@touchstart.native.stop="show2 = true" placeholder="输入使用门槛"
/> @touchstart.native.stop="show2 = true"
<van-number-keyboard />
v-model="limit" <van-number-keyboard
:show="show2" v-model="limit"
:maxlength="6" :show="show2"
@blur="show2 = false" :maxlength="6"
/> @blur="show2 = false"
/>
</div>
</template> </template>
</van-cell> </van-cell>
<van-cell title="活动开始时间" style="font-size:14px;"> <van-cell title="活动开始时间" style="font-size:14px;">
...@@ -80,10 +94,11 @@ ...@@ -80,10 +94,11 @@
<van-field <van-field
class="right" class="right"
v-model="startTime1" v-model="startTime1"
placeholder="选择活动开始时间" readonly="readonly" placeholder="选择活动开始时间"
readonly="readonly"
@click="startShow = true" @click="startShow = true"
/> />
<van-popup v-model="startShow" position="bottom" :overlay="true"> <van-popup v-model="startShow" position="bottom" :overlay="true">
<van-datetime-picker <van-datetime-picker
v-model="startTime" v-model="startTime"
type="datetime" type="datetime"
...@@ -99,10 +114,11 @@ ...@@ -99,10 +114,11 @@
<van-field <van-field
class="right" class="right"
v-model="endTime1" v-model="endTime1"
placeholder="选择活动结束时间" readonly="readonly" placeholder="选择活动结束时间"
readonly="readonly"
@click="endShow = true" @click="endShow = true"
/> />
<van-popup v-model="endShow" position="bottom" :overlay="true"> <van-popup v-model="endShow" position="bottom" :overlay="true">
<van-datetime-picker <van-datetime-picker
v-model="endTime" v-model="endTime"
type="datetime" type="datetime"
...@@ -113,7 +129,7 @@ ...@@ -113,7 +129,7 @@
</van-popup> </van-popup>
</template> </template>
</van-cell> </van-cell>
<div class="des">描述</div> <div class="des">描述</div>
<van-field <van-field
class="area" class="area"
v-model="message" v-model="message"
...@@ -148,66 +164,62 @@ export default { ...@@ -148,66 +164,62 @@ export default {
endTime1: "", endTime1: "",
startShow: false, startShow: false,
endShow: false, endShow: false,
message: "", message: ""
}; };
}, },
methods: { methods: {
startTimeChange(e) { startTimeChange(e) {
let startTimeArr = e.getValues() let startTimeArr = e.getValues();
this.startTime1 = `${startTimeArr[0]}-${startTimeArr[1]}-${startTimeArr[2]} ${startTimeArr[3]}:${startTimeArr[4]}:00` this.startTime1 = `${startTimeArr[0]}-${startTimeArr[1]}-${startTimeArr[2]} ${startTimeArr[3]}:${startTimeArr[4]}:00`;
}, },
endTimeChange(e) { endTimeChange(e) {
let endTimeArr = e.getValues() let endTimeArr = e.getValues();
this.endTime1 = `${endTimeArr[0]}-${endTimeArr[1]}-${endTimeArr[2]} ${endTimeArr[3]}:${endTimeArr[4]}:00` this.endTime1 = `${endTimeArr[0]}-${endTimeArr[1]}-${endTimeArr[2]} ${endTimeArr[3]}:${endTimeArr[4]}:00`;
} }
}, },
mounted() { mounted() {}
}
}; };
</script> </script>
<style> <style></style>
</style> <style scoped>
<style scoped>
.all >>> input { .all >>> input {
text-align: right; text-align: right;
} }
.noborder >>> .van-cell:not(:last-child)::after { .noborder >>> .van-cell:not(:last-child)::after {
display: none !important; display: none !important;
} }
.noborder .van-cell:not(:last-child)::after{ .npbr .van-cell:not(:last-child)::after {
border: 0px solid red !important; display: none !important;
} }
.creat { .creat {
margin-top: 80px; margin-top: 80px;
width:96%; width: 96%;
height:40px; height: 40px;
background:rgba(117,178,253,1); background: rgba(117, 178, 253, 1);
border-radius:10px; border-radius: 10px;
text-align: center; text-align: center;
line-height: 40px; line-height: 40px;
font-size:16px; font-size: 16px;
font-weight:bold; font-weight: bold;
color: #fff; color: #fff;
margin-left: 2%; margin-left: 2%;
margin-bottom: 16px; margin-bottom: 16px;
} }
.container { .container {
background:rgba(248,248,248,1); background: rgba(248, 248, 248, 1);
} }
.van-field__body textarea { .van-field__body textarea {
background:rgba(248,248,248,1); background: rgba(248, 248, 248, 1);
} }
.des { .des {
padding: 6px 16px; padding: 6px 16px;
font-size: 14px; font-size: 14px;
color: #2d476a;
} }
.phone { .phone {
float: left; float: left;
} }
.title { .title {
background-color: #f8f8f8; background-color: #f8f8f8;
...@@ -223,6 +235,8 @@ export default { ...@@ -223,6 +235,8 @@ export default {
} }
.right { .right {
padding: 0; padding: 0;
}
.van-cell__title {
color: #2d476a !important;
} }
</style> </style>
...@@ -22,12 +22,25 @@ ...@@ -22,12 +22,25 @@
马几一民号传所把半米料己走专管每见严且具还京叫海公好速信调化眼务难心化二响住厂图电没速严义常象关更了低。由压反几风列线法再石究说布通总织第量回儿称从消片度音济学地通斯带老水亲东志报月者进放北传看术走形解林直动效提情影和复色米最只等。济交感去照象强手式性九己值正可心什体收并适部该置可山省十。 马几一民号传所把半米料己走专管每见严且具还京叫海公好速信调化眼务难心化二响住厂图电没速严义常象关更了低。由压反几风列线法再石究说布通总织第量回儿称从消片度音济学地通斯带老水亲东志报月者进放北传看术走形解林直动效提情影和复色米最只等。济交感去照象强手式性九己值正可心什体收并适部该置可山省十。
</p> </p>
</div> </div>
<div class="creat">创建同款活动</div> <div class="creat" @click="createActive">创建同款活动</div>
</div> </div>
</template> </template>
<script> <script>
export default {}; export default {
data() {
return {
}
},
methods: {
createActive() {
this.$router.push({
name: 'createBigWheelActive'
})
}
},
};
</script> </script>
<style> <style>
......
...@@ -38,7 +38,7 @@ ...@@ -38,7 +38,7 @@
name: "送券活动", name: "送券活动",
logoUrl: "/mainSale/icon-active-2.png", logoUrl: "/mainSale/icon-active-2.png",
dsc: "有各种物质组成的举行球状天体,叫做星球。星球有一定的形状。", dsc: "有各种物质组成的举行球状天体,叫做星球。星球有一定的形状。",
reDirect: "turntableDetail" reDirect: "couponDetail"
} }
], ],
}, },
......
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