{% load jalali_tags %}
{% if show_list %}
    <div class="flex flex-row flex-wrap">
        {% for item in fields %}
            {% if item.separator %}
                <div class="w-full mb-4">
                    <div class="bg-gray-200 text-gray-700 text-center font-semibold py-2 rounded">{{ item.separator }}</div>
                </div>
            {% else %}
                <div class="{{ item.col_class }} mb-4 px-2 flex flex-col gap-2 ">
                    <p class="form-label font-extrabold text-base">{{ item.label }}:</p>
                    {% if item.input_type == "select" and item.options %}
                        {% for val, label, selected in item.options %}
                            {% if selected %}
                                {{ label }}
                            {% endif %}
                        {% endfor %}
                    {% elif item.input_type == "file" %}
                        <a href="{{item.value}}" class="text-blue-600 hover:underline">مشاهده فایل</a>
                    {% elif item.input_type == "textarea" %}
                        <pre class="overflow-auto">{{ item.value }}</pre>
                    {% elif item.input_type == "date" %}
                        <p>{{ item.value|to_jalali:'%Y/%m/%d'|default:'' }}</p>
                    {% elif item.input_type == "datetime" %}
                        <p>{{ item.value|to_jalali:'%Y/%m/%d %H:%m:%S'|default:'' }}</p>
                    {% elif item.input_type == "time" %}
                        <p>{{ item.value|to_jalali:'%H:%m:%S'|default:'' }}</p>
                    {% else %}
                        {% if item.value and item.value|slice:":4" == "http" %}
							<a href="{{ item.value }}" target="_blank" class="text-blue-600 hover:underline">
								{{ item.value }}
							</a>
						{% else %}
							<p>{{ item.value|default:"" }}</p>
						{% endif %}

                    {% endif %}
                    {% if instance and instance.errors and item.field_name in instance.errors %}
                        <p class="text-red-500 text-sm mt-1">{{ instance.errors }}</p>
                    {% endif %}
                </div>
            {% endif %}
        {% endfor %}
    </div>
{% else %}
<form action="{% url 'core:ajax_handler' %}" method="post" enctype="multipart/form-data" class="space-y-6">
    {% csrf_token %}
    <div class="flex flex-row flex-wrap">
        {% for item in fields %}
            {% if item.separator %}
                <div class="w-full mb-4">
                    <div class="bg-gray-200 text-gray-700 text-center font-semibold py-2 rounded">{{ item.separator }}</div>
                </div>
            {% elif item.input_type == "hidden" %}
                <input type="hidden" name="{{ item.field_name }}" value="{{ item.value|default:'' }}">
            {% else %}
                <div class="{{ item.col_class }} mb-4 px-2 {% if item.readonly and item.disabled %} flex gap-2 {% endif %}">
                    <label class="form-label">{{ item.label }}{% if item.readonly and item.disabled %}: {% endif %}{% if item.required %}<span class="text-red-500 {% if item.readonly and item.disabled %} m-0 {% else %} mr-1 {% endif %}">*</span>{% endif %}</label>
                    {% if item.readonly and item.disabled %}
                        <p class="form-text">{{ item.value|default:'' }}</p>
                    {% elif item.input_type == "select" and item.options %}
                        <select name="{{ item.field_name }}" class="form-input" {% if item.disabled %}disabled{% endif %} {% if item.readonly %}readonly{% endif %}>
                            {% for val, label, selected in item.options %}
                                <option value="{{ val }}" {% if selected %}selected{% endif %}>{{ label }}</option>
                            {% endfor %}
                        </select>
                    {% elif item.input_type == "autocomplete" and item.options %}
						<div class="mb-3">
							<select x-ref="select_{{ item.field_name }}" name="{{ item.field_name }}" 
									class="autocomplete w-full" 
									data-app-label="{{ item.options.app_label }}" 
									data-model-name="{{ item.options.model_name }}" 
									data-ajax-url="{{ item.options.ajax_url }}">
								<option value="">---</option>
								{% if item.options.selected_pk %}
									<option value="{{ item.options.selected_pk }}" selected>{{ item.options.selected_label }}</option>
								{% endif %}
							</select>
						</div>
                    {% elif item.input_type == "multiselect" and item.options %}
                        <select name="{{ item.field_name }}" multiple class="form-input h-80" {% if item.disabled %}disabled{% endif %} {% if item.readonly %}readonly{% endif %}>
                            {% for val, label, selected in item.options %}
                                <option value="{{ val }}" {% if selected %}selected{% endif %}>{{ label }}</option>
                            {% endfor %}
                        </select>
                    {% elif item.input_type == "file" %}
                        {% if item.readonly %}
							{% if item.value %}
								<a href="{{ item.value.url }}">مشاهده</a>
							{% endif %}
						{% else %}
                        	<input type="file" class="Dropify" name="{{ item.field_name }}" {% if item.value %} data-default-file="{{ item.value.url }}" {% endif %} {% if item.disabled %} disabled {% endif %} {% if item.readonly %} readonly {% endif %} {% for k,v in item.html_attrs.items %} {{ k }}="{{ v }}" {% endfor %}/>
						{% endif %}
                    {% elif item.input_type == "textarea" %}
                        <textarea name="{{ item.field_name }}" placeholder="{{ item.placeholder }}" class="form-input editor" {% if item.required %}required{% endif %} {% if item.disabled %}disabled{% endif %} {% if item.readonly %}readonly{% endif %} {% for k,v in item.html_attrs.items %} {{ k }}="{{ v }}" {% endfor %}>{{ item.value|safe|default:'' }}</textarea>
                    {% elif item.input_type == "date" %}
                        <input type="text" name="{{ item.field_name }}" placeholder="{{ item.placeholder }}" value="{{ item.value|to_jalali:'%Y/%m/%d'|default:'' }}" data-jdp class="form-input" {% if item.required %}required{% endif %} {% if item.disabled %}disabled{% endif %} {% if item.readonly %}readonly{% endif %} {% for k,v in item.html_attrs.items %} {{ k }}="{{ v }}" {% endfor %}>
                    {% elif item.input_type == "datetime" %}
                        <input type="text" name="{{ item.field_name }}" placeholder="{{ item.placeholder }}" value="{{ item.value|default:'' }}" data-jdp class="form-input" {% if item.required %}required{% endif %} {% if item.disabled %}disabled{% endif %} {% if item.readonly %}readonly{% endif %} {% for k,v in item.html_attrs.items %} {{ k }}="{{ v }}" {% endfor %}>
                    {% elif item.input_type == "time" %}
                        <input type="text" name="{{ item.field_name }}" placeholder="{{ item.placeholder }}" value="{{ item.value|default:'' }}" class="form-input persian-time" {% if item.required %}required{% endif %} {% if item.disabled %}disabled{% endif %} {% if item.readonly %}readonly{% endif %} {% for k,v in item.html_attrs.items %} {{ k }}="{{ v }}" {% endfor %}>
                    {% elif item.input_type == "color" %}
                        <input type="color" name="{{ item.field_name }}" value="{{ item.value|default:'#000000' }}" class="form-input" {% if item.required %}required{% endif %} {% if item.disabled %}disabled{% endif %} {% if item.readonly %}readonly{% endif %} {% for k,v in item.html_attrs.items %} {{ k }}="{{ v }}" {% endfor %}>
                    {% else %}
                        <input type="{{ item.input_type }}" name="{{ item.field_name }}" placeholder="{{ item.placeholder }}" value="{{ item.value|default:'' }}" class="form-input" {% if item.required %}required{% endif %} {% if item.disabled %}disabled{% endif %} {% if item.readonly %}readonly{% endif %} {% for k,v in item.html_attrs.items %} {{ k }}="{{ v }}" {% endfor %}>
                    {% endif %}
                    {% if instance and instance.errors and item.field_name in instance.errors %}
                        <p class="text-red-500 text-sm mt-1">{{ instance.errors }}</p>
                    {% endif %}
					{% if item.readonly and item.disabled %}
						<p>({{ item.placeholder }})</p>
					{% else %}
						<p class="mt-2">{{ item.placeholder }}</p>
					{% endif %}
                </div>
            {% endif %}
        {% endfor %}
    </div>
    <div class="mt-6 flex flex-wrap gap-3">
        <input type="hidden" name="model" value="{{ model_name }}">
        <input type="hidden" name="action_type" value="{{ action_type }}">
        <input type="hidden" name="return_url" value="{{ return_url }}">

        {% if show_update %}
            <button type="submit" class="btn btn-primary">ثبت تغییرات</button>
        {% endif %}
    </div>
