check_ok

templates/extend_spec.html

@@ -0,0 +1,117 @@
+{% extends "base.html" %}
+
+{% block title %}展延暫時規範{% endblock %}
+
+{% block content %}
+<h2 class="mb-4">展延暫時規範</h2>
+
+<div class="card">
+  <div class="card-header">
+    規範編號: <strong>{{ spec.spec_code }}</strong>
+  </div>
+  <div class="card-body">
+    <form method="post" enctype="multipart/form-data">
+      <p><strong>主題:</strong> {{ spec.title }}</p>
+      <p><strong>原結束日期:</strong> {{ spec.end_date.strftime('%Y-%m-%d') }}</p>
+      
+      <div class="mb-3">
+        <label for="new_end_date" class="form-label"><strong>新的結束日期</strong></label>
+        <input type="date" class="form-control" id="new_end_date" name="new_end_date" 
+               value="{{ default_new_end_date.strftime('%Y-%m-%d') }}" required>
+        <div class="form-text">預設為原結束日期後一個月。</div>
+      </div>
+
+      <div class="mb-3">
+        <label for="new_file" class="form-label"><strong>重新上傳佐證檔案 (必填)</strong></label>
+        <input class="form-control" type="file" id="new_file" name="new_file" accept=".pdf" required>
+        <div class="form-text">請上傳展延申請的相關佐證文件 (PDF 格式)。</div>
+      </div>
+
+      <!-- 郵件通知對象選擇 -->
+      <div class="mb-3">
+        <label for="recipients" class="form-label"><strong>郵件通知對象</strong></label>
+        {% if saved_emails %}
+        <div class="alert alert-info mb-2">
+          <small>以下為生效時設定的通知對象，您可以直接使用或進行編輯。如果修改，展延後將更新為新的通知對象。</small>
+        </div>
+        {% endif %}
+        <select id="recipients" name="recipients" multiple placeholder="請輸入姓名或 Email 來搜尋...">
+        </select>
+        <div class="form-text">可搜尋姓名或 Email 地址，支援多人選擇</div>
+      </div>
+
+      <button type="submit" class="btn btn-primary">確認展延</button>
+      <a href="{{ url_for('temp_spec.spec_list') }}" class="btn btn-secondary">取消</a>
+    </form>
+  </div>
+</div>
+{% endblock %}
+
+{% block scripts %}
+<script>
+document.addEventListener('DOMContentLoaded', function() {
+    // 預先載入已儲存的郵件清單
+    {% if saved_emails %}
+    const savedEmails = "{{ saved_emails }}".split(';').filter(email => email.trim());
+    {% else %}
+    const savedEmails = [];
+    {% endif %}
+    
+    const recipientSelect = new TomSelect('#recipients', {
+        valueField: 'value',
+        labelField: 'text',
+        searchField: 'text',
+        placeholder: '請輸入姓名或 Email 來搜尋...',
+        plugins: ['remove_button'],
+        maxItems: null,
+        create: false,
+        load: function(query, callback) {
+            if (!query || query.length < 2) {
+                callback();
+                return;
+            }
+            
+            fetch(`/api/ldap-search?q=${encodeURIComponent(query)}`)
+                .then(response => {
+                    if (!response.ok) {
+                        throw new Error('Network response was not ok');
+                    }
+                    return response.json();
+                })
+                .then(data => {
+                    callback(data);
+                })
+                .catch(error => {
+                    console.error('LDAP search error:', error);
+                    callback();
+                });
+        },
+        onItemAdd: function(value, item) {
+            // 選擇項目後清空搜尋框
+            this.setTextboxValue('');
+            this.refreshOptions(false);
+        },
+        render: {
+            option: function(item, escape) {
+                return `<div class="py-1">${escape(item.text)}</div>`;
+            },
+            item: function(item, escape) {
+                // 移除藍底背景，改用淺灰背景
+                return `<div class="badge bg-light text-dark border me-1">${escape(item.text)}</div>`;
+            }
+        }
+    });
+    
+    // 預填已儲存的郵件
+    if (savedEmails.length > 0) {
+        savedEmails.forEach(email => {
+            const trimmedEmail = email.trim();
+            if (trimmedEmail) {
+                recipientSelect.addOption({value: trimmedEmail, text: trimmedEmail});
+                recipientSelect.addItem(trimmedEmail);
+            }
+        });
+    }
+});
+</script>
+{% endblock %}