@kengic/vue 0.30.1-beta.96 → 0.31.0

package/component/KgForm.Item/KgForm.Item.Switch.tsx

@@ -1,49 +0,0 @@
-import { Switch } from 'ant-design-vue';
-import { defineComponent } from 'vue';
-import { IKgVarConfigControlControlProperties, KG_FORM_CONTEXT } from '../../model';
-import { emit, IKgForm$EventListenerParameter$onChange } from '../KgForm/KgForm.event';
-import { useKgVar } from '../KgVar';
-import { getProps } from './KgForm.Item.model';
-import { useKgFormItem } from './KgForm.Item.service';
-
-// 表单控件:开关
-export default defineComponent({
-    name: 'KgFormItemSwitch',
-    props: getProps(),
-    emits: ['update:value', 'kgSubmit'],
-    setup(props, { attrs, emit: _emit }) {
-        const kgVar = useKgVar();
-
-        const { controlProperties$$ } = useKgFormItem<IKgVarConfigControlControlProperties['SWITCH']>();
-
-        function onUpdateValue(value: boolean | string | number) {
-            _emit('update:value', value);
-
-            emit<IKgForm$EventListenerParameter$onChange>({
-                id: kgVar.fid,
-                event: 'onChange',
-                parameter: {
-                    context: props.kgContext ?? KG_FORM_CONTEXT.SUBMIT,
-                    isCopying: kgVar.isCopying.value,
-                    isCreating: kgVar.isCreating.value,
-                    isDeleting: kgVar.isDeleting.value,
-                    isUpdating: kgVar.isUpdating.value,
-                    value: value,
-                    varName: props.kgVarName ?? '',
-                    variableName: props.kgVarName ?? '',
-                },
-            });
-        }
-
-        return () => (
-            <Switch
-                checked={props.value as any}
-                onUpdate:checked={onUpdateValue}
-                id={attrs.id as any}
-                checkedValue={controlProperties$$.value?.dataType === 'BOOLEAN' ? true : 1}
-                unCheckedValue={controlProperties$$.value?.dataType === 'BOOLEAN' ? false : 0}
-                disabled={props.kgDisabled}
-            />
-        );
-    },
-});

package/component/KgForm.Item/KgForm.Item.TextArea.tsx

@@ -1,99 +0,0 @@
-import { Textarea } from 'ant-design-vue';
-import { isNil } from 'lodash-es';
-import { computed, defineComponent } from 'vue';
-import { IKgVarConfigControlControlProperties, KG_FORM_CONTEXT } from '../../model';
-import { emit, IKgForm$EventListenerParameter$onBlur, IKgForm$EventListenerParameter$onChange } from '../KgForm/KgForm.event';
-import { useKgVar } from '../KgVar';
-import { getProps } from './KgForm.Item.model';
-import { useKgFormItem } from './KgForm.Item.service';
-
-// 表单控件:多行文本
-export default defineComponent({
-    name: 'KgFormItemTextArea',
-    props: getProps(),
-    emits: ['update:value', 'kgSubmit'],
-    setup(props, { attrs, emit: _emit }) {
-        const kgVar = useKgVar();
-
-        const { controlProperties$$ } = useKgFormItem<IKgVarConfigControlControlProperties['TEXT_AREA']>();
-
-        //region DATA
-        //----------------------------------------------------------------------------------------------------
-        const getValue = computed<string>(() => {
-            if (!isNil(props.value)) {
-                return String(props.value);
-            }
-
-            return '';
-        });
-
-        const getRows = computed<number>(() => {
-            let _rows = 5;
-
-            const propsRows = Number.parseInt(String(controlProperties$$.value?.rows));
-            if (!Number.isNaN(propsRows) && propsRows > 0) {
-                _rows = propsRows;
-            }
-
-            return _rows;
-        });
-        //endregion
-
-        //region FUNCTION
-        //----------------------------------------------------------------------------------------------------
-        function onUpdateValue(value: string) {
-            // 1. 去除首尾空格,
-            // 2. 如果值是空字符串, 则将值设为 null,
-            const _value = String(value).trim() || null;
-
-            _emit('update:value', _value);
-            emit<IKgForm$EventListenerParameter$onChange>({
-                id: kgVar.fid,
-                event: 'onChange',
-                parameter: {
-                    context: props.kgContext ?? KG_FORM_CONTEXT.SUBMIT,
-                    isCopying: kgVar.isCopying.value,
-                    isCreating: kgVar.isCreating.value,
-                    isDeleting: kgVar.isDeleting.value,
-                    isUpdating: kgVar.isUpdating.value,
-                    value: _value,
-                    varName: props.kgVarName ?? '',
-                    variableName: props.kgVarName ?? '',
-                },
-            });
-        }
-
-        function onSubmit() {
-            // 由于文本框通常需要使用 ENTER 键换行, 因此对于文本框, ENTER 不会触发表单提交,
-        }
-
-        function onBlur() {
-            emit<IKgForm$EventListenerParameter$onBlur>({
-                id: kgVar.fid,
-                event: 'onBlur',
-                parameter: {
-                    context: props.kgContext ?? KG_FORM_CONTEXT.SUBMIT,
-                    value: props.value,
-                    values: [props.value],
-                    varName: props.kgVarName ?? '',
-                },
-            });
-        }
-        //endregion
-
-        return () => (
-            <Textarea
-                value={getValue.value}
-                onUpdate:value={onUpdateValue}
-                id={attrs.id as any}
-                placeholder={props.kgPlaceholder}
-                disabled={props.kgDisabled}
-                rows={getRows.value}
-                allowClear={true}
-                onPressEnter={onSubmit}
-                onBlur={onBlur}
-                class={'kg-form-item--textarea'}
-            />
-        );
-    },
-});

