修改商品编辑部分代码

This commit is contained in:
2024-09-14 18:26:11 +08:00
parent 3b8bdc3ade
commit a3b72d5ad6
6 changed files with 296 additions and 192 deletions

View File

@@ -1,70 +1,63 @@
<template>
<view class="safe-page">
<view class="bg-fff u-p-l-30 u-p-t-16 u-p-r-30 u-p-b-30">
<view class="myTabs ">
<up-sticky>
<view class="bg-fff u-p-l-30 u-p-r-30 u-p-b-30">
<!-- <view class="myTabs ">
<myTabs :list="tabsList" @change="tabsChange"></myTabs>
</view>
<view class="input-wrapper">
<view class="input-main">
<uni-easyinput
clearable
class='jeepay-search' :inputBorder="false" :placeholder="pageData.search.placeholder"
v-model="pageData.query.name" @confirm="searchFunc">
<template #prefixIcon>
<image src="@/static/iconImg/icon-search.svg" class="input-icon" />
</template>
</uni-easyinput>
<button type="text" @click="searchFunc()">搜索</button>
</view>
</view>
<view class="u-flex u-m-t-20 u-p-l-30 u-p-r-30 u-font-28 u-p-b-20 border-bottom">
<view class="u-flex-1 tranistion u-text-center color-333"
:class="{'color-main':pageData.stateCurrent==index}" @tap="statesTableClick(index)"
v-for="(item,index) in statesTabsList" :key="index">
{{item}}
</view>
</view>
<view class="u-flex states1 u-row-between u-font-28">
<view class="u-flex">
<view class="u-p-l-16 item u-p-r-16 u-p-t-6 u-p-b-6 tranistion u-text-center color-333"
:class="{'active':pageData.stateCurrent1==index}" @tap="states1TableClick(index)"
v-for="(item,index) in states1TabsList" :key="index">
{{item}}
</view> -->
<view class="input-wrapper">
<view class="input-main">
<view class="u-flex u-p-r-30 u-font-28" @click="onCategoryShowChange(true)">
<text class="u-m-r-10 u-line-1" style="max-width: 100rpx;">{{pageData.categoryName||'分类' }}</text>
<up-icon name="arrow-down" size="16"></up-icon>
</view>
<uni-easyinput clearable class='jeepay-search' :inputBorder="false"
:placeholder="pageData.search.placeholder" v-model="pageData.query.name"
@confirm="searchFunc">
<template #prefixIcon>
<image src="@/static/iconImg/icon-search.svg" class="input-icon" />
</template>
</uni-easyinput>
<button type="text" @click="searchFunc()">搜索</button>
</view>
</view>
<view class="u-flex u-col-center" @click="go.to('PAGES_PRODUCT_SPECIF_TEMPLATE')">
<image src="/pageProduct/static/images/icon-guige.svg" class="icon-guige" />
<text class="color-666 u-m-l-12 u-font-24">规格模版</text>
<view class="u-flex states1 u-row-between u-font-28">
<view class="u-flex">
<view class="u-p-l-16 item u-p-r-16 u-p-t-6 u-p-b-6 tranistion u-text-center color-333"
:class="{'active':pageData.stateCurrent==index}" @tap="statesTableClick(index)"
v-for="(item,index) in statesTabsList" :key="index">
{{item}}
</view>
</view>
<view class="u-flex u-col-center" @click="go.to('PAGES_PRODUCT_SPECIF_TEMPLATE')">
<image src="/pageProduct/static/images/icon-guige.svg" class="icon-guige" />
<text class="color-666 u-m-l-12 u-font-24">规格模版</text>
</view>
</view>
</view>
</view>
<view class="goods-list u-p-30" >
</up-sticky>
<view class="goods-list u-p-30">
<template v-if="pageData.goodsList.length">
<view class="u-m-b-32" v-for="(item,index) in pageData.goodsList" :key="index">
<my-goods @changeClick="goodsChangeClick" @radioClick="goodsRadioClick" :index="index" :data="item"
@del="goodsDel"
:showChecked="showChecked" :showDetail="pageData.showGoodsDetail"></my-goods>
@del="goodsDel" :showChecked="showChecked" :showDetail="pageData.showGoodsDetail"></my-goods>
</view>
</template>
<template v-if="pageData.hasAjax&&!pageData.goodsList.length">
<my-img-empty tips="未找到相关商品"></my-img-empty>
</template>
<my-pagination :totalElements="pageData.totalElements" :size="pageData.query.size" @change="pageChange"></my-pagination>
<my-pagination :totalElements="pageData.totalElements" :size="pageData.query.size"
@change="pageChange"></my-pagination>
<view style="height: 100rpx;"></view>
</view>
<my-control ref="control"
:categoryShow="pageData.categoryShow"
:categoryName="pageData.categoryName"
@categoryChange="categoryIdChange"
@offShelf="offShelf" @allCheckedChange="allCheckedChange"
<my-control ref="control" :categoryShow="pageData.categoryShow" :categoryName="pageData.categoryName"
@categoryChange="categoryIdChange" @offShelf="offShelf" @allCheckedChange="allCheckedChange"
@controlChange="controlChange" @toggleCategory="toggleCategory"
:bottom="pageData.componentBottom"></my-control>
<my-category ref="category"
@change="onCategoryShowChange" @cateClick="cateClick" :bottom="pageData.componentBottom+100"></my-category>
<!-- <my-category ref="category" @change="onCategoryShowChange" @cateClick="cateClick"
:bottom="pageData.componentBottom+100"></my-category> -->
<!-- 下架弹窗 -->
<my-model :desc="pageData.modelDesc" ref="model" @confirm="modelConfirm"></my-model>
<!-- 商品库存修改弹窗 -->
@@ -80,7 +73,7 @@
<view class="u-flex u-m-t-32">
<view class="">库存开关:</view>
<view class="u-m-l-46 ">
<my-switch v-model="goodsStockData.isStock"></my-switch>
<my-switch v-model="goodsStockData.isStock"></my-switch>
</view>
</view>
<!-- <view class="u-flex u-m-t-32">
@@ -101,7 +94,7 @@
<my-switch v-model="goodsStockData.isGrounding"></my-switch>
</view>
</view> -->
<!-- <view class="u-m-t-24 u-m-t-32" v-if="goodsStockData.isStock">
<view class="">数量:</view>
<view class="u-m-t-24">
@@ -118,6 +111,9 @@
</view>
</template>
</my-model>
<!-- 分类 -->
<my-category v-model:isShow="pageData.categoryShow" @confirm="setCategory"></my-category>
</view>
</template>
@@ -136,24 +132,21 @@
watch
} from 'vue';
import go from '@/commons/utils/go.js';
import myTabs from '@/pageProduct/components/my-tabs.vue'
import myGoods from './components/goods.vue'
import myControl from './components/control.vue'
import myCategory from './components/category.vue'
import infoBox from "@/commons/utils/infoBox.js"
import myPagination from '@/components/my-components/my-pagination'
import myModel from "@/components/my-components/my-model.vue"
import myButton from "@/components/my-components/my-button.vue"
import mySwitch from "@/components/my-components/my-switch.vue"
import {
$tbProduct,
$upProSort,
$updateProduct,$getProductDetail,$delProduct,$updateProductStatus
$updateProduct,
$getProductDetail,
$delProduct,
$updateProductStatus
} from "@/http/yskApi/goods.js"
const pageData = reactive({
modelDesc: '是否下架',
stateCurrent: 0,
stateCurrent1: 0,
componentBottom: 45,
search: {
value: '',
@@ -167,25 +160,29 @@
query: {
page: 0,
size: 10,
categoryId:'',
name:''
categoryId: '',
name: ''
},
category:'',
categoryShow:false,
categoryName:'',
hasAjax:false
category: '',
categoryShow: false,
categoryName: '',
hasAjax: false
})
function onCategoryShowChange(show){
console.log(show);
pageData.categoryShow=show
}
function categoryIdChange(categoryId){
pageData.query.categoryId=categoryId
watch(()=>pageData.query.categoryId,(newval)=>{
getGoodsList()
})
function onCategoryShowChange(show) {
console.log(show);
pageData.categoryShow = show
}
function setCategory(category){
pageData.query.categoryId = category.id
pageData.categoryName = category.name
}
function getGoodsList() {
$tbProduct(pageData.query).then(res => {
pageData.hasAjax=true
pageData.hasAjax = true
console.log(res);
pageData.goodsList = res.content.map(v => {
return {
@@ -203,8 +200,7 @@
})
const tabsList = ['简洁', '详情']
const statesTabsList = ['在售中', '已下架']
const states1TabsList = ['全部', '已售罄']
const statesTabsList = ['全部', '已售罄','在售中', '已下架']
const control = ref(null)
const model = ref(null)
const goodsStockModel = ref(null)
@@ -213,9 +209,9 @@
return reactive({
sort: 0,
isStock: false,
isDistribute:false,
isPauseSale:false,
isGrounding:false,
isDistribute: false,
isPauseSale: false,
isGrounding: false,
stockNumber: 0,
})
}
@@ -234,15 +230,15 @@
async function goodsStockModelSave() {
const item = pageData.goodsList[pageData.selGoodsIndex]
const goods =await $getProductDetail(item.id,false)
const goods = await $getProductDetail(item.id, false)
$updateProduct({
...goods,
sort:goodsStockData.sort,
isStock:goodsStockData.isStock
}).then(res=>{
item.sort=goodsStockData.sort
item.isStock=goodsStockData.isStock
item.stockNumber=goodsStockData.stockNumber
sort: goodsStockData.sort,
isStock: goodsStockData.isStock
}).then(res => {
item.sort = goodsStockData.sort
item.isStock = goodsStockData.isStock
item.stockNumber = goodsStockData.stockNumber
goodsStockModelCancel()
})
}
@@ -253,38 +249,34 @@
function goodsChangeClick(index) {
pageData.selGoodsIndex = index
const goods = pageData.goodsList[index]
Object.assign(goodsStockData,goods)
Object.assign(goodsStockData, goods)
goodsStockModel.value.open()
}
//删除商品
function goodsDel(index){
function goodsDel(index) {
const goods = pageData.goodsList[index]
uni.showModal({
title: '提示',
content: '确认删除该商品',
success: function (res) {
success: function(res) {
if (res.confirm) {
$delProduct([goods.id]).then(res=>{
$delProduct([goods.id]).then(res => {
uni.showToast({
title:'删除成功',
icon:'none'
title: '删除成功',
icon: 'none'
})
pageData.goodsList.splice(index,1)
pageData.goodsList.splice(index, 1)
})
} else if (res.cancel) {
}
} else if (res.cancel) {}
}
});
}
function statesTableClick(index) {
pageData.stateCurrent = index
}
function states1TableClick(index) {
pageData.stateCurrent1 = index
}
let test = ref(false)
function tabsChange(i) {
@@ -292,7 +284,7 @@
pageData.showGoodsDetail = i ? true : false
}
//改变商品的选中状态
function changeGoodsChecked(checked, index) {
if (index !== undefined) {
@@ -379,9 +371,9 @@
function cateClick(cate) {
console.log(cate);
pageData.query.categoryId=cate.id
pageData.categoryName=cate.name
pageData.category=cate
pageData.query.categoryId = cate.id
pageData.categoryName = cate.name
pageData.category = cate
getGoodsList()
}
</script>
@@ -491,7 +483,7 @@
.item {
font-size: 24rpx;
color: #666;
margin-right: 70rpx;
margin-right: 30rpx;
background: #F4F4F4;
border-radius: 8rpx 8rpx 8rpx 8rpx;
}