Vuci vue components

Networking Solutions
1

Hello, I’m trying to create a custom vuci app and whilst I have the vuci-app-example-ui/app example working in a custom firmware I am struggling to find any documentation on the vue components such as vuci-form, vuci-typed-section etc.

1 Like
Vuci-form-item-input validation
3

Hello,

Could you please elaborate a bit more on what exactly you would like to know regarding the Vue files and components?

Internally, what I can find available on Vue files:

  • All .vue files are stored under src/views/{menu} directory.
Example application structure

image

Example .vue file structure

image
image708×814 65.9 KB

vuci-form-api

Props:

  • v-slot and uciData: loads all form data from the application’s configuration.
  • config: specifies which configurations the application supports.
  • after-load: optional, loads additional data from the device when not enough information is available from uciData.

vuci-named-section-api

Props:

  • v-slot and s: loads section information.
  • :uci-data: object that stores all page configurations by data-key.
  • name: UCI section name, can be found in configuration.
  • title: application title / name.
  • endpoints: specifies the endpoint used in this section (must be unique to this section).
  • data-key: key that stores section information in the uci-data object.

Inputs
Commonly used inputs: vuci-item-switch-api, vuci-item-input-api, vuci-item-select-api.

Global props:

  • uci-section and s: configurable section object.
  • label: input label.
  • help: input hint.
  • name: input name.

Input props:

  • placeholder: input placeholder.
  • rules: input validation rules.
  • initial: default value if nothing is specified in the config.
  • depend: option to make one input dependent on another (often used to hide/show inputs dynamically).

Select input props:

  • options: select input options (equivalent to <option></option>).
  • multiple: allows multiple selections.

Let me know if you’d like to know more about a specific component, so I can forward your request to our developers for further clarification.

Best regards,

1 Like
4

Thank you for the information so far.

I think the Teltonika source vue files are NOT included in the SDK as a search for *.vue only finds the Example.vue & ExampleEdit.vue files, which makes learning how they work difficult. Can these files be made publicly accessible?

1 Like
5

Is this going to be possible please?

6

Hello,

Thank you for your question. I’ve forwarded it to our developers and will get back to you as soon as there’s any feedback regarding this topic.

Appreciate your patience in the meantime.

Best regards,

7

Regarding your questions about the source Vue files, please refer to Marija’s post on the topic here:

that were clarified after receiving feedback from our R&D.

Best regards,

8

This topic was automatically closed after 60 days. New replies are no longer allowed.