gt-searchbar v0.1.3

gt-searchbar

Project setup

npm install --save git+http://git.china95059.com/gt-components/gt-searchbar.git

搜索条 暂时不支持时间

props:

methods:

items：

events:

    <gt-searchbar
        ref="searchbar"
        :items="items"
        @onSearch="onSearch"
      ></gt-searchbar>

      export default {
          data(){
              return {
                   items: [
                        {
                        label: '关键字',
                        value: 'keyword',
                        props: {
                            placeholder: 1,
                            type: 'number'
                        },
                        events: {
                            change: () => {
                            console.log(1);
                            }
                        }
                        },
                        {
                        label: '客户检索',
                        value: 'username',
                        type: 'input',
                        props: {}
                        },
                        {
                        label: '所属项目1',
                        value: 'project1',
                        type: 'select',
                        props: {},
                        options: () => this.data
                        },
                        {
                        label: '所属项目',
                        value: 'project',
                        type: 'select',
                        props: {
                            multiple: true
                        },
                        options: [
                            {
                            label: '一',
                            value: 1
                            },
                            {
                            label: '二',
                            value: 2
                            }
                        ]
                        },
                        {
                        label: '时间选择',
                        value: 'timerange',
                        type: 'timePicker',
                        props: {
                            'value-format': 'HH:mm:ss'
                        }
                        },
                        {
                        label: '日期选择',
                        value: 'datarange',
                        type: 'datePicker',
                        props: {
                            type: 'datetimerange',
                            'value-format': 'yyyy-MM-dd HH:mm:ss'
                        }
                        },
                        {
                        label: '级联选择器',
                        value: 'cascader',
                        type: 'cascader',
                        props: {
                            options: [
                            {
                                value: 'zhinan',
                                label: '指南',
                                children: [
                                {
                                    value: 'shejiyuanze',
                                    label: '设计原则',
                                    children: [
                                    {
                                        value: 'yizhi',
                                        label: '一致'
                                    },
                                    {
                                        value: 'fankui',
                                        label: '反馈'
                                    },
                                    {
                                        value: 'xiaolv',
                                        label: '效率'
                                    },
                                    {
                                        value: 'kekong',
                                        label: '可控'
                                    }
                                    ]
                                }
                                ]
                            }
                            ]
                        }
                        }
                    ],
                  searchModels:{}
              }
          },
          methods:{
              onSearch(models){
                  this.searchModels = models;
              },
              setReadOnly(bool){
                  this.$refs.searchbar.setReadOnly(bool)
              }
          }
      }