Skip to content

اطلاعات ریسورس Resource Information

این الگوی رفتاری برای نمایش سریع پیکربندی‌های (Configurations) یک منبع در قالب Side Panel طراحی شده است. هدف اصلی این الگو، حذف کلیک‌های اضافی و جلوگیری از خروج کاربر از صفحه لیست برای مشاهده جزئیات کلیدی و غیرقابل ویرایش است.

هدف و ضرورت

در جداول منابع، ردیف‌ها تنها شامل اطلاعات خلاصه هستند. الگوی Resource Information به کاربر اجازه می‌دهد بدون ورود به صفحات عمیق تحلیل یا ویرایش، نمای کلی تنظیماتی که در زمان ساخت انتخاب کرده است را مشاهده کند.

مسیر دستیابی

کاربر می‌تواند از طریق دکمه آیکون‌دار Information در ستون انتهای جدول، به سایدپنل اطلاعات دسترسی پیدا کند.

مسیر دسترسی از جدول

نحوه عملکرد

  1. Trigger: کلیک روی آیکون info در ردیف مورد نظر.
  2. Loading: نمایش Skeleton تا زمان بارگذاری کامل داده‌ها.
  3. Display: نمایش اطلاعات در قالب دسته‌بندی‌های مشخص (Basic, Core, Advanced).
  4. Action: امکان انتقال به صفحه ویرایش از طریق فوتر سایدپنل.
  5. Dismiss: بستن پنل با کلیک روی دکمه «بستن» یا فضای خارج از پنل (Overlay).

ساختار محتوایی سایدپنل

ساختار محتوا در این سایدپنل باید آینه‌ای از فرآیند Create Resource باشد تا مدل ذهنی کاربر حفظ شود.

ساختار سکشن‌ها

۱. بخش محتوا

اطلاعات باید در قالب جفت‌های Key-Value و به صورت Read-only نمایش داده شوند:

  • Basic Info: اطلاعات پایه (نام، توضیحات، تگ‌ها).
  • Core Config: تنظیمات اصلی فنی (ظرفیت، پلن، پارامترهای کلیدی).
  • Advanced Settings: تنظیمات اختیاری و پیشرفته.

هر بخش باید با یک Divider و عنوان مشخص از بخش دیگر جدا شود.

۲. بخش فوتر

بخش فوتر

ویرایش مقادیر

در این الگو، هیچ‌گونه ویرایش درجا (In-line editing) مجاز نیست. سایدپنل صرفا جنبه نمایش اطلاعات (Read-only) دارد. برای هرگونه تغییر، کاربر باید از طریق دکمه فوتر به صفحه اختصاصی ویرایش هدایت شود.

نکات طراحی

DoDon't
داده‌ها را برای اسکن سریع در قالب جفت‌های Key-Value نمایش دهید.از این سایدپنل به عنوان جایگزین صفحه جزئیات کامل (Details Page) استفاده نکنید.
ترتیب سکشن‌ها را دقیقا مطابق با فرم ساخت (Create) تنظیم کنید.در داخل سایدپنل فیلد ورودی یا قابلیت ویرایش قرار ندهید.
از Divider برای تفکیک منطقی بخش‌ها استفاده کنید.اطلاعات غیرضروری و بیش از حد جزئی را در این نما نمایش ندهید.

تمایز با صفحه جزئیات کامل

این پترن نباید با Resource Details Page اشتباه گرفته شود. کاربر برای مشاهده تحلیل‌های عمیق، لاگ‌ها یا نمودارها باید به صفحه جزئیات کامل برود که از مسیرهای زیر در دسترس است:

  1. کلیک روی نام منبع در اولین ستون جدول.
  2. انتخاب گزینه Resource Details از منوی سه نقطه (More Options) در ستون عملیات.