<h2 style="padding: 10px; background-color: whitesmoke; text-align: center;">ایجاد پیامک جدید</h2>

<form method="POST" id="form-gravityforms-template" action="<?php echo add_query_arg(['action' => $_GET['action'] ?? 'create']); ?>">
    <input type="hidden" name="meta[subject]" value="form" />
    <input type="hidden" name="meta[owner]" value="<?php echo $_GET['tab'] ?? 'user'; ?>" />

    <table class="form-table">
        <tbody>
            <tr>
                <th scope="row">
                    <label for="input_name">عنوان</label>
                </th>
                <td>
                    <input type="text" name="title" id="input_name" value="<?php echo $data['template']['title'] ?? ''; ?>" required style="min-width: 300px;"/>
                </td>
            </tr>
            <tr>
                <th scope="row">وضعیت</th>
                <td>
                    <input type="radio" name="is_active" value="1" <?php echo (isset($data['template']['is_active']) && $data['template']['is_active']) ? 'checked' : ''; ?> checked />
                    <label>فعال</label>
                    <br/>
                    <input type="radio" name="is_active" value="0" <?php echo (isset($data['template']['is_active']) && !$data['template']['is_active']) ? 'checked' : ''; ?> />
                    <label>غیرفعال</label>
                </td>
            </tr>
            <tr>
                <th scope="row">
                    <label for="select-form">فرم</label>
                </th>
                <td>
                    <select name="meta[form_id]" id="select-form" required style="min-width: 300px;">
                        <option value="">انتخاب</option>
                        <?php foreach($data['forms'] as $form): ?>
                            <option value="<?php echo $form['id']; ?>"
                                    data-form_fields='<?= $form['fields_json'] ?>'
                                    <?php echo $form['id'] == ($data['template']['meta']['form_id'] ?? '') ? 'selected' : ''; ?>
                            >
                                <?= $form['title'] ?>
                            </option>
                        <?php endforeach; ?>
                    </select>
                </td>
            </tr>
            <?php if(!isset($_GET['tab']) || 'user' === $_GET['tab']): ?>
                <tr>
                    <th scope="row">
                        <label for="select-field">فیلد موبایل</label>
                    </th>
                    <td>
                        <select name="meta[mobile_field_id]" id="select-field" required style="min-width: 300px;">
                            <option value="">انتخاب</option>
                            <!-- append options by jquery -->
                            <?php
                                foreach ($data['forms'] as $form) {
                                    if (isset($data['template']['meta']['form_id']) && $data['template']['meta']['form_id'] == $form['id']) {
                                        foreach ($form['fields'] as $field) {
                                            echo sprintf(
                                                '<option value="%s" %s>%d - %s</option>',
                                                $field['id'],
                                                $data['template']['meta']['mobile_field_id'] == $field['id'] ? 'selected' : '',
                                                $field['id'],
                                                $field['label']
                                            );
                                        }
                                    }
                                }
                            ?>
                        </select>
                    </td>
                </tr>
            <?php elseif('admin' === $_GET['tab']): ?>
                <tr>
                    <th scope="row">
                        <label for="select_contacts">دریافت کنندگان</label>
                    </th>
                    <td>
                        <select name="meta[contacts_ids][]" id="select_contacts" multiple required style="min-width: 300px;">
                            <option value="">انتخاب</option>
                            <?php
                            $contacts_ids = $data['template']['meta']['contacts_ids'] ?? [];
                            foreach($data['contacts'] as $contact):
                            ?>
                                <option value="<?php echo $contact['id']; ?>" <?php echo in_array($contact['id'], $contacts_ids) ? 'selected' : ''; ?>>
                                    <?php echo $contact['name']; ?>
                                </option>
                            <?php endforeach; ?>
                        </select>
                    </td>
                </tr>
            <?php endif; ?>

            <tr>
                <th scope="row">
                    <label for="select-pattern">الگو</label>
                </th>
                <td>
                    <select name="pattern_id" id="select-pattern" required style="min-width: 300px;">
                        <option value="">انتخاب</option>
                        <?php foreach($data['patterns'] as $pattern): ?>
                            <option value="<?= $pattern['id'] ?>"
                                    data-pattern_text="<?= $pattern['pattern'] ?>"
                                    data-pattern_variables='<?= $pattern['variables_json'] ?>'
                                    <?php echo isset($data['template']['pattern_id']) && $data['template']['pattern_id'] == $pattern['id'] ? 'selected' : ''; ?>
                            >
                                <?= $pattern['title'] ?>
                            </option>
                        <?php endforeach; ?>
                    </select>
                    <p id="p-show-pattern"></p>
                </td>
            </tr>
            <tr>
                <th scope="row">
                    <label for="">جایگذاری</label>
                </th>
                <td style="padding-top: 0;">
                    <table>
                        <thead>
                            <tr>
                                <th>متغیر الگو</th>
                                <th>متغیر فرم</th>
                                <th>مقدار پیش فرض</th>
                            </tr>
                        </thead>
                        <tbody id="tbody-variables-and-values">
                            <!-- show inputs by jquery -->
                            <?php if (isset( $data['template']['variables_and_values'] )): ?>
                                <?php foreach($data['template']['variables_and_values'] as $item): ?>
                                    <tr>
                                        <td>
                                            <?php echo $item['index'] . ' - ' . $item['variable']; ?>
                                            <input type="hidden" name="variables_and_values[<?php echo $item['index']; ?>][index]" value="<?php echo $item['index']; ?>" />
                                            <input type="hidden" name="variables_and_values[<?php echo $item['index']; ?>][variable]" value="<?php echo $item['variable']; ?>" />
                                        </td>
                                        <td>
                                            <select name="variables_and_values[<?php echo $item['index']; ?>][value]" class="select-variable-value" data-index="<?php echo $item['index']; ?>">
                                                <option value="">انتخاب</option>
                                                <?php /*
                                                <option value="{NAME}" <?php echo '{NAME}' === $item['value'] ? 'selected' : ''; ?>>NAME</option>
                                                <option value="{DOMAIN}" <?php echo '{DOMAIN}' === $item['value'] ? 'selected' : ''; ?>>DOMAIN</option>
                                                <option value="{OTP}" <?php echo '{OTP}' === $item['value'] ? 'selected' : ''; ?>>OTP</option>
                                                */?>

                                                <?php
                                                    foreach ($data['forms'] as $form) {
                                                        if ($data['template']['meta']['form_id'] == $form['id']) {
                                                            echo '<optgroup label="فیلدهای فرم">';
                                                            foreach ($form['fields'] as $field) {
                                                                echo sprintf(
                                                                    '<option value="%s" %s>%d - %s</option>',
                                                                    $field['inputs'],
                                                                    $item['value'] == $field['inputs'] ? 'selected' : '',
                                                                    $field['id'],
                                                                    $field['label']
                                                                );
                                                            }
                                                            echo '</optgroup>';
                                                            echo '<optgroup label="متغیرهای ثابت">';
                                                            ?>
                                                            <option value="date_created" <?php echo $item['value'] == 'date_created' ? 'selected': ''; ?>>تاریخ و ساعت</option>
                                                            <option value="custom_date_created" <?php echo $item['value'] == 'custom_date_created' ? 'selected': ''; ?>>تاریخ</option>
                                                            <option value="custom_time_created" <?php echo $item['value'] == 'custom_time_created' ? 'selected': ''; ?>>ساعت</option>
                                                            <?php
                                                            echo '</optgroup>';
                                                        }
                                                    }
                                                ?>
                                            </select>
                                        </td>
                                        <td>
                                            <input type="text" name="variables_and_values[<?php echo $item['index']; ?>][default]" value="<?php echo $item['default']; ?>" class="input-variable-default" data-index="<?php echo $item['index']; ?>" <?php echo empty($item['value']) ? 'required' : ''; ?> />
                                        </td>
                                    </tr>
                                <?php endforeach; ?>
                            <?php endif; ?>
                        </tbody>
                    </table>
                </td>
            </tr>
        </tbody>
    </table>
    <button type="submit" class="button button-primary">
        <?php echo isset($_GET['action']) && 'edit' === $_GET['action'] ? 'ذخیره تغییرات' : ' ایجاد '; ?>
    </button>
</form>

<h2 style="padding: 10px; background-color: whitesmoke; text-align: center;">پیامک‌های ایجاد شده</h2>

<?php $data['table']->display(); ?>