starfish-form-custom 1.0.0

package/dist/style.css

@@ -0,0 +1,377 @@
+.loading[data-v-2b901926] {
+  width: 100%;
+  height: 100%;
+  min-height: 40px;
+}
+.loading[data-v-2b901926] .el-loading-spinner .circular {
+  width: 30px;
+  height: 30px;
+}.control[data-v-2c747f4d] {
+  width: 240px;
+}
+.control > div[data-v-2c747f4d] {
+  display: flex;
+  align-items: center;
+}.starfish-editor .el-form-item__content,
+.starfish-form .el-form-item__content,
+.starfish-dynamicform .el-form-item__content {
+  margin-left: 0 !important;
+  margin-bottom: 12px;
+  display: block;
+}
+.starfish-editor .el-form-item,
+.starfish-form .el-form-item,
+.starfish-dynamicform .el-form-item {
+  margin-bottom: 0 !important;
+}
+.starfish-editor .el-form-item__error,
+.starfish-form .el-form-item__error,
+.starfish-dynamicform .el-form-item__error {
+  top: 100%;
+  left: 15px !important;
+}
+.starfish-editor .el-form,
+.starfish-form .el-form,
+.starfish-dynamicform .el-form {
+  padding-bottom: 64px;
+}
+.starfish-editor .jsoneditor-poweredBy,
+.starfish-form .jsoneditor-poweredBy,
+.starfish-dynamicform .jsoneditor-poweredBy {
+  display: none;
+}
+.starfish-editor .starfish-formitem,
+.starfish-form .starfish-formitem,
+.starfish-dynamicform .starfish-formitem {
+  text-align: left;
+  position: relative;
+  margin: 0 12px;
+}
+.starfish-editor .starfish-formitem.starfish-vertical,
+.starfish-form .starfish-formitem.starfish-vertical,
+.starfish-dynamicform .starfish-formitem.starfish-vertical {
+  display: flex;
+  align-items: center;
+}
+.starfish-editor .starfish-formitem.starfish-vertical .control,
+.starfish-form .starfish-formitem.starfish-vertical .control,
+.starfish-dynamicform .starfish-formitem.starfish-vertical .control {
+  width: 100%;
+}
+.starfish-editor .starfish-formitem.formCover,
+.starfish-form .starfish-formitem.formCover,
+.starfish-dynamicform .starfish-formitem.formCover {
+  padding-bottom: 12px;
+}
+.starfish-editor .starfish-formitem .label,
+.starfish-form .starfish-formitem .label,
+.starfish-dynamicform .starfish-formitem .label {
+  font-size: 14px;
+  height: 25px;
+  line-height: 25px;
+  padding-right: 12px;
+  box-sizing: border-box;
+  white-space: nowrap;
+}
+.starfish-editor .starfish-formitem .label.label_right,
+.starfish-form .starfish-formitem .label.label_right,
+.starfish-dynamicform .starfish-formitem .label.label_right {
+  float: left;
+  text-align: right;
+  position: absolute;
+}
+.starfish-editor .starfish-formitem .label.label_left,
+.starfish-form .starfish-formitem .label.label_left,
+.starfish-dynamicform .starfish-formitem .label.label_left {
+  float: left;
+  text-align: left;
+  position: absolute;
+}
+.starfish-editor .starfish-formitem .item_require,
+.starfish-form .starfish-formitem .item_require,
+.starfish-dynamicform .starfish-formitem .item_require {
+  color: red;
+}
+.starfish-editor #jsoneditor,
+.starfish-form #jsoneditor,
+.starfish-dynamicform #jsoneditor {
+  position: relative;
+  z-index: 1;
+}
+.starfish-editor #jsoneditor .fullScreen,
+.starfish-form #jsoneditor .fullScreen,
+.starfish-dynamicform #jsoneditor .fullScreen {
+  position: absolute;
+  right: 10px;
+  line-height: 1;
+  z-index: 2;
+  top: 10px;
+  color: white;
+  font-size: 18px;
+}
+.starfish-keyValueItem {
+  display: flex;
+  justify-content: space-around;
+  align-items: center;
+  font-size: 12px;
+  border: 1px solid #eee;
+  margin-bottom: 6px;
+  border-radius: 10px;
+  padding: 10px 0;
+}
+.starfish-keyValueItem .keyValueSelect {
+  width: 30px;
+  text-align: center;
+}
+.starfish-keyValueItem .keyValueInput {
+  flex: 1;
+}
+.starfish-keyValueItem .keyValueInput .inputItem {
+  line-height: 20px;
+}
+.starfish-keyValueItem .keyValueInput > div {
+  margin-bottom: 7px;
+}
+.starfish-keyValueItem .keyValueInput > div span {
+  display: block;
+  margin-bottom: 6px;
+}
+.starfish-keyValueItem .keyValueControl {
+  width: 40px;
+  display: flex;
+  flex-direction: column;
+  justify-content: space-around;
+  align-items: center;
+}
+.starfish-keyValueItem .keyValueControl > div {
+  width: 17px;
+  height: 17px;
+  border: 1px solid #eee;
+  border-radius: 50%;
+  background: #fff;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  margin: 5px 0;
+}
+.starfish-keyValueItem .keyValueControl .add {
+  background: #409eff;
+  color: white;
+}
+.starfish-keyValueItem .keyValueControl .remove {
+  background: red;
+  color: white;
+}
+.starfish-keyValueItem .keyValueControl i {
+  font-size: 12px;
+}
+.starfish-formitem-action .label {
+  align-self: flex-start;
+}
+.starfish-formitem-action .el-collapse-item {
+  border: 1px solid #ebeef5;
+  border-bottom-color: #e1e1e1;
+}
+.starfish-formitem-action .el-collapse-item .el-collapse-item__header {
+  background: #ebeef5;
+  height: 20px;
+  line-height: 20px;
+  padding: 5px;
+  font-size: 12px;
+}
+.starfish-formitem-action .el-collapse-item .el-collapse-item__header.is-active {
+  border-bottom-color: transparent;
+}
+.starfish-formitem-action .el-collapse-item .el-collapse-item__content {
+  padding: 5px;
+}
+.starfish-formitem-action .el-collapse-item .el-collapse-item__content .el-button + .el-button {
+  margin-left: 5px;
+}
+.starfish-editor-showrule .label {
+  align-self: flex-start;
+}
+.starfish-formitem-nomiddle .label {
+  align-self: flex-start;
+}
+.starfish-grid_box {
+  padding: 5px;
+}
+.starfish-grid_box .grid-col {
+  min-height: 60px;
+}
+.starfish-grid_box .draggable-box {
+  height: 100%;
+  background: white;
+  border: 1px #ccc dashed;
+  box-sizing: border-box;
+}
+.starfish-table_box .table_layout {
+  width: 100%;
+}
+.starfish-table_box .table_layout.table_layout_border {
+  border: 1px solid #ccc;
+}
+.starfish-table_box .table_layout td {
+  vertical-align: top;
+}
+.starfish-table_box .table_layout .draggable-box {
+  min-height: 60px;
+  background: white;
+  border: 1px #ccc dashed;
+  box-sizing: border-box;
+  min-width: 50px;
+  height: 100%;
+}
+.starfish-form-divider {
+  top: 6px;
+}
+.starfish-form-divider .control {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-weight: bold;
+}
+.starfish-form-divider .control .divider {
+  flex: 1;
+  height: 2px;
+  background: #000;
+  border-radius: 2px;
+  margin-left: 10px;
+}
+.collapse_box .draggable-box {
+  min-height: 50px;
+  background: white;
+  border: 1px #ccc dashed;
+  box-sizing: border-box;
+  width: 100%;
+}
+.collapse_box :deep(.el-collapse-item__content) {
+  padding-bottom: 5px;
+}
+.collapse_box :deep(.el-collapse-item__content) > * {
+  width: 100%;
+}
+.starfish-tabs_box .draggable-box {
+  min-height: 50px;
+}
+.common-layout {
+  padding: 15px;
+  height: 100%;
+  box-sizing: border-box;
+}
+.common-layout .action-header {
+  height: 40px;
+  padding: 5px;
+  border-bottom: 1px solid #eee;
+  background: #f2f6fc;
+  width: 100%;
+  box-sizing: border-box;
+  display: flex;
+  align-items: center;
+  justify-content: flex-start;
+}
+.common-layout .is-vertical {
+  flex-direction: column;
+}
+.common-layout .event-script-aside {
+  border-right: 1px solid #eee;
+}
+.common-layout .el-main {
+  padding: 0;
+  overflow: hidden;
+}
+.common-layout .coding {
+  display: flex;
+  flex-direction: column;
+  width: 100%;
+}
+.common-layout .action-list {
+  margin: 10px;
+}
+.common-layout .action-list .action {
+  border: 1px solid #dcdfe6;
+  background: #fff;
+  border-radius: 3px;
+  box-sizing: border-box;
+  padding: 10px !important;
+  height: auto;
+  line-height: 1;
+  cursor: default;
+  position: relative;
+  font-size: 14px;
+  white-space: nowrap;
+}
+.common-layout .action-list .action.selectAction {
+  background: #e4e7ed;
+  color: #303133;
+}
+.common-layout .action-list .action .event-script-menu-i {
+  position: absolute;
+  font-size: 12px;
+  left: 5px;
+  top: 13px;
+  width: 45px;
+  text-align: center;
+  color: #67c23a;
+}
+.common-layout .action-list .action .event-script-menu-label {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+  display: inline-block;
+  width: 170px;
+  margin-left: 50px;
+  vertical-align: middle;
+}
+.common-layout .action-list .action .event-script-menu-action {
+  display: inline-block;
+  padding-right: 10px;
+  color: #666;
+  font-weight: 600;
+  vertical-align: middle;
+}
+.common-layout .action-list .action .event-script-menu-action > i {
+  margin-left: 3px;
+}
+.common-layout .action-list .action + .action {
+  margin-top: 6px;
+}
+.common-layout .func_main {
+  padding: 10px;
+}
+.common-layout .event-script-main {
+  padding: 0;
+}
+.common-layout .event-script-main .event-script-main-header {
+  text-align: right;
+  justify-content: flex-end;
+}.loading[data-v-5c6e2e4a] {
+  width: 100%;
+  min-height: 60px;
+  height: 100%;
+}.el-collapse-item {
+  border: 1px solid #ebeef5;
+  border-bottom-color: #e1e1e1;
+}
+.el-collapse-item .el-collapse-item__header {
+  background: #ebeef5;
+  height: 20px;
+  line-height: 20px;
+  padding: 5px;
+  font-size: 12px;
+}
+.el-collapse-item .el-collapse-item__header.is-active {
+  border-bottom-color: transparent;
+}
+.el-collapse-item .el-collapse-item__content {
+  padding: 5px;
+  display: flex;
+  justify-content: space-between;
+}
+.el-collapse-item .el-collapse-item__content .el-button + .el-button {
+  margin-left: 5px;
+}
+.starfish-formitem-rule .label {
+  align-self: flex-start;
+}

