mirror of
https://github.com/bufanyun/hotgo.git
synced 2025-10-09 03:26:42 +08:00
修改字段页面,增加一些字段属性
This commit is contained in:
parent
cbd887701b
commit
db61f050d4
@ -3,7 +3,6 @@
|
|||||||
// @Copyright Copyright (c) 2023 HotGo CLI
|
// @Copyright Copyright (c) 2023 HotGo CLI
|
||||||
// @Author Ms <133814250@qq.com>
|
// @Author Ms <133814250@qq.com>
|
||||||
// @License https://github.com/bufanyun/hotgo/blob/master/LICENSE
|
// @License https://github.com/bufanyun/hotgo/blob/master/LICENSE
|
||||||
//
|
|
||||||
package consts
|
package consts
|
||||||
|
|
||||||
// 生成代码类型
|
// 生成代码类型
|
||||||
@ -79,3 +78,18 @@ const (
|
|||||||
GenCodesIndexPK = "PRI" // 主键索引
|
GenCodesIndexPK = "PRI" // 主键索引
|
||||||
GenCodesIndexUNI = "UNI" // 唯一索引
|
GenCodesIndexUNI = "UNI" // 唯一索引
|
||||||
)
|
)
|
||||||
|
|
||||||
|
// 表格字段显示位置
|
||||||
|
const (
|
||||||
|
ListShowHide = 1
|
||||||
|
ListShowLeft = 2
|
||||||
|
ListShowCenter = 3
|
||||||
|
ListShowRight = 4
|
||||||
|
)
|
||||||
|
|
||||||
|
var ListShowMap = map[int]string{
|
||||||
|
ListShowHide: "不显示",
|
||||||
|
ListShowLeft: "居左显示",
|
||||||
|
ListShowCenter: "居中显示",
|
||||||
|
ListShowRight: "居右显示",
|
||||||
|
}
|
||||||
|
@ -6,13 +6,16 @@
|
|||||||
package hggen
|
package hggen
|
||||||
|
|
||||||
import (
|
import (
|
||||||
_ "hotgo/internal/library/hggen/internal/cmd/gendao"
|
"context"
|
||||||
|
"sort"
|
||||||
_ "unsafe"
|
_ "unsafe"
|
||||||
|
|
||||||
"context"
|
_ "hotgo/internal/library/hggen/internal/cmd/gendao"
|
||||||
|
|
||||||
"github.com/gogf/gf/v2/errors/gerror"
|
"github.com/gogf/gf/v2/errors/gerror"
|
||||||
"github.com/gogf/gf/v2/frame/g"
|
"github.com/gogf/gf/v2/frame/g"
|
||||||
"github.com/gogf/gf/v2/util/gconv"
|
"github.com/gogf/gf/v2/util/gconv"
|
||||||
|
|
||||||
"hotgo/internal/consts"
|
"hotgo/internal/consts"
|
||||||
"hotgo/internal/library/addons"
|
"hotgo/internal/library/addons"
|
||||||
"hotgo/internal/library/hggen/internal/cmd"
|
"hotgo/internal/library/hggen/internal/cmd"
|
||||||
@ -23,7 +26,6 @@ import (
|
|||||||
"hotgo/internal/model/input/form"
|
"hotgo/internal/model/input/form"
|
||||||
"hotgo/internal/model/input/sysin"
|
"hotgo/internal/model/input/sysin"
|
||||||
"hotgo/internal/service"
|
"hotgo/internal/service"
|
||||||
"sort"
|
|
||||||
)
|
)
|
||||||
|
|
||||||
//go:linkname doGenDaoForArray hotgo/internal/library/hggen/internal/cmd/gendao.doGenDaoForArray
|
//go:linkname doGenDaoForArray hotgo/internal/library/hggen/internal/cmd/gendao.doGenDaoForArray
|
||||||
@ -130,6 +132,15 @@ func TableSelects(ctx context.Context, in *sysin.GenCodesSelectsInp) (res *sysin
|
|||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
for k, v := range consts.ListShowMap {
|
||||||
|
res.ListShow = append(res.ListShow, &form.Select{
|
||||||
|
Value: k,
|
||||||
|
Name: v,
|
||||||
|
Label: v,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
sort.Sort(res.ListShow)
|
||||||
|
|
||||||
res.Addons = addons.ModuleSelect()
|
res.Addons = addons.ModuleSelect()
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
@ -8,14 +8,16 @@ package views
|
|||||||
import (
|
import (
|
||||||
"context"
|
"context"
|
||||||
"fmt"
|
"fmt"
|
||||||
|
"strings"
|
||||||
|
|
||||||
|
"hotgo/internal/library/hggen/internal/cmd/gendao"
|
||||||
|
"hotgo/internal/model/input/sysin"
|
||||||
|
|
||||||
"github.com/gogf/gf/v2/database/gdb"
|
"github.com/gogf/gf/v2/database/gdb"
|
||||||
"github.com/gogf/gf/v2/frame/g"
|
"github.com/gogf/gf/v2/frame/g"
|
||||||
"github.com/gogf/gf/v2/text/gregex"
|
"github.com/gogf/gf/v2/text/gregex"
|
||||||
"github.com/gogf/gf/v2/text/gstr"
|
"github.com/gogf/gf/v2/text/gstr"
|
||||||
"github.com/gogf/gf/v2/util/gconv"
|
"github.com/gogf/gf/v2/util/gconv"
|
||||||
"hotgo/internal/library/hggen/internal/cmd/gendao"
|
|
||||||
"hotgo/internal/model/input/sysin"
|
|
||||||
"strings"
|
|
||||||
)
|
)
|
||||||
|
|
||||||
// DoTableColumns 获取指定表生成字段列表
|
// DoTableColumns 获取指定表生成字段列表
|
||||||
@ -40,6 +42,8 @@ func DoTableColumns(ctx context.Context, in *sysin.GenCodesColumnListInp, config
|
|||||||
} else {
|
} else {
|
||||||
CustomAttributes(ctx, field, config)
|
CustomAttributes(ctx, field, config)
|
||||||
}
|
}
|
||||||
|
field.Width = 80
|
||||||
|
field.ListShow = 1
|
||||||
}
|
}
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
|
@ -3,11 +3,11 @@
|
|||||||
// @Copyright Copyright (c) 2023 HotGo CLI
|
// @Copyright Copyright (c) 2023 HotGo CLI
|
||||||
// @Author Ms <133814250@qq.com>
|
// @Author Ms <133814250@qq.com>
|
||||||
// @License https://github.com/bufanyun/hotgo/blob/master/LICENSE
|
// @License https://github.com/bufanyun/hotgo/blob/master/LICENSE
|
||||||
//
|
|
||||||
package views
|
package views
|
||||||
|
|
||||||
import (
|
import (
|
||||||
"github.com/gogf/gf/v2/text/gstr"
|
"github.com/gogf/gf/v2/text/gstr"
|
||||||
|
|
||||||
"hotgo/internal/model/input/sysin"
|
"hotgo/internal/model/input/sysin"
|
||||||
)
|
)
|
||||||
|
|
||||||
@ -258,3 +258,12 @@ func HasSwitch(headOps []string, masterFields []*sysin.GenCodesColumnListModel)
|
|||||||
}
|
}
|
||||||
return HasColumnWithFormMode(masterFields, "Switch")
|
return HasColumnWithFormMode(masterFields, "Switch")
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// HasTableSort 是否包含表排序字段
|
||||||
|
func HasTableSort(masterFields []*sysin.GenCodesColumnListModel) bool {
|
||||||
|
for _, field := range masterFields {
|
||||||
|
return gstr.InArray(field.Attribute, "sort")
|
||||||
|
}
|
||||||
|
|
||||||
|
return false
|
||||||
|
}
|
||||||
|
@ -7,12 +7,16 @@ package views
|
|||||||
|
|
||||||
import (
|
import (
|
||||||
"context"
|
"context"
|
||||||
|
"runtime"
|
||||||
|
"strings"
|
||||||
|
|
||||||
"github.com/gogf/gf/v2/errors/gerror"
|
"github.com/gogf/gf/v2/errors/gerror"
|
||||||
"github.com/gogf/gf/v2/frame/g"
|
"github.com/gogf/gf/v2/frame/g"
|
||||||
"github.com/gogf/gf/v2/os/gfile"
|
"github.com/gogf/gf/v2/os/gfile"
|
||||||
"github.com/gogf/gf/v2/os/gtime"
|
"github.com/gogf/gf/v2/os/gtime"
|
||||||
"github.com/gogf/gf/v2/os/gview"
|
"github.com/gogf/gf/v2/os/gview"
|
||||||
"github.com/gogf/gf/v2/text/gstr"
|
"github.com/gogf/gf/v2/text/gstr"
|
||||||
|
|
||||||
"hotgo/internal/consts"
|
"hotgo/internal/consts"
|
||||||
"hotgo/internal/library/hggen/internal/cmd/gendao"
|
"hotgo/internal/library/hggen/internal/cmd/gendao"
|
||||||
"hotgo/internal/library/hggen/internal/utility/utils"
|
"hotgo/internal/library/hggen/internal/utility/utils"
|
||||||
@ -20,8 +24,6 @@ import (
|
|||||||
"hotgo/internal/model/input/sysin"
|
"hotgo/internal/model/input/sysin"
|
||||||
"hotgo/utility/convert"
|
"hotgo/utility/convert"
|
||||||
"hotgo/utility/file"
|
"hotgo/utility/file"
|
||||||
"runtime"
|
|
||||||
"strings"
|
|
||||||
)
|
)
|
||||||
|
|
||||||
var Curd = gCurd{}
|
var Curd = gCurd{}
|
||||||
@ -41,6 +43,7 @@ type CurdStep struct {
|
|||||||
HasSwitch bool `json:"hasSwitch"`
|
HasSwitch bool `json:"hasSwitch"`
|
||||||
HasCheck bool `json:"hasCheck"`
|
HasCheck bool `json:"hasCheck"`
|
||||||
HasMenu bool `json:"hasMenu"`
|
HasMenu bool `json:"hasMenu"`
|
||||||
|
HasSort bool `json:"hasSort"`
|
||||||
}
|
}
|
||||||
|
|
||||||
type CurdOptionsJoin struct {
|
type CurdOptionsJoin struct {
|
||||||
@ -152,6 +155,7 @@ func initStep(in *CurdPreviewInput) {
|
|||||||
in.options.Step.HasSwitch = HasSwitch(in.options.ColumnOps, in.masterFields)
|
in.options.Step.HasSwitch = HasSwitch(in.options.ColumnOps, in.masterFields)
|
||||||
in.options.Step.HasCheck = gstr.InArray(in.options.ColumnOps, "check")
|
in.options.Step.HasCheck = gstr.InArray(in.options.ColumnOps, "check")
|
||||||
in.options.Step.HasMenu = gstr.InArray(in.options.AutoOps, "genMenuPermissions")
|
in.options.Step.HasMenu = gstr.InArray(in.options.AutoOps, "genMenuPermissions")
|
||||||
|
in.options.Step.HasSort = HasTableSort(in.masterFields)
|
||||||
}
|
}
|
||||||
|
|
||||||
func (l *gCurd) loadView(ctx context.Context, in *CurdPreviewInput) (err error) {
|
func (l *gCurd) loadView(ctx context.Context, in *CurdPreviewInput) (err error) {
|
||||||
|
@ -20,19 +20,24 @@ type GenCodesColumn struct {
|
|||||||
Extra string `json:"extra" dc:"额外选项"`
|
Extra string `json:"extra" dc:"额外选项"`
|
||||||
// 自定义生成属性
|
// 自定义生成属性
|
||||||
// Alias string `json:"alias" dc:"字段别名"`
|
// Alias string `json:"alias" dc:"字段别名"`
|
||||||
GoName string `json:"goName" dc:"Go属性"`
|
GoName string `json:"goName" dc:"Go属性"`
|
||||||
GoType string `json:"goType" dc:"Go类型"`
|
GoType string `json:"goType" dc:"Go类型"`
|
||||||
TsName string `json:"tsName" dc:"Ts属性"`
|
TsName string `json:"tsName" dc:"Ts属性"`
|
||||||
TsType string `json:"tsType" dc:"Ts类型"`
|
TsType string `json:"tsType" dc:"Ts类型"`
|
||||||
IsList bool `json:"isList" dc:"列表"`
|
IsList bool `json:"isList" dc:"列表"`
|
||||||
IsExport bool `json:"isExport" dc:"导出"`
|
IsExport bool `json:"isExport" dc:"导出"`
|
||||||
IsSort bool `json:"isSort" dc:"排序"`
|
IsSort bool `json:"isSort" dc:"排序"`
|
||||||
IsQuery bool `json:"isQuery" dc:"查询"`
|
IsQuery bool `json:"isQuery" dc:"查询"`
|
||||||
QueryWhere string `json:"queryWhere" dc:"查询条件"`
|
QueryWhere string `json:"queryWhere" dc:"查询条件"`
|
||||||
IsEdit bool `json:"isEdit" dc:"编辑"`
|
IsEdit bool `json:"isEdit" dc:"编辑"`
|
||||||
Required bool `json:"required" dc:"必填"`
|
Required bool `json:"required" dc:"必填"`
|
||||||
Unique bool `json:"unique" dc:"唯一性"`
|
Unique bool `json:"unique" dc:"唯一性"`
|
||||||
FormMode string `json:"formMode" dc:"表单组件"`
|
FormMode string `json:"formMode" dc:"表单组件"`
|
||||||
FormRole string `json:"formRole" dc:"表单验证"`
|
FormRole string `json:"formRole" dc:"表单验证"`
|
||||||
DictType int64 `json:"dictType" dc:"字典类型ID"`
|
DictType int64 `json:"dictType" dc:"字典类型ID"`
|
||||||
|
ListShow int64 `json:"listShow" dc:"显示状态"`
|
||||||
|
Width int64 `json:"width" dc:"单元格宽度"`
|
||||||
|
Placeholder string `json:"placeholder" dc:"占位符"`
|
||||||
|
ShowCondition string `json:"showCondition" dc:"显示条件"`
|
||||||
|
Attribute []string `json:"attribute" dc:"其他属性"`
|
||||||
}
|
}
|
||||||
|
@ -7,9 +7,11 @@ package sysin
|
|||||||
|
|
||||||
import (
|
import (
|
||||||
"context"
|
"context"
|
||||||
|
|
||||||
"github.com/gogf/gf/v2/errors/gerror"
|
"github.com/gogf/gf/v2/errors/gerror"
|
||||||
"github.com/gogf/gf/v2/text/gregex"
|
"github.com/gogf/gf/v2/text/gregex"
|
||||||
"github.com/gogf/gf/v2/util/gconv"
|
"github.com/gogf/gf/v2/util/gconv"
|
||||||
|
|
||||||
"hotgo/internal/consts"
|
"hotgo/internal/consts"
|
||||||
"hotgo/internal/model"
|
"hotgo/internal/model"
|
||||||
"hotgo/internal/model/entity"
|
"hotgo/internal/model/entity"
|
||||||
@ -89,6 +91,7 @@ type GenCodesSelectsModel struct {
|
|||||||
FormRole form.Selects `json:"formRole" dc:"表单验证"`
|
FormRole form.Selects `json:"formRole" dc:"表单验证"`
|
||||||
DictMode []*DictTypeTree `json:"dictMode" dc:"字典类型"`
|
DictMode []*DictTypeTree `json:"dictMode" dc:"字典类型"`
|
||||||
WhereMode form.Selects `json:"whereMode" dc:"查询条件"`
|
WhereMode form.Selects `json:"whereMode" dc:"查询条件"`
|
||||||
|
ListShow form.Selects `json:"listShow" dc:"显示位置"`
|
||||||
Addons form.Selects `json:"addons" dc:"插件选项"`
|
Addons form.Selects `json:"addons" dc:"插件选项"`
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -71,6 +71,7 @@ type @{.varName}ViewModel struct {
|
|||||||
// @{.varName}ListInp 获取@{.tableComment}列表
|
// @{.varName}ListInp 获取@{.tableComment}列表
|
||||||
type @{.varName}ListInp struct {
|
type @{.varName}ListInp struct {
|
||||||
form.PageReq
|
form.PageReq
|
||||||
|
@{ if eq .options.Step.HasSort true} form.Sorters@{end}
|
||||||
@{.listInpColumns}
|
@{.listInpColumns}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@ -28,6 +28,7 @@
|
|||||||
:actionColumn="actionColumn"
|
:actionColumn="actionColumn"
|
||||||
:checked-row-keys="checkedIds"
|
:checked-row-keys="checkedIds"
|
||||||
@update:checked-row-keys="onCheckedRow"
|
@update:checked-row-keys="onCheckedRow"
|
||||||
|
@{ if eq .options.Step.HasSort true} @update:sorter="handleUpdateSorter"@{end}
|
||||||
:scroll-x="1090"
|
:scroll-x="1090"
|
||||||
:resizeHeightOffset="-10000"
|
:resizeHeightOffset="-10000"
|
||||||
size="small"
|
size="small"
|
||||||
@ -91,6 +92,7 @@
|
|||||||
import { BasicTable, TableAction } from '@/components/Table';
|
import { BasicTable, TableAction } from '@/components/Table';
|
||||||
import { BasicForm, useForm } from '@/components/Form/index';
|
import { BasicForm, useForm } from '@/components/Form/index';
|
||||||
import { usePermission } from '@/hooks/web/usePermission';
|
import { usePermission } from '@/hooks/web/usePermission';
|
||||||
|
@{ if eq .options.Step.HasSort true} import { useSorter } from '@/hooks/common';@{end}
|
||||||
@{.apiImport}
|
@{.apiImport}
|
||||||
import { State, columns, schemas, options, newState } from './model';
|
import { State, columns, schemas, options, newState } from './model';
|
||||||
@{.iconsImport}
|
@{.iconsImport}
|
||||||
@ -107,6 +109,7 @@
|
|||||||
const checkedIds = ref([]);
|
const checkedIds = ref([]);
|
||||||
const showModal = ref(false);
|
const showModal = ref(false);
|
||||||
const formParams = ref<State>();
|
const formParams = ref<State>();
|
||||||
|
@{ if eq .options.Step.HasSort true} const { updateSorter: handleUpdateSorter, sortStatesRef: sortStatesRef } = useSorter(reloadTable);@{end}
|
||||||
|
|
||||||
const actionColumn = reactive({
|
const actionColumn = reactive({
|
||||||
width: 300,
|
width: 300,
|
||||||
@ -167,7 +170,11 @@
|
|||||||
});
|
});
|
||||||
|
|
||||||
const loadDataTable = async (res) => {
|
const loadDataTable = async (res) => {
|
||||||
return await List({ ...searchFormRef.value?.formModel, ...res });
|
return await List({
|
||||||
|
...searchFormRef.value?.formModel,
|
||||||
|
@{ if eq .options.Step.HasSort true} ...{ sorters: sortStatesRef.value },@{end}
|
||||||
|
...res,
|
||||||
|
});
|
||||||
};
|
};
|
||||||
@{ if eq .options.Step.HasAdd true }
|
@{ if eq .options.Step.HasAdd true }
|
||||||
function addTable() {
|
function addTable() {
|
||||||
|
@ -68,6 +68,11 @@
|
|||||||
>
|
>
|
||||||
</n-descriptions-item>
|
</n-descriptions-item>
|
||||||
|
|
||||||
|
<n-descriptions-item>
|
||||||
|
<template #label>修改时间</template>
|
||||||
|
{{ formValue.updatedAt }}
|
||||||
|
</n-descriptions-item>
|
||||||
|
|
||||||
|
|
||||||
</n-descriptions>
|
</n-descriptions>
|
||||||
</n-card>
|
</n-card>
|
||||||
|
263
web/src/views/develop/code/components/EditField.vue
Normal file
263
web/src/views/develop/code/components/EditField.vue
Normal file
@ -0,0 +1,263 @@
|
|||||||
|
<template>
|
||||||
|
<basicModal
|
||||||
|
@register="modalRegister"
|
||||||
|
ref="modalRef"
|
||||||
|
class="basicModal"
|
||||||
|
@on-ok="okModal"
|
||||||
|
@on-close="close"
|
||||||
|
:style="{
|
||||||
|
width: dialogWidth,
|
||||||
|
}"
|
||||||
|
>
|
||||||
|
<template #default>
|
||||||
|
<n-form
|
||||||
|
ref="formRef"
|
||||||
|
inline
|
||||||
|
:label-width="90"
|
||||||
|
:model="formValue"
|
||||||
|
size="medium"
|
||||||
|
label-placement="left"
|
||||||
|
>
|
||||||
|
<n-tabs type="line" animated>
|
||||||
|
<n-tab-pane name="basic" tab="基本信息">
|
||||||
|
<n-grid x-gap="24" :cols="2">
|
||||||
|
<n-gi :span="1">
|
||||||
|
<n-form-item label="字段描述" path="dc">
|
||||||
|
<n-input v-model:value="formValue.dc" placeholder="字段描述" />
|
||||||
|
</n-form-item>
|
||||||
|
</n-gi>
|
||||||
|
<n-gi :span="1">
|
||||||
|
<n-form-item label="字段列名" path="name">
|
||||||
|
<n-input disabled v-model:value="formValue.name" placeholder="字段列名" />
|
||||||
|
</n-form-item>
|
||||||
|
</n-gi>
|
||||||
|
<n-gi :span="1">
|
||||||
|
<n-form-item label="表单组件" path="formMode">
|
||||||
|
<n-select
|
||||||
|
:disabled="formValue.name === 'id'"
|
||||||
|
v-model:value="formValue.formMode"
|
||||||
|
:options="getFormModeOptions(formValue.tsType)"
|
||||||
|
placeholder="表单组件"
|
||||||
|
/>
|
||||||
|
</n-form-item>
|
||||||
|
</n-gi>
|
||||||
|
<n-gi :span="1">
|
||||||
|
<n-form-item label="默认值" path="defaultValue">
|
||||||
|
<n-input
|
||||||
|
:disabled="formValue.name === 'id'"
|
||||||
|
v-model:value="formValue.defaultValue"
|
||||||
|
placeholder="默认值"
|
||||||
|
/>
|
||||||
|
</n-form-item>
|
||||||
|
</n-gi>
|
||||||
|
<n-gi :span="1">
|
||||||
|
<n-form-item label="显示状态" path="listShow">
|
||||||
|
<n-select
|
||||||
|
v-model:value="formValue.listShow"
|
||||||
|
:options="props.selectList?.listShow ?? []"
|
||||||
|
placeholder="显示状态"
|
||||||
|
/>
|
||||||
|
</n-form-item>
|
||||||
|
</n-gi>
|
||||||
|
<n-gi :span="1">
|
||||||
|
<n-form-item label="字典类型" path="dictType">
|
||||||
|
<n-treeSelect
|
||||||
|
:disabled="formValue.name === 'id'"
|
||||||
|
v-model:value="formValue.dictType"
|
||||||
|
:options="props.selectList?.dictMode ?? []"
|
||||||
|
placeholder="字典类型"
|
||||||
|
clearable
|
||||||
|
/>
|
||||||
|
</n-form-item>
|
||||||
|
</n-gi>
|
||||||
|
<n-gi :span="1">
|
||||||
|
<n-form-item label="单元格宽度" path="width">
|
||||||
|
<n-input v-model:value="formValue.width" placeholder="单元格宽度" />
|
||||||
|
</n-form-item>
|
||||||
|
</n-gi>
|
||||||
|
<n-gi :span="1">
|
||||||
|
<n-form-item label="表单验证" path="formRole">
|
||||||
|
<n-select
|
||||||
|
:disabled="formValue.name === 'id'"
|
||||||
|
v-model:value="formValue.formRole"
|
||||||
|
:options="props.selectList?.formRole ?? []"
|
||||||
|
placeholder="表单验证"
|
||||||
|
/>
|
||||||
|
</n-form-item>
|
||||||
|
</n-gi>
|
||||||
|
</n-grid>
|
||||||
|
<n-grid x-gap="12" :cols="7">
|
||||||
|
<n-gi>
|
||||||
|
<n-form-item label="是否编辑" path="isEdit">
|
||||||
|
<n-checkbox
|
||||||
|
:disabled="formValue.name === 'id'"
|
||||||
|
v-model:checked="formValue.isEdit"
|
||||||
|
/>
|
||||||
|
</n-form-item>
|
||||||
|
</n-gi>
|
||||||
|
<n-gi>
|
||||||
|
<n-form-item label="是否必填" path="required">
|
||||||
|
<n-checkbox
|
||||||
|
:disabled="formValue.name === 'id'"
|
||||||
|
v-model:checked="formValue.required"
|
||||||
|
/>
|
||||||
|
</n-form-item>
|
||||||
|
</n-gi>
|
||||||
|
<n-gi>
|
||||||
|
<n-form-item label="是否唯一" path="unique">
|
||||||
|
<n-checkbox
|
||||||
|
:disabled="formValue.name === 'id'"
|
||||||
|
v-model:checked="formValue.unique"
|
||||||
|
/>
|
||||||
|
</n-form-item>
|
||||||
|
</n-gi>
|
||||||
|
<n-gi>
|
||||||
|
<n-form-item label="列表显示" path="isList">
|
||||||
|
<n-checkbox v-model:checked="formValue.isList" />
|
||||||
|
</n-form-item>
|
||||||
|
</n-gi>
|
||||||
|
<n-gi>
|
||||||
|
<n-form-item label="字段导出" path="isExport">
|
||||||
|
<n-checkbox v-model:checked="formValue.isExport" />
|
||||||
|
</n-form-item>
|
||||||
|
</n-gi>
|
||||||
|
<n-gi>
|
||||||
|
<n-form-item label="字段查询" path="isQuery">
|
||||||
|
<n-checkbox v-model:checked="formValue.isQuery" />
|
||||||
|
</n-form-item>
|
||||||
|
</n-gi>
|
||||||
|
</n-grid>
|
||||||
|
<n-grid x-gap="12" :cols="1">
|
||||||
|
<n-gi :span="6">
|
||||||
|
<n-form-item label="查询条件" path="queryWhere">
|
||||||
|
<n-select
|
||||||
|
:disabled="formValue.name === 'id'"
|
||||||
|
v-model:value="formValue.queryWhere"
|
||||||
|
:options="props.selectList?.whereMode ?? []"
|
||||||
|
placeholder="查询条件"
|
||||||
|
/>
|
||||||
|
</n-form-item>
|
||||||
|
</n-gi>
|
||||||
|
</n-grid>
|
||||||
|
</n-tab-pane>
|
||||||
|
<n-tab-pane name="expand" tab="拓展信息">
|
||||||
|
<n-grid x-gap="24" :cols="1">
|
||||||
|
<n-gi :span="1">
|
||||||
|
<n-form-item label="文本说明" path="placeholder">
|
||||||
|
<n-input
|
||||||
|
:disabled="formValue.name === 'id'"
|
||||||
|
v-model:value="formValue.placeholder"
|
||||||
|
placeholder="输入placeholder,占位符"
|
||||||
|
/>
|
||||||
|
</n-form-item>
|
||||||
|
</n-gi>
|
||||||
|
</n-grid>
|
||||||
|
<n-grid x-gap="24" :cols="1">
|
||||||
|
<n-gi :span="1">
|
||||||
|
<n-form-item label="显示条件" path="showCondition">
|
||||||
|
<n-input
|
||||||
|
:disabled="formValue.name === 'id'"
|
||||||
|
v-model:value="formValue.showCondition"
|
||||||
|
placeholder="输入框显示条件 如 params.status == 1"
|
||||||
|
/>
|
||||||
|
</n-form-item>
|
||||||
|
</n-gi>
|
||||||
|
</n-grid>
|
||||||
|
<n-grid x-gap="24" :cols="1">
|
||||||
|
<n-gi :span="1">
|
||||||
|
<n-form-item label="其他属性" path="attribute">
|
||||||
|
<n-checkbox-group v-model:value="formValue.attribute">
|
||||||
|
<n-checkbox value="sort" label="表头排序" />
|
||||||
|
</n-checkbox-group>
|
||||||
|
</n-form-item>
|
||||||
|
</n-gi>
|
||||||
|
</n-grid>
|
||||||
|
</n-tab-pane>
|
||||||
|
</n-tabs>
|
||||||
|
</n-form>
|
||||||
|
</template>
|
||||||
|
</basicModal>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script lang="ts" setup>
|
||||||
|
import { ref, computed, watch } from 'vue';
|
||||||
|
import { basicModal, useModal } from '@/components/Modal';
|
||||||
|
import { cloneDeep } from 'lodash-es';
|
||||||
|
import { selectListObj } from '@/views/develop/code/components/model';
|
||||||
|
|
||||||
|
const dialogWidth = ref('40%');
|
||||||
|
const emit = defineEmits(['updateShowModal', 'updateFieldInfo']);
|
||||||
|
|
||||||
|
interface Props {
|
||||||
|
showModal: boolean;
|
||||||
|
fieldInfo?: object;
|
||||||
|
selectList: any;
|
||||||
|
}
|
||||||
|
|
||||||
|
const props = withDefaults(defineProps<Props>(), {
|
||||||
|
showModal: false,
|
||||||
|
fieldInfo: () => {
|
||||||
|
return {};
|
||||||
|
},
|
||||||
|
selectList: selectListObj,
|
||||||
|
});
|
||||||
|
|
||||||
|
const isShowModal = computed({
|
||||||
|
get: () => {
|
||||||
|
return props.showModal;
|
||||||
|
},
|
||||||
|
set: (value) => {
|
||||||
|
emit('updateShowModal', value);
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
const formValue = ref<any>(cloneDeep(props.fieldInfo));
|
||||||
|
|
||||||
|
const [modalRegister, { openModal, closeModal }] = useModal({
|
||||||
|
title: '更新字段',
|
||||||
|
});
|
||||||
|
|
||||||
|
async function okModal() {
|
||||||
|
emit('updateFieldInfo', formValue);
|
||||||
|
closeModal();
|
||||||
|
}
|
||||||
|
|
||||||
|
function showModal() {
|
||||||
|
openModal();
|
||||||
|
}
|
||||||
|
|
||||||
|
function close() {
|
||||||
|
isShowModal.value = false;
|
||||||
|
}
|
||||||
|
|
||||||
|
watch(
|
||||||
|
() => props.showModal,
|
||||||
|
(value) => {
|
||||||
|
if (isShowModal.value) {
|
||||||
|
formValue.value = cloneDeep(props.fieldInfo);
|
||||||
|
showModal();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
);
|
||||||
|
|
||||||
|
function getFormModeOptions(type: string) {
|
||||||
|
const options = cloneDeep(props.selectList.formMode ?? []);
|
||||||
|
if (options.length === 0) {
|
||||||
|
return [];
|
||||||
|
}
|
||||||
|
switch (type) {
|
||||||
|
case 'number':
|
||||||
|
for (let i = 0; i < options.length; i++) {
|
||||||
|
const allows = ['InputNumber', 'Radio', 'Select', 'Switch', 'Rate'];
|
||||||
|
if (!allows.includes(options[i].value)) {
|
||||||
|
options[i].disabled = true;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
break;
|
||||||
|
default:
|
||||||
|
}
|
||||||
|
return options;
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="less" scoped></style>
|
@ -14,8 +14,8 @@
|
|||||||
ref="actionRef"
|
ref="actionRef"
|
||||||
:canResize="true"
|
:canResize="true"
|
||||||
:pagination="false"
|
:pagination="false"
|
||||||
:scroll-x="3000"
|
|
||||||
:scroll-y="720"
|
:scroll-y="720"
|
||||||
|
:actionColumn="actionColumn"
|
||||||
>
|
>
|
||||||
<template #tableTitle>
|
<template #tableTitle>
|
||||||
<n-tooltip placement="top-start" trigger="hover">
|
<n-tooltip placement="top-start" trigger="hover">
|
||||||
@ -35,17 +35,25 @@
|
|||||||
</BasicTable>
|
</BasicTable>
|
||||||
</n-card>
|
</n-card>
|
||||||
</n-spin>
|
</n-spin>
|
||||||
|
<Field
|
||||||
|
@updateShowModal="updateShowModal"
|
||||||
|
@updateFieldInfo="updateFieldInfo"
|
||||||
|
:showModal="showModal"
|
||||||
|
:fieldInfo="fieldInfo"
|
||||||
|
:selectList="selectList"
|
||||||
|
/>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import { computed, h, onMounted, ref } from 'vue';
|
import { computed, h, onMounted, ref, reactive } from 'vue';
|
||||||
import { BasicTable } from '@/components/Table';
|
import { BasicTable, TableAction } from '@/components/Table';
|
||||||
import { genInfoObj, selectListObj } from '@/views/develop/code/components/model';
|
import { genInfoObj, selectListObj } from '@/views/develop/code/components/model';
|
||||||
import { ColumnList } from '@/api/develop/code';
|
import { ColumnList } from '@/api/develop/code';
|
||||||
import { NButton, NCheckbox, NInput, NSelect, NTooltip, NTreeSelect } from 'naive-ui';
|
import { NButton, NCheckbox, NInput, NTooltip } from 'naive-ui';
|
||||||
import { HelpCircleOutline, Reload } from '@vicons/ionicons5';
|
import { HelpCircleOutline, Reload } from '@vicons/ionicons5';
|
||||||
import { renderIcon } from '@/utils';
|
import { renderIcon } from '@/utils';
|
||||||
import { cloneDeep } from 'lodash-es';
|
//import { cloneDeep } from 'lodash-es';
|
||||||
|
import Field from '@/views/develop/code/components/EditField.vue';
|
||||||
|
|
||||||
const renderTooltip = (trigger, content) => {
|
const renderTooltip = (trigger, content) => {
|
||||||
return h(NTooltip, null, {
|
return h(NTooltip, null, {
|
||||||
@ -79,6 +87,9 @@
|
|||||||
const columns = ref<any>([]);
|
const columns = ref<any>([]);
|
||||||
const show = ref(false);
|
const show = ref(false);
|
||||||
const dataSource = ref(formValue.value.masterColumns);
|
const dataSource = ref(formValue.value.masterColumns);
|
||||||
|
const showModal = ref(false);
|
||||||
|
const fieldInfo = ref<any>({});
|
||||||
|
const selectList = ref<any>(selectListObj);
|
||||||
|
|
||||||
async function reloadFields(loading = false) {
|
async function reloadFields(loading = false) {
|
||||||
dataSource.value = [];
|
dataSource.value = [];
|
||||||
@ -96,6 +107,45 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
const actionColumn = reactive({
|
||||||
|
width: 60,
|
||||||
|
title: '操作',
|
||||||
|
key: 'action',
|
||||||
|
fixed: 'right',
|
||||||
|
render(record) {
|
||||||
|
return h(TableAction as any, {
|
||||||
|
style: 'button',
|
||||||
|
actions: [
|
||||||
|
{
|
||||||
|
label: '编辑',
|
||||||
|
onClick: handleEdit.bind(null, record),
|
||||||
|
},
|
||||||
|
],
|
||||||
|
});
|
||||||
|
},
|
||||||
|
});
|
||||||
|
|
||||||
|
function updateShowModal(value) {
|
||||||
|
showModal.value = value;
|
||||||
|
}
|
||||||
|
|
||||||
|
function updateFieldInfo(field) {
|
||||||
|
const newData = dataSource.value.map((item) => {
|
||||||
|
if (item.name === field.value.name) {
|
||||||
|
return field.value;
|
||||||
|
}
|
||||||
|
return item;
|
||||||
|
});
|
||||||
|
dataSource.value = newData;
|
||||||
|
formValue.value.masterColumns = dataSource.value;
|
||||||
|
}
|
||||||
|
|
||||||
|
function handleEdit(record: Recordable) {
|
||||||
|
showModal.value = true;
|
||||||
|
fieldInfo.value = record;
|
||||||
|
selectList.value = props.selectList;
|
||||||
|
}
|
||||||
|
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
show.value = true;
|
show.value = true;
|
||||||
if (formValue.value.masterColumns.length === 0) {
|
if (formValue.value.masterColumns.length === 0) {
|
||||||
@ -200,7 +250,8 @@
|
|||||||
width: 50,
|
width: 50,
|
||||||
render(row) {
|
render(row) {
|
||||||
return h(NCheckbox, {
|
return h(NCheckbox, {
|
||||||
defaultChecked: row.isEdit,
|
//defaultChecked: row.isEdit,
|
||||||
|
checked: row.isEdit,
|
||||||
disabled: row.name === 'id',
|
disabled: row.name === 'id',
|
||||||
onUpdateChecked: function (e) {
|
onUpdateChecked: function (e) {
|
||||||
row.isEdit = e;
|
row.isEdit = e;
|
||||||
@ -215,7 +266,8 @@
|
|||||||
align: 'center',
|
align: 'center',
|
||||||
render(row) {
|
render(row) {
|
||||||
return h(NCheckbox, {
|
return h(NCheckbox, {
|
||||||
defaultChecked: row.required,
|
//defaultChecked: row.required,
|
||||||
|
checked: row.required,
|
||||||
disabled: row.name === 'id',
|
disabled: row.name === 'id',
|
||||||
onUpdateChecked: function (e) {
|
onUpdateChecked: function (e) {
|
||||||
row.required = e;
|
row.required = e;
|
||||||
@ -230,7 +282,8 @@
|
|||||||
align: 'center',
|
align: 'center',
|
||||||
render(row) {
|
render(row) {
|
||||||
return h(NCheckbox, {
|
return h(NCheckbox, {
|
||||||
defaultChecked: row.unique,
|
//defaultChecked: row.unique,
|
||||||
|
checked: row.unique,
|
||||||
disabled: row.name === 'id',
|
disabled: row.name === 'id',
|
||||||
onUpdateChecked: function (e) {
|
onUpdateChecked: function (e) {
|
||||||
row.unique = e;
|
row.unique = e;
|
||||||
@ -238,147 +291,147 @@
|
|||||||
});
|
});
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
{
|
// {
|
||||||
title: '表单组件',
|
// title: '表单组件',
|
||||||
key: 'formMode',
|
// key: 'formMode',
|
||||||
width: 200,
|
// width: 200,
|
||||||
render(row) {
|
// render(row) {
|
||||||
return h(NSelect, {
|
// return h(NSelect, {
|
||||||
value: row.formMode,
|
// value: row.formMode,
|
||||||
options: getFormModeOptions(row.tsType),
|
// options: getFormModeOptions(row.tsType),
|
||||||
// render: function (row) {
|
// // render: function (row) {
|
||||||
// return props.selectList?.formMode ?? [];
|
// // return props.selectList?.formMode ?? [];
|
||||||
// },
|
// // },
|
||||||
// onFocus: function (e) {
|
// // onFocus: function (e) {
|
||||||
// console.log('表单组件 onFocus row:', e);
|
// // console.log('表单组件 onFocus row:', e);
|
||||||
// },
|
// // },
|
||||||
onUpdateValue: function (e) {
|
// onUpdateValue: function (e) {
|
||||||
row.formMode = e;
|
// row.formMode = e;
|
||||||
},
|
// },
|
||||||
});
|
// });
|
||||||
},
|
// },
|
||||||
},
|
// },
|
||||||
{
|
// {
|
||||||
title: '表单验证',
|
// title: '表单验证',
|
||||||
key: 'formRole',
|
// key: 'formRole',
|
||||||
width: 200,
|
// width: 200,
|
||||||
render(row) {
|
// render(row) {
|
||||||
return h(NSelect, {
|
// return h(NSelect, {
|
||||||
value: row.formRole,
|
// value: row.formRole,
|
||||||
disabled: row.name === 'id',
|
// disabled: row.name === 'id',
|
||||||
options: props.selectList?.formRole ?? [],
|
// options: props.selectList?.formRole ?? [],
|
||||||
onUpdateValue: function (e) {
|
// onUpdateValue: function (e) {
|
||||||
row.formRole = e;
|
// row.formRole = e;
|
||||||
},
|
// },
|
||||||
});
|
// });
|
||||||
},
|
// },
|
||||||
},
|
// },
|
||||||
{
|
// {
|
||||||
title: '字典类型',
|
// title: '字典类型',
|
||||||
key: 'dictType',
|
// key: 'dictType',
|
||||||
width: 300,
|
// width: 300,
|
||||||
render(row) {
|
// render(row) {
|
||||||
return h(NTreeSelect, {
|
// return h(NTreeSelect, {
|
||||||
value: row.dictType,
|
// value: row.dictType,
|
||||||
disabled: row.name === 'id',
|
// disabled: row.name === 'id',
|
||||||
clearable: true,
|
// clearable: true,
|
||||||
options: props.selectList?.dictMode ?? [],
|
// options: props.selectList?.dictMode ?? [],
|
||||||
onUpdateValue: function (e) {
|
// onUpdateValue: function (e) {
|
||||||
row.dictType = e;
|
// row.dictType = e;
|
||||||
},
|
// },
|
||||||
});
|
// });
|
||||||
},
|
// },
|
||||||
},
|
// },
|
||||||
],
|
|
||||||
},
|
|
||||||
{
|
|
||||||
width: 800,
|
|
||||||
title: '列表',
|
|
||||||
key: 'list',
|
|
||||||
align: 'center',
|
|
||||||
children: [
|
|
||||||
{
|
|
||||||
title: '列表',
|
|
||||||
key: 'isList',
|
|
||||||
width: 50,
|
|
||||||
align: 'center',
|
|
||||||
render(row) {
|
|
||||||
return h(NCheckbox, {
|
|
||||||
defaultChecked: row.isList,
|
|
||||||
onUpdateChecked: function (e) {
|
|
||||||
row.isList = e;
|
|
||||||
},
|
|
||||||
});
|
|
||||||
},
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '导出',
|
|
||||||
key: 'isExport',
|
|
||||||
width: 50,
|
|
||||||
align: 'center',
|
|
||||||
render(row) {
|
|
||||||
return h(NCheckbox, {
|
|
||||||
defaultChecked: row.isExport,
|
|
||||||
onUpdateChecked: function (e) {
|
|
||||||
row.isExport = e;
|
|
||||||
},
|
|
||||||
});
|
|
||||||
},
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '查询',
|
|
||||||
key: 'isQuery',
|
|
||||||
width: 50,
|
|
||||||
align: 'center',
|
|
||||||
render(row) {
|
|
||||||
return h(NCheckbox, {
|
|
||||||
defaultChecked: row.isQuery,
|
|
||||||
onUpdateChecked: function (e) {
|
|
||||||
row.isQuery = e;
|
|
||||||
},
|
|
||||||
});
|
|
||||||
},
|
|
||||||
},
|
|
||||||
{
|
|
||||||
title: '查询条件',
|
|
||||||
key: 'queryWhere',
|
|
||||||
width: 300,
|
|
||||||
render(row) {
|
|
||||||
return h(NSelect, {
|
|
||||||
value: row.queryWhere,
|
|
||||||
disabled: row.name === 'id',
|
|
||||||
options: props.selectList?.whereMode ?? [],
|
|
||||||
onUpdateValue: function (e) {
|
|
||||||
row.queryWhere = e;
|
|
||||||
},
|
|
||||||
});
|
|
||||||
},
|
|
||||||
},
|
|
||||||
],
|
],
|
||||||
},
|
},
|
||||||
|
// {
|
||||||
|
// width: 800,
|
||||||
|
// title: '列表',
|
||||||
|
// key: 'list',
|
||||||
|
// align: 'center',
|
||||||
|
// children: [
|
||||||
|
// {
|
||||||
|
// title: '列表',
|
||||||
|
// key: 'isList',
|
||||||
|
// width: 50,
|
||||||
|
// align: 'center',
|
||||||
|
// render(row) {
|
||||||
|
// return h(NCheckbox, {
|
||||||
|
// defaultChecked: row.isList,
|
||||||
|
// onUpdateChecked: function (e) {
|
||||||
|
// row.isList = e;
|
||||||
|
// },
|
||||||
|
// });
|
||||||
|
// },
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// title: '导出',
|
||||||
|
// key: 'isExport',
|
||||||
|
// width: 50,
|
||||||
|
// align: 'center',
|
||||||
|
// render(row) {
|
||||||
|
// return h(NCheckbox, {
|
||||||
|
// defaultChecked: row.isExport,
|
||||||
|
// onUpdateChecked: function (e) {
|
||||||
|
// row.isExport = e;
|
||||||
|
// },
|
||||||
|
// });
|
||||||
|
// },
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// title: '查询',
|
||||||
|
// key: 'isQuery',
|
||||||
|
// width: 50,
|
||||||
|
// align: 'center',
|
||||||
|
// render(row) {
|
||||||
|
// return h(NCheckbox, {
|
||||||
|
// defaultChecked: row.isQuery,
|
||||||
|
// onUpdateChecked: function (e) {
|
||||||
|
// row.isQuery = e;
|
||||||
|
// },
|
||||||
|
// });
|
||||||
|
// },
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// title: '查询条件',
|
||||||
|
// key: 'queryWhere',
|
||||||
|
// width: 300,
|
||||||
|
// render(row) {
|
||||||
|
// return h(NSelect, {
|
||||||
|
// value: row.queryWhere,
|
||||||
|
// disabled: row.name === 'id',
|
||||||
|
// options: props.selectList?.whereMode ?? [],
|
||||||
|
// onUpdateValue: function (e) {
|
||||||
|
// row.queryWhere = e;
|
||||||
|
// },
|
||||||
|
// });
|
||||||
|
// },
|
||||||
|
// },
|
||||||
|
// ],
|
||||||
|
// },
|
||||||
];
|
];
|
||||||
|
|
||||||
show.value = false;
|
show.value = false;
|
||||||
});
|
});
|
||||||
|
|
||||||
function getFormModeOptions(type: string) {
|
// function getFormModeOptions(type: string) {
|
||||||
const options = cloneDeep(props.selectList?.formMode ?? []);
|
// const options = cloneDeep(props.selectList?.formMode ?? []);
|
||||||
if (options.length === 0) {
|
// if (options.length === 0) {
|
||||||
return [];
|
// return [];
|
||||||
}
|
// }
|
||||||
switch (type) {
|
// switch (type) {
|
||||||
case 'number':
|
// case 'number':
|
||||||
for (let i = 0; i < options.length; i++) {
|
// for (let i = 0; i < options.length; i++) {
|
||||||
const allows = ['InputNumber', 'Radio', 'Select', 'Switch', 'Rate'];
|
// const allows = ['InputNumber', 'Radio', 'Select', 'Switch', 'Rate'];
|
||||||
if (!allows.includes(options[i].value)) {
|
// if (!allows.includes(options[i].value)) {
|
||||||
options[i].disabled = true;
|
// options[i].disabled = true;
|
||||||
}
|
// }
|
||||||
}
|
// }
|
||||||
break;
|
// break;
|
||||||
default:
|
// default:
|
||||||
}
|
// }
|
||||||
return options;
|
// return options;
|
||||||
}
|
// }
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style lang="less" scoped></style>
|
<style lang="less" scoped></style>
|
||||||
|
Loading…
Reference in New Issue
Block a user