@leezeehowe/el-sku
v1.3.0
Published
[![Build Status](https://badgen.net/travis/leezeehowe/el-sku/master)](https://travis-ci.com/leezeehowe/el-sku) [![NPM Download](https://badgen.net/npm/dm/@leezeehowe/el-sku)](https://www.npmjs.com/package/@leezeehowe/el-sku) [![NPM Version](https://badge.
Downloads
17
Maintainers
Readme
el-sku
el-sku
is a vue
component which can bring you a useful and editable table containing SKU and other extra custom fields simply by specification attributes coupled with related values array and some config.
Table of Contents
Features
easy-to-use,simply by a array containing specification attributes coupled with related values.
[ { "id": 1, "prop": "color", "label": "颜色", "values": [ { "id": 11, "text": "黑色" }, { "id": 12, "text": "白色" } ] }, { "id": 2, "prop": "size", "label": "尺寸", "values": [ { "id": 21, "text": "6.4" }, { "id": 22, "text": "5.8" } ] } ]
custom and editable table, not just generate SKUS and show them,
el-sku
has the ability to bring you whatever extra field you wanna collect.const customColumns = [ { prop: 'status', label: '有效', width: 100, default: true }, { prop: 'album', label: '图册', width: 150, default: ['1.jpg', '2.png'] }, { prop: 'marketPrice', label: '市场价', width: 200, default: 0 } ]
custom assistance operation, editing SKU might be taxing, so
el-sku
has some built-in overwritable assistance operations and you can add more simply by aprop
.
const customAssistance = [
{
name: 'autofillStock',
label: '自动填充库存',
prop: 'stock',
cb: function(tableData, editableRow, event) {
return tableData.map(_ => {
if (_.color === '黑色') return 5
})
}
}
]
v-model is fulfilled, you can use v-model to sync tabledata real-time.
There will be more following features...
- built-in submittal using
Axios
. - custom field verifications.
- custom side operation column.
- built-in submittal using
Install
npm i @leezeehowe/el-sku