package/dist/types/form/src/common/Loading.vue.d.ts

@@ -0,0 +1,3 @@
+import type { DefineComponent, ComponentOptionsMixin, PublicProps, ComponentProvideOptions } from 'vue';
+declare const _default: DefineComponent<{}, {}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+export default _default;

package/dist/types/form/src/env.d.ts

@@ -0,0 +1,15 @@
+/// <reference types="vite/client" />
+
+declare module "*.vue" {
+  import type { DefineComponent } from "vue";
+  // eslint-disable-next-line @typescript-eslint/no-explicit-any, @typescript-eslint/ban-types
+  const component: DefineComponent<{}, {}, any>;
+  export default component;
+}
+
+declare module "@codemirror/lang-javascript";
+
+interface Window {
+  JSONEditor: any;
+  VApp: any;
+}

package/dist/types/form/src/main.d.ts

@@ -0,0 +1,43 @@
+import type { DefineComponent, ExtractPropTypes, PropType, Ref, ComponentOptionsMixin, PublicProps, ComponentProvideOptions, App } from 'vue';
+export declare const Dynamicform: DefineComponent<ExtractPropTypes<{
+    allFormList: {
+        type: PropType<any>;
+        default(): never[];
+    };
+    formResult: {
+        type: ObjectConstructor;
+        default(): {};
+    };
+    globalConfig: {
+        type: ObjectConstructor;
+        default(): {};
+    };
+}>, {
+    rules: any;
+    ruleForm: Ref<any, any>;
+    controlObj: Ref<any, any>;
+    handleControlChange: () => void;
+    reset: () => void;
+    getValidate: () => Promise<unknown>;
+}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<{
+    allFormList: {
+        type: PropType<any>;
+        default(): never[];
+    };
+    formResult: {
+        type: ObjectConstructor;
+        default(): {};
+    };
+    globalConfig: {
+        type: ObjectConstructor;
+        default(): {};
+    };
+}>> & Readonly<{}>, {
+    allFormList: any;
+    formResult: Record<string, any>;
+    globalConfig: Record<string, any>;
+}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+declare const _default: {
+    install: (app: App<any>) => void;
+};
+export default _default;

