调整发布优惠券样式
This commit is contained in:
@@ -1,5 +1,5 @@
|
|||||||
<template>
|
<template>
|
||||||
<view class="basics-content">
|
<view>
|
||||||
<view class="coupons-preview">
|
<view class="coupons-preview">
|
||||||
<view class="item cover">
|
<view class="item cover">
|
||||||
<view v-if="types[typeIndex].id == 2">
|
<view v-if="types[typeIndex].id == 2">
|
||||||
@@ -79,7 +79,7 @@
|
|||||||
<label class="input-label">{{timeIndex == 0 ? '券有效期': '延期天数'}}</label>
|
<label class="input-label">{{timeIndex == 0 ? '券有效期': '延期天数'}}</label>
|
||||||
<block v-if="timeIndex === 0">
|
<block v-if="timeIndex === 0">
|
||||||
<view class="input-text" @click="showDatePicker = true">{{datePickerValue.length == 0 ? '选择优惠券有效期区间': datePickerValue[0] + ' 至 ' + datePickerValue[1]}}<uni-icons class="picker-icon" type="arrowdown" size="14" /></view>
|
<view class="input-text" @click="showDatePicker = true">{{datePickerValue.length == 0 ? '选择优惠券有效期区间': datePickerValue[0] + ' 至 ' + datePickerValue[1]}}<uni-icons class="picker-icon" type="arrowdown" size="14" /></view>
|
||||||
<tn-date-picker :show="showDatePicker" :monthNum="12" color="#e93340" :showTips="true" beginText="开始日期" endText="结束日期" @confirm="confirmDatePicker" @cancel="showDatePicker = false"/>
|
<tn-date-picker :show="showDatePicker" :monthNum="12" color="#8b64fd" :showTips="true" beginText="开始日期" endText="结束日期" @confirm="confirmDatePicker" @cancel="showDatePicker = false"/>
|
||||||
</block>
|
</block>
|
||||||
<block v-if="timeIndex === 1">
|
<block v-if="timeIndex === 1">
|
||||||
<view class="input-number">
|
<view class="input-number">
|
||||||
@@ -89,7 +89,7 @@
|
|||||||
</view>
|
</view>
|
||||||
<view class="inputs">
|
<view class="inputs">
|
||||||
<label class="input-label">关联商品</label>
|
<label class="input-label">关联商品</label>
|
||||||
<view class="input-text" @click="onSelectGoods" v-if="coupongoods">
|
<view class="input-text" @click="onSelectGoods">
|
||||||
<block v-if="coupongoods.length > 0">已关联{{coupongoods.length}}件商品</block>
|
<block v-if="coupongoods.length > 0">已关联{{coupongoods.length}}件商品</block>
|
||||||
<block v-else>选择关联商品</block>
|
<block v-else>选择关联商品</block>
|
||||||
<uni-icons class="picker-icon" type="arrowdown" size="14" />
|
<uni-icons class="picker-icon" type="arrowdown" size="14" />
|
||||||
@@ -100,9 +100,9 @@
|
|||||||
<label>使用规则</label>
|
<label>使用规则</label>
|
||||||
<textarea :maxlength="-1" v-model="description" placeholder="输入使用规则说明" />
|
<textarea :maxlength="-1" v-model="description" placeholder="输入使用规则说明" />
|
||||||
</view>
|
</view>
|
||||||
<view class="basisc-btn">
|
<view class="add-btn ios-bottom">
|
||||||
<button type="default" class="btn" @click="updComponent">发布优惠券</button>
|
<button type="default" @click="updComponent">发布优惠券</button>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@@ -116,6 +116,7 @@
|
|||||||
},
|
},
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
|
loding : true,
|
||||||
typeIndex : 0,
|
typeIndex : 0,
|
||||||
types : [
|
types : [
|
||||||
{ id: 1, text: '服务券' },
|
{ id: 1, text: '服务券' },
|
||||||
@@ -235,35 +236,6 @@
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
.basics-content{
|
|
||||||
padding-bottom: ($padding*3) + 90;
|
|
||||||
}
|
|
||||||
|
|
||||||
// 按钮组
|
|
||||||
.basisc-btn{
|
|
||||||
position: fixed;
|
|
||||||
bottom: 0;
|
|
||||||
left: 0;
|
|
||||||
right: 0;
|
|
||||||
padding: $padding;
|
|
||||||
background: white;
|
|
||||||
box-shadow: 0 0 4rpx 4rpx rgba($color: #000000, $alpha: .02);
|
|
||||||
.btn {
|
|
||||||
background: $mian-color;
|
|
||||||
color: white;
|
|
||||||
border-radius: 0;
|
|
||||||
font-size: $title-size-lg;
|
|
||||||
line-height: 88rpx;
|
|
||||||
height: 88rpx;
|
|
||||||
&::after {
|
|
||||||
border: none;
|
|
||||||
}
|
|
||||||
&[disabled] {
|
|
||||||
background: rgba($color: $mian-color, $alpha: .6);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.add-btn{
|
.add-btn{
|
||||||
padding: $padding;
|
padding: $padding;
|
||||||
button{
|
button{
|
||||||
|
|||||||
@@ -12,17 +12,24 @@ Vue.use(Vuex)
|
|||||||
|
|
||||||
export default new Vuex.Store({
|
export default new Vuex.Store({
|
||||||
state: {
|
state: {
|
||||||
token : uni.getStorageSync('token') || ''
|
token : uni.getStorageSync('token') || '',
|
||||||
|
coupongoods : []
|
||||||
},
|
},
|
||||||
getters: {
|
getters: {
|
||||||
getToken: state => {
|
getToken: state => {
|
||||||
return state.token
|
return state.token
|
||||||
|
},
|
||||||
|
getCoupongoods: state => {
|
||||||
|
return state.coupongoods
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
mutations: {
|
mutations: {
|
||||||
setToken(state, tokenString) {
|
setToken(state, tokenString) {
|
||||||
state.token = tokenString
|
state.token = tokenString
|
||||||
uni.setStorageSync('token', tokenString)
|
uni.setStorageSync('token', tokenString)
|
||||||
|
},
|
||||||
|
setCoupongoods(state, value) {
|
||||||
|
state.coupongoods = value
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|||||||
@@ -141,12 +141,12 @@
|
|||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
$box-height: 35px;
|
$box-height: 50rpx;
|
||||||
/* #ifdef APP-NVUE */
|
/* #ifdef APP-NVUE */
|
||||||
$box-line-height: 35px;
|
$box-line-height: 50rpx;
|
||||||
/* #endif */
|
/* #endif */
|
||||||
$box-line-height: 26px;
|
$box-line-height: 50rpx;
|
||||||
$box-width: 35px;
|
$box-width: 50rpx;
|
||||||
|
|
||||||
.uni-numbox {
|
.uni-numbox {
|
||||||
/* #ifndef APP-NVUE */
|
/* #ifndef APP-NVUE */
|
||||||
@@ -154,8 +154,9 @@
|
|||||||
/* #endif */
|
/* #endif */
|
||||||
flex-direction: row;
|
flex-direction: row;
|
||||||
height: $box-height;
|
height: $box-height;
|
||||||
line-height: $box-height;
|
line-height: $box-height - 7rpx;
|
||||||
width: 120px;
|
align-items: center;
|
||||||
|
// width: 120px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.uni-cursor-point {
|
.uni-cursor-point {
|
||||||
@@ -170,51 +171,22 @@
|
|||||||
height: $box-height;
|
height: $box-height;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
font-size: $uni-font-size-lg;
|
font-size: $uni-font-size-lg;
|
||||||
border-width: 1rpx;
|
|
||||||
border-style: solid;
|
|
||||||
border-color: $uni-border-color;
|
|
||||||
border-left-width: 0;
|
|
||||||
border-right-width: 0;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.uni-numbox__minus {
|
.uni-numbox__minus {
|
||||||
/* #ifndef APP-NVUE */
|
|
||||||
display: flex;
|
|
||||||
/* #endif */
|
|
||||||
flex-direction: row;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
width: $box-width;
|
width: $box-width;
|
||||||
height: $box-height;
|
height: $box-height;
|
||||||
// line-height: $box-line-height;
|
background: $border-color-lg;
|
||||||
// text-align: center;
|
border-radius: 50%;
|
||||||
font-size: 20px;
|
text-align: center;
|
||||||
color: $uni-text-color;
|
|
||||||
background-color: $uni-bg-color-grey;
|
|
||||||
border-width: 1rpx;
|
|
||||||
border-style: solid;
|
|
||||||
border-color: $uni-border-color;
|
|
||||||
border-top-left-radius: $uni-border-radius-base;
|
|
||||||
border-bottom-left-radius: $uni-border-radius-base;
|
|
||||||
border-right-width: 0;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.uni-numbox__plus {
|
.uni-numbox__plus {
|
||||||
/* #ifndef APP-NVUE */
|
|
||||||
display: flex;
|
|
||||||
/* #endif */
|
|
||||||
flex-direction: row;
|
|
||||||
align-items: center;
|
|
||||||
justify-content: center;
|
|
||||||
width: $box-width;
|
width: $box-width;
|
||||||
height: $box-height;
|
height: $box-height;
|
||||||
border-width: 1rpx;
|
background: $border-color-lg;
|
||||||
border-style: solid;
|
border-radius: 50%;
|
||||||
border-color: $uni-border-color;
|
text-align: center;
|
||||||
border-top-right-radius: $uni-border-radius-base;
|
|
||||||
border-bottom-right-radius: $uni-border-radius-base;
|
|
||||||
background-color: $uni-bg-color-grey;
|
|
||||||
border-left-width: 0;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.uni-numbox--text {
|
.uni-numbox--text {
|
||||||
|
|||||||
Reference in New Issue
Block a user