Introduction to the

FormMaking is a VUe-based visual form designer that enables enterprises to implement low-code development patterns. Help developers from the traditional boring form code free, more focus on business, quickly improve efficiency, save research and development costs. It is widely used in OA system, examination system, report system, process management and other systems. Based on VUE and Elemen-UI implementation, using the latest front-end technology stack, built-in I18N internationalization solution, support secondary development, support the introduction of custom components.

Provide form designer (MakingForm) and form generator (GenerateForm) two components, through the form designer to quickly design the form page, generate configurable JSON and can run directly the code, use the form generator to quickly render the form page, and provide a rich operation API.

Technical documentation

  • Liverpoolfc.tv: form, making the link
  • Presentation: form. Making. The link/sample
  • Documents: www.yuque.com/ln7ccx/ntgo…
  • Contact us at form.making. Link /contact

Update the content

The data source

This update mainly adds a data source to form designer, enabling convenient interaction between form and back-end data. By configuring the data source, you can easily get the back-end data. The data source configuration also adopts the common interface configuration mode.

You can use the following GIF to get a sense of how the data source is configured:

For detailed configuration methods, see the official document configuration data source.

The designer initializes the configuration

The form designer can perform some global configuration at initialization, such as the UI library to use, the form’s style sheet, the data source, and so on.

<template>
  <fm-making-form ref="makingForm" clearable upload preview generate-code generate-json
    :global-config="globalConfig"
  >
  </fm-making-form>
</template>

<script>
export default {
  data() {
    return {
      globalConfig: {
        // You can put the form's default style into the designer
        styleSheets: '.a .el-form-item__label{color: red; } '.dataSource: [{key: 'getoptions'.// The unique value specified
            name: 'Get Options'.// Data source name, unique value
            url: 'http://tools-server.making.link/api/new/options'.// Request the interface address
            method: 'GET'.auto: true.// Whether to send the request when the form is initialized
            responseFunc: 'return res.data'.// Data processing function contents
            headers: {}, // Data request header, optional
            params: {}, // Data request parameters, optional
            
            // Params is committed as a query parameter when method == 'GET', otherwise in the body.}]}}}}</script>
Copy the code

See API Global Config Options for more configurations.

Other known problem fixes and optimizations

Optimize and fix problems according to user feedback.

The last word

FormMaking continues to improve its functionality to help organizations customize forms quickly. If you have any questions, suggestions or requirements, please feel free to contact us.