package/dist/types/form/src/starfish-form.vue.d.ts

@@ -0,0 +1,40 @@
+import type { DefineComponent, ExtractPropTypes, Ref, ComponentOptionsMixin, PublicProps, ComponentProvideOptions, PropType } from 'vue';
+declare const _sfc_main: DefineComponent<ExtractPropTypes<{
+    allFormList: {
+        type: PropType<any>;
+        default(): never[];
+    };
+    formResult: {
+        type: ObjectConstructor;
+        default(): {};
+    };
+    globalConfig: {
+        type: ObjectConstructor;
+        default(): {};
+    };
+}>, {
+    rules: any;
+    ruleForm: Ref<any, any>;
+    controlObj: Ref<any, any>;
+    handleControlChange: () => void;
+    reset: () => void;
+    getValidate: () => Promise<unknown>;
+}, {}, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, string, PublicProps, Readonly<ExtractPropTypes<{
+    allFormList: {
+        type: PropType<any>;
+        default(): never[];
+    };
+    formResult: {
+        type: ObjectConstructor;
+        default(): {};
+    };
+    globalConfig: {
+        type: ObjectConstructor;
+        default(): {};
+    };
+}>> & Readonly<{}>, {
+    allFormList: any;
+    formResult: Record<string, any>;
+    globalConfig: Record<string, any>;
+}, {}, {}, {}, string, ComponentProvideOptions, true, {}, any>;
+export default _sfc_main;

