Authored by 李奇

添加批量导出功能添加、接口等待中

... ... @@ -37,6 +37,7 @@
</Col>
</Row>
</Col>
<slot></slot>
</Row>
</div>
</template>
... ...
const page = r => require.ensure([], () => r(require('./output')), 'product.output');
export default {
path: '/output',
path: '/output.html',
name: 'output',
component: page
};
... ...
<template>
<div class="batch-page">
批量功能
<Row class-name="row-space">
<h3>导出</h3>
</Row>
<Row :gutter="24" class-name="row-space">
<Col :span="6">
<Row>
<Col span="6">
<span class="field-label">文件类型:</span>
</Col>
<Col span="18">
<Select v-model="fileType.model">
<Option v-for="item in fileType.list" :value="item.id" :key="item">{{ item.label }}</Option>
</Select>
</Col>
</Row>
</Col>
</Row>
<Row class-name="row-space">
<Category :field-sort="sort" @on-change="sortChange">
<Button type="primary" @click="exportFile">导出</Button>
</Category>
</Row>
</div>
</template>
<script>
import _ from 'lodash';
import service from 'product-service';
import {SizeEdit} from 'product/size-edit';
import {Brand, Category} from 'product/filter-select';
import {filterFields, initialFields, tableCols, tableData, pageData} from './store';
import {Category} from 'product/filter-select';
export default {
data() {
return {
fileType: {
model: 0,
list: [
{
id: 0,
label: '我的商品表'
}
]
},
sort: {
first: {
label: '选择类目',
holder: '选择一级类目',
labelSpan: 6,
fieldSpan: 18,
model: ''
},
second: {
label: '二级类目',
holder: '选择二级类目',
fieldSpan: 18,
model: ''
},
third: {
label: '三级类目',
holder: '选择三级类目',
fieldSpan: 18,
model: ''
}
}
}
},
created() {
},
methods: {
exportFile() {
const params = {
maxSortId: this.sort.first.model,
middleSortId: this.sort.second.model,
smallSortId: this.sort.third.model
};
service.exportProductFile(params)
.then(res => {
});
},
sortChange(val) {
this.sort.first.model = val.first;
this.sort.second.model = val.second;
this.sort.third.model = val.third;
}
},
components: {
Category
}
}
</script>
<style lang="scss">
.filter-row {
margin-bottom: 20px;
.field-label {
line-height: 32px;
}
}
.hr {
border-top: 1px solid #eee;
.row-space {
margin-bottom: 20px;
}
.batch-row {
margin-bottom: 20px;
}
.list-page {
float: right;
margin-top: 20px;
}
.prd-img {
max-height: 200px;
}
.action-btn-row {
margin-top: 10px;
}
</style>
... ...
/**
* on sale page store
* @author: qi.li <qi.li@yoho.cn>
* @date: 2017/04/13
*/
const auditStatus = {
0: '无状态',
1: '上架待审核',
2: '上架驳回',
3: '已下架'
};
let filterFields = {
sknCode: {
label: 'SKN编码',
labelSpan: 6,
model: '',
holder: '',
fieldSpan: 18
},
prodCode: {
label: '商家编码',
labelSpan: 6,
model: '',
holder: '',
fieldSpan: 18
},
prodName: {
label: '商品名称',
labelSpan: 6,
model: '',
holder: '',
fieldSpan: 18
},
prodBarCode: {
label: '商品条码',
labelSpan: 6,
model: '',
holder: '',
fieldSpan: 18
},
sort: {
first: {
label: '选择类目',
holder: '选择一级类目',
labelSpan: 6,
fieldSpan: 18,
model: ''
},
second: {
label: '二级类目',
holder: '选择二级类目',
fieldSpan: 18,
model: ''
},
third: {
label: '三级类目',
holder: '选择三级类目',
fieldSpan: 18,
model: ''
}
},
brand: {
label: '选择品牌',
labelSpan: 6,
fieldSpan: 18,
model: -1
},
verifyStatus: {
label: '销售状态',
labelSpan: 6,
fieldSpan: 18,
model: -1,
options: [
{
value: -1,
label: '全部'
},
{
value: 0,
label: '已上架'
},
{
value: 1,
label: '已下架'
}
]
},
stockStatus: {
label: '库存情况',
labelSpan: 6,
fieldSpan: 18,
model: -1,
options: [
{
value: -1,
label: '全部'
},
{
value: 1,
label: '有库存'
},
{
value: 0,
label: '无库存'
}
]
},
publishStatus: {
label: '价格状态',
labelSpan: 6,
fieldSpan: 18,
model: -1,
options: [
{
value: -1,
label: '全部'
},
{
value: 0,
label: '启用'
},
{
value: 1,
label: '禁用'
}
]
}
};
let initialFields = JSON.parse(JSON.stringify(filterFields));
let tableCols = [
{
type: 'selection',
width: 60,
align: 'center'
},
{
title: '商品图片',
key: 'image',
align: 'center',
render (row, column, index) {
return `<img class="prd-img" src="${row.picImgUrl}">`;
}
},
{
title: '商品信息',
key: 'info',
align: 'center',
render(row, column, index) {
return `<p>SKN${row.productSkn}</p>
<p>名称:${row.productName}</p>
<p>品牌:${row.brandName}</p>
<p>品类:${row.maxSortName}/${row.middleSortName}/${row.smallSortName}</p>`;
}
},
{
title: '价格(元)',
key: 'price',
align: 'center',
label: 'test',
render(row, column, index) {
row.lineIndex = index;
return `<p>吊牌价:${row.retailPrice}</p>
<p v-if="!row.changePrice">销售价:${row.salesPrice}</p>`;
}
},
{
title: '可售库存',
key: 'stock',
align: 'center',
},
{
key: 'offshelveTime',
align: 'center'
},
{
title: '审核状态',
key: 'verify',
align: 'center',
render(row, column, index) {
return `${auditStatus[row.auditStatus]}`
}
},
{
title: '操作',
key: 'action',
align: 'center',
render: function(row, column, index) {
return `<div class="action-btn-row"><i-button type="primary" size="small" @click="setOnSale(${row.productSkn})">启用</i-button></div>`;
}
}
];
let tableData = [];
let pageData = {
total: 0,
current: 1
};
export {
filterFields,
initialFields,
tableCols,
tableData,
pageData
}
\ No newline at end of file
... ... @@ -14,6 +14,7 @@ const apiUrl = {
updateSellerPrice: '/platform/updateSellerPrice',
queryProdSizeList: '/platform/queryProdSizeList',
saveProdSizeInfo: '/platform/saveProdSizeInfo',
todooutput: '/platform/todooutput',
getSellerAllSortInfo: '/platform/getSellerAllSortInfo'
};
... ... @@ -68,6 +69,15 @@ const productService = {
}
return {};
});
},
exportProductFile(params) {
return axios.post(apiUrl.todooutput, params).then(result => {
if (result.status === 200) {
return result.data;
}
return {};
});
}
};
... ...