sun-form-v3 1.0.71 → 1.0.72

package/src/components/widgetCommonComps/commonJsonInput/index.vue

@@ -1,59 +0,0 @@
-<template>
-    <!-- <draggable :key="key" class="w-full" handle=".move_handle" :list="jsonValue" item-key="label"
-        :group="{ name: 'no', put: false, pull: false }">
-        <template #item="{ element, index }"> -->
-    <div class=" w-full flex items-center my-2 box-border" v-for="(element, index) in jsonValue" :key="index">
-        <el-input v-model="element.label" placeholder="请输入"></el-input>
-        <common-type-input v-model="element.value" class="ml-1 w-[100%]"></common-type-input>
-        <el-icon class="cursor-pointer ml-1" @click="deleteItem(index)">
-            <Delete />
-        </el-icon>
-    </div>
-    <!-- </template>
-    </draggable> -->
-    <div class="flex items-center justify-start">
-        <el-button icon="CirclePlus" type="primary" link @click="addItem">添加</el-button>
-        <el-button icon="CircleClose" v-if="jsonValue&&jsonValue.length" type="primary" link @click="clearItem">清空</el-button>
-    </div>
-</template>
-
-<script setup>
-import draggable from "vuedraggable/src/vuedraggable";
-import { ref, computed, watch } from 'vue';
-
-defineOptions({ name: "commonJsonInput" })
-
-const props = defineProps({
-    modelValue: [Array],
-})
-const emit = defineEmits(['update:modelValue'])
-const jsonValue = computed({
-    get() {
-        return props.modelValue || []
-    },
-    set(value) {
-        emit('update:modelValue', value)
-    }
-})
-const deleteItem = (index) => {
-    jsonValue.value.splice(index, 1)
-}
-const addItem = () => {
-    jsonValue.value.push({
-        label: null,
-        value: null
-    })
-}
-const clearItem = () => {
-    jsonValue.value = []
-}
-// watch(() => props.modelValue, () => {
-//     if (props.modelValue === null || props.modelValue === undefined) {
-//         type.value = 'string';
-//     } else {
-//         type.value = typeof props.modelValue;
-//     }
-// }, { immediate: true });
-</script>
-
-<style scoped lang="scss"></style>

package/src/components/widgetCommonComps/commonLabelContainer/index.vue

@@ -1,39 +0,0 @@
-<template>
-    <div class="item">
-        <div class="lab">
-            {{ props.label }}
-        </div>
-        <div class="con">
-            <slot></slot>
-        </div>
-    </div>
-</template>
-
-<script setup>
-import { ref, reactive } from 'vue';
-defineOptions({ name: "commonLabelContainer" })
-let props = defineProps({
-    label: {
-        type: String,
-        default: ""
-    }
-})
-</script>
-
-<style scoped lang="scss">
-.item {
-    @apply flex items-center mb-2;
-
-    .lab {
-        @apply flex-none w-[90px] text-sm;
-    }
-
-    .con {
-        @apply flex-1;
-    }
-
-    // &:last-child {
-    //     @apply mb-0;
-    // }
-}
-</style>

package/src/components/widgetCommonComps/commonSidetree/index.vue

