245 lines
10 KiB
JavaScript
245 lines
10 KiB
JavaScript
(function (window, document) {
|
||
'use strict';
|
||
|
||
function configFor(root) {
|
||
try { return JSON.parse(root.getAttribute('data-identity-config') || '{}'); } catch (_) { return {}; }
|
||
}
|
||
|
||
function parseResponse(response) {
|
||
var payload = response && (response.data !== undefined ? response.data : response.json);
|
||
return payload && payload.data !== undefined ? payload.data : payload;
|
||
}
|
||
|
||
function errorMessage(error, fallback) {
|
||
if (error && error.json) return error.json.message || fallback;
|
||
return error && error.message ? error.message : fallback;
|
||
}
|
||
|
||
function toast(message, type, time, id) {
|
||
if (message && typeof window.notyf === 'function') window.notyf(message, type || 'success', time, id);
|
||
}
|
||
|
||
function init(root) {
|
||
if (!root || root.dataset.identityBound === '1') return;
|
||
root.dataset.identityBound = '1';
|
||
|
||
var config = configFor(root);
|
||
var template = root.querySelector('[data-auth-modal-template]');
|
||
var runtime = window.AksrtModalRuntime;
|
||
if (!template || !runtime || !window.AksrtRequest) return;
|
||
|
||
function open() {
|
||
runtime.open({
|
||
html: template.innerHTML,
|
||
height: 320,
|
||
kind: 'identity',
|
||
className: 'aksrt-identity-modal-shell',
|
||
mobileBottom: true,
|
||
onContent: function (_, session) {
|
||
var shell = session && session.shell;
|
||
var form = shell && shell.querySelector('[data-auth-create]');
|
||
var input = form && form.querySelector('[data-auth-evidence]');
|
||
var preview = form && form.querySelector('[data-auth-preview]');
|
||
if (!form || !input || !preview) return;
|
||
shell.setAttribute('aria-labelledby', 'uc-auth-modal-title');
|
||
|
||
var selectedFiles = [];
|
||
function renderPreview() {
|
||
preview.replaceChildren();
|
||
selectedFiles.forEach(function (entry, index) {
|
||
var item = document.createElement('div');
|
||
item.className = 'preview-item';
|
||
var image = document.createElement('img');
|
||
image.className = 'fit-cover';
|
||
image.src = entry.url;
|
||
image.alt = entry.file.name;
|
||
var remove = document.createElement('button');
|
||
remove.type = 'button';
|
||
remove.className = 'uc-auth-preview-remove';
|
||
remove.dataset.authRemove = String(index);
|
||
remove.setAttribute('aria-label', '移除 ' + entry.file.name);
|
||
remove.textContent = '×';
|
||
item.appendChild(image);
|
||
item.appendChild(remove);
|
||
preview.appendChild(item);
|
||
});
|
||
|
||
if (selectedFiles.length < 3) {
|
||
var add = document.createElement('button');
|
||
add.type = 'button';
|
||
add.className = 'add';
|
||
add.dataset.authFilePicker = '';
|
||
add.setAttribute('aria-label', '选择证明材料图片');
|
||
preview.appendChild(add);
|
||
}
|
||
}
|
||
|
||
function releasePreviewUrls() {
|
||
selectedFiles.forEach(function (entry) { window.URL.revokeObjectURL(entry.url); });
|
||
selectedFiles = [];
|
||
}
|
||
|
||
function onModalClose(event) {
|
||
if (!event.detail || event.detail.shell !== shell) return;
|
||
document.removeEventListener('aksrt:modal:close', onModalClose);
|
||
releasePreviewUrls();
|
||
}
|
||
|
||
document.addEventListener('aksrt:modal:close', onModalClose);
|
||
preview.addEventListener('click', function (event) {
|
||
var remove = event.target.closest('[data-auth-remove]');
|
||
if (remove) {
|
||
var index = Number(remove.dataset.authRemove);
|
||
var entry = selectedFiles[index];
|
||
if (entry) window.URL.revokeObjectURL(entry.url);
|
||
selectedFiles.splice(index, 1);
|
||
renderPreview();
|
||
return;
|
||
}
|
||
if (event.target.closest('[data-auth-file-picker]')) input.click();
|
||
});
|
||
input.addEventListener('change', function () {
|
||
var files = Array.prototype.slice.call(input.files || []);
|
||
input.value = '';
|
||
if (!files.length) return;
|
||
|
||
var unsupported = files.some(function (file) { return !/^image\/(gif|jpe?g|png)$/i.test(file.type); });
|
||
if (unsupported) {
|
||
toast('证明材料仅支持 GIF、JPG、PNG 图片', 'danger');
|
||
return;
|
||
}
|
||
if (files.some(function (file) { return file.size > 2 * 1024 * 1024; })) {
|
||
toast('单张证明材料不能超过 2MB', 'danger');
|
||
return;
|
||
}
|
||
|
||
var uniqueFiles = files.filter(function (file, index) {
|
||
var key = [file.name, file.size, file.lastModified].join(':');
|
||
return !selectedFiles.some(function (entry) { return entry.key === key; }) &&
|
||
files.findIndex(function (candidate) {
|
||
return [candidate.name, candidate.size, candidate.lastModified].join(':') === key;
|
||
}) === index;
|
||
});
|
||
if (selectedFiles.length + uniqueFiles.length > 3) {
|
||
toast('证明材料最多上传 3 张', 'danger');
|
||
return;
|
||
}
|
||
|
||
uniqueFiles.forEach(function (file) {
|
||
selectedFiles.push({
|
||
file: file,
|
||
key: [file.name, file.size, file.lastModified].join(':'),
|
||
url: window.URL.createObjectURL(file),
|
||
});
|
||
});
|
||
renderPreview();
|
||
});
|
||
|
||
var header = shell.querySelector('.uc-auth-modal__header');
|
||
if (header) {
|
||
var touchStartY = null;
|
||
header.addEventListener('touchstart', function (event) {
|
||
touchStartY = event.touches.length ? event.touches[0].clientY : null;
|
||
}, { passive: true });
|
||
header.addEventListener('touchend', function (event) {
|
||
var touchEndY = event.changedTouches.length ? event.changedTouches[0].clientY : null;
|
||
if (touchStartY !== null && touchEndY !== null && touchEndY - touchStartY > 60 &&
|
||
runtime.getActive && runtime.getActive() === shell) {
|
||
runtime.close('swipe');
|
||
}
|
||
touchStartY = null;
|
||
}, { passive: true });
|
||
}
|
||
|
||
form.addEventListener('submit', function (event) {
|
||
event.preventDefault();
|
||
var invalidField = form.querySelector(':invalid');
|
||
if (!form.checkValidity()) {
|
||
toast((invalidField && invalidField.validationMessage) || '请检查申请信息是否填写完整', 'danger');
|
||
if (invalidField && typeof invalidField.focus === 'function') invalidField.focus();
|
||
return;
|
||
}
|
||
var button = form.querySelector('[type="submit"]');
|
||
var formData = new FormData(form);
|
||
selectedFiles.forEach(function (entry) {
|
||
formData.append('evidence[]', entry.file, entry.file.name);
|
||
});
|
||
var submitLabel = button ? button.innerHTML : '';
|
||
if (button) {
|
||
button.disabled = true;
|
||
button.innerHTML = '<i class="fa fa-spinner fa-spin mr6" aria-hidden="true"></i>正在提交…';
|
||
}
|
||
toast('正在提交申请…', 'load', '', 'aksrt_identity_submit');
|
||
window.AksrtRequest.request(config.restBase, {
|
||
method: 'POST',
|
||
credentials: 'same-origin',
|
||
headers: { 'X-WP-Nonce': config.nonce || '' },
|
||
body: formData,
|
||
}).then(function (response) {
|
||
var result = parseResponse(response);
|
||
if (!result || result.success === false) throw new Error((result && result.message) || '申请提交失败，请稍后重试');
|
||
toast('申请已提交，请耐心等待管理员审核。', 'success', '', 'aksrt_identity_submit');
|
||
var summary = root.querySelector('[data-auth-summary]');
|
||
if (summary) {
|
||
summary.replaceChildren();
|
||
var pending = document.createElement('div');
|
||
pending.className = 'c-red mb10';
|
||
pending.textContent = '您的申请正在审核中，请耐心等待';
|
||
var name = document.createElement('div');
|
||
name.textContent = result.name || '';
|
||
summary.appendChild(pending);
|
||
summary.appendChild(name);
|
||
if (result.description) {
|
||
var description = document.createElement('div');
|
||
description.className = 'muted-2-color mt10';
|
||
description.textContent = result.description;
|
||
summary.appendChild(description);
|
||
}
|
||
if (result.message) {
|
||
var applicationMessage = document.createElement('div');
|
||
applicationMessage.className = 'muted-2-color mt10';
|
||
applicationMessage.textContent = '申请说明：' + result.message;
|
||
summary.appendChild(applicationMessage);
|
||
}
|
||
(Array.isArray(result.evidence) ? result.evidence : []).forEach(function (item) {
|
||
if (!item || !item.url || !item.thumbnail_url) return;
|
||
var link = document.createElement('a');
|
||
link.href = item.url;
|
||
link.target = '_blank';
|
||
link.rel = 'noopener noreferrer';
|
||
var image = document.createElement('img');
|
||
image.src = item.thumbnail_url;
|
||
image.alt = '身份认证证明材料';
|
||
image.width = 64;
|
||
image.height = 64;
|
||
image.style.objectFit = 'cover';
|
||
image.style.borderRadius = '4px';
|
||
link.appendChild(image);
|
||
summary.appendChild(link);
|
||
});
|
||
}
|
||
if (runtime.getActive && runtime.getActive() === shell) runtime.close('submit');
|
||
}).catch(function (error) {
|
||
toast(errorMessage(error, '申请提交失败，请稍后重试'), 'danger', '', 'aksrt_identity_submit');
|
||
}).finally(function () {
|
||
if (button) {
|
||
button.disabled = false;
|
||
button.innerHTML = submitLabel;
|
||
}
|
||
});
|
||
});
|
||
},
|
||
});
|
||
}
|
||
|
||
root.querySelectorAll('[data-auth-modal-open]').forEach(function (button) {
|
||
button.addEventListener('click', function (event) {
|
||
event.preventDefault();
|
||
open();
|
||
});
|
||
});
|
||
}
|
||
|
||
window.AKSRTUserCenterAuth = { init: init };
|
||
})(window, document);
|