czg_team/cashier_admin_app
7
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

修改调整页面样式

Browse Source
This commit is contained in:
YeMingfei666
2024-10-18 16:27:51 +08:00
parent 91c716103e
commit f44cf801e8
22 changed files with 543 additions and 278 deletions
Download Patch File Download Diff File Expand all files Collapse all files

143
pageProduct/add-specifications/add-specifications.vue
View File

@@ -1,11 +1,11 @@
<template>
<view class="page">
<view class="page min-page">
<view class="box">
<view class="block border-top-0">
<view class="block border-top-0 u-p-t-32 u-p-b-32">
<uni-forms ref="nameFormRef" :model="specifications" :rules="rules" :label-width="350"
label-position="top" validateTrigger="blur">
<uni-forms-item label="模版名称" required name="name">
<uni-easyinput :placeholderStyle="placeholderStyle" :inputBorder="inputBorder"
<uni-easyinput padding-none :placeholderStyle="placeholderStyle" :inputBorder="inputBorder"
v-model="specifications.name" placeholder="模版名称,如:衣服" />
</uni-forms-item>
</uni-forms>
@@ -17,71 +17,81 @@
<view class="block">
<view class="border-top-0">
<uni-forms-item label="规格组名" required name="name">
<uni-easyinput :placeholderStyle="placeholderStyle" :inputBorder="inputBorder"
<uni-easyinput padding-none :placeholderStyle="placeholderStyle" :inputBorder="inputBorder"
v-model="item.name" placeholder="规格组名,如:尺码" />
</uni-forms-item>
</view>
<uni-forms-item label="规格值">
<view class="option">
<view class="">
<view class="u-flex option-item" v-for="(option,optionIndex) in item.options"
:key="optionIndex">
<view class="u-flex-1">
<uni-forms-item :key="optionIndex" :name="['options',optionIndex,'name']"
:ref="setFormInputRef(index,optionIndex)"
:rules="[{'required': true,errorMessage: '必填'}]" label-width="0"
label="" required :showRequired="false">
<uni-easyinput
v-model="specifications.list[index].options[optionIndex].name"
@input="inpuChange(index,optionIndex)"
:placeholderStyle="placeholderStyle" :inputBorder="inputBorder"
placeholder="请输入规格值,如:S、M" />
</uni-forms-item>
</view>
<view class=" u-flex" v-if="item.options.length>1">
<uni-forms-item :key="optionIndex" label-width="0" label=""
:showRequired="false">
<view class="u-flex">
<!-- <uni-easyinput v-model="specifications.list[index].options[optionIndex].optionPrice"
@input="inpuChange(index,optionIndex)"
:placeholderStyle="placeholderStyle" :inputBorder="inputBorder"
type="digit" placeholder="填写价格" /> -->
<view class="icon icon-reduce u-m-l-38"
@click="delOption(index,optionIndex)">
<view class="u-p-b-8">
<uni-forms-item label="规格值">
<view class="option ">
<view class="">
<view class="u-flex option-item u-m-t-8" v-for="(option,optionIndex) in item.options"
:key="optionIndex">
<view class="u-flex-1">
<uni-forms-item :key="optionIndex" :name="['options',optionIndex,'name']"
:ref="setFormInputRef(index,optionIndex)"
:rules="[{'required': true,errorMessage: '必填'}]" label-width="0"
label="" required :showRequired="false">
<view class="bg-fff u-p-t-12 u-p-b-12" style="border-radius: 8rpx;">
<uni-easyinput
v-model="specifications.list[index].options[optionIndex].name"
@input="inpuChange(index,optionIndex)"
:placeholderStyle="placeholderStyle" :inputBorder="inputBorder"
placeholder="请输入规格值,如:S、M" />
</view>
</view>
</uni-forms-item>
</uni-forms-item>
</view>
<view class=" u-flex" v-if="item.options.length>1">
<uni-forms-item :key="optionIndex" label-width="0" label=""
:showRequired="false">
<view class="u-flex">
<!-- <uni-easyinput v-model="specifications.list[index].options[optionIndex].optionPrice"
@input="inpuChange(index,optionIndex)"
:placeholderStyle="placeholderStyle" :inputBorder="inputBorder"
type="digit" placeholder="填写价格" /> -->
<view class="icon icon-reduce u-m-l-38"
@click="delOption(index,optionIndex)">
</view>
</view>
</uni-forms-item>
</view>
</view>
</view>
</view>
<view class="u-flex" @click="addOptions(index)">
<view class="icon icon-add u-m-r-22 ">
<view class="u-flex u-m-t-24 " @click="addOptions(index)">
<view class="icon icon-add u-m-r-22 ">
</view>
<view class="color-main">添加规格</view>
</view>
<view class="color-main">添加规格</view>
</view>
</view>
</uni-forms-item>
<template v-if="specifications.list.length>1">
<view class="u-flex u-m-t-48 u-m-b-24" @click="delSpecificationsGroup(index)">
<view class="icon icon-reduce u-m-r-22 ">
</view>
<view class="color-red">删除规格组</view>
</uni-forms-item>
</view>
<template v-if="specifications.list.length>1">
<view class="u-p-b-32">
<view class="u-flex " @click="delSpecificationsGroup(index)">
<view class="icon icon-reduce u-m-r-22 ">
</view>
<view class="color-red">删除规格组</view>
</view>
</view>
</template>
</view>
</uni-forms>
</view>
<view class="u-flex block u-p-l-20 u-p-r-20 u-p-t-28 u-p-b-28" @click="addSpecificationsGroup">
<view class="icon icon-add u-m-r-22 ">
@@ -90,7 +100,7 @@
</view>
<view class="save-btn-box">
<button class="save-btn" hover-class="btn-hover-class" @click="save">保存</button>
<button class="save-btn " hover-class="btn-hover-class" @click="save">保存</button>
</view>
</view>
<view class="bottom" ref="bottom"></view>
@@ -366,14 +376,25 @@
.page {
background: #F9F9F9;
padding: 30rpx;
padding: 32rpx 30rpx 0 30rpx;
padding-bottom: 200rpx;
}
::v-deep .uni-forms-item--border {
padding-top: 12px;
padding-bottom: 12px;
}
.my-switch {
transform: scale(0.7);
}
::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;
}
@@ -440,13 +461,11 @@
}
.box {
margin-top: 70rpx;
font-size: 28rpx;
.block {
background: #FFFFFF;
border-radius: 18rpx 18rpx 18rpx 18rpx;
padding: 12rpx 24rpx;
padding: 0 24rpx;
margin-bottom: 32rpx;
}
}
@@ -479,6 +498,7 @@
color: #fff;
border-radius: 12rpx;
font-size: 28rpx;
border-radius: 100rpx;
}
.btn-hover-class {
@@ -497,11 +517,10 @@
}
.option {
padding: 26rpx 30rpx 24rpx 24rpx;
padding: 8rpx 24rpx 32rpx 24rpx;
background: #F9F9F9;
}
.option-item {
margin-bottom: 34rpx;
}
</style>