@@ -1,61 +0,0 @@
-<template>
-    <div class="h-full">
-        <vxe-table ref="table" :show-header="false" show-overflow border="outer"
-            :row-config="{ isHover: false, useKey: true }" height="auto" :column-config="{ resizable: true }"
-            :tree-config="{ transform: false, childrenField: 'widgetList', showLine: true, expandAll: true }" :data="arr">
-            <vxe-column field="displayName" title="组件大纲" tree-node>
-                <template #default="{ row }">
-                    <div @click="chooseHandle(row)" class="cursor-pointer  pl-2 box-border hover:bg-gray-50"
-                        :class="{ 'bg-blue-50': row.id == chosenId }">
-                        <span class="text-sm">
-                            {{ row.displayName }}
-                        </span>
-                        <span class="text-xs text-gray-400">
-                            _{{ row.id }}
-                        </span>
-                    </div>
-                </template>
-            </vxe-column>
-        </vxe-table>
-    </div>
-</template>
-
-<script setup>
-import { ref, reactive, watch, nextTick } from 'vue';
-defineOptions({ name: "commonSidetree" })
-let props = defineProps({
-    designer: {
-        type: Object,
-        default: {}
-    }, canAddApi: {
-        type: Boolean,
-        default: false
-    }
-
-})
-const emit = defineEmits(['addApi'])
-let designer = props.designer
-let table = ref()
-let arr = ref([])
-let chosenId = ref(null)
-const chooseHandle = (row) => {
-    if (props.canAddApi) {
-        emit('addApi', row);
-        return
-    }
-    designer.setChosenId(row.id)
-}
-watch(() => designer.getWidgetConfig(), (val) => {
-    chosenId.value = designer.getChosenId()
-    arr.value = []
-    arr.value.push(designer.$utils.clone(val, true))
-    nextTick(() => {
-        table.value.setAllTreeExpand(true)
-    })
-}, {
-    deep: true,
-    immediate: true
-})
-</script>
-
-<style scoped lang="scss"></style>

package/src/components/widgetCommonComps/commonTypeInput/index.vue

@@ -1,75 +0,0 @@
-<template>
-    <el-input v-model="inputValue" placeholder="请输入">
-        <template #append>
-            <el-select v-model="type" class="w-[75px]" @change="handleTypeChange">
-                <el-option label="字符" value="string" />
-                <el-option label="布尔" value="boolean" />
-                <el-option label="数字" value="number" />
-            </el-select>
-        </template>
-    </el-input>
-</template>
-
-<script setup>
-import { ref, computed, watch } from 'vue';
-
-defineOptions({ name: "commonTypeInput" })
-
-const props = defineProps({
-    modelValue: [String, Number, Boolean, Object, null],
-    default: null
-})
-
-const emit = defineEmits(['update:modelValue'])
-
-const type = ref("string")
-const inputValue = computed({
-    get() {
-        let inType = typeof props.modelValue
-        switch (inType) {
-            case 'number':
-                return props.modelValue.toString()
-            case 'boolean':
-                return props.modelValue ? 'true' : 'false'
-            default: // string
-                return props.modelValue
-        }
-    },
-    set(value) {
-        let emitValue = null
-        switch (type.value) {
-            case 'number':
-                emitValue = Number(value) || null
-                break
-            case 'boolean':
-                if (/^t(rue)?$/i.test(value)) {
-                    emitValue = true;
-                }
-                else if (/^f(alse)?$/i.test(value)) {
-                    emitValue = false;
-                }
-                else {
-                    emitValue = null;
-                }
-                break
-            default: // string
-                emitValue = value || null
-        }
-        emit('update:modelValue', emitValue)
-    }
-})
-
-const handleTypeChange = (newType) => {
-    inputValue.value = ""
-}
-
-watch(() => props.modelValue, () => {
-    if (props.modelValue === null || props.modelValue === undefined) {
-        type.value = 'string';
-    } else {
-        type.value = typeof props.modelValue;
-    }
-}, { immediate: true });
-</script>
-
-<style scoped lang="scss"></style>

package/src/components/widgetCommonComps/commonWidgetLabelContainer/index.vue

