epic-designer-gold
Version:
基于vue3的设计器,可视化开发页面表单
582 lines (581 loc) • 18 kB
JavaScript
import { ref as h } from "vue";
const C = {
component: "Component",
outline: "Outline",
style: "Style",
attribute: "Attribute",
searchComponent: "Search Component",
noComponentFound: "No Component Found",
all: "All",
form: "Form",
labelPosition: "Label Position",
left: "Left",
right: "Right",
top: "Top",
labelWidth: "Label Width",
labelSuffix: "Label Suffix",
pleaseEnter: "Please Enter",
formSize: "Form Size",
pleaseSelect: "Please Select",
large: "Large",
medium: "Medium",
small: "Small",
asteriskPosition: "Asterisk Position",
inlineValidationMessage: "Inline Validation Message",
validationFeedbackIcon: "Validation Feedback Icon",
scrollToValidationError: "Scroll to Validation Error",
inlineMode: "Inline Mode",
getFormData: "Get Form Data",
setFormData: "Set Form Data",
validateForm: "Validate Form",
layout: "Layout",
fieldName: "Field Name",
title: "Title",
defaultValue: "Default Value",
placeholder: "Placeholder",
size: "Size",
maxInputLength: "Max Input Length",
countWords: "Count Words",
inputType: "Input Type",
showToggleIcon: "Show Toggle Icon",
clearable: "Clearable",
formValidation: "Form Validation",
validationRuleRequiresForm: "Validation Rule Requires Form",
onInput: "On Input",
onChange: "On Change",
onFocus: "On Focus",
onBlur: "On Blur",
onClear: "On Clear",
focusInput: "Focus Input",
blurInput: "Blur Input",
clearInput: "Clear Input",
selectInputText: "Select Input Text",
input: "Input",
cardLayout: "Card Layout",
shadowTiming: "Shadow Timing",
textarea: "Textarea",
minRows: "Min Rows",
maxRows: "Max Rows",
inputValue: "Input Value",
valueChange: "Value Change",
focus: "Focus",
blur: "Blur",
signaturePad: "Signature Pad",
lineWidth: "Line Width",
rewriteWillClearCanvas: "Rewrite will clear the canvas. Are you sure you want to rewrite?",
clearSuccess: "Clear Success",
uploadSuccess: "Upload Success",
uploadFailed: "Upload Failed",
confirmAbandonSignature: "Are you sure you want to abandon this signature?",
warning: "Warning",
cancel: "Cancel",
rewrite: "Rewrite",
confirm: "Confirm",
numberInput: "Number Input",
maxValue: "Max Value",
minValue: "Min Value",
step: "Step",
controlButtonPosition: "Control Button Position",
precision: "Precision",
inputControlIsMultipleOfStep: "Input Control Is Multiple of Step",
onValueChange: "On Value Change",
gridLayout: "Grid Layout",
verticalAlignment: "Vertical Alignment",
horizontalArrangement: "Horizontal Arrangement",
gridSpacing: "Grid Spacing",
gridWidth: "Grid Width (24 per row)",
radio: "Radio",
option1: "Option 1",
option2: "Option 2",
buttonMode: "Button Mode",
optionTextColor: "Option Text Color",
effectiveInButtonMode: "Effective in Button Mode",
optionButtonColor: "Option Button Color",
optionManagement: "Option Management",
s: "DataSource",
dataSourceConfig: "DataSource Configuration",
checkbox: "Checkbox",
maxSelected: "Max Selected",
minSelected: "Min Selected",
select: "Select",
multiple: "Multiple",
hideMultiple: "Hide Multiple",
hideHint: "Hide Hint",
retainSearchKeyword: "Retain Search Keyword",
tagType: "Tag Type",
multipleLimit: "Multiple Limit",
hintTheme: "Hint Theme",
filterable: "Filterable",
allowCreate: "Allow Create",
dropdownPosition: "Dropdown Position",
dropdownWidthSameAsInput: "Dropdown Width Same as Input",
noDataText: "No Data Text",
configureOptions: "Configure Options",
cascader: "Cascader",
separator: "Separator",
subMenuExpandMode: "Sub Menu Expand Mode",
searchable: "Searchable",
collapseTags: "Collapse Tags",
showCollapsedTags: "Show Collapsed Tags",
hidePath: "Hide Path",
parentSelectable: "Parent Selectable",
parentChildNotLinked: "Parent and Child Nodes Not Linked",
onlyGetSelectedNodes: "Only Get Selected Nodes",
onSelectedNodeChange: "On Selected Node Change",
onBlurs: "On Blur",
onFocu: "On Focus",
getCurrentSelectedNodes: "Get Current Selected Nodes",
togglePopperVisibility: "Toggle Popper Visibility",
datePicker: "Date Picker",
dateType: "Date Type",
date: "Date",
week: "Week",
month: "Month",
year: "Year",
time: "Time",
timeRange: "Time Range",
dateRange: "Date Range",
monthRange: "Month Range",
multipleDates: "Multiple Dates",
startPlaceholder: "Start Placeholder",
endPlaceholder: "End Placeholder",
editable: "Editable",
displayFormat: "Display Format",
dataFormat: "Data Format",
fileUpload: "File Upload",
requestUrl: "Request URL",
uploadFileField: "Upload File Field",
multiples: "Multiple",
showFileList: "Show File List",
dragUpload: "Drag Upload",
maxUploadCount: "Max Upload Count",
imageUpload: "Image Upload",
switch: "Switch",
onValue: "ON Value",
offValue: "OFF Value",
onDescription: "ON Description",
offDescription: "OFF Description",
width: "Width",
textInside: "Text Inside",
onChangeSwitch: "On Change",
slider: "Slider",
showStops: "Show Stops",
tooltip: "Tooltip",
range: "Range",
vertical: "Vertical",
height: "Height",
showInput: "Show Input",
controlButtons: "Control Buttons",
tooltipPosition: "Tooltip Position",
realTimeTrigger: "Real-time Trigger",
onChangeEnd: "On Change End",
colorPicker: "Color Picker",
format: "Format",
alpha: "Alpha",
staticText: "Static Text",
leftAlign: "Left Align",
centerAlign: "Center Align",
rightAlign: "Right Align",
fontSize: "Font Size",
button: "Button",
type: "Type",
actionType: "Action Type",
customColor: "Custom Color",
plainButton: "Plain Button",
roundButton: "Round Button",
circleButton: "Circle Button",
textButton: "Text Button",
loadingState: "Loading State",
onClick: "On Click",
onDoubleClick: "On Double Click",
componentId: "Component ID",
canvasWidth: "Canvas Width",
canvasHeight: "Canvas Height",
editComponentProperties: "Edit Component Properties",
page: "Page",
pageName: "Page Name",
padding: "Padding",
margin: "Margin",
backgroundColor: "Background Color",
fontColor: "Font Color",
addOption: "Add Option",
dataSources: "Data Source",
pleaseSelectDataSource: "Please Select Data Source",
pleaseCheckDataSourceConfig: "Please Check Data Source Configuration",
dynamic: "Dynamic",
static: "Static",
noOptions: "No Options",
configuration: "Configuration",
addDataSource: "Add Data Source",
apiName: "API Name",
pleaseEnterApiName: "Please Enter API Name",
pleaseEnterRequestUrl: "Please Enter Request URL",
requestMethod: "Request Method",
labelKey: "Label Key",
pleaseEnterLabelKey: "Please Enter Label Key",
valueKey: "Value Key",
pleaseEnterValueKey: "Please Enter Value Key",
dataPath: "Data Path",
nestedPath: "Use '.' for Nested Path",
requestParams: "Request Parameters",
add: "Add",
paramName: "Parameter Name",
paramValue: "Parameter Value",
requestHeaders: "Request Headers",
requestBody: "Request Body",
requestTest: "Request Test",
save: "Save",
configError: "Configuration Error",
requestFailed: "Request Failed",
fillRequiredFields: "Please Fill Required Fields",
completeFormFirst: "Please Complete the Form First",
addRule: "Add Rule",
required: "Required",
validationTrigger: "Validation Trigger",
validationMessage: "Validation Message",
customRule: "Custom Rule",
validationFunction: "Validation Function",
regexValidation: "Regex Validation",
fieldLength: "Field Length",
minLength: "Min Length",
maxLength: "Max Length",
saveForm: "Save Form",
clickToUpload: "Click to Upload",
row: "Row",
column: "Column",
searchNode: "Search Node",
noDataFound: "No Data Found"
}, f = {
component: "组件",
outline: "大纲",
style: "样式",
attribute: "属性",
searchComponent: "搜索组件",
noComponentFound: "没有查询到的组件",
all: "全部",
form: "表单",
labelPosition: "标签位置",
left: "左边",
right: "右边",
top: "顶部",
labelWidth: "标签宽度",
labelSuffix: "标签后缀",
pleaseEnter: "请输入",
formSize: "表单尺寸",
pleaseSelect: "请选择",
large: "大号",
medium: "中等",
small: "小型",
asteriskPosition: "星号位置",
inlineValidationMessage: "行内展示校验信息",
validationFeedbackIcon: "校验反馈图标",
scrollToValidationError: "滚动校验错误处",
inlineMode: "行内模式",
getFormData: "获取表单数据",
setFormData: "设置表单数据",
validateForm: "校验表单",
layout: "布局",
fieldName: "字段名",
title: "标题",
defaultValue: "默认值",
placeholder: "占位内容",
size: "尺寸",
maxInputLength: "最大输入长度",
countWords: "统计字数",
inputType: "输入类型",
showToggleIcon: "显示切换图标",
clearable: "可清空",
formValidation: "表单校验",
validationRuleRequiresForm: "校验规则需要配合表单使用",
onInput: "输入值时",
onChange: "值修改时",
onFocus: "获取焦点时",
onBlur: "失去焦点时",
onClear: "点击清空按钮时",
focusInput: "使 input 获取焦点",
blurInput: "使 input 失去焦点",
clearInput: "清除 input 值",
selectInputText: "选中 input 中的文字",
input: "输入框",
cardLayout: "卡片布局",
shadowTiming: "阴影时机",
textarea: "文本域",
minRows: "最小行数",
maxRows: "最大行数",
inputValue: "输入值",
valueChange: "值修改",
focus: "获取焦点",
blur: "失去焦点",
signaturePad: "签名板",
lineWidth: "线条宽度",
rewriteWillClearCanvas: "重写将清空画布,请确定是否重写?",
clearSuccess: "清空成功",
uploadSuccess: "上传成功",
uploadFailed: "上传失败",
confirmAbandonSignature: "是否放弃本次签字?",
warning: "警告",
cancel: "取消",
rewrite: "重写",
confirm: "确定",
numberInput: "数字输入框",
maxValue: "最大值",
minValue: "最小值",
step: "步长",
controlButtonPosition: "控制按钮位置",
precision: "精度",
inputControlIsMultipleOfStep: "输入控制为步长的倍数",
onValueChange: "值变化时",
gridLayout: "栅格布局",
verticalAlignment: "垂直对齐方式",
horizontalArrangement: "水平排列方式",
gridSpacing: "栅格间距",
gridWidth: "栅格宽度(一行为24)",
radio: "单选框",
option1: "选项1",
option2: "选项2",
buttonMode: "按钮模式",
optionTextColor: "选项文本颜色",
effectiveInButtonMode: "按钮模式下生效",
optionButtonColor: "选项按钮颜色",
optionManagement: "选项管理",
dataSource: "数据源",
dataSourceConfig: "数据源配置",
checkbox: "复选框",
maxSelected: "最大选中数",
minSelected: "最小选中数",
select: "选择框",
multiple: "可多选",
hideMultiple: "多选隐藏",
hideHint: "隐藏提示",
retainSearchKeyword: "保留搜索关键字",
tagType: "标签类型",
multipleLimit: "多选限制",
hintTheme: "提示主题",
filterable: "可筛选",
allowCreate: "允许创建条目",
dropdownPosition: "下拉框位置",
dropdownWidthSameAsInput: "下拉框宽度与输入框相同",
noDataText: "无数据时文本",
configureOptions: "配置选项",
cascader: "级联选择器",
separator: "分割符",
subMenuExpandMode: "次级菜单展开方式",
searchable: "可搜索",
collapseTags: "折叠Tag",
showCollapsedTags: "显示被折叠标签",
hidePath: "不显示路径",
parentSelectable: "父级可选",
parentChildNotLinked: "父子节点不互相关联",
onlyGetSelectedNodes: "只获取选中节点",
onSelectedNodeChange: "选中节点变化时",
onBlurs: "当失去焦点时触发",
onFocu: "当获得焦点时触发",
getCurrentSelectedNodes: "获取当前选中节点",
togglePopperVisibility: "切换 popper 可见状态",
datePicker: "日期选择器",
dateType: "日期类型",
date: "日期",
week: "周",
month: "月份",
year: "年份",
time: "时间",
timeRange: "时间范围",
dateRange: "日期范围",
monthRange: "月份范围",
multipleDates: "多个日期",
startPlaceholder: "开始占位符",
endPlaceholder: "结束占位符",
editable: "可输入",
displayFormat: "显示格式",
dataFormat: "数据格式",
fileUpload: "上传文件",
requestUrl: "请求地址",
uploadFileField: "上传文件字段",
multiples: "多选",
showFileList: "展示文件列表",
dragUpload: "拖拽上传",
maxUploadCount: "允许上传最大数量",
imageUpload: "上传图片",
switch: "开关",
onValue: "ON状态值",
offValue: "OFF状态值",
onDescription: "ON状态描述",
offDescription: "OFF状态描述",
width: "宽度",
textInside: "文本点内显示",
onChangeSwitch: "状态发生变化时",
slider: "滑块",
showStops: "显示间断点",
tooltip: "提示信息",
range: "开启选择范围",
vertical: "垂直模式",
height: "高度",
showInput: "显示数字框",
controlButtons: "控制按钮",
tooltipPosition: "提示框位置",
realTimeTrigger: "拖拽实时触发",
onChangeEnd: "拖拽结束改变值时",
colorPicker: "颜色选择器",
format: "格式",
alpha: "透明度选择",
staticText: "静态文字",
leftAlign: "居左",
centerAlign: "居中",
rightAlign: "居右",
fontSize: "字体大小",
button: "按钮",
type: "类型",
actionType: "操作类型",
customColor: "自定义颜色",
plainButton: "朴素按钮",
roundButton: "圆角按钮",
circleButton: "圆形按钮",
textButton: "文字按钮",
loadingState: "加载状态",
onClick: "点击按钮时",
onDoubleClick: "双击按钮时",
componentId: "组件ID",
canvasWidth: "画布宽度",
canvasHeight: "画布高度",
page: "页面",
editComponentProperties: "编辑组件属性",
pageName: "页面名称",
padding: "内边距",
margin: "外边距",
backgroundColor: "背景色",
fontColor: "字体颜色",
addOption: "添加选项",
dataSources: "数据源",
pleaseSelectDataSource: "请选择数据源",
pleaseCheckDataSourceConfig: "请检查数据位置是否配置准确",
dynamic: "动态",
static: "静态",
noOptions: "暂无选项",
configuration: "配置",
addDataSource: "新增数据源",
apiName: "接口名称",
pleaseEnterApiName: "请输入接口名称",
pleaseEnterRequestUrl: "请输入完整的请求地址",
requestMethod: "请求方法",
labelKey: "标签键名",
pleaseEnterLabelKey: "请输入标签键名",
valueKey: "值键名",
pleaseEnterValueKey: "请输入值键名",
dataPath: "数据位置",
nestedPath: "多层嵌套使用.分隔",
requestParams: "请求参数",
add: "添加",
paramName: "参数名",
paramValue: "参数值",
requestHeaders: "请求头",
requestBody: "请求体",
requestTest: "请求测试",
save: "保存",
configError: "配置错误",
requestFailed: "请求失败",
fillRequiredFields: "请填写必填项",
completeFormFirst: "请先完善表单",
addRule: "添加规则",
required: "必填项",
validationTrigger: "校验时机",
validationMessage: "校验信息",
customRule: "自定义规则",
validationFunction: "校验函数",
regexValidation: "正则校验",
fieldLength: "字段长度",
minLength: "最小长度",
maxLength: "最大长度",
saveForm: "保存表单",
clickToUpload: "点击上传",
row: "行",
column: "列",
searchNode: "搜索节点",
noDataFound: "没有查询到的数据"
};
/*! js-cookie v3.0.5 | MIT */
function u(e) {
for (var a = 1; a < arguments.length; a++) {
var n = arguments[a];
for (var r in n)
e[r] = n[r];
}
return e;
}
var S = {
read: function(e) {
return e[0] === '"' && (e = e.slice(1, -1)), e.replace(/(%[\dA-F]{2})+/gi, decodeURIComponent);
},
write: function(e) {
return encodeURIComponent(e).replace(
/%(2[346BF]|3[AC-F]|40|5[BDE]|60|7[BCD])/g,
decodeURIComponent
);
}
};
function p(e, a) {
function n(o, d, t) {
if (!(typeof document > "u")) {
t = u({}, a, t), typeof t.expires == "number" && (t.expires = new Date(Date.now() + t.expires * 864e5)), t.expires && (t.expires = t.expires.toUTCString()), o = encodeURIComponent(o).replace(/%(2[346B]|5E|60|7C)/g, decodeURIComponent).replace(/[()]/g, escape);
var i = "";
for (var l in t)
t[l] && (i += "; " + l, t[l] !== !0 && (i += "=" + t[l].split(";")[0]));
return document.cookie = o + "=" + e.write(d, o) + i;
}
}
function r(o) {
if (!(typeof document > "u" || arguments.length && !o)) {
for (var d = document.cookie ? document.cookie.split("; ") : [], t = {}, i = 0; i < d.length; i++) {
var l = d[i].split("="), m = l.slice(1).join("=");
try {
var c = decodeURIComponent(l[0]);
if (t[c] = e.read(m, c), o === c)
break;
} catch {
}
}
return o ? t[o] : t;
}
}
return Object.create(
{
set: n,
get: r,
remove: function(o, d) {
n(
o,
"",
u({}, d, {
expires: -1
})
);
},
withAttributes: function(o) {
return p(this.converter, u({}, this.attributes, o));
},
withConverter: function(o) {
return p(u({}, this.converter, o), this.attributes);
}
},
{
attributes: { value: Object.freeze(a) },
converter: { value: Object.freeze(e) }
}
);
}
var s = p(S, { path: "/" });
const g = {
"en-US": C,
"zh-CN": f
}, F = s.get("saas-locale") || "zh-CN", T = () => {
const e = h(F), a = () => {
document.visibilityState === "visible" && e.value !== s.get("saas-locale") && Object.keys(g).includes(s.get("saas-locale")) && (e.value = s.get("saas-locale"));
}, n = (r) => g[e.value][r];
return a(), {
locale: e,
t: n
};
};
export {
s as a,
T as u
};