</form>

{% if show_duplicate %}
<form action="{% url 'core:ajax_handler' %}" method="post" class="mt-4 flex gap-3">
    {% csrf_token %}
    <div class="hidden">
        {% for item in fields %}
            {% if item.separator %}
                <div class="w-full mb-4">
                    <div class="bg-gray-200 text-gray-700 text-center font-semibold py-2 rounded">{{ item.separator }}</div>
                </div>
            {% elif item.input_type == "hidden" %}
                <input type="hidden" name="{{ item.field_name }}" value="{{ item.value|default:'' }}">
            {% else %}
                <div class="{{ item.col_class }} mb-4 px-2 {% if item.readonly and item.disabled %} flex gap-2 {% endif %}">
                    <label class="form-label">{{ item.label }}{% if item.readonly and item.disabled %}: {% endif %}{% if item.required %}<span class="text-red-500 {% if item.readonly and item.disabled %} m-0 {% else %} mr-1 {% endif %}">*</span>{% endif %}</label>
                    {% if item.readonly and item.disabled %}
                        <p class="form-text">{{ item.value|default:'' }}</p>
                    {% elif item.input_type == "select" and item.options %}
                        <select name="{{ item.field_name }}" class="form-input" {% if item.disabled %}disabled{% endif %} {% if item.readonly %}readonly{% endif %}>
                            {% for val, label, selected in item.options %}
                                <option value="{{ val }}" {% if selected %}selected{% endif %}>{{ label }}</option>
                            {% endfor %}
                        </select>
                    {% elif item.input_type == "autocomplete" and item.options %}
						<div class="mb-3 {{ field.col_class }}">
							<label>{{ field.label }}</label>
							<select x-ref="select_{{ field.field_name }}" name="{{ field.field_name }}" class="autocomplete w-full">
								{% if field.options.selected_pk %}
									<option value="{{ field.options.selected_pk }}" selected>{{ field.options.selected_label }}</option>
								{% endif %}
							</select>
						</div>
                    {% elif item.input_type == "multiselect" and item.options %}
                        <select name="{{ item.field_name }}" multiple class="form-input h-80" {% if item.disabled %}disabled{% endif %} {% if item.readonly %}readonly{% endif %}>
                            {% for val, label, selected in item.options %}
                                <option value="{{ val }}" {% if selected %}selected{% endif %}>{{ label }}</option>
                            {% endfor %}
                        </select>
                    {% elif item.input_type == "file" %}
						{% if item.readonly %}
							{% if item.value %}
								<a href="{{ item.value.url }}">مشاهده</a>
							{% endif %}
						{% else %}
                        	<input type="file" class="Dropify" name="{{ item.field_name }}" {% if item.value %} data-default-file="{{ item.value.url }}" {% endif %} {% if item.disabled %} disabled {% endif %} {% if item.readonly %} readonly {% endif %} {% for k,v in item.html_attrs.items %} {{ k }}="{{ v }}" {% endfor %}/>
						{% endif %}
                    {% elif item.input_type == "textarea" %}
                        <textarea name="{{ item.field_name }}" placeholder="{{ item.placeholder }}" class="form-input" {% if item.required %}required{% endif %} {% if item.disabled %}disabled{% endif %} {% if item.readonly %}readonly{% endif %} {% for k,v in item.html_attrs.items %} {{ k }}="{{ v }}" {% endfor %}>{{ item.value|default:'' }}</textarea>
                    {% elif item.input_type == "date" %}
                        <input type="text" name="{{ item.field_name }}" placeholder="{{ item.placeholder }}" value="{{ item.value|to_jalali:'%Y/%m/%d'|default:'' }}" class="form-input persian-date" {% if item.required %}required{% endif %} {% if item.disabled %}disabled{% endif %} {% if item.readonly %}readonly{% endif %} {% for k,v in item.html_attrs.items %} {{ k }}="{{ v }}" {% endfor %}>
                    {% elif item.input_type == "datetime" %}
                        <input type="text" name="{{ item.field_name }}" placeholder="{{ item.placeholder }}" value="{{ item.value|default:'' }}" class="form-input persian-datetime" {% if item.required %}required{% endif %} {% if item.disabled %}disabled{% endif %} {% if item.readonly %}readonly{% endif %} {% for k,v in item.html_attrs.items %} {{ k }}="{{ v }}" {% endfor %}>
                    {% elif item.input_type == "time" %}
                        <input type="text" name="{{ item.field_name }}" placeholder="{{ item.placeholder }}" value="{{ item.value|default:'' }}" class="form-input persian-time" {% if item.required %}required{% endif %} {% if item.disabled %}disabled{% endif %} {% if item.readonly %}readonly{% endif %} {% for k,v in item.html_attrs.items %} {{ k }}="{{ v }}" {% endfor %}>
                    {% elif item.input_type == "color" %}
                        <input type="color" name="{{ item.field_name }}" value="{{ item.value|default:'#000000' }}" class="form-input" {% if item.required %}required{% endif %} {% if item.disabled %}disabled{% endif %} {% if item.readonly %}readonly{% endif %} {% for k,v in item.html_attrs.items %} {{ k }}="{{ v }}" {% endfor %}>
                    {% else %}
                        <input type="{{ item.input_type }}" name="{{ item.field_name }}" placeholder="{{ item.placeholder }}" value="{{ item.value|default:'' }}" class="form-input" {% if item.required %}required{% endif %} {% if item.disabled %}disabled{% endif %} {% if item.readonly %}readonly{% endif %} {% for k,v in item.html_attrs.items %} {{ k }}="{{ v }}" {% endfor %}>
                    {% endif %}
                    {% if instance and instance.errors and item.field_name in instance.errors %}
                        <p class="text-red-500 text-sm mt-1">{{ instance.errors }}</p>
                    {% endif %}
                </div>
            {% endif %}
        {% endfor %}
    </div>
    <input type="hidden" name="model" value="{{ model_name }}">
    <input type="hidden" name="action_type" value="add">
	<input type="hidden" name="duplicate" value="True">
    <input type="hidden" name="return_url" value="{{ return_url }}">
    <button type="submit" class="btn btn-secondary">ایجاد کپی</button>
