parent
1e72f12edb
commit
559ceec399
@ -1,6 +1,11 @@
|
||||
module.exports = {
|
||||
extends: ['@vue/eslint-config-standard'],
|
||||
root: true,
|
||||
extends: ['plugin:vue/vue3-essential', '@vue/eslint-config-standard-with-typescript'],
|
||||
parserOptions: {
|
||||
ecmaVersion: 'latest',
|
||||
},
|
||||
rules: {
|
||||
'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>
|
||||
<section></section>
|
||||
<section>{{ widgetJson }}</section>
|
||||
</template>
|
||||
|
||||
Loading…
Reference in new issue