forked from trent_larson/crowd-funder-for-time-pwa
IndexedDB migration: reorder the sections to accounts then settings then contacts
This commit is contained in:
@@ -246,22 +246,23 @@
|
|||||||
<div v-if="comparison" class="space-y-6">
|
<div v-if="comparison" class="space-y-6">
|
||||||
<!-- Summary Cards -->
|
<!-- Summary Cards -->
|
||||||
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-6 gap-6">
|
<div class="grid grid-cols-1 md:grid-cols-2 lg:grid-cols-6 gap-6">
|
||||||
|
<!-- Accounts Summary (moved first) -->
|
||||||
<div class="bg-white overflow-hidden shadow rounded-lg">
|
<div class="bg-white overflow-hidden shadow rounded-lg">
|
||||||
<div class="p-5">
|
<div class="p-5">
|
||||||
<div class="flex items-center">
|
<div class="flex items-center">
|
||||||
<div class="flex-shrink-0">
|
<div class="flex-shrink-0">
|
||||||
<IconRenderer
|
<IconRenderer
|
||||||
icon-name="chart"
|
icon-name="lock"
|
||||||
svg-class="h-6 w-6 text-blue-600"
|
svg-class="h-6 w-6 text-orange-600"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div class="ml-5 w-0 flex-1">
|
<div class="ml-5 w-0 flex-1">
|
||||||
<dl>
|
<dl>
|
||||||
<dt class="text-sm font-medium text-gray-500 truncate">
|
<dt class="text-sm font-medium text-gray-500 truncate">
|
||||||
Dexie Contacts
|
Dexie Accounts
|
||||||
</dt>
|
</dt>
|
||||||
<dd class="text-lg font-medium text-gray-900">
|
<dd class="text-lg font-medium text-gray-900">
|
||||||
{{ comparison.dexieContacts.length }}
|
{{ comparison.dexieAccounts.length }}
|
||||||
</dd>
|
</dd>
|
||||||
</dl>
|
</dl>
|
||||||
</div>
|
</div>
|
||||||
@@ -275,16 +276,16 @@
|
|||||||
<div class="flex-shrink-0">
|
<div class="flex-shrink-0">
|
||||||
<IconRenderer
|
<IconRenderer
|
||||||
icon-name="check"
|
icon-name="check"
|
||||||
svg-class="h-6 w-6 text-green-600"
|
svg-class="h-6 w-6 text-teal-600"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div class="ml-5 w-0 flex-1">
|
<div class="ml-5 w-0 flex-1">
|
||||||
<dl>
|
<dl>
|
||||||
<dt class="text-sm font-medium text-gray-500 truncate">
|
<dt class="text-sm font-medium text-gray-500 truncate">
|
||||||
SQLite Contacts
|
SQLite Accounts
|
||||||
</dt>
|
</dt>
|
||||||
<dd class="text-lg font-medium text-gray-900">
|
<dd class="text-lg font-medium text-gray-900">
|
||||||
{{ comparison.sqliteContacts.length }}
|
{{ comparison.sqliteAccounts.length }}
|
||||||
</dd>
|
</dd>
|
||||||
</dl>
|
</dl>
|
||||||
</div>
|
</div>
|
||||||
@@ -292,6 +293,7 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<!-- Settings Summary (second) -->
|
||||||
<div class="bg-white overflow-hidden shadow rounded-lg">
|
<div class="bg-white overflow-hidden shadow rounded-lg">
|
||||||
<div class="p-5">
|
<div class="p-5">
|
||||||
<div class="flex items-center">
|
<div class="flex items-center">
|
||||||
@@ -338,22 +340,23 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<!-- Contacts Summary (last) -->
|
||||||
<div class="bg-white overflow-hidden shadow rounded-lg">
|
<div class="bg-white overflow-hidden shadow rounded-lg">
|
||||||
<div class="p-5">
|
<div class="p-5">
|
||||||
<div class="flex items-center">
|
<div class="flex items-center">
|
||||||
<div class="flex-shrink-0">
|
<div class="flex-shrink-0">
|
||||||
<IconRenderer
|
<IconRenderer
|
||||||
icon-name="lock"
|
icon-name="chart"
|
||||||
svg-class="h-6 w-6 text-orange-600"
|
svg-class="h-6 w-6 text-blue-600"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div class="ml-5 w-0 flex-1">
|
<div class="ml-5 w-0 flex-1">
|
||||||
<dl>
|
<dl>
|
||||||
<dt class="text-sm font-medium text-gray-500 truncate">
|
<dt class="text-sm font-medium text-gray-500 truncate">
|
||||||
Dexie Accounts
|
Dexie Contacts
|
||||||
</dt>
|
</dt>
|
||||||
<dd class="text-lg font-medium text-gray-900">
|
<dd class="text-lg font-medium text-gray-900">
|
||||||
{{ comparison.dexieAccounts.length }}
|
{{ comparison.dexieContacts.length }}
|
||||||
</dd>
|
</dd>
|
||||||
</dl>
|
</dl>
|
||||||
</div>
|
</div>
|
||||||
@@ -367,16 +370,16 @@
|
|||||||
<div class="flex-shrink-0">
|
<div class="flex-shrink-0">
|
||||||
<IconRenderer
|
<IconRenderer
|
||||||
icon-name="check"
|
icon-name="check"
|
||||||
svg-class="h-6 w-6 text-teal-600"
|
svg-class="h-6 w-6 text-green-600"
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
<div class="ml-5 w-0 flex-1">
|
<div class="ml-5 w-0 flex-1">
|
||||||
<dl>
|
<dl>
|
||||||
<dt class="text-sm font-medium text-gray-500 truncate">
|
<dt class="text-sm font-medium text-gray-500 truncate">
|
||||||
SQLite Accounts
|
SQLite Contacts
|
||||||
</dt>
|
</dt>
|
||||||
<dd class="text-lg font-medium text-gray-900">
|
<dd class="text-lg font-medium text-gray-900">
|
||||||
{{ comparison.sqliteAccounts.length }}
|
{{ comparison.sqliteContacts.length }}
|
||||||
</dd>
|
</dd>
|
||||||
</dl>
|
</dl>
|
||||||
</div>
|
</div>
|
||||||
@@ -387,253 +390,7 @@
|
|||||||
|
|
||||||
<!-- Differences Section -->
|
<!-- Differences Section -->
|
||||||
<div class="grid grid-cols-1 lg:grid-cols-3 gap-6">
|
<div class="grid grid-cols-1 lg:grid-cols-3 gap-6">
|
||||||
<!-- Contacts Differences -->
|
<!-- Account Differences (moved first) -->
|
||||||
<div class="bg-white shadow rounded-lg">
|
|
||||||
<div class="px-4 py-5 sm:p-6">
|
|
||||||
<h3 class="text-lg leading-6 font-medium text-gray-900 mb-4">
|
|
||||||
Contact Differences
|
|
||||||
</h3>
|
|
||||||
|
|
||||||
<div class="space-y-4">
|
|
||||||
<div
|
|
||||||
class="flex items-center justify-between p-3 bg-blue-50 rounded-lg"
|
|
||||||
>
|
|
||||||
<div class="flex items-center">
|
|
||||||
<IconRenderer
|
|
||||||
icon-name="plusCircle"
|
|
||||||
svg-class="h-5 w-5 text-blue-600 mr-2"
|
|
||||||
/>
|
|
||||||
<span class="text-sm font-medium text-blue-900">Added</span>
|
|
||||||
</div>
|
|
||||||
<span class="text-sm font-bold text-blue-900">{{
|
|
||||||
comparison.differences.contacts.added.length
|
|
||||||
}}</span>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div
|
|
||||||
class="flex items-center justify-between p-3 bg-yellow-50 rounded-lg"
|
|
||||||
>
|
|
||||||
<div class="flex items-center">
|
|
||||||
<IconRenderer
|
|
||||||
icon-name="edit"
|
|
||||||
svg-class="h-5 w-5 text-yellow-600 mr-2"
|
|
||||||
/>
|
|
||||||
<span class="text-sm font-medium text-yellow-900"
|
|
||||||
>Modified</span
|
|
||||||
>
|
|
||||||
</div>
|
|
||||||
<span class="text-sm font-bold text-yellow-900">{{
|
|
||||||
comparison.differences.contacts.modified.length
|
|
||||||
}}</span>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div
|
|
||||||
class="flex items-center justify-between p-3 bg-red-50 rounded-lg"
|
|
||||||
>
|
|
||||||
<div class="flex items-center">
|
|
||||||
<IconRenderer
|
|
||||||
icon-name="trash"
|
|
||||||
svg-class="h-5 w-5 text-red-600 mr-2"
|
|
||||||
/>
|
|
||||||
<span class="text-sm font-medium text-red-900"
|
|
||||||
>Missing</span
|
|
||||||
>
|
|
||||||
</div>
|
|
||||||
<span class="text-sm font-bold text-red-900">{{
|
|
||||||
comparison.differences.contacts.missing.length
|
|
||||||
}}</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Contact Details -->
|
|
||||||
<div
|
|
||||||
v-if="comparison.differences.contacts.added.length > 0"
|
|
||||||
class="mt-4"
|
|
||||||
>
|
|
||||||
<h4 class="text-sm font-medium text-gray-900 mb-2">
|
|
||||||
Added Contacts ({{ comparison.differences.contacts.added.length }}):
|
|
||||||
</h4>
|
|
||||||
<div class="space-y-1">
|
|
||||||
<div
|
|
||||||
v-for="contact in comparison.differences.contacts.added"
|
|
||||||
:key="contact.did"
|
|
||||||
class="text-xs text-gray-600 bg-gray-50 p-2 rounded"
|
|
||||||
>
|
|
||||||
<div class="font-medium">{{ contact.name || '<empty>' }}</div>
|
|
||||||
<div class="text-gray-500">{{ contact.did }}</div>
|
|
||||||
<div class="text-gray-400">{{ contact.contactMethods?.length || 0 }} contact methods</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Modified Contacts -->
|
|
||||||
<div
|
|
||||||
v-if="comparison.differences.contacts.modified.length > 0"
|
|
||||||
class="mt-4"
|
|
||||||
>
|
|
||||||
<h4 class="text-sm font-medium text-gray-900 mb-2">
|
|
||||||
Modified Contacts ({{ comparison.differences.contacts.modified.length }}):
|
|
||||||
</h4>
|
|
||||||
<div class="space-y-1">
|
|
||||||
<div
|
|
||||||
v-for="contact in comparison.differences.contacts.modified"
|
|
||||||
:key="contact.did"
|
|
||||||
class="text-xs text-gray-600 bg-gray-50 p-2 rounded"
|
|
||||||
>
|
|
||||||
<div class="font-medium">{{ contact.name || '<empty>' }}</div>
|
|
||||||
<div class="text-gray-500">{{ contact.did }}</div>
|
|
||||||
<div class="text-gray-400">{{ contact.contactMethods?.length || 0 }} contact methods</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Missing Contacts -->
|
|
||||||
<div
|
|
||||||
v-if="comparison.differences.contacts.missing.filter(c => c.did).length > 0"
|
|
||||||
class="mt-4"
|
|
||||||
>
|
|
||||||
<h4 class="text-sm font-medium text-gray-900 mb-2">
|
|
||||||
Missing Contacts ({{ comparison.differences.contacts.missing.filter(c => c.did).length }}):
|
|
||||||
</h4>
|
|
||||||
<div class="space-y-1">
|
|
||||||
<div
|
|
||||||
v-for="contact in comparison.differences.contacts.missing.filter(c => c.did)"
|
|
||||||
:key="contact.did"
|
|
||||||
class="text-xs text-gray-600 bg-gray-50 p-2 rounded"
|
|
||||||
>
|
|
||||||
<div class="font-medium">{{ contact.name || '<empty>' }}</div>
|
|
||||||
<div class="text-gray-500">{{ contact.did }}</div>
|
|
||||||
<div class="text-gray-400">{{ contact.contactMethods?.length || 0 }} contact methods</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Settings Differences -->
|
|
||||||
<div class="bg-white shadow rounded-lg">
|
|
||||||
<div class="px-4 py-5 sm:p-6">
|
|
||||||
<h3 class="text-lg leading-6 font-medium text-gray-900 mb-4">
|
|
||||||
Settings Differences
|
|
||||||
</h3>
|
|
||||||
|
|
||||||
<div class="space-y-4">
|
|
||||||
<div
|
|
||||||
class="flex items-center justify-between p-3 bg-blue-50 rounded-lg"
|
|
||||||
>
|
|
||||||
<div class="flex items-center">
|
|
||||||
<IconRenderer
|
|
||||||
icon-name="plusCircle"
|
|
||||||
svg-class="h-5 w-5 text-blue-600 mr-2"
|
|
||||||
/>
|
|
||||||
<span class="text-sm font-medium text-blue-900">Added</span>
|
|
||||||
</div>
|
|
||||||
<span class="text-sm font-bold text-blue-900">{{
|
|
||||||
comparison.differences.settings.added.length
|
|
||||||
}}</span>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div
|
|
||||||
class="flex items-center justify-between p-3 bg-yellow-50 rounded-lg"
|
|
||||||
>
|
|
||||||
<div class="flex items-center">
|
|
||||||
<IconRenderer
|
|
||||||
icon-name="edit"
|
|
||||||
svg-class="h-5 w-5 text-yellow-600 mr-2"
|
|
||||||
/>
|
|
||||||
<span class="text-sm font-medium text-yellow-900"
|
|
||||||
>Modified</span
|
|
||||||
>
|
|
||||||
</div>
|
|
||||||
<span class="text-sm font-bold text-yellow-900">{{
|
|
||||||
comparison.differences.settings.modified.length
|
|
||||||
}}</span>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div
|
|
||||||
class="flex items-center justify-between p-3 bg-red-50 rounded-lg"
|
|
||||||
>
|
|
||||||
<div class="flex items-center">
|
|
||||||
<IconRenderer
|
|
||||||
icon-name="trash"
|
|
||||||
svg-class="h-5 w-5 text-red-600 mr-2"
|
|
||||||
/>
|
|
||||||
<span class="text-sm font-medium text-red-900"
|
|
||||||
>Missing</span
|
|
||||||
>
|
|
||||||
</div>
|
|
||||||
<span class="text-sm font-bold text-red-900">{{
|
|
||||||
comparison.differences.settings.missing.length
|
|
||||||
}}</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Settings Details -->
|
|
||||||
<div
|
|
||||||
v-if="comparison.differences.settings.added.length > 0"
|
|
||||||
class="mt-4"
|
|
||||||
>
|
|
||||||
<h4 class="text-sm font-medium text-gray-900 mb-2">
|
|
||||||
Added Settings ({{ comparison.differences.settings.added.length }}):
|
|
||||||
</h4>
|
|
||||||
<div class="space-y-1">
|
|
||||||
<div
|
|
||||||
v-for="setting in comparison.differences.settings.added"
|
|
||||||
:key="setting.id"
|
|
||||||
class="text-xs text-gray-600 bg-gray-50 p-2 rounded"
|
|
||||||
>
|
|
||||||
<div class="font-medium">{{ getSettingDisplayName(setting) }}</div>
|
|
||||||
<div class="text-gray-500">ID: {{ setting.id }}</div>
|
|
||||||
<div class="text-gray-400">Registered: {{ setting.isRegistered ? 'Yes' : 'No' }}</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Modified Settings -->
|
|
||||||
<div
|
|
||||||
v-if="comparison.differences.settings.modified.length > 0"
|
|
||||||
class="mt-4"
|
|
||||||
>
|
|
||||||
<h4 class="text-sm font-medium text-gray-900 mb-2">
|
|
||||||
Modified Settings ({{ comparison.differences.settings.modified.length }}):
|
|
||||||
</h4>
|
|
||||||
<div class="space-y-1">
|
|
||||||
<div
|
|
||||||
v-for="setting in comparison.differences.settings.modified"
|
|
||||||
:key="setting.id"
|
|
||||||
class="text-xs text-gray-600 bg-gray-50 p-2 rounded"
|
|
||||||
>
|
|
||||||
<div class="font-medium">{{ getSettingDisplayName(setting) }}</div>
|
|
||||||
<div class="text-gray-500">ID: {{ setting.id }}</div>
|
|
||||||
<div class="text-gray-400">Registered: {{ setting.isRegistered ? 'Yes' : 'No' }}</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Missing Settings -->
|
|
||||||
<div
|
|
||||||
v-if="comparison.differences.settings.missing.filter(s => s.accountDid || s.activeDid).length > 0"
|
|
||||||
class="mt-4"
|
|
||||||
>
|
|
||||||
<h4 class="text-sm font-medium text-gray-900 mb-2">
|
|
||||||
Missing Settings ({{ comparison.differences.settings.missing.filter(s => s.accountDid || s.activeDid).length }}):
|
|
||||||
</h4>
|
|
||||||
<div class="space-y-1">
|
|
||||||
<div
|
|
||||||
v-for="setting in comparison.differences.settings.missing.filter(s => s.accountDid || s.activeDid)"
|
|
||||||
:key="setting.id"
|
|
||||||
class="text-xs text-gray-600 bg-gray-50 p-2 rounded"
|
|
||||||
>
|
|
||||||
<div class="font-medium">{{ getSettingDisplayName(setting) }}</div>
|
|
||||||
<div class="text-gray-500">ID: {{ setting.id }}</div>
|
|
||||||
<div class="text-gray-400">Registered: {{ setting.isRegistered ? 'Yes' : 'No' }}</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- Account Differences -->
|
|
||||||
<div class="bg-white shadow rounded-lg">
|
<div class="bg-white shadow rounded-lg">
|
||||||
<div class="px-4 py-5 sm:p-6">
|
<div class="px-4 py-5 sm:p-6">
|
||||||
<h3 class="text-lg leading-6 font-medium text-gray-900 mb-4">
|
<h3 class="text-lg leading-6 font-medium text-gray-900 mb-4">
|
||||||
@@ -761,6 +518,252 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<!-- Settings Differences (second) -->
|
||||||
|
<div class="bg-white shadow rounded-lg">
|
||||||
|
<div class="px-4 py-5 sm:p-6">
|
||||||
|
<h3 class="text-lg leading-6 font-medium text-gray-900 mb-4">
|
||||||
|
Settings Differences
|
||||||
|
</h3>
|
||||||
|
|
||||||
|
<div class="space-y-4">
|
||||||
|
<div
|
||||||
|
class="flex items-center justify-between p-3 bg-blue-50 rounded-lg"
|
||||||
|
>
|
||||||
|
<div class="flex items-center">
|
||||||
|
<IconRenderer
|
||||||
|
icon-name="plusCircle"
|
||||||
|
svg-class="h-5 w-5 text-blue-600 mr-2"
|
||||||
|
/>
|
||||||
|
<span class="text-sm font-medium text-blue-900">Added</span>
|
||||||
|
</div>
|
||||||
|
<span class="text-sm font-bold text-blue-900">{{
|
||||||
|
comparison.differences.settings.added.length
|
||||||
|
}}</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div
|
||||||
|
class="flex items-center justify-between p-3 bg-yellow-50 rounded-lg"
|
||||||
|
>
|
||||||
|
<div class="flex items-center">
|
||||||
|
<IconRenderer
|
||||||
|
icon-name="edit"
|
||||||
|
svg-class="h-5 w-5 text-yellow-600 mr-2"
|
||||||
|
/>
|
||||||
|
<span class="text-sm font-medium text-yellow-900"
|
||||||
|
>Modified</span
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
<span class="text-sm font-bold text-yellow-900">{{
|
||||||
|
comparison.differences.settings.modified.length
|
||||||
|
}}</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div
|
||||||
|
class="flex items-center justify-between p-3 bg-red-50 rounded-lg"
|
||||||
|
>
|
||||||
|
<div class="flex items-center">
|
||||||
|
<IconRenderer
|
||||||
|
icon-name="trash"
|
||||||
|
svg-class="h-5 w-5 text-red-600 mr-2"
|
||||||
|
/>
|
||||||
|
<span class="text-sm font-medium text-red-900"
|
||||||
|
>Missing</span
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
<span class="text-sm font-bold text-red-900">{{
|
||||||
|
comparison.differences.settings.missing.length
|
||||||
|
}}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Settings Details -->
|
||||||
|
<div
|
||||||
|
v-if="comparison.differences.settings.added.length > 0"
|
||||||
|
class="mt-4"
|
||||||
|
>
|
||||||
|
<h4 class="text-sm font-medium text-gray-900 mb-2">
|
||||||
|
Added Settings ({{ comparison.differences.settings.added.length }}):
|
||||||
|
</h4>
|
||||||
|
<div class="space-y-1">
|
||||||
|
<div
|
||||||
|
v-for="setting in comparison.differences.settings.added"
|
||||||
|
:key="setting.id"
|
||||||
|
class="text-xs text-gray-600 bg-gray-50 p-2 rounded"
|
||||||
|
>
|
||||||
|
<div class="font-medium">{{ getSettingDisplayName(setting) }}</div>
|
||||||
|
<div class="text-gray-500">ID: {{ setting.id }}</div>
|
||||||
|
<div class="text-gray-400">Registered: {{ setting.isRegistered ? 'Yes' : 'No' }}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Modified Settings -->
|
||||||
|
<div
|
||||||
|
v-if="comparison.differences.settings.modified.length > 0"
|
||||||
|
class="mt-4"
|
||||||
|
>
|
||||||
|
<h4 class="text-sm font-medium text-gray-900 mb-2">
|
||||||
|
Modified Settings ({{ comparison.differences.settings.modified.length }}):
|
||||||
|
</h4>
|
||||||
|
<div class="space-y-1">
|
||||||
|
<div
|
||||||
|
v-for="setting in comparison.differences.settings.modified"
|
||||||
|
:key="setting.id"
|
||||||
|
class="text-xs text-gray-600 bg-gray-50 p-2 rounded"
|
||||||
|
>
|
||||||
|
<div class="font-medium">{{ getSettingDisplayName(setting) }}</div>
|
||||||
|
<div class="text-gray-500">ID: {{ setting.id }}</div>
|
||||||
|
<div class="text-gray-400">Registered: {{ setting.isRegistered ? 'Yes' : 'No' }}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Missing Settings -->
|
||||||
|
<div
|
||||||
|
v-if="comparison.differences.settings.missing.filter(s => s.accountDid || s.activeDid).length > 0"
|
||||||
|
class="mt-4"
|
||||||
|
>
|
||||||
|
<h4 class="text-sm font-medium text-gray-900 mb-2">
|
||||||
|
Missing Settings ({{ comparison.differences.settings.missing.filter(s => s.accountDid || s.activeDid).length }}):
|
||||||
|
</h4>
|
||||||
|
<div class="space-y-1">
|
||||||
|
<div
|
||||||
|
v-for="setting in comparison.differences.settings.missing.filter(s => s.accountDid || s.activeDid)"
|
||||||
|
:key="setting.id"
|
||||||
|
class="text-xs text-gray-600 bg-gray-50 p-2 rounded"
|
||||||
|
>
|
||||||
|
<div class="font-medium">{{ getSettingDisplayName(setting) }}</div>
|
||||||
|
<div class="text-gray-500">ID: {{ setting.id }}</div>
|
||||||
|
<div class="text-gray-400">Registered: {{ setting.isRegistered ? 'Yes' : 'No' }}</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Contacts Differences (last) -->
|
||||||
|
<div class="bg-white shadow rounded-lg">
|
||||||
|
<div class="px-4 py-5 sm:p-6">
|
||||||
|
<h3 class="text-lg leading-6 font-medium text-gray-900 mb-4">
|
||||||
|
Contact Differences
|
||||||
|
</h3>
|
||||||
|
|
||||||
|
<div class="space-y-4">
|
||||||
|
<div
|
||||||
|
class="flex items-center justify-between p-3 bg-blue-50 rounded-lg"
|
||||||
|
>
|
||||||
|
<div class="flex items-center">
|
||||||
|
<IconRenderer
|
||||||
|
icon-name="plusCircle"
|
||||||
|
svg-class="h-5 w-5 text-blue-600 mr-2"
|
||||||
|
/>
|
||||||
|
<span class="text-sm font-medium text-blue-900">Added</span>
|
||||||
|
</div>
|
||||||
|
<span class="text-sm font-bold text-blue-900">{{
|
||||||
|
comparison.differences.contacts.added.length
|
||||||
|
}}</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div
|
||||||
|
class="flex items-center justify-between p-3 bg-yellow-50 rounded-lg"
|
||||||
|
>
|
||||||
|
<div class="flex items-center">
|
||||||
|
<IconRenderer
|
||||||
|
icon-name="edit"
|
||||||
|
svg-class="h-5 w-5 text-yellow-600 mr-2"
|
||||||
|
/>
|
||||||
|
<span class="text-sm font-medium text-yellow-900"
|
||||||
|
>Modified</span
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
<span class="text-sm font-bold text-yellow-900">{{
|
||||||
|
comparison.differences.contacts.modified.length
|
||||||
|
}}</span>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div
|
||||||
|
class="flex items-center justify-between p-3 bg-red-50 rounded-lg"
|
||||||
|
>
|
||||||
|
<div class="flex items-center">
|
||||||
|
<IconRenderer
|
||||||
|
icon-name="trash"
|
||||||
|
svg-class="h-5 w-5 text-red-600 mr-2"
|
||||||
|
/>
|
||||||
|
<span class="text-sm font-medium text-red-900"
|
||||||
|
>Missing</span
|
||||||
|
>
|
||||||
|
</div>
|
||||||
|
<span class="text-sm font-bold text-red-900">{{
|
||||||
|
comparison.differences.contacts.missing.length
|
||||||
|
}}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Contact Details -->
|
||||||
|
<div
|
||||||
|
v-if="comparison.differences.contacts.added.length > 0"
|
||||||
|
class="mt-4"
|
||||||
|
>
|
||||||
|
<h4 class="text-sm font-medium text-gray-900 mb-2">
|
||||||
|
Added Contacts ({{ comparison.differences.contacts.added.length }}):
|
||||||
|
</h4>
|
||||||
|
<div class="space-y-1">
|
||||||
|
<div
|
||||||
|
v-for="contact in comparison.differences.contacts.added"
|
||||||
|
:key="contact.did"
|
||||||
|
class="text-xs text-gray-600 bg-gray-50 p-2 rounded"
|
||||||
|
>
|
||||||
|
<div class="font-medium">{{ contact.name || '<empty>' }}</div>
|
||||||
|
<div class="text-gray-500">{{ contact.did }}</div>
|
||||||
|
<div class="text-gray-400">{{ contact.contactMethods?.length || 0 }} contact methods</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Modified Contacts -->
|
||||||
|
<div
|
||||||
|
v-if="comparison.differences.contacts.modified.length > 0"
|
||||||
|
class="mt-4"
|
||||||
|
>
|
||||||
|
<h4 class="text-sm font-medium text-gray-900 mb-2">
|
||||||
|
Modified Contacts ({{ comparison.differences.contacts.modified.length }}):
|
||||||
|
</h4>
|
||||||
|
<div class="space-y-1">
|
||||||
|
<div
|
||||||
|
v-for="contact in comparison.differences.contacts.modified"
|
||||||
|
:key="contact.did"
|
||||||
|
class="text-xs text-gray-600 bg-gray-50 p-2 rounded"
|
||||||
|
>
|
||||||
|
<div class="font-medium">{{ contact.name || '<empty>' }}</div>
|
||||||
|
<div class="text-gray-500">{{ contact.did }}</div>
|
||||||
|
<div class="text-gray-400">{{ contact.contactMethods?.length || 0 }} contact methods</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- Missing Contacts -->
|
||||||
|
<div
|
||||||
|
v-if="comparison.differences.contacts.missing.filter(c => c.did).length > 0"
|
||||||
|
class="mt-4"
|
||||||
|
>
|
||||||
|
<h4 class="text-sm font-medium text-gray-900 mb-2">
|
||||||
|
Missing Contacts ({{ comparison.differences.contacts.missing.filter(c => c.did).length }}):
|
||||||
|
</h4>
|
||||||
|
<div class="space-y-1">
|
||||||
|
<div
|
||||||
|
v-for="contact in comparison.differences.contacts.missing.filter(c => c.did)"
|
||||||
|
:key="contact.did"
|
||||||
|
class="text-xs text-gray-600 bg-gray-50 p-2 rounded"
|
||||||
|
>
|
||||||
|
<div class="font-medium">{{ contact.name || '<empty>' }}</div>
|
||||||
|
<div class="text-gray-500">{{ contact.did }}</div>
|
||||||
|
<div class="text-gray-400">{{ contact.contactMethods?.length || 0 }} contact methods</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
Reference in New Issue
Block a user