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

137
pageProduct/add-specifications/choose-specifications.vue
View File

@@ -4,25 +4,44 @@
<view>
<uni-forms :model="FormData" :rules="rules" err-show-type="undertext" validateTrigger="blur" ref="form"
:border="true" :label-width="130">
<view class="block">
<view class="border-top-0">
<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="border-top-0">
<uni-forms-item label="选择规格" required name="categoryId">
<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>
</uni-forms-item>
</view>
<view class="u-p-b-20">
<view class="u-m-t-12" v-for="(item,index) in FormData.selectSpec" :key="index">
</view> -->
<view class=" u-m-t-32">
<view class="u-m-t-16" v-for="(item,index) in FormData.selectSpec" :key="index">
<view class="font-bold">
{{item.name}}
</view>
<view class="u-m-t-24">
<uni-data-checkbox @change="createResult" multiple :selectedColor="color.ColorMain"
v-model="item.selectSpecResult" :localdata="item.value"></uni-data-checkbox>
<view class="u-m-t-16">
<up-checkbox-group :labelSize="12" :size="14" :activeColor="color.ColorMain"
shape="circle" v-model="item.selectSpecResult" placement="row"
@change="createResult">
<up-checkbox :customStyle="{marginRight: '60rpx',marginBottom:'16rpx'}"
v-for="(item, index) in item.value" :key="index" :label="item.text"
:name="item.value">
</up-checkbox>
</up-checkbox-group>
<!-- <uni-data-checkbox @change="createResult" multiple :selectedColor="color.ColorMain"
v-model="item.selectSpecResult" :localdata="item.value">
</uni-data-checkbox> -->
</view>
@@ -34,16 +53,17 @@
</uni-forms>
<view>
<view class="block u-m-b-32" v-for="(item,index) in FormData.result" :key="index">
<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" v-for="(val,key) in item.names" :key="key">
<text class="font-bold u-m-r-12">
<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}}
</text>
<text class="color-999">{{val}}</text>
</view>
<view class="u-m-t-16 color-666 u-font-24">{{val}}</view>
</view>
</view>
<view class="u-m-t-24">
@@ -51,13 +71,14 @@
<view class="font-bold">
图片
</view>
<view class="u-m-t-24">
<view class="u-m-t-16">
<my-upload-file @change="changeResultCover($event,index)" :limit="1"
:ref="setRefFile(index)" :images="item.coverImg"></my-upload-file>
:imageStyles="imageStyles" :ref="setRefFile(index)"
:images="item.coverImg"></my-upload-file>
</view>
</view>
</view>
<view class="skus u-m-t-32">
<view class="skus u-m-t-24">
<view class="">
<uni-forms-item label="售价" required name="salePrice">
<uni-easyinput @blur="priceFormat(item.skus,'salePrice')"
@@ -109,9 +130,12 @@
placeholder="请输入分销金额" />
</uni-forms-item>
<uni-forms-item label="商品条码" required>
<uni-easyinput disabled :paddingNone="inputPaddingNone"
:placeholderStyle="placeholderStyle" :inputBorder="inputBorder"
v-model="item.skus.barCode" placeholder="请输入商品条码" />
<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>
@@ -120,8 +144,17 @@
</view>
</view>
<view class="save-btn-box">
<button class="save-btn" hover-class="btn-hover-class" @click="save">保存</button>
</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">
@@ -130,15 +163,17 @@
</view>
</button>
</view>
</view>
</view>
<view class="bottom" ref="bottom"></view>
<pop-fast-edit @update="updateSkuKey" v-model:show="fastEdit.show"></pop-fast-edit>
</view>
</template>
<script setup>
import {
getSafeBottomHeight
} from '@/commons/utils/safe-bottom.js'
import {
formatPrice
} from "@/commons/utils/format.js";
@@ -169,7 +204,22 @@
import {
hasPermission
} from '@/commons/utils/hasPermission.js';
let bottomHeight = ref(100)
onReady(() => {
getSafeBottomHeight('safe-bottom').then(res => {
console.log(res);
bottomHeight.value = res
})
})
const refFiles = ref([]);
const imageStyles = reactive({
width: 82,
height: 82,
border: {
radius: '4px'
}
})
//绑定文件上传元素
function setRefFile(index) {
refFiles.value[index] = null;
@@ -334,6 +384,7 @@
let arr = []
for (let k of FormData.selectSpec) {
if (k.selectSpecResult.length) {
console.log(k);
arr.push({
value: k.selectSpecResult,
name: k.name
@@ -341,7 +392,7 @@
}
}
const spes = combineSpecs(arr)
FormData.result = spes.filter(v => {
const result = spes.filter(v => {
return !Array.isArray(v)
}).map(v => {
const specSnap = returnSpecSnap(v)
@@ -354,7 +405,7 @@
}
return data || newdata
})
console.log(FormData.result);
FormData.result = result
}
@@ -363,7 +414,7 @@
console.log(e);
const item = FormData.specList.find(v => v.id === FormData.specId)
FormData.selectSpec = (item.specList || [])
}
//获取规格数据
function getTbProductSpec() {
@@ -526,8 +577,8 @@
})
}).catch(err => {
console.log(err);
if(err.length>=1){
infoBox.showToast(err[0].errorMessage)
if (err.length >= 1) {
infoBox.showToast(err[0].errorMessage)
}
resolve({
sucees: false
@@ -550,7 +601,7 @@
//判断验证是否通过
console.log('pass');
const item = FormData.specList.find(v => v.id === FormData.specId)
FormData.specsInfoName = item?item.name:''
FormData.specsInfoName = item ? item.name : ''
console.log(FormData);
emitspecificationsSave()
@@ -570,14 +621,32 @@
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;
padding-bottom: 200rpx;
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 {
@@ -628,6 +697,10 @@
}
}
::v-deep .uni-easyinput__content-input {
height: inherit;
}
.icon-reduce {
background-color: $my-red-color;