eSignGlobalSuportahan ang mga advanced na configuration ng katangian para sa mga custom na component kapag lumilikha ng mga smart form:
- Gamit ang function na [Configuration ng Kaganapan] maaari kang magsagawa ng real-time na simpleng pagkalkula ng formula sa mga input value ng maraming component ng pagkolekta ng impormasyon, at ang mga resulta ng pagkalkula ay awtomatikong ipapakita sa target na component;
- Gamit ang function na [Configuration ng Aksyon] maaari kang tumawag sa generator kapag ang isang kontrol ng form ay nagsasagawa ng isang aksyon na gawain, tulad ng pagsasagawa ng custom na kumplikadong pagkalkula at pagtatalaga nito sa kaukulang component, gamit ang JavaScript upang ipatupad ang iyong sariling lohika ng negosyo.
Configuration ng Kaganapan
Panimula sa Function
Kalkulahin ang mga input value ng maraming component ng pagkolekta ng impormasyon sa real time sa pamamagitan ng pagkalkula ng formula, at awtomatikong ipakita ang mga resulta ng pagkalkula sa target na component. Ang function na ito ay gumagamit ng visual na formula upang mapagtanto ang pagbubuklod ng component at tumutugong pag-update, at maaaring kumpletuhin ang kumplikadong pagkalkula ng lohika ng negosyo nang hindi nagsusulat ng code.
Paliwanag:
- Ang function ng configuration ng kaganapan ay kasalukuyang sumusuporta lamang sa pagdaragdag, pagbabawas, pagpaparami, at paghahati.
Mga Sitwasyon ng Aplikasyon
Naaangkop sa mga sitwasyon kung saan kinakailangan ang real-time na pagpapakita pagkatapos ng simpleng pagkalkula, tulad ng:
- Real-time na pagkalkula ng kabuuang presyo kasama ang buwis sa form ng order ng pagbili: (presyo ng unit * bilang) * (1 + rate ng buwis/100)
- Dynamic na pagkalkula ng kahusayan sa pagpapatakbo ng kagamitan: (kasalukuyang * boltahe * oras ng pagtakbo) / 1000
Paano Gamitin
Halimbawa, kalkulahin ang kabuuang presyo kasama ang buwis batay sa real-time na purchase order:
- Mag-drag ng apat na numeric field sa form: Presyo ng Unit, Dami, Rate ng Buwis, Kabuuang Presyo kasama ang Buwis.
Paliwanag:
- Ang function ng pagkalkula ay naaangkop lamang sa mga numeric field.
- Kung magdagdag ng text field, sinusuportahan lamang nito ang function na "+" upang maisakatuparan ang string concatenation, at sa oras na ito, ang uri ng target field ay dapat ding text field.
- Sa configuration panel ng field na [Presyo ng Unit], magdagdag ng event sa [Mga Advanced na Katangian] > [Configuration ng Event]。
- Sa [Configuration ng Event], i-configure ang function na ma-trigger kapag ang [Uri ng Trigger] ay [Pagbabago ng Field].
- I-edit ang formula ng pagkalkula: Ipasok ang “@” + pangalan ng component, upang maidagdag ang field na gusto mong kalkulahin;
Isulat ang formula ayon sa pangangailangan, tulad ng: (Presyo ng Unit * Dami) * (1 + Rate ng Buwis/100).
Paalala:
- Kapag gumagamit ng mga panaklong, mangyaring gumamit ng mga panaklong sa Ingles na "()".
- Piliin ang field na kailangang ipakita ang resulta ng pagkalkula sa [Target Field]。Iko-convert namin ang uri ng field na kasangkot sa pagkalkula batay sa uri ng data ng target field.
Paalala:
- Ang uri ng target field ay dapat na kapareho ng uri ng field na kasangkot sa pagkalkula.
- Lahat ng field na kasali sa pagkalkula ay kailangang i-configure ang formula na ito, upang makamit na sa tuwing magbabago ang halaga ng bawat field na kasali sa pagkalkula, muling kakalkulahin ito. Tulad sa sitwasyong ito, ang [Presyo ng Yunit], [Bilang], [Rate ng Buwis] ay kailangang itakda ang configuration ng event na ito.
Paalala:
- Hindi kailangang i-configure ang [Target na Field].
- Pagkatapos ng configuration, i-save ang form.
Configuration ng Aksyon
Pagpapakilala sa Function
Maaaring sumulat ang mga user ng javascript code sa [Mga Advanced na Katangian] > [Mga Setting ng Aksyon] upang maisakatuparan ang kanilang sariling lohika ng negosyo.
Mga Sitwasyon ng Aplikasyon
- Mga kumplikadong pagkalkula ng halaga ng field na hindi makukumpleto sa pamamagitan ng simpleng function ng [Pagkalkula ng Formula]. Tulad ng pag-convert ng nilalaman na ipinasok sa isang linya ng teksto sa isang numero, at pagkatapos, pagkatapos kalkulahin sa pamamagitan ng mga custom na panuntunan sa pagkalkula, itakda ito sa isa o higit pang field;
- Kapag ang isang kontrol sa form ay naganap sa isang aksyon, tawagan ang paraan ng generator.
Paano Gamitin
1. Buksan ang js editing panel
- Piliin ang kontrol;
- I-click ang [Mga Advanced na Katangian] upang lumipat sa kaukulang panel;
- I-click ang [Mga Setting ng Aksyon] > [Bagong Aksyon];
- Piliin ang katumbas na aksyon sa lumalabas na dropdown menu, kapag na-trigger ang katumbas na aksyon, ipapatupad nito ang JS code na isinulat mo; kasalukuyang sinusuportahan ang sumusunod na apat na aksyon:
- mounted, pagkatapos i-load ang component
- onBlur, kapag nawala ang focus ng component
- onChange, kapag nagbago ang value ng component
- onFocus, kapag napili ang component
Paliwanag:
- Kung kailangan mong itakda ang [mounted pagkatapos i-load ang component], kailangan mo munang piliin ang isa sa natitirang tatlong estado, sa pahinang lilipat, i-click ang [I-save] sa kanang itaas, pagkatapos ay piliin ang [mounted] sa kaliwa.
- Sumulat ng code sa js editing panel; bukod sa karaniwang pagsulat ng code, sa susunod na kabanata, ituturo namin sa iyo kung paano magpasok ng parameter, maglabas ng parameter at ang kasalukuyang sinusuportahang function. Narito ang preview ng js panel:
2. Pagkuha ng Parameter ng Event
Kapag kailangan mong magpasok ng parameter, tulad ng: pagpasa ng value ng ibang component sa code para iproseso, isulat ang sumusunod:
function () {
this.models[fieldKey]
//示例：this.models[' input_yi7bli17 ']
}
2.1. Kunin ang kasalukuyang katangian ng component
Sa event function, makukuha ang value ng attribute sa pamamagitan ng arguments[0], tulad ng sumusunod:
function () {
const { field} = arguments[0]
}
At sa iba't ibang aksyon, iba rin ang mga component attribute na makukuha, tingnan ang detalye sa ibaba:
2.1.1. onBlur
Makukuha ang component nafieldKey，ang fieldKey ay string type, halimbawa:
function () {
//表示获取当前组件的值
const { field } = arguments[0]
this.models['input_pr13o8wi']=field
}
2.1.2. onChange
Makukuha ang component nafieldKeyatvalue，ang kanilang data type ay{ field: string, value: any }
Kahulugan ng katangian:
- field: Susi ng field
- value: Halaga ng field
2.1.3. onFocus
Katulad ng onBlur
2.2. Detalyadong Paliwanag ng Function [this]
Maliban sa pagkuha ng mga katangian ng component, sinusuportahan din namin ang pagkuha ng mga katangian ng iba pang mga component.
Sa function ng aksyon, ang this ay tumutukoy sa GenerateForm instance, na nangangahulugang maaari kang direktang tumawag sa mga pamamaraan sa GenerateForm.
Dito namin binibigyang-diin: Sa this function, ang pagdadala sa susi ng component ay maaaring makuha ang halaga nito o isulat ang halaga sa kaukulang fieldKey, tulad ng: this.models['fieldKey']
function () {
// 获取表单值
this.getData()
// 设置表单字段的值
this.models['id'] = 'new value'
// 触发某个编写好的函数
this.triggerEvent('foo', { a: 123 })
// 显示表单隐藏的字段
this.display('id')
}
3. Pagsulat ng code
Pagkatapos makuha ang mga gustong katangian o halaga, maaari kang direktang magsulat ng code, tulad ng sumusunod:
const keyA = 'input_yi7bli17'const keyB = 'input_78qtmi79'const keyC = 'input_n8qwf66f'this.models[keyC] = this.models[keyA] + this.models[keyB]
3.1. Mga suportadong function
Gamitin ang triggerEvent sa function upang tawagin ang function:
function () {
this.triggerEvent('test', { id: '123' })
}
Sa test method, maaari mong makuha ang mga parameter sa sumusunod na paraan:
function () {
const { id } = arguments[0]
}
4. Pagpapatakbo
I-click ang "Preview" ng form upang ma-trigger ang kaukulang aksyon, at makikita mo ang epekto.
5. Halimbawa
Halimbawa: Kunin ang kasalukuyang halaga ng component at italaga ito sa isa pang component, ang Key ng isa pang component ay input_69m9x9mj
