feat:共富商品管理调整表单字段
This commit is contained in:
1 parent
8dee965b9c
commit
078e1a4717
4 files changed
+63
-31
No files matched your search
@@ -7,13 +7,24 @@
|
||||
<tm-form-item name="title" label="商品标题">
|
||||
<tm-input v-model="form.title" type="text" :showClear="true" placeholder="请输入商品标题"></tm-input>
|
||||
</tm-form-item>
|
||||
<tm-form-item name="unit" label="计量单位">
|
||||
<tm-input v-model="form.unit" type="text" :showClear="true" placeholder="请输入计量单位"></tm-input>
|
||||
</tm-form-item>
|
||||
<tm-form-item name="categoryId" label="分类" @click="selectCategary">
|
||||
<tm-input v-model="form.categoryName" placeholder="请选择商品分类" style="pointer-events: none" disabled />
|
||||
<!-- color="transparent" -->
|
||||
</tm-form-item>
|
||||
<tm-form-item name="productNature" label="商品性质">
|
||||
<tm-picker
|
||||
rang-key="title"
|
||||
rang-text="title"
|
||||
v-model="form.productNature"
|
||||
v-model:model-str="form.productNatureName"
|
||||
:list="[
|
||||
{ title: '普通商品', id: '1' },
|
||||
{ title: '电子称重商品', id: '2' },
|
||||
]"
|
||||
>
|
||||
<tm-input v-model="form.productNature" placeholder="请选择商品性质" style="pointer-events: none" disabled />
|
||||
</tm-picker>
|
||||
</tm-form-item>
|
||||
<tm-form-item name="status" label="状态">
|
||||
<tm-radio-group v-model="form.status" align="flex-end">
|
||||
<tm-radio :value="index.toString()" :label="item" v-for="(item, index) in ['上架', '下架']" :key="index"></tm-radio>
|
||||
@@ -61,7 +72,7 @@
|
||||
</tm-input>
|
||||
</tm-picker-date>
|
||||
</tm-form-item>
|
||||
<tm-form-item name="coverImage" label="商品图">
|
||||
<tm-form-item name="coverImage" label="商品主图">
|
||||
<tm-upload-photo
|
||||
v-model="form.coverImage"
|
||||
:maxFileSize="1024 * 1024 * 5"
|
||||
@@ -73,6 +84,17 @@
|
||||
/>
|
||||
</tm-form-item>
|
||||
<view class="sub-text-20 c-red! mb-2">注:图片大小不超过5M</view>
|
||||
<!-- <tm-form-item name="carouselImages" label="轮播图">
|
||||
<tm-upload-photo
|
||||
v-model="form.carouselImages"
|
||||
:maxFileSize="1024 * 1024 * 5"
|
||||
:url="'/api/admin/sys-file/upload'"
|
||||
:header="hooks.useDefaultHeader()"
|
||||
:column="2"
|
||||
img-height="200"
|
||||
:max-count="5"
|
||||
/>
|
||||
</tm-form-item> -->
|
||||
<tm-form-item name="description" label="详情描述" direction="vertical" required="">
|
||||
<!-- <rich-text-input v-model="form.description" placeholder="点击编辑详情描述..." label="详情描述" /> -->
|
||||
<tm-input v-model="form.description" type="textarea" :showClear="false" placeholder="请输入详情描述"></tm-input>
|
||||
@@ -84,10 +106,10 @@
|
||||
:label="item.label"
|
||||
v-for="(item, index) in [
|
||||
{ label: '多SKU模式', value: '1' },
|
||||
{ label: '单价SPU模式', value: '2' },
|
||||
// { label: '单价SPU模式', value: '2' },
|
||||
]"
|
||||
:key="index"
|
||||
></tm-radio>
|
||||
/>
|
||||
</tm-radio-group>
|
||||
</tm-form-item>
|
||||
<view v-if="form.priceType == '2'">
|
||||
@@ -110,7 +132,9 @@
|
||||
<view v-if="index !== 0" class="my-4 h-3rpx bg-#A0A0A044"></view>
|
||||
<view class="flex justify-between items-center mb-2">
|
||||
<text>编号:{{ index + 1 }}</text>
|
||||
<tm-button v-if="index !== 0" class="px-2" size="xs" skin="thin" @click.stop="delSkuListItem(index)">删 除</tm-button>
|
||||
<tm-button v-if="index !== 0" class="px-2" size="s" color="error" skin="thin" @click.stop="delSkuListItem(index)">
|
||||
删 除
|
||||
</tm-button>
|
||||
</view>
|
||||
<tm-form-item name="skuList[index].skuCode" label="SKU编码">
|
||||
<tm-input v-model="item.skuCode" placeholder="请输入SKU编码"></tm-input>
|
||||
@@ -131,33 +155,30 @@
|
||||
<tm-stepper :max="10000" width="300" v-model="item.stock"></tm-stepper>
|
||||
</view>
|
||||
</tm-form-item>
|
||||
<tm-form-item name="skuList[index].weightG" label="重量(克)">
|
||||
<!-- <tm-form-item name="skuList[index].weightG" label="重量(克)">
|
||||
<view class="flex justify-end">
|
||||
<tm-stepper :max="10000" width="300" v-model="item.weightG"></tm-stepper>
|
||||
</view>
|
||||
</tm-form-item>
|
||||
</tm-form-item> -->
|
||||
<tm-form-item name="skuList[index].status" label="状态">
|
||||
<tm-radio-group v-model="item.status" align="flex-end">
|
||||
<tm-radio :value="index.toString()" :label="item" v-for="(item, index) in ['启用', '禁用']" :key="index"></tm-radio>
|
||||
</tm-radio-group>
|
||||
</tm-form-item>
|
||||
</view>
|
||||
<tm-button block size="s" skin="dashed" color="#E5F1FF" @click.stop="addSkuListItem()">添 加</tm-button>
|
||||
<tm-button block size="m" color="#E5F1FF" @click.stop="addSkuListItem()">添 加</tm-button>
|
||||
</view>
|
||||
|
||||
<tm-button form-type="submit" block>提 交</tm-button>
|
||||
</tm-form>
|
||||
|
||||
<tm-drawer
|
||||
title="请选择分类"
|
||||
:showClose="true"
|
||||
:showFooter="false"
|
||||
size="70%"
|
||||
v-model:show="showCategaryPicker"
|
||||
:duration="100"
|
||||
zIndex="100"
|
||||
>
|
||||
<shop-categary-picker :categoryTree="categoryTree" @confirm="onCategaryConfirm" @cancel="showCategaryPicker = false" />
|
||||
<tm-drawer title="请选择分类" :showClose="true" :showFooter="false" size="70%" v-model:show="showCategaryPicker">
|
||||
<shop-categary-picker
|
||||
v-model="form.categoryId"
|
||||
:categoryTree="categoryTree"
|
||||
@confirm="onCategaryConfirm"
|
||||
@cancel="showCategaryPicker = false"
|
||||
/>
|
||||
</tm-drawer>
|
||||
|
||||
<view class="h-30rpx" />
|
||||
@@ -165,7 +186,7 @@
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import { reactive, ref } from "vue"
|
||||
import { reactive, ref, watch } from "vue"
|
||||
import { hooks } from "@@/index"
|
||||
import { prosperityShopApi } from "@/sheep/api"
|
||||
import ShopCategaryPicker from "@/sheep/components/shop-categary-picker.vue"
|
||||
@@ -176,15 +197,16 @@ import { displayPrice, storePrice } from "@/sheep/utils/formatMoney"
|
||||
const form = reactive<any>({
|
||||
id: "",
|
||||
title: "",
|
||||
unit: "",
|
||||
categoryId: "",
|
||||
categoryName: "",
|
||||
productNature: "",
|
||||
status: "0",
|
||||
saleStartTime: "",
|
||||
saleEndTime: "",
|
||||
coverImage: [],
|
||||
// carouselImages: [],
|
||||
description: "",
|
||||
priceType: "1", // 定价方式(1:多SKU,2:单价SPU)
|
||||
priceType: 1, // 定价方式(1:多SKU,2:单价SPU)
|
||||
spuPrice: 0,
|
||||
originalPrice: 0,
|
||||
skuList: [
|
||||
@@ -209,12 +231,13 @@ const categoryList = ref<any>([])
|
||||
|
||||
const rules: Record<string, TM.FORM_RULE[]> = {
|
||||
title: [{ required: true, message: "请输入商品标题" }],
|
||||
unit: [{ required: true, message: "请输入商品单位" }],
|
||||
categoryId: [{ required: true, message: "请选择商品分类" }],
|
||||
productNature: [{ required: true, message: "请选择商品性质" }],
|
||||
status: [{ required: true, message: "请选择状态" }],
|
||||
saleStartTime: [{ required: true, message: "请选择售卖开始时间" }],
|
||||
saleEndTime: [{ required: true, message: "请选择售卖结束时间" }],
|
||||
coverImage: [{ required: true, message: "请上传商品图" }],
|
||||
coverImage: [{ required: true, message: "请上传商品主图" }],
|
||||
// carouselImages: [{ required: true, message: "请上传轮播图" }],
|
||||
}
|
||||
|
||||
onLoad(async (options: any) => {
|
||||
@@ -230,6 +253,10 @@ const getGoodsDetail = async (id: string) => {
|
||||
if (code != 0 || !data) return uni.showToast({ title: msg || "商品详情获取失败", icon: "none" })
|
||||
const skuList = data.skuList.map((item: any) => ({ ...item, status: item.status.toString(), price: displayPrice(item.price, "") }))
|
||||
const coverImage = [{ path: filePath(data.coverImage), response: JSON.stringify({ data: { url: data.coverImage } }) }]
|
||||
// const carouselImages = data.carouselImages?.split(",").map((url: string) => ({
|
||||
// path: filePath(url),
|
||||
// response: JSON.stringify({ data: { url } }),
|
||||
// }))
|
||||
const categoryName = categoryList.value.find((item: any) => item.id == data.categoryId)?.name
|
||||
const saleStartTime = data.saleStartTime
|
||||
const saleEndTime = data.saleEndTime
|
||||
@@ -243,6 +270,7 @@ const getGoodsDetail = async (id: string) => {
|
||||
spuPrice: displayPrice(data.spuPrice, ""),
|
||||
originalPrice: displayPrice(data.originalPrice, ""),
|
||||
coverImage,
|
||||
// carouselImages,
|
||||
categoryName,
|
||||
saleStartTime,
|
||||
saleEndTime,
|
||||
@@ -295,16 +323,18 @@ const addSkuListItem = () => {
|
||||
// 保存
|
||||
const onsubmit = async (evt: TM.FORM_SUBMIT_RESULT) => {
|
||||
// console.log("校验结果:", evt)
|
||||
console.log(form.carouselImages)
|
||||
|
||||
const submitData = {
|
||||
...form,
|
||||
coverImage: JSON.parse(form.coverImage[0].response).data.url,
|
||||
// carouselImages: form.carouselImages.map((item: any) => JSON.parse(item.response).data.url).join(","),
|
||||
}
|
||||
console.log("提交的数据:", submitData)
|
||||
|
||||
if (!evt.isPass) return
|
||||
|
||||
if (form.priceType == "1") {
|
||||
if (form.priceType == 1) {
|
||||
for (let i = 0; i < form.skuList.length; i++) {
|
||||
const skuItem = form.skuList[i]
|
||||
for (const key in skuItem) {
|
||||
@@ -313,7 +343,7 @@ const onsubmit = async (evt: TM.FORM_SUBMIT_RESULT) => {
|
||||
}
|
||||
}
|
||||
|
||||
if (form.priceType == "2") {
|
||||
if (form.priceType == 2) {
|
||||
form.skuList = []
|
||||
}
|
||||
|
||||
@@ -329,6 +359,7 @@ const onsubmit = async (evt: TM.FORM_SUBMIT_RESULT) => {
|
||||
}
|
||||
}),
|
||||
coverImage: JSON.parse(form.coverImage[0].response).data.url,
|
||||
// carouselImages: form.carouselImages.map((item: any) => JSON.parse(item.response).data.url).join(","),
|
||||
}
|
||||
uni.showLoading({ title: "提交中..." })
|
||||
const { code, msg } = await (form.id ? prosperityShopApi.editGoods(params) : prosperityShopApi.addGoods(params))
|
||||
|
||||
@@ -100,7 +100,7 @@
|
||||
<tm-button class="px-2" size="s" :linear="['to right', '#62abff', '#0779FD99']" @click.stop="editGoods(v.id)">
|
||||
编辑商品
|
||||
</tm-button>
|
||||
<tm-button class="px-2" size="s" :linear="['to right', '#00B960', '#00552C99']" @click.stop="doGoodsDetail(v.id)">
|
||||
<tm-button class="px-2" size="s" :linear="['to right', '#00B960', '#00552C99']" @click.stop="doGoodsDetail(v.id, v.merchantId)">
|
||||
查看详情
|
||||
</tm-button>
|
||||
</view>
|
||||
|
||||
@@ -27,10 +27,10 @@ export function useGoodsManage(pageRef) {
|
||||
})
|
||||
}
|
||||
// 查看详情
|
||||
const doGoodsDetail = (id: string) => {
|
||||
const doGoodsDetail = (id: string, merchantId: string) => {
|
||||
if (!id) return uni.showToast({ title: "商品id不存在", icon: "none" })
|
||||
uni.navigateTo({
|
||||
url: `/pages/prosperity-shop/goods-detail?id=${id}`,
|
||||
url: `/pages/prosperity-shop/goods-detail?id=${id}&mchId=${merchantId}`,
|
||||
})
|
||||
}
|
||||
// 分类管理
|
||||
|
||||
@@ -1,6 +1,6 @@
|
||||
<template>
|
||||
<view class="mb-20rpx">
|
||||
<node-tree :node-data="categoryTree" @currentNode="currentNode" />
|
||||
<node-tree v-model="selectedNodeId" :node-data="categoryTree" @currentNode="currentNode" />
|
||||
<view v-if="categoryTree.length === 0" class="text-center text-#888 py-40rpx">暂无数据</view>
|
||||
</view>
|
||||
<view class="px-20rpx py-2 flex justify-between sticky bottom-0 bg-white">
|
||||
@@ -20,6 +20,7 @@ defineProps({
|
||||
default: () => [],
|
||||
},
|
||||
})
|
||||
const selectedNodeId = defineModel("modelValue")
|
||||
const emit = defineEmits(["confirm", "cancel"])
|
||||
|
||||
const selectedNode = ref<any>({})
|
||||
|
||||
Reference in new issue
Block a user