You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 

325 lines
7.5 KiB

<template>
<view class="page1">
<view class="hero">
<view class="hero-title">经营管理</view>
<view class="hero-subtitle">同步后台商家管理字段可直接维护营业规则</view>
</view>
<view class="form-wrap">
<view class="content">
<view class="section-title">营业设置</view>
<view class="value">
<view class="name">营业开始时间</view>
<view class="text">
<picker mode="time" :value="shop.businessHourBegin" start="00:00" end="23:59"
@change="bindTimeChange($event,'businessHourBegin')">
<view class="picker-text" :class="{ placeholder: !shop.businessHourBegin }">
{{shop.businessHourBegin || '请选择开始时间'}}
<uni-icons type="bottom" size="14" color="#999"></uni-icons>
</view>
</picker>
</view>
</view>
<view class="value">
<view class="name">营业结束时间</view>
<view class="text">
<picker mode="time" :value="shop.businessHourEnd" start="00:00" end="23:59"
@change="bindTimeChange($event,'businessHourEnd')">
<view class="picker-text" :class="{ placeholder: !shop.businessHourEnd }">
{{shop.businessHourEnd || '请选择结束时间'}}
<uni-icons type="bottom" size="14" color="#999"></uni-icons>
</view>
</picker>
</view>
</view>
<view class="value">
<view class="name">营业状态</view>
<view class="text">
<picker :range="statusList" range-key="text" @change="statusChange">
<view class="picker-text">
{{statusText}}
<uni-icons type="bottom" size="14" color="#999"></uni-icons>
</view>
</picker>
</view>
</view>
</view>
<button :loading="submitLoading" @tap="submit">保存</button>
<view class="content">
<view class="section-title">经营信息</view>
<view class="value">
<view class="name">拼团佣金</view>
<view class="text">{{shop.commissionRateMore || 0}}%</view>
</view>
<view class="value">
<view class="name">单独购买佣金</view>
<view class="text">{{shop.commissionRateOne || 0}}%</view>
</view>
<view class="value">
<view class="name">经营品类</view>
<view class="text">{{shop.type || '暂无'}}</view>
</view>
<view class="value">
<view class="name">出餐时间</view>
<view class="text">{{shop.cookingTime || 0}}分钟</view>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
shop: {
shopId: '',
shopName: '',
businessHourBegin: '',
businessHourEnd: '',
status: 0,
commissionRateMore: '',
commissionRateOne: '',
type: '',
isDelivery: 0,
cookingTime: ''
},
submitLoading: false,
statusList: [{
value: 0,
text: '正常营业'
}, {
value: 1,
text: '暂停营业'
}]
}
},
computed: {
statusText() {
const item = this.statusList.find(item => item.value == this.shop.status)
return item ? item.text : '正常营业'
}
},
onLoad() {
this.getShopMsg()
},
methods: {
getShopMsg(){
this.NB.sendRequest('/app/shoptakeaway/getByShopId', {
shopId: uni.getStorageSync('shopId')
}, false, 'get', 'application/x-www-form-urlencoded').then(res => {
if (res.code == 200) {
this.shop = res.result
for (let key in this.shop) {
if (this.shop[key] === null) {
delete this.shop[key];
}
}
} else {
uni.showToast(res.message)
}
})
},
bindTimeChange(e, key) {
this.shop[key] = e.detail.value
},
statusChange(e) {
const item = this.statusList[e.detail.value]
if (item) this.shop.status = item.value
},
validateForm() {
if (!this.shop.businessHourBegin) return '请选择营业开始时间'
if (!this.shop.businessHourEnd) return '请选择营业结束时间'
return ''
},
submit(){
const error = this.validateForm()
if (error) {
uni.showToast({
title: error,
icon: 'none'
})
return
}
const payload = {
id: this.shop.id,
shopId: this.shop.shopId || uni.getStorageSync('shopId'),
businessHourBegin: this.shop.businessHourBegin,
businessHourEnd: this.shop.businessHourEnd,
status: Number(this.shop.status)
}
this.submitLoading = true
this.NB.sendRequest('/app/shoptakeaway/update', payload, false, 'POST', 'application/x-www-form-urlencoded').then(res => {
if (res.code == 200) {
uni.showModal({
title: '提示',
content: '经营信息已更新',
showCancel: false,
success: (modalRes) => {
if (modalRes.confirm) uni.navigateBack()
}
})
} else {
uni.showToast(res.message)
}
})
}
}
}
</script>
<style>
page,
.page1 {
width: 100%;
min-height: 100%;
font-size: 24rpx;
color: #12342d;
background:
radial-gradient(circle at 92% 120rpx, rgba(166, 255, 234, 0.45) 0, rgba(166, 255, 234, 0) 240rpx),
linear-gradient(180deg, #f3fff6 0%, #f5f8f5 36%, #eef4f1 100%);
overflow: scroll;
}
.hero {
position: relative;
width: 100%;
height: 260rpx;
padding: 58rpx 42rpx 0;
box-sizing: border-box;
overflow: hidden;
background:
linear-gradient(135deg, rgba(227, 255, 150, 0.95) 0%, rgba(166, 255, 234, 0.86) 58%, rgba(255, 255, 255, 0.72) 100%),
url('https://jewel-shop.oss-cn-beijing.aliyuncs.com/8bc15960c2dc40268e295d6dd23aecce.png') center/cover no-repeat;
}
.hero::after {
content: "";
position: absolute;
right: -34rpx;
top: -44rpx;
width: 290rpx;
height: 290rpx;
border-radius: 50%;
background: rgba(255, 255, 255, 0.32);
}
.hero-title {
position: relative;
z-index: 1;
font-size: 46rpx;
line-height: 64rpx;
font-weight: 900;
letter-spacing: 2rpx;
color: #07362d;
}
.hero-subtitle {
position: relative;
z-index: 1;
margin-top: 12rpx;
font-size: 26rpx;
font-weight: 600;
color: rgba(0, 35, 28, 0.62);
}
.form-wrap {
position: relative;
z-index: 2;
width: 92%;
margin: -54rpx auto 0;
padding-bottom: 40rpx;
}
.content {
width: 100%;
margin-bottom: 24rpx;
overflow: hidden;
border: 1rpx solid rgba(255, 255, 255, 0.86);
border-radius: 28rpx;
background: rgba(255, 255, 255, 0.96);
box-shadow: 0 16rpx 36rpx rgba(0, 35, 28, 0.08);
}
.section-title {
height: 92rpx;
line-height: 92rpx;
padding: 0 28rpx;
border-bottom: 1rpx solid #edf3f0;
font-size: 30rpx;
font-weight: 900;
color: #102f28;
}
.value {
width: 100%;
min-height: 96rpx;
display: flex;
align-items: center;
border-top: 1rpx solid #edf3f0;
padding: 0 28rpx;
box-sizing: border-box;
}
.section-title + .value {
border-top: none;
}
.name {
width: 210rpx;
font-size: 28rpx;
font-weight: 800;
color: #153c34;
}
.text {
flex: 1;
min-width: 0;
text-align: right;
color: #263f39;
font-size: 28rpx;
}
.text input {
height: 96rpx;
line-height: 96rpx;
text-align: right;
font-size: 28rpx;
color: #263f39;
}
.picker-text {
min-height: 96rpx;
line-height: 96rpx;
font-size: 28rpx;
color: #263f39;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
.picker-text.placeholder {
color: #9aa7a3;
}
button {
width: 100%;
height: 96rpx;
line-height: 96rpx;
margin: 44rpx auto 12rpx;
border-radius: 999rpx;
background: linear-gradient(90deg, #e3ff96 0%, #a6ffea 100%);
color: #00231c;
font-size: 34rpx;
font-weight: 900;
box-shadow: 0 18rpx 36rpx rgba(0, 35, 28, 0.14);
}
button::after {
border: none;
}
</style>