@jari-ace/element-plus-component 0.0.2 → 0.1.1

package/packages/components/numberList/NumberListInput.vue

@@ -1,111 +1,111 @@
-<script setup lang="ts">
-import {Minus, Plus} from "@element-plus/icons-vue";
-import {watch, ref, onBeforeMount} from "vue";
-import {ElInputNumber, ElButton} from "element-plus";
-
-const props = withDefaults(defineProps<{
-    modelValue: number[],
-    precision?: number,
-    step?: number,
-    size?: 'small' | 'large' | 'default'
-}>(), {})
-const emits = defineEmits(["update:modelValue", "change"])
-
-function removeValue(index: number) {
-    values.value.splice(index, 1);
-}
-
-function addValue() {
-    values.value.push({v: 0})
-}
-
-const values = ref(props.modelValue?.map(v => {
-    return {v}
-}) ?? [{
-    v: 0
-}])
-
-let initializing = false;
-let internalChangedValue = false;
-
-onBeforeMount(() => initializeModelValue(props.modelValue))
-
-function initializeModelValue(n: number[]) {
-    if (!n) return;
-    if (internalChangedValue) {
-        internalChangedValue = false;
-        return;
-    }
-    initializing = true;
-    if (n) {
-        values.value = n.map(v => {
-            return {v}
-        });
-        if (values.value.length == 0) {
-            values.value.push({v: 0});
-        }
-    } else {
-        values.value = [{v: 0}]
-    }
-}
-
-watch(() => props.modelValue, (n: number[]) => {
-    initializeModelValue(n);
-})
-
-watch(() => values.value, () => {
-    if (initializing) {
-        initializing = false;
-        return;
-    }
-    internalChangedValue = true;
-    const newValue = values.value.map(item => item.v)
-    emits("update:modelValue", newValue)
-    emits("change", newValue)
-}, {deep: true})
-</script>
-
-<template>
-    <div style="width: 100%;" class="ja-number-list">
-        <div class="ja-input-box" v-for="(v, index) in values" :key="index">
-            <el-input-number v-model="v.v" :precision="precision" :size="size"
-                             :step="step"></el-input-number>
-
-            <el-tooltip content="删除" placement="right">
-                <div class="el-input-group__append" v-show="index < (values?.length ?? 0) - 1">
-                    <el-button link :icon="Minus" @click="removeValue(index)" :size="size">
-                    </el-button>
-                </div>
-            </el-tooltip>
-            <el-tooltip content="添加" placement="right">
-                <div class="el-input-group__append" v-show="index === (values?.length ?? 0) - 1">
-                    <el-button @click="addValue()" :size="size"
-                               link :icon="Plus">
-                    </el-button>
-                </div>
-            </el-tooltip>
-        </div>
-    </div>
-</template>
-
-<style scoped lang="scss">
-.ja-number-list {
-    display: flex;
-    flex-direction: column;
-    gap: 8px;
-
-    .ja-input-box {
-        display: flex;
-        gap: 4px;
-
-        .el-input-group__append {
-            flex: none;
-            margin-left: 0 !important;
-        }
-
-        .el-input-number {
-            flex: auto;
-        }
-    }
-}
-</style>
+<script setup lang="ts">
+import {Minus, Plus} from "@element-plus/icons-vue";
+import {watch, ref, onBeforeMount} from "vue";
+import {ElInputNumber, ElButton} from "element-plus";
+
+const props = withDefaults(defineProps<{
+    modelValue: number[],
+    precision?: number,
+    step?: number,
+    size?: 'small' | 'large' | 'default'
+}>(), {})
+const emits = defineEmits(["update:modelValue", "change"])
+
+function removeValue(index: number) {
+    values.value.splice(index, 1);
+}
+
+function addValue() {
+    values.value.push({v: 0})
+}
+
+const values = ref(props.modelValue?.map(v => {
+    return {v}
+}) ?? [{
+    v: 0
+}])
+
+let initializing = false;
+let internalChangedValue = false;
+
+onBeforeMount(() => initializeModelValue(props.modelValue))
+
+function initializeModelValue(n: number[]) {
+    if (!n) return;
+    if (internalChangedValue) {
+        internalChangedValue = false;
+        return;
+    }
+    initializing = true;
+    if (n) {
+        values.value = n.map(v => {
+            return {v}
+        });
+        if (values.value.length == 0) {
+            values.value.push({v: 0});
+        }
+    } else {
+        values.value = [{v: 0}]
+    }
+}
+
+watch(() => props.modelValue, (n: number[]) => {
+    initializeModelValue(n);
+})
+
+watch(() => values.value, () => {
+    if (initializing) {
+        initializing = false;
+        return;
+    }
+    internalChangedValue = true;
+    const newValue = values.value.map(item => item.v)
+    emits("update:modelValue", newValue)
+    emits("change", newValue)
+}, {deep: true})
+</script>
+
+<template>
+    <div style="width: 100%;" class="ja-number-list">
+        <div class="ja-input-box" v-for="(v, index) in values" :key="index">
+            <el-input-number v-model="v.v" :precision="precision" :size="size"
+                             :step="step"></el-input-number>
+
+            <el-tooltip content="删除" placement="right">
+                <div class="el-input-group__append" v-show="index < (values?.length ?? 0) - 1">
+                    <el-button link :icon="Minus" @click="removeValue(index)" :size="size">
+                    </el-button>
+                </div>
+            </el-tooltip>
+            <el-tooltip content="添加" placement="right">
+                <div class="el-input-group__append" v-show="index === (values?.length ?? 0) - 1">
+                    <el-button @click="addValue()" :size="size"
+                               link :icon="Plus">
+                    </el-button>
+                </div>
+            </el-tooltip>
+        </div>
+    </div>
+</template>
+
+<style scoped lang="scss">
+.ja-number-list {
+    display: flex;
+    flex-direction: column;
+    gap: 8px;
+
+    .ja-input-box {
+        display: flex;
+        gap: 4px;
+
+        .el-input-group__append {
+            flex: none;
+            margin-left: 0 !important;
+        }
+
+        .el-input-number {
+            flex: auto;
+        }
+    }
+}
+</style>

