// Description: example
// 新增配置
export const insertlist = {
url: "/workOrder/insertlist", // 需要调用的接口地址 必传
method: "post", // 请求方式 默认为post 非比传
type: "Modal", // 弹框类型 默认为Modal 非必传
title: "Basic Modal", // 弹框标题 默认为路由meta.title 非必传
btnPosition: "center", // 按钮位置 默认为center 非必传
form: {
// 表单配置
labelWidth: "80px", // 表单label宽度 默认为80px 非必传
labelPosition: "right", // 表单label位置 默认为right 非必传
labelSuffix: ":", // 表单label后缀 默认为: 非必传
size: "mini", // 表单尺寸 默认为mini 非必传
inline: true, // 表单是否行内 默认为false 非必传
gutter: 20, // 表单间距 默认为20 非必传
formItem: [
// 表单项配置
[
{
colSpan: 12, // 表单项占据的列数 默认为24 非必传
type: "input", // 表单项类型 默认为input 非必传
label: "工单编号", // 表单项label 默认为prop 必传
prop: "workOrderNo", // 表单项绑定的字段 必传
placeholder: "请输入工单编号", // 表单项placeholder 默认为请输入+label 非必传
rules: [
// 表单项验证规则 非必传
{
required: true, message: "请输入工单编号", trigger: "blur" },
],
attr: {
}, // 非必传 用于配置el-input的属性
},
],
],
},
btn: [
// 按钮配置
{
type: "primary", // 按钮类型 默认为primary 非必传
size: "mini", // 按钮尺寸 默认为mini 非必传
text: "确定", // 按钮文本 默认为确定 非必传
icon: "el-icon-check", // 按钮图标 默认为null 非必传
round: false, // 按钮是否圆角 默认为false 非必传
circle: false, // 按钮是否圆形 默认为false 非必传
plain: false, // 按钮是否朴素 默认为false 非必传
disabled: false, // 按钮是否禁用 默认为false 非必传
loading: false, // 按钮是否加载中 默认为false 非必传
click: (form) => {
// 按钮点击事件
console.log(form);
},
},
{
type: "info", // 按钮类型 默认为primary 非必传
size: "mini", // 按钮尺寸 默认为mini 非必传
text: "取消", // 按钮文本 默认为确定 非必传
icon: "el-icon-close", // 按钮图标 默认为null 非必传
round: false, // 按钮是否圆角 默认为false 非必传
circle: false, // 按钮是否圆形 默认为false 非必传
plain: false, // 按钮是否朴素 默认为false 非必传
disabled: false, // 按钮是否禁用 默认为false 非必传
loading: false, // 按钮是否加载中 默认为false 非必传
click: (form) => {
// 按钮点击事件
console.log(form);
},
},
],
};
// 删除配置
export const del = {
url: "/workOrder/delete", // 需要调用的接口地址 必传
method: "post", // 请求方式 默认为post 非必传
type: "Delete", // 删除类型 默认为Delete 非必传
title: "删除", // 删除提示标题 默认为删除 非必传
content: "是否删除该条数据", // 删除提示内容 默认为是否删除该条数据 非必传
confirmButtonText: "确定", // 删除确认按钮文本 默认为确定 非必传
cancelButtonText: "取消", // 删除取消按钮文本 默认为取消 非必传
success: (res) => {
}, // 删除成功回调函数 非必传
error: (err) => {
}, // 删除失败回调函数 非必传
};
// table配置
export const table = {
url: "/workOrder/list", // 需要调用的接口地址 必传
method: "post", // 请求方式 默认为post 非必传
type: "Table", // 表格类型 默认为Table 非必传
selecet: "multiple", // 表格选择类型 默认为false 非必传
pagination: true, // 表格是否分页 默认为true 非必传
paginationPosition: "bottom", // 表格分页位置 默认为bottom 非必传
paginationSize: "small", // 表格分页尺寸 默认为small 非必传
paginationLayout: "total, sizes, prev, pager, next, jumper", // 表格分页布局 默认为total, sizes, prev, pager, next, jumper 非必传
paginationTotal: false, // 表格分页是否显示总条数 默认为false 非必传
paginationPageSizes: [10, 20, 30, 40], // 表格分页每页显示条数 默认为[10, 20, 30, 40] 非必传
paginationBackground: true, // 表格分页是否有背景色 默认为true 非必传
paginationAlign: "right", // 表格分页对齐方式 默认为right 非必传
paginationBefore: true, // 表格分页是否显示上一页下一页 默认为true 非必传
paginationAfter: true, // 表格分页是否显示总页数 默认为true 非必传
paginationSimple: false, // 表格分页是否简单模式 默认为false 非必传
paginationPageSize: 10, // 表格分页每页显示条数 默认为10 非必传
paginationCurrentPage: 1, // 表格分页当前页 默认为1 非必传
paginationTotalCount: 0, // 表格分页总条数 默认为0 非必传
paginationPageCount: 0, // 表格分页总页数 默认为0 非必传
paginationPopperClass: "", // 表格分页下拉框样式 默认为空 非必传
paginationPrevText: "上一页", // 表格分页上一页文本 默认为上一页 非必传
paginationNextText: "下一页", // 表格分页下一页文本 默认为下一页 非必传
columes: [
{
label: "工单编号",
prop: "workOrderNo", // 列绑定的字段 必传
width: "100", // 列宽 默认为100 非必传
align: "center", // 列对齐方式 默认为center 非必传
sortable: true, // 是否可排序 默认为false 非必传
fixed: "left", // 列是否固定 默认为false 非必传
formatter: (row, column, cellValue, index) => {
}, // 列格式化函数 非必传
attr: {
}, // 非必传 用于配置el-table-column的属性
},
],
data: [], // 表格数据 默认为空数组 非必传
height: "100%", // 表格高度 默认为100% 非必传
maxHeight: "100%", // 表格最大高度 默认为100% 非必传
stripe: false, // 表格是否斑马纹 默认为false 非必传
border: false, // 表格是否带有纵向边框 默认为false 非必传
fit: true, // 列的宽度是否自撑开 默认为true 非必传
showHeader: true, // 是否显示表头 默认为true 非必传
highlightCurrentRow: false, // 是否要高亮当前行 默认为false 非必传
currentRowKey: "", // 当前行的key 默认为空 非必传
};
封装配置数据格式
おすすめ
転載: blog.csdn.net/m0_51531365/article/details/128257342
おすすめ
ランキング