@@ -1,55 +0,0 @@
-<template>
-    <div class="item" :class="{ flex: props.labelPosition == 'left', 'hide': props.hide }">
-        <div class="lab" :class="{ required: props.required }" :style='{
-            width: props.labelWidth,
-            justifyContent: props.labelAlign == "left" ? "flex-start" : "flex-end"
-        }'>
-            {{ props.label }}
-        </div>
-        <div class="con">
-            <slot></slot>
-        </div>
-    </div>
-</template>
-
-<script setup>
-import { ref, reactive, computed } from 'vue';
-defineOptions({ name: "commonWidgetLabelContainer" })
-let p = defineProps({
-    props: {
-        type: Object,
-        default: {
-            label: "",
-            labelWidth: "90px",
-            labelAlign: "left",
-            labelPosition: "left",
-            required: false,
-            hide: false,
-            width: 24
-        }
-    },
-})
-let props = computed(() => p.props)
-</script>
-
-<style scoped lang="scss">
-.item {
-    @apply items-center flex-wrap relative p-2;
-
-    .lab {
-        @apply flex-none text-sm flex box-border pr-2;
-    }
-
-    .con {
-        @apply flex-1;
-    }
-
-    .required {
-        @apply before:content-['*'] before:text-red-500 before:mr-1;
-    }
-}
-
-.hide {
-    @apply after:content-['<隐藏状态>'] after:w-full after:h-full after:absolute after:top-0 after:left-0 after:flex after:items-center after:justify-center after:bg-gray-400 after:bg-opacity-10 after:text-sm after:text-gray-400;
-}
-</style>

package/src/components/widgetCommonComps/index copy.js

@@ -1,17 +0,0 @@
-const modules =
-    import.meta.glob('./**/index.vue', {
-        eager: true
-    });
-const components = Object.fromEntries(
-    Object.entries(modules).map(([path, module]) => {
-        const componentName = module.default.name
-        return [componentName, module.default];
-    })
-);
-export default{
-    install(app) {
-        Object.keys(components).forEach(key => {
-            app.component(key, components[key]);
-        });
-    }
-}

package/src/components/widgetCommonComps/index.js

@@ -1,17 +0,0 @@
-const modules =
-    import.meta.glob('./**/index.vue', {
-        eager: true
-    });
-const components = Object.fromEntries(
-    Object.entries(modules).map(([path, module]) => {
-        const componentName = module.default.name
-        return [componentName, module.default];
-    })
-);
-export default{
-    install(app) {
-        Object.keys(components).forEach(key => {
-            app.component(key, components[key]);
-        });
-    }
-}

package/src/components/widgetConfigComps/config-input/index.vue

@@ -1,60 +0,0 @@
-<template>
-    <common-label-container label="组件尺寸">
-        <el-select v-model="props.widget.props.size">
-            <el-option label="大尺寸" value="large"></el-option>
-            <el-option label="默认" value="default"></el-option>
-            <el-option label="小尺寸" value="small"></el-option>
-        </el-select>
-    </common-label-container>
-    <common-label-container label="组件类型">
-        <el-select v-model="props.widget.props.type">
-            <el-option label="文字" value="text"></el-option>
-            <!-- <el-option label="数字" value="number"></el-option> -->
-            <el-option label="密码" value="password"></el-option>
-        </el-select>
-    </common-label-container>
-    <common-label-container label="占位文字">
-        <el-input v-model="props.widget.props.placeholder" placeholder="填写占位文字">
-        </el-input>
-    </common-label-container>
-    <common-label-container label="前置内容文字">
-        <el-input v-model="props.widget.props.prependText" placeholder="填写末尾按钮文字">
-        </el-input>
-    </common-label-container>
-    <common-label-container label="末尾按钮文字">
-        <el-input v-model="props.widget.props.appendText" placeholder="填写末尾按钮文字">
-        </el-input>
-    </common-label-container>
-    <common-label-container label="最大输入长度">
-        <el-input-number class="w-full" placeholder="填写最大输入长度" v-model="props.widget.props.maxlength" :min="0" controls-position="right" />
-    </common-label-container>
-    <common-label-container label="是否去空格">
-        <el-switch v-model="props.widget.props.isTrim" />
-    </common-label-container>
-    <common-label-container label="是否必填">
-        <el-switch v-model="props.widget.props.required" />
-    </common-label-container>
-    <common-label-container label="是否只读">
-        <el-switch v-model="props.widget.props.readonly" />
-    </common-label-container>
-    <common-label-container label="是否禁用">
-        <el-switch v-model="props.widget.props.disabled" />
-    </common-label-container>
-</template>
-
-<script setup>
-import { ref, reactive } from 'vue';
-defineOptions({ name: "config-input" })
-let props = defineProps({
-    designer: {
-        type: Object,
-        default: {}
-    },
-    widget: {
-        type: Object,
-        default: {}
-    }
-})
-</script>
-
-<style scoped lang="scss"></style>

