fe / yoho-shop-manage · Commits

Go to a project

Authored by 陈峰
Commit 97ef8d68dc21a1abeadd8ca79e7569999703b982 1 parent 76ac79ec

render

Inline Side-by-side
Showing 14 changed files with 154 additions and 196 deletions
<template>
<div class="action-btn-row">
<slot></slot>
</div>
</template>
<script>
export default {
name: 'action-group'
};
</script>
<style lang="scss">
.action-btn-row {
button {
margin-top: 10px;
margin-right: 10px;
margin-bottom: 10px;
}
}
</style>
... ...
... ... @@ -8,6 +8,7 @@ import LayoutList from './layout-list';
import LayoutTab from './layout-tab';
import LayoutFilter from './layout-filter';
import LayoutPrint from './layout-print';
import ActionGroup from './action-group';
export default {
UserInfo,
... ... @@ -19,5 +20,6 @@ export default {
LayoutList,
LayoutTab,
LayoutFilter,
LayoutPrint
LayoutPrint,
ActionGroup
};
... ...
... ... @@ -6,7 +6,7 @@
<script>
export default {
name: 'LayoutBody',
name: 'layout-body',
data() {
return {
};
... ...
... ... @@ -192,4 +192,5 @@ div[contenteditable] {
text-align: center;
}
}
</style>
... ...
... ... @@ -145,17 +145,3 @@
}
};
</script>
<style lang="scss">
.action-btn-row {
display: inline-block;
button {
margin-top: 10px;
&:last-child {
margin-bottom: 10px;
}
}
}
</style>
... ...
... ... @@ -106,13 +106,3 @@
}
};
</script>
<style lang="scss">
.action-btn-row {
button {
margin-top: 10px;
margin-right: 10px;
margin-bottom: 10px;
}
}
</style>
... ...
... ... @@ -332,13 +332,3 @@
}
};
</script>
<style lang="scss">
.action-btn-row {
button {
margin-top: 10px;
margin-right: 10px;
margin-bottom: 10px;
}
}
</style>
... ...
... ... @@ -41,8 +41,10 @@ export default {
key: 'sizeName',
align: 'center',
width: 250,
render(row) {
return `${row.factoryGoodsName}/${row.sizeName}`;
render: (h, params) => {
return (
<span>{params.row.factoryGoodsName}/{params.row.sizeName}</span>
);
}
},
{
... ... @@ -50,8 +52,13 @@ export default {
key: 'number',
align: 'center',
width: 250,
render() {
return '<i-input v-model="row.number" :maxlength="5"></i-input>';
render: (h, params) => {
return (
<i-input
value={params.row.number}
maxlength={5}
onInput={val => (params.row.number = val)}></i-input>
);
}
}
],
... ...
... ... @@ -37,15 +37,17 @@
import {SelectBrand, SelectCategory} from 'components/select';
import EditStore from './components/edit-store';
import ImportStore from './components/import-store';
import {tableCols, tableData, pageData} from './store';
import store from './store';
export default {
data() {
let storeData = store.apply(this);
return {
self: this,
tableCols,
tableData,
pageData,
tableCols: storeData.tableCols,
tableData: storeData.tableData,
pageData: storeData.pageData,
categoryValue: [],
filters: {
sknCode: {
... ...
... ... @@ -3,77 +3,80 @@
* @author: qi.li <qi.li@yoho.cn>
* @date: 2017/04/13
*/
let tableCols = [
{
title: 'SKN',
key: 'productSkn',
align: 'center'
},
{
title: '图片',
key: 'image',
align: 'center',
render() {
return '<div> <img v-prod-img="row.productSkn"> </div>';
export default function() {
return {
tableCols: [{
title: 'SKN',
key: 'productSkn',
align: 'center'
},
{
title: '图片',
key: 'image',
align: 'center',
render: (h, params) => {
return (
<img v-prod-img={params.row.productSkn}/>
);
}
},
{
title: '商品名称',
key: 'productName',
align: 'center',
},
{
title: '品牌',
key: 'brandName',
align: 'center',
},
{
title: '库存',
key: 'storage',
align: 'center',
render: (h, params) => {
return (
<span>{params.row.storage || 0}</span>
);
}
},
{
title: '销售价',
key: 'salePrice',
align: 'center',
render: (h, params) => {
return (
<span>{params.row.salePrice || 0}</span>
);
}
},
{
title: '更新时间',
key: 'editTime',
align: 'center',
render: (h, params) => {
return (
<span>{params.row.editTime || '-'}</span>
);
}
},
{
title: '操作',
key: 'action',
align: 'center',
render: (h, params) => {
return (
<action-group>
<i-button type="primary" size="small" onClick={() => this.editStore(params.row)}>库存编辑</i-button>
</action-group>
);
}
}],
tableData: [],
pageData: {
total: 0,
current: 1,
pageSize: 20
}
},
{
title: '商品名称',
key: 'productName',
align: 'center',
},
{
title: '品牌',
key: 'brandName',
align: 'center',
},
{
title: '库存',
key: 'storage',
align: 'center',
render(row) {
return row.storage ? row.storage : 0;
}
},
{
title: '销售价',
key: 'salePrice',
align: 'center',
render(row) {
return row.salePrice || 0;
}
},
{
title: '更新时间',
key: 'editTime',
align: 'center',
render(row) {
return row.editTime || '-';
}
},
{
title: '操作',
key: 'action',
align: 'center',
render: function() {
return `<div class="action-btn-row">
<i-button type="primary" size="small" @click="editStore(row)">库存编辑</i-button>
</div> `;
}
}
];
let tableData = [];
let pageData = {
total: 0,
current: 1,
pageSize: 20
};
export {
tableCols,
tableData,
pageData
};
};
}
... ...
... ... @@ -19,7 +19,7 @@
promise(this.categoryId, this.product.productSKN).then(result => {
if (result.code === 200) {
this.product.checked = isSelected;
this.$emit('on-change-status', this.product, isSelected);
this.$emit('change', this.product, isSelected);
}
});
}
... ...
... ... @@ -65,8 +65,13 @@
{
title: '商品图片',
key: 'productPic',
render: function() {
return '<div><img :src="row.productPic" style="max-width: 80px;" alt=""></div>';
align: 'center',
render: (h, params) => {
return (
<div>
<img src={params.row.productPic} style={{'max-width': '80px'}} />
</div>
);
}
},
{
... ... @@ -88,8 +93,10 @@
{
title: '上下架状态',
key: 'status',
render: function() {
return '{{sellStatus(row.status)}}';
render: (h, params) => {
return (
<span>{this.sellStatus(params.row.status)}</span>
);
}
},
{
... ... @@ -99,16 +106,28 @@
{
title: '商品分类',
key: 'saleCategory',
render: function() {
return '<div v-for="i in row.saleCategory">{{i}}</div>';
render: (h, params) => {
return (
<div>
{params.row.saleCategory.map(cate => {
return (
<div>{cate}</div>
);
})}
</div>
);
}
},
{
title: '操作',
key: 'checked',
render: function() {
return `<Operator :category-id="categoryId" :product="row"
@on-change-status="onChangeStatus"> </Operator>`;
render: (h, params) => {
return (
<Operator
category-id={this.categoryId}
product={params.row}
onChange={this.onChangeStatus}></Operator>
);
}
}
],
... ...
... ... @@ -49,12 +49,14 @@
key: 'action',
width: 250,
align: 'center',
render: function() {
return `<div class="action-btn-row">
<i-button type="info" size="small" @click="clickEditName(row)">编辑名称</i-button>
<i-button type="primary" size="small" @click="clickEditRelation(row)">关联商品</i-button>
<i-button type="error" size="small" @click="clickDelete(row)">删除</i-button>
</div>`;
render: (h, params) => {
return (
<action-group>
<i-button type="info" size="small" onClick={() => this.clickEditName(params.row)}>编辑名称</i-button>
<i-button type="primary" size="small" onClick={() => this.clickEditRelation(params.row)}>关联商品</i-button>
<i-button type="error" size="small" onClick={() => this.clickDelete(params.row)}>删除</i-button>
</action-group>
);
}
}
],
... ...
<template>
<LayoutBody>
<LayoutFilter>
<FilterItem label="店铺">
</FilterItem>
<FilterItem label="品牌">
<SelectBrand v-model="query.brandId"></SelectBrand>
</FilterItem>
<FilterItem label="开店状态">
</FilterItem>
<FilterItem label="装修状态">
</FilterItem>
<FilterItem>
<Button type="primary" >筛选</Button>
<Button >清空条件</Button>
</FilterItem>
</LayoutFilter>
<LayoutList>
<Table border :context="self" :data="data" :columns="columns"></Table>
</LayoutList>
</LayoutBody>
</template>
<script>
import {SelectBrand} from 'components/select';
export default {
data() {
return {
self: this,
query: {},
data: [],
columns: [{
title: '店铺ID',
key: 'shopName',
}, {
title: '店铺名称',
key: 'shopName',
}, {
title: '品牌',
key: 'shopName',
}, {
title: '发布时间',
key: 'shopName',
}, {
title: '状态',
key: 'shopName',
}, {
title: '操作',
render() {
return `
<i-button type="primary" size="small" >尺码维护</i-button>
<i-button type="primary" size="small">内容编辑</i-button>
`;
}
}]
};
},
components: {SelectBrand}
};
</script>