</form>
{% endif %}

{% if not trashed and show_add_to_trash %}
<form action="{% url 'core:ajax_handler' %}" method="post" class="mt-4 flex gap-3">
    {% csrf_token %}
    <input type="hidden" name="model" value="{{ model_name }}">
    <input type="hidden" name="id" value="{{ instance.id }}">
    <input type="hidden" name="action_type" value="update">
    <input type="hidden" name="trashed" value="True">
    <input type="hidden" name="return_url" value="{{ return_url }}">
    <button type="submit" class="btn btn-warning">انتقال به سطل زباله</button>
</form>
{% endif %}

{% if trashed %}
<div class="flex gap-3 mt-4">
    <form action="{% url 'core:ajax_handler' %}" method="post">
        {% csrf_token %}
        <input type="hidden" name="model" value="{{ model_name }}">
        <input type="hidden" name="id" value="{{ instance.id }}">
        <input type="hidden" name="action_type" value="update">
        <input type="hidden" name="return_url" value="{{ return_url }}">
	    <input type="hidden" name="trashed" value="False">
        <button type="submit" class="btn btn-success">بازیابی</button>
    </form>
    <form action="{% url 'core:ajax_handler' %}" method="post">
        {% csrf_token %}
        <input type="hidden" name="model" value="{{ model_name }}">
        <input type="hidden" name="id" value="{{ instance.id }}">
        <input type="hidden" name="action_type" value="delete">
        <input type="hidden" name="return_url" value="{{ return_url }}">
        <button type="submit" class="btn btn-danger">حذف دائم</button>
    </form>
</div>
{% endif %}

{% endif %}