|
|
@@ -68,36 +68,66 @@
|
|
|
{{ $t("associate_validation.associate_found") }}
|
|
|
</div>
|
|
|
|
|
|
- <div class="q-mt-md">
|
|
|
+ <div class="result-body q-mt-md">
|
|
|
+
|
|
|
+ <div class="result-photo">
|
|
|
+ <q-avatar size="80px" color="purple-2">
|
|
|
+ <img
|
|
|
+ v-if="associate.photo_url"
|
|
|
+ :src="associate.photo_url"
|
|
|
+ style="object-fit: cover; width: 100%; height: 100%;"
|
|
|
+ />
|
|
|
+ <q-icon
|
|
|
+ v-else
|
|
|
+ name="mdi-account"
|
|
|
+ size="48px"
|
|
|
+ color="purple-6"
|
|
|
+ />
|
|
|
+ </q-avatar>
|
|
|
+ </div>
|
|
|
|
|
|
- <div class="result-row">
|
|
|
- <span class="result-label">
|
|
|
- {{ $t("associate_validation.name") }}
|
|
|
- </span>
|
|
|
+ <div class="result-info">
|
|
|
|
|
|
- <span class="result-value">
|
|
|
- {{ associate.name }}
|
|
|
- </span>
|
|
|
- </div>
|
|
|
+ <div class="result-row">
|
|
|
+ <span class="result-label">
|
|
|
+ {{ $t("associate_validation.name") }}
|
|
|
+ </span>
|
|
|
|
|
|
- <div class="result-row">
|
|
|
- <span class="result-label">
|
|
|
- {{ $t("associate_validation.cpf") }}
|
|
|
- </span>
|
|
|
+ <span class="result-value">
|
|
|
+ {{ associate.name }}
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
|
|
|
- <span class="result-value">
|
|
|
- {{ associate.cpf }}
|
|
|
- </span>
|
|
|
- </div>
|
|
|
+ <div class="result-row">
|
|
|
+ <span class="result-label">
|
|
|
+ {{ $t("associate_validation.cpf") }}
|
|
|
+ </span>
|
|
|
+
|
|
|
+ <span class="result-value">
|
|
|
+ {{ associate.cpf }}
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="result-row">
|
|
|
+ <span class="result-label">
|
|
|
+ {{ $t("associate_validation.registration") }}
|
|
|
+ </span>
|
|
|
+
|
|
|
+ <span class="result-value">
|
|
|
+ {{ associate.registration }}
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
+
|
|
|
+ <div class="result-row">
|
|
|
+ <span class="result-label">
|
|
|
+ {{ $t("associate_validation.expiry_date") }}
|
|
|
+ </span>
|
|
|
|
|
|
- <div class="result-row">
|
|
|
- <span class="result-label">
|
|
|
- {{ $t("associate_validation.registration") }}
|
|
|
- </span>
|
|
|
+ <span class="result-value">
|
|
|
+ {{ associate.expiry_date || "—" }}
|
|
|
+ </span>
|
|
|
+ </div>
|
|
|
|
|
|
- <span class="result-value">
|
|
|
- {{ associate.registration }}
|
|
|
- </span>
|
|
|
</div>
|
|
|
|
|
|
</div>
|
|
|
@@ -208,6 +238,20 @@ const onValidate = async () => {
|
|
|
color: #702082;
|
|
|
}
|
|
|
|
|
|
+.result-body {
|
|
|
+ display: flex;
|
|
|
+ gap: 20px;
|
|
|
+ align-items: flex-start;
|
|
|
+}
|
|
|
+
|
|
|
+.result-photo {
|
|
|
+ flex-shrink: 0;
|
|
|
+}
|
|
|
+
|
|
|
+.result-info {
|
|
|
+ flex: 1;
|
|
|
+}
|
|
|
+
|
|
|
.result-row {
|
|
|
display: flex;
|
|
|
gap: 6px;
|