Skip to content

Commit b125f86

Browse files
Pratap2018Pratap2018
authored
Merge pull request #44 from hypersign-protocol/multiselect-onchain
Multiselect onchain
2 parents eb6e84e + c8dd712 commit b125f86

File tree

2 files changed

+141
-147
lines changed

2 files changed

+141
-147
lines changed

‎src/App.vue

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -75,7 +75,7 @@
7575
}
7676
</style>
7777
<template>
78-
<div id="app">
78+
<div id="app" data-app>
7979
<load-ing :active.sync="isLoading" :can-cancel="true" :is-full-page="true"></load-ing>
8080

8181
<b-navbar toggleable="lg" type="dark" variant="white" class="navStyle" v-if="getIsLoggedOut" sticky>

‎src/views/playground/WidgetConfig/Index.vue

Lines changed: 140 additions & 146 deletions
Original file line numberDiff line numberDiff line change
@@ -153,185 +153,178 @@ ul {
153153
</v-col>
154154
</v-row>
155155

156-
<v-card >
157-
<ul class="list-group list-group-flush" >
158-
<li class="list-group-item">
159-
<b-form-checkbox switch size="lg" v-model="widgetConfigTemp.faceRecog" disabled>{{
160-
this.widgetConfigUI.faceRecog.label }}</b-form-checkbox>
161-
<small v-html="this.widgetConfigUI.faceRecog.description">
162-
</small>
163-
</li>
164-
<li class="list-group-item">
165-
<div class="row">
166-
<div class="col">
167-
<b-form-checkbox switch size="lg" v-model="widgetConfigTemp.idOcr.enabled">
168-
{{ this.widgetConfigUI.idOcr.label }}</b-form-checkbox>
169-
<small v-html="this.widgetConfigUI.idOcr.description"></small>
170-
</div>
171-
<!-- <div class="col" v-if="widgetConfigTemp.idOcr.enabled && documentTypeOptions.length > 0">
156+
<v-card>
157+
<ul class="list-group list-group-flush">
158+
<li class="list-group-item">
159+
<b-form-checkbox switch size="lg" v-model="widgetConfigTemp.faceRecog" disabled>{{
160+
this.widgetConfigUI.faceRecog.label }}</b-form-checkbox>
161+
<small v-html="this.widgetConfigUI.faceRecog.description">
162+
</small>
163+
</li>
164+
<li class="list-group-item">
165+
<div class="row">
166+
<div class="col">
167+
<b-form-checkbox switch size="lg" v-model="widgetConfigTemp.idOcr.enabled">
168+
{{ this.widgetConfigUI.idOcr.label }}</b-form-checkbox>
169+
<small v-html="this.widgetConfigUI.idOcr.description"></small>
170+
</div>
171+
<!-- <div class="col" v-if="widgetConfigTemp.idOcr.enabled && documentTypeOptions.length > 0">
172172
<div class="">
173173
<label for=""><strong>Select Document Type: </strong></label>
174174
<b-form-select v-model="widgetConfigTemp.idOcr.documentType" :options="documentTypeOptions"
175175
size=""></b-form-select>
176176
</div>
177177
</div> -->
178-
</div>
179-
</li>
180-
<li class="list-group-item">
178+
</div>
179+
</li>
180+
<li class="list-group-item">
181+
<div class="row">
182+
<div class="col-md-6">
181183
<div class="row">
182-
<div class="col-md-6">
183-
<div class="row">
184-
<div class="col-md-12">
185-
<b-form-checkbox switch size="lg" v-model="widgetConfigTemp.zkProof.enabled">{{
186-
this.widgetConfigUI.zkProof.label }}<HFBeta></HFBeta>
187-
</b-form-checkbox>
188-
<small v-html="this.widgetConfigUI.zkProof.description"></small>
189-
</div>
190-
</div>
191-
<div class="mt-2 mx-0 p-1"
192-
style="border: 2px solid #8080802e; border-radius: 10px; min-height: 80px; padding:10px"
193-
v-if="widgetConfigTemp.zkProof.proofs.length > 0">
194-
<div class="">
195-
<span class="zkbadge rounded " style="cursor: grab;" @click="deleteZkProof(proof.proofType)"
196-
v-for="proof in widgetConfigTemp.zkProof.proofs" v-bind:key="proof.proofType"><b-icon
197-
style="color:green;" icon="check-circle" aria-hidden="true"></b-icon>
198-
<span v-if="proof.proofType == SupportedZkProofTypes.PROOF_OF_AGE">
199-
{{ proof.proofType }} > {{ proof.criteria }}
200-
</span>
201-
<span v-else>
202-
{{ proof.proofType }}
203-
</span>
204-
205-
<b-icon class="trash" style="color:red" icon="trash" aria-hidden="true"></b-icon></span>
206-
</div>
207-
</div>
184+
<div class="col-md-12">
185+
<b-form-checkbox switch size="lg" v-model="widgetConfigTemp.zkProof.enabled">{{
186+
this.widgetConfigUI.zkProof.label }}<HFBeta></HFBeta>
187+
</b-form-checkbox>
188+
<small v-html="this.widgetConfigUI.zkProof.description"></small>
208189
</div>
190+
</div>
191+
<div class="mt-2 mx-0 p-1"
192+
style="border: 2px solid #8080802e; border-radius: 10px; min-height: 80px; padding:10px"
193+
v-if="widgetConfigTemp.zkProof.proofs.length > 0">
194+
<div class="">
195+
<span class="zkbadge rounded " style="cursor: grab;" @click="deleteZkProof(proof.proofType)"
196+
v-for="proof in widgetConfigTemp.zkProof.proofs" v-bind:key="proof.proofType"><b-icon
197+
style="color:green;" icon="check-circle" aria-hidden="true"></b-icon>
198+
<span v-if="proof.proofType == SupportedZkProofTypes.PROOF_OF_AGE">
199+
{{ proof.proofType }} > {{ proof.criteria }}
200+
</span>
201+
<span v-else>
202+
{{ proof.proofType }}
203+
</span>
204+
205+
<b-icon class="trash" style="color:red" icon="trash" aria-hidden="true"></b-icon></span>
206+
</div>
207+
</div>
208+
</div>
209209

210-
<div class="col" v-if="widgetConfigTemp.zkProof.enabled">
211-
<div class="row">
212-
<div class="col">
213-
<label for=""><strong>Select Proof Type: </strong></label>
214-
215-
216-
<b-input-group>
217-
<!-- Dropdown -->
218-
<b-form-select
219-
v-model="slectProof"
220-
:options="proofTypeOptions"
221-
class="form-select"
222-
></b-form-select>
223-
224-
<b-input-group-append v-if="selectedProofData.criteria">
225-
<b-form-input
226-
v-model="selectedProofData.criteriaValue"
227-
placeholder="Enter age"
228-
:type="selectedProofData.criteriaType"
229-
></b-form-input>
230-
</b-input-group-append>
231-
232-
<!-- Add Button -->
233-
<b-input-group-append v-if="selectedProofData.value != null">
234-
<HfButtons name="" customClass="btn btn-outline-secondary" iconClass="fa fa-plus"
235-
@executeAction="addZkProof(selectedProofData.value, selectedProofData.criteriaValue)">
236-
</HfButtons>
237-
</b-input-group-append>
238-
</b-input-group>
239-
<small>{{ selectedProofData.description }}</small>
210+
<div class="col" v-if="widgetConfigTemp.zkProof.enabled">
211+
<div class="row">
212+
<div class="col">
213+
<label for=""><strong>Select Proof Type: </strong></label>
214+
215+
216+
<b-input-group>
217+
<!-- Dropdown -->
218+
<b-form-select v-model="slectProof" :options="proofTypeOptions" class="form-select"></b-form-select>
219+
220+
<b-input-group-append v-if="selectedProofData.criteria">
221+
<b-form-input v-model="selectedProofData.criteriaValue" placeholder="Enter age"
222+
:type="selectedProofData.criteriaType"></b-form-input>
223+
</b-input-group-append>
224+
225+
<!-- Add Button -->
226+
<b-input-group-append v-if="selectedProofData.value != null">
227+
<HfButtons name="" customClass="btn btn-outline-secondary" iconClass="fa fa-plus"
228+
@executeAction="addZkProof(selectedProofData.value, selectedProofData.criteriaValue)">
229+
</HfButtons>
230+
</b-input-group-append>
231+
</b-input-group>
232+
<small>{{ selectedProofData.description }}</small>
240233

241-
</div>
242-
</div>
243234
</div>
244235
</div>
245-
</li>
246-
<li class="list-group-item">
236+
</div>
237+
</div>
238+
</li>
239+
<li class="list-group-item">
240+
<div class="row">
241+
<div class="col-md-6">
242+
<b-form-checkbox switch size="lg" v-model="widgetConfigTemp.onChainId.enabled">{{
243+
this.widgetConfigUI.onChainId.label }} <HFBeta></HFBeta></b-form-checkbox>
244+
<small v-html="this.widgetConfigUI.onChainId.description"></small>
245+
</div>
246+
<div class="col" v-if="widgetConfigTemp.onChainId.enabled && onchainconfigsOptions.length > 0">
247+
<div class="">
248+
<label for=""><strong>Select OnChain KYC Config: </strong></label>
249+
<v-select small-chips v-model="widgetConfigTemp.onChainId.selectedOnChainKYCconfiguration"
250+
:items="onchainconfigsOptions" item-text="text" item-value="value" multiple></v-select>
251+
</div>
252+
</div>
253+
</div>
254+
</li>
255+
256+
<li class="list-group-item" v-if="widgetConfigTemp.userConsent.enabled">
257+
<div class="row">
258+
<div class="col">
247259
<div class="row">
248-
<div class="col-md-6">
249-
<b-form-checkbox switch size="lg" v-model="widgetConfigTemp.onChainId.enabled">{{
250-
this.widgetConfigUI.onChainId.label }} <HFBeta></HFBeta></b-form-checkbox>
251-
<small v-html="this.widgetConfigUI.onChainId.description"></small>
260+
<div class="col-md-12">
261+
<b-form-checkbox switch size="lg" v-model="widgetConfigTemp.userConsent.enabled" disabled>{{
262+
this.widgetConfigUI.userConsent.label }}</b-form-checkbox>
263+
<small v-html="widgetConfigUI.userConsent.description"></small>
252264
</div>
253-
<div class="col" v-if="widgetConfigTemp.onChainId.enabled && onchainconfigsOptions.length > 0">
254-
<div class="">
255-
<label for=""><strong>Select OnChain KYC Config: </strong></label>
256-
<b-form-select v-model="widgetConfigTemp.onChainId.selectedOnChainKYCconfiguration"
257-
:options="onchainconfigsOptions" size=""></b-form-select>
265+
</div>
266+
<div class="row mt-2 mx-0 p-1"
267+
style="border: 2px solid #8080802e;border-radius: 10px; min-height: 115px;">
268+
<div class="col-md-3 center">
269+
<div style="border: 1px solid #8080802e; border-radius: 50%;" class="p-1">
270+
<img :src="widgetConfigTemp.userConsent.logoUrl" v-if="widgetConfigTemp.userConsent.logoUrl"
271+
style="height: 50px; border-radius: 50%;">
258272
</div>
259273
</div>
260-
</div>
261-
</li>
262-
263-
<li class="list-group-item" v-if="widgetConfigTemp.userConsent.enabled">
264-
<div class="row">
265-
<div class="col">
274+
<div class="col-md-8">
266275
<div class="row">
267-
<div class="col-md-12">
268-
<b-form-checkbox switch size="lg" v-model="widgetConfigTemp.userConsent.enabled" disabled>{{
269-
this.widgetConfigUI.userConsent.label }}</b-form-checkbox>
270-
<small v-html="widgetConfigUI.userConsent.description"></small>
276+
<div class="col-md-12" style="font-size: 1.05rem;">
277+
{{ widgetConfigTemp.userConsent.domain }}
271278
</div>
272279
</div>
273-
<div class="row mt-2 mx-0 p-1"
274-
style="border: 2px solid #8080802e;border-radius: 10px; min-height: 115px;">
275-
<div class="col-md-3 center">
276-
<div style="border: 1px solid #8080802e; border-radius: 50%;" class="p-1">
277-
<img :src="widgetConfigTemp.userConsent.logoUrl" v-if="widgetConfigTemp.userConsent.logoUrl"
278-
style="height: 50px; border-radius: 50%;">
279-
</div>
280-
</div>
281-
<div class="col-md-8">
282-
<div class="row">
283-
<div class="col-md-12" style="font-size: 1.05rem;">
284-
{{ widgetConfigTemp.userConsent.domain }}
285-
</div>
286-
</div>
287-
<div class="row">
288-
<div class="col-md-12" style="color:grey">
289-
{{ widgetConfigTemp.userConsent.reason }}
290-
</div>
291-
</div>
280+
<div class="row">
281+
<div class="col-md-12" style="color:grey">
282+
{{ widgetConfigTemp.userConsent.reason }}
292283
</div>
293-
294284
</div>
295285
</div>
286+
287+
</div>
288+
</div>
289+
<div class="col">
290+
<div class="row">
296291
<div class="col">
297292
<div class="row">
298293
<div class="col">
299-
<div class="row">
300-
<div class="col">
301-
<label for=""><strong>Reason For KYC: </strong></label>
302-
<textarea type="text" rows="7" class="form-control" id=""
303-
v-model="widgetConfigTemp.userConsent.reason"
304-
placeholder="The app is requesting the following information to verify your identity" />
305-
</div>
306-
</div>
307-
294+
<label for=""><strong>Reason For KYC: </strong></label>
295+
<textarea type="text" rows="7" class="form-control" id=""
296+
v-model="widgetConfigTemp.userConsent.reason"
297+
placeholder="The app is requesting the following information to verify your identity" />
308298
</div>
309299
</div>
310-
</div>
311-
</div>
312-
</li>
313-
<li class="list-group-item">
314-
<div class="row">
315300

316-
<div class="col">
317-
<b-form-checkbox switch size="lg" v-model="widgetConfigTemp.trustedIssuer" disabled>{{
318-
widgetConfigUI.trustedIssuer.label }}</b-form-checkbox>
319-
<small v-html="widgetConfigUI.trustedIssuer.description"></small>
320-
</div>
321-
<div class="col">
322-
<label for=""><strong>Choose Trusted Issuer(s): </strong></label>
323-
<div style="max-height: 300px; overflow-y: scroll;" class="p-1">
324-
<MarketplaceList @selectedServiceEvent="selectedServiceEventHandler" />
325-
</div>
326301
</div>
327302
</div>
328-
<!-- <TrustedIssuer @selectedServiceEventFromTrustedIssuer="selectedServiceEventHandler" /> -->
329-
</li>
330-
</ul>
303+
</div>
304+
</div>
305+
</li>
306+
<li class="list-group-item">
307+
<div class="row">
308+
309+
<div class="col">
310+
<b-form-checkbox switch size="lg" v-model="widgetConfigTemp.trustedIssuer" disabled>{{
311+
widgetConfigUI.trustedIssuer.label }}</b-form-checkbox>
312+
<small v-html="widgetConfigUI.trustedIssuer.description"></small>
313+
</div>
314+
<div class="col">
315+
<label for=""><strong>Choose Trusted Issuer(s): </strong></label>
316+
<div style="max-height: 300px; overflow-y: scroll;" class="p-1">
317+
<MarketplaceList @selectedServiceEvent="selectedServiceEventHandler" />
318+
</div>
319+
</div>
320+
</div>
321+
<!-- <TrustedIssuer @selectedServiceEventFromTrustedIssuer="selectedServiceEventHandler" /> -->
322+
</li>
323+
</ul>
331324
</v-card>
332325

333326

334-
327+
335328
</div>
336329
</template>
337330

@@ -647,6 +640,7 @@ export default {
647640
if (!this.widgetConfigTemp.onChainId.selectedOnChainKYCconfiguration) {
648641
throw new Error('Kindly select a onchain configuration')
649642
}
643+
this.widgetConfigTemp.onChainId.selectedOnChainKYCconfiguration = this.widgetConfigTemp.onChainId.selectedOnChainKYCconfiguration.filter(e => e != null)
650644
651645
if (!this.widgetConfigTemp.zkProof.enabled) {
652646
throw new Error('Enable ZK Proof to enable onchainId')

0 commit comments

Comments
 (0)