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-09-14 18:26:11 +08:00
parent 3b8bdc3ade
commit a3b72d5ad6
6 changed files with 296 additions and 192 deletions
Download Patch File Download Diff File Expand all files Collapse all files

120
pageProduct/index/components/category - 副本 (2).vue Normal file
View File

@@ -0,0 +1,120 @@
<template>
<view>
<view class="category " :style="getCompouteStyle()">
<scroll-view scroll-y="true" :style="{height:props.height+'rpx'}">
<view class="list">
<view v-if="showAllText" class="font-bold item border-bottom u-font-28" @tap="cateClick({id:'',name:'全部分类'})">全部分类</view>
<view v-for="(item,index) in category.list" :key="index">
<view class="item font-bold border-bottom" @tap="cateClick(item)">
{{item.name}}
</view>
<view class="item border-bottom" @tap="cateClick(child)"
v-for="(child,childIndex) in item.childrenList"
:key="childIndex" >
<text>&nbsp;&nbsp;</text>
{{child.name}}
</view>
</view>
</view>
</scroll-view>
</view>
</view>
</template>
<script setup>
import {
ref, warn, watch, watchEffect,
onMounted,reactive
} from 'vue';
import {$tbShopCategory} from '@/http/yskApi/goods.js'
const emite=defineEmits(['cateClick','change'])
const props = defineProps({
showAllText:{
type:Boolean,
default:true
},
width: {
type: [Number, String],
default: 264
},
height: {
type: [Number, String],
default: 420
},
right: {
type: [Number, String],
default: 30
},
bottom: {
type: [Number, String],
default: 0
}
})
let show = ref(false)
watch(()=>show.value,(newval)=>{
emite('change',newval)
})
function open() {
show.value = true
}
function close() {
show.value = false
}
function toggle() {
show.value = !show.value
}
function cateClick(item){
emite('cateClick',item)
close()
}
function getCompouteStyle() {
return {
width: props.width + 'rpx',
height: props.height + 'rpx',
right: props.right + 'rpx',
bottom: props.bottom + 'rpx',
transform:`scaleY(${show.value?1:0})`
}
}
const category=reactive({
list:[],
categoryId:'',
categoryName:'',
})
onMounted(()=>{
$tbShopCategory({
page:0,size:200
}).then(res=>{
category.list=res.content
})
})
defineExpose({
open,
close,toggle
})
</script>
<style lang="scss" scoped>
.category {
background: #FFFFFF;
box-shadow: 0rpx 6rpx 12rpx 2rpx rgba(0, 0, 0, 0.16);
border-radius: 14rpx 14rpx 14rpx 14rpx;
position: fixed;
font-size: 24rpx;
color: #333;
.list{
box-sizing: border-box;
.item{
padding: 24rpx 24rpx 24rpx 48rpx;
}
}
}
</style>

88
pageProduct/index/components/category.vue
View File

