From dfe502966e4727610b925f97ce96095fff290059 Mon Sep 17 00:00:00 2001 From: fanfan Date: Mon, 9 Sep 2024 18:07:39 +0800 Subject: [PATCH] =?UTF-8?q?=E7=BB=86=E5=8F=96=E6=B6=88=E9=80=89=E6=8B=A9?= =?UTF-8?q?=20=E5=8E=BB=E4=BF=AE=E6=94=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../Modal/GoodsModal/GoodsModal.vue | 18 ++- src/views/dataCenter/goods/Index.vue | 11 ++ .../dataCenter/goods/modules/MultiSpec.vue | 140 +++++++++++------- 3 files changed, 110 insertions(+), 59 deletions(-) diff --git a/src/components/Modal/GoodsModal/GoodsModal.vue b/src/components/Modal/GoodsModal/GoodsModal.vue index 9841ed7..c4ff2ee 100644 --- a/src/components/Modal/GoodsModal/GoodsModal.vue +++ b/src/components/Modal/GoodsModal/GoodsModal.vue @@ -52,6 +52,11 @@ :subTitleColor="true" /> + +

+ {{ text == 10 ? '单规格' : '多规格' }} +

+ {{ text }} @@ -82,10 +87,9 @@ const columns = [ scopedSlots: { customRender: 'item' }, }, { - title: '规格值', - dataIndex: 'specific_value', - width: '100px', - scopedSlots: { customRender: 'specific_value' }, + title: '规格类型', + dataIndex: 'spec_type', + scopedSlots: { customRender: 'spec_type' }, }, { title: '商品价格', @@ -131,8 +135,8 @@ export default { searchForm: this.$form.createForm(this), // 查询参数 queryParam: {}, - queryNew:{ - is_sale: 0, + queryNew: { + is_sale: 0, }, // table表头 columns, @@ -140,7 +144,7 @@ export default { loadData: (param) => { this.queryParam.channel = this.channel this.queryNew = this.source == 1 ? this.queryNew : {} - return GoodsApi.list({ ...param, ...this.queryParam,...this.queryNew }).then((response) => { + return GoodsApi.list({ ...param, ...this.queryParam, ...this.queryNew }).then((response) => { return response.data.list }) }, diff --git a/src/views/dataCenter/goods/Index.vue b/src/views/dataCenter/goods/Index.vue index 20077e0..10964eb 100644 --- a/src/views/dataCenter/goods/Index.vue +++ b/src/views/dataCenter/goods/Index.vue @@ -349,6 +349,11 @@ {{ text == 0 ? '待处理' : text == 1 ? '已入池' : '未入池' }}

+ +

+ {{ text == 10 ? '单规格' : '多规格' }} +

+

{{ text == 0 ? '待处理' : '已归类' }} @@ -404,6 +409,12 @@ const columns = [ width: '300px', scopedSlots: { customRender: 'goods_name' }, }, + { + title: '规格类型', + width: '90px', + dataIndex: 'spec_type', + scopedSlots: { customRender: 'spec_type' }, + }, { title: '行情价', width: '100px', diff --git a/src/views/dataCenter/goods/modules/MultiSpec.vue b/src/views/dataCenter/goods/modules/MultiSpec.vue index b20b16c..7bcea40 100644 --- a/src/views/dataCenter/goods/modules/MultiSpec.vue +++ b/src/views/dataCenter/goods/modules/MultiSpec.vue @@ -14,12 +14,8 @@ placeholder="请输入规格名称" @change="onChangeSpecGroupIpt" /> - 删除规格组删除规格组

@@ -50,7 +46,7 @@ class="spec-group-add-btn" icon="plus" @click="handleAddSpecGroup" - >添加规格组添加规格组 @@ -95,13 +91,26 @@ bordered > + + - - - @@ -124,12 +133,14 @@ {{ item.goods_sku_no }} - @@ -142,11 +153,12 @@ import MultiSpecModel from '@/common/model/goods/MultiSpec' import { SelectImage } from '@/components' import SelectGoods from '@/components/SelectGoods/SelectGoods.vue' import * as GoodsApi from '@/api/goods' - +import { GoodsItem } from '@/components/Table/table' export default { components: { SelectImage, - SelectGoods + SelectGoods, + GoodsItem }, props: { // 默认的规格列表 @@ -156,10 +168,10 @@ export default { // 商品规格是否锁定(锁定状态下不允许编辑规格) isSpecLocked: PropTypes.bool.def(false), checkList: PropTypes.array.def([]), - channel:PropTypes.any, + channel: PropTypes.any, source: PropTypes.any.def(0), }, - data () { + data() { return { // 标签布局属性 labelCol: { span: 3 }, @@ -172,93 +184,114 @@ export default { // 规格列表 specList: [], // SKU列表 - skuList: [] + skuList: [], }, - visible: false + visible: false, } }, watch: { - defaultSpecList (val) { + defaultSpecList(val) { if (val.length && this.MultiSpecModel.isEmpty()) { this.getData() } - } + }, }, // 初始化数据 - created () { + created() { // 获取规格及SKU信息 this.getData() }, methods: { + handleEdit(item) { + const routeData = this.$router.resolve({ + path: '/goods/update', + query: { + goodsId: item.goods_id, + }, + }) + window.open(routeData.href, '_blank') + }, + handleCancel(index) { + this.multiSpecData.skuList[index].cost_price = '' + this.multiSpecData.skuList[index].goods_id = '' + this.multiSpecData.skuList[index].goods_image = '' + this.multiSpecData.skuList[index].goods_name = '' + this.multiSpecData.skuList[index].goods_price = '' + this.multiSpecData.skuList[index].goods_price_min = '' + this.multiSpecData.skuList[index].goods_sku_no = '' + this.multiSpecData.skuList[index].goods_weight = '' + this.multiSpecData.skuList[index].line_price = '' + this.multiSpecData.skuList[index].stock_num = '' + }, // 获取规格及SKU信息(展示) - getData () { + getData() { const { defaultSpecList, defaultSkuList } = this this.multiSpecData = this.MultiSpecModel.getData(defaultSpecList, defaultSkuList) }, // 获取规格及SKU信息(表单提交) - getFromSpecData () { + getFromSpecData() { return this.MultiSpecModel.getFromSpecData() }, // 添加规格组 - handleAddSpecGroup () { + handleAddSpecGroup() { if (this.checkSkuMaxNum()) { this.MultiSpecModel.handleAddSpecGroup() } }, // 删除规格组 - handleDeleteSpecGroup (groupIndex) { + handleDeleteSpecGroup(groupIndex) { const app = this const modal = this.$confirm({ title: '您确定要删除该规格组吗?', content: '删除后不可恢复', - onOk () { + onOk() { // 删除元素 app.MultiSpecModel.handleDeleteSpecGroup(groupIndex) // 关闭对话框 modal.destroy() - } + }, }) }, // 新增规格值 - handleAddSpecValue (groupIndex) { + handleAddSpecValue(groupIndex) { if (this.checkSkuMaxNum()) { this.MultiSpecModel.handleAddSpecValue(groupIndex) } }, // 删除规格值 - handleDeleteSpecValue (groupIndex, valueIndex) { + handleDeleteSpecValue(groupIndex, valueIndex) { const app = this const modal = this.$confirm({ title: '您确定要删除该规格值吗?', content: '删除后不可恢复', - onOk () { + onOk() { // 删除元素 app.MultiSpecModel.handleDeleteSpecValue(groupIndex, valueIndex) // 关闭对话框 modal.destroy() - } + }, }) }, // 规格组输入框change事件 - onChangeSpecGroupIpt () { + onChangeSpecGroupIpt() { // 更新skuList this.MultiSpecModel.onUpdate(true) }, // 规格值输入框change事件 - onChangeSpecValueIpt (event, itm) { + onChangeSpecValueIpt(event, itm) { // 更新skuList this.MultiSpecModel.onUpdate(true) }, // 验证最大sku数量 - checkSkuMaxNum () { + checkSkuMaxNum() { const skuList = this.multiSpecData.skuList if (skuList.length >= 50) { this.$message.error(`生成的sku列表数量不能大于50个，当前数量：${skuList.length}个`, 2.5) @@ -268,31 +301,31 @@ export default { }, // 批量设置sku事件 - handleSkuBatch () { + handleSkuBatch() { this.MultiSpecModel.handleSkuBatch() }, // 验证多规格表单 - verifyForm () { + verifyForm() { if (!this.MultiSpecModel.verifyForm()) { this.$message.error(this.MultiSpecModel.getError(), 2) return false } return true }, - showModal () { + showModal() { this.visible = true }, - async handleSelectGoods (goodsId, item) { + async handleSelectGoods(goodsId, item) { const skuList = this.multiSpecData.skuList - const skuItem = skuList.find(sku => sku.goods_id === goodsId) + const skuItem = skuList.find((sku) => sku.goods_id === goodsId) if (skuItem) { this.$message.error('一个商品只能选择一次', 2) return false } - this.getGoodsDetail(goodsId).then(res => { + this.getGoodsDetail(goodsId).then((res) => { const queryGoodsId = this.$route.query.goodsId if (res.spec_type === 20 && queryGoodsId !== goodsId) { this.$message.error('您选择的商品是多规格商品', 2) @@ -300,27 +333,30 @@ export default { } const sku = res.skuList[0] + console.log(res) item.goods_price = sku.goods_price item.cost_price = sku.cost_price item.stock_num = sku.stock_num item.goods_weight = sku.goods_weight item.goods_sku_no = sku.goods_sku_no - // item.goods_name = res.goods_name + item.goods_name = res.goods_name item.goods_id = res.goods_id + item.goods_image = res.goods_image + item.goods_price_min = res.goods_price_min }) + console.log(item) }, // 获取商品详情 - getGoodsDetail (goodsId = null) { + getGoodsDetail(goodsId = null) { if (!goodsId) return false return new Promise((resolve, reject) => { - GoodsApi.detail({ goodsId }) - .then(result => { - resolve(result.data.goodsInfo) - }) + GoodsApi.detail({ goodsId }).then((result) => { + resolve(result.data.goodsInfo) + }) }) - } - } + }, + }, }