Edit the operations column for automated SMS rules.

apps/web/src/views/MessageAutomationsView.vue

@@ -1057,8 +1057,7 @@ onUnmounted(() => {
             <th>زمان‌بندی</th>
             <th>مخاطب</th>
             <th>کانال</th>
-            <th>فعال</th>
-            <th></th>
+            <th>عملیات</th>
           </tr>
         </thead>
         <tbody>
@@ -1071,19 +1070,24 @@ onUnmounted(() => {
             <td>{{ scheduleLabel(row) }}</td>
             <td>{{ MESSAGE_AUTOMATION_TARGET_LABELS[row.notifyTarget] }}</td>
             <td>{{ MESSAGE_AUTOMATION_CHANNEL_LABELS[row.channel] }}</td>
-            <td>
+            <td class="ops">
               <button
-                class="toggle"
+                class="icon-btn status"
                 type="button"
                 :class="{ on: row.isActive }"
                 :aria-pressed="row.isActive"
                 :aria-label="row.isActive ? 'فعال' : 'غیرفعال'"
+                :title="row.isActive ? 'فعال' : 'غیرفعال'"
                 @click="toggle(row)"
-              />
-            </td>
-            <td class="ops">
-              <button class="btn ghost" type="button" @click="startEdit(row)">ویرایش</button>
-              <button class="btn danger" type="button" @click="remove(row)">حذف</button>
+              >
+                <UiIcon :name="row.isActive ? 'check-plain' : 'x'" :size="16" />
+              </button>
+              <button class="icon-btn" type="button" title="ویرایش" aria-label="ویرایش" @click="startEdit(row)">
+                <UiIcon name="pencil" :size="16" />
+              </button>
+              <button class="icon-btn danger" type="button" title="حذف" aria-label="حذف" @click="remove(row)">
+                <UiIcon name="trash" :size="16" />
+              </button>
             </td>
           </tr>
         </tbody>
@@ -1797,17 +1801,54 @@ textarea {
   opacity: 0.62;
 }
 
-.desk-table .preview {
-  display: block;
-  margin-top: 0.2rem;
-  color: #94a3b8;
-  font-size: 0.75rem;
-  max-width: 18rem;
-  overflow: hidden;
-  text-overflow: ellipsis;
+.desk-table .ops {
+  display: flex;
+  align-items: center;
+  gap: 0.3rem;
+  flex-wrap: nowrap;
+  width: 1%;
   white-space: nowrap;
 }
 
+.icon-btn {
+  display: grid;
+  place-items: center;
+  width: 36px;
+  height: 36px;
+  padding: 0;
+  border: 1px solid #e2e8f0;
+  border-radius: var(--radius);
+  background: #fff;
+  color: #64748b;
+  cursor: pointer;
+}
+
+.icon-btn:hover {
+  background: #f8fafc;
+  color: #0f172a;
+}
+
+.icon-btn.danger {
+  color: #b91c1c;
+  border-color: #fecaca;
+}
+
+.icon-btn.danger:hover {
+  background: #fef2f2;
+}
+
+.icon-btn.status {
+  border-color: #fecaca;
+  background: #fef2f2;
+  color: #dc2626;
+}
+
+.icon-btn.status.on {
+  border-color: #bbf7d0;
+  background: #f0fdf4;
+  color: #16a34a;
+}
+
 .mobile-cards {
   display: grid;
   gap: 0.75rem;