package/component/KgForm.Item/KgForm.Item.less

@@ -1,476 +0,0 @@
-.ant-form .kg-form-item .ant-form-item .ant-form-item-label > label {
-    width: 100%;
-}
-
-.ant-form .kg-form-item .ant-form-item .ant-form-item-label > label > div {
-    display: flex;
-    flex-direction: column;
-}
-
-.ant-form .kg-form-item .ant-form-item .ant-form-item-label > label > div > div:first-child {
-    display: flex;
-    align-items: center;
-}
-
-/* 标签文本 */
-.ant-form .kg-form-item .ant-form-item .ant-form-item-label > label > div > div:first-child > label.title {
-    white-space: nowrap;
-    overflow: hidden;
-    text-overflow: ellipsis;
-}
-
-/* 提示文本图标 */
-.ant-form .kg-form-item .ant-form-item .ant-form-item-label > label > div > div:first-child > .iconify {
-    margin-left: 6px;
-    color: rgba(0, 0, 0, 0.5);
-    min-width: 14px;
-}
-
-/* 标签文本底部提示文本 */
-.ant-form .kg-form-item .ant-form-item .ant-form-item-label > label > div > div.tip {
-    margin: 2px 0 4px;
-    color: rgba(0, 0, 0, 0.6);
-    font-size: 95%;
-}
-
-.ant-form .kg-form-item .ant-form-item .ant-form-item-control-input-content {
-    display: flex;
-    align-items: stretch;
-}
-
-.ant-form .kg-form-item .ant-form-item .ant-form-item-control-input-content > .ant-input-affix-wrapper {
-    padding: 4px 8px;
-    border-radius: 4px;
-}
-
-.ant-form .kg-form-item .ant-form-item .ant-form-item-control-input-content > .ant-input-affix-wrapper > .ant-input-suffix {
-    display: none;
-    margin-left: 4px !important;
-    margin-right: -4px !important;
-}
-
-.ant-form .kg-form-item .ant-form-item .ant-form-item-control-input-content > .ant-input-affix-wrapper.ant-input-affix-wrapper-input-with-clear-btn > .ant-input-suffix {
-    display: flex;
-}
-
-.ant-form .kg-form-item .ant-form-item .ant-form-item-control-input-content > .ant-input-affix-wrapper.ant-input-affix-wrapper-input-with-clear-btn.ant-input-affix-wrapper-disabled > .ant-input-suffix {
-    display: none;
-}
-
-/* region 高级查询序符号下拉列表 */
-
-.ant-form .kg-form-item .ant-form-item .ant-form-item-control-input-content .kg-form-item--dynamic-operator-select {
-    flex: 0;
-    min-width: 60px;
-    margin-right: 1px;
-}
-
-.ant-form .kg-form-item .ant-form-item .ant-form-item-control-input-content .kg-form-item--dynamic-operator-select.kg-form-item--dynamic-operator-select--code .ant-select-selection-item > .desc {
-    display: none;
-}
-
-.ant-form .kg-form-item .ant-form-item .ant-form-item-control-input-content .kg-form-item--dynamic-operator-select.kg-form-item--dynamic-operator-select--desc {
-    min-width: 92px;
-}
-
-.ant-form .kg-form-item .ant-form-item .ant-form-item-control-input-content .kg-form-item--dynamic-operator-select.kg-form-item--dynamic-operator-select--desc .ant-select-selection-item > .code {
-    display: none;
-}
-
-.ant-form .kg-form-item .ant-form-item .ant-form-item-control-input-content .kg-form-item--dynamic-operator-select.kg-form-item--dynamic-operator-select--both {
-    min-width: 122px;
-}
-
-.ant-form .kg-form-item .ant-form-item .ant-form-item-control-input-content .kg-form-item--dynamic-operator-select.kg-form-item--dynamic-operator-select--both .ant-select-selection-item > .code {
-    width: 30px;
-    display: inline-flex;
-    align-items: center;
-    justify-content: flex-start;
-}
-
-.ant-form .kg-form-item .ant-form-item .ant-form-item-control-input-content .kg-form-item--dynamic-operator-select .ant-select-selector {
-    padding: 0 8px;
-}
-
-.ant-form .kg-form-item .ant-form-item .ant-form-item-control-input-content .kg-form-item--dynamic-operator-select .ant-select-selector .ant-select-selection-item,
-.ant-form .kg-form-item .ant-form-item .ant-form-item-control-input-content .kg-form-item--dynamic-operator-select .ant-select-selector .ant-select-selection-placeholder {
-    padding-right: 11px;
-}
-
-.ant-form .kg-form-item .ant-form-item .ant-form-item-control-input-content .kg-form-item--dynamic-operator-select .ant-select-arrow {
-    right: 8px;
-}
-
-.kg-form-item--dynamic-operator-select--dropdown {
-    min-width: 200px !important;
-}
-
-.kg-form-item--dynamic-operator-select--dropdown .ant-select-item-option-content > .code {
-    width: 30px;
-    display: inline-flex;
-    align-items: center;
-    justify-content: flex-start;
-}
-
-/* endregion */
-
-.ant-form .kg-form-item .ant-form-item-has-error .ant-input-affix-wrapper.ant-input-affix-wrapper-disabled {
-    border-color: #ed6f6f !important;
-}
-
-.ant-form .kg-form-item .ant-form-item-has-error .kg-form-item--checkbox-group {
-    border-color: #ed6f6f;
-}
-
-.kg-form-item--no-label-container > .ant-form-item-label {
-    display: none;
-}
-
-/* region 隐藏 */
-
-.ant-form .kg-form-item.kg-form-item--invisible {
-    display: none;
-}
-
-/* endregion */
-
-/* region 查找 */
-
-.ant-form .kg-form-item.kg-form-item-lookup .ant-form-item-control-input-content > .ant-select:not(.kg-form-item--dynamic-operator-select) .ant-select-selector {
-    border-radius: 3px 0 0 3px;
-}
-
-.ant-form .kg-form-item.kg-form-item-lookup .ant-form-item-control-input-content > .ant-select:not(.kg-form-item--dynamic-operator-select):hover .ant-select-selector,
-.ant-form .kg-form-item.kg-form-item-lookup .ant-form-item-control-input-content > .ant-select:not(.kg-form-item--dynamic-operator-select):focus .ant-select-selector {
-    z-index: 1;
-}
-
-.ant-form .kg-form-item.kg-form-item-lookup .ant-form-item-control-input-content > .ant-input {
-    border-radius: 3px 0 0 3px;
-}
-
-.ant-form .kg-form-item.kg-form-item-lookup .ant-form-item-control-input-content > .ant-input:hover,
-.ant-form .kg-form-item.kg-form-item-lookup .ant-form-item-control-input-content > .ant-input:focus {
-    z-index: 1;
-}
-
-.ant-form .kg-form-item.kg-form-item-lookup .ant-form-item-control-input-content > .ant-input-affix-wrapper {
-    border-radius: 3px 0 0 3px;
-}
-
-/* endregion */
-
-/* region 垂直布局 */
-
-.ant-form.ant-form-vertical .kg-form-item .ant-form-item {
-    margin-bottom: 12px !important;
-}
-
-.ant-form.ant-form-vertical .kg-form-item .ant-form-item .ant-form-item-label > label > div {
-    max-width: calc(100% - 10px);
-}
-
-/* endregion */
-
-/* region 水平布局 */
-
-.ant-form.ant-form-horizontal .kg-form-item .ant-form-item {
-    margin-bottom: 6px !important;
-}
-
-.ant-form.ant-form-horizontal .kg-form-item .ant-form-item .ant-form-item-label > label {
-    justify-content: flex-end;
-}
-
-.ant-form.ant-form-horizontal .kg-form-item .ant-form-item .ant-form-item-label > label::after {
-    margin: 0 4px 0 4px;
-}
-
-.ant-form.ant-form-horizontal .kg-form-item .ant-form-item .ant-form-item-label > label > div {
-    max-width: 100%;
-    overflow: hidden;
-}
-
-.ant-form.ant-form-horizontal .kg-form-item .ant-form-item .ant-form-item-label > label > div > div:first-child {
-    justify-content: flex-end;
-}
-
-.ant-form.ant-form-horizontal .kg-form-item .ant-form-item .ant-form-item-label > label > div > div.tip {
-    display: none !important;
-}
-
-/* region 固定宽度 */
-
-.ant-form.ant-form-horizontal .kg-form-item.kg-form-item--col-fixed .ant-form-item {
-    display: flex;
-    align-items: center;
-    justify-content: flex-start;
-}
-
-/* endregion */
-
-/* endregion */
-
-/* region 表单控件--文本 */
-.kg-form-item--input .ant-input {
-    color: rgba(0, 0, 0, 0.65) !important;
-}
-
-/* endregion */
-
-/* region 表单控件--数字 */
-.kg-form-item--input-number {
-    width: 100% !important;
-    color: rgba(0, 0, 0, 0.65) !important;
-}
-
-.kg-form-item--input-number .ant-input-number-input {
-    padding: 0px 8px !important;
-}
-
-/* endregion */
-
-/* region 表单控件--密码 */
-.kg-form-item--input-password .ant-input-suffix .ant-input-password-icon {
-    margin-left: 4px;
-    margin-right: 4px;
-}
-
-/* endregion */
-
-/* region 表单控件--多行文本 */
-.kg-form-item--textarea.ant-input {
-    padding: 4px 8px;
-    border-radius: 3px;
-    color: rgba(0, 0, 0, 0.65) !important;
-    resize: none;
-}
-
-/* endregion */
-
-/* region 表单控件--链接 */
-.kg-form-item--link {
-    margin-bottom: 18px !important;
-    display: flex !important;
-    align-items: center !important;
-    justify-content: space-between !important;
-    height: auto !important;
-    padding: 6px 10px !important;
-}
-
-.kg-form-item--link > span:nth-child(1) {
-    flex: 1;
-    min-width: 0;
-    display: block;
-    word-break: break-all;
-    text-wrap: initial;
-    text-align: left;
-}
-
-.kg-form-item--link > span:nth-child(2) {
-    margin-left: 12px;
-}
-
-/* endregion */
-
-/* region 表单控件--下拉列表*/
-
-.kg-form-item--select {
-    width: 100%;
-}
-
-.kg-form-item--select .ant-select-selector {
-    padding: 0 8px !important;
-}
-
-.kg-form-item--select .ant-select-arrow,
-.kg-form-item--select .ant-select-clear {
-    right: 8px !important;
-    z-index: 1 !important;
-}
-
-/* region 多选*/
-
-.kg-form-item--select.ant-select-multiple .ant-select-selector {
-    padding: 1px 3px !important;
-}
-
-/* endregion */
-
-.ant-form .kg-form-item .ant-form-item .ant-form-item-control-input-content .kg-form-item--select {
-    flex: 1;
-    min-width: 0;
-}
-
-.kg-table--body-cell .kg-form-item--select {
-    text-align: left;
-}
-
-.kg-table.kg-table--submitting tr.ant-table-row-selected > td.submitting .kg-table--body-cell.kg-table--body-cell--submitting .kg-form-item-lookup .ant-form-item-control-input-content > .kg-form-item--select {
-    width: auto;
-    flex: 1;
-    min-width: 0;
-}
-
-/* region 下拉列表弹窗 */
-.kg-form-item--select--dropdown {
-    &.kg-form-item--select-multi--dropdown {
-        .ant-select-item-option-content {
-            border-top-right-radius: 0px !important;
-            border-bottom-right-radius: 0px !important;
-        }
-    }
-
-    .ant-select-item-empty {
-        height: 32px !important;
-        line-height: 32px !important;
-        padding: 5px 8px !important;
-        display: flex;
-        align-items: center;
-        justify-content: flex-start;
-
-        & > .ant-empty {
-            margin: 0 !important;
-            text-align: left !important;
-
-            .ant-empty-description {
-                margin: 0 !important;
-            }
-
-            .ant-empty-image {
-                display: none !important;
-            }
-        }
-    }
-}
-
-/* endregion */
-/* endregion */
-
-// 多选框组
-.kg-form-item--checkbox-group {
-    border: 1px solid #d9d9d9;
-    padding: 4px 6px 0px 6px;
-    border-radius: 3px;
-    width: 100%;
-
-    .ant-divider {
-        margin: 3px 0 6px 0;
-    }
-
-    > .ant-checkbox-wrapper {
-        align-items: center;
-
-        > .ant-checkbox {
-            top: 0px !important;
-        }
-    }
-
-    > .ant-checkbox-group {
-        width: 100%;
-
-        > div {
-            .ant-checkbox-wrapper {
-                width: 100%;
-                align-items: center;
-
-                > .ant-checkbox {
-                    top: 0px !important;
-                }
-            }
-        }
-    }
-}
-
-// 单选框组
-.kg-form-item--radio-group {
-    width: 100%;
-
-    > .ant-radio-group {
-        width: 100%;
-
-        > .ant-row {
-            margin-left: 0px !important;
-            margin-right: 0px !important;
-
-            .ant-col {
-                padding: 0px !important;
-
-                > .ant-radio-wrapper {
-                    width: 100%;
-                    padding: 5px 6px;
-                    border-radius: 3px;
-                    align-items: center;
-
-                    &:hover {
-                        background: #f0f0f0;
-                    }
-
-                    > .ant-radio {
-                        top: 0px !important;
-                    }
-                }
-            }
-        }
-    }
-}
-
-// 表单控件附件:查找弹窗:按钮
-.kg-form-item--addon--lookup.ant-btn {
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    left: -1px;
-    margin-right: -1px;
-    min-width: 32px;
-    border-radius: 0 3px 3px 0;
-    padding: 0 !important;
-}
-
-.ant-form-item-has-error {
-    .kg-form-item--addon--lookup {
-        &.ant-btn {
-            border-color: #ed6f6f !important;
-        }
-    }
-}
-
-// 表单控件附件:查找弹窗:弹窗
-.kg-form-item--addon--lookup--modal {
-    .ant-modal {
-        .ant-modal-content {
-            .ant-modal-body {
-                padding: 0;
-            }
-        }
-    }
-}
-
-// 提示文本的提示框
-.ant-tooltip.kg-form-item--tip--tooltip {
-    max-width: 600px;
-
-    .ant-tooltip-arrow {
-        .ant-tooltip-arrow-content {
-            background-color: rgba(0, 0, 0, 0.7);
-            width: 8px;
-            height: 8px;
-            border-radius: 0px 0px 4px 0px;
-        }
-    }
-
-    .ant-tooltip-inner {
-        padding: 4px 8px;
-        min-height: initial;
-        user-select: none !important;
-    }
-
-    &.ant-tooltip-placement-top,
-    &.ant-tooltip-placement-topLeft,
-    &.ant-tooltip-placement-topRight {
-    }
-}
-
-.kg-table--body-cell .ant-form-item-control-input {
-    align-items: center !important;
-}