diff --git a/index.html b/index.html index 1193eef..770aa19 100644 --- a/index.html +++ b/index.html @@ -2,6 +2,10 @@ + + + + , - default: () => ({}) + default: () => ({}), }, tableConfig: { type: Object as PropType, - default: () => ({}) - } + default: () => ({}), + }, }); const table = ref(props.tableConfig); @@ -78,13 +85,13 @@ const dialog = ref({ data: [], custom: {}, component: null, //自定义弹窗的路径 - visible: false // 弹出层是否显示 + visible: false, // 弹出层是否显示 }, edit: { id: -1, title: "", // 弹出层title - visible: false // 弹出层是否显示 - } + visible: false, // 弹出层是否显示 + }, }); const appB = ref(null); @@ -112,8 +119,7 @@ function intdata() { if (element.add === undefined) element.add = false; if (element.edit === undefined) element.edit = false; // Vue 3 中直接赋值即可，不需要 $set - if (element.valueE === undefined) - element.valueE = element.multiple ? [] : ""; + if (element.valueE === undefined) element.valueE = element.multiple ? [] : ""; if (element.value === undefined) element.value = element.multiple ? [] : ""; if (!element.type) element.type = "string"; if (element.show === undefined) element.show = true; @@ -137,21 +143,21 @@ function rowKeyFun(row) { return row.customId; } function execute(obj, scope, btn) { - if (Object.prototype.toString.call(obj) === "[object Function]") - return obj(scope, btn); + if (Object.prototype.toString.call(obj) === "[object Function]") return obj(scope, btn); return eval(obj); } function getOperationColumnWidth() { - let hFontSize = getComputedStyle(window.document.documentElement)[ - "font-size" - ].replace("px", ""); + let hFontSize = getComputedStyle(window.document.documentElement)["font-size"].replace( + "px", + "" + ); let defWidth = 10 + 2 + 30; let width = eval( table.value.operationColumnData - .filter(s => !s.topBtn && s.show) - .map(s => defWidth + s.label.length * (hFontSize || 16)) + .filter((s) => !s.topBtn && s.show) + .map((s) => defWidth + s.label.length * (hFontSize || 16)) .join("+") ); width = width < 100 ? 100 : width; @@ -190,13 +196,18 @@ function handleEdit(obj, row) { dialog.value.visible = true; dialog.value.width = "500px"; } -function handleCustom(obj, row, custom) { +async function handleCustom(obj, row, custom: ButtonCustomConfig) { dialog.value.custom.data = row || []; dialog.value.custom.custom = custom || []; // 异步加载组件 - dialog.value.custom.component = defineAsyncComponent({ - loader: () => import(/* @vite-ignore */ `../../views/${custom.src}.vue`) - }); + // dialog.value.custom.component = defineAsyncComponent({ + // loader: () => import(/* @vite-ignore */ `../../views/${custom.src}.vue`), + // }); + let r = shallowRef(null); + const module: any = await modules[`/src/views/${custom.src}.vue`](); //import(`@/views/${custom.src}.vue`); + r.value = module.default; + dialog.value.custom.component = r; + dialog.value.width = custom.width; dialog.value.title = custom.title; dialog.value.edit.visible = false; @@ -215,11 +226,11 @@ function handleDelete(obj, row) { return; } const ids: any[] = []; - row.forEach(it => { + row.forEach((it) => { ids.push(it.id); }); ElMessageBox.confirm("此操作将永久删除勾选记录, 是否继续?").then(() => { - Api.delete(ids).then(res => { + Api.delete(ids).then((res) => { if (res.code === 200) { handleReloadPaged(); ElMessage.success("删除成功"); @@ -256,10 +267,7 @@ function handleSelectionChange(selection) { } // 查询 function handleReloadPaged(reload = true) { - if ( - table.value.search === undefined || - table.value.search.PageIndex === undefined - ) { + if (table.value.search === undefined || table.value.search.PageIndex === undefined) { table.value.search.PageIndex = 0; table.value.search.PageSize = 20; } @@ -321,17 +329,17 @@ async function fetchInitData() { element.type === undefined) ) { if (element.type === "string" || element.type === undefined) - element.custom = row => row[key]; + element.custom = (row) => row[key]; else { - element.custom = row => { + element.custom = (row) => { let sc = element.setting.datasource.find( - s => s[element.setting.mapValue] + "" == row[key] + "" + (s) => s[element.setting.mapValue] + "" == row[key] + "" ); return !sc ? row[key] : sc[element.setting.maplabel]; }; } } else if (element.custom == undefined) { - element.custom = row => row[key]; + element.custom = (row) => row[key]; } } setTimeout(() => { @@ -343,9 +351,7 @@ function showTips(item, value) { if (item.width == undefined) { return false; } - return ( - getByteLen(item.custom(value) + "") * 16 < item.width.replace("px", "") - ); + return getByteLen(item.custom(value) + "") * 16 < item.width.replace("px", ""); } function getByteLen(str) { let len = 0; @@ -358,11 +364,11 @@ function getByteLen(str) { function fetchPagedData() { for (const iterator of table.value.search.defaultConditions) { if (!iterator) continue; - if (!table.value.search.Conditions.find(s => s == iterator)) { + if (!table.value.search.Conditions.find((s) => s == iterator)) { table.value.search.Conditions.push(iterator); } } - Api.PageList(table.value.search).then(res => { + Api.PageList(table.value.search).then((res) => { if (res.code === 200) { table.value.data = res.data.data.map((s, i) => { return { ...s, customId: i }; @@ -378,11 +384,7 @@ function fetchPagedData() {
- + - 查询 @@ -471,7 +470,7 @@ function fetchPagedData() { { tableData.search.OrderByType = 1; c(); - } + }, }, { // 操作按钮 @@ -53,7 +58,7 @@ const tableData: TableConfig = { click: (o, r, c) => { tableData.search.OrderByType = 0; c(); - } + }, }, { topBtn: false, // 头部按钮 @@ -64,9 +69,9 @@ const tableData: TableConfig = { title: "考试学生班级详情", // 弹出框title src: "exam/userExam", // 组件路径 width: "1600px", // 弹框宽度 - height: "800px" // 弹框高度 - } - } + height: "800px", // 弹框高度 + }, + }, ], column: { // 行数据 @@ -74,78 +79,78 @@ const tableData: TableConfig = { label: "姓名", search: true, searchType: ConditionalType.Like, // 搜索类型 - width: "180px" + width: "180px", }, 语文: { label: "语文", search: false, width: "100px", - custom: row => row.subjectDic.语文 + custom: (row) => row.subjectDic.语文, }, 数学: { label: "数学", search: false, width: "100px", - custom: row => row.subjectDic.数学 + custom: (row) => row.subjectDic.数学, }, 英语: { label: "英语", search: false, width: "100px", - custom: row => row.subjectDic.英语 + custom: (row) => row.subjectDic.英语, }, 物理: { label: "物理", search: false, width: "100px", - custom: row => row.subjectDic.物理 + custom: (row) => row.subjectDic.物理, }, 化学: { label: "化学", search: false, width: "100px", - custom: row => row.subjectDic.化学 + custom: (row) => row.subjectDic.化学, }, 生物: { label: "生物", search: false, width: "100px", - custom: row => row.subjectDic.生物 + custom: (row) => row.subjectDic.生物, }, 政治: { label: "政治", search: false, width: "100px", - custom: row => row.subjectDic.政治 + custom: (row) => row.subjectDic.政治, }, 历史: { label: "历史", search: false, width: "100px", - custom: row => row.subjectDic.历史 + custom: (row) => row.subjectDic.历史, }, 地理: { label: "地理", search: false, width: "100px", - custom: row => row.subjectDic.地理 ?? "--" + custom: (row) => row.subjectDic.地理 ?? "--", }, assignScore: { label: "赋分总分", search: false, - width: "180px" + width: "180px", }, assignRanking: { label: "赋分后的排名", search: false, - width: "200px" - } + width: "200px", + }, }, data: [], pageData: { - total: 0 + total: 0, }, - selectRows: [] + selectRows: [], }; const showTable = ref(false); @@ -160,10 +165,10 @@ const exam = props.data[0];