<template>
  <v-card class="span-12 panel-pad">
    <div class="toolbar-row mb-1">
      <div>
        <h2 class="section-title">Password &amp; account security</h2>
        <p class="quiet text-body-2">
          Rules enforced for locally managed users — applied when passwords are set or changed, and on sign-in.
        </p>
      </div>
    </div>
    <v-alert v-if="error" type="error" density="compact" class="mb-3">{{ error }}</v-alert>

    <div class="policy-grid">
      <div>
        <h3 class="section-title text-body-1 mb-2">Complexity</h3>
        <div class="form-grid">
          <v-text-field
            v-model.number="policy.min_length"
            type="number"
            min="4"
            label="Minimum length"
            density="compact"
          />
        </div>
        <v-switch v-model="policy.require_upper" label="Require an uppercase letter" color="primary" density="compact" hide-details />
        <v-switch v-model="policy.require_lower" label="Require a lowercase letter" color="primary" density="compact" hide-details />
        <v-switch v-model="policy.require_number" label="Require a number" color="primary" density="compact" hide-details />
        <v-switch v-model="policy.require_symbol" label="Require a symbol" color="primary" density="compact" hide-details />
        <v-switch v-model="policy.disallow_identifiers" label="Disallow name or email in password" color="primary" density="compact" hide-details />
      </div>

      <div>
        <h3 class="section-title text-body-1 mb-2">Rotation &amp; reuse</h3>
        <div class="form-grid">
          <v-text-field
            v-model.number="policy.history_count"
            type="number"
            min="0"
            label="Block reuse of last N passwords"
            hint="0 disables password history"
            persistent-hint
            density="compact"
          />
          <v-text-field
            v-model.number="policy.expiry_days"
            type="number"
            min="0"
            label="Expire passwords after (days)"
            hint="0 = never expires"
            persistent-hint
            density="compact"
          />
          <v-text-field
            v-model.number="policy.min_age_hours"
            type="number"
            min="0"
            label="Minimum password age (hours)"
            hint="0 = can change anytime"
            persistent-hint
            density="compact"
          />
        </div>

        <h3 class="section-title text-body-1 mb-2 mt-4">Account lockout</h3>
        <div class="form-grid">
          <v-text-field
            v-model.number="policy.lockout_threshold"
            type="number"
            min="0"
            label="Lock after N failed sign-ins"
            hint="0 disables lockout"
            persistent-hint
            density="compact"
          />
          <v-text-field
            v-model.number="policy.lockout_window_minutes"
            type="number"
            min="1"
            label="Lock duration (minutes)"
            density="compact"
          />
        </div>
      </div>

      <div>
        <h3 class="section-title text-body-1 mb-2">What users will see</h3>
        <v-alert type="info" variant="tonal" density="comfortable">
          <ul class="rule-list">
            <li v-for="rule in rules" :key="rule">{{ rule }}</li>
          </ul>
        </v-alert>
      </div>
    </div>

    <v-divider class="my-4" />
    <div class="toolbar-row">
      <v-spacer />
      <v-btn color="primary" prepend-icon="mdi-content-save" :loading="saving" @click="save">Save policy</v-btn>
    </div>
  </v-card>
</template>

<script>
import { apiRequest } from '../services/api';

// Password & account-lockout policy editor (Admin → Password & Security). Binds to GET/PUT
// /api/password-policy; the server returns plain-English `rules` which drive the live "what users will
// see" preview so the form and the enforced rules never drift.
export default {
  props: {
    token: { type: String, required: true }
  },
  data() {
    return {
      policy: {
        min_length: 12,
        require_upper: true,
        require_lower: true,
        require_number: true,
        require_symbol: true,
        disallow_identifiers: true,
        history_count: 5,
        expiry_days: 90,
        min_age_hours: 0,
        lockout_threshold: 5,
        lockout_window_minutes: 15
      },
      rules: [],
      saving: false,
      error: ''
    };
  },
  mounted() {
    this.load();
  },
  methods: {
    async api(path, options = {}) {
      return apiRequest(path, this.token, options);
    },
    async load() {
      this.error = '';
      try {
        const data = await (await this.api('/api/password-policy')).json();
        this.policy = { ...this.policy, ...data.policy };
        this.rules = data.rules;
      } catch (error) {
        this.error = error.message;
      }
    },
    async save() {
      this.saving = true;
      this.error = '';
      try {
        const data = await (await this.api('/api/password-policy', {
          method: 'PUT',
          body: JSON.stringify({ policy: this.policy })
        })).json();
        this.policy = { ...this.policy, ...data.policy };
        this.rules = data.rules;
      } catch (error) {
        this.error = error.message;
      } finally {
        this.saving = false;
      }
    }
  }
};
</script>

<style scoped>
.policy-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 24px;
}
.rule-list {
  padding-left: 18px;
  line-height: 1.7;
  margin: 0;
}
</style>
