huangyujie
/
qihang-ecom-erp-open
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

店铺商品-tao：拆分商品和SKU列表；优化sku关联操作

This commit is contained in:
Richie 2025-05-19 09:53:30 +08:00
parent d82ce4e052
commit 093d08b846
14 changed files with 773 additions and 304 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
core/common/src/main/java/cn/qihangerp/common/ResultVo.java
View File

@ -91,7 +91,13 @@ public class ResultVo<T> {
result.setMsg(msg);
return result;
}
public static <T> ResultVo<T> error( String msg)
{
ResultVo<T> result = new ResultVo<>();
result.setCode(ResultVoEnum.Fail.getIndex());
result.setMsg(msg);
return result;
}
public static <T> ResultVo<T> error(int code, String msg)
{
ResultVo<T> result = new ResultVo<>();

20
core/common/src/main/java/cn/qihangerp/common/bo/LinkErpGoodsSkuBo.java
View File

@ -1,10 +1,10 @@
package cn.qihangerp.common.bo;
import lombok.Data;
@Data
public class LinkErpGoodsSkuBo {
private String id;//主键ID
private String erpGoodsSkuId;//ERP商品SkuId
}
//package cn.qihangerp.common.bo;
//
//import lombok.Data;
//
//@Data
//public class LinkErpGoodsSkuBo {
// private String id;//主键ID
// private String erpGoodsSkuId;//ERP商品SkuId
//
//}

22
microservices/tao-api/src/main/java/cn/qihangerp/api/tao/controller/TaoGoodsController.java
View File

@ -1,10 +1,7 @@
package cn.qihangerp.api.tao.controller;
import cn.qihangerp.common.AjaxResult;
import cn.qihangerp.common.PageQuery;
import cn.qihangerp.common.PageResult;
import cn.qihangerp.common.TableDataInfo;
import cn.qihangerp.common.*;
import cn.qihangerp.domain.bo.LinkErpGoodsSkuBo;
import cn.qihangerp.module.goods.domain.OGoodsSku;
import cn.qihangerp.module.goods.service.OGoodsSkuService;
@ -26,6 +23,13 @@ public class TaoGoodsController extends BaseController {
private final TaoGoodsService goodsService;
private final TaoGoodsSkuService skuService;
private final OGoodsSkuService oGoodsSkuService;
/**
* 商品列表
* @param bo
* @param pageQuery
* @return
*/
@RequestMapping(value = "/list", method = RequestMethod.GET)
public TableDataInfo goodsList(TaoGoodsBo bo, PageQuery pageQuery) {
PageResult<TaoGoods> result = goodsService.queryPageList(bo, pageQuery);
@ -57,13 +61,11 @@ public class TaoGoodsController extends BaseController {
if(StringUtils.isBlank(bo.getErpGoodsSkuId())){
return AjaxResult.error(500,"缺少参数oGoodsSkuId");
}
OGoodsSku oGoodsSku = oGoodsSkuService.getById(bo.getErpGoodsSkuId());
if(oGoodsSku == null) return AjaxResult.error(1500,"未找到系统商品sku");
TaoGoodsSku sku = new TaoGoodsSku();
sku.setId(bo.getId());
sku.setOGoodsSkuId(bo.getErpGoodsSkuId());
skuService.updateById(sku);
ResultVo resultVo = skuService.linkErpGoodsSku(bo);
if(resultVo.getCode()==0)
return success();
else return AjaxResult.error(resultVo.getMsg());
}
}

6
module/tao/src/main/java/cn/qihangerp/module/open/tao/domain/TaoGoods.java
View File

@ -166,7 +166,7 @@ public class TaoGoods implements Serializable {
/**
* erp商品id
*/
private Integer erpGoodsId;
private String erpGoodsId;
/**
* 创建时间
@ -609,14 +609,14 @@ public class TaoGoods implements Serializable {
/**
* erp商品id
*/
public Integer getErpGoodsId() {
public String getErpGoodsId() {
return erpGoodsId;
}
/**
* erp商品id
*/
public void setErpGoodsId(Integer erpGoodsId) {
public void setErpGoodsId(String erpGoodsId) {
this.erpGoodsId = erpGoodsId;
}

4
module/tao/src/main/java/cn/qihangerp/module/open/tao/service/TaoGoodsSkuService.java
View File

@ -2,6 +2,8 @@ package cn.qihangerp.module.open.tao.service;
import cn.qihangerp.common.PageQuery;
import cn.qihangerp.common.PageResult;
import cn.qihangerp.common.ResultVo;
import cn.qihangerp.domain.bo.LinkErpGoodsSkuBo;
import cn.qihangerp.module.open.tao.domain.TaoGoodsSku;
import cn.qihangerp.module.open.tao.domain.bo.TaoGoodsBo;
import cn.qihangerp.module.open.tao.domain.vo.TaoGoodsSkuListVo;
@ -15,4 +17,6 @@ import com.baomidou.mybatisplus.extension.service.IService;
*/
public interface TaoGoodsSkuService extends IService<TaoGoodsSku> {
PageResult<TaoGoodsSkuListVo> queryPageList(TaoGoodsBo bo, PageQuery pageQuery);
ResultVo linkErpGoodsSku(LinkErpGoodsSkuBo bo);
}

5
module/tao/src/main/java/cn/qihangerp/module/open/tao/service/impl/TaoGoodsServiceImpl.java
View File

@ -43,6 +43,11 @@ public class TaoGoodsServiceImpl extends ServiceImpl<TaoGoodsMapper, TaoGoods>
.eq(bo.getShopId()!=null,TaoGoods::getShopId,bo.getShopId());
Page<TaoGoods> taoGoodsPage = mapper.selectPage(pageQuery.build(), queryWrapper);
if(taoGoodsPage.getRecords()!=null && taoGoodsPage.getRecords().size()>0){
for(TaoGoods taoGoods : taoGoodsPage.getRecords()){
taoGoods.setSkus(skuMapper.selectList(new LambdaQueryWrapper<TaoGoodsSku>().eq(TaoGoodsSku::getTaoGoodsId,taoGoods.getId())));
}
}
return PageResult.build(taoGoodsPage);
}

37
module/tao/src/main/java/cn/qihangerp/module/open/tao/service/impl/TaoGoodsSkuServiceImpl.java
View File

@ -1,16 +1,24 @@
package cn.qihangerp.module.open.tao.service.impl;
import cn.qihangerp.common.AjaxResult;
import cn.qihangerp.common.PageQuery;
import cn.qihangerp.common.PageResult;
import cn.qihangerp.common.ResultVo;
import cn.qihangerp.domain.bo.LinkErpGoodsSkuBo;
import cn.qihangerp.module.goods.domain.OGoodsSku;
import cn.qihangerp.module.goods.service.OGoodsSkuService;
import cn.qihangerp.module.open.tao.domain.TaoGoods;
import cn.qihangerp.module.open.tao.domain.TaoGoodsSku;
import cn.qihangerp.module.open.tao.domain.bo.TaoGoodsBo;
import cn.qihangerp.module.open.tao.domain.vo.TaoGoodsSkuListVo;
import cn.qihangerp.module.open.tao.mapper.TaoGoodsMapper;
import cn.qihangerp.module.open.tao.mapper.TaoGoodsSkuMapper;
import cn.qihangerp.module.open.tao.service.TaoGoodsSkuService;
import com.baomidou.mybatisplus.core.metadata.IPage;
import com.baomidou.mybatisplus.extension.service.impl.ServiceImpl;
import lombok.AllArgsConstructor;
import org.springframework.stereotype.Service;
import org.springframework.transaction.annotation.Transactional;
/**
* @author TW
@ -22,12 +30,41 @@ import org.springframework.stereotype.Service;
public class TaoGoodsSkuServiceImpl extends ServiceImpl<TaoGoodsSkuMapper, TaoGoodsSku>
implements TaoGoodsSkuService {
private final TaoGoodsSkuMapper mapper;
private final TaoGoodsMapper goodsMapper;
private final OGoodsSkuService oGoodsSkuService;
@Override
public PageResult<TaoGoodsSkuListVo> queryPageList(TaoGoodsBo bo, PageQuery pageQuery) {
IPage<TaoGoodsSkuListVo> result = mapper.selectSkuPageList(pageQuery.build(), bo.getShopId(),bo.getNumIid(),bo.getSkuId(),bo.getOuterId(), bo.getHasLink());
return PageResult.build(result);
}
/**
* 手动绑定erpGoodsSku
* @param
* @return
*/
@Transactional(rollbackFor = Exception.class)
@Override
public ResultVo linkErpGoodsSku(LinkErpGoodsSkuBo bo) {
OGoodsSku oGoodsSku = oGoodsSkuService.getById(bo.getErpGoodsSkuId());
if(oGoodsSku == null) return ResultVo.error("未找到系统商品sku");
TaoGoodsSku taoGoodsSku = mapper.selectById(bo.getId());
if(taoGoodsSku == null) {
return ResultVo.error("Tao商品sku数据不存在");
}
TaoGoodsSku sku = new TaoGoodsSku();
sku.setId(bo.getId());
sku.setOGoodsId(oGoodsSku.getGoodsId());
sku.setOGoodsSkuId(bo.getErpGoodsSkuId());
mapper.updateById(sku);
TaoGoods goodsUp=new TaoGoods();
goodsUp.setId(taoGoodsSku.getTaoGoodsId());
goodsUp.setErpGoodsId(oGoodsSku.getGoodsId());
goodsMapper.updateById(goodsUp);
return ResultVo.success();
}
}

3
update_log.md Normal file
View File

@ -0,0 +1,3 @@
# 更新日志
#### 2025-05-19
+ 店铺商品-tao：拆分商品和SKU列表

12
vue/src/api/tao/goods.js
View File

@ -1,6 +1,16 @@
import request from '@/utils/request'
// 查询淘宝订单列表
// 查询淘宝商品列表
export function listGoods(query) {
return request({
url: '/api/open-api/tao/goods/list',
method: 'get',
params: query
})
}
// 查询淘宝商品sku列表
export function listGoodsSku(query) {
return request({
url: '/api/open-api/tao/goods/skuList',

5
vue/src/utils/zhijian.js
View File

@ -231,3 +231,8 @@ export function tansParams(params) {
export function blobValidate(data) {
return data.type !== 'application/json'
}
export function amountFormatter(row, column, cellValue, index) {
return '￥' + parseFloat(cellValue).toFixed(2).replace(/\d(?=(\d{3})+\.)/g, '$&,');
}

1
vue/src/views/index.vue
View File

@ -110,6 +110,7 @@ export default {
orderCount:302,
shopCount:8
}
}
},
mounted() {

352
vue/src/views/tao/goods/goods_list.vue Normal file
View File

@ -0,0 +1,352 @@
<template>
<div class="app-container">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="100px">
<el-form-item label="平台商品ID" prop="numIid">
<el-input
v-model="queryParams.numIid"
placeholder="请输入平台商品ID"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="商家编码" prop="outerId">
<el-input
v-model="queryParams.outerId"
placeholder="请输入商家编码"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="ERP商品ID" prop="erpGoodsId">
<el-input
v-model="queryParams.erpGoodsId"
placeholder="请输入ERP skuId"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="店铺" prop="shopId">
<el-select v-model="queryParams.shopId" placeholder="请选择店铺" clearable @change="handleQuery">
<el-option
v-for="item in shopList"
:key="item.id"
:label="item.name"
:value="item.id">
</el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button
:loading="pullLoading"
type="success"
plain
icon="el-icon-download"
size="mini"
@click="handlePull"
>API拉取商品数据</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="primary"
plain
icon="el-icon-refresh"
size="mini"
@click="handlePushOms"
>推送到商品库&一键关联</el-button>
</el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="goodsList" >
<!-- <el-table-column type="selection" width="55" align="center" />-->
<el-table-column label="主图" width="100">
<template slot-scope="scope">
<!-- <el-image style="width: 70px; height: 70px;" :src="scope.row.picUrl"></el-image>-->
<image-preview :src="scope.row.picUrl" :width="60" :height="40"/>
</template>
</el-table-column>
<el-table-column label="标题" align="left" prop="title" />
<el-table-column label="平台商品ID" align="center" prop="numIid" />
<el-table-column label="商家编码" align="center" prop="outerId" />
<el-table-column label="价格" align="left" prop="price" :formatter="amountFormatter" />
<el-table-column label="SKU" align="center" >
<template slot-scope="scope">
<el-button
size="mini"
type="text"
icon="el-icon-info"
@click="handleViewSkuList(scope.row)"
>{{scope.row.skus.length +' 个SKU'}}</el-button>
</template>
</el-table-column>
<el-table-column label="ERP商品Id" align="center" prop="erpGoodsId" />
<el-table-column label="最后修改时间" align="center" prop="modified" >
<template slot-scope="scope">
{{parseTime(scope.row.modified)}}
</template>
</el-table-column>
</el-table>
<pagination
v-show="total>0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
<el-dialog title="Sku List" :visible.sync="skuOpen" width="1200px" append-to-body>
<el-table v-loading="loading" :data="skuList">
<!-- <el-table-column type="selection" width="55" align="center" /> -->
<el-table-column label="序号" align="center" prop="index" width="50"/>
<el-table-column label="SKU编码" align="left" prop="outerId" />
<el-table-column label="平台SkuId" align="center" prop="skuId" />
<!-- <el-table-column label="图片" align="center" prop="colorImage" width="100">-->
<!-- <template slot-scope="scope">-->
<!-- <image-preview :src="scope.row.colorImage" :width="50" :height="50"/>-->
<!-- </template>-->
<!-- </el-table-column>-->
<!-- <el-table-column label="商品名称" align="left" prop="goodsName" width="288px"/>-->
<el-table-column label="属性" align="center" prop="propertiesName" >
<template slot-scope="scope">
{{scope.row.propertiesName.split(':')[3]}}
</template>
</el-table-column>
<el-table-column label="价格" align="center" prop="price" :formatter="amountFormatter"/>
<el-table-column label="数量" align="center" prop="quantity" />
<el-table-column label="ERP SKU ID" align="center" prop="ogoodsSkuId" />
<el-table-column label="状态" align="center" prop="status" >
<template slot-scope="scope">
<el-tag size="small" v-if="scope.row.status === 'normal'">正常</el-tag>
<el-tag size="small" v-else>{{scope.row.status}}</el-tag>
<!-- <el-tag size="small" v-if="scope.row.status === 20">供应商发货</el-tag>-->
</template>
</el-table-column>
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template slot-scope="scope">
<el-button
size="mini"
type="text"
icon="el-icon-share"
@click="handleLink(scope.row)"
>关联ERP</el-button>
</template>
</el-table-column>
</el-table>
</el-dialog>
<!-- 关联ERP -->
<el-dialog title="关联ERP商品SKU" :visible.sync="detailOpen" width="560px" append-to-body :close-on-click-modal="false">
<el-form ref="form" :model="form" :rules="rules" label-width="120px" inline>
<el-form-item label="ERP商品SkuId" prop="erpGoodsSkuId">
<el-input v-model.number="form.erpGoodsSkuId" placeholder="请输入ERP商品SkuId" style="width:250px" />
<!-- <el-select v-model="form.erpGoodsSkuId" filterable remote reserve-keyword placeholder="搜索（sku编码、skuId）" style="width: 350px;"-->
<!-- :remote-method="searchSku" :loading="skuListLoading" @change="skuChanage(scope.row)">-->
<!-- <el-option v-for="item in skuList" :key="item.id"-->
<!-- :label="item.name + ' - ' + item.colorValue + ' ' + item.sizeValue + ' ' + item.styleValue"-->
<!-- :value="item.id">-->
<!-- </el-option>-->
<!-- </el-select>-->
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import { listShop } from "@/api/shop/shop";
import { searchSku } from "@/api/goods/goods";
import {MessageBox} from "element-ui";
import {getGoodsSku, linkErpGoodsSkuId, listGoods, pullGoodsList} from "@/api/tao/goods";
import {amountFormatter, parseTime} from "@/utils/zhijian";
export default {
name: "GoodsTaoIndex",
data() {
return {
// 显示搜索条件
showSearch: true,
// 总条数
total: 0,
// 遮罩层
loading: true,
pullLoading: false,
goodsList:[],
shopList:[],
skuList:[],
// 是否显示弹出层
detailOpen:false,
skuListLoading:false,
skuOpen:false,
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
shopId: null,
numIid: null,
skuId: null,
outerId: null,
erpGoodsSkuId: null
},
// 表单参数
form: {
erpGoodsSkuId:null,
id:null
},
rules: {
id: [
{ required: true, message: "不能为空", trigger: "blur" }
],
erpGoodsSkuId: [
{ required: true, message: "不能为空", trigger: "blur" }
],
}
};
},
created() {
listShop({type: 100}).then(response => {
this.shopList = response.rows;
if (this.shopList && this.shopList.length > 0) {
this.queryParams.shopId = this.shopList[0].id
}
this.getList();
});
// this.getList();
},
mounted() {
if(this.$route.query.shopId){
this.queryParams.shopId = this.$route.query.shopId
}
},
methods: {
parseTime,
amountFormatter,
/** 查询淘宝订单列表 */
getList() {
this.loading = true;
console.log('====商品list==',this.queryParams)
listGoods(this.queryParams).then(response => {
this.goodsList = response.rows;
this.total = response.total;
this.loading = false;
});
},
// 取消按钮
cancel() {
this.open = false;
this.detailOpen = false;
this.skuOpen = false
this.reset();
},
// 表单重置
reset() {
this.form = {
id: null,
erpGoodsSkuId: null
};
this.resetForm("form");
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1;
this.getList();
},
/** 重置按钮操作 */
resetQuery() {
this.resetForm("queryForm");
this.handleQuery();
},
handlePull() {
if(this.queryParams.shopId){
this.pullLoading = true
pullGoodsList({shopId:this.queryParams.shopId}).then(response => {
console.log('拉取淘宝商品接口返回=====',response)
if(response.code === 1401) {
MessageBox.confirm('Token已过期，需要重新授权！请前往店铺列表重新获取授权！', '系统提示', { confirmButtonText: '前往授权', cancelButtonText: '取消', type: 'warning' }).then(() => {
// isRelogin.show = false;
this.$router.push({path:"/shop/shop_list",query:{platform:4}})
// store.dispatch('LogOut').then(() => {
// location.href = response.data.tokenRequestUrl+'?shopId='+this.queryParams.shopId
// })
}).catch(() => {
isRelogin.show = false;
});
// return Promise.reject('无效的会话，或者会话已过期，请重新登录。')
}else{
this.$modal.msgSuccess(JSON.stringify(response));
this.getList()
}
this.pullLoading = false
})
}else{
this.$modal.msgSuccess("请先选择店铺");
}
// this.$modal.msgSuccess("请先配置API");
},
/** 查看SKU List*/
handleViewSkuList(row){
this.skuList = row.skus
this.skuOpen = true;
},
handlePushOms(){
},
/** 提交按钮 */
submitForm() {
this.$refs["form"].validate(valid => {
if (valid) {
linkErpGoodsSkuId(this.form).then(response => {
this.$modal.msgSuccess("关联成功");
this.detailOpen = false;
this.skuOpen = false;
this.getList();
});
}
});
},
handleLink(row) {
this.reset();
const id = row.id || this.ids
getGoodsSku(id).then(response => {
console.log('=====00000000============',response)
this.form = response.data;
this.detailOpen = true;
});
},
// 搜索SKU
searchSku(query) {
this.shopLoading = true;
const qw = {
keyword: query
}
searchSku(qw).then(res => {
this.skuList = res.rows;
this.skuListLoading = false;
})
},
}
};
</script>

296
vue/src/views/tao/goods/index.vue
View File

@ -1,300 +1,42 @@
<template>
<div class="app-container">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="100px">
<el-form-item label="平台商品ID" prop="numIid">
<el-input
v-model="queryParams.numIid"
placeholder="请输入平台商品ID"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="平台SkuId" prop="skuId">
<el-input
v-model="queryParams.skuId"
placeholder="请输入平台SkuId"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="商家sku编码" prop="outerId">
<el-input
v-model="queryParams.outerId"
placeholder="请输入商家sku编码"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="ERP skuId" prop="erpGoodsSkuId">
<el-input
v-model="queryParams.erpGoodsSkuId"
placeholder="请输入ERP skuId"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="店铺" prop="shopId">
<el-select v-model="queryParams.shopId" placeholder="请选择店铺" clearable @change="handleQuery">
<el-option
v-for="item in shopList"
:key="item.id"
:label="item.name"
:value="item.id">
</el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button
:loading="pullLoading"
type="success"
plain
icon="el-icon-download"
size="mini"
@click="handlePull"
>API拉取商品数据</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="primary"
plain
icon="el-icon-refresh"
size="mini"
:disabled="multiple"
@click="handlePushOms"
>推送到商品库&一键关联</el-button>
</el-col>
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="goodsList" >
<!-- <el-table-column type="selection" width="55" align="center" />-->
<el-table-column label="平台skuId" align="center" prop="skuId" />
<el-table-column label="平台商品ID" align="center" prop="numIid" />
<el-table-column label="商家编码" align="center" prop="outerId" />
<el-table-column label="标题" align="center" prop="title" />
<el-table-column label="主图" width="100">
<template slot-scope="scope">
<el-image style="width: 70px; height: 70px;" :src="scope.row.picUrl"></el-image>
</template>
</el-table-column>
<el-table-column label="规格" align="center" prop="propertiesName" />
<el-table-column label="ERP商品sku Id" align="center" prop="erpGoodsSkuId" />
<!-- <el-table-column label="快递单号" align="center" prop="logisticsCode" />-->
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template slot-scope="scope">
<el-button
size="mini"
type="text"
icon="el-icon-share"
@click="handleLink(scope.row)"
>关联ERP</el-button>
</template>
</el-table-column>
</el-table>
<pagination
v-show="total>0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
<!-- 关联ERP -->
<el-dialog title="关联ERP商品SKU" :visible.sync="detailOpen" width="560px" append-to-body :close-on-click-modal="false">
<el-form ref="form" :model="form" :rules="rules" label-width="120px" inline>
<el-form-item label="ERP商品SkuId" prop="erpGoodsSkuId">
<el-input v-model.number="form.erpGoodsSkuId" placeholder="请输入ERP商品SkuId" style="width:250px" />
<!-- <el-select v-model="form.erpGoodsSkuId" filterable remote reserve-keyword placeholder="搜索（sku编码、skuId）" style="width: 350px;"-->
<!-- :remote-method="searchSku" :loading="skuListLoading" @change="skuChanage(scope.row)">-->
<!-- <el-option v-for="item in skuList" :key="item.id"-->
<!-- :label="item.name + ' - ' + item.colorValue + ' ' + item.sizeValue + ' ' + item.styleValue"-->
<!-- :value="item.id">-->
<!-- </el-option>-->
<!-- </el-select>-->
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog>
<el-tabs v-model="activeName" @tab-click="handleClick">
<el-tab-pane label="店铺商品" name="LogisticsCompany" >
<goods-tao-index></goods-tao-index>
</el-tab-pane>
<el-tab-pane label="店铺商品SKU" name="EwaybillAccount" lazy>
<goods-tao-sku></goods-tao-sku>
</el-tab-pane>
</el-tabs>
</div>
</template>
<script>
import { listShop } from "@/api/shop/shop";
import { searchSku } from "@/api/goods/goods";
import {MessageBox} from "element-ui";
import {getGoodsSku, linkErpGoodsSkuId, listGoodsSku, pullGoodsList} from "@/api/tao/goods";
import GoodsTaoIndex from "@/views/tao/goods/goods_list.vue";
import GoodsTaoSku from "@/views/tao/goods/sku_list.vue";
export default {
name: "GoodsTao",
components:{
GoodsTaoIndex,GoodsTaoSku
},
data() {
return {
// 显示搜索条件
showSearch: true,
// 总条数
total: 0,
// 遮罩层
loading: true,
pullLoading: false,
goodsList:[],
shopList:[],
skuList:[],
// 是否显示弹出层
detailOpen:false,
skuListLoading:false,
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
shopId: null,
numIid: null,
skuId: null,
outerId: null,
erpGoodsSkuId: null
},
// 表单参数
form: {
erpGoodsSkuId:null,
id:null
},
rules: {
id: [
{ required: true, message: "不能为空", trigger: "blur" }
],
erpGoodsSkuId: [
{ required: true, message: "不能为空", trigger: "blur" }
],
}
activeName: 'LogisticsCompany',
typeList: [],
};
},
created() {
listShop({type: 100}).then(response => {
this.shopList = response.rows;
if (this.shopList && this.shopList.length > 0) {
this.queryParams.shopId = this.shopList[0].id
}
this.getList();
});
// this.getList();
},
mounted() {
if(this.$route.query.shopId){
this.queryParams.shopId = this.$route.query.shopId
}
},
methods: {
/** 查询淘宝订单列表 */
getList() {
this.loading = true;
console.log('====222222==',this.queryParams)
listGoodsSku(this.queryParams).then(response => {
this.goodsList = response.rows;
this.total = response.total;
this.loading = false;
});
},
// 取消按钮
cancel() {
this.open = false;
this.detailOpen = false;
this.saleAfterOpen = false
this.reset();
},
// 表单重置
reset() {
this.form = {
id: null,
erpGoodsSkuId: null
};
this.resetForm("form");
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1;
this.getList();
},
/** 重置按钮操作 */
resetQuery() {
this.resetForm("queryForm");
this.handleQuery();
},
handlePull() {
if(this.queryParams.shopId){
this.pullLoading = true
pullGoodsList({shopId:this.queryParams.shopId}).then(response => {
console.log('拉取淘宝商品接口返回=====',response)
if(response.code === 1401) {
MessageBox.confirm('Token已过期，需要重新授权！请前往店铺列表重新获取授权！', '系统提示', { confirmButtonText: '前往授权', cancelButtonText: '取消', type: 'warning' }).then(() => {
// isRelogin.show = false;
this.$router.push({path:"/shop/shop_list",query:{platform:4}})
// store.dispatch('LogOut').then(() => {
// location.href = response.data.tokenRequestUrl+'?shopId='+this.queryParams.shopId
// })
}).catch(() => {
isRelogin.show = false;
});
// return Promise.reject('无效的会话，或者会话已过期，请重新登录。')
}else{
this.$modal.msgSuccess(JSON.stringify(response));
this.getList()
handleClick(tab, event) {
console.log(tab, event);
}
this.pullLoading = false
})
}else{
this.$modal.msgSuccess("请先选择店铺");
}
// this.$modal.msgSuccess("请先配置API");
},
/** 提交按钮 */
submitForm() {
this.$refs["form"].validate(valid => {
if (valid) {
linkErpGoodsSkuId(this.form).then(response => {
this.$modal.msgSuccess("关联成功");
this.detailOpen = false;
this.getList();
});
}
});
},
handleLink(row) {
this.reset();
const id = row.id || this.ids
getGoodsSku(id).then(response => {
console.log('=====00000000============',response)
this.form = response.data;
this.detailOpen = true;
});
},
// 搜索SKU
searchSku(query) {
this.shopLoading = true;
const qw = {
keyword: query
}
searchSku(qw).then(res => {
this.skuList = res.rows;
this.skuListLoading = false;
})
},
}
};
</script>

302
vue/src/views/tao/goods/sku_list.vue Normal file
View File

@ -0,0 +1,302 @@
<template>
<div class="app-container">
<el-form :model="queryParams" ref="queryForm" size="small" :inline="true" v-show="showSearch" label-width="100px">
<el-form-item label="平台商品ID" prop="numIid">
<el-input
v-model="queryParams.numIid"
placeholder="请输入平台商品ID"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="平台SkuId" prop="skuId">
<el-input
v-model="queryParams.skuId"
placeholder="请输入平台SkuId"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="商家sku编码" prop="outerId">
<el-input
v-model="queryParams.outerId"
placeholder="请输入商家sku编码"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="ERP skuId" prop="erpGoodsSkuId">
<el-input
v-model="queryParams.erpGoodsSkuId"
placeholder="请输入ERP skuId"
clearable
@keyup.enter.native="handleQuery"
/>
</el-form-item>
<el-form-item label="店铺" prop="shopId">
<el-select v-model="queryParams.shopId" placeholder="请选择店铺" clearable @change="handleQuery">
<el-option
v-for="item in shopList"
:key="item.id"
:label="item.name"
:value="item.id">
</el-option>
</el-select>
</el-form-item>
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
</el-form-item>
</el-form>
<el-row :gutter="10" class="mb8">
<!-- <el-col :span="1.5">-->
<!-- <el-button-->
<!-- :loading="pullLoading"-->
<!-- type="success"-->
<!-- plain-->
<!-- icon="el-icon-download"-->
<!-- size="mini"-->
<!-- @click="handlePull"-->
<!-- >API拉取商品数据</el-button>-->
<!-- </el-col>-->
<!-- <el-col :span="1.5">-->
<!-- <el-button-->
<!-- type="primary"-->
<!-- plain-->
<!-- icon="el-icon-refresh"-->
<!-- size="mini"-->
<!-- @click="handlePushOms"-->
<!-- >推送到商品库&一键关联</el-button>-->
<!-- </el-col>-->
<right-toolbar :showSearch.sync="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
<el-table v-loading="loading" :data="goodsList" >
<!-- <el-table-column type="selection" width="55" align="center" />-->
<el-table-column label="平台skuId" align="center" prop="skuId" />
<el-table-column label="平台商品ID" align="center" prop="numIid" />
<el-table-column label="商家编码" align="center" prop="outerId" />
<el-table-column label="标题" align="center" prop="title" />
<el-table-column label="主图" width="100">
<template slot-scope="scope">
<el-image style="width: 70px; height: 70px;" :src="scope.row.picUrl"></el-image>
</template>
</el-table-column>
<el-table-column label="规格" align="center" prop="propertiesName" />
<el-table-column label="ERP商品sku Id" align="center" prop="erpGoodsSkuId" />
<!-- <el-table-column label="快递单号" align="center" prop="logisticsCode" />-->
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template slot-scope="scope">
<el-button
size="mini"
type="text"
icon="el-icon-share"
@click="handleLink(scope.row)"
>关联ERP</el-button>
</template>
</el-table-column>
</el-table>
<pagination
v-show="total>0"
:total="total"
:page.sync="queryParams.pageNum"
:limit.sync="queryParams.pageSize"
@pagination="getList"
/>
<!-- 关联ERP -->
<el-dialog title="关联ERP商品SKU" :visible.sync="detailOpen" width="560px" append-to-body :close-on-click-modal="false">
<el-form ref="form" :model="form" :rules="rules" label-width="120px" inline>
<el-form-item label="ERP商品SkuId" prop="erpGoodsSkuId">
<el-input v-model.number="form.erpGoodsSkuId" placeholder="请输入ERP商品SkuId" style="width:250px" />
<!-- <el-select v-model="form.erpGoodsSkuId" filterable remote reserve-keyword placeholder="搜索（sku编码、skuId）" style="width: 350px;"-->
<!-- :remote-method="searchSku" :loading="skuListLoading" @change="skuChanage(scope.row)">-->
<!-- <el-option v-for="item in skuList" :key="item.id"-->
<!-- :label="item.name + ' - ' + item.colorValue + ' ' + item.sizeValue + ' ' + item.styleValue"-->
<!-- :value="item.id">-->
<!-- </el-option>-->
<!-- </el-select>-->
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button type="primary" @click="submitForm">确 定</el-button>
<el-button @click="cancel">取 消</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
import { listShop } from "@/api/shop/shop";
import { searchSku } from "@/api/goods/goods";
import {MessageBox} from "element-ui";
import {getGoodsSku, linkErpGoodsSkuId, listGoodsSku, pullGoodsList} from "@/api/tao/goods";
export default {
name: "GoodsTaoSku",
data() {
return {
// 显示搜索条件
showSearch: true,
// 总条数
total: 0,
// 遮罩层
loading: true,
pullLoading: false,
goodsList:[],
shopList:[],
skuList:[],
// 是否显示弹出层
detailOpen:false,
skuListLoading:false,
// 查询参数
queryParams: {
pageNum: 1,
pageSize: 10,
shopId: null,
numIid: null,
skuId: null,
outerId: null,
erpGoodsSkuId: null
},
// 表单参数
form: {
erpGoodsSkuId:null,
id:null
},
rules: {
id: [
{ required: true, message: "不能为空", trigger: "blur" }
],
erpGoodsSkuId: [
{ required: true, message: "不能为空", trigger: "blur" }
],
}
};
},
created() {
listShop({type: 100}).then(response => {
this.shopList = response.rows;
if (this.shopList && this.shopList.length > 0) {
this.queryParams.shopId = this.shopList[0].id
}
this.getList();
});
// this.getList();
},
mounted() {
if(this.$route.query.shopId){
this.queryParams.shopId = this.$route.query.shopId
}
},
methods: {
/** 查询淘宝订单列表 */
getList() {
this.loading = true;
console.log('====222222==',this.queryParams)
listGoodsSku(this.queryParams).then(response => {
this.goodsList = response.rows;
this.total = response.total;
this.loading = false;
});
},
// 取消按钮
cancel() {
this.open = false;
this.detailOpen = false;
this.saleAfterOpen = false
this.reset();
},
// 表单重置
reset() {
this.form = {
id: null,
erpGoodsSkuId: null
};
this.resetForm("form");
},
/** 搜索按钮操作 */
handleQuery() {
this.queryParams.pageNum = 1;
this.getList();
},
/** 重置按钮操作 */
resetQuery() {
this.resetForm("queryForm");
this.handleQuery();
},
handlePull() {
if(this.queryParams.shopId){
this.pullLoading = true
pullGoodsList({shopId:this.queryParams.shopId}).then(response => {
console.log('拉取淘宝商品接口返回=====',response)
if(response.code === 1401) {
MessageBox.confirm('Token已过期，需要重新授权！请前往店铺列表重新获取授权！', '系统提示', { confirmButtonText: '前往授权', cancelButtonText: '取消', type: 'warning' }).then(() => {
// isRelogin.show = false;
this.$router.push({path:"/shop/shop_list",query:{platform:4}})
// store.dispatch('LogOut').then(() => {
// location.href = response.data.tokenRequestUrl+'?shopId='+this.queryParams.shopId
// })
}).catch(() => {
isRelogin.show = false;
});
// return Promise.reject('无效的会话，或者会话已过期，请重新登录。')
}else{
this.$modal.msgSuccess(JSON.stringify(response));
this.getList()
}
this.pullLoading = false
})
}else{
this.$modal.msgSuccess("请先选择店铺");
}
// this.$modal.msgSuccess("请先配置API");
},
handlePushOms(){
},
/** 提交按钮 */
submitForm() {
this.$refs["form"].validate(valid => {
if (valid) {
linkErpGoodsSkuId(this.form).then(response => {
this.$modal.msgSuccess("关联成功");
this.detailOpen = false;
this.getList();
});
}
});
},
handleLink(row) {
this.reset();
const id = row.id || this.ids
getGoodsSku(id).then(response => {
console.log('=====00000000============',response)
this.form = response.data;
this.detailOpen = true;
});
},
// 搜索SKU
searchSku(query) {
this.shopLoading = true;
const qw = {
keyword: query
}
searchSku(qw).then(res => {
this.skuList = res.rows;
this.skuListLoading = false;
})
},
}
};
</script>