<?php

use yii\helpers\Html;
use yii\widgets\ActiveForm;
use yii\helpers\Url;

/* @var $this yii\web\View */
/* @var $model modules\netsuite\models\SettingsForm */

$this->title = 'NetSuite Settings';
$this->params['breadcrumbs'][] = ['label' => 'Settings', 'url' => ['index']];
$this->params['breadcrumbs'][] = $this->title;
?>

<div class="netsuite-settings">
    <div class="row">
        <div class="col-md-8">
            <div class="card">
                <div class="card-header">
                    <h3 class="card-title">
                        <i class="fa fa-cog"></i> <?= Html::encode($this->title) ?>
                    </h3>
                </div>
                <div class="card-body">
                    <?php $form = ActiveForm::begin([
                        'id' => 'netsuite-settings-form',
                        'options' => ['class' => 'form-horizontal'],
                        'fieldConfig' => [
                            'template' => "{label}\n<div class=\"col-sm-9\">{input}\n{hint}\n{error}</div>",
                            'labelOptions' => ['class' => 'col-sm-3 control-label'],
                        ],
                    ]); ?>

                    <div class="form-section">
                        <h4 class="section-title">
                            <i class="fa fa-toggle-on"></i> Integration Status
                        </h4>
                        
                        <?= $form->field($model, 'enabled')->checkbox([
                            'label' => 'Enable NetSuite Integration',
                            'template' => "<div class=\"col-sm-offset-3 col-sm-9\">{input} {label}\n{hint}\n{error}</div>",
                        ]) ?>
                    </div>

                    <div class="form-section">
                        <h4 class="section-title">
                            <i class="fa fa-key"></i> Authentication Credentials
                        </h4>

                        <?= $form->field($model, 'environment')->dropDownList([
                            'sandbox' => 'Sandbox (Testing)',
                            'production' => 'Production (Live)',
                        ], ['prompt' => 'Select Environment...']) ?>

                        <?= $form->field($model, 'account_id')->textInput([
                            'maxlength' => true,
                            'placeholder' => 'e.g., 1234567',
                        ]) ?>

                        <?= $form->field($model, 'consumer_key')->textInput([
                            'maxlength' => true,
                            'placeholder' => 'Consumer Key from NetSuite Integration',
                        ]) ?>

                        <?= $form->field($model, 'consumer_secret')->passwordInput([
                            'maxlength' => true,
                            'placeholder' => 'Consumer Secret',
                            'autocomplete' => 'new-password',
                        ]) ?>

                        <?= $form->field($model, 'token_id')->textInput([
                            'maxlength' => true,
                            'placeholder' => 'Token ID',
                        ]) ?>

                        <?= $form->field($model, 'token_secret')->passwordInput([
                            'maxlength' => true,
                            'placeholder' => 'Token Secret',
                            'autocomplete' => 'new-password',
                        ]) ?>
                    </div>

                    <div class="form-group">
                        <div class="col-sm-offset-3 col-sm-9">
                            <?= Html::submitButton('<i class="fa fa-save"></i> Save Settings', [
                                'class' => 'btn btn-success',
                                'id' => 'save-settings-btn',
                            ]) ?>
                            
                            <?= Html::button('<i class="fa fa-plug"></i> Test Connection', [
                                'class' => 'btn btn-info',
                                'id' => 'test-connection-btn',
                            ]) ?>
                            
                            <?= Html::a('<i class="fa fa-times"></i> Cancel', ['index'], [
                                'class' => 'btn btn-default',
                            ]) ?>
                        </div>
                    </div>

                    <?php ActiveForm::end(); ?>
                </div>
            </div>
        </div>

        <div class="col-md-4">
            <div class="card">
                <div class="card-header">
                    <h3 class="card-title">
                        <i class="fa fa-info-circle"></i> Setup Instructions
                    </h3>
                </div>
                <div class="card-body">
                    <div class="alert alert-info">
                        <h5><i class="fa fa-lightbulb"></i> How to get your credentials:</h5>
                        <ol>
                            <li>Log in to your NetSuite account</li>
                            <li>Go to <strong>Setup → Integration → Manage Integrations</strong></li>
                            <li>Create a new integration or select existing one</li>
                            <li>Copy the <strong>Consumer Key</strong> and <strong>Consumer Secret</strong></li>
                            <li>Go to <strong>Setup → Users/Roles → Access Tokens</strong></li>
                            <li>Create a new token for the integration</li>
                            <li>Copy the <strong>Token ID</strong> and <strong>Token Secret</strong></li>
                            <li>Enter all credentials in this form</li>
                        </ol>
                    </div>

                    <div class="alert alert-warning">
                        <h5><i class="fa fa-exclamation-triangle"></i> Security Note:</h5>
                        <p>These credentials will be stored in the <code>modules/netsuite/config/ns.php</code> file. Make sure this file is not committed to version control and has proper file permissions.</p>
                    </div>

                    <div class="info-box">
                        <h5><i class="fa fa-book"></i> Documentation:</h5>
                        <ul>
                            <li><a href="https://docs.oracle.com/en/cloud/saas/netsuite/ns-online-help/section_4247337262.html" target="_blank">NetSuite OAuth 1.0 Guide</a></li>
                            <li><a href="https://docs.oracle.com/en/cloud/saas/netsuite/ns-online-help/section_157771733782.html" target="_blank">Token-Based Authentication</a></li>
                        </ul>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>

<?php
$testUrl = Url::to(['settings/test-connection']);
$this->registerJs(<<<JS
$('#test-connection-btn').on('click', function() {
    var btn = $(this);
    var originalHtml = btn.html();
    
    btn.prop('disabled', true).html('<i class="fa fa-spinner fa-spin"></i> Testing...');
    
    $.ajax({
        url: '{$testUrl}',
        type: 'POST',
        dataType: 'json',
        success: function(response) {
            if (response.success) {
                alert('✓ ' + response.message);
            } else {
                alert('✗ ' + response.message);
            }
        },
        error: function() {
            alert('✗ Failed to test connection. Please try again.');
        },
        complete: function() {
            btn.prop('disabled', false).html(originalHtml);
        }
    });
});
JS
);
?>

<style>
.form-section {
    margin-bottom: 30px;
    padding-bottom: 20px;
    border-bottom: 1px solid #e0e0e0;
}

.form-section:last-child {
    border-bottom: none;
}

.section-title {
    margin-bottom: 20px;
    color: #333;
    font-size: 16px;
    font-weight: 600;
}

.section-title i {
    margin-right: 8px;
    color: #007bff;
}

.info-box {
    margin-top: 15px;
}

.info-box h5 {
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 10px;
}

.info-box ul {
    padding-left: 20px;
}

.info-box li {
    margin-bottom: 5px;
}

.alert h5 {
    font-size: 14px;
    font-weight: 600;
    margin-bottom: 10px;
}

.alert ol {
    padding-left: 20px;
    margin-bottom: 0;
}

.alert ol li {
    margin-bottom: 5px;
}

#save-settings-btn {
    margin-right: 10px;
}
</style>
