feat: cron job run history panel and job model display (#319)

- Jobs page: cron run history panel with job selection and filtering
- Jobs page: model shown as read-only on job cards
- Job form modal: properly typed payloads
- i18n: added runHistory, model keys to all 8 locales

packages/client/src/components/hermes/jobs/JobsPanel.vue

@@ -3,13 +3,28 @@ import JobCard from './JobCard.vue'
 import { useJobsStore } from '@/stores/hermes/jobs'
 import { useI18n } from 'vue-i18n'
 
-const { t } = useI18n()
+const props = defineProps<{
+  selectedJobId: string | null
+}>()
 
 const emit = defineEmits<{
   edit: [jobId: string]
+  select: [jobId: string | null]
 }>()
 
+const { t } = useI18n()
+
 const jobsStore = useJobsStore()
+
+function handleSelect(jobId: string) {
+  emit('select', props.selectedJobId === jobId ? null : jobId)
+}
+
+function handleDeselect() {
+  if (props.selectedJobId) {
+    emit('select', null)
+  }
+}
 </script>
 
 <template>
@@ -27,9 +42,17 @@ const jobsStore = useJobsStore()
       v-for="job in jobsStore.jobs"
       :key="job.id"
       :job="job"
+      :selected="selectedJobId === (job.job_id || job.id)"
       @edit="emit('edit', job.id)"
+      @select="handleSelect"
     />
   </div>
+  <!-- Click outside cards to deselect -->
+  <div
+    v-if="selectedJobId"
+    class="deselect-overlay"
+    @click="handleDeselect"
+  />
 </template>
 
 <style scoped lang="scss">
@@ -58,4 +81,8 @@ const jobsStore = useJobsStore()
   grid-template-columns: repeat(auto-fill, minmax(min(100%, 360px), 1fr));
   gap: 14px;
 }
+
+.deselect-overlay {
+  display: none;
+}
 </style>