@samitouri / QOSami_Agents_Zero-1
Code Commits Issues Pulls Sessions CI/CD
main
main
html 177 lines 11.4 KB
Raw
1 <html>
2 <head>
3 <title>Task Details</title>
4 <script type="module">
5 import { store } from "/components/modals/scheduler/scheduler-store.js";
6 </script>
7 </head>
8 <body>
9 <div x-data>
10 <template x-if="$store.schedulerStore">
11 <div class="scheduler-detail-view"
12 x-show="$store.schedulerStore.selectedTaskForDetail">
13 <div class="scheduler-detail-header">
14 <div class="scheduler-detail-header-left">
15 <h2 class="scheduler-detail-title"
16 x-text="$store.schedulerStore.selectedTaskForDetail ? $store.schedulerStore.selectedTaskForDetail.name : ''"></h2>
17 <div class="scheduler-status-badge"
18 :class="$store.schedulerStore.selectedTaskForDetail ? $store.schedulerStore.getStateBadgeClass($store.schedulerStore.selectedTaskForDetail.state) : ''"
19 x-text="$store.schedulerStore.selectedTaskForDetail ? $store.schedulerStore.selectedTaskForDetail.state : ''"></div>
20 </div>
21 <div class="buttons-container scheduler-detail-actions">
22 <div class="buttons-left">
23 <button type="button" class="button cancel"
24 @click="$confirmClick($event, () => $store.schedulerStore.deleteFromDetail())">Delete</button>
25 </div>
26 <div class="buttons-right">
27 <button type="button" class="button confirm"
28 @click="$store.schedulerStore.editFromDetail()">Edit</button>
29 <button type="button" class="button"
30 @click="$store.schedulerStore.runTask($store.schedulerStore.selectedTaskForDetail.uuid)">Run</button>
31
32 </div>
33 </div>
34 </div>
35
36 <div class="scheduler-detail-content">
37 <div class="scheduler-details-grid">
38 <div class="scheduler-details-label">Type:</div>
39 <div class="scheduler-details-value"
40 x-text="$store.schedulerStore.selectedTaskForDetail ? $store.schedulerStore.formatTaskType($store.schedulerStore.selectedTaskForDetail.type) : ''"></div>
41
42 <div class="scheduler-details-label">Project:</div>
43 <div class="scheduler-details-value">
44 <span class="project-color-ball"
45 :style="$store.schedulerStore.extractTaskProject($store.schedulerStore.selectedTaskForDetail)?.color ? { backgroundColor: $store.schedulerStore.extractTaskProject($store.schedulerStore.selectedTaskForDetail).color } : { border: '1px solid var(--color-border)' }"></span>
46 <span x-text="$store.schedulerStore.selectedTaskForDetail ? $store.schedulerStore.formatTaskProject($store.schedulerStore.selectedTaskForDetail) : 'No Project'"></span>
47 </div>
48
49 <div class="scheduler-details-label">Created:</div>
50 <div class="scheduler-details-value"
51 x-text="$store.schedulerStore.selectedTaskForDetail ? $store.schedulerStore.formatDate($store.schedulerStore.selectedTaskForDetail.created_at) : ''"></div>
52
53 <div class="scheduler-details-label">Last Updated:</div>
54 <div class="scheduler-details-value"
55 x-text="$store.schedulerStore.selectedTaskForDetail ? $store.schedulerStore.formatDate($store.schedulerStore.selectedTaskForDetail.updated_at) : ''"></div>
56
57 <div class="scheduler-details-label">Last Run:</div>
58 <div class="scheduler-details-value"
59 x-text="$store.schedulerStore.selectedTaskForDetail ? $store.schedulerStore.formatDate($store.schedulerStore.selectedTaskForDetail.last_run) : ''"></div>
60
61 <div class="scheduler-details-label"
62 x-show="$store.schedulerStore.selectedTaskForDetail && $store.schedulerStore.selectedTaskForDetail.type === 'scheduled'">
63 Schedule:</div>
64 <div class="scheduler-details-value"
65 x-show="$store.schedulerStore.selectedTaskForDetail && $store.schedulerStore.selectedTaskForDetail.type === 'scheduled'"
66 x-text="$store.schedulerStore.selectedTaskForDetail ? $store.schedulerStore.formatSchedule($store.schedulerStore.selectedTaskForDetail) : ''">
67 </div>
68
69 <div class="scheduler-details-label"
70 x-show="$store.schedulerStore.selectedTaskForDetail && $store.schedulerStore.selectedTaskForDetail.type === 'adhoc'">
71 Token:</div>
72 <div class="scheduler-details-value"
73 x-show="$store.schedulerStore.selectedTaskForDetail && $store.schedulerStore.selectedTaskForDetail.type === 'adhoc'"
74 x-text="$store.schedulerStore.selectedTaskForDetail ? $store.schedulerStore.selectedTaskForDetail.token : ''"></div>
75
76 <div class="scheduler-details-label"
77 x-show="$store.schedulerStore.selectedTaskForDetail && $store.schedulerStore.selectedTaskForDetail.type === 'planned'">
78 Plan:</div>
79 <div class="scheduler-details-value"
80 x-show="$store.schedulerStore.selectedTaskForDetail && $store.schedulerStore.selectedTaskForDetail.type === 'planned'">
81 <div x-show="$store.schedulerStore.selectedTaskForDetail && $store.schedulerStore.selectedTaskForDetail.plan">
82 <div><strong>Upcoming:</strong></div>
83 <template x-if="$store.schedulerStore.selectedTaskForDetail && $store.schedulerStore.selectedTaskForDetail.plan && $store.schedulerStore.selectedTaskForDetail.plan.todo && $store.schedulerStore.selectedTaskForDetail.plan.todo.length > 0">
84 <div>
85 <template x-for="(time, index) in $store.schedulerStore.selectedTaskForDetail.plan.todo" :key="index">
86 <div x-text="$store.schedulerStore.formatDate(time)"></div>
87 </template>
88 </div>
89 </template>
90 <template x-if="!$store.schedulerStore.selectedTaskForDetail || !$store.schedulerStore.selectedTaskForDetail.plan || !$store.schedulerStore.selectedTaskForDetail.plan.todo || $store.schedulerStore.selectedTaskForDetail.plan.todo.length === 0">
91 <div>No upcoming executions</div>
92 </template>
93
94 <div><strong>In Progress:</strong></div>
95 <div
96 x-text="$store.schedulerStore.selectedTaskForDetail && $store.schedulerStore.selectedTaskForDetail.plan && $store.schedulerStore.selectedTaskForDetail.plan.in_progress ? $store.schedulerStore.formatDate($store.schedulerStore.selectedTaskForDetail.plan.in_progress) : 'None'"></div>
97
98 <div><strong>Completed:</strong></div>
99 <template x-if="$store.schedulerStore.selectedTaskForDetail && $store.schedulerStore.selectedTaskForDetail.plan && $store.schedulerStore.selectedTaskForDetail.plan.done && $store.schedulerStore.selectedTaskForDetail.plan.done.length > 0">
100 <div>
101 <template x-for="(time, index) in $store.schedulerStore.selectedTaskForDetail.plan.done" :key="index">
102 <div x-text="$store.schedulerStore.formatDate(time)"></div>
103 </template>
104 </div>
105 </template>
106 <template x-if="!$store.schedulerStore.selectedTaskForDetail || !$store.schedulerStore.selectedTaskForDetail.plan || !$store.schedulerStore.selectedTaskForDetail.plan.done || $store.schedulerStore.selectedTaskForDetail.plan.done.length === 0">
107 <div>No completed executions</div>
108 </template>
109 </div>
110 </div>
111
112 <div class="scheduler-details-label">Last Result:</div>
113 <div class="scheduler-details-value"
114 x-text="$store.schedulerStore.selectedTaskForDetail && $store.schedulerStore.selectedTaskForDetail.last_result ? $store.schedulerStore.selectedTaskForDetail.last_result : 'No results yet'"></div>
115
116 <div class="scheduler-details-label">System Prompt:</div>
117 <div class="scheduler-details-value"
118 x-text="$store.schedulerStore.selectedTaskForDetail ? $store.schedulerStore.selectedTaskForDetail.system_prompt : ''"></div>
119
120 <div class="scheduler-details-label">User Prompt:</div>
121 <div class="scheduler-details-value"
122 x-text="$store.schedulerStore.selectedTaskForDetail ? $store.schedulerStore.selectedTaskForDetail.prompt : ''"></div>
123
124 <div class="scheduler-details-label">Attachments:</div>
125 <div class="scheduler-details-value">
126 <template x-if="$store.schedulerStore.selectedTaskForDetail && $store.schedulerStore.selectedTaskForDetail.attachments && $store.schedulerStore.selectedTaskForDetail.attachments.length > 0">
127 <div>
128 <template x-for="(attachment, index) in $store.schedulerStore.selectedTaskForDetail.attachments" :key="index">
129 <div x-text="attachment"></div>
130 </template>
131 </div>
132 </template>
133 <template x-if="!$store.schedulerStore.selectedTaskForDetail || !$store.schedulerStore.selectedTaskForDetail.attachments || $store.schedulerStore.selectedTaskForDetail.attachments.length === 0">
134 <div>No attachments</div>
135 </template>
136 </div>
137 </div>
138 </div>
139 </div>
140 </template>
141
142 <!-- Modal Footer (exists immediately so modals.js can move it) -->
143 <template x-if="$store.schedulerStore">
144 <div class="modal-footer scheduler-detail-footer" data-modal-footer>
145 <div class="buttons-container scheduler-detail-footer-actions">
146 <div class="buttons-left">
147 <button type="button" class="button cancel"
148 @click="$confirmClick($event, () => $store.schedulerStore.deleteFromDetail())">Delete</button>
149 </div>
150 <div class="buttons-right">
151 <button type="button" class="button confirm"
152 @click="$store.schedulerStore.editFromDetail()">Edit</button>
153 <button type="button" class="button"
154 @click="$store.schedulerStore.runTask($store.schedulerStore.selectedTaskForDetail.uuid)">Run</button>
155 </div>
156 </div>
157 </div>
158 </template>
159 </div>
160
161 <style>
162 .scheduler-detail-actions {
163 width: 100%;
164 }
165
166 .scheduler-detail-footer {
167 padding: 0.6rem 1rem;
168 }
169
170 .scheduler-detail-footer-actions {
171 width: 100%;
172 }
173 </style>
174
175 </body>
176 </html>
177