table scrollable and ui changes done

src/mixins/messages.js

@@ -6,6 +6,7 @@ const ORGANIZATION = {
 }
 
 const SCHEMA = {
+    DUPLICATE_ATTRIBUTE: "Duplicate attribute name not allowed",
     PROTECTED_TERM: "is protected term you can't use it",
     NO_SPACE: "There should not be space in attribute name",
     NAME_CAMELCASE: "Name should be camelCase",

src/store/store.js

@@ -30,6 +30,9 @@ export default new Vuex.Store({
         }
     },
     getters: {
+        vcList(state) {
+            return state.vcList
+        },
         userDetails(state) {
             return state.userProfile.details
         },
@@ -102,6 +105,23 @@ export default new Vuex.Store({
                 }
             }
         },
+        increaseOrgDataCount(state,payload) {            
+            state.orgList.find((x)=>{
+                if(x._id === state.selectedOrgDid){                    
+                    x[payload] += 1                    
+                }
+            })
+        },
+        DecreaseOrgTemplateCount(state,payload) {
+            state.orgList.find((x)=>{
+                if(x._id === state.selectedOrgDid){
+                    if(x[payload]!==0){
+                    x[payload] -= 1
+                    }            
+
+                }
+            })
+        },
         shiftContainer(state,payload) {
             state.containerShift = payload
         },

src/views/Credential.vue

@@ -43,14 +43,18 @@ h5 span {
   background: #fff;
   padding: 0 10px;
 }
+.scrollit {
+    overflow:scroll;
+    height:600px;
+}
 </style>
 <template>
   <div :class="isContainerShift ?'homeShift':'home'">
     <loading :active.sync="isLoading" :can-cancel="true" :is-full-page="fullPage"></loading>
 
     <div class="row">
       <div class="col-md-12" style="text-align: left">
-        <Info :message="description" />
+        <!-- <Info :message="description" /> -->
           <div class="form-group" style="display:flex">
            <h3 v-if="vcList.length > 0" class="mt-4" style="text-align: left;">
             <i class="fa fa-id-card mr-2" ></i>Credentials</h3>
@@ -79,12 +83,12 @@ h5 span {
                       <input type="text" class="form-control" placeholder="Issued To (did:hs:...)"
                         v-model="holderDid" />
                     </div>
-                    <div class="form-group" v-if="isEdit===false">
+                    <!-- <div class="form-group" v-if="isEdit===false">
                       <tool-tip infoMessage="Enter Issuer DID for this Credential"></tool-tip>
                       <label for="fordid"><strong>Issuer DID<span style="color: red">*</span>:</strong></label>                      
                       <input type="text" class="form-control" placeholder="Issuer did (did:hs:...)"
                         v-model="issuerDid" />
-                    </div>
+                    </div> -->
                     <div v-else>
                     <div class="form-group">
                       <tool-tip infoMessage="Credential issued to this DID"></tool-tip>
@@ -221,7 +225,7 @@ h5 span {
       </div>
     </div>
     <div class="row" style="margin-top: 2%;" v-if="vcList.length > 0">
-      <div class="col-md-12">
+      <div class="col-md-12 scrollit">
         <table class="table table-bordered event-card" style="background:#FFFF">
           <thead class="thead-light">
             <tr>
@@ -239,13 +243,14 @@ h5 span {
             </tr>
           </thead>
           <tbody>
-            <tr v-for="row in vcList" :key="row.vc_id">
+            <tr v-for="row in vcList" :key="row._id">
 
               <td>
-                <a :href="`${row.vc_id}:`" target="_blank>">{{ row.vc_id ? removeUrl(row.vc_id) : '-' }}</a>
+                <a v-if="row.vc" :href="`${$config.explorer.BASE_URL}revocationRegistry/${removeUrl(row.vc.id)}`" target="_blank>">{{ row.vc.id ? shorten((row.vc.id)) : '-' }}</a>
+                <span v-else>-</span>
               </td>
               <td>
-                <a :href="`${$config.nodeServer.BASE_URL_REST}${$config.nodeServer.SCHEMA_GET_REST}${row.schemaId}:`" target="_blank">{{ shorten(row.schemaId) }}</a>
+                <a :href="`${$config.explorer.BASE_URL}schemas/${row.schemaId}`" target="_blank">{{ shorten(row.schemaId) }}</a>
               </td>
               <td>{{ shorten(row.subjectDid) }}</td>
               <td>{{ row.credStatus ? new Date(row.credStatus.issuanceDate).toLocaleString(): "-"}}</td>
@@ -294,7 +299,7 @@ h5 span {
 
 <script>
 import fetch from "node-fetch";
-import Info from '@/components/Info.vue'
+// import Info from '@/components/Info.vue'
 import UtilsMixin from '../mixins/utils';
 import HfPopUp from "../components/element/hfPopup.vue";
 import Loading from "vue-loading-overlay";
@@ -309,10 +314,10 @@ import Datepicker from 'vuejs-datetimepicker'
 import VueQr from "vue-qr"
 export default {
   name: "Credential",
-  components: { Info, HfPopUp, Loading, StudioSideBar, HfButtons, HfSelectDropDown, ToolTip, Datepicker, VueQr },
+  components: { HfPopUp, Loading, StudioSideBar, HfButtons, HfSelectDropDown, ToolTip, Datepicker, VueQr },
   computed: {
     vcList(){
-      return this.$store.state.vcList;
+      return this.$store.getters.vcList;
     },
     selectOptions(){
       return this.$store.getters.listOfAllSchemaOptions;
@@ -335,7 +340,7 @@ export default {
       issuerDid:'',
       authToken: localStorage.getItem('authToken'),
       isEdit:false,
-      description: "An issuer can issue a credential to a subject (or holder) which can be verfied by the verifier independently, without having him to connect with the issuer. They are a part of our daily lives; driver's licenses are used to assert that we are capable of operating a motor vehicle, university degrees can be used to assert our level of education, and government-issued passports enable us to travel between countries.  For example: an airline company can issue a flight ticket (\"verfiable credential\") using schema (issued by DGCA) to the passenger.",
+      // description: "An issuer can issue a credential to a subject (or holder) which can be verfied by the verifier independently, without having him to connect with the issuer. They are a part of our daily lives; driver's licenses are used to assert that we are capable of operating a motor vehicle, university degrees can be used to assert our level of education, and government-issued passports enable us to travel between countries.  For example: an airline company can issue a flight ticket (\"verfiable credential\") using schema (issued by DGCA) to the passenger.",
       active: 0,
       host: location.hostname,
       user: {},
@@ -526,7 +531,7 @@ export default {
     },
     removeUrl(url) {
       const chars = url.split('credential/');
-      return this.shorten(chars[1])      
+      return chars[0]
     },
     copyToClip(textToCopy,contentType) {
         if (textToCopy) {
@@ -776,11 +781,14 @@ export default {
         const ToDate = new Date();
         if (isEmpty(this.holderDid)) {
           return this.notifyErr(message.CREDENTIAL.EMPTY_HOLDER_DID)
-        } else if(isEmpty(this.issuerDid)) {
-          return this.notifyErr(message.CREDENTIAL.EMPTY_ISSUER_DID)
-        } else if(!isValidDid(this.issuerDid)) {
-          return this.notifyErr(message.CREDENTIAL.INVALID_DID)
-        } else if (!isValidDid(this.holderDid)) {
+        } 
+        // else if(isEmpty(this.issuerDid)) {
+        //   return this.notifyErr(message.CREDENTIAL.EMPTY_ISSUER_DID)
+        // } 
+        // else if(!isValidDid(this.issuerDid)) {
+        //   return this.notifyErr(message.CREDENTIAL.INVALID_DID)
+        // } 
+        else if (!isValidDid(this.holderDid)) {
           return this.notifyErr(message.CREDENTIAL.INVALID_DID)
         } else if (isEmpty(this.selected)) {
           return this.notifyErr(message.CREDENTIAL.SELECT_SCHEMA)
@@ -797,7 +805,7 @@ export default {
         this.isLoading = true
         const fields = attributeMap
         const schemaId = this.selected
-        const issuerDid = this.issuerDid
+        const issuerDid = this.user.id
         const subjectDid = this.holderDid
         const expirationDate = this.expiryDateTime
         const url = `${this.$config.studioServer.BASE_URL}${this.$config.studioServer.CRED_ISSUE_EP}`;
@@ -828,7 +836,7 @@ export default {
               this.openWallet(URL)
               this.ssePopulateCredStatus(creadRecord._id, this.$store)
               this.openSlider();
-
+              this.$store.commit('increaseOrgDataCount','credentialsCount')
            } else {
              console.log(json)
              throw new Error(`${json.message}`)

src/views/OrgSidebar.vue

@@ -64,22 +64,27 @@
     <div class="row scroll" v-if="orgList.length > 0">
       <div class="col-lg-4" v-for="eachOrg in orgList" :key="eachOrg._id">
 
-        <b-card :title="truncate(eachOrg.name,20)" tag="article" style="max-width: 30rem; margin-top: 10px; max-height:25rem"
+        <b-card :title="truncate(eachOrg.name,20)" tag="article" style="max-width: 30rem; margin-top: 10px; height:13rem"
           class="mb-2 eventCard" img-top>
           <ul style="list-style-type: none;padding-left: 0px;min-height: 80px;">            
             <img style="float:right;" :src="`${getProfileIcon(eachOrg.name)}`" class="mr-2" alt="center" width="70px"/>            
-            <li>
+            <li v-if="eachOrg.status ==='Registered'">
+              <i class="fa fa-user mr-2"></i>
               <span class="card-title"><a target="_blank" :href="`${$config.explorer.BASE_URL}identity/${eachOrg.orgDid}`">{{ truncate(eachOrg.orgDid,45) }}</a></span>
               <span v-if="eachOrg.status === 'Registered'" @click="copyToClip(eachOrg.orgDid,'Org DID')"
               ><i class="far fa-copy"></i></span>
             </li>
+            <div v-if="eachOrg.status ==='Registered'">
             <li>
-              <span class="card-title">{{ eachOrg.network }}</span>
-
+              <span class="card-title"><i class="fa fa-id-card mr-2"></i>Credentials: {{(eachOrg.credentialsCount)}}</span>
             </li>
             <li>
-              <span class="card-title">{{truncate(eachOrg.domain,40)}}</span>
+              <span class="card-title"><i class="fa fa-table mr-2"></i>Schemas: {{eachOrg.schemasCount}}</span>
             </li>
+            <li>
+              <span class="card-title"><i class="fa fa-desktop mr-2"></i>Templates: {{eachOrg.templatesCount}}</span>
+            </li>
+            </div>
           </ul>
           <footer>
             <div class="form-group row" style="margin-bottom: 0rem;">
@@ -102,7 +107,7 @@
             </li>
             </ul>
             </div>
-                <div class="pt-1 pl-2" v-if="eachOrg.status === 'Registered'">            
+                <div class="pl-2" v-if="eachOrg.status === 'Registered'">            
                 <i class="fas fa-pencil-alt"
                 @click="editOrg(eachOrg._id)" title="Click to edit this event" style="cursor: pointer"
                 ></i>

src/views/Presentation.vue

@@ -16,14 +16,18 @@
     text-decoration: underline;
     cursor: pointer;
 }
+.scrollit {
+    overflow:scroll;
+    height:600px;
+}
 </style>
 <template>
   <div :class="isContainerShift ?'homeShift':'home'">
     <loading :active.sync="isLoading" :can-cancel="true" :is-full-page="fullPage"></loading>
 
     <div class="row">
       <div class="col-md-12" style="text-align: left">
-        <Info :message="description" />
+        <!-- <Info :message="description" /> -->
 
           <div class="form-group" style="display:flex">
            <h3 v-if="templateList.length > 0" class="mt-4" style="text-align: left;">
@@ -117,7 +121,7 @@
       </div>
     </div>
     <div class="row" style="margin-top: 2%;" v-if="templateList.length >0">
-      <div class="col-md-12">
+      <div class="col-md-12 scrollit">
         <table class="table table-bordered event-card" style="background:#FFFF">
           <thead class="thead-light">
             <tr>
@@ -147,7 +151,7 @@
               <!-- <td>{{row.issuerDid.toString()}}</td> -->
               <td class="align-middle">{{ shorten(row.schemaId)}}</td>
               <td class="align-middle">{{row.reason}}</td>
-              <td class="align-middle">{{row.callbackUrl}}</td>
+              <td class="align-middle" :title="row.callbackUrl">{{truncate(row.callbackUrl,40)}}</td>
               <td class="align-middle">
               <div style="display:flex">
               <i 
@@ -205,7 +209,7 @@ import HfButtons from "../components/element/HfButtons.vue"
 import conf from '../config';
 const { hypersignSDK } = conf;
 import QrcodeVue from "qrcode.vue";
-import Info from '@/components/Info.vue'
+// import Info from '@/components/Info.vue'
 import Loading from "vue-loading-overlay";
 import "vue-loading-overlay/dist/vue-loading.css";
 import HfSelectDropDown from "../components/element/HfSelectDropDown.vue"
@@ -215,7 +219,7 @@ import message from '../mixins/messages'
 import { isEmpty, isValidURL, isValidDid } from '../mixins/fieldValidation'
 export default {
   name: "Presentation",
-  components: { QrcodeVue, Info , StudioSideBar, HfButtons, Loading, HfSelectDropDown, ToolTip, HfPopUp},
+  components: { QrcodeVue , StudioSideBar, HfButtons, Loading, HfSelectDropDown, ToolTip, HfPopUp},
   computed:{
     templateList(){
       return this.$store.state.templateList;
@@ -237,17 +241,17 @@ export default {
       maxChar:105,
       remainingCharText:'Remaining 105 characters',
       tempToDelete:'',    
-      description: "The subject (or holder) generates verifiable presentation from one or more verifiable \
-      credentials, issued by one or more issuers, that is shared with a specific verifier. \
-      A verifiable presentation is a tamper-evident presentation encoded in such a way that \
-      authorship of the data can be trusted after a process of cryptographic verification. \
-      Certain types of verifiable presentations might contain data that is synthesized from, \
-      but do not contain, the original verifiable credentials for example, in order to proof the \
-      subject that he/she is an adult, she/he does not have to tell his/her actual age \
-      (i.e. Zero knowledge proof). The airline passenger might not have to show the complete ticket\
-      to the secruity personal to pass the security check. The passenger will have ability to show \
-      just one document (the verifiable presentation) derived from his passport and air ticket to\
-      show at the security check.",
+      // description: "The subject (or holder) generates verifiable presentation from one or more verifiable \
+      // credentials, issued by one or more issuers, that is shared with a specific verifier. \
+      // A verifiable presentation is a tamper-evident presentation encoded in such a way that \
+      // authorship of the data can be trusted after a process of cryptographic verification. \
+      // Certain types of verifiable presentations might contain data that is synthesized from, \
+      // but do not contain, the original verifiable credentials for example, in order to proof the \
+      // subject that he/she is an adult, she/he does not have to tell his/her actual age \
+      // (i.e. Zero knowledge proof). The airline passenger might not have to show the complete ticket\
+      // to the secruity personal to pass the security check. The passenger will have ability to show \
+      // just one document (the verifiable presentation) derived from his passport and air ticket to\
+      // show at the security check.",
       presentationTemplate: {
         queryType: 'QueryByExample',
         domain: "",
@@ -371,6 +375,7 @@ export default {
                   this.$store.commit('deleteTemplate',id)
                   this.notifySuccess(`Template with ${id} id deleted successfully`)
                   this.$root.$emit('modal-close')
+                  this.$store.commit('DecreaseOrgTemplateCount','templatesCount')
                 }          
           } else {
             this.notifyErr('Please enter correct template id')
@@ -549,6 +554,7 @@ export default {
           } else{
             this.$store.commit('insertApresentationTemplate', json.data.presentationTemplateObj)
             this.notifySuccess('Template Successfully created')
+            this.$store.commit('increaseOrgDataCount','templatesCount')
           }
           // this.openSlider();
           this.clearAll()