新增部分页面按钮

This commit is contained in:
唐明明
2021-09-27 14:57:48 +08:00
parent 90f6498207
commit 02a27907cc
2 changed files with 85 additions and 23 deletions

View File

@@ -48,6 +48,9 @@
<view class="sub-title">暂无相关优惠券</view>
</view>
</block>
<view class="basisc-btn">
<button class="btn" type="default" @click="$Router.push({name: 'couponsAdd'})">添加优惠券</button>
</view>
</view>
</template>
@@ -94,14 +97,35 @@
})
})
}
},
onNavigationBarButtonTap() {
this.$Router.push({name: 'couponsAdd'})
}
}
</script>
<style lang="scss" scoped>
// 按钮组
.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);
}
}
}
// tabs
.header{
position: fixed;

View File

@@ -1,5 +1,5 @@
<template>
<view class="ios-bottom">
<view class="basics-content">
<view class="info">
<view class="item info-logo" @click="updImg('logo', '')">
<label>企业LOGO</label>
@@ -8,7 +8,7 @@
</view>
<view class="item info-text">
<label>企业简介</label>
<textarea v-model="description" placeholder="输入企业简介" />
<textarea v-model="description" maxlength="-1" placeholder="输入企业简介" />
</view>
<view class="item info-text">
<label>企业地址</label>
@@ -22,7 +22,7 @@
<view class="remove-btn" @click="removeModule(moduleIndex)">删除</view>
</view>
<view class="module-textarea">
<textarea placeholder="输入文字内容" v-model="module.content.content" />
<textarea placeholder="输入文字内容" maxlength="-1" v-model="module.content.content" />
</view>
</view>
<view class="module-item" v-if="module.type === 2">
@@ -95,8 +95,9 @@
<view class="module-hint">点击查看封面/视频长按删除封面/视频</view>
</view>
</block>
<view class="add-modules" @click="addModule">
<uni-icons class="icon" type="plus" size="18" color="#c82626"/> 添加展示模块
<view class="basisc-btn">
<view class="add-modules" @click="addModule">添加模块</view>
<button class="btn" type="default" @click="onBasicsInfo">保存</button>
</view>
</view>
</template>
@@ -116,8 +117,6 @@
},
created() {
Promise.all([basicsInfo('GET', {}), basicsConfig()]).then(res => {
console.log(res)
let info = res[0]
this.logo = info.base.cover
this.description = info.base.description
@@ -306,7 +305,7 @@
},
// 保存基础信息
onNavigationBarButtonTap(e){
onBasicsInfo(){
basicsInfo('PUT', {
cover : this.logo,
description : this.description,
@@ -317,6 +316,7 @@
title : '提示',
content : '基本信息已保存',
showCancel : false,
confirmColor: '#8b64fd',
success : modalRes=> {
if(modalRes.confirm){
this.$Router.back()
@@ -335,6 +335,9 @@
</script>
<style lang="scss" scoped>
.basics-content{
padding-bottom: ($padding*3) + 90;
}
// 基础信息
.info{
background: white;
@@ -396,23 +399,55 @@
}
}
}
// 模块
.add-modules{
line-height: 90rpx;
text-align: center;
color: $text-price;
// 按钮组
.basisc-btn{
position: fixed;
bottom: 0;
left: 0;
right: 0;
padding: $padding;
background: white;
margin-top: $margin;
.icon{
vertical-align: middle;
margin-right: $margin/3;
margin-top: $margin - 10;
display: flex;
justify-content: space-between;
box-shadow: 0 0 4rpx 4rpx rgba($color: #000000, $alpha: .02);
.add-modules{
line-height: 86rpx;
height: 88rpx;
text-align: center;
color: $text-price;
background: white;
width: calc(50% - 15rpx);
margin-right: 30rpx;
border:solid 1rpx $mian-color;
box-sizing: border-box;
font-size: $title-size-lg;
.icon{
margin-right: $margin/3;
}
}
.btn {
background: $mian-color;
color: white;
border-radius: 0;
font-size: $title-size-lg;
line-height: 88rpx;
height: 88rpx;
width: calc(50% - 15rpx);
&::after {
border: none;
}
&[disabled] {
background: rgba($color: $mian-color, $alpha: .6);
}
}
}
// 展示模块
.module-item{
background: white;
padding: $padding/2 $padding;
margin-top: $margin;
margin-top: $margin - 10;
.module-title{
display: flex;
justify-content: space-between;
@@ -435,8 +470,11 @@
width: 100%;
font-size: $title-size;
line-height: 50rpx;
height: 200rpx;
box-sizing: border-box;
textarea{
width: 100%;
height: 200rpx;
}
}
.module-imgs{
display: flex;