修改字段页面,增加一些字段属性配置

This commit is contained in:
嘉泽 2023-12-02 22:20:37 +08:00
parent ce39550bb8
commit ecfd40bf78
14 changed files with 640 additions and 206 deletions

View File

@ -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: "居右显示",
}

View File

@ -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
} }

View File

@ -8,14 +8,17 @@ package views
import ( import (
"context" "context"
"fmt" "fmt"
"strings"
"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/consts"
"hotgo/internal/library/hggen/internal/cmd/gendao" "hotgo/internal/library/hggen/internal/cmd/gendao"
"hotgo/internal/model/input/sysin" "hotgo/internal/model/input/sysin"
"strings"
) )
// DoTableColumns 获取指定表生成字段列表 // DoTableColumns 获取指定表生成字段列表
@ -40,6 +43,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 = consts.ListShowLeft
} }
return return
} }

View File

@ -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,15 @@ 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 {
isSort := gstr.InArray(field.Attribute, "sort")
if isSort {
return isSort
}
}
return false
}

View File

@ -7,12 +7,9 @@ package views
import ( import (
"context" "context"
"github.com/gogf/gf/v2/errors/gerror" "runtime"
"github.com/gogf/gf/v2/frame/g" "strings"
"github.com/gogf/gf/v2/os/gfile"
"github.com/gogf/gf/v2/os/gtime"
"github.com/gogf/gf/v2/os/gview"
"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 +17,13 @@ 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" "github.com/gogf/gf/v2/errors/gerror"
"github.com/gogf/gf/v2/frame/g"
"github.com/gogf/gf/v2/os/gfile"
"github.com/gogf/gf/v2/os/gtime"
"github.com/gogf/gf/v2/os/gview"
"github.com/gogf/gf/v2/text/gstr"
) )
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) {

View File

@ -9,8 +9,10 @@ import (
"bytes" "bytes"
"context" "context"
"fmt" "fmt"
"github.com/gogf/gf/v2/frame/g" "github.com/gogf/gf/v2/frame/g"
"github.com/gogf/gf/v2/text/gstr" "github.com/gogf/gf/v2/text/gstr"
"hotgo/internal/consts" "hotgo/internal/consts"
"hotgo/internal/model/input/sysin" "hotgo/internal/model/input/sysin"
) )
@ -114,6 +116,9 @@ func (l *gCurd) generateLogicEdit(ctx context.Context, in *CurdPreviewInput) g.M
func (l *gCurd) generateLogicListOrder(ctx context.Context, in *CurdPreviewInput) string { func (l *gCurd) generateLogicListOrder(ctx context.Context, in *CurdPreviewInput) string {
buffer := bytes.NewBuffer(nil) buffer := bytes.NewBuffer(nil)
if in.options.Step.HasSort {
buffer.WriteString("Handler(handler.Sorter(in)).")
}
if in.options.Step.HasMaxSort { if in.options.Step.HasMaxSort {
buffer.WriteString("OrderAsc(dao." + in.In.DaoName + ".Columns().Sort).") buffer.WriteString("OrderAsc(dao." + in.In.DaoName + ".Columns().Sort).")
} }

View File

@ -9,6 +9,7 @@ import (
"bytes" "bytes"
"context" "context"
"fmt" "fmt"
"github.com/gogf/gf/v2/frame/g" "github.com/gogf/gf/v2/frame/g"
"github.com/gogf/gf/v2/text/gstr" "github.com/gogf/gf/v2/text/gstr"
) )
@ -31,8 +32,18 @@ func (l *gCurd) generateWebEditFormItem(ctx context.Context, in *CurdPreviewInpu
continue continue
} }
placeholder := fmt.Sprintf("请输入%s", field.Dc)
if len(field.Placeholder) > 0 {
placeholder = field.Placeholder
}
showCondition := ""
if len(field.ShowCondition) > 0 {
showCondition = fmt.Sprintf(" v-if=\"%s\"", field.ShowCondition)
}
var ( var (
defaultComponent = fmt.Sprintf("<n-form-item label=\"%s\" path=\"%s\">\n <n-input placeholder=\"请输入%s\" v-model:value=\"params.%s\" />\n </n-form-item>", field.Dc, field.TsName, field.Dc, field.TsName) defaultComponent = fmt.Sprintf("<n-form-item%s label=\"%s\" path=\"%s\">\n <n-input placeholder=\"%s\" v-model:value=\"params.%s\" />\n </n-form-item>", showCondition, field.Dc, field.TsName, placeholder, field.TsName)
component string component string
) )
@ -41,63 +52,63 @@ func (l *gCurd) generateWebEditFormItem(ctx context.Context, in *CurdPreviewInpu
component = defaultComponent component = defaultComponent
case FormModeInputNumber: case FormModeInputNumber:
component = fmt.Sprintf("<n-form-item label=\"%s\" path=\"%s\">\n <n-input-number placeholder=\"请输入%s\" v-model:value=\"params.%s\" />\n </n-form-item>", field.Dc, field.TsName, field.Dc, field.TsName) component = fmt.Sprintf("<n-form-item%s label=\"%s\" path=\"%s\">\n <n-input-number placeholder=\"%s\" v-model:value=\"params.%s\" />\n </n-form-item>", showCondition, field.Dc, field.TsName, placeholder, field.TsName)
case FormModeInputTextarea: case FormModeInputTextarea:
component = fmt.Sprintf("<n-form-item label=\"%s\" path=\"%s\">\n <n-input type=\"textarea\" placeholder=\"%s\" v-model:value=\"params.%s\" />\n </n-form-item>", field.Dc, field.TsName, field.Dc, field.TsName) component = fmt.Sprintf("<n-form-item%s label=\"%s\" path=\"%s\">\n <n-input type=\"textarea\" placeholder=\"%s\" v-model:value=\"params.%s\" />\n </n-form-item>", showCondition, field.Dc, field.TsName, placeholder, field.TsName)
case FormModeInputEditor: case FormModeInputEditor:
component = fmt.Sprintf("<n-form-item label=\"%s\" path=\"%s\">\n <Editor style=\"height: 450px\" id=\"%s\" v-model:value=\"params.%s\" />\n </n-form-item>", field.Dc, field.TsName, field.TsName, field.TsName) component = fmt.Sprintf("<n-form-item%s label=\"%s\" path=\"%s\">\n <Editor style=\"height: 450px\" id=\"%s\" v-model:value=\"params.%s\" />\n </n-form-item>", showCondition, field.Dc, field.TsName, field.TsName, field.TsName)
case FormModeInputDynamic: case FormModeInputDynamic:
component = fmt.Sprintf("<n-form-item label=\"%s\" path=\"%s\">\n <n-dynamic-input\n v-model:value=\"params.%s\"\n preset=\"pair\"\n key-placeholder=\"键名\"\n value-placeholder=\"键值\"\n />\n </n-form-item>", field.Dc, field.TsName, field.TsName) component = fmt.Sprintf("<n-form-item%s label=\"%s\" path=\"%s\">\n <n-dynamic-input\n v-model:value=\"params.%s\"\n preset=\"pair\"\n key-placeholder=\"键名\"\n value-placeholder=\"键值\"\n />\n </n-form-item>", showCondition, field.Dc, field.TsName, field.TsName)
case FormModeDate: case FormModeDate:
component = fmt.Sprintf("<n-form-item label=\"%s\" path=\"%s\">\n <DatePicker v-model:formValue=\"params.%s\" type=\"date\" />\n </n-form-item>", field.Dc, field.TsName, field.TsName) component = fmt.Sprintf("<n-form-item%s label=\"%s\" path=\"%s\">\n <DatePicker v-model:formValue=\"params.%s\" type=\"date\" />\n </n-form-item>", showCondition, field.Dc, field.TsName, field.TsName)
// case FormModeDateRange: // 必须要有两个字段,后面优化下 // case FormModeDateRange: // 必须要有两个字段,后面优化下
case FormModeTime: case FormModeTime:
component = fmt.Sprintf("<n-form-item label=\"%s\" path=\"%s\">\n <DatePicker v-model:formValue=\"params.%s\" type=\"datetime\" />\n </n-form-item>", field.Dc, field.TsName, field.TsName) component = fmt.Sprintf("<n-form-item%s label=\"%s\" path=\"%s\">\n <DatePicker v-model:formValue=\"params.%s\" type=\"datetime\" />\n </n-form-item>", showCondition, field.Dc, field.TsName, field.TsName)
// case FormModeTimeRange: // 必须要有两个字段,后面优化下 // case FormModeTimeRange: // 必须要有两个字段,后面优化下
case FormModeRadio: case FormModeRadio:
component = fmt.Sprintf("<n-form-item label=\"%s\" path=\"%s\">\n <n-radio-group v-model:value=\"params.%s\" name=\"%s\">\n <n-radio-button\n v-for=\"%s in options.%s\"\n :key=\"%s.value\"\n :value=\"%s.value\"\n :label=\"%s.label\"\n />\n </n-radio-group>\n </n-form-item>", field.Dc, field.TsName, field.TsName, field.TsName, field.TsName, in.options.dictMap[field.TsName], field.TsName, field.TsName, field.TsName) component = fmt.Sprintf("<n-form-item%s label=\"%s\" path=\"%s\">\n <n-radio-group v-model:value=\"params.%s\" name=\"%s\">\n <n-radio-button\n v-for=\"%s in options.%s\"\n :key=\"%s.value\"\n :value=\"%s.value\"\n :label=\"%s.label\"\n />\n </n-radio-group>\n </n-form-item>", showCondition, field.Dc, field.TsName, field.TsName, field.TsName, field.TsName, in.options.dictMap[field.TsName], field.TsName, field.TsName, field.TsName)
case FormModeCheckbox: case FormModeCheckbox:
component = fmt.Sprintf("<n-form-item label=\"%s\" path=\"%s\">\n <n-checkbox-group v-model:value=\"params.%s\">\n <n-space>\n <n-checkbox\n v-for=\"item in options.%s\"\n :key=\"item.value\"\n :value=\"item.value\"\n :label=\"item.label\"\n />\n </n-space>\n </n-checkbox-group>\n </n-form-item>", field.Dc, field.TsName, field.TsName, in.options.dictMap[field.TsName]) component = fmt.Sprintf("<n-form-item%s label=\"%s\" path=\"%s\">\n <n-checkbox-group v-model:value=\"params.%s\">\n <n-space>\n <n-checkbox\n v-for=\"item in options.%s\"\n :key=\"item.value\"\n :value=\"item.value\"\n :label=\"item.label\"\n />\n </n-space>\n </n-checkbox-group>\n </n-form-item>", showCondition, field.Dc, field.TsName, field.TsName, in.options.dictMap[field.TsName])
case FormModeSelect: case FormModeSelect:
if in.options.dictMap[field.TsName] != nil { if in.options.dictMap[field.TsName] != nil {
component = fmt.Sprintf("<n-form-item label=\"%s\" path=\"%s\">\n <n-select v-model:value=\"params.%s\" :options=\"options.%s\" />\n </n-form-item>", field.Dc, field.TsName, field.TsName, in.options.dictMap[field.TsName]) component = fmt.Sprintf("<n-form-item%s label=\"%s\" path=\"%s\">\n <n-select v-model:value=\"params.%s\" :options=\"options.%s\" />\n </n-form-item>", showCondition, field.Dc, field.TsName, field.TsName, in.options.dictMap[field.TsName])
} else { } else {
component = fmt.Sprintf("<n-form-item label=\"%s\" path=\"%s\">\n <n-select v-model:value=\"params.%s\" options=\"\" />\n </n-form-item>", field.Dc, field.TsName, field.TsName) component = fmt.Sprintf("<n-form-item%s label=\"%s\" path=\"%s\">\n <n-select v-model:value=\"params.%s\" options=\"\" />\n </n-form-item>", showCondition, field.Dc, field.TsName, field.TsName)
} }
case FormModeSelectMultiple: case FormModeSelectMultiple:
component = fmt.Sprintf("<n-form-item label=\"%s\" path=\"%s\">\n <n-select multiple v-model:value=\"params.%s\" :options=\"options.%s\" />\n </n-form-item>", field.Dc, field.TsName, field.TsName, in.options.dictMap[field.TsName]) component = fmt.Sprintf("<n-form-item%s label=\"%s\" path=\"%s\">\n <n-select multiple v-model:value=\"params.%s\" :options=\"options.%s\" />\n </n-form-item>", showCondition, field.Dc, field.TsName, field.TsName, in.options.dictMap[field.TsName])
case FormModeUploadImage: case FormModeUploadImage:
component = fmt.Sprintf("<n-form-item label=\"%s\" path=\"%s\">\n <UploadImage :maxNumber=\"1\" v-model:value=\"params.%s\" />\n </n-form-item>", field.Dc, field.TsName, field.TsName) component = fmt.Sprintf("<n-form-item%s label=\"%s\" path=\"%s\">\n <UploadImage :maxNumber=\"1\" v-model:value=\"params.%s\" />\n </n-form-item>", showCondition, field.Dc, field.TsName, field.TsName)
case FormModeUploadImages: case FormModeUploadImages:
component = fmt.Sprintf("<n-form-item label=\"%s\" path=\"%s\">\n <UploadImage :maxNumber=\"10\" v-model:value=\"params.%s\" />\n </n-form-item>", field.Dc, field.TsName, field.TsName) component = fmt.Sprintf("<n-form-item%s label=\"%s\" path=\"%s\">\n <UploadImage :maxNumber=\"10\" v-model:value=\"params.%s\" />\n </n-form-item>", showCondition, field.Dc, field.TsName, field.TsName)
case FormModeUploadFile: case FormModeUploadFile:
component = fmt.Sprintf("<n-form-item label=\"%s\" path=\"%s\">\n <UploadFile :maxNumber=\"1\" v-model:value=\"params.%s\" />\n </n-form-item>", field.Dc, field.TsName, field.TsName) component = fmt.Sprintf("<n-form-item%s label=\"%s\" path=\"%s\">\n <UploadFile :maxNumber=\"1\" v-model:value=\"params.%s\" />\n </n-form-item>", showCondition, field.Dc, field.TsName, field.TsName)
case FormModeUploadFiles: case FormModeUploadFiles:
component = fmt.Sprintf("<n-form-item label=\"%s\" path=\"%s\">\n <UploadFile :maxNumber=\"10\" v-model:value=\"params.%s\" />\n </n-form-item>", field.Dc, field.TsName, field.TsName) component = fmt.Sprintf("<n-form-item%s label=\"%s\" path=\"%s\">\n <UploadFile :maxNumber=\"10\" v-model:value=\"params.%s\" />\n </n-form-item>", showCondition, field.Dc, field.TsName, field.TsName)
case FormModeSwitch: case FormModeSwitch:
component = fmt.Sprintf("<n-form-item label=\"%s\" path=\"%s\">\n <n-switch :unchecked-value=\"2\" :checked-value=\"1\" v-model:value=\"params.%s\"\n />\n </n-form-item>", field.Dc, field.TsName, field.TsName) component = fmt.Sprintf("<n-form-item%s label=\"%s\" path=\"%s\">\n <n-switch :unchecked-value=\"2\" :checked-value=\"1\" v-model:value=\"params.%s\"\n />\n </n-form-item>", showCondition, field.Dc, field.TsName, field.TsName)
case FormModeRate: case FormModeRate:
component = fmt.Sprintf("<n-form-item label=\"%s\" path=\"%s\">\n <n-rate allow-half :default-value=\"params.%s\" :on-update:value=\"update%s\" />\n </n-form-item>", field.Dc, field.TsName, field.TsName, field.GoName) component = fmt.Sprintf("<n-form-item%s label=\"%s\" path=\"%s\">\n <n-rate allow-half :default-value=\"params.%s\" :on-update:value=\"update%s\" />\n </n-form-item>", showCondition, field.Dc, field.TsName, field.TsName, field.GoName)
case FormModeCitySelector: case FormModeCitySelector:
component = fmt.Sprintf("<n-form-item label=\"%s\" path=\"%s\">\n <CitySelector v-model:value=\"params.%s\" />\n </n-form-item>", field.Dc, field.TsName, field.TsName) component = fmt.Sprintf("<n-form-item%s label=\"%s\" path=\"%s\">\n <CitySelector v-model:value=\"params.%s\" />\n </n-form-item>", showCondition, field.Dc, field.TsName, field.TsName)
default: default:
component = defaultComponent component = defaultComponent

View File

@ -9,8 +9,12 @@ import (
"bytes" "bytes"
"context" "context"
"fmt" "fmt"
"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/text/gstr"
"hotgo/internal/consts"
"hotgo/internal/model/input/sysin" "hotgo/internal/model/input/sysin"
"hotgo/utility/convert" "hotgo/utility/convert"
) )
@ -52,6 +56,10 @@ func (l *gCurd) generateWebModelDefaultState(ctx context.Context, in *CurdPrevie
} }
if value == "" { if value == "" {
value = "''" value = "''"
} else {
if field.TsType == consts.ConfigTypeString {
value = fmt.Sprintf("'%s'", value)
}
} }
if field.Name == "status" { if field.Name == "status" {
value = 1 value = 1
@ -256,15 +264,39 @@ func (l *gCurd) generateWebModelColumnsEach(buffer *bytes.Buffer, in *CurdPrevie
if !field.IsList { if !field.IsList {
continue continue
} }
ListShowType := "left"
switch field.ListShow {
case consts.ListShowHide:
continue
case consts.ListShowLeft:
ListShowType = "left"
case consts.ListShowCenter:
ListShowType = "center"
case consts.ListShowRight:
ListShowType = "right"
}
sorter := ""
if gstr.InArray(field.Attribute, "sort") {
sorter = "\n sorter: true,"
}
var ( var (
defaultComponent = fmt.Sprintf(" {\n title: '%s',\n key: '%s',\n },\n", field.Dc, field.TsName) defaultComponent = fmt.Sprintf(" {\n title: '%s',\n key: '%s',\n align: '%s',\n width: %v,%s\n },\n", field.Dc, field.TsName, ListShowType, field.Width, sorter)
component string // defaultComponent = fmt.Sprintf(" {\n title: '%s',\n key: '%s',\n },\n", field.Dc, field.TsName)
component string
) )
// 这里根据编辑表单组件来进行推断如果没有则使用默认input这可能会导致和查询条件所需参数不符的情况 // 这里根据编辑表单组件来进行推断如果没有则使用默认input这可能会导致和查询条件所需参数不符的情况
switch field.FormMode { switch field.FormMode {
case FormModeDate: case FormModeDate:
component = fmt.Sprintf(" {\n title: '%s',\n key: '%s',\n render(row) {\n return formatToDate(row.%s);\n },\n },\n", field.Dc, field.TsName, field.TsName) component = fmt.Sprintf(" {\n title: '%s',\n key: '%s',\n align: '%s',\n width: %v,%s\n render(row) {\n return formatToDate(row.%s);\n },\n },\n", field.Dc, field.TsName, ListShowType, field.Width, sorter, field.TsName)
// component = fmt.Sprintf(" {\n title: '%s',\n key: '%s',\n render(row) {\n return formatToDate(row.%s);\n },\n },\n", field.Dc, field.TsName, field.TsName)
case FormModeRadio: case FormModeRadio:
fallthrough fallthrough
@ -273,32 +305,40 @@ func (l *gCurd) generateWebModelColumnsEach(buffer *bytes.Buffer, in *CurdPrevie
err = gerror.Newf("设置单选下拉框选项时,必须选择字典类型,字段名称:%v", field.Name) err = gerror.Newf("设置单选下拉框选项时,必须选择字典类型,字段名称:%v", field.Name)
return return
} }
component = fmt.Sprintf(" {\n title: '%s',\n key: '%s',\n render(row) {\n if (isNullObject(row.%s)) {\n return ``;\n }\n return h(\n NTag,\n {\n style: {\n marginRight: '6px',\n },\n type: getOptionTag(options.value.%s, row.%s),\n bordered: false,\n },\n {\n default: () => getOptionLabel(options.value.%s, row.%s),\n }\n );\n },\n },\n", field.Dc, field.TsName, field.TsName, in.options.dictMap[field.TsName], field.TsName, in.options.dictMap[field.TsName], field.TsName) component = fmt.Sprintf(" {\n title: '%s',\n key: '%s',\n align: '%s',\n width: %v,%s\n render(row) {\n if (isNullObject(row.%s)) {\n return ``;\n }\n return h(\n NTag,\n {\n style: {\n marginRight: '6px',\n },\n type: getOptionTag(options.value.%s, row.%s),\n bordered: false,\n },\n {\n default: () => getOptionLabel(options.value.%s, row.%s),\n }\n );\n },\n },\n", field.Dc, field.TsName, ListShowType, field.Width, sorter, field.TsName, in.options.dictMap[field.TsName], field.TsName, in.options.dictMap[field.TsName], field.TsName)
// component = fmt.Sprintf(" {\n title: '%s',\n key: '%s',\n render(row) {\n if (isNullObject(row.%s)) {\n return ``;\n }\n return h(\n NTag,\n {\n style: {\n marginRight: '6px',\n },\n type: getOptionTag(options.value.%s, row.%s),\n bordered: false,\n },\n {\n default: () => getOptionLabel(options.value.%s, row.%s),\n }\n );\n },\n },\n", field.Dc, field.TsName, field.TsName, in.options.dictMap[field.TsName], field.TsName, in.options.dictMap[field.TsName], field.TsName)
case FormModeSelectMultiple: case FormModeSelectMultiple:
if g.IsEmpty(in.options.dictMap[field.TsName]) { if g.IsEmpty(in.options.dictMap[field.TsName]) {
err = gerror.Newf("设置多选下拉框选项时,必须选择字典类型,字段名称:%v", field.Name) err = gerror.Newf("设置多选下拉框选项时,必须选择字典类型,字段名称:%v", field.Name)
return return
} }
component = fmt.Sprintf(" {\n title: '%s',\n key: '%s',\n render(row) {\n if (isNullObject(row.%s) || !isArray(row.%s)) {\n return ``;\n }\n return row.%s.map((tagKey) => {\n return h(\n NTag,\n {\n style: {\n marginRight: '6px',\n },\n type: getOptionTag(options.value.%s, tagKey),\n bordered: false,\n },\n {\n default: () => getOptionLabel(options.value.%s, tagKey),\n }\n );\n });\n },\n },\n", field.Dc, field.TsName, field.TsName, field.TsName, field.TsName, in.options.dictMap[field.TsName], in.options.dictMap[field.TsName]) component = fmt.Sprintf(" {\n title: '%s',\n key: '%s',\n align: '%s',\n width: %v,%s\n render(row) {\n if (isNullObject(row.%s) || !isArray(row.%s)) {\n return ``;\n }\n return row.%s.map((tagKey) => {\n return h(\n NTag,\n {\n style: {\n marginRight: '6px',\n },\n type: getOptionTag(options.value.%s, tagKey),\n bordered: false,\n },\n {\n default: () => getOptionLabel(options.value.%s, tagKey),\n }\n );\n });\n },\n },\n", field.Dc, field.TsName, ListShowType, field.Width, sorter, field.TsName, field.TsName, field.TsName, in.options.dictMap[field.TsName], in.options.dictMap[field.TsName])
// component = fmt.Sprintf(" {\n title: '%s',\n key: '%s',\n render(row) {\n if (isNullObject(row.%s) || !isArray(row.%s)) {\n return ``;\n }\n return row.%s.map((tagKey) => {\n return h(\n NTag,\n {\n style: {\n marginRight: '6px',\n },\n type: getOptionTag(options.value.%s, tagKey),\n bordered: false,\n },\n {\n default: () => getOptionLabel(options.value.%s, tagKey),\n }\n );\n });\n },\n },\n", field.Dc, field.TsName, field.TsName, field.TsName, field.TsName, in.options.dictMap[field.TsName], in.options.dictMap[field.TsName])
case FormModeUploadImage: case FormModeUploadImage:
component = fmt.Sprintf(" {\n title: '%s',\n key: '%s',\n render(row) {\n return h(%s, {\n width: 32,\n height: 32,\n src: row.%s,\n onError: errorImg,\n style: {\n width: '32px',\n height: '32px',\n 'max-width': '100%%',\n 'max-height': '100%%',\n },\n });\n },\n },\n", field.Dc, field.TsName, "NImage", field.TsName) component = fmt.Sprintf(" {\n title: '%s',\n key: '%s',\n align: '%s',\n width: %v,%s\n render(row) {\n return h(%s, {\n width: 32,\n height: 32,\n src: row.%s,\n onError: errorImg,\n style: {\n width: '32px',\n height: '32px',\n 'max-width': '100%%',\n 'max-height': '100%%',\n },\n });\n },\n },", field.Dc, field.TsName, ListShowType, field.Width, sorter, "NImage", field.TsName)
// component = fmt.Sprintf(" {\n title: '%s',\n key: '%s',\n render(row) {\n return h(%s, {\n width: 32,\n height: 32,\n src: row.%s,\n onError: errorImg,\n style: {\n width: '32px',\n height: '32px',\n 'max-width': '100%%',\n 'max-height': '100%%',\n },\n });\n },\n },\n", field.Dc, field.TsName, "NImage", field.TsName)
case FormModeUploadImages: case FormModeUploadImages:
component = fmt.Sprintf(" {\n title: '%s',\n key: '%s',\n render(row) {\n if (isNullObject(row.%s)) {\n return ``;\n }\n return row.%s.map((image) => {\n return h(%s, {\n width: 32,\n height: 32,\n src: image,\n onError: errorImg,\n style: {\n width: '32px',\n height: '32px',\n 'max-width': '100%%',\n 'max-height': '100%%',\n 'margin-left': '2px',\n },\n });\n });\n },\n },\n", field.Dc, field.TsName, field.TsName, field.TsName, "NImage") component = fmt.Sprintf(" {\n title: '%s',\n key: '%s',\n align: '%s',\n width: %v,%s\n render(row) {\n if (isNullObject(row.%s)) {\n return ``;\n }\n return row.%s.map((image) => {\n return h(%s, {\n width: 32,\n height: 32,\n src: image,\n onError: errorImg,\n style: {\n width: '32px',\n height: '32px',\n 'max-width': '100%%',\n 'max-height': '100%%',\n 'margin-left': '2px',\n },\n });\n });\n },\n },\n", field.Dc, field.TsName, ListShowType, field.Width, sorter, field.TsName, field.TsName, "NImage")
// component = fmt.Sprintf(" {\n title: '%s',\n key: '%s',\n render(row) {\n if (isNullObject(row.%s)) {\n return ``;\n }\n return row.%s.map((image) => {\n return h(%s, {\n width: 32,\n height: 32,\n src: image,\n onError: errorImg,\n style: {\n width: '32px',\n height: '32px',\n 'max-width': '100%%',\n 'max-height': '100%%',\n 'margin-left': '2px',\n },\n });\n });\n },\n },\n", field.Dc, field.TsName, field.TsName, field.TsName, "NImage")
case FormModeUploadFile: case FormModeUploadFile:
component = fmt.Sprintf(" {\n title: '%s',\n key: '%s',\n render(row) {\n if (row.%s === '') {\n return ``;\n }\n return h(\n %s,\n {\n size: 'small',\n },\n {\n default: () => getFileExt(row.%s),\n }\n );\n },\n },\n", field.Dc, field.TsName, field.TsName, "NAvatar", field.TsName) component = fmt.Sprintf(" {\n title: '%s',\n key: '%s',\n align: '%s',\n width: %v,%s\n render(row) {\n if (row.%s === '') {\n return ``;\n }\n return h(\n %s,\n {\n size: 'small',\n },\n {\n default: () => getFileExt(row.%s),\n }\n );\n },\n },\n", field.Dc, field.TsName, ListShowType, field.Width, sorter, field.TsName, "NAvatar", field.TsName)
// component = fmt.Sprintf(" {\n title: '%s',\n key: '%s',\n render(row) {\n if (row.%s === '') {\n return ``;\n }\n return h(\n %s,\n {\n size: 'small',\n },\n {\n default: () => getFileExt(row.%s),\n }\n );\n },\n },\n", field.Dc, field.TsName, field.TsName, "NAvatar", field.TsName)
case FormModeUploadFiles: case FormModeUploadFiles:
component = fmt.Sprintf(" {\n title: '%s',\n key: '%s',\n render(row) {\n if (isNullObject(row.%s)) {\n return ``;\n }\n return row.%s.map((attachfile) => {\n return h(\n %s,\n {\n size: 'small',\n style: {\n 'margin-left': '2px',\n },\n },\n {\n default: () => getFileExt(attachfile),\n }\n );\n });\n },\n },\n", field.Dc, field.TsName, field.TsName, field.TsName, "NAvatar") component = fmt.Sprintf(" {\n title: '%s',\n key: '%s',\n align: '%s',\n width: %v,%s\n render(row) {\n if (isNullObject(row.%s)) {\n return ``;\n }\n return row.%s.map((attachfile) => {\n return h(\n %s,\n {\n size: 'small',\n style: {\n 'margin-left': '2px',\n },\n },\n {\n default: () => getFileExt(attachfile),\n }\n );\n });\n },\n },\n", field.Dc, field.TsName, ListShowType, field.Width, sorter, field.TsName, field.TsName, "NAvatar")
// component = fmt.Sprintf(" {\n title: '%s',\n key: '%s',\n render(row) {\n if (isNullObject(row.%s)) {\n return ``;\n }\n return row.%s.map((attachfile) => {\n return h(\n %s,\n {\n size: 'small',\n style: {\n 'margin-left': '2px',\n },\n },\n {\n default: () => getFileExt(attachfile),\n }\n );\n });\n },\n },\n", field.Dc, field.TsName, field.TsName, field.TsName, "NAvatar")
case FormModeSwitch: case FormModeSwitch:
component = fmt.Sprintf(" {\n title: '%s',\n key: '%s',\n width: 100,\n render(row) {\n return h(%s, {\n value: row.%s === 1,\n checked: '开启',\n unchecked: '关闭',\n disabled: !hasPermission(['%s']),\n onUpdateValue: function (e) {\n console.log('onUpdateValue e:' + JSON.stringify(e));\n row.%s = e ? 1 : 2;\n Switch({ %s: row.%s, key: '%s', value: row.%s }).then((_res) => {\n $message.success('操作成功');\n });\n },\n });\n },\n },\n", field.Dc, field.TsName, "NSwitch", field.TsName, "/"+in.options.ApiPrefix+"/switch", field.TsName, in.pk.TsName, in.pk.TsName, field.TsName, field.TsName) component = fmt.Sprintf(" {\n title: '%s',\n key: '%s',\n align: '%s',\n width: %v,%s\n render(row) {\n return h(%s, {\n value: row.%s === 1,\n checked: '开启',\n unchecked: '关闭',\n disabled: !hasPermission(['%s']),\n onUpdateValue: function (e) {\n console.log('onUpdateValue e:' + JSON.stringify(e));\n row.%s = e ? 1 : 2;\n Switch({ %s: row.%s, key: '%s', value: row.%s }).then((_res) => {\n $message.success('操作成功');\n });\n },\n });\n },\n },\n", field.Dc, field.TsName, ListShowType, field.Width, sorter, "NSwitch", field.TsName, "/"+in.options.ApiPrefix+"/switch", field.TsName, in.pk.TsName, in.pk.TsName, field.TsName, field.TsName)
// component = fmt.Sprintf(" {\n title: '%s',\n key: '%s',\n width: 100,\n render(row) {\n return h(%s, {\n value: row.%s === 1,\n checked: '开启',\n unchecked: '关闭',\n disabled: !hasPermission(['%s']),\n onUpdateValue: function (e) {\n console.log('onUpdateValue e:' + JSON.stringify(e));\n row.%s = e ? 1 : 2;\n Switch({ %s: row.%s, key: '%s', value: row.%s }).then((_res) => {\n $message.success('操作成功');\n });\n },\n });\n },\n },\n", field.Dc, field.TsName, "NSwitch", field.TsName, "/"+in.options.ApiPrefix+"/switch", field.TsName, in.pk.TsName, in.pk.TsName, field.TsName, field.TsName)
case FormModeRate: case FormModeRate:
component = fmt.Sprintf(" {\n title: '%s',\n key: '%s',\n render(row) {\n return h(%s, {\n allowHalf: true,\n readonly: true,\n defaultValue: row.%s,\n });\n },\n },\n", field.Dc, field.TsName, "NRate", field.TsName) component = fmt.Sprintf(" {\n title: '%s',\n key: '%s',\n align: '%s',\n width: %v,%s\n render(row) {\n return h(%s, {\n allowHalf: true,\n readonly: true,\n defaultValue: row.%s,\n });\n },\n },\n", field.Dc, field.TsName, ListShowType, field.Width, sorter, "NRate", field.TsName)
// component = fmt.Sprintf(" {\n title: '%s',\n key: '%s',\n render(row) {\n return h(%s, {\n allowHalf: true,\n readonly: true,\n defaultValue: row.%s,\n });\n },\n },\n", field.Dc, field.TsName, "NRate", field.TsName)
default: default:
component = defaultComponent component = defaultComponent

View File

@ -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:"其他属性"`
} }

View File

@ -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:"插件选项"`
} }

View File

@ -70,7 +70,8 @@ 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}
} }

View File

@ -27,7 +27,8 @@
ref="actionRef" ref="actionRef"
: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"
@ -90,7 +91,8 @@
import { useDialog, useMessage } from 'naive-ui'; import { useDialog, useMessage } from 'naive-ui';
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}
@ -106,7 +108,8 @@
const batchDeleteDisabled = ref(true); const batchDeleteDisabled = ref(true);
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() {

View 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>

View File

@ -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>