TRKJ/mayfly-go
2
0
Fork 0
mirror of https://gitee.com/dromara/mayfly-go synced 2025-11-02 15:30:25 +08:00
Code Issues Packages Projects Releases Wiki Activity

refactor: 数据库操作界面小优化

Browse Source
This commit is contained in:
meilin.huang
2023-11-22 12:19:07 +08:00
parent d102cc8c08
commit bb37ed3b95
7 changed files with 88 additions and 60 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
mayfly_go_web/src/common/config.ts
View File

@@ -15,7 +15,7 @@ const config = {
baseWsUrl: `${(window as any).globalConfig.BaseWsUrl || `${location.protocol == 'https:' ? 'wss:' : 'ws:'}//${getBaseApiUrl()}`}/api`,
// 系统版本
version: 'v1.5.3',
version: 'v1.5.4',
};
export default config;

1
mayfly_go_web/src/layout/navBars/tagsView/tagsView.vue
View File

@@ -566,4 +566,3 @@ onBeforeRouteUpdate((to) => {
box-shadow: rgb(0 21 41 / 4%) 0px 1px 4px;
}
</style>
@/components/contextmenu

7
mayfly_go_web/src/views/ops/db/DbList.vue
View File

@@ -85,7 +85,7 @@
</template>
</page-table>
<el-dialog width="620" :title="`${db} 数据库导出`" v-model="exportDialog.visible">
<el-dialog width="720px" :title="`${db} 数据库导出`" v-model="exportDialog.visible">
<el-row justify="space-between">
<el-col :span="9">
<el-form-item label="导出内容: ">
@@ -413,6 +413,11 @@ const dumpDbs = () => {
};
</script>
<style lang="scss">
.db-list {
.el-transfer-panel {
width: 250px;
}
}
.el-dropdown-link-more {
cursor: pointer;
color: var(--el-color-primary);

2
mayfly_go_web/src/views/ops/db/component/table/DbTableData.vue
View File

@@ -719,7 +719,7 @@ defineExpose({
}
.data-selection {
background-color: var(--el-color-success-light-8);
background-color: var(--el-table-current-row-bg-color);
}
.data-spacing {

127
mayfly_go_web/src/views/ops/db/component/table/DbTableDataOp.vue
View File

@@ -2,61 +2,65 @@
<div>
<el-row>
<el-col :span="8">
<el-link @click="onRefresh()" icon="refresh" :underline="false" class="ml5"> </el-link>
<el-divider direction="vertical" border-style="dashed" />
<div class="mt5">
<el-link @click="onRefresh()" icon="refresh" :underline="false" class="ml5"> </el-link>
<el-divider direction="vertical" border-style="dashed" />
<el-popover
popper-style="max-height: 550px; overflow: auto; max-width: 450px"
placement="bottom"
width="auto"
title="表格字段配置"
trigger="click"
>
<div v-for="(item, index) in columns" :key="index">
<el-checkbox
v-model="item.show"
:label="`${!item.columnComment ? item.columnName : item.columnName + ' [' + item.columnComment + ']'}`"
:true-label="true"
:false-label="false"
size="small"
/>
</div>
<template #reference>
<el-link icon="Operation" size="small" :underline="false"></el-link>
</template>
</el-popover>
<el-divider direction="vertical" border-style="dashed" />
<el-popover
popper-style="max-height: 550px; overflow: auto; max-width: 450px"
placement="bottom"
width="auto"
title="表格字段配置"
trigger="click"
>
<div v-for="(item, index) in columns" :key="index">
<el-checkbox
v-model="item.show"
:label="`${!item.columnComment ? item.columnName : item.columnName + ' [' + item.columnComment + ']'}`"
:true-label="true"
:false-label="false"
size="small"
/>
</div>
<template #reference>
<el-link icon="Operation" size="small" :underline="false"></el-link>
</template>
</el-popover>
<el-divider direction="vertical" border-style="dashed" />
<el-link @click="onShowAddDataDialog()" type="primary" icon="plus" :underline="false"></el-link>
<el-divider direction="vertical" border-style="dashed" />
<el-link @click="onShowAddDataDialog()" type="primary" icon="plus" :underline="false"></el-link>
<el-divider direction="vertical" border-style="dashed" />
<el-tooltip :show-after="500" class="box-item" effect="dark" content="commit" placement="top">
<el-link @click="onCommit()" type="success" icon="CircleCheck" :underline="false"> </el-link>
</el-tooltip>
<el-divider direction="vertical" border-style="dashed" />
<el-tooltip :show-after="500" class="box-item" effect="dark" content="commit" placement="top">
<el-link @click="onCommit()" type="success" icon="CircleCheck" :underline="false"> </el-link>
</el-tooltip>
<el-divider direction="vertical" border-style="dashed" />
<el-tooltip :show-after="500" class="box-item" effect="dark" content="commit" placement="top">
<template #content>
1. 右击数据/表头可显示操作菜单 <br />
2. 按住Ctrl点击数据则为多选 <br />
3. 双击单元格可编辑数据
</template>
<el-link icon="QuestionFilled" :underline="false"> </el-link>
</el-tooltip>
<el-divider direction="vertical" border-style="dashed" />
<el-tooltip :show-after="500" class="box-item" effect="dark" content="commit" placement="top">
<template #content>
1. 右击数据/表头可显示操作菜单 <br />
2. 按住Ctrl点击数据则为多选 <br />
3. 双击单元格可编辑数据
</template>
<el-link icon="QuestionFilled" :underline="false"> </el-link>
</el-tooltip>
<el-divider direction="vertical" border-style="dashed" />
<el-tooltip :show-after="500" v-if="hasUpdatedFileds" class="box-item" effect="dark" content="提交修改" placement="top">
<el-link @click="submitUpdateFields()" type="success" :underline="false" class="f12">提交</el-link>
</el-tooltip>
<el-divider v-if="hasUpdatedFileds" direction="vertical" border-style="dashed" />
<el-tooltip :show-after="500" v-if="hasUpdatedFileds" class="box-item" effect="dark" content="取消修改" placement="top">
<el-link @click="cancelUpdateFields" type="warning" :underline="false" class="f12">取消</el-link>
</el-tooltip>
<el-tooltip :show-after="500" v-if="hasUpdatedFileds" class="box-item" effect="dark" content="提交修改" placement="top">
<el-link @click="submitUpdateFields()" type="success" :underline="false" class="f12">提交</el-link>
</el-tooltip>
<el-divider v-if="hasUpdatedFileds" direction="vertical" border-style="dashed" />
<el-tooltip :show-after="500" v-if="hasUpdatedFileds" class="box-item" effect="dark" content="取消修改" placement="top">
<el-link @click="cancelUpdateFields" type="warning" :underline="false" class="f12">取消</el-link>
</el-tooltip>
</div>
</el-col>
<el-col :span="16">
<el-input
ref="condInputRef"
@keyup.enter.native="onSelectByCondition()"
v-model="condition"
placeholder="若需条件过滤，可选择列并点击对应的字段并输入需要过滤的内容点击查询按钮即可"
placeholder="若需条件过滤，可选择列并点击对应的字段并输入需要过滤的内容后回车或点击查询按钮即可"
clearable
@clear="selectData"
size="small"
@@ -146,7 +150,12 @@
</el-select>
</el-col>
<el-col :span="19">
<el-input ref="conditionInputRef" v-model="conditionDialog.value" :placeholder="conditionDialog.placeholder" />
<el-input
@keyup.enter.native="onConfirmCondition"
ref="oneCondInputRef"
v-model="conditionDialog.value"
:placeholder="conditionDialog.placeholder"
/>
</el-col>
</el-row>
<template #footer>
@@ -195,9 +204,6 @@ import { ElMessage } from 'element-plus';
import { DbInst } from '@/views/ops/db/db';
import DbTableData from './DbTableData.vue';
const dataForm: any = ref(null);
const conditionInputRef: any = ref();
const props = defineProps({
dbId: {
type: Number,
@@ -217,8 +223,13 @@ const props = defineProps({
},
});
const dataForm: any = ref(null);
const dbTableRef = ref(null) as Ref;
const columnNameSearchInputRef = ref(null) as Ref;
const oneCondInputRef: any = ref();
const condInputRef = ref(null) as Ref;
const defaultPageSize = DbInst.DefaultLimit;
const state = reactive({
datas: [],
@@ -228,8 +239,16 @@ const state = reactive({
loading: false, // 是否在加载数据
columns: [] as any,
pageNum: 1,
pageSize: DbInst.DefaultLimit,
pageSizes: [25, 50, 100, 200, 500, 1000],
pageSize: defaultPageSize,
pageSizes: [
defaultPageSize,
defaultPageSize * 2,
defaultPageSize * 4,
defaultPageSize * 8,
defaultPageSize * 20,
defaultPageSize * 40,
defaultPageSize * 80,
],
count: 0,
selectionDatas: [] as any,
condPopVisible: false,
@@ -374,7 +393,7 @@ const onConditionRowClick = (event: any) => {
state.conditionDialog.columnRow = row;
state.conditionDialog.visible = true;
setTimeout(() => {
conditionInputRef.value.focus();
oneCondInputRef.value.focus();
}, 100);
};
@@ -389,6 +408,7 @@ const onConfirmCondition = () => {
condition += `${row.columnName} ${conditionDialog.condition} `;
state.condition = condition + DbInst.wrapColumnValue(row.columnType, conditionDialog.value);
onCancelCondition();
condInputRef.value.focus();
};
const onCancelCondition = () => {
@@ -412,6 +432,7 @@ const onSelectByCondition = async () => {
notEmpty(state.condition, '条件不能为空');
state.pageNum = 1;
await selectData();
condInputRef.value.blur();
};
/**

7
mayfly_go_web/src/views/ops/db/component/table/DbTableOp.vue
View File

@@ -565,8 +565,11 @@ const indexChanges = (row: any) => {
return;
}
let prefix = row.unique ? 'udx_' : 'idx_';
row.indexName = prefix + name;
let suffix = row.unique ? 'udx' : 'idx';
let commentSuffix = row.unique ? '唯一索引' : '普通索引';
// 以表名为前缀
row.indexName = `${tableData.value.tableName}-${name}-${suffix}`;
row.indexComment = `${tableData.value.tableName}表(${name.replaceAll('_', ',')})${commentSuffix}`;
};
const oldData = { indexs: [] as any[], fields: [] as any[] };

2
server/pkg/config/app.go
View File

@@ -4,7 +4,7 @@ import "fmt"
const (
AppName = "mayfly-go"
Version = "v1.5.3"
Version = "v1.5.4"
)
func GetAppInfo() string {