package/dist/types/form/src/utils/customHooks.d.ts

@@ -0,0 +1,2 @@
+declare function useWatch(props: any): void;
+export { useWatch };

package/dist/types/form/src/utils/fieldConfig.d.ts

@@ -0,0 +1,78 @@
+import { AllFormItem } from "../../../editor/src/type";
+export interface fields {
+    /**
+     * 字段名称
+     */
+    fieldName: string;
+    /**
+     * 标签名称
+     */
+    label: string;
+    /**
+     * 提示信息
+     */
+    tip?: string;
+    /**
+     * 占位内容
+     */
+    placeholder?: string;
+    /**
+     * 表单显示规则
+     */
+    showRule: string;
+    /**
+     * 是否必填
+     */
+    required?: boolean;
+    /**
+     * 校验规则
+     */
+    rule: string;
+    /**
+     * 默认内容
+     */
+    default?: string | number | any[];
+    type?: number;
+    size?: string | number;
+    itemConfig?: any;
+    formConfig?: any;
+    trs?: fieldsTrs[];
+    columns?: Columns[];
+    items?: Columns[];
+}
+interface Columns {
+    list: AllFormItem[];
+    span: number;
+}
+export interface fieldsTrs {
+    tds: fieldTds[];
+}
+export interface fieldTds {
+    colspan: number;
+    rowspan: number;
+    list: AllFormItem[];
+}
+export interface FormConfig {
+    ControlType: string;
+    data: fields;
+    layout?: boolean;
+    dynamic?: boolean;
+}
+interface Config {
+    fieldName: string;
+    component: string;
+    label?: string;
+}
+interface FormConfigReturn {
+    data: () => fields;
+    morenConfig: () => fields[];
+}
+/**
+ *
+ * @param componentName
+ * @param config
+ * @param filterField  过滤表单不要的配置
+ * @returns
+ */
+declare function getFormConfig(componentName: string, config?: Config[], filterField?: string[]): FormConfigReturn;
+export { getFormConfig };