package/src/components/widgetConfigComps/index copy.js

@@ -1,13 +0,0 @@
-const modules =
-    import.meta.glob('./**/index.vue', {
-        eager: true
-    });
-const components = Object.fromEntries(
-    Object.entries(modules).map(([path, module]) => {
-        const componentName = module.default.name
-        return [componentName, module.default];
-    })
-);
-export default {
-    ...components,
-};

package/src/components/widgetConfigComps/index.js

@@ -1,17 +0,0 @@
-const modules =
-    import.meta.glob('./**/index.vue', {
-        eager: true
-    });
-const components = Object.fromEntries(
-    Object.entries(modules).map(([path, module]) => {
-        const componentName = module.default.name
-        return [componentName, module.default];
-    })
-);
-export default{
-    install(app) {
-        Object.keys(components).forEach(key => {
-            app.component(key, components[key]);
-        });
-    }
-}

package/src/components/widgetShowComps/index.js

@@ -1,29 +0,0 @@
-const modules =
-    import.meta.glob('./**/index.vue', {
-        eager: true
-    });
-const components = Object.fromEntries(
-    Object.entries(modules).map(([path, module]) => {
-        const componentName = module.default.name
-        return [componentName, module.default];
-    })
-);
-export default{
-    install(app) {
-        Object.keys(components).forEach(key => {
-            app.component(key, components[key]);
-        });
-    }
-}
-// import widgetForm from './widget-form/index.vue'
-// import widgetHomepage from './widget-homepage/index.vue'
-// import widgetInput from './widget-input/index.vue'
-// import widgetSelect from './widget-select/index.vue'
-
-
-// export default {
-//     'widget-form': widgetForm,
-//     'widget-homepage': widgetHomepage,
-//     'widget-input': widgetInput,
-//     'widget-select': widgetSelect,
-// };

package/src/components/widgetShowComps/widget-form/index.vue

@@ -1,43 +0,0 @@
-<template>
-    <draggable ghostClass="ghost" handle=".handle" :list="widgetList" class="min-h-14"
-        :group="{ name: 'dragGroup', put: true }" item-key="id">
-        <template #item="{ element }">
-            <div>
-                <commonContainer :designer="designer" :widget="element" :parentWidget="widget">
-                    <component :ref="element.id" :is="'widget-'+element.type" :widget="element" :designer="designer">
-                    </component>
-                </commonContainer>
-            </div>
-        </template>
-    </draggable>
-</template>
-
-<script setup>
-import { ref, reactive } from 'vue';
-import draggable from "vuedraggable/src/vuedraggable";
-let props = defineProps({
-    designer: {
-        type: Object,
-        default: () => {
-            return {}
-        }
-    },
-    widget: {
-        type: Object,
-        default: () => {
-            return {}
-        }
-    }
-})
-let designer = reactive(props.designer)
-let widget = reactive(props.widget)
-let widgetList = props.widget.widgetList
-
-defineOptions({ name: "widget-form" })
-</script>
-
-<style scoped lang="scss">
-.ghost {
-    @apply max-h-0 overflow-hidden border border-blue-700;
-}
-</style>

package/src/components/widgetShowComps/widget-homepage/index.vue

