*/
class StaffMapListEditor {
static _editorCls = 'staffMapList_editor';
constructor(subType) {
this.staffMapList = new StaffMapList(subType);
this.root = createElement('div', { class: StaffMapListEditor._editorCls });
this.textArea = null; // 输入文本框
this.resetBtn = null; // 提交按钮
this.submitBtn = null; // 重置按钮
this.editorMsgBox = null; // 简易提示框
this.isDefault = null; // 标记是否为默认数据
this.built = false; // 标记是否已经初始化
}
async build() {
if (this.built) return; // 防止重复构建
// 构建元素结构
this.textArea = createElement('textarea', {
class: 'quick markItUpEditor hasEditor codeHighlight', name: 'staff_map_list'
});
this.submitBtn = createElement('input', {
class: 'inputBtn', type: 'submit', name: 'submit_context', value: '保存'
});
this.resetBtn = createElement('input', {
class: 'inputBtn', type: 'submit', name: 'reset_context', value: '恢复默认'
});
this.editorMsgBox = createElement('p', { class: 'tip_j'});
this.root.append(
createElement('div', { class: 'markItUp' }, this.textArea),
createElement('div', null, [this.submitBtn, this.resetBtn, this.editorMsgBox])
);
// 初始化状态
const text = this.staffMapList.formatToText(false);
this.textArea.value = text;
this.isDefault = this.staffMapList.isDefault;
if (this.isDefault) setMessage(this.editorMsgBox, '现为默认设置', 0); // 初始化时，提醒用户已为默认设置
else if (text.trim() === "") setMessage(this.editorMsgBox, '现为设置空缺', 0); // 网页实行原有的职位顺序与折叠
else setMessage(this.editorMsgBox, '现为自定义设置', 0);
// 绑定事件
this.textArea.addEventListener('input', this._onInput.bind(this));
this.resetBtn.addEventListener('click', this._onReset.bind(this));
this.submitBtn.addEventListener('click', this._onSubmit.bind(this));
this.built = true;
}
_onInput() {
if (this.isDefault) this.isDefault = false;
// console.debug("IS INPUTTING");
}
async _onReset() {
if (this.isDefault) return setMessage(this.editorMsgBox, '已为默认内容');
await trySetText(
this.textArea, this.editorMsgBox, this.staffMapList.formatToText(true),
'已恢复默认内容', false
);
// 需进行同步等待，由于 setText 可能会触发 input 事件
this.isDefault = true;
}
_onSubmit() {
// 判断是否为重置后未对默认内容进行修改
if (this.isDefault) {
this.staffMapList.resetData();
setMessage(this.editorMsgBox, '保存成功！恢复默认设置');
return;
}
const [modifiedData, isModified, curCursorPos] = StaffMapListEditor.modifyText(this.textArea);
// 强制将用户输入的文本外层嵌套 `[]`，若为重复嵌套可在 loadMapList 中识别并去除
const savedDate = `[${modifiedData}]`;
const parsedData = StaffMapListJSON.parse(savedDate);
// 数据解析失败
if (!parsedData) return setMessage(this.editorMsgBox, '保存失败！格式存在错误');
// 保存数据
this.staffMapList.saveData(savedDate);
// 页面显示
if (modifiedData.trim() === "") setMessage(this.editorMsgBox, '保存成功！空缺设置');
else if (isModified) trySetText(
this.textArea, this.editorMsgBox, modifiedData,
'保存成功！并自动纠错', true, curCursorPos
);
else setMessage(this.editorMsgBox, '保存成功！');
}
/**
* 对用户输入可能的常见语法与格式错误，进行自动纠错，以满足`JSON`格式
* 并计算文本修改后，光标的适宜位置
* 已基本兼容`JavaScript`格式的文本数据，实现格式转化
* `group2`与`group4`致使正则表达式中不允许出现`/'"`三种字符
*/
static modifyText(textArea) {
const preCursorPos = getTextAreaPos(textArea).cursorPos;
let curCursorPos = preCursorPos;
let flags = new Array(5).fill(false);
const rslt = textArea.value.replace(
/(,\s*)+(?=]|$)|(?<=\[|^)(\s*,)+|(,\s*)+(?=,)|(')|(? {
isTriggered(0, '删除序列末尾元素后的 `,` 逗号', g1);
isTriggered(1, '删除序列首位元素前的 `,` 逗号', g2);
isTriggered(2, '删除连续重复的 `,` 逗号', g3);
isTriggered(3, '将单引号替换为双引号', g4);
isTriggered(4, '将正则表达式以双引号包裹', g5);
if (booleanOr(g1, g2, g3)) {
let diff = preCursorPos - offset;
if (diff > 0) curCursorPos -= Math.min(diff, match.length);
return '';
}
if (g4) return '"';
if (g5) {
if (offset < preCursorPos && preCursorPos < offset + match.length) curCursorPos += 1;
else if (preCursorPos >= offset + match.length) curCursorPos += 2;
return `"${match}"`;
}
return match;
});
return [rslt, booleanOr(...flags), curCursorPos];
function isTriggered(index, msg, ...groups) {
if (!flags[index] && booleanOr(...groups)) {
console.log(`${SCRIPT_NAME}：触发自动纠错 - ${msg}`);
flags[index] = true;
}
}
function booleanOr(...values) {
return values.reduce((acc, val) => acc || val, false);
}
}
}
/**
* 整数步进输入器，
* 不使用`input.type: 'number'`而是自我搭建相关控制