remove vue
This commit is contained in:
JaguarJack
@@ -1,287 +0,0 @@
|
||||
<template>
|
||||
<div>
|
||||
<CatchForm :schema="form" @onSubmit="submit"/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
const form = {
|
||||
items: [
|
||||
{
|
||||
name: 'Grid_FhAuLh',
|
||||
props: {
|
||||
columns: 2
|
||||
},
|
||||
component: 'grid',
|
||||
children: [
|
||||
{
|
||||
name: 'Grid_qRvhpR',
|
||||
props: {
|
||||
columns: 1
|
||||
},
|
||||
component: 'grid',
|
||||
children: [
|
||||
{
|
||||
name: 'type',
|
||||
props: {
|
||||
clearable: true,
|
||||
options: [
|
||||
{
|
||||
value: 1,
|
||||
label: '目录'
|
||||
},
|
||||
{
|
||||
value: 2,
|
||||
label: '菜单'
|
||||
},
|
||||
{
|
||||
value: 3,
|
||||
label: '按钮'
|
||||
}
|
||||
],
|
||||
optionType: 'button'
|
||||
},
|
||||
label: '菜单类型',
|
||||
component: 'radio',
|
||||
class: 'mt-4',
|
||||
initialValue: 1
|
||||
},
|
||||
{
|
||||
name: 'permission_name',
|
||||
props: {
|
||||
clearable: true
|
||||
},
|
||||
label: '菜单名称',
|
||||
component: 'input',
|
||||
class: 'mt-4',
|
||||
required: true
|
||||
},
|
||||
{
|
||||
name: 'module',
|
||||
props: {
|
||||
clearable: true,
|
||||
options: [
|
||||
{
|
||||
label: '权限管理',
|
||||
value: 'permissions'
|
||||
},
|
||||
{
|
||||
label: '动态表单',
|
||||
value: 'test'
|
||||
},
|
||||
{
|
||||
label: 'Testss',
|
||||
value: 'tests'
|
||||
}
|
||||
]
|
||||
},
|
||||
label: '所属模块',
|
||||
component: 'select',
|
||||
class: 'mt-4',
|
||||
required: true,
|
||||
hidden: '{{$values.type == 3}}'
|
||||
},
|
||||
{
|
||||
name: 'route',
|
||||
props: {
|
||||
clearable: true
|
||||
},
|
||||
label: '路由Path',
|
||||
component: 'input',
|
||||
class: 'mt-4',
|
||||
required: true,
|
||||
hidden: '{{$values.type == 3}}'
|
||||
},
|
||||
{
|
||||
name: 'redirect',
|
||||
props: {
|
||||
clearable: true
|
||||
},
|
||||
label: '重定向',
|
||||
component: 'input',
|
||||
class: 'mt-4',
|
||||
hidden: '{{$values.type == 3}}'
|
||||
},
|
||||
{
|
||||
name: 'sort',
|
||||
props: {
|
||||
clearable: true,
|
||||
min: 1,
|
||||
max: 10000
|
||||
},
|
||||
label: '排序',
|
||||
component: 'input_number',
|
||||
class: 'mt-4',
|
||||
initialValue: 1
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
name: 'Grid',
|
||||
props: {
|
||||
columns: 1
|
||||
},
|
||||
component: 'grid',
|
||||
children: [
|
||||
{
|
||||
name: 'parent_id',
|
||||
props: {
|
||||
clearable: true,
|
||||
options: [
|
||||
{
|
||||
id: 1,
|
||||
parent_id: 0,
|
||||
permission_name: '权限管理',
|
||||
children: [
|
||||
{
|
||||
id: 2,
|
||||
parent_id: 1,
|
||||
permission_name: '角色管理'
|
||||
},
|
||||
{
|
||||
id: 8,
|
||||
parent_id: 1,
|
||||
permission_name: '菜单管理'
|
||||
},
|
||||
{
|
||||
id: 15,
|
||||
parent_id: 1,
|
||||
permission_name: '岗位管理'
|
||||
},
|
||||
{
|
||||
id: 22,
|
||||
parent_id: 1,
|
||||
permission_name: '部门管理'
|
||||
},
|
||||
{
|
||||
id: 29,
|
||||
parent_id: 1,
|
||||
permission_name: '创建菜单'
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
id: 30,
|
||||
parent_id: 0,
|
||||
permission_name: '测试',
|
||||
children: [
|
||||
{
|
||||
id: 31,
|
||||
parent_id: 30,
|
||||
permission_name: '测试看看'
|
||||
},
|
||||
{
|
||||
id: 37,
|
||||
parent_id: 30,
|
||||
permission_name: '创建'
|
||||
}
|
||||
]
|
||||
}
|
||||
],
|
||||
label: 'permission_name',
|
||||
valueKey: 'id',
|
||||
value: 'id',
|
||||
'show-all-levels': false,
|
||||
checkStrictly: true,
|
||||
class: 'w-full'
|
||||
},
|
||||
label: '上级菜单',
|
||||
component: 'cascader',
|
||||
class: 'mt-4'
|
||||
},
|
||||
{
|
||||
name: 'permission_mark',
|
||||
props: {
|
||||
clearable: true,
|
||||
api: 'options/controllers',
|
||||
query: {
|
||||
module: '{{ $values.module }}'
|
||||
}
|
||||
},
|
||||
label: '权限标识',
|
||||
component: '{{$values.type == 3 ? "input" : "select"}}',
|
||||
class: 'mt-4',
|
||||
hidden: '{{$values.type == 1}}',
|
||||
required: true
|
||||
},
|
||||
{
|
||||
name: 'icon',
|
||||
props: {
|
||||
clearable: true
|
||||
},
|
||||
label: '图标',
|
||||
component: 'icon_select',
|
||||
class: 'mt-4',
|
||||
hidden: '{{$values.type == 3}}'
|
||||
},
|
||||
{
|
||||
name: 'component',
|
||||
props: {
|
||||
clearable: true,
|
||||
"allow-create": true
|
||||
},
|
||||
label: '所属组件',
|
||||
component: 'select',
|
||||
class: 'mt-4',
|
||||
hidden: '{{$values.type == 3}}'
|
||||
},
|
||||
{
|
||||
name: 'hidden',
|
||||
props: {
|
||||
options: [
|
||||
{
|
||||
value: 1,
|
||||
label: '是'
|
||||
},
|
||||
{
|
||||
value: 2,
|
||||
label: '否'
|
||||
}
|
||||
]
|
||||
},
|
||||
label: '是否隐藏',
|
||||
component: 'radio',
|
||||
class: 'mt-4',
|
||||
initialValue: 2,
|
||||
hidden: '{{$values.type == 3}}'
|
||||
},
|
||||
{
|
||||
name: 'keepalive',
|
||||
props: {
|
||||
options: [
|
||||
{
|
||||
value: 1,
|
||||
label: '是'
|
||||
},
|
||||
{
|
||||
value: 2,
|
||||
label: '否'
|
||||
}
|
||||
]
|
||||
},
|
||||
label: '是否缓存',
|
||||
component: 'radio',
|
||||
class: 'mt-4',
|
||||
initialValue: 2,
|
||||
hidden: '{{$values.type == 3}}'
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
// @ts-nocheck
|
||||
/**import { useCreate } from '@/form/composables/useCreate'
|
||||
const props = defineProps({
|
||||
primary: [String, Number],
|
||||
api: String,
|
||||
})
|
||||
|
||||
|
||||
const { form } = useCreate(props.api, props.primary)
|
||||
*/
|
||||
const submit = (formData) => {
|
||||
console.log(formData)
|
||||
}
|
||||
</script>
|
||||
@@ -1,53 +0,0 @@
|
||||
<template>
|
||||
<div>
|
||||
<catch-table
|
||||
:columns="[
|
||||
{
|
||||
label: '角色名称',
|
||||
prop: 'role_name'
|
||||
},
|
||||
{
|
||||
label: '角色标识',
|
||||
prop: 'description'
|
||||
},
|
||||
{
|
||||
label: '角色描述',
|
||||
prop: 'role_name'
|
||||
},
|
||||
{
|
||||
label: '创建时间',
|
||||
prop: 'created_at'
|
||||
},
|
||||
{
|
||||
type: 'operate',
|
||||
label: '操作',
|
||||
width: 200
|
||||
}
|
||||
]"
|
||||
:api="api"
|
||||
:search-form="[
|
||||
{
|
||||
type: 'input',
|
||||
label: '角色名称',
|
||||
name: 'role_name'
|
||||
}
|
||||
]"
|
||||
row-key="id"
|
||||
:pagination="false"
|
||||
>
|
||||
<template #dialog="row">
|
||||
<Create :primary="row?.id" :api="api"/>
|
||||
</template>
|
||||
</catch-table>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
// @ts-nocheck
|
||||
// import Create from './form/create.vue'
|
||||
import Create from './create.vue'
|
||||
|
||||
const api = 'permissions/roles'
|
||||
|
||||
</script>
|
||||
|
||||
@@ -1,109 +0,0 @@
|
||||
<template>
|
||||
<el-card class="box-card" shadow="never">
|
||||
<template #header>
|
||||
<div>
|
||||
<span>{{ $t('generate.code.title') }}</span>
|
||||
</div>
|
||||
</template>
|
||||
<div class="w-full sm:w-[40%] mx-auto">
|
||||
<el-form :model="gen" ref="form" label-width="100px">
|
||||
<el-form-item
|
||||
:label="$t('generate.code.module.name')"
|
||||
prop="module"
|
||||
:rules="[
|
||||
{
|
||||
required: true,
|
||||
message: $t('generate.code.module.verify'),
|
||||
},
|
||||
]"
|
||||
>
|
||||
<Select v-model="gen.module" clearable :placeholder="$t('generate.code.module.placeholder')" api="modules" class="w-full" filterable />
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
:label="$t('generate.code.controller.name')"
|
||||
prop="controller"
|
||||
:rules="[
|
||||
{
|
||||
required: true,
|
||||
message: $t('generate.code.controller.verify'),
|
||||
},
|
||||
]"
|
||||
>
|
||||
<el-input v-model="gen.controller" clearable :placeholder="$t('generate.code.controller.placeholder')" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('generate.code.model.name')" prop="model">
|
||||
<el-input v-model="gen.model" clearable :placeholder="$t('generate.code.model.placeholder')" />
|
||||
</el-form-item>
|
||||
|
||||
<div class="flex">
|
||||
<el-form-item :label="$t('generate.code.paginate')" prop="paginate">
|
||||
<el-switch v-model="gen.paginate" inline-prompt :active-text="$t('system.yes')" :inactive-text="$t('system.no')" />
|
||||
</el-form-item>
|
||||
<el-form-item label-width="15px">
|
||||
<div class="text-sm text-gray-300">控制列表是否使用分页功能</div>
|
||||
</el-form-item>
|
||||
</div>
|
||||
</el-form>
|
||||
</div>
|
||||
<Structure />
|
||||
<div class="w-full flex justify-center pt-5">
|
||||
<router-link to="/develop/schemas">
|
||||
<el-button>{{ $t('system.back') }}</el-button>
|
||||
</router-link>
|
||||
<el-button type="primary" @click="submitGenerate(form)" class="ml-5">{{ $t('system.finish') }}</el-button>
|
||||
</div>
|
||||
</el-card>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { watch, onMounted, reactive, ref } from 'vue'
|
||||
import { useGenerateStore } from './store'
|
||||
import type { FormInstance } from 'element-plus'
|
||||
import http from '/admin/support/http'
|
||||
import Structure from './structure.vue'
|
||||
import { useRouter } from 'vue-router'
|
||||
const generateStore = useGenerateStore()
|
||||
const gen = reactive(generateStore.getCodeGen)
|
||||
|
||||
const router = useRouter()
|
||||
|
||||
const schemaId = router.currentRoute.value.params.schema
|
||||
|
||||
onMounted(() => {
|
||||
if (!generateStore.getSchemaId) {
|
||||
generateStore.setSchemaId(schemaId)
|
||||
getSchema()
|
||||
} else {
|
||||
if (schemaId !== generateStore.getSchemaId) {
|
||||
generateStore.setSchemaId(schemaId)
|
||||
generateStore.resetStructures()
|
||||
getSchema()
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
const getSchema = () => {
|
||||
http.get('schema/' + schemaId).then(r => {
|
||||
gen.module = r.data.data.module
|
||||
gen.schema = r.data.data.name
|
||||
|
||||
gen.model = r.data.data.name.replace(/\_(\w)/g, (value, letter) => {
|
||||
return letter.toUpperCase()
|
||||
})
|
||||
|
||||
generateStore.initStructures(r.data.data.columns)
|
||||
})
|
||||
}
|
||||
const form = ref<FormInstance>()
|
||||
const submitGenerate = (formEl: FormInstance | undefined) => {
|
||||
if (!formEl) return
|
||||
formEl.validate(valid => {
|
||||
if (valid) {
|
||||
http.post('generate', generateStore.$state).then(r => {})
|
||||
//emits('next')
|
||||
//generateStore.$reset()
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
})
|
||||
}
|
||||
</script>
|
||||
@@ -1,112 +0,0 @@
|
||||
import { defineStore } from 'pinia'
|
||||
|
||||
/**
|
||||
* 表结构信息
|
||||
*/
|
||||
export interface Structure {
|
||||
field: string
|
||||
label: string
|
||||
form_component: string
|
||||
list: boolean
|
||||
form: boolean
|
||||
search: boolean
|
||||
search_op: string
|
||||
validates: string[]
|
||||
}
|
||||
|
||||
/**
|
||||
* CodeGen
|
||||
*/
|
||||
export interface CodeGen {
|
||||
module: string
|
||||
controller: string
|
||||
model: string
|
||||
paginate: true
|
||||
schema: string
|
||||
}
|
||||
|
||||
/**
|
||||
* generate
|
||||
*/
|
||||
interface generate {
|
||||
schemaId: number
|
||||
structures: Structure[]
|
||||
codeGen: CodeGen
|
||||
}
|
||||
|
||||
/**
|
||||
* useGenerateStore
|
||||
*/
|
||||
export const useGenerateStore = defineStore('generateStore', {
|
||||
state(): generate {
|
||||
return {
|
||||
// schema id
|
||||
schemaId: 0,
|
||||
// structures
|
||||
structures: [] as Structure[],
|
||||
// codeGen
|
||||
codeGen: Object.assign({
|
||||
module: '',
|
||||
controller: '',
|
||||
model: '',
|
||||
paginate: true,
|
||||
schema: '',
|
||||
}),
|
||||
}
|
||||
},
|
||||
|
||||
// store getters
|
||||
getters: {
|
||||
getSchemaId(): any {
|
||||
return this.schemaId
|
||||
},
|
||||
|
||||
getStructures(): Structure[] {
|
||||
return this.structures
|
||||
},
|
||||
|
||||
getCodeGen(): CodeGen {
|
||||
return this.codeGen
|
||||
},
|
||||
},
|
||||
|
||||
// store actions
|
||||
actions: {
|
||||
// set schema
|
||||
setSchemaId(schemaId: any): void {
|
||||
this.schemaId = schemaId
|
||||
},
|
||||
// reset
|
||||
resetStructures(): void {
|
||||
this.structures = []
|
||||
},
|
||||
// filter structures
|
||||
filterStructures(field: string) {
|
||||
this.structures = this.structures.filter((s: Structure) => {
|
||||
return !(s.field === field)
|
||||
})
|
||||
},
|
||||
|
||||
// init structure
|
||||
initStructures(fields: Array<any>): void {
|
||||
const unSupportFields = ['deleted_at', 'creator_id']
|
||||
|
||||
fields.forEach(field => {
|
||||
if (!unSupportFields.includes(field.name)) {
|
||||
this.structures.push(
|
||||
Object.assign({
|
||||
field: field.name,
|
||||
label: '',
|
||||
form_component: 'input',
|
||||
list: true,
|
||||
form: true,
|
||||
search: false,
|
||||
search_op: '',
|
||||
validates: [],
|
||||
}),
|
||||
)
|
||||
}
|
||||
})
|
||||
},
|
||||
},
|
||||
})
|
||||
@@ -1,113 +0,0 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-table :data="structures">
|
||||
<el-table-column prop="field" :label="$t('generate.schema.structure.field_name.name')" width="100px" />
|
||||
<el-table-column prop="label" :label="$t('generate.schema.structure.form_label')" width="150px">
|
||||
<template #default="scope">
|
||||
<el-input v-model="scope.row.label" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="label" :label="$t('generate.schema.structure.form_component')" width="110px">
|
||||
<template #default="scope">
|
||||
<el-select v-model="scope.row.form_component" class="w-full" filterable>
|
||||
<el-option v-for="component in formComponents" :key="component" :label="component" :value="component" />
|
||||
</el-select>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="list" :label="$t('generate.schema.structure.list')">
|
||||
<template #default="scope">
|
||||
<el-switch v-model="scope.row.list" inline-prompt :active-text="$t('system.yes')" :inactive-text="$t('system.no')" width="45px" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="form" :label="$t('generate.schema.structure.form')">
|
||||
<template #default="scope">
|
||||
<el-switch v-model="scope.row.form" inline-prompt :active-text="$t('system.yes')" :inactive-text="$t('system.no')" width="45px" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="search" :label="$t('generate.schema.structure.search')">
|
||||
<template #default="scope">
|
||||
<el-switch v-model="scope.row.search" inline-prompt :active-text="$t('system.yes')" :inactive-text="$t('system.no')" width="45px" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="search_op" :label="$t('generate.schema.structure.search_op.name')" width="150px">
|
||||
<template #default="scope">
|
||||
<el-select v-model="scope.row.search_op" :placeholder="$t('generate.schema.structure.search_op.placeholder')" class="w-full">
|
||||
<el-option v-for="op in operates" :key="op" :label="op" :value="op" />
|
||||
</el-select>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="validates" :label="$t('generate.schema.structure.rules.name')" width="250px">
|
||||
<template #default="scope">
|
||||
<el-select v-model="scope.row.validates" :placeholder="$t('generate.schema.structure.rules.placeholder')" multiple filterable allow-create clearable class="w-full">
|
||||
<el-option v-for="validate in validates" :key="validate" :label="validate" :value="validate" />
|
||||
</el-select>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<!--<el-table-column prop="comment" label="注释" />-->
|
||||
<el-table-column prop="id" :label="$t('generate.schema.structure.operate')" width="120px">
|
||||
<template #default="scope">
|
||||
<el-button type="danger" :icon="Delete" @click="deleteField(scope.row.field)" size="small" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { computed } from 'vue'
|
||||
import { useGenerateStore } from './store'
|
||||
import { Delete } from '@element-plus/icons-vue'
|
||||
|
||||
const generateStore = useGenerateStore()
|
||||
|
||||
const structures = computed(() => {
|
||||
generateStore.getStructures.forEach(struct => {
|
||||
if (struct.field === 'id' || struct.field === 'created_at' || struct.field === 'updated_at') {
|
||||
struct.form = false
|
||||
}
|
||||
|
||||
if (struct.field === 'sort') {
|
||||
struct.form_component = 'input-number'
|
||||
}
|
||||
|
||||
if (struct.field === 'status') {
|
||||
struct.form_component = 'select'
|
||||
}
|
||||
})
|
||||
|
||||
return generateStore.getStructures
|
||||
})
|
||||
|
||||
const deleteField = (field: string) => {
|
||||
generateStore.filterStructures(field)
|
||||
}
|
||||
|
||||
const operates: string[] = ['=', '!=', '>', '>=', '<', '<=', 'like', 'RLike', 'LLike', 'in']
|
||||
|
||||
const validates: string[] = [
|
||||
'required',
|
||||
'integer',
|
||||
'numeric',
|
||||
'string',
|
||||
'timezone',
|
||||
'url',
|
||||
'uuid',
|
||||
'date',
|
||||
'alpha',
|
||||
'alpha_dash',
|
||||
'alpha_num',
|
||||
'boolean',
|
||||
'email',
|
||||
'image',
|
||||
'file',
|
||||
'ip',
|
||||
'ipv4',
|
||||
'ipv6',
|
||||
'mac_address',
|
||||
'json',
|
||||
'nullable',
|
||||
'present',
|
||||
'prohibited',
|
||||
]
|
||||
|
||||
const formComponents: string[] = ['cascader', 'date', 'datetime', 'input', 'input-number', 'radio', 'rate', 'select', 'tree', 'tree-select', 'textarea', 'upload']
|
||||
</script>
|
||||
@@ -1,10 +0,0 @@
|
||||
<template>
|
||||
<div class="bg-white">
|
||||
<CodeGen />
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { ref } from 'vue'
|
||||
|
||||
import CodeGen from './components/codeGen.vue'
|
||||
</script>
|
||||
@@ -1,84 +0,0 @@
|
||||
<template>
|
||||
<el-form :model="formData" label-width="120px" ref="form" v-loading="loading" class="pr-4">
|
||||
<el-form-item
|
||||
:label="$t('module.form.name.title')"
|
||||
prop="title"
|
||||
:rules="[
|
||||
{
|
||||
required: true,
|
||||
message: $t('module.form.name.required'),
|
||||
},
|
||||
]"
|
||||
>
|
||||
<el-input v-model="formData.title" />
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
:label="$t('module.form.path.title')"
|
||||
prop="path"
|
||||
:rules="[
|
||||
{
|
||||
required: true,
|
||||
message: $t('module.form.path.required'),
|
||||
},
|
||||
]"
|
||||
>
|
||||
<el-input v-model="formData.path" :disabled="!!primary" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.form.keywords.title')" prop="keywords">
|
||||
<el-input v-model="formData.keywords" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('module.form.desc.title')" prop="desc">
|
||||
<el-input v-model="formData.description" type="textarea" />
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item :label="$t('module.form.dirs.title')" prop="dirs" v-if="!primary">
|
||||
<el-checkbox v-model="formData['dirs']['controllers']" label="Controllers" size="large" />
|
||||
<el-checkbox v-model="formData['dirs']['models']" label="Models" size="large" />
|
||||
<el-checkbox v-model="formData['dirs']['database']" label="Database" size="large" />
|
||||
<el-checkbox v-model="formData['dirs']['requests']" label="Requests" size="large" />
|
||||
</el-form-item>
|
||||
|
||||
<div class="flex justify-end">
|
||||
<el-button type="primary" @click="submitForm(form)">{{ $t('system.confirm') }}</el-button>
|
||||
</div>
|
||||
</el-form>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { useCreate } from '/admin/composables/curd/useCreate'
|
||||
import { useShow } from '/admin/composables/curd/useShow'
|
||||
|
||||
import { onMounted } from 'vue'
|
||||
|
||||
const props = defineProps({
|
||||
primary: String | Number,
|
||||
api: String,
|
||||
})
|
||||
|
||||
const { formData, form, loading, submitForm, close } = useCreate(
|
||||
props.api,
|
||||
props.primary,
|
||||
Object.assign({
|
||||
title: '',
|
||||
path: '',
|
||||
keywords: '',
|
||||
description: '',
|
||||
dirs: {
|
||||
controllers: true,
|
||||
models: true,
|
||||
database: true,
|
||||
requests: false,
|
||||
},
|
||||
}),
|
||||
)
|
||||
|
||||
const emit = defineEmits(['close'])
|
||||
|
||||
if (props.primary) {
|
||||
useShow(props.api, props.primary, formData)
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
close(() => emit('close'))
|
||||
})
|
||||
</script>
|
||||
@@ -1,74 +0,0 @@
|
||||
<template>
|
||||
<div>
|
||||
<Search :search="search" :reset="reset">
|
||||
<template v-slot:body>
|
||||
<el-form-item label="模块名称">
|
||||
<el-input v-model="query.title" name="title" clearable />
|
||||
</el-form-item>
|
||||
</template>
|
||||
</Search>
|
||||
<div class="table-default">
|
||||
<Operate :show="open">
|
||||
<template v-slot:operate>
|
||||
<!-- header 插槽的内容放这里 -->
|
||||
<el-button type="success" class="float-right" @click="installVisible = true"><Icon name="cog-6-tooth" class="mr-1 w-4 h-4" /> 安装</el-button>
|
||||
</template>
|
||||
</Operate>
|
||||
<el-table :data="tableData" class="mt-3" v-loading="loading">
|
||||
<el-table-column prop="title" label="模块名称" width="180" />
|
||||
<el-table-column prop="path" label="模块目录" width="180" />
|
||||
<el-table-column prop="version" label="模块版本">
|
||||
<template #default="scope">
|
||||
<el-tag type="warning">{{ scope.row.version }}</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="enable" label="模块状态">
|
||||
<template #default="scope">
|
||||
<Status v-model="scope.row.enable" :id="scope.row.name" :api="api" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="操作" width="300">
|
||||
<template #default="scope">
|
||||
<Update @click="open(scope.row.name)" />
|
||||
<Destroy @click="destroy(api, scope.row.name)" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<Dialog v-model="visible" :title="title" destroy-on-close>
|
||||
<Create @close="close(reset)" :primary="id" :api="api" />
|
||||
</Dialog>
|
||||
|
||||
<!-- 安装 -->
|
||||
<Dialog v-model="installVisible" title="安装模块" destroy-on-close>
|
||||
<Install @close="closeInstall" />
|
||||
</Dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { computed, onMounted, ref } from 'vue'
|
||||
import Create from './create.vue'
|
||||
import Install from './install.vue'
|
||||
import { useGetList } from '/admin/composables/curd/useGetList'
|
||||
import { useDestroy } from '/admin/composables/curd/useDestroy'
|
||||
import { useOpen } from '/admin/composables/curd/useOpen'
|
||||
|
||||
const api = 'module'
|
||||
|
||||
const { data, query, search, reset, loading } = useGetList(api)
|
||||
const { destroy, deleted } = useDestroy('确认删除吗? ⚠️将会删除模块下所有文件')
|
||||
const { open, close, title, visible, id } = useOpen()
|
||||
|
||||
const tableData = computed(() => data.value?.data)
|
||||
const installVisible = ref<boolean>(false)
|
||||
const closeInstall = () => {
|
||||
installVisible.value = false
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
search()
|
||||
|
||||
deleted(reset)
|
||||
})
|
||||
</script>
|
||||
@@ -1,93 +0,0 @@
|
||||
<template>
|
||||
<el-form :model="formData" label-width="120px" ref="form" v-loading="loading" class="pr-4">
|
||||
<el-form-item label="安装方式" prop="type">
|
||||
<el-radio-group v-model="formData.type">
|
||||
<el-radio-button
|
||||
v-for="item in [
|
||||
{ label: '普通安装', value: 1 },
|
||||
{ label: 'ZIP 安装', value: 2 },
|
||||
]"
|
||||
:key="item.value"
|
||||
:value="item.value"
|
||||
name="type"
|
||||
>{{ item.label }}
|
||||
</el-radio-button>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
label="模块名称"
|
||||
prop="title"
|
||||
:rules="[
|
||||
{
|
||||
required: true,
|
||||
message: '模块名称必须填写',
|
||||
},
|
||||
{
|
||||
validator: (rule: any, value: any, callback: any) => {
|
||||
if (! /^[A-Za-z]+$/.test(value)) {
|
||||
callback('模块名称只允许大小字母组合')
|
||||
} else {
|
||||
callback()
|
||||
}
|
||||
},
|
||||
trigger: 'blur',
|
||||
},
|
||||
]"
|
||||
>
|
||||
<el-select v-model="formData.title" placeholder="选择安装模块">
|
||||
<el-option v-for="item in modules" :key="item.value" :label="item.label" :value="item.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="上传 ZIP" prop="file" v-if="formData.type === 2">
|
||||
<Upload action="module/upload" :limit="1" accept=".zip" :on-success="moduleUpload">
|
||||
<template #trigger>
|
||||
<el-button type="primary">选择模块文件</el-button>
|
||||
</template>
|
||||
</Upload>
|
||||
</el-form-item>
|
||||
|
||||
<div class="flex justify-end">
|
||||
<el-button type="primary" @click="submitForm(form)">安装</el-button>
|
||||
</div>
|
||||
</el-form>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { useCreate } from '/admin/composables/curd/useCreate'
|
||||
|
||||
import { onMounted } from 'vue'
|
||||
import { Code } from '/admin/enum/app'
|
||||
import Message from '/admin/support/message'
|
||||
|
||||
const { formData, form, loading, submitForm, close } = useCreate('module/install')
|
||||
formData.value.type = 1
|
||||
|
||||
const emit = defineEmits(['close'])
|
||||
|
||||
onMounted(() => {
|
||||
close(() => emit('close'))
|
||||
})
|
||||
|
||||
const moduleUpload = (response, uploadFile) => {
|
||||
if (response.code === Code.SUCCESS) {
|
||||
formData.value.file = response.data
|
||||
} else {
|
||||
Message.error(response.message)
|
||||
}
|
||||
}
|
||||
|
||||
const modules = [
|
||||
{
|
||||
label: '权限管理',
|
||||
value: 'permissions',
|
||||
},
|
||||
{
|
||||
label: '内容管理',
|
||||
value: 'cms',
|
||||
},
|
||||
{
|
||||
label: '系统管理',
|
||||
value: 'system',
|
||||
},
|
||||
]
|
||||
</script>
|
||||
@@ -1,38 +0,0 @@
|
||||
import { RouteRecordRaw } from 'vue-router'
|
||||
|
||||
// @ts-ignore
|
||||
const router: RouteRecordRaw[] = [
|
||||
{
|
||||
path: '/develop',
|
||||
component: () => import('/admin/layout/index.vue'),
|
||||
meta: { title: '开发工具', icon: 'wrench-screwdriver' },
|
||||
children: [
|
||||
{
|
||||
path: 'modules',
|
||||
name: 'modules',
|
||||
meta: { title: '模块管理', icon: 'queue-list' },
|
||||
component: () => import('./module/index.vue'),
|
||||
},
|
||||
{
|
||||
path: 'schemas',
|
||||
name: 'schemas',
|
||||
meta: { title: 'Schemas', icon: 'list-bullet' },
|
||||
component: () => import('./schema/index.vue'),
|
||||
},
|
||||
{
|
||||
path: 'generate/:schema',
|
||||
name: 'generate',
|
||||
meta: { title: '代码生成', hidden: true, active_menu: '/develop/schemas' },
|
||||
component: () => import('./generate/index.vue'),
|
||||
},
|
||||
{
|
||||
path: 'dymaic',
|
||||
name: 'dymaic',
|
||||
meta: { title: '动态表格' },
|
||||
component: () => import('./dymaic/index.vue'),
|
||||
},
|
||||
],
|
||||
},
|
||||
]
|
||||
|
||||
export default router
|
||||
@@ -1,36 +0,0 @@
|
||||
<template>
|
||||
<div>
|
||||
<Schema v-if="active === 1" @next="next" @prev="prev" />
|
||||
<Structure v-if="active === 2" @next="next" @prev="prev" />
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { ref, watch } from 'vue'
|
||||
import Schema from './steps/schema.vue'
|
||||
import Structure from './steps/structure.vue'
|
||||
import { useSchemaStore } from './store'
|
||||
|
||||
const schemaStore = useSchemaStore()
|
||||
|
||||
const active = ref(1)
|
||||
const next = () => {
|
||||
if (active.value++ >= 2) {
|
||||
active.value = 2
|
||||
}
|
||||
}
|
||||
const prev = () => {
|
||||
if (active.value-- === 1) {
|
||||
active.value = 1
|
||||
}
|
||||
}
|
||||
|
||||
const emit = defineEmits(['close'])
|
||||
watch(
|
||||
() => schemaStore.getFinished,
|
||||
function (value) {
|
||||
if (value) {
|
||||
emit('close')
|
||||
}
|
||||
},
|
||||
)
|
||||
</script>
|
||||
@@ -1,83 +0,0 @@
|
||||
<template>
|
||||
<div>
|
||||
<Search :search="search" :reset="reset">
|
||||
<template v-slot:body>
|
||||
<el-form-item label="模块名称">
|
||||
<el-input v-model="query.module" name="module" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item label="Schema 名称">
|
||||
<el-input v-model="query.name" name="name" clearable />
|
||||
</el-form-item>
|
||||
</template>
|
||||
</Search>
|
||||
<div class="table-default">
|
||||
<Operate :show="open" />
|
||||
<el-table :data="tableData" class="mt-3" v-loading="loading">
|
||||
<el-table-column prop="module" label="所属模块" />
|
||||
<el-table-column prop="name" label="schema 名称" />
|
||||
<el-table-column prop="columns" label="字段">
|
||||
<template #default="scope">
|
||||
<el-button size="small" type="success" @click="view(scope.row.id)"><Icon name="eye" class="w-3 mr-1" /> 查看</el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="is_soft_delete" label="?软删">
|
||||
<template #default="scope">
|
||||
<el-tag v-if="scope.row.is_soft_delete">是</el-tag>
|
||||
<el-tag type="danger" v-else>否</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="created_at" label="创建时间" />
|
||||
<el-table-column label="操作" width="250">
|
||||
<template #default="scope">
|
||||
<router-link :to="'/develop/generate/' + scope.row.id">
|
||||
<el-button type="warning" size="small"><Icon name="wrench-screwdriver" class="w-3 mr-1" /> 生成代码</el-button>
|
||||
</router-link>
|
||||
<Destroy @click="destroy(api, scope.row.id)" class="ml-2" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<Paginate />
|
||||
</div>
|
||||
|
||||
<!-- schema 创建 -->
|
||||
<Dialog v-model="visible" :title="title" width="650px" destroy-on-close>
|
||||
<Create @close="close(reset)" :api="api" />
|
||||
</Dialog>
|
||||
|
||||
<!-- schema 表结构 -->
|
||||
<Dialog v-model="schemaVisible" title="Schema 结构" width="650px" destroy-on-close>
|
||||
<Show :id="id" :api="api" />
|
||||
</Dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { computed, onMounted, ref } from 'vue'
|
||||
import Create from './create.vue'
|
||||
import Show from './show.vue'
|
||||
import { useGetList } from '/admin/composables/curd/useGetList'
|
||||
import { useDestroy } from '/admin/composables/curd/useDestroy'
|
||||
import { useOpen } from '/admin/composables/curd/useOpen'
|
||||
|
||||
const schemaVisible = ref<boolean>(false)
|
||||
|
||||
const api = 'schema'
|
||||
|
||||
const { data, query, search, reset, loading } = useGetList(api)
|
||||
const { destroy, deleted } = useDestroy('确认删除吗? 删除后数据表将会保留，如需删除相关表，请手动进行删除!')
|
||||
const { open, close, title, visible, id } = useOpen()
|
||||
|
||||
const tableData = computed(() => data.value?.data)
|
||||
|
||||
const view = primaryId => {
|
||||
schemaVisible.value = true
|
||||
|
||||
id.value = primaryId
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
search()
|
||||
|
||||
deleted(reset)
|
||||
})
|
||||
</script>
|
||||
@@ -1,31 +0,0 @@
|
||||
<template>
|
||||
<el-table :data="data?.columns" class="mt-3" v-loading="loading">
|
||||
<el-table-column prop="name" label="字段名称" />
|
||||
<el-table-column prop="type" label="类型" />
|
||||
<el-table-column prop="nullable" label="nullable">
|
||||
<template #default="scope">
|
||||
<el-tag v-if="scope.row.nullable">是</el-tag>
|
||||
<el-tag type="danger" v-else>否</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="default" label="默认值">
|
||||
<template #default="scope"> </template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="comment" label="注释" />
|
||||
</el-table>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import { useShow } from '/admin/composables/curd/useShow'
|
||||
const props = defineProps({
|
||||
id: {
|
||||
type: Number,
|
||||
required: true,
|
||||
},
|
||||
})
|
||||
|
||||
// const data = ref<Array<object>>()
|
||||
const { data, loading } = useShow('schema', props.id)
|
||||
</script>
|
||||
|
||||
<style scoped></style>
|
||||
@@ -1,107 +0,0 @@
|
||||
<template>
|
||||
<div class="w-full sm:w-[90%] mx-auto">
|
||||
<el-form :model="schema" ref="form" label-width="80px">
|
||||
<el-form-item
|
||||
:label="$t('generate.code.module.name')"
|
||||
prop="module"
|
||||
:rules="[
|
||||
{
|
||||
// required: true,
|
||||
message: $t('generate.code.module.verify'),
|
||||
},
|
||||
]"
|
||||
>
|
||||
<Select v-model="schema.module" clearable :placeholder="$t('generate.code.module.placeholder')" api="modules" class="w-full" filterable />
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
:label="$t('generate.schema.name')"
|
||||
prop="name"
|
||||
:rules="[
|
||||
{
|
||||
required: true,
|
||||
message: $t('generate.schema.name_verify'),
|
||||
},
|
||||
]"
|
||||
>
|
||||
<el-input v-model="schema.name" clearable />
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
:label="$t('generate.schema.engine.name')"
|
||||
prop="engine"
|
||||
:rules="[
|
||||
{
|
||||
required: true,
|
||||
message: $t('generate.schema.engine.verify'),
|
||||
},
|
||||
]"
|
||||
>
|
||||
<el-select class="w-full" v-model="schema.engine" :placeholder="$t('generate.schema.engine.placeholder')" clearable>
|
||||
<el-option v-for="engine in engines" :key="engine.value" :label="engine.label" :value="engine.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('generate.schema.default_field.name')">
|
||||
<el-checkbox v-model="schema.created_at" :label="$t('generate.schema.default_field.created_at')" size="large" />
|
||||
<el-checkbox v-model="schema.updated_at" :label="$t('generate.schema.default_field.updated_at')" size="large" />
|
||||
<el-checkbox v-model="schema.creator_id" :label="$t('generate.schema.default_field.creator')" size="large" />
|
||||
<el-checkbox v-model="schema.deleted_at" :label="$t('generate.schema.default_field.delete_at')" size="large" />
|
||||
</el-form-item>
|
||||
<el-form-item
|
||||
:label="$t('generate.schema.comment.name')"
|
||||
prop="comment"
|
||||
:rules="[
|
||||
{
|
||||
required: true,
|
||||
message: $t('generate.schema.comment.verify'),
|
||||
},
|
||||
]"
|
||||
>
|
||||
<el-input v-model="schema.comment" type="textarea" />
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<div class="w-full sm:w-96 justify-between mx-auto pl-24 mt-4">
|
||||
<el-button class="mt-5" @click="$emit('prev')">{{ $t('system.prev') }}</el-button>
|
||||
<el-button class="mt-5" type="primary" @click="submitCreateTable(form)">{{ $t('system.next') }}</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { reactive, computed, ref, unref } from 'vue'
|
||||
import { useSchemaStore } from '../store'
|
||||
import type { FormInstance } from 'element-plus'
|
||||
|
||||
const schemaStore = useSchemaStore()
|
||||
schemaStore.start()
|
||||
|
||||
const emits = defineEmits(['prev', 'next'])
|
||||
|
||||
const schema = ref(schemaStore.getSchema)
|
||||
const form = ref<FormInstance>()
|
||||
const submitCreateTable = (formEl: FormInstance | undefined) => {
|
||||
if (!formEl) return
|
||||
formEl.validate(valid => {
|
||||
if (valid) {
|
||||
emits('next')
|
||||
schemaStore.setSchema(unref(schema))
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
})
|
||||
}
|
||||
const engines = computed(() => {
|
||||
return [
|
||||
{
|
||||
value: 'InnoDB',
|
||||
label: 'InnoDB',
|
||||
},
|
||||
{
|
||||
value: 'MyISAM',
|
||||
label: 'MyISAM',
|
||||
},
|
||||
{
|
||||
value: 'Memory',
|
||||
label: 'Memory',
|
||||
},
|
||||
]
|
||||
})
|
||||
</script>
|
||||
@@ -1,217 +0,0 @@
|
||||
<template>
|
||||
<div>
|
||||
<VueDraggable v-model="structures" target=".el-table__body tbody" animation="150" @end="onEnd">
|
||||
<el-table :data="structures" class="draggable" :lazy="false">
|
||||
<el-table-column prop="field" :label="$t('generate.schema.structure.field_name.name')" />
|
||||
<el-table-column prop="type" :label="$t('generate.schema.structure.type.name')">
|
||||
<template #default="scope">
|
||||
<el-tag type="success">{{ scope.row.type }}</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="nullable" :label="$t('generate.schema.structure.nullable')" width="90px">
|
||||
<template #default="scope">
|
||||
<el-tag v-if="scope.row.nullable">{{ $t('system.yes') }}</el-tag>
|
||||
<el-tag v-else type="info">{{ $t('system.no') }}</el-tag>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="default" :label="$t('generate.schema.structure.default')" />
|
||||
<!--<el-table-column prop="comment" label="注释" />-->
|
||||
<el-table-column prop="id" :label="$t('generate.schema.structure.operate')" width="120px">
|
||||
<template #default="scope">
|
||||
<el-button type="primary" :icon="Edit" @click="updateField(scope.row.id)" size="small" />
|
||||
<el-button type="danger" :icon="Delete" @click="deleteField(scope.row.id)" size="small" />
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</VueDraggable>
|
||||
|
||||
<div class="flex justify-end mt-4">
|
||||
<el-button type="success" :icon="Plus" @click="addField">{{ $t('system.add') }}</el-button>
|
||||
</div>
|
||||
|
||||
<div class="w-full sm:w-96 justify-between mx-auto pl-24 mt-2">
|
||||
<el-button class="mt-5" @click="emits('prev')">{{ $t('system.prev') }}</el-button>
|
||||
<el-button class="mt-5" type="primary" @click="next">{{ $t('system.confirm') }}</el-button>
|
||||
</div>
|
||||
|
||||
<Dialog v-model="visible" :title="$t('system.add')">
|
||||
<el-form :model="structure" status-icon label-width="120px" ref="form">
|
||||
<el-form-item
|
||||
:label="$t('generate.schema.structure.field_name.name')"
|
||||
prop="field"
|
||||
:rules="[
|
||||
{
|
||||
required: true,
|
||||
message: $t('generate.schema.structure.field_name.verify'),
|
||||
},
|
||||
]"
|
||||
>
|
||||
<el-input v-model="structure.field" />
|
||||
</el-form-item>
|
||||
<div class="flex justify-between">
|
||||
<el-form-item
|
||||
class="w-full"
|
||||
:label="$t('generate.schema.structure.type.name')"
|
||||
prop="type"
|
||||
:rules="[
|
||||
{
|
||||
required: true,
|
||||
message: $t('generate.schema.structure.type.verify'),
|
||||
},
|
||||
]"
|
||||
>
|
||||
<el-select v-model="structure.type" :placeholder="$t('generate.schema.structure.type.placeholder')" filterable class="w-full">
|
||||
<el-option v-for="item in types" :key="item" :label="item" :value="item" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</div>
|
||||
<el-form-item :label="$t('generate.schema.structure.length')" prop="length">
|
||||
<el-input-number v-model="structure.length" :min="0" />
|
||||
</el-form-item>
|
||||
<div class="flex justify-between">
|
||||
<el-form-item label="nullable" prop="nullable">
|
||||
<el-switch v-model="structure.nullable" inline-prompt :active-text="$t('system.yes')" :inactive-text="$t('system.no')" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('generate.schema.structure.default')" prop="default" v-if="!structure.nullable">
|
||||
<el-input v-model="structure.default" />
|
||||
</el-form-item>
|
||||
</div>
|
||||
<el-form-item :label="$t('generate.schema.structure.unique')" prop="unique">
|
||||
<el-switch v-model="structure.unique" inline-prompt :active-text="$t('system.yes')" :inactive-text="$t('system.no')" />
|
||||
</el-form-item>
|
||||
<el-form-item :label="$t('generate.schema.structure.comment')" prop="comment">
|
||||
<el-input v-model="structure.comment" text />
|
||||
</el-form-item>
|
||||
<div class="flex justify-end">
|
||||
<el-button type="primary" @click="submitStructure(form)">{{ $t('system.confirm') }}</el-button>
|
||||
</div>
|
||||
</el-form>
|
||||
</Dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script lang="ts" setup>
|
||||
import { Ref, ref } from 'vue'
|
||||
import { useSchemaStore, Structure } from '../store'
|
||||
import { Delete, Plus, Edit } from '@element-plus/icons-vue'
|
||||
import type { FormInstance } from 'element-plus'
|
||||
import Message from '/admin/support/message'
|
||||
import http from '/admin/support/http'
|
||||
import { Code } from '/admin/enum/app'
|
||||
import { VueDraggable } from 'vue-draggable-plus'
|
||||
|
||||
const schemaStore = useSchemaStore()
|
||||
const emits = defineEmits(['prev', 'next'])
|
||||
const visible = ref(false)
|
||||
|
||||
// 初始化
|
||||
const structures = ref(schemaStore.getStructures)
|
||||
|
||||
const structure: Ref<Structure> = ref(schemaStore.initStructure())
|
||||
// structure
|
||||
const addField = async () => {
|
||||
await form.value?.clearValidate()
|
||||
visible.value = true
|
||||
}
|
||||
const updateField = (id: number) => {
|
||||
visible.value = true
|
||||
schemaStore.getStructures.forEach(s => {
|
||||
if (s.id === id) {
|
||||
structure.value = s
|
||||
}
|
||||
})
|
||||
|
||||
schemaStore.setStructures(structures.value)
|
||||
}
|
||||
|
||||
const form = ref<FormInstance>()
|
||||
const submitStructure = (formEl: FormInstance | undefined) => {
|
||||
if (!formEl) return
|
||||
formEl.validate(valid => {
|
||||
if (valid) {
|
||||
visible.value = !visible.value
|
||||
schemaStore.addStructure(structure.value)
|
||||
structure.value = schemaStore.initStructure()
|
||||
} else {
|
||||
return false
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
const deleteField = (id: number) => {
|
||||
structures.value = structures.value.filter((s: Structure) => {
|
||||
return !(s.id === id)
|
||||
})
|
||||
schemaStore.setStructures(structures.value)
|
||||
}
|
||||
|
||||
const next = () => {
|
||||
if (schemaStore.getStructures.length < 1) {
|
||||
Message.error('请先填写表结构数据')
|
||||
} else {
|
||||
http.post('schema', schemaStore.$state).then(r => {
|
||||
if (r.data.code == Code.SUCCESS) {
|
||||
Message.success('创建成功')
|
||||
schemaStore.finished()
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
// 调整数据结构
|
||||
const onEnd = () => {
|
||||
schemaStore.setStructures(structures.value)
|
||||
}
|
||||
const types: string[] = [
|
||||
'id',
|
||||
'smallIncrements',
|
||||
'mediumIncrements',
|
||||
'increments',
|
||||
'smallInteger',
|
||||
'integer',
|
||||
'bigIncrements',
|
||||
'bigInteger',
|
||||
'mediumInteger',
|
||||
'unsignedInteger',
|
||||
'unsignedMediumInteger',
|
||||
'unsignedSmallInteger',
|
||||
'unsignedTinyInteger',
|
||||
'string',
|
||||
'text',
|
||||
'binary',
|
||||
'boolean',
|
||||
'char',
|
||||
'dateTimeTz',
|
||||
'dateTime',
|
||||
'date',
|
||||
'decimal',
|
||||
'double',
|
||||
'float',
|
||||
'geometryCollection',
|
||||
'geometry',
|
||||
'ipAddress',
|
||||
'json',
|
||||
'jsonb',
|
||||
'lineString',
|
||||
'longText',
|
||||
'macAddress',
|
||||
'mediumText',
|
||||
'multiLineString',
|
||||
'multiPoint',
|
||||
'multiPolygon',
|
||||
'nullableMorphs',
|
||||
'nullableTimestamps',
|
||||
'nullableUuidMorphs',
|
||||
'point',
|
||||
'polygon',
|
||||
'timeTz',
|
||||
'time',
|
||||
'timestampTz',
|
||||
'timestamp',
|
||||
'timestampsTz',
|
||||
'timestamps',
|
||||
'tinyIncrements',
|
||||
'tinyInteger',
|
||||
'tinyText',
|
||||
'uuid',
|
||||
'year',
|
||||
]
|
||||
</script>
|
||||
@@ -1,146 +0,0 @@
|
||||
import { defineStore } from 'pinia'
|
||||
|
||||
/**
|
||||
* 表信息
|
||||
*/
|
||||
export interface Schema {
|
||||
module: string
|
||||
name: string
|
||||
comment: string
|
||||
engine: string
|
||||
charset: string
|
||||
collaction: string
|
||||
created_at: boolean
|
||||
creator_id: boolean
|
||||
updated_at: boolean
|
||||
deleted_at: boolean
|
||||
}
|
||||
|
||||
/**
|
||||
* 表结构信息
|
||||
*/
|
||||
export interface Structure {
|
||||
id: number
|
||||
field: string
|
||||
length: number
|
||||
type: string
|
||||
nullable: boolean
|
||||
unique: boolean
|
||||
default: number | string
|
||||
comment: string
|
||||
}
|
||||
|
||||
/**
|
||||
* generate
|
||||
*/
|
||||
interface CreateSchema {
|
||||
schema: Schema
|
||||
structures: Structure[]
|
||||
is_finished: boolean
|
||||
}
|
||||
|
||||
/**
|
||||
* useSchemaStore
|
||||
*/
|
||||
export const useSchemaStore = defineStore('schemaStore', {
|
||||
state(): CreateSchema {
|
||||
return {
|
||||
// schema
|
||||
schema: Object.assign({
|
||||
module: '',
|
||||
name: '',
|
||||
comment: '',
|
||||
engine: 'InnoDB',
|
||||
charset: 'utf8mb4',
|
||||
collection: 'utf8mb4_unicode_ci',
|
||||
created_at: true,
|
||||
creator_id: true,
|
||||
updated_at: true,
|
||||
deleted_at: true,
|
||||
}),
|
||||
// structures
|
||||
structures: [] as Structure[],
|
||||
|
||||
// is finished
|
||||
is_finished: false,
|
||||
}
|
||||
},
|
||||
|
||||
// store getters
|
||||
getters: {
|
||||
getSchema(): Schema {
|
||||
return this.schema
|
||||
},
|
||||
|
||||
getStructures(): Structure[] {
|
||||
return this.structures
|
||||
},
|
||||
|
||||
getFinished(): boolean {
|
||||
return this.is_finished
|
||||
},
|
||||
},
|
||||
|
||||
// store actions
|
||||
actions: {
|
||||
// set schema
|
||||
setSchema(schema: Schema): void {
|
||||
this.schema = schema
|
||||
},
|
||||
|
||||
setStructures(structures: Array<Structure>): void {
|
||||
this.structures = structures
|
||||
},
|
||||
// add structure
|
||||
addStructure(structure: Structure): void {
|
||||
if (structure.id) {
|
||||
this.structures = this.structures.filter((s: Structure) => {
|
||||
if (s.id === structure.id) {
|
||||
s = structure
|
||||
}
|
||||
return s
|
||||
})
|
||||
} else {
|
||||
structure.id = this.structures.length + 1
|
||||
this.structures.push(structure)
|
||||
}
|
||||
},
|
||||
|
||||
// filter structures
|
||||
filterStructures(id: number) {
|
||||
this.structures = this.structures.filter((s: Structure) => {
|
||||
return !(s.id === id)
|
||||
})
|
||||
},
|
||||
|
||||
// init structure
|
||||
initStructure(): Structure {
|
||||
return Object.assign({
|
||||
id: 0,
|
||||
field: '',
|
||||
label: '',
|
||||
type: '',
|
||||
length: 0,
|
||||
nullable: false,
|
||||
unique: false,
|
||||
default: '',
|
||||
comment: '',
|
||||
})
|
||||
},
|
||||
|
||||
/**
|
||||
* finished
|
||||
*/
|
||||
finished(): void {
|
||||
this.$reset()
|
||||
this.is_finished = true
|
||||
},
|
||||
|
||||
/**
|
||||
* unfinished
|
||||
*/
|
||||
start(): void {
|
||||
this.is_finished = false
|
||||
},
|
||||
},
|
||||
})
|
||||
Reference in New Issue
Block a user