Wondering what’s next for npm?Check out our public roadmap! »

    @leezeehowe/el-sku

    1.3.0 • Public • Published

    el-sku

    Build Status NPM Download NPM Version NPM License PRs Welcome Automated Release Notes by gren

    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.

    basic function

    在线示例及 API 文档

    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 a prop.

    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.

    ⬆ Back to Top

    Install

    npm i @leezeehowe/el-sku
    

    ⬆ Back to Top

    Links

    License

    MIT

    ⬆ Back to Top

    Install

    npm i @leezeehowe/el-sku

    DownloadsWeekly Downloads

    7

    Version

    1.3.0

    License

    MIT

    Unpacked Size

    29.5 kB

    Total Files

    13

    Last publish

    Collaborators

    • avatar