{% extends "base.html" %}
{% block title %}{% if customer %}记录沟通 - {{ customer.name }}{% else %}记录沟通{% endif %} - 本地贷款CRM{% endblock %}
{% block header_title %}{% if customer %}与 {{ customer.name }} 的沟通{% else %}新建沟通记录{% endif %}{% endblock %}
{% block content %}

<div class="max-w-xl mx-auto">
    <form method="POST" class="bg-white rounded-xl shadow-sm border border-gray-100 p-4 md:p-6 space-y-4">
        {% if customer %}
        <div class="text-sm text-gray-600">
            客户：<span class="font-medium">{{ customer.name }}</span>
            {% if customer.phone %} · {{ customer.phone }}{% endif %}
        </div>
        <input type="hidden" name="customer_id" value="{{ customer.id }}">
        {% else %}
        <div>
            <label class="block text-sm text-gray-600 mb-1">客户 <span class="text-red-500">*</span></label>
            <select name="customer_id" required class="w-full px-3 py-2.5 border border-gray-300 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-primary/30">
                <option value="">请选择客户</option>
                {% for c in customer_list %}{% endfor %}
            </select>
        </div>
        {% endif %}

        <div class="grid grid-cols-2 gap-4">
            <div>
                <label class="block text-sm text-gray-600 mb-1">沟通方式</label>
                <select name="comm_type" class="w-full px-3 py-2.5 border border-gray-300 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-primary/30">
                    <option value="电话">电话</option>
                    <option value="微信">微信</option>
                    <option value="面谈">面谈</option>
                    <option value="短信">短信</option>
                </select>
            </div>
            <div>
                <label class="block text-sm text-gray-600 mb-1">方向</label>
                <select name="direction" class="w-full px-3 py-2.5 border border-gray-300 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-primary/30">
                    <option value="主动联系">主动联系</option>
                    <option value="客户主动">客户主动</option>
                </select>
            </div>
        </div>

        <div>
            <label class="block text-sm text-gray-600 mb-1">通话时长（分钟）</label>
            <input type="number" name="duration_min" min="0" class="w-full px-3 py-2.5 border border-gray-300 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-primary/30">
        </div>

        <div>
            <label class="block text-sm text-gray-600 mb-1">情绪</label>
            <select name="mood" class="w-full px-3 py-2.5 border border-gray-300 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-primary/30">
                <option value="">不评价</option>
                <option value="积极">积极</option>
                <option value="中性">中性</option>
                <option value="消极">消极</option>
            </select>
        </div>

        <div>
            <label class="block text-sm text-gray-600 mb-1">内容摘要</label>
            <textarea name="summary" rows="4" placeholder="记录沟通的关键内容..."
                      class="w-full px-3 py-2.5 border border-gray-300 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-primary/30"></textarea>
        </div>

        <div>
            <label class="block text-sm text-gray-600 mb-1">下次联系时间</label>
            <input type="datetime-local" name="next_contact_at" class="w-full px-3 py-2.5 border border-gray-300 rounded-lg text-sm focus:outline-none focus:ring-2 focus:ring-primary/30">
        </div>

        <div class="flex items-center gap-3 pt-2">
            <button type="submit" class="px-6 py-2.5 bg-primary text-white text-sm font-medium rounded-lg hover:bg-blue-700">保存记录</button>
            <a href="{% if customer %}/customers/{{ customer.id }}{% else %}/communications{% endif %}"
               class="px-6 py-2.5 border border-gray-300 text-sm rounded-lg text-gray-600 hover:bg-gray-50">取消</a>
        </div>
    </form>
</div>

{% endblock %}