parent
1e72f12edb
commit
559ceec399
@ -1,6 +1,11 @@
|
|||||||
module.exports = {
|
module.exports = {
|
||||||
extends: ['@vue/eslint-config-standard'],
|
root: true,
|
||||||
|
extends: ['plugin:vue/vue3-essential', '@vue/eslint-config-standard-with-typescript'],
|
||||||
|
parserOptions: {
|
||||||
|
ecmaVersion: 'latest',
|
||||||
|
},
|
||||||
rules: {
|
rules: {
|
||||||
'vue/multi-word-component-names': 'off',
|
'vue/multi-word-component-names': 'off',
|
||||||
|
'@typescript-eslint/no-explicit-any': 'off',
|
||||||
},
|
},
|
||||||
}
|
}
|
||||||
|
@ -0,0 +1,232 @@
|
|||||||
|
{
|
||||||
|
"widgetList": [
|
||||||
|
{
|
||||||
|
"key": 47004,
|
||||||
|
"type": "table",
|
||||||
|
"category": "container",
|
||||||
|
"icon": "table",
|
||||||
|
"rows": [
|
||||||
|
{
|
||||||
|
"cols": [
|
||||||
|
{
|
||||||
|
"type": "table-cell",
|
||||||
|
"category": "container",
|
||||||
|
"icon": "table-cell",
|
||||||
|
"internal": true,
|
||||||
|
"widgetList": [],
|
||||||
|
"merged": false,
|
||||||
|
"options": {
|
||||||
|
"name": "table-cell-89646",
|
||||||
|
"cellWidth": "",
|
||||||
|
"cellHeight": "",
|
||||||
|
"colspan": 1,
|
||||||
|
"rowspan": 1,
|
||||||
|
"wordBreak": false,
|
||||||
|
"customClass": ""
|
||||||
|
},
|
||||||
|
"id": "table-cell-89646"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "table-cell",
|
||||||
|
"category": "container",
|
||||||
|
"icon": "table-cell",
|
||||||
|
"internal": true,
|
||||||
|
"widgetList": [],
|
||||||
|
"merged": false,
|
||||||
|
"options": {
|
||||||
|
"name": "table-cell-94169",
|
||||||
|
"cellWidth": "",
|
||||||
|
"cellHeight": "",
|
||||||
|
"colspan": 1,
|
||||||
|
"rowspan": 1,
|
||||||
|
"wordBreak": false,
|
||||||
|
"customClass": ""
|
||||||
|
},
|
||||||
|
"id": "table-cell-94169"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"id": "table-row-17138",
|
||||||
|
"merged": false
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"cols": [
|
||||||
|
{
|
||||||
|
"type": "table-cell",
|
||||||
|
"category": "container",
|
||||||
|
"icon": "table-cell",
|
||||||
|
"internal": true,
|
||||||
|
"widgetList": [
|
||||||
|
{
|
||||||
|
"key": 63447,
|
||||||
|
"type": "input",
|
||||||
|
"alias": "",
|
||||||
|
"icon": "text-field",
|
||||||
|
"formItemFlag": true,
|
||||||
|
"options": {
|
||||||
|
"name": "input52553",
|
||||||
|
"keyNameEnabled": false,
|
||||||
|
"keyName": "",
|
||||||
|
"label": "input",
|
||||||
|
"labelAlign": "",
|
||||||
|
"type": "text",
|
||||||
|
"defaultValue": "",
|
||||||
|
"placeholder": "",
|
||||||
|
"columnWidth": "200px",
|
||||||
|
"size": "",
|
||||||
|
"labelWidth": null,
|
||||||
|
"labelHidden": false,
|
||||||
|
"labelWrap": false,
|
||||||
|
"readonly": false,
|
||||||
|
"disabled": false,
|
||||||
|
"hidden": false,
|
||||||
|
"clearable": true,
|
||||||
|
"showPassword": false,
|
||||||
|
"required": false,
|
||||||
|
"requiredHint": "",
|
||||||
|
"validation": "",
|
||||||
|
"validationHint": "",
|
||||||
|
"customClass": "",
|
||||||
|
"labelIconClass": null,
|
||||||
|
"labelIconPosition": "rear",
|
||||||
|
"labelTooltip": null,
|
||||||
|
"minLength": null,
|
||||||
|
"maxLength": null,
|
||||||
|
"showWordLimit": false,
|
||||||
|
"prefixIcon": "",
|
||||||
|
"suffixIcon": "",
|
||||||
|
"appendButton": false,
|
||||||
|
"appendButtonDisabled": false,
|
||||||
|
"buttonIcon": "custom-search",
|
||||||
|
"appendText": false,
|
||||||
|
"textForAppend": "",
|
||||||
|
"onCreated": "",
|
||||||
|
"onMounted": "",
|
||||||
|
"onInput": "",
|
||||||
|
"onChange": "",
|
||||||
|
"onFocus": "",
|
||||||
|
"onBlur": "",
|
||||||
|
"onValidate": "",
|
||||||
|
"onAppendButtonClick": ""
|
||||||
|
},
|
||||||
|
"id": "input52553"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"merged": false,
|
||||||
|
"options": {
|
||||||
|
"name": "table-cell-57911",
|
||||||
|
"cellWidth": "",
|
||||||
|
"cellHeight": "",
|
||||||
|
"colspan": 2,
|
||||||
|
"rowspan": 1,
|
||||||
|
"wordBreak": false,
|
||||||
|
"customClass": ""
|
||||||
|
},
|
||||||
|
"id": "table-cell-57911"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"type": "table-cell",
|
||||||
|
"category": "container",
|
||||||
|
"icon": "table-cell",
|
||||||
|
"internal": true,
|
||||||
|
"widgetList": [],
|
||||||
|
"merged": true,
|
||||||
|
"options": {
|
||||||
|
"name": "table-cell-74240",
|
||||||
|
"cellWidth": "",
|
||||||
|
"cellHeight": "",
|
||||||
|
"colspan": 2,
|
||||||
|
"rowspan": 1,
|
||||||
|
"wordBreak": false,
|
||||||
|
"customClass": ""
|
||||||
|
},
|
||||||
|
"id": "table-cell-74240"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"id": "table-row-57542",
|
||||||
|
"merged": false
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"options": {
|
||||||
|
"name": "table61396",
|
||||||
|
"hidden": false,
|
||||||
|
"customClass": []
|
||||||
|
},
|
||||||
|
"id": "table61396"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"key": 63447,
|
||||||
|
"type": "input",
|
||||||
|
"alias": "",
|
||||||
|
"icon": "text-field",
|
||||||
|
"formItemFlag": true,
|
||||||
|
"options": {
|
||||||
|
"name": "input26255",
|
||||||
|
"keyNameEnabled": false,
|
||||||
|
"keyName": "",
|
||||||
|
"label": "input",
|
||||||
|
"labelAlign": "",
|
||||||
|
"type": "text",
|
||||||
|
"defaultValue": "",
|
||||||
|
"placeholder": "",
|
||||||
|
"columnWidth": "200px",
|
||||||
|
"size": "",
|
||||||
|
"labelWidth": null,
|
||||||
|
"labelHidden": false,
|
||||||
|
"labelWrap": false,
|
||||||
|
"readonly": false,
|
||||||
|
"disabled": false,
|
||||||
|
"hidden": false,
|
||||||
|
"clearable": true,
|
||||||
|
"showPassword": false,
|
||||||
|
"required": false,
|
||||||
|
"requiredHint": "",
|
||||||
|
"validation": "",
|
||||||
|
"validationHint": "",
|
||||||
|
"customClass": [],
|
||||||
|
"labelIconClass": null,
|
||||||
|
"labelIconPosition": "rear",
|
||||||
|
"labelTooltip": null,
|
||||||
|
"minLength": null,
|
||||||
|
"maxLength": null,
|
||||||
|
"showWordLimit": false,
|
||||||
|
"prefixIcon": "",
|
||||||
|
"suffixIcon": "",
|
||||||
|
"appendButton": false,
|
||||||
|
"appendButtonDisabled": false,
|
||||||
|
"buttonIcon": "custom-search",
|
||||||
|
"appendText": false,
|
||||||
|
"textForAppend": "",
|
||||||
|
"onCreated": "",
|
||||||
|
"onMounted": "",
|
||||||
|
"onInput": "",
|
||||||
|
"onChange": "",
|
||||||
|
"onFocus": "",
|
||||||
|
"onBlur": "",
|
||||||
|
"onValidate": "",
|
||||||
|
"onAppendButtonClick": ""
|
||||||
|
},
|
||||||
|
"id": "input26255"
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"formConfig": {
|
||||||
|
"modelName": "formData",
|
||||||
|
"refName": "vForm",
|
||||||
|
"rulesName": "rules",
|
||||||
|
"labelWidth": 80,
|
||||||
|
"labelPosition": "left",
|
||||||
|
"h5LabelTop": false,
|
||||||
|
"gridResponsive": false,
|
||||||
|
"size": "",
|
||||||
|
"labelAlign": "label-left-align",
|
||||||
|
"cssCode": "",
|
||||||
|
"customClass": [],
|
||||||
|
"functions": "",
|
||||||
|
"layoutType": "PC",
|
||||||
|
"jsonVersion": 3,
|
||||||
|
"dataSources": [],
|
||||||
|
"onFormCreated": "",
|
||||||
|
"onFormMounted": "",
|
||||||
|
"onFormDataChange": "",
|
||||||
|
"onFormValidate": ""
|
||||||
|
}
|
||||||
|
}
|
@ -0,0 +1,17 @@
|
|||||||
|
<script setup lang="ts">
|
||||||
|
import { computed, type Component } from 'vue'
|
||||||
|
import * as icons from '@element-plus/icons-vue'
|
||||||
|
import { QuestionFilled } from '@element-plus/icons-vue'
|
||||||
|
|
||||||
|
const props = defineProps<{
|
||||||
|
iconName: string
|
||||||
|
}>()
|
||||||
|
|
||||||
|
const iconComponent = computed<Component>(() => {
|
||||||
|
return (icons as Record<string, Component>)[props.iconName] || QuestionFilled
|
||||||
|
})
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<template>
|
||||||
|
<el-icon> <component :is="iconComponent" /></el-icon>
|
||||||
|
</template>
|
@ -1,12 +0,0 @@
|
|||||||
import { ref, computed } from 'vue'
|
|
||||||
import { defineStore } from 'pinia'
|
|
||||||
|
|
||||||
export const useCounterStore = defineStore('counter', () => {
|
|
||||||
const count = ref(0)
|
|
||||||
const doubleCount = computed(() => count.value * 2)
|
|
||||||
function increment() {
|
|
||||||
count.value++
|
|
||||||
}
|
|
||||||
|
|
||||||
return { count, doubleCount, increment }
|
|
||||||
})
|
|
@ -0,0 +1,9 @@
|
|||||||
|
import type { App } from "vue";
|
||||||
|
import { createPinia } from "pinia";
|
||||||
|
const store = createPinia();
|
||||||
|
|
||||||
|
export function setupStore(app: App<Element>) {
|
||||||
|
app.use(store);
|
||||||
|
}
|
||||||
|
|
||||||
|
export { store };
|
@ -0,0 +1,17 @@
|
|||||||
|
import { defineStore } from 'pinia'
|
||||||
|
import { store } from "@/stores";
|
||||||
|
export const configStore = defineStore('formConfig', {
|
||||||
|
state: () => ({
|
||||||
|
formConfig: {}
|
||||||
|
}),
|
||||||
|
getters: {
|
||||||
|
getFormConfig: (state) => state.formConfig,
|
||||||
|
},
|
||||||
|
actions: {
|
||||||
|
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
export function useConfigStore() {
|
||||||
|
return configStore(store);
|
||||||
|
}
|
@ -0,0 +1,17 @@
|
|||||||
|
import { defineStore } from 'pinia'
|
||||||
|
import { store } from "@/stores";
|
||||||
|
export const widgetStore = defineStore('widget', {
|
||||||
|
state: () => ({
|
||||||
|
widgetList: [],
|
||||||
|
}),
|
||||||
|
getters: {
|
||||||
|
getWidgetList: (state) => state.widgetList,
|
||||||
|
},
|
||||||
|
actions: {
|
||||||
|
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
export function useWidgetStore() {
|
||||||
|
return widgetStore(store);
|
||||||
|
}
|
@ -0,0 +1,24 @@
|
|||||||
|
export interface IContainerOption {
|
||||||
|
name: string
|
||||||
|
hidden: boolean
|
||||||
|
customClass: string
|
||||||
|
}
|
||||||
|
|
||||||
|
export type ICategory = 'container' | 'formItem'
|
||||||
|
|
||||||
|
export interface IWidget {
|
||||||
|
// 类别
|
||||||
|
category: ICategory
|
||||||
|
// 类型
|
||||||
|
type: string
|
||||||
|
// 展示名称
|
||||||
|
displayName: string
|
||||||
|
// 图标
|
||||||
|
icon: string
|
||||||
|
// 子类
|
||||||
|
rows?: []
|
||||||
|
// 属性
|
||||||
|
options: IContainerOption
|
||||||
|
}
|
||||||
|
|
||||||
|
|
@ -0,0 +1,16 @@
|
|||||||
|
/* eslint-disable @typescript-eslint/no-explicit-any */
|
||||||
|
import {
|
||||||
|
ElTable,
|
||||||
|
ElTableColumn,
|
||||||
|
ElInput,
|
||||||
|
ElForm,
|
||||||
|
ElFormItem
|
||||||
|
} from 'element-plus'
|
||||||
|
|
||||||
|
export const componentMap: Record<string, any> = {
|
||||||
|
'el-table': ElTable,
|
||||||
|
'el-table-column': ElTableColumn,
|
||||||
|
'el-input': ElInput,
|
||||||
|
'el-form': ElForm,
|
||||||
|
'el-form-item': ElFormItem,
|
||||||
|
}
|
@ -0,0 +1,16 @@
|
|||||||
|
/* eslint-disable @typescript-eslint/no-explicit-any */
|
||||||
|
import melonJson from "./melon.json";
|
||||||
|
/**
|
||||||
|
* 初始化和重置文书结构
|
||||||
|
* @param widgetJson
|
||||||
|
*/
|
||||||
|
export const initJson = (widgetJson: any) => {
|
||||||
|
widgetJson['widgetList'] = []
|
||||||
|
// widgetJson['formConfig'] = {}
|
||||||
|
}
|
||||||
|
|
||||||
|
export const addItem = (fatherId = "", widgetJson: any) => {
|
||||||
|
if (fatherId) { } else {
|
||||||
|
widgetJson['widgetList'] = [melonJson]
|
||||||
|
}
|
||||||
|
}
|
@ -0,0 +1,76 @@
|
|||||||
|
{
|
||||||
|
"key": 47004,
|
||||||
|
"id": "table-61396",
|
||||||
|
"category": "container",
|
||||||
|
"type": "el-table",
|
||||||
|
"displayName": "表格",
|
||||||
|
"icon": "Monitor",
|
||||||
|
"rows": [
|
||||||
|
{
|
||||||
|
"cols": [
|
||||||
|
{
|
||||||
|
"key": 47005,
|
||||||
|
"id": "table-column-12332",
|
||||||
|
"category": "container",
|
||||||
|
"type": "el-table-column",
|
||||||
|
"displayName": "子单元格",
|
||||||
|
"icon": "Monitor",
|
||||||
|
"rows": [],
|
||||||
|
"options": {
|
||||||
|
"name": "table-column-12332",
|
||||||
|
"cellWidth": "",
|
||||||
|
"cellHeight": "",
|
||||||
|
"colspan": 1,
|
||||||
|
"rowspan": 1,
|
||||||
|
"wordBreak": false,
|
||||||
|
"customClass": ""
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"key": 47015,
|
||||||
|
"id": "table-column-12344",
|
||||||
|
"category": "container",
|
||||||
|
"type": "el-table-column",
|
||||||
|
"displayName": "子单元格",
|
||||||
|
"icon": "Monitor",
|
||||||
|
"widgetList": [
|
||||||
|
{
|
||||||
|
"key": 47016,
|
||||||
|
"id": "input-12355",
|
||||||
|
"category": "formItem",
|
||||||
|
"type": "el-input",
|
||||||
|
"displayName": "输入框",
|
||||||
|
"icon": "Folder",
|
||||||
|
"options": {
|
||||||
|
"name": "input-12355",
|
||||||
|
"keyNameEnabled": false,
|
||||||
|
"keyName": "",
|
||||||
|
"label": "input",
|
||||||
|
"labelAlign": "",
|
||||||
|
"type": "text",
|
||||||
|
"defaultValue": "",
|
||||||
|
"hidden": false,
|
||||||
|
"customClass": ""
|
||||||
|
}
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"rows": [],
|
||||||
|
"options": {
|
||||||
|
"name": "table-column-12344",
|
||||||
|
"cellWidth": "",
|
||||||
|
"cellHeight": "",
|
||||||
|
"colspan": 1,
|
||||||
|
"rowspan": 1,
|
||||||
|
"wordBreak": false,
|
||||||
|
"customClass": ""
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
],
|
||||||
|
"options": {
|
||||||
|
"name": "",
|
||||||
|
"hidden": false,
|
||||||
|
"customClass": ""
|
||||||
|
}
|
||||||
|
}
|
@ -0,0 +1,54 @@
|
|||||||
|
import type { IWidget } from "@/types/widgetsConfigInterface"
|
||||||
|
|
||||||
|
export const containers: IWidget[] = [
|
||||||
|
{
|
||||||
|
category: 'container',
|
||||||
|
type: 'el-table',
|
||||||
|
displayName: '表格',
|
||||||
|
icon: 'Monitor',
|
||||||
|
rows: [],
|
||||||
|
options: {
|
||||||
|
name: '',
|
||||||
|
hidden: false,
|
||||||
|
customClass: '',
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
category: 'container',
|
||||||
|
type: 'el-table-column',
|
||||||
|
displayName: '子单元格',
|
||||||
|
icon: 'Monitor',
|
||||||
|
rows: [],
|
||||||
|
options: {
|
||||||
|
name: '',
|
||||||
|
hidden: false,
|
||||||
|
customClass: '',
|
||||||
|
}
|
||||||
|
}
|
||||||
|
]
|
||||||
|
|
||||||
|
|
||||||
|
export const basicFields: IWidget[] = [
|
||||||
|
{
|
||||||
|
category: 'formItem',
|
||||||
|
type: 'el-input',
|
||||||
|
displayName: '输入框',
|
||||||
|
icon: 'Folder',
|
||||||
|
options: {
|
||||||
|
name: '',
|
||||||
|
hidden: false,
|
||||||
|
customClass: '',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
{
|
||||||
|
category: 'formItem',
|
||||||
|
type: 'el-redio',
|
||||||
|
displayName: ' 单选项',
|
||||||
|
icon: 'Folder',
|
||||||
|
options: {
|
||||||
|
name: '',
|
||||||
|
hidden: false,
|
||||||
|
customClass: '',
|
||||||
|
},
|
||||||
|
},
|
||||||
|
]
|
@ -1,5 +1,10 @@
|
|||||||
<script setup lang="ts"></script>
|
<script setup lang="ts">
|
||||||
|
import { inject } from 'vue'
|
||||||
|
|
||||||
|
// 文书结构
|
||||||
|
const widgetJson = inject('widgetJson')
|
||||||
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<section></section>
|
<section>{{ widgetJson }}</section>
|
||||||
</template>
|
</template>
|
||||||
|
Loading…
Reference in new issue