-
View
-
Edit
-
+
+
- {{% endfor %}}
- {{% endif %}}
- {{% if my_freelance_offers %}}
-
My Freelance Offers
- {{% for offer_id, offer in my_freelance_offers.items() %}}
-
-
{{ offer.title }}
-
Published: {{ offer.published_at[:10] }}
-
-
- {{% endfor %}}
- {{% endif %}}
+
-{{% endblock %}}
-"""
+ const formFieldsConfig = {
+ resumes: ['title', 'skills', 'experience', 'education', 'contact_info', 'description'],
+ vacancies: ['company_name', 'title', 'location', 'description', 'requirements', 'salary_range', 'contact_info'],
+ freelance_offers: ['title', 'description', 'skills', 'salary_range', 'timeline', 'contact_info']
+ };
-ADMIN_SYNC_TEMPLATE = """
-{{% extends "base_template" %}}
-{{% block content %}}
-
-
-
Sync with Data Store
-
-
-
-
-
Backup occurs automatically every 30 minutes and after each save. Use these buttons for immediate sync.
-
-
-
Data Overview
-
Total Resumes: {{ data_counts.resumes }}
-
Total Vacancies: {{ data_counts.vacancies }}
-
Total Freelance Offers: {{ data_counts.freelance_offers }}
-
-
Back to Main Page
-{{% endblock %}}
-{{% block extra_js %}}
-
-{{% endblock %}}
-"""
+ function applyTheme(themeParams) {
+ const root = document.documentElement;
+ for (const key in themeParams) {
+ if (key.startsWith('bg_color')) root.style.setProperty('--tg-theme-bg-color', themeParams[key]);
+ if (key.startsWith('text_color')) root.style.setProperty('--tg-theme-text-color', themeParams[key]);
+ if (key.startsWith('hint_color')) root.style.setProperty('--tg-theme-hint-color', themeParams[key]);
+ if (key.startsWith('link_color')) root.style.setProperty('--tg-theme-link-color', themeParams[key]);
+ if (key.startsWith('button_color')) root.style.setProperty('--tg-theme-button-color', themeParams[key]);
+ if (key.startsWith('button_text_color')) root.style.setProperty('--tg-theme-button-text-color', themeParams[key]);
+ if (key.startsWith('secondary_bg_color')) root.style.setProperty('--tg-theme-secondary-bg-color', themeParams[key]);
+ }
+ // Additional derivations if not directly provided by older Telegram versions
+ root.style.setProperty('--tg-theme-header-bg-color', themeParams.header_bg_color || themeParams.bg_color || '#ffffff');
+ root.style.setProperty('--tg-theme-section-bg-color', themeParams.section_bg_color || themeParams.bg_color || '#ffffff');
+ root.style.setProperty('--tg-theme-destructive-text-color', themeParams.destructive_text_color || '#ff3b30');
+ root.style.setProperty('--tg-theme-section-header-text-color', themeParams.section_header_text_color || themeParams.hint_color || '#707579');
+ root.style.setProperty('--tg-border-color', themeParams.border_color || themeParams.hint_color || '#c8c7cc');
+ root.style.setProperty('--tg-separator-color', themeParams.separator_color || themeParams.hint_color || '#e5e5e5');
+ }
+
+ function initApp() {
+ tg.ready();
+ tg.expand();
+ applyTheme(tg.themeParams);
+ tg.onEvent('themeChanged', () => applyTheme(tg.themeParams));
+
+ if (tg.initDataUnsafe && tg.initDataUnsafe.user) {
+ currentUser = tg.initDataUnsafe.user;
+ document.getElementById('userDisplay').textContent = `Hi, ${currentUser.first_name}!`;
+ } else {
+ document.getElementById('userDisplay').textContent = 'Welcome!';
+ // Potentially disable creation if no user
+ }
+
+ document.querySelectorAll('.tab-button').forEach(button => {
+ button.addEventListener('click', () => switchTab(button.dataset.tab));
+ });
+ document.getElementById('fabCreateNew').addEventListener('click', showCreateForm);
+ document.getElementById('itemForm').addEventListener('submit', handleFormSubmit);
+ document.getElementById('cancelFormBtn').addEventListener('click', hideFormModal);
+
+ document.getElementById('formModal').addEventListener('click', (event) => {
+ if (event.target === document.getElementById('formModal')) {
+ hideFormModal();
+ }
+ });
+ document.getElementById('detailModal').addEventListener('click', (event) => {
+ if (event.target === document.getElementById('detailModal')) {
+ hideDetailModal();
+ }
+ });
+
+ tg.MainButton.setText('Create New');
+ tg.MainButton.onClick(showCreateForm);
+ tg.MainButton.show();
-# --- Helper function to get item type display name ---
-def get_item_type_display_name(item_type_slug):
- names = {
- 'resume': 'Resume',
- 'vacancy': 'Vacancy',
- 'freelance_offer': 'Freelance Offer'
- }
- return names.get(item_type_slug, 'Item')
+ loadItems(currentTab);
+ }
-def get_item_collection_name(item_type_slug):
- names = {
- 'resume': 'resumes',
- 'vacancy': 'vacancies',
- 'freelance_offer': 'freelance_offers'
- }
- return names.get(item_type_slug)
+ function switchTab(tabName) {
+ currentTab = tabName;
+ document.querySelectorAll('.tab-button').forEach(button => {
+ button.classList.toggle('active', button.dataset.tab === tabName);
+ });
+ tg.MainButton.setText(`Create New ${capitalizeFirstLetter(tabName.slice(0,-1))}`);
+ loadItems(tabName);
+ }
+
+ function capitalizeFirstLetter(string) {
+ return string.charAt(0).toUpperCase() + string.slice(1);
+ }
-# --- Flask Routes ---
-@app.before_request
-def check_auth_for_publish():
- if request.endpoint in ['publish_item', 'edit_item', 'delete_item', 'my_postings']:
- if 'user' not in session or not session['user']:
- flash("You need to be authenticated to access this page. Please ensure you are opening this app through Telegram.", "error")
- return redirect(url_for('index'))
- if not session['user'].get('id'):
- flash("Authentication error: User ID missing.", "error")
- session.pop('user', None)
- return redirect(url_for('index'))
+ async function loadItems(type) {
+ const contentArea = document.getElementById('contentArea');
+ contentArea.innerHTML = '
Loading...
';
+ try {
+ const response = await fetch(`/api/${type}`);
+ if (!response.ok) throw new Error(`HTTP error! status: ${response.status}`);
+ const items = await response.json();
+ itemsCache[type] = items;
+ renderItems(type);
+ } catch (error) {
+ console.error('Error loading items:', error);
+ contentArea.innerHTML = '
Error loading items. Please try again.
';
+ tg.showAlert(`Error loading ${type}: ${error.message}`);
+ }
+ }
-@app.route('/auth_telegram', methods=['POST'])
-def auth_telegram():
- data = request.get_json()
- init_data_str = data.get('init_data')
- if not init_data_str:
- return jsonify({"status": "error", "message": "No initData received"}), 400
+ function renderItems(type) {
+ const contentArea = document.getElementById('contentArea');
+ const items = itemsCache[type];
+ if (items.length === 0) {
+ contentArea.innerHTML = `
No ${type} found.
`;
+ return;
+ }
+ contentArea.innerHTML = items.map(item => `
+
+
${escapeHtml(item.title || item.job_title || item.service_title || 'Untitled')}
+
${escapeHtml(item.description ? item.description.substring(0, 100) + '...' : 'No description')}
+
By: ${escapeHtml(item.user_telegram_username || 'Anonymous')} | ${new Date(item.created_at).toLocaleDateString()}
+
+ `).join('');
+
+ document.querySelectorAll('.list-item').forEach(itemEl => {
+ itemEl.addEventListener('click', () => showItemDetail(itemEl.dataset.id, itemEl.dataset.type));
+ });
+ }
+
+ function escapeHtml(unsafe) {
+ if (unsafe === null || typeof unsafe === 'undefined') return '';
+ return String(unsafe)
+ .replace(/&/g, "&")
+ .replace(//g, ">")
+ .replace(/"/g, """)
+ .replace(/'/g, "'");
+ }
- user_info = validate_telegram_data(init_data_str)
-
- if user_info and user_info.get('id'):
- session['user'] = user_info
- logging.info(f"User {user_info.get('id')} authenticated via Telegram.")
- return jsonify({"status": "success", "user": user_info})
- else:
- logging.warning(f"Telegram authentication failed for initData: {init_data_str[:100]}...")
- session.pop('user', None)
- return jsonify({"status": "error", "message": "Invalid Telegram data or hash mismatch"}), 403
+ function showCreateForm() {
+ document.getElementById('itemForm').reset();
+ document.getElementById('itemId').value = '';
+ document.getElementById('itemType').value = currentTab;
+ document.getElementById('formTitle').textContent = `Create New ${capitalizeFirstLetter(currentTab.slice(0,-1))}`;
+
+ const allFormGroups = document.querySelectorAll('#itemForm .form-group');
+ allFormGroups.forEach(group => group.style.display = 'none');
+
+ const fieldsForType = formFieldsConfig[currentTab];
+ fieldsForType.forEach(fieldKey => {
+ const group = document.getElementById(`group-${fieldKey}`);
+ if (group) group.style.display = 'block';
+ });
+
+ document.getElementById('formModal').classList.add('visible');
+ tg.MainButton.hide();
+ }
-@app.route('/')
-def index():
- data = load_data()
- # Apply theme params from session if available, otherwise use defaults
- theme_params = session.get('themeParams', {})
- return render_template_string(
- BASE_TEMPLATE.format(
- background_color=theme_params.get('bg_color'),
- text_color=theme_params.get('text_color'),
- hint_color=theme_params.get('hint_color'),
- link_color=theme_params.get('link_color'),
- button_color=theme_params.get('button_color'),
- button_text_color=theme_params.get('button_text_color'),
- secondary_bg_color=theme_params.get('secondary_bg_color'),
- header_color=theme_params.get('header_bg_color'),
- accent_text_color=theme_params.get('accent_text_color'),
- section_bg_color=theme_params.get('section_bg_color'),
- section_header_text_color=theme_params.get('section_header_text_color'),
- destructive_text_color=theme_params.get('destructive_text_color')
- ) + INDEX_TEMPLATE,
- resumes=data.get('resumes', {}),
- vacancies=data.get('vacancies', {}),
- freelance_offers=data.get('freelance_offers', {}),
- repo_id=REPO_ID
- )
+ function hideFormModal() {
+ document.getElementById('formModal').classList.remove('visible');
+ tg.MainButton.show();
+ }
-@app.route('/publish/
', methods=['GET', 'POST'])
-@app.route('/edit//', methods=['GET', 'POST'])
-def publish_item(item_type, item_id=None):
- data = load_data()
- collection_name = get_item_collection_name(item_type)
- if not collection_name:
- flash("Invalid item type.", "error")
- return redirect(url_for('index'))
+ async function handleFormSubmit(event) {
+ event.preventDefault();
+ if (!currentUser) {
+ tg.showAlert('You need to be logged in via Telegram to post.');
+ return;
+ }
- item_data_to_edit = None
- if item_id:
- item_data_to_edit = data.get(collection_name, {}).get(item_id)
- if not item_data_to_edit or item_data_to_edit.get('user_id') != session['user']['id']:
- flash("Item not found or you don't have permission to edit it.", "error")
- return redirect(url_for('index'))
- # Prepare complex fields for form display
- if item_type == 'resume':
- if item_data_to_edit.get('experience'):
- item_data_to_edit['experience_str'] = "\n".join([f"{e['company']};{e['role']};{e['duration']};{e['description']}" for e in item_data_to_edit['experience']])
- if item_data_to_edit.get('education'):
- item_data_to_edit['education_str'] = "\n".join([f"{e['institution']};{e['degree']};{e['duration']}" for e in item_data_to_edit['education']])
+ const form = event.target;
+ const formData = new FormData(form);
+ const itemData = Object.fromEntries(formData.entries());
+
+ itemData.user_telegram_id = currentUser.id;
+ itemData.user_telegram_username = currentUser.username || `${currentUser.first_name}${currentUser.last_name ? ' ' + currentUser.last_name : ''}`;
+
+ if (itemData.skills) itemData.skills = itemData.skills.split(',').map(s => s.trim()).filter(s => s);
+
+ const type = itemData.type;
+ delete itemData.type;
+
+ const itemId = itemData.id;
+ delete itemData.id;
+
+ const method = itemId ? 'PUT' : 'POST';
+ const url = itemId ? `/api/${type}/${itemId}` : `/api/${type}`;
+
+ try {
+ const response = await fetch(url, {
+ method: method,
+ headers: { 'Content-Type': 'application/json' },
+ body: JSON.stringify(itemData)
+ });
+ if (!response.ok) {
+ const errorData = await response.json();
+ throw new Error(errorData.error || `HTTP error! status: ${response.status}`);
+ }
+ const savedItem = await response.json();
+ hideFormModal();
+ tg.HapticFeedback.notificationOccurred('success');
+ tg.showAlert(`${capitalizeFirstLetter(type.slice(0,-1))} ${itemId ? 'updated' : 'created'} successfully!`);
+ loadItems(type);
+ } catch (error) {
+ console.error('Error submitting form:', error);
+ tg.showAlert(`Error: ${error.message}`);
+ tg.HapticFeedback.notificationOccurred('error');
+ }
+ }
+
+ function showItemDetail(itemId, itemType) {
+ const item = itemsCache[itemType].find(i => i.id === itemId);
+ if (!item) {
+ tg.showAlert('Item not found.');
+ return;
+ }
+
+ let detailHtml = ``;
+ detailHtml += `
${escapeHtml(item.title || item.job_title || item.service_title || 'Untitled')}
`;
+
+ if (item.company_name) detailHtml += `
Company: ${escapeHtml(item.company_name)}
`;
+ if (item.location) detailHtml += `
Location: ${escapeHtml(item.location)}
`;
+
+ detailHtml += `
Description:
${escapeHtml(item.description).replace(/\\n/g, '
')}
`;
+
+ if (item.skills && item.skills.length > 0) detailHtml += `
Skills: ${escapeHtml(Array.isArray(item.skills) ? item.skills.join(', ') : item.skills)}
`;
+ if (item.experience) detailHtml += `
Experience:
${escapeHtml(item.experience).replace(/\\n/g, '
')}
`;
+ if (item.education) detailHtml += `
Education:
${escapeHtml(item.education).replace(/\\n/g, '
')}
`;
+ if (item.requirements) detailHtml += `
Requirements:
${escapeHtml(item.requirements).replace(/\\n/g, '
')}
`;
+ if (item.salary_range) detailHtml += `
Salary/Budget: ${escapeHtml(item.salary_range)}
`;
+ if (item.timeline) detailHtml += `
Timeline: ${escapeHtml(item.timeline)}
`;
+
+ detailHtml += `
Contact: ${escapeHtml(item.contact_info)}
`;
+ detailHtml += `
Posted by: ${escapeHtml(item.user_telegram_username || 'Anonymous')} on ${new Date(item.created_at).toLocaleString()}
`;
+
+ if (currentUser && item.user_telegram_id === currentUser.id) {
+ detailHtml += `
`;
+ detailHtml += `
`;
+ }
+ detailHtml += `
`;
+ detailHtml += `
- {{% endif %}}
- 
- {{% endif %}}
-