790 lines
17 KiB
Vue
790 lines
17 KiB
Vue
<template>
|
|
<view class="page u-font-24 color-333">
|
|
<view class="box ">
|
|
<view>
|
|
<uni-forms :model="FormData" :rules="rules" err-show-type="undertext" validateTrigger="blur" ref="form"
|
|
:border="true" :label-width="130">
|
|
<view class="block u-p-b-16">
|
|
|
|
<view class="">
|
|
<view class="u-m-t-20">选择规格</view>
|
|
<view class="u-m-t-16">
|
|
<uni-data-picker :clear-icon="false" @change="specIdChange"
|
|
:map="{text:'name',value:'id'}" placeholder="请选择规格" popup-title="请选择规格"
|
|
:localdata="FormData.specList" v-model="FormData.specId">
|
|
</uni-data-picker>
|
|
</view>
|
|
</view>
|
|
|
|
<view class=" ">
|
|
<view class="u-m-t-32" v-for="(item,index) in FormData.selectSpecInfo" :key="index">
|
|
<view class="font-bold">
|
|
{{item.name}}
|
|
</view>
|
|
<view class="u-m-t-16">
|
|
|
|
|
|
<uni-data-checkbox @change="createResult" multiple :selectedColor="$utils.ColorMain"
|
|
v-model="item.selectSpecResult" :localdata="item.children">
|
|
</uni-data-checkbox>
|
|
|
|
</view>
|
|
|
|
</view>
|
|
<view class="u-p-b-16"></view>
|
|
</view>
|
|
</view>
|
|
|
|
|
|
</uni-forms>
|
|
|
|
<view>
|
|
<view class="block u-m-b-0 u-m-t-32" v-for="(item,index) in FormData.result" :key="index">
|
|
<uni-forms :model="item.skus" :rules="rules" :ref="setFormRef(index)" err-show-type="undertext"
|
|
validateTrigger="blur" :border="true" :label-width="130">
|
|
|
|
<view class="">
|
|
<view class="u-m-t-20 u-p-b-24 border-bottom" v-for="(val,key) in item.names"
|
|
:key="key">
|
|
<view class="font-bold u-m-r-12">
|
|
{{key}}
|
|
</view>
|
|
<view class="u-m-t-16 color-666 u-font-24">{{val}}</view>
|
|
</view>
|
|
</view>
|
|
<view class="u-m-t-24">
|
|
<view label="">
|
|
<view class="font-bold">
|
|
图片
|
|
</view>
|
|
<view class="u-m-t-16">
|
|
<my-upload-file @change="changeResultCover($event,index)" :limit="1"
|
|
:imageStyles="imageStyles" :ref="setRefFile(index)"
|
|
:images="item.coverImg"></my-upload-file>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="skus u-m-t-24">
|
|
<view class="">
|
|
<uni-forms-item label="售价" required name="salePrice">
|
|
<uni-easyinput @blur="priceFormat(item.skus,'salePrice')"
|
|
:paddingNone="inputPaddingNone" :placeholderStyle="placeholderStyle"
|
|
:inputBorder="inputBorder" v-model="item.skus.salePrice" type="digit"
|
|
placeholder="请输入售价（元）" />
|
|
</uni-forms-item>
|
|
</view>
|
|
|
|
<uni-forms-item label="会员价（元）" required name="memberPrice">
|
|
<uni-easyinput @blur="priceFormat(item.skus,'memberPrice')"
|
|
:paddingNone="inputPaddingNone" :placeholderStyle="placeholderStyle"
|
|
:inputBorder="inputBorder" v-model="item.skus.memberPrice" type="digit"
|
|
placeholder="请输入会员价（元）" />
|
|
</uni-forms-item>
|
|
<uni-forms-item label="成本价（元）" required name="costPrice">
|
|
<uni-easyinput @blur="priceFormat(item.skus,'costPrice')"
|
|
:paddingNone="inputPaddingNone" :placeholderStyle="placeholderStyle"
|
|
:inputBorder="inputBorder" v-model="item.skus.costPrice" type="digit"
|
|
placeholder="请输入成本价（元）" />
|
|
</uni-forms-item>
|
|
<uni-forms-item label="原价（元）" required name="originPrice">
|
|
<uni-easyinput @blur="priceFormat(item.skus,'originPrice')"
|
|
:paddingNone="inputPaddingNone" :placeholderStyle="placeholderStyle"
|
|
:inputBorder="inputBorder" v-model="item.skus.originPrice" type="digit"
|
|
placeholder="请输入原价（元）" />
|
|
</uni-forms-item>
|
|
<uni-forms-item label="起售数量" required name="suitNum">
|
|
<uni-easyinput @blur="priceFormat(item.skus,'suitNum')" :paddingNone="inputPaddingNone"
|
|
:placeholderStyle="placeholderStyle" :inputBorder="inputBorder"
|
|
v-model="item.skus.suitNum" type="digit" placeholder="请输入起售数量" />
|
|
</uni-forms-item>
|
|
|
|
|
|
<uni-forms-item label="商品条码" required>
|
|
<view class="bg-gray u-flex u-col-center u-col-center u-p-l-24" style="height: 72rpx;background: #F6F6F6;border-radius: 8rpx ;">
|
|
<uni-easyinput disabled :paddingNone="inputPaddingNone"
|
|
:placeholderStyle="placeholderStyle" :inputBorder="inputBorder"
|
|
v-model="item.skus.barCode" placeholder="请输入商品条码" />
|
|
</view>
|
|
|
|
</uni-forms-item>
|
|
|
|
</view>
|
|
</uni-forms>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
|
|
</view>
|
|
|
|
<view :style="{height:bottomHeight+'px'}"></view>
|
|
<view class="safe-bottom fixed">
|
|
<view class="btn">
|
|
<up-button @click="save" shape="circle" type="primary" >
|
|
<view class=" font-bold">
|
|
保存
|
|
</view>
|
|
</up-button>
|
|
<!-- <button class="save-btn" hover-class="btn-hover-class" @click="save">保存</button> -->
|
|
<view class="u-m-t-20">
|
|
<button class="save-btn edit-btn" hover-class="btn-hover-class" @click="fastEditShow">
|
|
<view class="u-flex u-row-center">
|
|
<view class="u-m-r-6">批量修改</view>
|
|
<up-icon name="edit-pen" :color="$utils.ColorMain"></up-icon>
|
|
</view>
|
|
</button>
|
|
</view>
|
|
</view>
|
|
|
|
</view>
|
|
|
|
<pop-fast-edit @update="updateSkuKey" v-model:show="fastEdit.show"></pop-fast-edit>
|
|
</view>
|
|
</template>
|
|
<script setup>
|
|
import { reactive, nextTick, ref, watch } from 'vue';
|
|
import { onLoad, onReady, onShow } from '@dcloudio/uni-app';
|
|
import { getSafeBottomHeight } from '@/commons/utils/safe-bottom.js'
|
|
import { formatPrice } from "@/commons/utils/format.js";
|
|
import popFastEdit from "./components/fast-edit.vue"
|
|
import infoBox from '@/commons/utils/infoBox.js'
|
|
import dayjs from "dayjs";
|
|
import go from '@/commons/utils/go.js';
|
|
import { $defaultSku } from '@/commons/goodsData.js'
|
|
|
|
import { hasPermission } from '@/commons/utils/hasPermission.js';
|
|
import { getSpecList,delSpec } from '@/http/api/product.js'
|
|
|
|
|
|
//上个页面传来的参数
|
|
let option = {}
|
|
const FormData = reactive({
|
|
specId: '',
|
|
specItem: '',
|
|
specAllList: [],
|
|
result: [],
|
|
selectSpecInfo: [],
|
|
})
|
|
|
|
//表单验证
|
|
const rules = {
|
|
salePrice: {
|
|
rules: [{
|
|
required: true,
|
|
errorMessage: '售价必填'
|
|
}]
|
|
},
|
|
memberPrice: {
|
|
rules: [{
|
|
required: true,
|
|
errorMessage: '会员价必填'
|
|
}]
|
|
},
|
|
costPrice: {
|
|
rules: [{
|
|
required: true,
|
|
errorMessage: '成本价必填'
|
|
}]
|
|
},
|
|
originPrice: {
|
|
rules: [{
|
|
required: true,
|
|
errorMessage: '原价必填'
|
|
}]
|
|
},
|
|
suitNum: {
|
|
rules: [{
|
|
required: true,
|
|
errorMessage: '起售数量必填'
|
|
},
|
|
{
|
|
validateFunction: function(rule, value, data, callback) {
|
|
if (value < 1) {
|
|
callback('起售数量至少为1个')
|
|
}
|
|
return true
|
|
}
|
|
}
|
|
]
|
|
}
|
|
}
|
|
let bottomHeight = ref(100)
|
|
|
|
const inputPaddingNone = ref(true)
|
|
const form = ref(null)
|
|
const formRefs = ref([]);
|
|
const originSpecMap = {}
|
|
|
|
let emitName = ''
|
|
|
|
onReady(() => {
|
|
getSafeBottomHeight('safe-bottom').then(res => {
|
|
console.log(res);
|
|
bottomHeight.value = res
|
|
})
|
|
})
|
|
|
|
onShow(() => {
|
|
canEditGoodsStock()
|
|
})
|
|
|
|
onLoad(opt => {
|
|
Object.assign(option, opt)
|
|
const obj = uni.getStorageSync('guige')
|
|
getTbProductSpec(obj)
|
|
if (opt && JSON.stringify(opt) !== '{}' && opt.emitName) {
|
|
emitName = opt.emitName
|
|
}
|
|
|
|
})
|
|
function triggerEvent(emitName, data) {
|
|
if (emitName) {
|
|
uni.$emit(emitName, data)
|
|
}
|
|
}
|
|
/**
|
|
* 获取规格数据
|
|
*/
|
|
function getTbProductSpec(obj) {
|
|
getSpecList({name: ''}).then(res => {
|
|
FormData.specAllList = res;
|
|
FormData.specAllList.map(item => {
|
|
item.children.map(spe => {
|
|
spe.children.map(v => {
|
|
if (obj && JSON.stringify(obj) !== '{}') {
|
|
spe.selectSpecResult = []
|
|
for (var oe in obj.selectSpecInfo) {
|
|
|
|
if ( spe.name == oe ) {
|
|
spe.selectSpecResult = obj.selectSpecInfo[oe]
|
|
}
|
|
}
|
|
} else {
|
|
spe.selectSpecResult = []
|
|
}
|
|
v.text = v.name
|
|
v.value = v.name
|
|
})
|
|
})
|
|
});
|
|
if (obj && JSON.stringify(obj) !== '{}') {
|
|
FormData.specAllList.map(item=>{
|
|
if( item.id == obj.specId ){
|
|
obj.selectSpecInfo = item.children
|
|
}
|
|
})
|
|
}
|
|
FormData.specList = res.map(item => {
|
|
return {
|
|
id: item.id,
|
|
name: item.name,
|
|
}
|
|
})
|
|
if (obj && JSON.stringify(obj) !== '{}') {
|
|
// console.log(obj.selectSpecInfo);
|
|
Object.assign(FormData, obj)
|
|
for (let i of obj.result) {
|
|
const key = returnSpecSnap(i.names)
|
|
originSpecMap[key] = i
|
|
}
|
|
nextTick(() => {
|
|
FormData.result = obj.result
|
|
})
|
|
}
|
|
console.log(FormData)
|
|
})
|
|
}
|
|
|
|
/**
|
|
* 规则选择
|
|
* @param {Object} e
|
|
*/
|
|
function specIdChange(e) {
|
|
|
|
const item = FormData.specAllList.find(v => v.id === FormData.specId)
|
|
FormData.selectSpecInfo = (item.children || [])
|
|
console.log(item)
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
const refFiles = ref([]);
|
|
const imageStyles = reactive({
|
|
width: 82,
|
|
height: 82,
|
|
border: {
|
|
radius: '4px'
|
|
}
|
|
})
|
|
//绑定文件上传元素
|
|
function setRefFile(index) {
|
|
refFiles.value[index] = null;
|
|
return (el) => {
|
|
if (el) {
|
|
refFiles.value[index] = el;
|
|
}
|
|
};
|
|
}
|
|
|
|
const fastEdit = reactive({
|
|
show: false,
|
|
list: [{
|
|
text: '会员价',
|
|
key: 'memberPrice',
|
|
value: ''
|
|
},
|
|
{
|
|
text: '成本价',
|
|
key: 'costPrice',
|
|
value: ''
|
|
},
|
|
{
|
|
text: '原价',
|
|
key: 'originPrice',
|
|
value: ''
|
|
},
|
|
{
|
|
text: '起售数量',
|
|
key: 'suitNum',
|
|
value: ''
|
|
},
|
|
{
|
|
text: '库存数量',
|
|
key: 'stockNumber',
|
|
value: ''
|
|
}
|
|
],
|
|
sel: ''
|
|
})
|
|
|
|
/**
|
|
* 批量修改打开
|
|
*/
|
|
function fastEditShow() {
|
|
fastEdit.show = true
|
|
}
|
|
|
|
|
|
|
|
|
|
/**
|
|
* number类型数据限制
|
|
* @param {Object} item
|
|
* @param {Object} key
|
|
*/
|
|
function priceFormat(item, key) {
|
|
nextTick(() => {
|
|
let min = 0;
|
|
let max = 100000000;
|
|
if (key == 'suitNum') {
|
|
min = 1
|
|
}
|
|
const newval = formatPrice(item[key], min, max, true)
|
|
if (typeof newval !== 'number') {
|
|
item[key] = newval.value
|
|
uni.showToast({
|
|
title: `请输入${min}到${max}范围内的数字`,
|
|
icon: 'none'
|
|
})
|
|
} else {
|
|
item[key] = newval
|
|
}
|
|
})
|
|
}
|
|
|
|
|
|
/**
|
|
* 批量修改监听
|
|
* @param {Object} arr
|
|
*/
|
|
function updateSkuKey(arr) {
|
|
for (let i in FormData.result) {
|
|
const sku = FormData.result[i].skus
|
|
for (let k in arr) {
|
|
const item = arr[k]
|
|
if (sku.hasOwnProperty(item.key)) {
|
|
sku[item.key] = item.value
|
|
}
|
|
}
|
|
|
|
}
|
|
}
|
|
|
|
|
|
|
|
//表单相关事件
|
|
function changeResultCover(val, index) {
|
|
FormData.result[index].coverImg = val
|
|
}
|
|
//绑定表单元素
|
|
function setFormRef(index) {
|
|
formRefs.value[index] = null;
|
|
return (el) => {
|
|
if (el) {
|
|
formRefs.value[index] = el;
|
|
}
|
|
};
|
|
}
|
|
watch(() => FormData.specId, (newval) => {
|
|
FormData.result = []
|
|
})
|
|
const bottom = ref(null)
|
|
// 表单样式
|
|
const placeholderStyle = ref('font-size:28rpx;')
|
|
//表单边框
|
|
const inputBorder = ref(false)
|
|
|
|
//生成笛卡尔集
|
|
function combineSpecs(specs) {
|
|
if (specs.length === 0) {
|
|
return [
|
|
[]
|
|
];
|
|
} else {
|
|
const [head, ...tail] = specs;
|
|
const rest = combineSpecs(tail);
|
|
const pairs = head.value.map(value => rest.map(r => {
|
|
return {
|
|
[head.name]: value,
|
|
...r
|
|
}
|
|
}));
|
|
return [].concat(...pairs);
|
|
}
|
|
};
|
|
const defaultSku = reactive({
|
|
...$defaultSku,
|
|
coverImg: '',
|
|
barCode: `${uni.getStorageSync("shopId")}${dayjs().valueOf()}`
|
|
})
|
|
|
|
function returnDefaultSku() {
|
|
const randomNumber = Math.floor(Math.random() * 1000)
|
|
return {
|
|
...defaultSku,
|
|
barCode: `${uni.getStorageSync("shopId")}${dayjs().valueOf()-randomNumber}`
|
|
}
|
|
}
|
|
|
|
/**
|
|
* 选择规格属性
|
|
*/
|
|
function createResult() {
|
|
let arr = []
|
|
for (let k of FormData.selectSpecInfo) {
|
|
if (k.selectSpecResult.length) {
|
|
arr.push({
|
|
value: k.selectSpecResult,
|
|
name: k.name
|
|
})
|
|
}
|
|
}
|
|
const spes = combineSpecs(arr)
|
|
const result = spes.filter(v => {
|
|
return !Array.isArray(v)
|
|
}).map(v => {
|
|
const specInfo = returnSpecSnap(v)
|
|
const data = originSpecMap[specInfo]
|
|
const skus = returnDefaultSku()
|
|
const newdata = {
|
|
names: v,
|
|
specInfo,
|
|
skus
|
|
}
|
|
return data || newdata
|
|
})
|
|
FormData.result = result
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
//页面滚动到最底部
|
|
function scrollPageBottom() {
|
|
nextTick(() => {
|
|
uni.pageScrollTo({
|
|
duration: 100, // 过渡时间
|
|
scrollTop: 100000, // 滚动的实际距离
|
|
})
|
|
})
|
|
}
|
|
|
|
|
|
|
|
//生成name
|
|
function returnSpecSnap(names) {
|
|
const specInfo = Object.keys(names).reduce((prve, cur) => {
|
|
return prve + names[cur] + ','
|
|
}, '')
|
|
return specInfo.substring(0, specInfo.length - 1)
|
|
}
|
|
// 允许修改商品库存
|
|
let disabledStock = ref(false)
|
|
async function canEditGoodsStock(tips = false) {
|
|
console.log(tips);
|
|
if (option.type === 'edit') {
|
|
const res = await hasPermission({
|
|
text: '允许修改商品库存',
|
|
tips: tips
|
|
})
|
|
disabledStock.value = !res
|
|
}
|
|
}
|
|
|
|
|
|
function emitspecificationsSave() {
|
|
// emitspecificationsSave 触发规格保存事件将数据给到添加商品页面
|
|
// guigeEdit 触发规格保存事件将数据给到添加规格页面
|
|
uni.removeStorageSync('guige')
|
|
triggerEvent(emitName, FormData)
|
|
go.back()
|
|
}
|
|
|
|
function returnPromise(prosise) {
|
|
return new Promise((resolve, reject) => {
|
|
prosise.then(res => {
|
|
resolve({
|
|
sucees: true
|
|
})
|
|
}).catch(err => {
|
|
console.log(err);
|
|
if (err.length >= 1) {
|
|
infoBox.showToast(err[0].errorMessage)
|
|
}
|
|
resolve({
|
|
sucees: false
|
|
})
|
|
})
|
|
})
|
|
}
|
|
async function save() {
|
|
if (!FormData.result.length) {
|
|
return infoBox.showToast('请先选择规格！')
|
|
}
|
|
let isAllPassForm = 0
|
|
for (let i in FormData.result) {
|
|
const res = await returnPromise(formRefs.value[i].validate(), i)
|
|
isAllPassForm += res.sucees ? 1 : 0
|
|
}
|
|
if (isAllPassForm < FormData.result.length) {
|
|
return
|
|
}
|
|
//判断验证是否通过
|
|
console.log('pass');
|
|
const item = FormData.specList.find(v => v.id === FormData.specId)
|
|
FormData.specName = item ? item.name : ''
|
|
console.log(FormData);
|
|
emitspecificationsSave()
|
|
|
|
}
|
|
</script>
|
|
<style scoped>
|
|
page {
|
|
background: #F9F9F9;
|
|
}
|
|
</style>
|
|
<style lang="scss" scoped>
|
|
$icon-size: 34rpx;
|
|
$icon-line-width: 20rpx;
|
|
$icon-line-height: 4rpx;
|
|
|
|
::v-deep.uni-forms-item__content {
|
|
margin: auto;
|
|
}
|
|
|
|
::v-deep .uni-forms-item--border {
|
|
padding-top: 24rpx;
|
|
padding-bottom: 24rpx;
|
|
}
|
|
|
|
::v-deep.uni-forms-item {
|
|
min-height: inherit;
|
|
}
|
|
|
|
.page {
|
|
background: #F9F9F9;
|
|
padding: 30rpx 30rpx 0 30rpx;
|
|
}
|
|
|
|
.safe-bottom {
|
|
padding: 34rpx 28rpx;
|
|
position: fixed;
|
|
background-color: #fff;
|
|
left: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
z-index: 10;
|
|
|
|
.btn {
|
|
padding: 0 88rpx 56rpx 88rpx;
|
|
}
|
|
}
|
|
|
|
.my-switch {
|
|
transform: scale(0.7);
|
|
}
|
|
::v-deep .uni-data-checklist .checklist-group .checklist-box .checkbox__inner{
|
|
border-radius: 50%;
|
|
}
|
|
|
|
::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;
|
|
}
|
|
|
|
.icon {
|
|
width: $icon-size;
|
|
height: $icon-size;
|
|
position: relative;
|
|
border-radius: 50%;
|
|
|
|
&:before,
|
|
&::after {
|
|
position: absolute;
|
|
display: block;
|
|
content: '';
|
|
background-color: #fff;
|
|
}
|
|
}
|
|
|
|
.icon-add {
|
|
background-color: $my-main-color;
|
|
|
|
&::before {
|
|
width: $icon-line-height;
|
|
height: $icon-line-width;
|
|
top: calc(($icon-size /2) - ($icon-line-width / 2));
|
|
left: calc(($icon-size /2) - ($icon-line-height / 2));
|
|
}
|
|
|
|
&::after {
|
|
width: $icon-line-width;
|
|
height: 4rpx;
|
|
top: calc(($icon-size /2) - ($icon-line-height / 2));
|
|
left: calc(($icon-size /2) - ($icon-line-width / 2));
|
|
}
|
|
}
|
|
|
|
::v-deep .uni-easyinput__content-input {
|
|
height: inherit;
|
|
}
|
|
|
|
.icon-reduce {
|
|
background-color: $my-red-color;
|
|
|
|
&::after {
|
|
width: $icon-line-width;
|
|
height: $icon-line-height;
|
|
top: calc(($icon-size /2) - ($icon-line-height / 2));
|
|
left: calc(($icon-size /2) - ($icon-line-width / 2));
|
|
}
|
|
}
|
|
|
|
.label-title {
|
|
font-size: 28rpx;
|
|
font-weight: bold;
|
|
font-family: Source Han Sans CN, Source Han Sans CN;
|
|
}
|
|
|
|
.lh40 {
|
|
line-height: 40rpx;
|
|
}
|
|
|
|
.box {
|
|
// margin-top: 70rpx;
|
|
font-size: 28rpx;
|
|
|
|
.block {
|
|
background: #FFFFFF;
|
|
border-radius: 18rpx 18rpx 18rpx 18rpx;
|
|
padding: 12rpx 24rpx;
|
|
margin-bottom: 32rpx;
|
|
}
|
|
}
|
|
|
|
.save-btn-box {
|
|
position: fixed;
|
|
left: 30rpx;
|
|
right: 30rpx;
|
|
bottom: 60rpx;
|
|
z-index: 100;
|
|
}
|
|
|
|
::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;
|
|
}
|
|
|
|
.edit-btn {
|
|
background-color: #fff;
|
|
color: #333;
|
|
border-radius: 12rpx;
|
|
font-size: 28rpx;
|
|
}
|
|
|
|
.btn-hover-class {
|
|
opacity: .6;
|
|
}
|
|
|
|
.zuofa {
|
|
padding: 28rpx 0;
|
|
background: #F9F9F9;
|
|
padding-left: 42rpx;
|
|
border-radius: 14rpx 14rpx 14rpx 14rpx;
|
|
}
|
|
|
|
.fast-edit {
|
|
.item {
|
|
color: #333;
|
|
border: 1px solid #bbb;
|
|
padding: 4rpx 10rpx 8rpx 10rpx;
|
|
border-radius: 10rpx;
|
|
min-width: 186rpx;
|
|
|
|
&.active {
|
|
color: $my-main-color;
|
|
}
|
|
}
|
|
}
|
|
|
|
::v-deep .uni-input-placeholder {
|
|
font-size: 28rpx;
|
|
}
|
|
|
|
.option {
|
|
padding: 26rpx 30rpx 24rpx 24rpx;
|
|
background: #F9F9F9;
|
|
}
|
|
|
|
.option-item {
|
|
margin-bottom: 34rpx;
|
|
}
|
|
</style> |