Signed-off-by: 1iyc <5212514+liycone@user.noreply.gitee.com>
main
1iyc 3 weeks ago
parent 110c1668da
commit 03a67e3c87

@ -49,7 +49,20 @@ export default {
default: true default: true
} }
}, },
created() {
this.setDefaultValue();
},
methods: { methods: {
setDefaultValue() {
this.searchFields.forEach(field => {
if (field.type === 'select') {
const defaultOption = field.options.find(option => option.default);
if (defaultOption) {
this.queryParams[field.prop] = defaultOption.value;
}
}
});
},
getComponentType(type) { getComponentType(type) {
switch (type) { switch (type) {
case 'input': case 'input':

@ -4,12 +4,12 @@
<el-col :span="3"> <el-col :span="3">
<el-card style="height: calc(100vh - 125px)"> <el-card style="height: calc(100vh - 125px)">
<div slot="header"> <div slot="header">
<span><el-button type="text" size="small">新建标签页</el-button></span> <span>导航</span>
</div> </div>
<el-menu <el-menu
:default-active="localIndex" :default-active="localIndex"
@select="onSelect" @select="onSelect"
mode="horizontal" mode="vertical"
> >
<el-menu-item v-for="(tab, index) in tabs" <el-menu-item v-for="(tab, index) in tabs"
:key="index" :key="index"
@ -66,7 +66,6 @@
</div> </div>
</template> </template>
<script> <script>
export default { export default {
props: { props: {
@ -129,63 +128,98 @@ export default {
}, },
methods: { methods: {
onSelect(index) { onSelect(index) {
this.localIndex = index; try {
this.queryParams.name = this.tabs[index].name; this.localIndex = index;
this.handleQuery(); this.queryParams.name = this.tabs[index].name;
this.handleQuery();
} catch (error) {
console.error('Error in onSelect:', error);
}
}, },
onClick(tab) { onClick(tab) {
this.localIndex = tab.name; try {
this.queryParams.name = this.tabs[tab.name].name; this.localIndex = tab.name;
this.handleQuery(); this.queryParams.name = this.tabs[tab.name].name;
this.handleQuery();
} catch (error) {
console.error('Error in onClick:', error);
}
}, },
handleQuery(queryParams) { handleQuery(queryParams) {
if (queryParams) { try {
this.queryParams = queryParams; if (queryParams) {
this.queryParams = queryParams;
}
this.$emit('query', this.queryParams);
} catch (error) {
console.error('Error in handleQuery:', error);
} }
this.$emit('query', this.queryParams);
}, },
handleReset() { handleReset() {
this.$emit('reset', this.queryParams); try {
this.$emit('reset', this.queryParams);
} catch (error) {
console.error('Error in handleReset:', error);
}
}, },
handleUpdate(row) { handleUpdate(row) {
alert(row.id); try {
alert(row.id);
} catch (error) {
console.error('Error in handleUpdate:', error);
}
}, },
handleSortChange() { handleSortChange() {
try {
//
} catch (error) {
console.error('Error in handleSortChange:', error);
}
}, },
handlePageChange() { handlePageChange() {
try {
//
} catch (error) {
console.error('Error in handlePageChange:', error);
}
}, },
removeTab(targetName) { removeTab(targetName) {
const tabs = this.tabs; try {
let activeName = this.localIndex; const tabs = this.tabs;
let activeName = this.localIndex;
if (activeName === targetName) { if (activeName === targetName) {
tabs.forEach((tab, index) => { tabs.forEach((tab, index) => {
if (tab.name === targetName) { if (tab.name === targetName) {
const nextTab = tabs[index + 1] || tabs[index - 1]; const nextTab = tabs[index + 1] || tabs[index - 1];
if (nextTab) { if (nextTab) {
activeName = nextTab.name; activeName = nextTab.name;
}
} }
} });
}); }
}
this.localIndex = activeName; this.localIndex = activeName;
this.$emit('update:index', activeName); this.$emit('update:index', activeName);
this.$emit('remove', targetName); this.$emit('remove', targetName);
} catch (error) {
console.error('Error in removeTab:', error);
}
}, },
handleOperationClick(operation, row) { handleOperationClick(operation, row) {
this.$emit('operation-click', operation, row); try {
this.$emit('operation-click', operation, row);
} catch (error) {
console.error('Error in handleOperationClick:', error);
}
}, },
}, },
mounted() { mounted() {
console.log('Received props:', this.$props); console.log('Received props:', this.$props);
} }
} }
</script> </script>
<style scoped> <style scoped>
.table-container { .table-container {
height: calc(100vh - 250px); /* 调整高度以适应页面布局 */ height: calc(100vh - 250px); /* 调整高度以适应页面布局 */

@ -37,7 +37,7 @@
<!-- 分页组件 --> <!-- 分页组件 -->
<el-pagination <el-pagination
v-if="pagination && rows.length > 0" v-if="showPagination"
@size-change="handleSizeChange" @size-change="handleSizeChange"
@current-change="handleCurrentChange" @current-change="handleCurrentChange"
:current-page="currentPage" :current-page="currentPage"
@ -87,24 +87,58 @@ export default {
default: false default: false
} }
}, },
computed: {
showPagination() {
return this.pagination && this.rows.length > 0;
}
},
mounted() { mounted() {
this.validateProps();
console.log('Table component received props:', this.$props); console.log('Table component received props:', this.$props);
}, },
methods: { methods: {
validateProps() {
if (!Array.isArray(this.columns) || !this.columns.length) {
console.error('Columns prop must be a non-empty array.');
}
if (!Array.isArray(this.rows)) {
console.error('Rows prop must be an array.');
}
},
handleSortChange({prop, order}) { handleSortChange({prop, order}) {
this.$emit('sort-change', {prop, order}); try {
this.$emit('sort-change', {prop, order});
} catch (error) {
console.error('Error in handleSortChange:', error);
}
}, },
handleSizeChange(newSize) { handleSizeChange(newSize) {
this.$emit('update:page-size', newSize); try {
this.$emit('page-change', {page: this.currentPage, size: newSize}); this.$emit('update:page-size', newSize);
this.$emit('page-change', {page: this.currentPage, size: newSize});
} catch (error) {
console.error('Error in handleSizeChange:', error);
}
}, },
handleCurrentChange(newPage) { handleCurrentChange(newPage) {
this.$emit('update:current-page', newPage); try {
this.$emit('page-change', {page: newPage, size: this.pageSize}); this.$emit('update:current-page', newPage);
this.$emit('page-change', {page: newPage, size: this.pageSize});
} catch (error) {
console.error('Error in handleCurrentChange:', error);
}
}, },
handleOperationClick(operation, row) { handleOperationClick(operation, row) {
this.$emit('operation-click', operation, row); try {
this.$emit('operation-click', operation, row);
} catch (error) {
console.error('Error in handleOperationClick:', error);
}
} }
} }
}; };
</script> </script>
<style scoped>
/* 你可以在这里添加一些样式优化 */
</style>

@ -62,7 +62,8 @@ export default {
placeholder: '请选择', placeholder: '请选择',
gutter: 2, gutter: 2,
options: [ options: [
{label: '是', value: '1'}, {label: '全部', value: ' '},
{label: '是', value: '1', default: true},
{label: '否', value: '0'}, {label: '否', value: '0'},
], ],
}, },
@ -133,7 +134,6 @@ export default {
// //
handleQuery() { handleQuery() {
this.getRows(); this.getRows();
}, },
// //
handleReset() { handleReset() {
@ -167,19 +167,22 @@ export default {
}, },
// //
handleOperationClick(operation, row) { handleOperationClick(operation, row) {
// try {
switch (operation) { switch (operation) {
case 'edit': case 'edit':
this.handleEdit(row); this.handleEdit(row);
break; break;
case 'delete': case 'delete':
this.handleDelete(row); this.handleDelete(row);
break; break;
case 'sync': case 'sync':
this.handleSync(row); this.handleSync(row);
break; break;
default: default:
console.log('未知操作'); console.log('未知操作');
}
} catch (error) {
console.error('操作处理失败:', error);
} }
}, },
// //
@ -192,11 +195,15 @@ export default {
console.log('删除行:', row); console.log('删除行:', row);
// //
}, },
// //
handleSync(row) { handleSync(row) {
console.log('同步操作:', row); console.log('同步操作:', row);
// //
}, },
} }
}; };
</script> </script>
<style scoped>
/* 可以在这里添加样式 */
</style>

Loading…
Cancel
Save