@vagrantir/rc-device-targeting

rc-dropdown

Project setup

npm i @vagrantir/rc-dropdown

Using component

import DeviceTargeting from './components/DeviceTargeting.vue';

Vue.component('DeviceTargeting', DeviceTargeting)

<DeviceTargeting :value="targeting" :change="changeTargeting" :data-options="{disable_search: false}"/>

Properties

const props = {
                value: {
                  type: [Array],
                  default() {
                    return [];
                  },
                },
                targetings: {
                  type: [Array],
                  default() {
                    return [
                      {
                        value: 1,
                        name: 'Desktop',
                        oses: [],
                        enabled: true
                      },
                      {
                        value: 2,
                        name: 'Mobile',
                        oses: [
                          {
                            value: 3,
                            name: 'iOS',
                            versions: [],
                            enabled: true
                          },
                          {
                            value: 2,
                            name: 'Android',
                            versions: [],
                            enabled: true
                          },
                        ],
                        enabled: true
                      },
                      {
                        value: 3,
                        name: 'Tablet',
                        oses: [],
                        enabled: true
                      },
                    ];
                  },
                },
                settings: {
                  type: [Object],
                  default() {
                    return {
                    allOsText: 'All OS',
                    onlyOsText: 'Only {{name}}',
                    disabledHintText: 'Not allowed for editing',
                    allowMultipleOsSelection: false,
                    allowVersionSellection: false,
                    zeroEqualAll: true,
                    };
                  },
                },
                disabled: {
                  type: [Boolean],
                  default() {
                    return false;
                  },
                },
              }             

Compiles and hot-reloads for development

npm run serve

Compiles and minifies for production

npm run build

Lints and fixes files

npm run lint

Run your unit tests

npm run test:unit