179 lines
3.5 KiB
Vue
179 lines
3.5 KiB
Vue
<template>
|
|
<view class="page min-page">
|
|
<view class="box">
|
|
<view class="block border-top-0 u-p-t-32 u-p-b-32">
|
|
<up-form ref="formRef" labelPosition="top" :model="vdata.formData" :rules="vdata.rules" labelWidth="80" :labelStyle="{fontWeight:'bold'}">
|
|
<up-form-item label="规格名称" prop="name" borderBottom >
|
|
<up-input v-model="vdata.formData.name" border="none" placeholder="规格名称,如:衣服" ></up-input>
|
|
</up-form-item>
|
|
<up-form-item label="排序" prop="sort" borderBottom >
|
|
<up-input v-model="vdata.formData.sort" border="none" placeholder="请输入排序" ></up-input>
|
|
</up-form-item>
|
|
</up-form>
|
|
</view>
|
|
<view class="save-btn-box">
|
|
<button class="save-btn " hover-class="btn-hover-class" @click="save">保存</button>
|
|
</view>
|
|
</view>
|
|
|
|
</view>
|
|
</template>
|
|
|
|
<script setup>
|
|
import { reactive, ref } from 'vue';
|
|
import { onLoad } from '@dcloudio/uni-app';
|
|
import infoBox from '@/commons/utils/infoBox.js'
|
|
import { updateSpec } from '@/api/product.js'
|
|
|
|
const option = {
|
|
type: 'add',
|
|
id: undefined
|
|
}
|
|
const formRef = ref(null)
|
|
const vdata = reactive({
|
|
formData: {
|
|
id: null,
|
|
name: "",
|
|
level: "",
|
|
sort: "",
|
|
pid: "",
|
|
},
|
|
rules: {
|
|
"name": {
|
|
required: true,
|
|
message: '请输入规格名称',
|
|
trigger: ['blur', 'change'],
|
|
},
|
|
"sort": {
|
|
required: true,
|
|
message: '请输入排序',
|
|
trigger: ['blur', 'change'],
|
|
},
|
|
},
|
|
})
|
|
|
|
onLoad(opt => {
|
|
if (opt && JSON.stringify(opt) !== '{}' && opt.type) {
|
|
const data = uni.getStorageSync('spec')
|
|
uni.removeStorageSync('spec')
|
|
if(data){
|
|
vdata.formData.id = data.id
|
|
vdata.formData.name = data.name
|
|
vdata.formData.sort = data.sort
|
|
vdata.formData.level = data.level
|
|
vdata.formData.pid = data.pid
|
|
}
|
|
}
|
|
uni.setNavigationBarTitle({
|
|
title: '编辑规格模版'
|
|
})
|
|
})
|
|
|
|
/**
|
|
* 保存
|
|
*/
|
|
async function save() {
|
|
updateSpec(vdata.formData).then(res => {
|
|
infoBox.showToast('修改成功')
|
|
setTimeout(() => {
|
|
uni.navigateBack()
|
|
}, 1500)
|
|
})
|
|
}
|
|
|
|
|
|
</script>
|
|
<style scoped>
|
|
page {
|
|
background: #F9F9F9;
|
|
}
|
|
</style>
|
|
<style lang="scss" scoped>
|
|
|
|
.page {
|
|
background: #F9F9F9;
|
|
padding: 32rpx 30rpx 0 30rpx;
|
|
padding-bottom: 200rpx;
|
|
}
|
|
::v-deep .uni-forms-item--border {
|
|
padding-top: 12px;
|
|
padding-bottom: 12px;
|
|
}
|
|
|
|
::v-deep .uni-forms-item.is-direction-top .uni-forms-item__label{
|
|
padding-bottom: 8px;
|
|
}
|
|
::v-deep .uni-easyinput__content-input{
|
|
height: inherit;
|
|
}
|
|
::v-deep.uni-forms-item {
|
|
min-height: inherit;
|
|
}
|
|
::v-deep .uni-forms-item__error {
|
|
display: none !important;
|
|
}
|
|
|
|
::v-deep .option .uni-forms-item {
|
|
padding: 0;
|
|
min-height: inherit;
|
|
background-color: transparent;
|
|
border-top: none;
|
|
}
|
|
|
|
|
|
.box {
|
|
font-size: 28rpx;
|
|
.block {
|
|
background: #FFFFFF;
|
|
border-radius: 18rpx 18rpx 18rpx 18rpx;
|
|
padding: 0 24rpx;
|
|
margin-bottom: 32rpx;
|
|
}
|
|
}
|
|
|
|
.save-btn-box {
|
|
position: fixed;
|
|
left: 30rpx;
|
|
right: 30rpx;
|
|
bottom: 60rpx;
|
|
|
|
}
|
|
|
|
::v-deep.uni-forms-item {
|
|
align-items: inherit;
|
|
}
|
|
|
|
::v-deep .uni-forms-item .uni-forms-item__label {
|
|
text-indent: 0;
|
|
font-size: 28rpx !important;
|
|
font-weight: bold;
|
|
color: #333;
|
|
}
|
|
|
|
::v-deep .border-top-0 .uni-forms-item.is-direction-top {
|
|
border-color: transparent !important;
|
|
}
|
|
|
|
.save-btn {
|
|
background-color: $my-main-color;
|
|
color: #fff;
|
|
border-radius: 12rpx;
|
|
font-size: 28rpx;
|
|
border-radius: 100rpx;
|
|
}
|
|
|
|
.btn-hover-class {
|
|
opacity: .6;
|
|
}
|
|
|
|
::v-deep .uni-input-placeholder {
|
|
font-size: 28rpx;
|
|
}
|
|
|
|
.option {
|
|
padding: 8rpx 24rpx 32rpx 24rpx;
|
|
background: #F9F9F9;
|
|
}
|
|
|
|
|
|
</style> |