test.vue 2.76 KB
<template lang="html">
  <div class="">
    <select-list :show="show" :title="'请选择物料'" :caption="'所有分类的物料'" :list="list" :shortcut="shortcut_list" :span="2" @cancel="cancel" @comfirm="comfirm"></select-list>
    <div @click="showList">
      显示
    </div>
  </div>
</template>

<script>
import selectList from 'components/selectList/index'

export default {
  components: { selectList },
  data () {
    return {
      show: false,
      list: [{
        category: '所有肉类的物料',
        sum: 2,
        material_list: [{
          sku_id: 1,
          sku_name: 'XX物料',
          checked: false,
          disabled: true
        }, {
          sku_id: 2,
          sku_name: 'XX物料',
          checked: false,
          disabled: false
        }]
      }, {
        category: '所有蔬菜类的物料',
        sum: 2,
        material_list: [{
          sku_id: 11,
          sku_name: 'XX物料',
          checked: false,
          disabled: false
        }, {
          sku_id: 22,
          sku_name: 'XX物料',
          checked: false,
          disabled: false
        }]
      }, {
        category: '所有蘑菇类的物料',
        sum: 2,
        material_list: [{
          sku_id: 33,
          sku_name: 'XX物料',
          checked: false,
          disabled: false
        }, {
          sku_id: 44,
          sku_name: 'XX物料',
          checked: false,
          disabled: false
        }]
      }],
      shortcut_list: [{
        sku_name: '蔬菜类12+水果8',
        sum: 2,
        list: [{
          sku_id: 1,
          sku_name: 'XX物料'
        }, {
          sku_id: 2,
          sku_name: 'XX物料'
        }],
        checked: false
      }, {
        sku_name: '肉类10+小器具12',
        sum: 2,
        list: [{
          sku_id: 11,
          sku_name: 'XX物料'
        }, {
          sku_id: 22,
          sku_name: 'XX物料'
        }],
        checked: false
      }, {
        sku_name: '肉类10+小器具12',
        sum: 4,
        list: [{
          sku_id: 33,
          sku_name: 'XX物料'
        }, {
          sku_id: 44,
          sku_name: 'XX物料'
        }, {
          sku_id: 55,
          sku_name: 'XX物料'
        }, {
          sku_id: 66,
          sku_name: 'XXxxxxx物料'
        }, {
          sku_id: 77,
          sku_name: 'XX物料'
        }, {
          sku_id: 88,
          sku_name: 'XX物料'
        }, {
          sku_id: 99,
          sku_name: 'XX物料'
        }, {
          sku_id: 100,
          sku_name: 'XX物料'
        }],
        checked: false
      }]
    }
  },
  methods: {
    showList () {
      this.show = true;
    },
    cancel (v) {
      this.show = v;
    },
    comfirm (v) {
      console.warn(v);
    }
  }
}
</script>

<style lang="less">
</style>