@@ -1,41 +0,0 @@
-<template>
-    <draggable ghostClass="ghost" handle=".handle" :list="widgetList" class="min-h-full flex  flex-wrap content-start"
-        :group="{ name: 'dragGroup', put: true }" item-key="id">
-        <template #item="{ element }">
-            <commonContainer :designer="designer" :widget="element" :parentWidget="widget">
-                <component :ref="element.id" :is="'widget-'+element.type" :widget="element" :designer="designer">
-                </component>
-            </commonContainer>
-        </template>
-    </draggable>
-</template>
-
-<script setup>
-import { ref, reactive, computed } from 'vue';
-import draggable from "vuedraggable/src/vuedraggable";
-let props = defineProps({
-    designer: {
-        type: Object,
-        default: () => {
-            return {}
-        }
-    },
-    widget: {
-        type: Object,
-        default: () => {
-            return {}
-        }
-    }
-})
-let designer = props.designer
-let widget = computed(() => props.widget)
-let widgetList = computed(() => designer.widgetConfig.widgetList)
-
-defineOptions({ name: "widget-homepage" })
-</script>
-
-<style scoped lang="scss">
-.ghost {
-    @apply max-h-0 overflow-hidden border border-blue-700;
-}
-</style>

package/src/components/widgetShowComps/widget-input/index.vue

@@ -1,85 +0,0 @@
-<template>
-    <common-widget-label-container :props="p">
-        <el-input @change="changeHandle" @input="inputHandle" @focus="focusHandle" v-model="p.value" :type="p.type"
-            :size="p.size" @blur="blurHandle" :placeholder="p.placeholder" :maxlength="p.maxlength">
-            <template v-if="p.prependText" #prepend>{{ p.prependText }}</template>
-            <template v-if="p.appendText" #append>
-                <el-button @click="onHandle">{{ p.appendText }}</el-button>
-            </template>
-        </el-input>
-    </common-widget-label-container>
-</template>
-
-<script setup>
-import { ref, reactive, computed, getCurrentInstance, onMounted } from 'vue';
-
-let props = defineProps({
-    designer: {
-        type: Object,
-        default: () => {
-            return {}
-        }
-    },
-    widget: {
-        type: Object,
-        default: () => {
-            return {}
-        }
-    }
-})
-props.designer.setVueIncetance(props.widget.id, getCurrentInstance())
-
-let p = computed(() => props.widget.props)
-
-const changeHandle = (value) => {
-    props.designer.eventHandle({
-        eventType: "onChange",
-        value: value,
-        widget: props.widget,
-    })
-}
-const inputHandle = (value) => {
-    props.designer.eventHandle({
-        eventType: "onInput",
-        value: value,
-        widget: props.widget,
-    })
-}
-const focusHandle = () => {
-    props.designer.eventHandle({
-        eventType: "onFocus",
-        value: props.widget.props.value,
-        widget: props.widget,
-    })
-}
-const blurHandle = (value) => {
-    props.designer.eventHandle({
-        eventType: "onBlur",
-        value: props.widget.props.value,
-        widget: props.widget,
-    })
-}
-const onHandle = () => {
-    props.designer.eventHandle({
-        eventType: "onHandle",
-        value: props.widget.props.value,
-        widget: props.widget,
-    })
-}
-props.designer.eventHandle({
-    eventType: "onCreated",
-    widget: props.widget,
-})
-onMounted(() => {
-    props.designer.eventHandle({
-        eventType: "onMounted",
-        widget: props.widget,
-    })
-})
-defineExpose({
-    changeHandle,
-})
-defineOptions({ name: "widget-input" })
-</script>
-
-<style scoped lang="scss"></style>

package/src/components/widgetShowComps/widget-select/index.vue

@@ -1,31 +0,0 @@
-<template>
-    <div class="widget-select">
-        <el-select v-model="widget.props.value" placeholder="请选择">
-            <el-option v-for="item in widget.props.list" :key="item.value" :label="item.label || ''"
-                :value="item.value || ''">
-            </el-option>
-        </el-select>
-    </div>
-</template>
-
-<script setup>
-import { ref, reactive } from 'vue';
-let props = defineProps({
-    designer: {
-        type: Object,
-        default: () => {
-            return {}
-        }
-    },
-    widget: {
-        type: Object,
-        default: () => {
-            return {}
-        }
-    }
-})
-let designer = props.designer
-defineOptions({ name: "widget-select" })
-</script>
-
-<style scoped lang="scss"></style>