package/dist/types/form/src/utils/fieldProps.d.ts

@@ -0,0 +1,43 @@
+import { PropType } from "vue";
+interface FormConfig {
+    [key: string]: any;
+}
+declare const _default: {
+    drag: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    data: {
+        type: PropType<FormConfig>;
+        required: boolean;
+        default(): {};
+    };
+    item: {
+        type: ObjectConstructor;
+        default(): {};
+    };
+    labelalign: {
+        type: StringConstructor;
+        default: string;
+    };
+    labelWidth: {
+        type: NumberConstructor;
+    };
+    suffix: {
+        type: StringConstructor;
+        default: string;
+    };
+    size: {
+        type: StringConstructor;
+        default: string;
+    };
+    styles: {
+        type: StringConstructor;
+        default: string;
+    };
+    csslist: {
+        type: PropType<string[]>;
+        default(): never[];
+    };
+};
+export default _default;

package/dist/types/starfish-form.d.ts

@@ -0,0 +1,3 @@
+export * from './form/src/main'
+import StarfishForm from './form/src/main'
+export default StarfishForm

package/package.json

@@ -0,0 +1,42 @@
+{
+  "name": "starfish-form-custom",
+  "version": "1.0.0",
+  "main": "dist/starfish-form.mjs",
+  "style": "dist/style.css",
+  "module": "dist/starfish-form.mjs",
+  "types": "dist/types/starfish-form.d.ts",
+  "exports": {
+    ".": {
+      "import": "./dist/starfish-form.mjs"
+    },
+    "./dist/style.css": {
+      "import": "./dist/style.css"
+    },
+    "./*": "./*"
+  },
+  "scripts": {
+    "build": "vite build",
+    "prepublish": "npm version && npm run build"
+  },
+  "dependencies": {
+    "element-plus": "^2.2.12",
+    "jsoneditor": "^9.9.0",
+    "vue": "^3.2.25",
+    "@element-plus/icons-vue": "^2.0.8",
+    "wangeditor": "^4.7.15",
+    "vue-codemirror": "6.1.1",
+    "codemirror": "6.0.1",
+    "@codemirror/lang-javascript": "6.0.2"
+  },
+  "devDependencies": {
+    "@vitejs/plugin-vue": "^2.3.3",
+    "sass": "^1.35.1",
+    "typescript": "^4.5.4",
+    "rollup-plugin-visualizer": "^5.8.3",
+    "unplugin-auto-import": "^0.17.5",
+    "unplugin-vue-components": "^0.26.0",
+    "vite": "^4.5.2",
+    "vite-plugin-dts": "^1.2.0",
+    "vue-tsc": "^0.34.7"
+  }
+}