package/packages/components/numberList/index.ts

@@ -1,7 +1,7 @@
-import {type SFCWithInstall, withInstall} from "../../utils/install";
-import NumberList from "./JaNumberList.vue";
-import NumberListInput from "./NumberListInput.vue";
-
-export const JaNumberList: SFCWithInstall<typeof NumberList> = withInstall(NumberList);
-
-export const JaNumberListRaw: SFCWithInstall<typeof NumberListInput> = withInstall(NumberListInput);
+import {type SFCWithInstall, withInstall} from "../../utils/install";
+import NumberList from "./JaNumberList.vue";
+import NumberListInput from "./NumberListInput.vue";
+
+export const JaNumberList: SFCWithInstall<typeof NumberList> = withInstall(NumberList);
+
+export const JaNumberListRaw: SFCWithInstall<typeof NumberListInput> = withInstall(NumberListInput);

package/packages/components/properyPicker/JaPropertyPicker.vue

@@ -1,38 +1,38 @@
-<script setup lang="ts">
-
-import PropertyPicker from "./PropertyPicker.vue";
-import {inject, ref, watch} from "vue";
-import type {ValidationInstance} from "../../hooks/useBackendValidations";
-import {getValue, setValue} from "../../utils/objectUtils";
-
-
-const model = inject('aceFormModel') as Record<string, never>
-const prop = inject('aceFormItemProp') as string
-const validator = inject('aceFormValidator') as ValidationInstance
-const emit = defineEmits<{
-    change: [value: number[]]
-}>()
-
-function onChange(value: number[]) {
-    validator.removeFieldError(prop)
-    setValue(model.formData, prop, mv.value);
-    emit('change', value)
-}
-
-const mv = ref(getValue(model.formData, prop) as string ?? "");
-watch(() => model.formData, () => {
-    mv.value = getValue(model.formData, prop) as string ?? ""
-}, {
-    deep: true
-})
-</script>
-
-<template>
-    <property-picker v-model="mv"
-                     @change="onChange"
-                     v-bind="$attrs"></property-picker>
-</template>
-
-<style scoped lang="scss">
-
-</style>
+<script setup lang="ts">
+
+import PropertyPicker from "./PropertyPicker.vue";
+import {inject, ref, watch} from "vue";
+import type {ValidationInstance} from "../../hooks/useBackendValidations";
+import {getValue, setValue} from "../../utils/objectUtils";
+
+
+const model = inject('aceFormModel') as Record<string, never>
+const prop = inject('aceFormItemProp') as string
+const validator = inject('aceFormValidator') as ValidationInstance
+const emit = defineEmits<{
+    change: [value: number[]]
+}>()
+
+function onChange(value: number[]) {
+    validator.removeFieldError(prop)
+    setValue(model.formData, prop, mv.value);
+    emit('change', value)
+}
+
+const mv = ref(getValue(model.formData, prop) as string ?? "");
+watch(() => model.formData, () => {
+    mv.value = getValue(model.formData, prop) as string ?? ""
+}, {
+    deep: true
+})
+</script>
+
+<template>
+    <property-picker v-model="mv"
+                     @change="onChange"
+                     v-bind="$attrs"></property-picker>
+</template>
+
+<style scoped lang="scss">
+
+</style>