@@ -1,25 +1,5 @@
<template>
<view>
<view class="category " :style="getCompouteStyle()">
<scroll-view scroll-y="true" :style="{height:props.height+'rpx'}">
<view class="list">
<view v-if="showAllText" class="font-bold item border-bottom u-font-28" @tap="cateClick({id:'',name:'全部分类'})">全部分类</view>
<view v-for="(item,index) in category.list" :key="index">
<view class="item font-bold border-bottom" @tap="cateClick(item)">
{{item.name}}
</view>
<view class="item border-bottom" @tap="cateClick(child)"
v-for="(child,childIndex) in item.childrenList"
:key="childIndex" >
<text>&nbsp;&nbsp;</text>
{{child.name}}
</view>
</view>
</view>
</scroll-view>
</view>
</view>
<up-picker :show="show" keyName="name" @confirm="confirm" :columns="category.list" @close="close" @cancel="close" :closeOnClickOverlay="true"></up-picker>
</template>
<script setup>
@@ -28,7 +8,7 @@
onMounted,reactive
} from 'vue';
import {$tbShopCategory} from '@/http/yskApi/goods.js'
const emite=defineEmits(['cateClick','change'])
const emite=defineEmits(['change','update:isShow','confirm'])
const props = defineProps({
showAllText:{
type:Boolean,
@@ -49,57 +29,63 @@
bottom: {
type: [Number, String],
default: 0
},
isShow:{
type:Boolean,
default:false
}
})
let show = ref(false)
let show = ref(props.isShow)
watch(()=>show.value,(newval)=>{
emite('change',newval)
emite('update:isShow',newval)
})
watch(()=>props.isShow,(newval)=>{
console.log(newval);
show.value=newval
})
function open() {
show.value = true
function confirm(e){
console.log(e.value[0]);
show.value = false
emite('confirm',e.value[0])
}
function close() {
console.log('close');
show.value = false
}
function toggle() {
show.value = !show.value
}
function cateClick(item){
emite('cateClick',item)
close()
}
function getCompouteStyle() {
return {
width: props.width + 'rpx',
height: props.height + 'rpx',
right: props.right + 'rpx',
bottom: props.bottom + 'rpx',
transform:`scaleY(${show.value?1:0})`
}
}
const category=reactive({
list:[],
categoryId:'',
categoryName:'',
})
onMounted(()=>{
$tbShopCategory({
page:0,size:200
}).then(res=>{
category.list=res.content
res.content.unshift({
name:'全部',
id:'',
childrenList:[]
})
category.list=[res.content.reduce((prve, cur) => {
prve.push(...[{
...cur,
name: '' + cur.name,
childrenList:undefined
}, ...cur.childrenList.map(v => {
return {
...v,
name: '' + v.name
}
})])
return prve
}, [])]
console.log(category.list);
})
})
defineExpose({
open,
close,toggle
})
</script>
<style lang="scss" scoped>

4
pageProduct/index/components/control.vue
View File

@@ -3,12 +3,12 @@
<view class="u-flex control1" v-if="showControl1">
<view class="btn" @click="changeShowControl1">批量管理</view>
<view class="btn" @tap="go.to('PAGES_PRODUCT_ADD')">商品添加</view>
<view class="color-999 btn u-flex u-row-center" @click="emitToggleCategory">
<!-- <view class="color-999 btn u-flex u-row-center" @click="emitToggleCategory">
<text class="u-m-r-10">{{categoryName||'选择分类'}}</text>
<view class="arrow-down" :class="{'up':categoryShow}">
<uni-icons type="right" size="16" color="#999"></uni-icons>
</view>
</view>
</view> -->
</view>
<view class="u-flex control2 u-row-between" v-else>
<view class="u-flex btn">

84
pageProduct/index/components/goods.vue
View File

@@ -7,9 +7,9 @@
<text class="u-m-l-20">{{data.sort}}</text>
</view>
<view class="color-333 u-m-l-42 u-flex">
<text class="stock">库存</text>
<up-icon name="edit-pen" :size="16" :color="ColorMain"></up-icon>
<text class="stock">库存:</text>
<text class="font-bold u-m-l-10">{{data.stockNumber}}</text>
<uni-icons type="right" size="16" color="#000"></uni-icons>
</view>
</view>
<text class="u-font-28 color-666" @click="changeClick">修改</text>
@@ -24,16 +24,20 @@
</label>
</view>
<image :src="data.coverImg" lazy-load class="img"></image>
<view class="h-100 u-p-l-16 u-flex u-flex-col u-row-between">
<view class="color-333"> <text class="u-m-r-24">{{data.name}}</text><uni-tag size="small" type="primary"
custom-style="background-color: #318AFE;" :text="data.typeEnum"></uni-tag></view>
<view class="h-100 u-p-l-16 u-flex-1 u-flex u-flex-col u-row-between">
<view class="color-333 w-full u-flex u-row-between">
<view class="u-flex">
<text class="u-m-r-24">{{data.name}}</text><uni-tag size="small" type="primary"
custom-style="background-color: #318AFE;" :text="data.typeEnum"></uni-tag>
</view>
<view class="price">¥{{data.lowPrice}}</view>
</view>
<view class="price">¥{{data.lowPrice}}</view>
</view>
</view>
<view class="u-m-t-16 skus u-text-center" v-if="showDetail&&data.skuList.length>=2">
<view class="u-flex u-row-between font-bold">
<view class="u-m-t-16 skus u-text-center" v-if="data.skuList.length>=2">
<!-- <view class="u-flex u-row-between font-bold">
<view class="u-flex-1">商品信息</view>
<view class="u-flex-1">售价</view>
<view class="u-flex-1">库存</view>
@@ -44,30 +48,28 @@
<view class="price u-flex-1">¥{{data.lowPrice||0}}</view>
<view class=" u-flex-1">{{item.stockNumber||0}} {{data.unitName||''}}</view>
</view>
</view>
<!-- <view class="u-flex">
<view class="sku">做法</view>
<view class="u-flex u-flex-wrap u-flex-1 skds">
<view class="skd">汤
<view class="tag-primary tag">上架中</view>
</view>
<view class="skd">干
<view class="tag-primary tag">上架中</view>
</view>
</view>
</view> -->
<view class="u-flex u-flex-wrap skds">
<view class="skd" v-for="(item,index) in data.skuList" :key="index"><text>{{item.specSnap}}</text>
<view class="tag-primary tag">上架中</view>
</view>
</view>
</view>
<view class="u-m-t-24 u-flex u-row-between">
<view class="u-flex">
<view class="u-m-r-18 color-999">设置热门</view>
<my-switch v-model="data.isHot" @change="isHotChange"></my-switch>
<!-- <view class="u-m-r-18 color-999">售罄</view>
<my-switch v-model="isSellNone" @change="isSellNoneChange"></my-switch> -->
<view class="u-flex">
<view class="u-m-r-18 color-999">售罄</view>
<my-switch v-model="data.isSellNoneChange" @change="isHotChange"></my-switch>
</view>
<view class="u-flex u-m-l-30">
<view class="u-m-r-18 color-999">下架产品</view>
<my-switch v-model="data.isSellNoneChange" @change="isHotChange"></my-switch>
</view>
</view>
<view class="u-flex">
<!-- <view class="btn-default btn" @tap="xiajia">下架商品</view> -->
<view class="btn-default btn" @tap="del">删除</view>
<!-- <view class="btn-default btn" @tap="del">删除</view> -->
<view class="btn-primary btn u-m-l-38" @click="toEdit">编辑</view>
</view>
</view>
@@ -83,13 +85,15 @@
ref,
watchEffect
} from 'vue';
import {$goodsIsHot} from '@/http/yskApi/goods.js'
import {
$goodsIsHot
} from '@/http/yskApi/goods.js'
import mySwitch from '@/components/my-components/my-switch.vue'
import go from '@/commons/utils/go.js';
import {
ColorMain
} from '@/commons/color.js'
const emits = defineEmits(['radioClick', 'changeClick', 'xiajia','del'])
const emits = defineEmits(['radioClick', 'changeClick', 'xiajia', 'del'])
const props = defineProps({
index: {
type: Number
@@ -110,19 +114,19 @@
}
})
function isHotChange(e){
function isHotChange(e) {
$goodsIsHot({
id:props.data.id,
isHot:props.data.isHot
}).then(res=>{
id: props.data.id,
isHot: props.data.isHot
}).then(res => {
uni.showToast({
title:'修改成功',
icon:'none'
title: '修改成功',
icon: 'none'
})
})
}
let isSellNone = ref(false)
isSellNone.value = props.isSellNone
@@ -132,8 +136,8 @@
}
let checked = ref(false)
function radioClick() {
console.log(props.index);
emits('radioClick', props.index)
@@ -146,7 +150,8 @@
function xiajia() {
emits('xiajia', props.index)
}
function del(){
function del() {
emits('del', props.index)
}
@@ -223,7 +228,7 @@
.skus {
background: #F9F9F9;
border-radius: 14rpx 14rpx 14rpx 14rpx;
padding: 28rpx 42rpx;
padding: 20rpx;
.sku {
color: #000;
@@ -236,12 +241,13 @@
}
.skd {
padding: 14rpx 40rpx;
padding: 14rpx 40rpx 14rpx 20rpx;
background: #F0F2F5;
border-radius: 4rpx;
position: relative;
color: #666;
overflow: hidden;
margin-bottom: 10rpx;
.tag {
position: absolute;