From 7b15bbf1363982a03dd33c95f3ccdfdcfb7c1d47 Mon Sep 17 00:00:00 2001 From: cuiqian2004 <cuiqian2004@163.com> Date: 星期五, 14 三月 2025 18:20:31 +0800 Subject: [PATCH] oi-form --- components/oi-form/list/time-picker/index.vue | 92 + components/oi-form/list/date-picker/index.vue | 82 + components/oi-form/list/select/index.vue | 66 + pages/modal/3018_2.vue | 347 +----- components/oi-form/list/input-number/index.vue | 72 + components/oi-form/list/layout/index.vue | 68 + components/oi-form/list/textarea/index.vue | 64 + pages/modal/3200_view.vue | 175 --- /dev/null | 128 -- pages/modal/5601.vue | 342 +----- pages/modal/3037_2.vue | 234 ---- components/oi-form/list/text/index.vue | 31 components/oi-form/list/switch/index.vue | 36 components/oi-form/list/index.vue | 129 ++ components/oi-form/list/radio/index.vue | 56 + pages/modal/form/index.vue | 312 +----- components/oi-form/index.vue | 99 ++ components/oi-form/list/input/index.vue | 103 ++ components/oi-form/list/date-picker-range/index.vue | 74 + pages/modal/3200.vue | 265 ---- manifest.json | 4 components/oi-form/list/checkbox/index.vue | 55 + 22 files changed, 1,317 insertions(+), 1,517 deletions(-) diff --git a/components/oi-date-time-picker/index.js b/components/oi-date-time-picker/index.js deleted file mode 100644 index e4dd950..0000000 --- a/components/oi-date-time-picker/index.js +++ /dev/null @@ -1,8 +0,0 @@ -import OIDatePicker from './oi-date-picker.vue' -import OIDatePickerRange from './oi-date-picker-range.vue' -import OITimePicker from './oi-time-picker.vue' -export default { - OIDatePicker, - OIDatePickerRange, - OITimePicker -} \ No newline at end of file diff --git a/components/oi-date-time-picker/oi-date-picker-range.vue b/components/oi-date-time-picker/oi-date-picker-range.vue deleted file mode 100644 index 69676ba..0000000 --- a/components/oi-date-time-picker/oi-date-picker-range.vue +++ /dev/null @@ -1,126 +0,0 @@ -<template> - <uni-datetime-picker type="daterange" v-model="displayValue" :start="start" :end="end" :returnType="returnType" - :placeholder="placeholder" :startPlaceholder="startPlaceholder" :endPlaceholder="endPlaceholder" - :rangeSeparator="rangeSeparator" :border="border" :disabled="disabled" :clearIcon="clearIcon" - @change="onChange" /> -</template> - -<script> - import dayjs from "dayjs"; - export default { - name: 'OIDatePickerRange', - props: { - modelValue: { - type: [String, Number, Array, Date], - default: '' - }, - start: { - type: [Number, String], - default: '' - }, - end: { - type: [Number, String], - default: '' - }, - returnType: { - type: String, - default: 'string' - }, - placeholder: { - type: String, - default: '' - }, - startPlaceholder: { - type: String, - default: '' - }, - endPlaceholder: { - type: String, - default: '' - }, - rangeSeparator: { - type: String, - default: '-' - }, - border: { - type: [Boolean], - default: true - }, - disabled: { - type: [Boolean], - default: false - }, - clearIcon: { - type: [Boolean], - default: true - }, - format: { - type: String, - default: '' - } - }, - data() { - return { - displayValue: "", - } - }, - methods: { - toDate(t) { - if (!t) return undefined; - else if (typeof t == "string") { - if (t.includes(",")) return this.toDate(t.split(",")); - else return this.toDate([t, t]); - } else if (t instanceof Array) { - let dt = []; - let d0 = t[0]; - let d1 = t[1]; - if (!d0 && !d1) return undefined; - else if (!d0) return undefined; - else if (!d1) d1 = d0; - - let dt0 = new Date(dayjs(d0).format("YYYY-MM-DD")); - let dt1 = new Date(dayjs(d1).format("YYYY-MM-DD")); - return [dt0, dt1]; - } - }, - onChange(val) { - if (val instanceof Array) { - let format = "YYYY-MM-DD"; - if (this.format) - format = this.format - .replace(/y/g, "Y") - .replace(/m/g, "M") - .replace(/d/g, "D"); - let dt = []; - let d0 = val[0]; - let d1 = val[1]; - if (!d0 && !d1) return undefined; - else if (!d0) return undefined; - else if (!d1) d1 = d0; - let dt0 = dayjs(d0).format(format); - let dt1 = dayjs(d1).format(format); - - this.$emit("update:modelValue", [dt0, dt1]) - this.$emit('input', [dt0, dt1]) - this.$emit("change", [dt0, dt1]) - } - }, - }, - watch: { - // #ifndef VUE3 - value(val) { - this.displayValue = this.toDate(val); - }, - // #endif - // #ifdef VUE3 - modelValue(val) { - this.displayValue = this.toDate(val); - }, - // #endif - }, - - } -</script> - -<style> -</style> \ No newline at end of file diff --git a/components/oi-date-time-picker/oi-date-picker.vue b/components/oi-date-time-picker/oi-date-picker.vue deleted file mode 100644 index 2aa55ab..0000000 --- a/components/oi-date-time-picker/oi-date-picker.vue +++ /dev/null @@ -1,137 +0,0 @@ -<template> - <uni-datetime-picker type="date" v-model="displayValue" :start="start" :end="end" :returnType="returnType" - :placeholder="placeholder" :border="border" :disabled="disabled" :clearIcon="clearIcon" @change="onChange" /> -</template> - -<script> - import dayjs from "dayjs"; - export default { - name: 'OIDatePicker', - emits: ['update:modelValue', 'clear'], - props: { - value: { - type: [String, Number, Date], - default: '' - }, - modelValue: { - type: [String, Number, Date], - default: '' - }, - - start: { - type: [Number, String], - default: '' - }, - end: { - type: [Number, String], - default: '' - }, - returnType: { - type: String, - default: 'string' - }, - placeholder: { - type: String, - default: '' - }, - border: { - type: [Boolean], - default: true - }, - disabled: { - type: [Boolean], - default: false - }, - clearIcon: { - type: [Boolean], - default: true - }, - hideSecond: { - type: [Boolean], - default: false - }, - format: { - type: String, - default: '' - }, - defaultToday: { - type: Boolean, - default: false - } - }, - data() { - return { - displayValue: "", - } - }, - methods: { - onChange(date) { - - let format = "YYYY-MM-DD"; - if (this.format) - format = this.format - .replace(/y/g, "Y") - .replace(/m/g, "M") - .replace(/d/g, "D"); - let date2 = dayjs(date).format(format); - console.log(date, this.displayValue, date2) - - this.$emit("update:modelValue", date2) - this.$emit('input', date2) - this.$emit("change", date2) - }, - checkDefaultDate() { - let format = "YYYY-MM-DD"; - if (this.format) - format = this.format - .replace(/y/g, "Y") - .replace(/m/g, "M") - .replace(/d/g, "D"); - if (this.defaultToday && !this.value) { - this.displayValue = dayjs().format("YYYY-MM-DD"); - let date = dayjs(this.displayValue).format(format); - this.$emit("update:modelValue", date) - this.$emit('input', date) - this.$emit("change", date) - } - }, - }, - mounted() { - this.checkDefaultDate(); - }, - watch: { - // #ifndef VUE3 - - value: { - immediate: true, - handler(newVal) { - if (newVal) { - this.displayValue = dayjs(newVal).format("YYYY-MM-DD"); - } else { - this.displayValue = '' - } - }, - }, - // #endif - // #ifdef VUE3 - modelValue: { - immediate: true, - handler(newVal) { - console.log(newVal) - if (newVal) { - this.displayValue = dayjs(newVal).format("YYYY-MM-DD"); - } else { - this.displayValue = '' - } - }, - - }, - - // #endif - - }, - } -</script> - -<style> -</style> \ No newline at end of file diff --git a/components/oi-date-time-picker/oi-time-picker.vue b/components/oi-date-time-picker/oi-time-picker.vue deleted file mode 100644 index f2586a3..0000000 --- a/components/oi-date-time-picker/oi-time-picker.vue +++ /dev/null @@ -1,128 +0,0 @@ -<template> - <view class="oi-time-picker"> - <picker mode="time" :disabled="disabled" @change="onChange"> - <view class="oi-time-picker-x" - :class="{'oi-time-picker-disabled': disabled,'oi-time-picker-border': border}"> - <uni-icons class="icon-calendar" type="calendar" color="#c0c4cc" size="22"></uni-icons> - <view class="oi-time-picker-input">{{displayValue}}</view> - </view> - </picker> - </view> -</template> -<script> - import dayjs from "dayjs"; - export default { - name: 'OITimePicker', - props: { - value: { - type: String, - default: '' - }, - modelValue: { - type: [String, Number], - default: '' - }, - placeholder: { - type: String, - default: '' - }, - border: { - type: [Boolean], - default: true - }, - disabled: { - type: [Boolean], - default: false - }, - format: { - type: String, - default: '' - }, - - }, - data() { - return { - displayValue: "", - } - }, - methods: { - onChange(e) { - this.displayValue = e.detail.value - console.log(this.displayValue, e.detail) - this.$emit('update:modelValue', this.displayValue) - this.$emit('input', this.displayValue) - this.$emit("change", this.displayValue) - }, - - }, - mounted() { - - }, - watch: { - // #ifndef VUE3 - value(val) { - this.displayValue = val - }, - // #endif - // #ifdef VUE3 - modelValue(val) { - this.displayValue = val - }, - // #endif - - }, - } -</script> - -<style lang="scss"> - .oi-time-picker { - - width: 100%; - flex: 1; - - .oi-time-picker-x { - - - display: flex; - flex-direction: row; - align-items: center; - justify-content: center; - border-radius: 4px; - background-color: #fff; - color: #666; - font-size: 14px; - flex: 1; - - - - .icon-calendar { - padding-left: 3px; - } - - .oi-time-picker-input { - width: auto; - height: 35px; - /* #ifndef MP */ - padding-left: 5px; - /* #endif */ - position: relative; - flex: 1; - line-height: 35px; - font-size: 14px; - overflow: hidden; - } - - } - - .oi-time-picker-disabled { - opacity: 0.4; - cursor: default; - } - - .oi-time-picker-border { - box-sizing: border-box; - border-radius: 4px; - border: 1px solid #e5e5e5; - } - } -</style> \ No newline at end of file diff --git a/components/oi-form/index.vue b/components/oi-form/index.vue new file mode 100644 index 0000000..fd8bbc0 --- /dev/null +++ b/components/oi-form/index.vue @@ -0,0 +1,99 @@ +<template> + <uni-forms class="oi-form" ref="baseForm" label-align="right"> + <template v-for="(item,index) in form.items"> + <OIFormLayout v-if="item.name == 'Layout'" v-show="!item.isHidden" :focusId="focusId" :viewMode="viewMode" + :hiddenIds="hiddenIds" :data="item" @change="onChange" @focus="onFocus" @click="onClick" + @click-prefix="onClickPrefix" @click-suffix="onClickSuffix"> + </OIFormLayout> + <OIFormItem v-else :hiddenIds="hiddenIds" :focusId="focusId" :viewMode="viewMode" :data="item" + @change="onChange" @focus="onFocus" @click="onClick" @click-prefix="onClickPrefix" + @click-suffix="onClickSuffix"> + </OIFormItem> + </template> + + </uni-forms> +</template> + +<script> + import OIFormItem from './list/index.vue' + import OIFormLayout from './list/layout/index.vue' + export default { + name: "OIForm", + components: { + OIFormItem, + OIFormLayout + }, + props: { + form: { + type: Object, + required: true, + }, + viewMode: { + type: Boolean, + default: false + }, + focusId: { + type: String, + default: '' + }, + hiddenIds: { + type: Array, + default: () => [], + }, + }, + data() { + return { + + } + }, + methods: { + setFormItemVisible(attrs) { + attrs.forEach((attr) => { + let index = this.hiddenIds.findIndex((id) => id == attr.attr); + if (attr.show) { + if (index > -1) this.hiddenIds.splice(index, 1); + } else { + if (index == -1) this.hiddenIds.push(attr.attr); + } + }); + }, + clearFormValues() { + if (!this.form.model) return; + Object.keys(this.form.model).forEach((attr) => { + let value = this.form.model[attr]; + value = + typeof value == "number" ? + 0 : + typeof value == "string" ? + "" : + value instanceof Array ? [] : {}; + this.form.model[attr] = value; + }); + }, + onChange(item) { + var attr = item.fieldId; + this.form.model[attr] = item.value; + this.$emit("change", item) + }, + onClick(item) { + this.$emit("click", item) + }, + onFocus(item) { + this.$emit("focus", item) + }, + onClickPrefix(item) { + this.$emit("click-prefix", item) + }, + onClickSuffix(item) { + this.$emit("click-suffix", item) + }, + } + }; +</script> + +<style lang="less"> + .oi-form { + + + } +</style> \ No newline at end of file diff --git a/components/oi-form/list/checkbox/index.vue b/components/oi-form/list/checkbox/index.vue new file mode 100644 index 0000000..905c4c0 --- /dev/null +++ b/components/oi-form/list/checkbox/index.vue @@ -0,0 +1,55 @@ +<template> + <view class="oi-form-checkbox"> + <!-- 澶嶉�妗�--> + <checkbox-group v-if="model" :class="data.disabled?'input-disabled':''" :disabled="data.disabled" + @change="onChange"> + <label v-for="(item) in data.selections" :key="item.value" class="checkbox-item"> + <checkbox :value="item.value" :checked="model[data.fieldId].includes(item.value)" /> + <text>{{item.label}}</text> + </label> + </checkbox-group> + <checkbox-group v-else :class="data.disabled?'input-disabled':''" :disabled="data.disabled" @change="onChange"> + <label v-for="(item) in data.selections" :key="item.value" class="checkbox-item"> + <checkbox :value="item.value" :checked="data.value.includes(item.value)" /> + <text>{{item.label}}</text> + </label> + </checkbox-group> + </view> +</template> + +<script> + export default { + name: "OIFormCheckbox", + props: { + data: { + type: Object, + required: true, + }, + model: Object, + }, + methods: { + onChange(e) { + let val = this.data.value = e.detail.value || [] + if (this.model) { + this.model[this.data.fieldId] = val + } + this.data.value = val + this.$emit("change", val) + }, + + } + }; +</script> + +<style lang="less" scoped> + .oi-form-checkbox { + width: 100%; + .checkbox-item{ + vertical-align: middle; + margin-left: 10rpx + } + .input-disabled { + background-color: #f3f3f3 !important; + } + } +</style> \ No newline at end of file diff --git a/components/oi-form/list/date-picker-range/index.vue b/components/oi-form/list/date-picker-range/index.vue new file mode 100644 index 0000000..698ae8f --- /dev/null +++ b/components/oi-form/list/date-picker-range/index.vue @@ -0,0 +1,74 @@ +<template> + <uni-datetime-picker v-if="model" type="daterange" :value="toDate(model[data.fieldId])" + :placeholder="data.placeholder" :rangeSeparator="data.setting.separator" border :disabled="data.disabled" + @change="onChange" /> + <uni-datetime-picker v-else type="daterange" :value="data.value" :placeholder="data.placeholder" + :rangeSeparator="data.setting.separator" border :disabled="data.disabled" @change="onChange" /> +</template> + +<script> + import dayjs from "dayjs"; + export default { + name: 'OIFormDatePickerRange', + props: { + data: { + type: Object, + required: true, + }, + model: Object, + }, + data() { + return {} + }, + computed: {}, + methods: { + toDate(t) { + if (!t) return undefined; + else if (typeof t == "string") { + if (t.includes(",")) return this.toDate(t.split(",")); + else return this.toDate([t, t]); + } else if (t instanceof Array) { + let dt = []; + let d0 = t[0]; + let d1 = t[1]; + if (!d0 && !d1) return undefined; + else if (!d0) return undefined; + else if (!d1) d1 = d0; + + let dt0 = new Date(dayjs(d0).format("YYYY-MM-DD")); + let dt1 = new Date(dayjs(d1).format("YYYY-MM-DD")); + return [dt0, dt1]; + } + }, + onChange(val) { + if (val instanceof Array) { + let format = "YYYY-MM-DD"; + if (this.data.setting.format) + format = this.data.setting.format + .replace(/y/g, "Y") + .replace(/m/g, "M") + .replace(/d/g, "D"); + let dt = []; + let d0 = val[0]; + let d1 = val[1]; + if (!d0 && !d1) return undefined; + else if (!d0) return undefined; + else if (!d1) d1 = d0; + let dt0 = dayjs(d0).format(format); + let dt1 = dayjs(d1).format(format); + let date2 = [dt0, dt1] + if (!this.model) { + this.data.value = date2 + } else { + this.model[this.data.fieldId] = date2 + } + this.$emit("change", date2) + + } + }, + }, + } +</script> + +<style> +</style> \ No newline at end of file diff --git a/components/oi-form/list/date-picker/index.vue b/components/oi-form/list/date-picker/index.vue new file mode 100644 index 0000000..d78bf70 --- /dev/null +++ b/components/oi-form/list/date-picker/index.vue @@ -0,0 +1,82 @@ +<template> + <uni-datetime-picker v-if="model" type="date" :value="model[data.fieldId]" :placeholder="data.placeholder" border + :disabled="data.disabled" clearIcon @change="onChange" /> + <uni-datetime-picker v-else type="date" :value="data.value" :placeholder="data.placeholder" border + :disabled="data.disabled" clearIcon @change="onChange" /> +</template> + +<script> + import dayjs from "dayjs"; + export default { + name: 'OIFormDatePicker', + props: { + data: { + type: Object, + required: true, + }, + model: Object, + }, + data() { + return {} + }, + computed: { + }, + methods: { + onChange(date) { + let format = "YYYY-MM-DD"; + if (this.data.setting.format) + format = this.data.setting.format + .replace(/y/g, "Y") + .replace(/m/g, "M") + .replace(/d/g, "D"); + let date2 = dayjs(date).format(format); + if (!this.model) { + this.data.value = date2 + } else { + this.model[this.data.fieldId] = date2 + } + this.$emit("change", date2) + }, + checkDefaultDate() { + let format = "YYYY-MM-DD"; + if (!this.model) { + return + } + if (this.data.setting.format) + format = this.data.setting.format + .replace(/y/g, "Y") + .replace(/m/g, "M") + .replace(/d/g, "D"); + + if (this.data.setting.defaultToday && !this.model[this.data.fieldId]) { + let date = dayjs().format(format); + this.model[this.data.fieldId] = date + } + + }, + }, + mounted() { + if (!this.model) { + if (this.data.setting.defaultToday && !this.data.value) { + let format = "YYYY-MM-DD"; + if (this.data.setting.format) + format = this.data.setting.format + .replace(/y/g, "Y") + .replace(/m/g, "M") + .replace(/d/g, "D"); + let date = dayjs().format(format); + this.data.value = date + } + } + this.checkDefaultDate(); + }, + watch: { + data() { + this.checkDefaultDate(); + }, + }, + } +</script> + +<style> +</style> \ No newline at end of file diff --git a/components/oi-form/list/index.vue b/components/oi-form/list/index.vue new file mode 100644 index 0000000..c3abb35 --- /dev/null +++ b/components/oi-form/list/index.vue @@ -0,0 +1,129 @@ +<template> + <view :class="viewMode ? 'oi-form-item-view':'oi-form-item'"> + <uni-forms-item v-show="!hiddenIds.includes(data.fieldId)" + :label="data.labelWidth === 0 ? '' : data.label? data.label+'锛�:''" + :label-width="data.labelWidth || data.labelWidth === 0 ? data.labelWidth : 100+'px'" + :style="{ textAlign: data.setting.align }"> + <OIFormText v-if="viewMode && data.disabled" :data="data" :model="model"> + </OIFormText> + <OIFormInput v-else-if="data.name == 'Input'" :viewMode="viewMode" :focus="focusId== data.fieldId" + :data="data" :model="model" @change="onChange" @focus="onFocus" @click="onClick" + @click-prefix="onClickPrefix" @click-suffix="onClickSuffix"> + </OIFormInput> + <OIFormInputNumber v-else-if="data.name == 'InputNumber'" :focus="focusId== data.fieldId" :data="data" + :model="model" @change="onChange" @focus="onFocus" @click="onClick"> + </OIFormInputNumber> + <OIFormTextArea v-else-if="data.name == 'Textarea'" :focus="focusId== data.fieldId" :data="data" + :model="model" @change="onChange" @focus="onFocus" @click="onClick"> + </OIFormTextArea> + <OIFormSelect v-else-if="data.name == 'Select'" :data="data" :model="model" @change="onChange"> + </OIFormSelect> + <OIFormSwitch v-else-if="data.name == 'Switch'" :data="data" :model="model" @change="onChange"> + </OIFormSwitch> + <OIFormCheckbox v-else-if="data.name == 'Checkbox'" :data="data" :model="model" @change="onChange"> + </OIFormCheckbox> + <OIFormRadio v-else-if="data.name == 'Radio'" :data="data" :model="model" @change="onChange"> + </OIFormRadio> + <OIFormDatePicker v-else-if="data.name == 'DatePicker'" :data="data" :model="model" @change="onChange"> + </OIFormDatePicker> + <OIFormTimePicker v-else-if="data.name == 'TimePicker'" :data="data" :model="model" @change="onChange"> + </OIFormTimePicker> + <OIFormDatePickerRange v-else-if="data.name == 'DatePickerRange'" :data="data" :model="model" + @change="onChange"> + </OIFormDatePickerRange> + <OIFormText v-else-if="data.name == 'Text'" :data="data" :model="model"> + </OIFormText> + <OIFormText v-else :data="data" :model="model"> + </OIFormText> + </uni-forms-item> + </view> +</template> + +<script> + import OIFormInput from './input/index.vue' + import OIFormInputNumber from './input-number/index.vue' + import OIFormText from './text/index.vue' + import OIFormTextArea from './textarea/index.vue' + import OIFormSelect from './select/index.vue' + import OIFormSwitch from './switch/index.vue' + import OIFormCheckbox from './checkbox/index.vue' + import OIFormRadio from './radio/index.vue' + import OIFormDatePicker from './date-picker/index.vue' + import OIFormDatePickerRange from './date-picker-range/index.vue' + import OIFormTimePicker from './time-picker/index.vue' + export default { + name: "OIFormItem", + components: { + OIFormInput, + OIFormInputNumber, + OIFormText, + OIFormTextArea, + OIFormSelect, + OIFormSwitch, + OIFormCheckbox, + OIFormRadio, + OIFormDatePicker, + OIFormDatePickerRange, + OIFormTimePicker + }, + props: { + data: { + type: Object, + required: true, + }, + model: Object, + viewMode: { + type: Boolean, + default: false + }, + focusId: { + type: String, + default: '' + }, + hiddenIds: { + type: Array, + default: () => [], + }, + }, + methods: { + onChange(e) { + this.$emit("change", this.data) + }, + onClick(e) { + this.$emit("click", this.data) + }, + onFocus(e) { + this.$emit("focus", this.data) + }, + onClickPrefix() { + this.$emit("click-prefix", this.data) + }, + onClickSuffix() { + this.$emit("click-suffix", this.data) + }, + }, + mounted() { + console.log("item", this.data) + } + }; +</script> + +<style lang="scss" scoped> + .oi-form-item { + .uni-forms-item { + margin-bottom: 11rpx; + } + + } + .oi-form-item-view { + .uni-forms-item { + padding-bottom: 5rpx; + margin-bottom: 0; + + .uni-forms-item__label { + height: 20px !important; + padding: 0 10rpx 0 0 !important; + } + } + } +</style> \ No newline at end of file diff --git a/components/oi-form/list/input-number/index.vue b/components/oi-form/list/input-number/index.vue new file mode 100644 index 0000000..0063d6d --- /dev/null +++ b/components/oi-form/list/input-number/index.vue @@ -0,0 +1,72 @@ +<template> + <view class="oi-form-input-number"> + <input v-if="model" type="number" class="oi-input-number" :class="data.disabled?'input-disabled':''" v-model="model[data.fieldId]" :focus="focus" + :placeholder="data.placeholder" @blur="onChange" @confirm="onConfirm" @click="onClick" + :disabled="data.disabled"></input> + <input v-else type="number" class="oi-input-number" :class="data.disabled?'input-disabled':''" v-model="data.value" :focus="focus" + :placeholder="data.placeholder" @blur="onChange" @confirm="onConfirm" @click="onClick" + :disabled="data.disabled"></input> + </view> +</template> + +<script> + export default { + name: "OIFormInputNumber", + props: { + data: { + type: Object, + required: true, + }, + model: Object, + focus: { + type: Boolean, + default: false + }, + }, + methods: { + onChange(e) { + this.$emit("change", e) + }, + onConfirm(e) { + this.onChange(e) + }, + onClick(e) { + this.$emit("click", e) + }, + + } + }; +</script> + +<style lang="less" scoped> + .oi-form-input-number { + border: 1px solid #d5d5d5; + width: calc(100%- 6rpx); + border-radius: 6px !important; + padding: 3rpx; + .input-disabled { + background-color: #f3f3f3 !important; + } + + .oi-input-number { + color: #2d8cf0; + padding: 10rpx 8rpx; + width: calc(100% - 12rpx); + padding: 5rpx; + border: 1px solid #d5d5d5; + color: #2d8cf0; + height: 20px; + background: #FFF; + line-height: 20px; + border-radius: 6px !important; + font-size: 14px; + font-family: inherit; + box-shadow: none !important; + transition-duration: 0.1s; + vertical-align: middle; + } + } + .oi-form-input-number:hover { + border: 1px solid rgb(41, 121, 255); + } +</style> \ No newline at end of file diff --git a/components/oi-form/list/input/index.vue b/components/oi-form/list/input/index.vue new file mode 100644 index 0000000..a0ec6f0 --- /dev/null +++ b/components/oi-form/list/input/index.vue @@ -0,0 +1,103 @@ +<template> + <view class="oi-form-input"> + <text v-if="data.setting.prefix && !viewMode" class="form-input-icon" :class="[data.setting.prefix]" + @click="onPrefixButton"></text> + <input v-if="model" class="oi-input" :class="data.disabled?'input-disabled':''" + :style="{'padding-left':data.setting.prefix?0 : '8rpx','right':data.setting.suffix?0 : '8rpx'}" + v-model="model[data.fieldId]" :focus="focus" :placeholder="data.placeholder" @focus="onFocus" + @blur="onChange" @confirm="onConfirm" @click="onClick" :disabled="data.disabled" :maxlength="-1"></input> + <input v-else class="oi-input" :class="data.disabled?'input-disabled':''" + :style="{'padding-left':data.setting.prefix?0 : '8rpx','right':data.setting.suffix?0 : '8rpx'}" + v-model="data.value" :focus="focus" :placeholder="data.placeholder" @blur="onChange" @confirm="onConfirm" + @click="onClick" :disabled="data.disabled"></input> + <text v-if="data.setting.suffix&& !viewMode" class="form-input-icon" :class="[data.setting.suffix]" + @click="onSuffixButton"></text> + + </view> +</template> + +<script> + export default { + name: "OIFormInput", + props: { + viewMode: { + type: Boolean, + default: false + }, + data: { + type: Object, + required: true, + }, + model: Object, + focus: { + type: Boolean, + default: false + }, + }, + methods: { + onChange(e) { + this.$emit("change", e) + }, + onConfirm(e) { + this.onChange(e) + }, + onClick(e) { + this.$emit("click", e) + }, + onFocus(e) { + this.$emit("focus", e) + }, + onPrefixButton() { + this.$emit("click-prefix") + }, + onSuffixButton() { + this.$emit("click-suffix") + }, + } + }; +</script> + +<style lang="scss"> + .oi-form-input { + border: 1px solid #d5d5d5; + border-radius: 6px !important; + padding: 3rpx; + width: calc(100%- 6rpx); + display: flex; + flex-direction: row; + + .input-disabled { + background-color: #f3f3f3 !important; + } + + .oi-input { + color: #2d8cf0; + padding: 10rpx 8rpx; + flex: 1; + height: 20px; + background: #FFF; + line-height: 20px; + font-size: 14px; + font-family: inherit; + transition-duration: 0.1s; + vertical-align: middle; + } + + .form-input-icon { + width: 30rpx; + font-family: uniicons; + font-weight: 400; + font-style: normal; + cursor: pointer; + display: inline-block; + vertical-align: middle; + padding: 10rpx 5rpx; + font-size: 32rpx; + color: rgb(192, 196, 204); + } + } + + .oi-form-input:hover { + border: 1px solid rgb(41, 121, 255); + } +</style> \ No newline at end of file diff --git a/components/oi-form/list/layout/index.vue b/components/oi-form/list/layout/index.vue new file mode 100644 index 0000000..6c4bec0 --- /dev/null +++ b/components/oi-form/list/layout/index.vue @@ -0,0 +1,68 @@ +<template> + <!-- 鏍呮牸甯冨眬 --> + <uni-row :gutter="data.setting.gutter"> + <uni-col + :span="data.setting.spanList && data.setting.spanList[key]? data.setting.spanList[key] : 24 / data.setting.col" + v-for="(col,key) in data.setting.colList"> + <OIFormItem v-if="col != null" :focusId="focusId" :viewMode="viewMode" :data="col" :model="model" + :hiddenIds="hiddenIds" @change="onChange" @focus="onFocus" @click="onClick" + @click-prefix="onClickPrefix" @click-suffix="onClickSuffix"></OIFormItem> + <uni-forms-item v-else label=""></uni-forms-item> + </uni-col> + </uni-row> + +</template> + +<script> + import OIFormItem from '../index.vue' + export default { + name: "OIFormLayout", + components: { + OIFormItem, + }, + props: { + viewMode: { + type: Boolean, + default: false + }, + data: { + type: Object, + required: true, + }, + model: Object, + focusId: { + type: String, + default: '' + }, + hiddenIds: { + type: Array, + default: () => [], + }, + }, + methods: { + onChange(e) { + this.$emit("change", e) + }, + onClick(e) { + this.$emit("click", e) + }, + onFocus(e) { + this.$emit("focus", e) + }, + onClickPrefix(e) { + this.$emit("click-prefix", e) + }, + onClickSuffix(e) { + this.$emit("click-suffix", e) + }, + }, + + mounted() { + console.log("layout", this.data.setting.colList) + }, + }; +</script> + +<style lang="scss" scoped> + .oi-form-layout {} +</style> \ No newline at end of file diff --git a/components/oi-form/list/radio/index.vue b/components/oi-form/list/radio/index.vue new file mode 100644 index 0000000..236418f --- /dev/null +++ b/components/oi-form/list/radio/index.vue @@ -0,0 +1,56 @@ +<template> + <view class="oi-form-radio"> + <!-- 鍗曢�妗�--> + <radio-group v-if="model" :class="data.disabled?'input-disabled':''" :disabled="data.disabled" + @change="onChange"> + <label v-for="(item) in data.selections" :key="item.value" class="radio-item"> + <radio :value="item.value" :checked="item.value === model[data.fieldId]" /> + <text>{{item.label}}</text> + </label> + </radio-group> + <radio-group v-else :class="data.disabled?'input-disabled':''" :disabled="data.disabled" @change="onChange"> + <label v-for="(item) in data.selections" :key="item.value" class="radio-item"> + <radio :value="item.value" :checked="item.value === data.value" /> + <text>{{item.label}}</text> + </label> + </radio-group> + </view> +</template> + +<script> + export default { + name: "OIFormRadio", + props: { + data: { + type: Object, + required: true, + }, + model: Object, + }, + methods: { + onChange(e) { + let val = this.data.value = e.detail.value || "" + if (this.model) { + this.model[this.data.fieldId] = val + } + this.data.value = val + this.$emit("change", val) + }, + + } + }; +</script> + +<style lang="less" scoped> + .oi-form-radio { + width: 100%; + .radio-item { + vertical-align: middle; + margin-left: 10rpx + } + + .input-disabled { + background-color: #f3f3f3 !important; + } + } +</style> \ No newline at end of file diff --git a/components/oi-form/list/select/index.vue b/components/oi-form/list/select/index.vue new file mode 100644 index 0000000..accc501 --- /dev/null +++ b/components/oi-form/list/select/index.vue @@ -0,0 +1,66 @@ +<template> + <view class="oi-form-select"> + <!-- 涓嬫媺閫夋嫨妗�--> + <uni-data-picker v-if="model" class="data-picker" :class="data.disabled?'input-disabled':''" + v-model="model[data.fieldId]" :localdata="data.useDict ? data.dict : data.selections" @change="onChange" + :readonly="data.disabled" :clear-icon="false" :popup-title="data.label"></uni-data-picker> + <uni-data-picker v-else class="data-picker" :class="data.disabled?'input-disabled':''" v-model="data.value" + :localdata="data.useDict ? data.dict : data.selections" @change="onChange" :readonly="data.disabled" + :clear-icon="false" :popup-title="data.label"></uni-data-picker> + </view> +</template> + +<script> + export default { + name: "OIFormSelect", + props: { + data: { + type: Object, + required: true, + }, + model: Object, + }, + methods: { + onChange(e) { + this.$emit("change", e) + }, + + } + }; +</script> + +<style lang="less" scoped> + .oi-form-select { + width: 100%; + .data-picker { + width: 100%; + background: #FFF; + border-radius: 0 !important; + color: #2d8cf0; + /* padding: 10rpx 8rpx 12rpx; */ + font-size: 34rpx; + font-family: inherit; + box-shadow: none !important; + transition-duration: 0.1s; + margin-top: 0rpx; + /* vertical-align: 10px; */ + vertical-align: middle; + + .uni-select { + border: 1px solid #ccc; + border-radius: 0 !important; + color: #2d8cf0; + } + + .uni-select__input-text { + color: #2d8cf0; + } + } + + + + .input-disabled { + background-color: #f3f3f3 !important; + } + } +</style> \ No newline at end of file diff --git a/components/oi-form/list/switch/index.vue b/components/oi-form/list/switch/index.vue new file mode 100644 index 0000000..61be119 --- /dev/null +++ b/components/oi-form/list/switch/index.vue @@ -0,0 +1,36 @@ +<template> + <view class="oi-form-switch"> + <!-- Switch寮�叧 --> + <switch v-if="model" :class="data.disabled?'input-disabled':''" :disabled="data.disabled" + v-model="model[data.fieldId]" @change="onChange" /> + <switch v-else :class="data.disabled?'input-disabled':''" :disabled="data.disabled" v-model="data.value" + @change="onChange" /> + </view> +</template> + +<script> + export default { + name: "OIFormSwitch", + props: { + data: { + type: Object, + required: true, + }, + model: Object, + }, + methods: { + onChange(e) { + this.$emit("change", e) + }, + + + } + }; +</script> + +<style lang="less" scoped> + .oi-form-switch { + vertical-align: middle; + margin-left: 10rpx + } +</style> \ No newline at end of file diff --git a/components/oi-form/list/text/index.vue b/components/oi-form/list/text/index.vue new file mode 100644 index 0000000..beb95c3 --- /dev/null +++ b/components/oi-form/list/text/index.vue @@ -0,0 +1,31 @@ +<template> + + <view class="oi-form-text" v-if="model" :class="{ 'align-fixed': data.fontSize < 18 }" :style="{fontSize: `${data.fontSize}px`, color: data.color,fontWeight: data.bold ? 'bold' : '',fontStyle: data.italic ? 'italic' : '', + }">{{model[data.fieldId]}}</view> + <view class="oi-form-text" v-else :class="{ 'align-fixed': data.fontSize < 18 }" :style="{fontSize: `${data.fontSize}px`, color: data.color,fontWeight: data.bold ? 'bold' : '',fontStyle: data.italic ? 'italic' : '', + }">{{data.value}}</view> +</template> + +<script> + export default { + name: "OIFormText", + props: { + data: { + type: Object, + required: true, + }, + model: Object, + }, + }; +</script> + +<style lang="scss" scoped> + .oi-form-text { + word-break: break-all; + + .align-fixed { + line-height: 1; + padding: 10px 12px 10px 0; + } + } +</style> \ No newline at end of file diff --git a/components/oi-form/list/textarea/index.vue b/components/oi-form/list/textarea/index.vue new file mode 100644 index 0000000..57957fd --- /dev/null +++ b/components/oi-form/list/textarea/index.vue @@ -0,0 +1,64 @@ +<template> + <view class="oi-form-textarea"> + <textarea v-if="model" class="textarea" :class="data.disabled?'input-disabled':''" v-model="model[data.fieldId]" + :focus="focus" :placeholder="data.placeholder" @blur="onChange" @confirm="onConfirm" @click="onClick" + :disabled="data.disabled"></textarea> + <textarea v-else class="textarea" :class="data.disabled?'input-disabled':''" v-model="data.value" :focus="focus" + :placeholder="data.placeholder" @blur="onChange" @confirm="onConfirm" @click="onClick" + :disabled="data.disabled"></textarea> + </view> +</template> + +<script> + export default { + name: "OIFormTextarea", + props: { + data: { + type: Object, + required: true, + }, + model: Object, + focus: { + type: Boolean, + default: false + }, + }, + methods: { + onChange(e) { + this.$emit("change", e) + }, + onConfirm(e) { + this.onChange(e) + }, + onClick(e) { + this.$emit("click", e) + }, + + + } + }; +</script> + +<style lang="scss" scoped> + .oi-form-textarea { + border: 1px solid #d5d5d5; + width: calc(100%- 6rpx); + border-radius: 6px !important; + padding: 3rpx; + + .input-disabled { + background-color: #f3f3f3 !important; + } + + .textarea { + color: #2d8cf0; + padding: 10rpx 8rpx; + background: #FFF; + } + + } + + .oi-form-textarea:hover { + border: 1px solid rgb(41, 121, 255); + } +</style> \ No newline at end of file diff --git a/components/oi-form/list/time-picker/index.vue b/components/oi-form/list/time-picker/index.vue new file mode 100644 index 0000000..b694250 --- /dev/null +++ b/components/oi-form/list/time-picker/index.vue @@ -0,0 +1,92 @@ +<template> + <view class="oi-form-time-picker"> + <picker v-if="model" mode="time" :disabled="data.disabled" @change="onChange"> + <view class="oi-time-picker-x oi-time-picker-border" :class="{'oi-time-picker-disabled': data.disabled}"> + <uni-icons class="icon-calendar" type="calendar" color="#c0c4cc" size="22"></uni-icons> + <view class="oi-time-picker-input">{{model[data.fieldId]}}</view> + </view> + </picker> + <picker v-else mode="time" :disabled="data.disabled" @change="onChange"> + <view class="oi-time-picker-x oi-time-picker-border" :class="{'oi-time-picker-disabled': data.disabled}"> + <uni-icons class="icon-calendar" type="calendar" color="#c0c4cc" size="22"></uni-icons> + <view class="oi-time-picker-input">{{data.value}}</view> + </view> + </picker> + </view> +</template> +<script> + export default { + name: "OIFormTimePicker", + props: { + data: { + type: Object, + required: true, + }, + model: Object, + }, + data() { + return { + + } + }, + methods: { + onChange(e) { + let val = e.detail.value + ":00" + if (!this.model) { + this.data.value = val + } else { + this.model[this.data.fieldId] = val + } + this.$emit("change", val) + }, + }, + + } +</script> + +<style lang="scss" scoped> + .oi-form-time-picker { + width: 100%; + + .oi-time-picker-x { + display: flex; + flex-direction: row; + align-items: center; + justify-content: center; + border-radius: 4px; + background-color: #fff; + color: #666; + font-size: 14px; + flex: 1; + + .icon-calendar { + padding-left: 3px; + } + + .oi-time-picker-input { + width: auto; + height: 35px; + /* #ifndef MP */ + padding-left: 5px; + /* #endif */ + position: relative; + flex: 1; + line-height: 35px; + font-size: 14px; + overflow: hidden; + } + + } + + .oi-time-picker-disabled { + opacity: 0.4; + cursor: default; + } + + .oi-time-picker-border { + box-sizing: border-box; + border-radius: 4px; + border: 1px solid #e5e5e5; + } + } +</style> \ No newline at end of file diff --git a/manifest.json b/manifest.json index 66cfb8b..7c48b89 100644 --- a/manifest.json +++ b/manifest.json @@ -2,8 +2,8 @@ "name" : "MoboxPDA", "appid" : "__UNI__56D451E", "description" : "", - "versionName" : "1.1.45", - "versionCode" : 1145, + "versionName" : "1.1.47", + "versionCode" : 1147, "transformPx" : false, /* 5+App鐗规湁鐩稿叧 */ "app-plus" : { diff --git a/pages/modal/3018_2.vue b/pages/modal/3018_2.vue index 29fca4f..462bf79 100644 --- a/pages/modal/3018_2.vue +++ b/pages/modal/3018_2.vue @@ -2,161 +2,10 @@ <view class="uni-page-modal-3018-2"> <view class="view-content"> <!-- 琛ㄥご鏍峰紡 --> - <uni-forms ref="baseForm" label-align="right"> - <view class="v-headStyle" v-for="(item,index) in head_styledef.form.items"> - <!-- 鏅�甯冨眬 --> - <uni-forms-item v-if="item.name != 'Layout'&& item.show==true" - :label="item.label ? item.label +'锛�:'' " :label-width="item.labelWidth+'px'"> - <!-- <text class="txt_title" :style="{'width':item.labelWidth+'px'}">{{item.label}}锛�/text> --> - <!-- 涓嬫媺妗�鍗曢� item.useDict?item.dict:item.selections--> - <uni-data-select id="dv_select" v-if="item.name=='Select'" - :style="'width: calc(100% - '+item.labelWidth-10+'px);'" - :class="item.disabled?'input-disabled':''" v-model="item.value" :localdata="item.dict" - @change="onEnterChange(item)" :disabled="item.disabled" :clear="false"></uni-data-select> - <!-- 鏂囨湰妗�鏁板瓧妗�--> - <view class="input-wrapper" v-if="(item.name=='Input' || item.name=='InputNumber')"> - <text v-if="item.setting.prefix" class="uni-icon" :class="[item.setting.prefix]" - @click="classAttr_extButton(item)"></text> - <input class="uni-input" :class="item.disabled?'input-disabled':''" - :type="item.name=='Input'?'text':item.name=='InputNumber'?'number':'text'" - v-model="item.value" :disabled="item.disabled" :placeholder="item.placeholder" - :style="{'padding-left':item.setting.prefix?0 : '8rpx','right':item.setting.suffix?0 : '8rpx'}" - :focus="focusFieldId == item.fieldId" @focus="ontap(item)" @click="onClick(item)" - @keyup.enter="onEnterChange(item)" @blur="onEnterChange(item)" :maxlength="-1" /> - <text v-if="item.setting.suffix" class="uni-icon" :class="[item.setting.suffix]" - @click="classAttr_extButton(item)"></text> - </view> - <!-- 澶氳鏂囨湰 --> - <view class="input-wrapper" v-if="item.name=='Textarea' "> - <textarea class="uni-input" :class="item.disabled?'input-disabled':''" v-model="item.value" - :focus="focusFieldId == item.fieldId" :placeholder="item.placeholder" - @blur="onEnterChange(item)" @click="onClick(item)" :data-index="index" - style="height:60px;" :style="{'width':'96%'}" :disabled="item.disabled"></textarea> + <OIForm ref="refBaseForm" class="v-headStyle" :form="head_styledef.form" :focusId="focusFieldId" + @click="onClick" @focus="ontap" @change="onEnterChange" @click-prefix="classAttr_extButton" + @click-suffix="classAttr_extButton"></OIForm> - </view> - <!-- 澶嶉�妗�--> - <checkbox-group class="check_rememberPwd" v-if="item.name=='Checkbox'" - :class="item.disabled?'input-disabled':''" :disabled="item.disabled" - @change="onCheckBoxValue" :data-attr="item.fieldId" :data-index="index"> - <label v-for="(item2) in item.selections" :key="item2.value"> - <checkbox :value="item2.value" :checked="item.value.includes(item2.value)" /> - <text>{{item2.label}}</text> - </label> - </checkbox-group> - <!-- 鍗曢�妗�--> - <radio-group class="check_rememberPwd" v-if="item.name=='Radio'" - :class="item.disabled?'input-disabled':''" :disabled="item.disabled" - @change="onRadioBoxValue" :data-attr="item.fieldId" :data-index="index"> - <label v-for="(item2) in item.selections" :key="item2.value"> - <radio :value="item2.value" :checked="item2.value === item.value" /> - <text>{{item2.label}}</text> - </label> - </radio-group> - <!-- Switch寮�叧 --> - <switch class="input-switch" v-if="item.name=='Switch'" - :class="item.disabled?'input-disabled':''" :disabled="item.disabled" v-model="item.value" - @change="onModelValue(item)" /> - <!-- 鏃ユ湡鏃堕棿 --> - <!-- <view class="input-wrapper" v-if="(item.name=='TimePicker' || item.name=='DatePicker')"> - <picker mode="date" class="date_iput" :class="item.disabled?'input-disabled':''" - :disabled="item.disabled" :value="item.value" @change="onModelValue(item)"> - <view class="picker">{{item.value}}</view> - </picker> - </view> --> - <OIDatePicker v-if="item.name=='DatePicker'" :class="item.disabled?'input-disabled':''" - :disabled="item.disabled" v-model="item.value" :placeholder="item.placeholder" - :defaultToday="item.setting.defaultToday" :format="item.setting.format" - @change="onModelValue(item)" /> - <OIDatePickerRange v-if="item.name=='DatePickerRange'" :rangeSeparator="item.setting.separator" - :format="item.setting.format" :class="item.disabled?'input-disabled':''" - :disabled="item.disabled" v-model="item.value" :placeholder="item.placeholder" - @change="onModelValue(item)" /> - <OITimePicker v-if="item.name=='TimePicker'" :class="item.disabled?'input-disabled':''" - :disabled="item.disabled" v-model="item.value" :placeholder="item.placeholder" - @change="onModelValue(item)" /> - </uni-forms-item> - <!-- 鏍呮牸甯冨眬 --> - <uni-row class="demo-uni-row" v-if="item.name=='Layout'"> - <uni-col v-for="(cols,key) in item.setting.colList" - :span="item.setting.spanList?item.setting.spanList[key]:24 / item.setting.col"> - <uni-forms-item v-if="cols!=null && cols.show==true" - :label="cols.label? cols.label +'锛�:''" :label-width="cols.labelWidth+'px'"> - <view class="input-wrapper" v-if="(cols.name=='Input' || cols.name=='InputNumber') "> - <text v-if="cols.setting.prefix" class="uni-icon" :class="[cols.setting.prefix]" - @click="classAttr_extButton(cols)"></text> - <input class="uni-input" :class="cols.disabled?'input-disabled':''" - :type="cols.name=='Input'?'text':cols.name=='InputNumber'?'number':'text'" - v-model="cols.value" :disabled="cols.disabled" :placeholder="cols.placeholder" - :style="{'padding-left':cols.setting.prefix?0 : '8px','right':cols.setting.suffix?0 : '8px'}" - :focus="focusFieldId == cols.fieldId" @focus="ontap(cols)" - @click="onClick(cols)" @keyup.enter="onEnterChange(cols)" - @blur="onEnterChange(cols)" :maxlength="-1" /> - <text v-if="cols.setting.suffix" class="uni-icon" :class="[cols.setting.suffix]" - @click="classAttr_extButton(cols)"></text> - </view> - <!-- 涓嬫媺妗�鍗曢� cols.useDict?cols.dict:cols.selections--> - <uni-data-select id="dv_select" v-if="cols.name=='Select' " - :class="cols.disabled?'input-disabled':''" v-model="cols.value" - :localdata="cols.dict" @change="onEnterChange(cols)" :disabled="cols.disabled" - :clear="false"></uni-data-select> - <!-- 澶氳鏂囨湰 --> - <view class="input-wrapper" v-if="cols.name=='Textarea' "> - <textarea class="uni-input" v-model="cols.value" - :class="cols.disabled?'input-disabled':''" :placeholder="cols.placeholder" - :focus="focusFieldId == cols.fieldId" @blur="onEnterChange(cols)" - @click="onClick(cols)" style="height:60px;" :style="{'width':'96%'}" - :disabled="cols.disabled"></textarea> - </view> - <!-- 澶嶉�妗�--> - <checkbox-group class="check_rememberPwd" v-if="cols.name=='Checkbox'" - :class="cols.disabled?'input-disabled':''" :disabled="cols.disabled" - @change="onCheckBoxValue" :data-attr="cols.fieldId" :data-index="index" - :data-iindex="key"> - <label v-for="(cols2) in cols.selections" :key="cols2.value"> - <checkbox :value="cols2.value" :checked="cols.value.includes(cols2.value)" /> - <text>{{cols2.label}}</text> - </label> - </checkbox-group> - <!-- 鍗曢�妗�--> - <radio-group class="check_rememberPwd" v-if="cols.name=='Radio'" - :class="cols.disabled?'input-disabled':''" :disabled="cols.disabled" - @change="onRadioBoxValue" :data-attr="cols.fieldId" :data-index="index" - :data-iindex="key"> - <label v-for="(cols2) in cols.selections" :key="cols2.value"> - <radio :value="cols2.value" :checked="cols2.value === cols.value" /> - <text>{{cols2.label}}</text> - </label> - </radio-group> - <!-- Switch寮�叧 --> - <switch v-if="cols.name=='Switch'" :class="cols.disabled?'input-disabled':''" - :disabled="cols.disabled" v-model="cols.value" @change="onModelValue(cols)" - :style="{'margin-left':'10rpx'}" /> - <!-- 鏃ユ湡鏃堕棿 --> - <!-- <view class="input-wrapper" - v-if="(cols.name=='TimePicker' || cols.name=='DatePicker') && !cols.disabled"> - <picker mode="date" class="date_iput" :class="cols.disabled?'input-disabled':''" - :disabled="cols.disabled" :value="cols.value" @change="onModelValue(cols)"> - <view class="picker">{{cols.value}}</view> - </picker> - </view> --> - <OIDatePicker v-if="cols.name=='DatePicker'" :class="cols.disabled?'input-disabled':''" - :disabled="cols.disabled" v-model="cols.value" :placeholder="cols.placeholder" - :defaultToday="cols.setting.defaultToday" :format="cols.setting.format" - @change="onModelValue(cols)" /> - <OIDatePickerRange v-if="cols.name=='DatePickerRange'" - :rangeSeparator="cols.setting.separator" :format="cols.setting.format" - :class="cols.disabled?'input-disabled':''" :disabled="cols.disabled" - v-model="cols.value" :placeholder="cols.placeholder" @change="onModelValue(cols)" /> - <OITimePicker v-if="cols.name=='TimePicker'" :class="cols.disabled?'input-disabled':''" - :disabled="cols.disabled" v-model="cols.value" :placeholder="cols.placeholder" - @change="onModelValue(cols)" /> - </uni-forms-item> - <uni-forms-item v-else label=""></uni-forms-item> - - </uni-col> - </uni-row> - </view> - </uni-forms> </view> <view class="view-bottom"> <view class="uni-padding-wrap" v-if="dropdownBtns.length>0"> @@ -205,10 +54,7 @@ import Base64 from '../../components/js-base64/base64.js' import utils from "@/js/utils.js" import dayjs from "dayjs"; - import OIDatePicker from '@/components/oi-date-time-picker/oi-date-picker.vue' - import OIDatePickerRange from '@/components/oi-date-time-picker/oi-date-picker-range.vue' - import OITimePicker from '@/components/oi-date-time-picker/oi-time-picker.vue' - + import OIForm from '@/components/oi-form/index.vue' import { appGetInfo, dictGetInfo @@ -224,9 +70,7 @@ Base64, }, components: { - OIDatePicker, - OIDatePickerRange, - OITimePicker + OIForm, }, data() { return { @@ -734,11 +578,17 @@ onScanValue(item, value) { const $this = this; //console.log("onScanValue", item); - if (item.oldvalue != value) { - item.oldvalue = value; - item.value = value; + item.value = value + let newVal = item.value + if (typeof item.value == "string") { + newVal = item.value.trim() + if (!newVal) + return + } + if (item.oldvalue != newVal) { + item.oldvalue = newVal; var attr = item.fieldId; - $this.head_styledef.form.model[attr] = value; + $this.head_styledef.form.model[attr] = newVal; var eventid = item.bind.onChangeEvent.id; //鍐呭鍙樺寲鍚庝簨浠� if (eventid) { var obj_attr = this.head_styledef.form.model; @@ -762,63 +612,60 @@ } this.DataObjRunCustomEvent(info, ''); } - if (item.value) { //绗竴涓緭鍏ユ涓嶄负绌�- //鍒濆鍖栵紝涓嬩釜杈撳叆妗唂ocus灞炴� - var findd = false - for (let i in $this.head_styledef.form.items) { - const ele = $this.head_styledef.form.items[i] + //鍒濆鍖栵紝涓嬩釜杈撳叆妗唂ocus灞炴� + var findd = false + for (let i in $this.head_styledef.form.items) { + const ele = $this.head_styledef.form.items[i] - if (ele.name != "Layout") { - if (ele.name == 'Input' || ele.name == 'InputNumber') { - if (attr == ele.fieldId) { - findd = true - } else { - if (findd) { - $this.setData({ - focusFieldId: ele.fieldId - }) - break - } - - } - - } - } else { - if (findd) { - let curIndex = ele.setting.colList.findIndex((col, index2, arr) => { - return (col.name == 'Input' || col.name == 'InputNumber'); - }) - if (curIndex > -1) { + if (ele.name != "Layout") { + if (ele.name == 'Input' || ele.name == 'InputNumber') { + if (attr == ele.fieldId) { + findd = true + } else { + if (findd) { $this.setData({ - focusFieldId: ele.setting.colList[curIndex] - .fieldId + focusFieldId: ele.fieldId }) break } - } else { - let curIndex = ele.setting.colList.findIndex((col, index2, arr) => { - return attr == col.fieldId; - }) - if (curIndex > -1) { - findd = true - let curIndex2 = ele.setting.colList.findIndex((col, index2, arr) => { - return (col.name == 'Input' || col.name == - 'InputNumber') && - index2 > - curIndex; - }) - if (curIndex2 > -1) { - $this.setData({ - focusFieldId: ele.setting.colList[curIndex] - .fieldId - }) - break - } - } } } + } else { + if (findd) { + let curIndex = ele.setting.colList.findIndex((col, index2, arr) => { + return (col.name == 'Input' || col.name == 'InputNumber'); + }) + if (curIndex > -1) { + $this.setData({ + focusFieldId: ele.setting.colList[curIndex] + .fieldId + }) + break + } + + } else { + let curIndex = ele.setting.colList.findIndex((col, index2, arr) => { + return attr == col.fieldId; + }) + if (curIndex > -1) { + findd = true + let curIndex2 = ele.setting.colList.findIndex((col, index2, arr) => { + return (col.name == 'Input' || col.name == + 'InputNumber') && + index2 > + curIndex; + }) + if (curIndex2 > -1) { + $this.setData({ + focusFieldId: ele.setting.colList[curIndex].fieldId + }) + break + } + } + } + } } @@ -829,11 +676,16 @@ this.focusFieldId = item.fieldId }, onEnterChange(item) { - console.log("onEnterChange", item); - if (item.oldvalue != item.value) { - item.oldvalue = item.value; + let newVal = item.value + if (typeof item.value == "string") { + newVal = item.value.trim() + if (!newVal) + return + } + if (item.oldvalue != newVal) { + item.oldvalue = newVal; var attr = item.fieldId; - this.head_styledef.form.model[attr] = item.value; + this.head_styledef.form.model[attr] = newVal; var onChangeEvent = item.bind.onChangeEvent; //鍐呭鍙樺寲鍚庝簨浠� if (onChangeEvent?.id) { //鍐呭鍙樺寲鍚庝簨浠� this.onChange(onChangeEvent); @@ -869,67 +721,6 @@ }, - onCheckBoxValue(e) { //缁戝畾Model鍊�- let values = e.detail.value || [] - const item = this.head_styledef.form.items[e.currentTarget?.dataset?.index || 0] - if (item?.setting?.colList) { - const col = item.setting.colList[e.currentTarget?.dataset?.iindex || 0] - if (col) { - col.value = values - let attr = col.fieldId; - this.head_styledef.form.model[attr] = col.value; - var onChangeEvent = col.bind.onChangeEvent; //鍐呭鍙樺寲鍚庝簨浠�- if (onChangeEvent?.id) { //鍐呭鍙樺寲鍚庝簨浠�- this.onChange(onChangeEvent); - } - return - } - } else { - if (item) { - item.value = values - let attr = item.fieldId; - this.head_styledef.form.model[attr] = item.value; - var onChangeEvent = item.bind.onChangeEvent; //鍐呭鍙樺寲鍚庝簨浠�- if (onChangeEvent?.id) { //鍐呭鍙樺寲鍚庝簨浠�- this.onChange(onChangeEvent); - } - } - } - - }, - onRadioBoxValue(e) { //缁戝畾Model鍊�- let values = e.detail.value || "" - const item = this.head_styledef.form.items[e.currentTarget?.dataset?.index || 0] - if (item?.setting?.colList) { - const col = item.setting.colList[e.currentTarget?.dataset?.iindex || 0] - if (col) { - col.value = values - let attr = col.fieldId; - this.head_styledef.form.model[attr] = col.value; - var onChangeEvent = col.bind.onChangeEvent; //鍐呭鍙樺寲鍚庝簨浠�- if (onChangeEvent?.id) { //鍐呭鍙樺寲鍚庝簨浠�- this.onChange(onChangeEvent); - } - return - } - } else { - if (item) { - item.value = values - let attr = item.fieldId; - this.head_styledef.form.model[attr] = item.value; - var onChangeEvent = item.bind.onChangeEvent; //鍐呭鍙樺寲鍚庝簨浠�- if (onChangeEvent?.id) { //鍐呭鍙樺寲鍚庝簨浠�- this.onChange(onChangeEvent); - } - } - - } - - }, - onModelValue(item) { - var attr = item.fieldId; - this.head_styledef.form.model[attr] = item.value; - }, classAttr_extButton(item) { var onSuffixClickCallbackEvent = item.bind.onSuffixClickCallbackEvent; //鍚庡浘鏍囩偣鍑讳簨浠� var onSuffixClickEvent = item.bind.onSuffixClickEvent; //鍚庡浘鏍囩偣鍑诲洖璋�diff --git a/pages/modal/3037_2.vue b/pages/modal/3037_2.vue index 9487d2a..1aff5ff 100644 --- a/pages/modal/3037_2.vue +++ b/pages/modal/3037_2.vue @@ -1,81 +1,8 @@ <template> <view class="uni-page-modal-3017-2"> <!-- 琛ㄥご鏍峰紡 --> - <view class="v-headStyle" v-for="(item,index) in head_styledef.form.items"> - <!-- 鏅�甯冨眬 --> - <view v-if="item.name!='Layout' && item.show==true"> - <text class="txt_title" :style="{'width':item.labelWidth+'px'}">{{item.label}}锛�/text> - <!-- 涓嬫媺妗�鍗曢� item.useDict?item.dict:item.selections--> - <uni-data-select id="dv_select" v-if="item.name=='Select'" :class="item.disabled?'input-disabled':''" - v-model="item.value" :localdata="item.dict" @change="onEnterChange(item)" :disabled="item.disabled" - :clear="false"></uni-data-select> - <!-- 鏂囨湰妗�鏁板瓧妗�--> - <view class="input-wrapper" v-if="item.name=='Input' || item.name=='InputNumber'"> - <text v-if="item.setting.prefix" class="uni-icon" :class="[item.setting.prefix]" - @click="classAttr_extButton(item)"></text> - <input class="uni-input" :class="item.disabled?'input-disabled':''" - :type="item.name=='Input'?'text':item.name=='InputNumber'?'number':'text'" v-model="item.value" - :disabled="item.disabled" :placeholder="item.placeholder" - :style="{'width':item.setting.prefix && item.setting.suffix?'78%':item.setting.prefix || item.setting.suffix?'87%':'96%'}" - :focus="focusMateria" @focus="ontap(item)" @keyup.enter="onEnterChange(item)" - @blur="onEnterChange(item)" :maxlength="-1" /> - <text v-if="item.setting.suffix" class="uni-icon" :class="[item.setting.suffix]" - @click="classAttr_extButton(item)"></text> - </view> - <!-- 澶氳鏂囨湰 --> - <view class="input-wrapper" v-if="item.name=='Textarea'"> - <textarea class="uni-input" :class="item.disabled?'input-disabled':''" v-model="item.value" - :placeholder="item.placeholder" @blur="onEnterChange(item)" - :data-index="index" style="height:60px;" :style="{'width':'96%'}" - :disabled="item.disabled"></textarea> - - </view> - <!-- 澶嶉�妗�--> - <checkbox-group class="check_rememberPwd" v-if="item.name=='Checkbox'" - :class="item.disabled?'input-disabled':''" :disabled="item.disabled" @change="onCheckBoxValue" - :data-attr="item.fieldId" :data-index="index"> - <label v-for="(item2) in item.selections" :key="item2.value"> - <checkbox :value="item2.value" :checked="item.value.includes(item2.value)" /> - <text>{{item2.label}}</text> - </label> - </checkbox-group> - <!-- 鍗曢�妗�--> - <radio-group class="check_rememberPwd" v-if="item.name=='Radio'" - :class="item.disabled?'input-disabled':''" :disabled="item.disabled" @change="onRadioBoxValue" - :data-attr="item.fieldId" :data-index="index"> - <label v-for="(item2) in item.selections" :key="item2.value"> - <radio :value="item2.value" :checked="item2.value === item.value" /> - <text>{{item2.label}}</text> - </label> - </radio-group> - <!-- Switch寮�叧 --> - <switch v-if="item.name=='Switch'" :class="item.disabled?'input-disabled':''" :disabled="item.disabled" - v-model="item.value" @change="onModelValue(item)" :style="{'margin-left':'10rpx'}" /> - <!-- 鏃ユ湡鏃堕棿 --> - <!-- <view class="input-wrapper" v-if="item.name=='TimePicker' || item.name=='DatePicker'"> - <picker mode="date" class="date_iput" :class="item.disabled?'input-disabled':''" - :disabled="item.disabled" :value="item.value" @change="onModelValue(item)"> - <view class="picker">{{item.value}}</view> - </picker> - </view> - --> - <view class="input-wrapper" - v-if="item.name=='TimePicker' || item.name=='DatePicker'|| item.name=='DatePickerRange'"> - <OIDatePicker v-if="item.name=='DatePicker'" :class="item.disabled?'input-disabled':''" - :disabled="item.disabled" v-model="item.value" :placeholder="item.placeholder" - :defaultToday="item.setting.defaultToday" :format="item.setting.format" - @change="onModelValue(item)" /> - <OIDatePickerRange v-if="item.name=='DatePickerRange'" :rangeSeparator="item.setting.separator" - :format="item.setting.format" :class="item.disabled?'input-disabled':''" - :disabled="item.disabled" v-model="item.value" :placeholder="item.placeholder" - @change="onModelValue(item)" /> - <OITimePicker v-if="item.name=='TimePicker'" :class="item.disabled?'input-disabled':''" - :disabled="item.disabled" v-model="item.value" :placeholder="item.placeholder" - @change="onModelValue(item)" /> - </view> - </view> - - </view> + <OIForm ref="refBaseForm" class="v-headStyle" :form="head_styledef.form" @focus="ontap" @change="onEnterChange" + @click-prefix="classAttr_extButton" @click-suffix="classAttr_extButton"></OIForm> <!-- 浠庢暟鎹�--> <view class="v-panel"> <div class="panel_title">{{param.Sub_Cls.Title}}</div> @@ -105,39 +32,7 @@ <!-- 浠庢暟鎹樉绀鸿鎯呭尯 --> <view class="v-panellist" v-for="(subpanel,iiindex) in subPanelList" @tap="onPanelClick(iiindex)" :class="activelist[iiindex].active==true?'bk-active':''"> - <view class="v-area dv-panel" v-for="(item,index) in subpanel.subClassAttr.form.items"> - <div class="dv-panel-input"> - <!-- 鏅�甯冨眬 --> - <view v-if="item.name!='Layout' && item.show==true"> - <text class="txt_title" :style="{'width':item.labelWidth+'px'}">{{item.label}}锛�/text> - <span class="form-item-span" v-if="item.disabled">{{item.value}}</span> - <!-- 鏂囨湰妗�鏁板瓧妗�--> - <view v-else class="input-wrapper"> - <input :type="item.name=='InputNumber'?'number':'text'" v-model="item.value" - :placeholder="item.placeholder" :maxlength="-1" - @on-enter="onDetail1EnterChange(item)" /> - </view> - </view> - <!-- 鏍呮牸甯冨眬 --> - <uni-row class="demo-uni-row" v-if="item.name=='Layout' && item.show==true"> - <uni-col v-for="(cols,key) in item.setting.colList" - :span="item.setting.spanList?item.setting.spanList[key]:24 / item.setting.col"> - <view v-if="cols!=null"> - <text class="txt_title" - :style="{'width':cols.labelWidth+'px'}">{{cols.label}}锛�/text> - <span class="form-item-span" v-if="cols.disabled">{{cols.value}}</span> - <!-- 鏂囨湰妗�鏁板瓧妗�--> - <view v-else class="input-wrapper"> - <input :type="cols.name=='InputNumber'?'number':'text'" v-model="cols.value" - :placeholder="cols.placeholder" :maxlength="-1" - @on-enter="onDetail1EnterChange(cols)" /> - </view> - - </view> - </uni-col> - </uni-row> - </div> - </view> + <OIForm class="v-area dv-panel" :form="subpanel.subClassAttr.form" viewMode></OIForm> <view class="v-paneldel" v-if="param.Sub_Cls.Can_Add_Delete == true"> <a href="javascript:;" class="panel_del" @tap="panel_del(iiindex)"><i @@ -199,18 +94,14 @@ dataObjDel } from "@/api/data.js" import dayjs from "dayjs"; - import OIDatePicker from '@/components/oi-date-time-picker/oi-date-picker.vue' - import OIDatePickerRange from '@/components/oi-date-time-picker/oi-date-picker-range.vue' - import OITimePicker from '@/components/oi-date-time-picker/oi-time-picker.vue' + import OIForm from '@/components/oi-form/index.vue' export default { modules: { Base64, }, components: { - OIDatePicker, - OIDatePickerRange, - OITimePicker + OIForm }, data() { return { @@ -694,20 +585,19 @@ uni.hideKeyboard(); var $this = this; console.log(item); - if (item.oldvalue != result.decodedata) { - item.oldvalue = result.decodedata; - item.value = result.decodedata; + item.value = result.decodedata + let newVal = item.value.trim() + if (item.oldvalue != newVal) { + item.oldvalue = newVal; var attr = item.fieldId; - $this.head_styledef.form.model[attr] = result.decodedata; - if (result.decodedata) { //绗竴涓緭鍏ユ涓嶄负绌�- $this.focusMateria = true; //鍒濆鍖栵紝绗簩涓緭鍏ユfocus灞炴� - // setTimeout(function(){ - // $this.focusMateria=true; //绗簩涓緭鍏ユ鑾峰彇鐒︾偣 - setTimeout(function() { - uni.hideKeyboard(); - }, 1000); - // },500); - } + $this.head_styledef.form.model[attr] = newVal; + $this.focusMateria = true; //鍒濆鍖栵紝绗簩涓緭鍏ユfocus灞炴� + // setTimeout(function(){ + // $this.focusMateria=true; //绗簩涓緭鍏ユ鑾峰彇鐒︾偣 + setTimeout(function() { + uni.hideKeyboard(); + }, 1000); + // },500); //瀛愭暟鎹被鎵爜鍖轰簨浠惰剼鏈� var eventid = this.$data.param.Scan_Code.Input_Change_Event.ID; if (eventid) { @@ -730,7 +620,7 @@ mast_attr: [], inputParamter: [{ attr: 'mast_input_3037', - value: result.decodedata + value: newVal }] } @@ -743,10 +633,16 @@ // console.log(e.target); var $this = this; console.log(item); - if (item.oldvalue != item.value && item.value.trim() != "") { - item.oldvalue = item.value; + let newVal = item.value + if (typeof item.value == "string") { + newVal = item.value.trim() + if (!newVal) + return + } + if (item.oldvalue != newVal) { + item.oldvalue = newVal; var attr = item.fieldId; - $this.head_styledef.form.model[attr] = item.value; + $this.head_styledef.form.model[attr] = newVal; //瀛愭暟鎹被鎵爜鍖轰簨浠惰剼鏈� var eventid = this.$data.param.Scan_Code.Input_Change_Event.ID; if (eventid) { @@ -769,7 +665,7 @@ mast_attr: [], inputParamter: [{ attr: 'mast_input_3037', - value: item.value + value: newVal }] } @@ -1125,10 +1021,16 @@ onEnterChange(item) { console.log("onEnterChange", item); - if (item.oldvalue != item.value && item.value.trim() != "") { - item.oldvalue = item.value; + let newVal = item.value + if (typeof item.value == "string") { + newVal = item.value.trim() + if (!newVal) + return + } + if (item.oldvalue != newVal) { + item.oldvalue = newVal; var attr = item.fieldId; - this.head_styledef.form.model[attr] = item.value; + this.head_styledef.form.model[attr] = newVal; var onChangeEvent = item.bind.onChangeEvent; //鍐呭鍙樺寲鍚庝簨浠� if (onChangeEvent?.id) { //鍐呭鍙樺寲鍚庝簨浠� this.onChange(onChangeEvent); @@ -1272,68 +1174,6 @@ } } } - }, - onCheckBoxValue(e) { //缁戝畾Model鍊�- let values = e.detail.value || [] - const item = this.head_styledef.form.items[e.currentTarget?.dataset?.index || 0] - if (item?.setting?.colList) { - const col = item.setting.colList[e.currentTarget?.dataset?.iindex || 0] - if (col) { - col.value = values - let attr = col.fieldId; - this.head_styledef.form.model[attr] = col.value; - var onChangeEvent = col.bind.onChangeEvent; //鍐呭鍙樺寲鍚庝簨浠�- if (onChangeEvent?.id) { //鍐呭鍙樺寲鍚庝簨浠�- this.onChange(onChangeEvent); - } - return - } - } else { - if (item) { - item.value = values - let attr = item.fieldId; - this.head_styledef.form.model[attr] = item.value; - var onChangeEvent = item.bind.onChangeEvent; //鍐呭鍙樺寲鍚庝簨浠�- if (onChangeEvent?.id) { //鍐呭鍙樺寲鍚庝簨浠�- this.onChange(onChangeEvent); - } - } - } - - }, - onRadioBoxValue(e) { //缁戝畾Model鍊�- let values = e.detail.value || "" - const item = this.head_styledef.form.items[e.currentTarget?.dataset?.index || 0] - if (item?.setting?.colList) { - const col = item.setting.colList[e.currentTarget?.dataset?.iindex || 0] - if (col) { - col.value = values - let attr = col.fieldId; - this.head_styledef.form.model[attr] = col.value; - var onChangeEvent = col.bind.onChangeEvent; //鍐呭鍙樺寲鍚庝簨浠�- if (onChangeEvent?.id) { //鍐呭鍙樺寲鍚庝簨浠�- this.onChange(onChangeEvent); - } - return - } - } else { - if (item) { - item.value = values - let attr = item.fieldId; - this.head_styledef.form.model[attr] = item.value; - var onChangeEvent = item.bind.onChangeEvent; //鍐呭鍙樺寲鍚庝簨浠�- if (onChangeEvent?.id) { //鍐呭鍙樺寲鍚庝簨浠�- this.onChange(onChangeEvent); - } - } - - } - - }, - onModelValue(item) { //缁戝畾Model鍊�- //console.log(e.target) - var attr = item.fieldId; - this.head_styledef.form.model[attr] = item.value; }, panel_del(index) { //闈㈡澘鍒犻櫎 diff --git a/pages/modal/3200.vue b/pages/modal/3200.vue index 45fb2f3..e8899f1 100644 --- a/pages/modal/3200.vue +++ b/pages/modal/3200.vue @@ -2,40 +2,8 @@ <view class="uni-page-modal-3200"> <view class="v-content"> <!-- 琛ㄥご鏍峰紡 --> - <view class="v-headStyle" v-for="(item,index) in head_styledef.form.items" v-if="isFilter==true"> - <text class="txt_title" :style="{'width':item.labelWidth+'px'}">{{item.label}}锛�/text> - <!-- 涓嬫媺妗�鍗曢� item.useDict?item.dict:item.selections--> - <uni-data-select id="dv_select" v-if="item.name=='Select'" :class="item.disabled?'input-disabled':''" - v-model="item.value" :localdata="item.dict" @change="onEnterChange(item)" :disabled="item.disabled" - :clear="false"></uni-data-select> - <view class="input-wrapper" v-if="item.name=='Input' || item.name=='InputNumber'"> - <text v-if="item.setting.prefix" class="uni-icon" :class="[item.setting.prefix]" - @click="onEnterChange(item)"></text> - <input class="uni-input" :class="item.disabled?'input-disabled':''" - :type="item.name=='Input'?'text':'number'" v-model="item.value" :disabled="item.disabled" - :placeholder="item.placeholder" - :style="{'width':item.setting.prefix && item.setting.suffix?'78%':item.setting.prefix || item.setting.suffix?'87%':'96%'}" - :focus="focusMateria" @focus="ontap(item)" @keyup.enter="onEnterChange(item)" - @blur="onEnterChange(item)" :maxlength="-1" /> - <text v-if="item.setting.suffix" class="uni-icon" :class="[item.setting.suffix]" - @click="onEnterChange(item)"></text> - </view> - <view class="input-wrapper" - v-if="item.name=='TimePicker' || item.name=='DatePicker'|| item.name=='DatePickerRange'"> - <OIDatePicker v-if="item.name=='DatePicker'" :class="item.disabled?'input-disabled':''" - :disabled="item.disabled" v-model="item.value" :placeholder="item.placeholder" - :defaultToday="item.setting.defaultToday" :format="item.setting.format" - @change="onModelValue(item)" /> - <OIDatePickerRange v-if="item.name=='DatePickerRange'" :rangeSeparator="item.setting.separator" - :format="item.setting.format" :class="item.disabled?'input-disabled':''" - :disabled="item.disabled" v-model="item.value" :placeholder="item.placeholder" - @change="onModelValue(item)" /> - <OITimePicker v-if="item.name=='TimePicker'" :class="item.disabled?'input-disabled':''" - :disabled="item.disabled" v-model="item.value" :placeholder="item.placeholder" - @change="onModelValue(item)" /> - </view> - </view> - + <OIForm ref="refBaseForm" class="v-headStyle" :form="head_styledef.form" @focus="ontap" + @change="onEnterChange" @click-prefix="onEnterChange" @click-suffix="onEnterChange"></OIForm> <view class="v-scroll-view"> <scroll-view :scroll-top="scrollTop" :scroll-y="true" class="scroll-y" @scrolltolower="scrolltolower" @scroll="scroll"> @@ -51,45 +19,14 @@ </checkbox-group> </div> <!-- HTML椤甸潰绫诲瀷鏄剧ず --> - <div class="dv-listHtml-Panel" v-if="ListHtml_Panel" v-html="ListHtml_Panel[ii]" :style="param.ListPage.CheckBox==true && param.ListPage.Click_View==true?'width:85%;': - param.ListPage.CheckBox==false && param.ListPage.Click_View==true?'width:91%;': - param.ListPage.CheckBox==true && param.ListPage.Click_View==false?'width:88%;':'width:100%;'"> + <div class="dv-listHtml-Panel" v-if="ListHtml_Panel" v-html="ListHtml_Panel[ii]" + :style="param.ListPage.CheckBox==true && param.ListPage.Click_View==true?'width:85%;': param.ListPage.CheckBox==false && param.ListPage.Click_View==true?'width:91%;':param.ListPage.CheckBox==true && param.ListPage.Click_View==false?'width:88%;':'width:100%;'"> </div> - <div class="dv-panel-input" v-if="!ListHtml_Panel" :style="param.ListPage.CheckBox==true && param.ListPage.Click_View==true?'width:85%;': - param.ListPage.CheckBox==false && param.ListPage.Click_View==true?'width:91%;': - param.ListPage.CheckBox==true && param.ListPage.Click_View==false?'width:88%;':'width:100%;'"> - <div v-for="(item,index) in style.form.items"> - <!-- 鏅�甯冨眬 --> - <view v-if="item.name!='Layout'"> - <text class="txt_title" - :style="{'width':item.labelWidth+'px'}">{{item.label}}锛�/text> - <span class="form-item-span" v-if="item.disabled">{{item.value}}</span> - <!-- 鏂囨湰妗�鏁板瓧妗�--> - <view v-else class="form-item-input"> - <input :type="item.name=='InputNumber'?'number':'text'" v-model="item.value" - :placeholder="item.placeholder" :maxlength="-1" - @on-enter="onDetail1EnterChange(item)" /> - </view> - </view> - <!-- 鏍呮牸甯冨眬 --> - <uni-row class="demo-uni-row" v-if="item.name=='Layout'"> - <uni-col v-for="(cols,key) in item.setting.colList" - :span="item.setting.spanList?item.setting.spanList[key]:24 / item.setting.col"> - <view v-if="cols!=null"> - <text class="txt_title" - :style="{'width':cols.labelWidth+'px'}">{{cols.label}}锛�/text> - <span class="form-item-span" v-if="cols.disabled">{{cols.value}}</span> - <!-- 鏂囨湰妗�鏁板瓧妗�--> - <view v-else class="form-item-input"> - <input :type="cols.name=='InputNumber'?'number':'text'" - v-model="cols.value" :placeholder="cols.placeholder" - :maxlength="-1" @on-enter="onDetail1EnterChange(cols)" /> - </view> - </view> - </uni-col> - </uni-row> - </div> + <div class="dv-panel-input" v-if="!ListHtml_Panel" + :style="param.ListPage.CheckBox==true && param.ListPage.Click_View==true?'width:85%;':param.ListPage.CheckBox==false && param.ListPage.Click_View==true?'width:91%;':param.ListPage.CheckBox==true && param.ListPage.Click_View==false?'width:88%;':'width:100%;'"> + <OIForm class="v-area dv-panel" :form="style.form.items" viewMode></OIForm> + </div> <div class="dv-panel-button" v-if="param.ListPage.Click_View==true"> <a @click="onViewPageClick(style)"><i class="mobox-normal-right-arrow" /></a> @@ -140,17 +77,14 @@ dataObjDel } from "@/api/data.js" import dayjs from "dayjs"; - import OIDatePicker from '@/components/oi-date-time-picker/oi-date-picker.vue' - import OIDatePickerRange from '@/components/oi-date-time-picker/oi-date-picker-range.vue' - import OITimePicker from '@/components/oi-date-time-picker/oi-time-picker.vue' + import OIForm from '@/components/oi-form/index.vue' + export default { modules: { Base64, }, components: { - OIDatePicker, - OIDatePickerRange, - OITimePicker + OIForm }, onNavigationBarButtonTap(e) { // console.log(e); @@ -1260,12 +1194,15 @@ item.value = result.decodedata; uni.hideKeyboard(); var $this = this; - console.log(item); - if (item.oldvalue != item.value) { - item.oldvalue = item.value; + let newVal = item.value.trim() + if (!newVal) + return + if (item.oldvalue != newVal) { + item.oldvalue = newVal; + var attr = item.fieldId; - this.head_styledef.form.model[attr] = item.value; + this.head_styledef.form.model[attr] = newVal; var onChangeEvent = item.bind.onChangeEvent; //鍐呭鍙樺寲鍚庝簨浠� var onSuffixClickCallbackEvent = item.bind .onSuffixClickCallbackEvent; //鍚庡浘鏍囩偣鍑讳簨浠�@@ -1276,24 +1213,19 @@ if (onChangeEvent.id) { //鍐呭鍙樺寲鍚庝簨浠� $this.onChange(onChangeEvent); } else { - $this.where = ''; - if (item.value) - $this.where = item.fieldId + " like '%" + item - .value + "%'"; + $this.where = item.fieldId + " like '%" + newVal + "%'"; $this.query_id = ''; $this.pageindex = 1; $this.detail1StyleDefList = []; $this.loadDataGetList(); } - if (item.value) { //绗竴涓緭鍏ユ涓嶄负绌�- $this.focusMateria = true; //鍒濆鍖栵紝绗簩涓緭鍏ユfocus灞炴� - // setTimeout(function(){ - // $this.focusMateria=true; //绗簩涓緭鍏ユ鑾峰彇鐒︾偣 - setTimeout(function() { - uni.hideKeyboard(); - }, 1000); - // },500); - } + $this.focusMateria = true; //鍒濆鍖栵紝绗簩涓緭鍏ユfocus灞炴� + // setTimeout(function(){ + // $this.focusMateria=true; //绗簩涓緭鍏ユ鑾峰彇鐒︾偣 + setTimeout(function() { + uni.hideKeyboard(); + }, 1000); + // },500); // if(onSuffixClickCallbackEvent.id){ //鍚庡浘鏍囩偣鍑讳簨浠� // this.onSuffixClick(onSuffixClickCallbackEvent); // } @@ -1306,10 +1238,16 @@ onEnterChange(item) { //鍥炶溅锛岀偣鍑绘寜閽紝鍙栨秷鑺傜偣浜嬩欢 // console.log(item); - if (item.oldvalue != item.value) { - item.oldvalue = item.value; + let newVal = item.value + if (typeof item.value == "string") { + newVal = item.value.trim() + if (!newVal) + return + } + if (item.oldvalue != newVal) { + item.oldvalue = newVal; var attr = item.fieldId; - this.head_styledef.form.model[attr] = item.value; + this.head_styledef.form.model[attr] = newVal; var onChangeEvent = item.bind.onChangeEvent; //鍐呭鍙樺寲鍚庝簨浠� var onSuffixClickCallbackEvent = item.bind .onSuffixClickCallbackEvent; //鍚庡浘鏍囩偣鍑讳簨浠�@@ -1319,9 +1257,7 @@ if (onChangeEvent.id) { //鍐呭鍙樺寲鍚庝簨浠� this.onChange(onChangeEvent); } else { - this.where = ''; - if (item.value) - this.where = item.fieldId + " like '%" + item.value + "%'"; + this.where = item.fieldId + " like '%" + item.value + "%'"; this.query_id = ''; this.pageindex = 1; this.detail1StyleDefList = []; @@ -1495,68 +1431,6 @@ }); } - }, - onCheckBoxValue(e) { //缁戝畾Model鍊�- let values = e.detail.value || [] - const item = this.head_styledef.form.items[e.currentTarget?.dataset?.index || 0] - if (item?.setting?.colList) { - const col = item.setting.colList[e.currentTarget?.dataset?.iindex || 0] - if (col) { - col.value = values - let attr = col.fieldId; - this.head_styledef.form.model[attr] = col.value; - var onChangeEvent = col.bind.onChangeEvent; //鍐呭鍙樺寲鍚庝簨浠�- if (onChangeEvent?.id) { //鍐呭鍙樺寲鍚庝簨浠�- this.onChange(onChangeEvent); - } - return - } - } else { - if (item) { - item.value = values - let attr = item.fieldId; - this.head_styledef.form.model[attr] = item.value; - var onChangeEvent = item.bind.onChangeEvent; //鍐呭鍙樺寲鍚庝簨浠�- if (onChangeEvent?.id) { //鍐呭鍙樺寲鍚庝簨浠�- this.onChange(onChangeEvent); - } - } - } - - }, - onRadioBoxValue(e) { //缁戝畾Model鍊�- let values = e.detail.value || "" - const item = this.head_styledef.form.items[e.currentTarget?.dataset?.index || 0] - if (item?.setting?.colList) { - const col = item.setting.colList[e.currentTarget?.dataset?.iindex || 0] - if (col) { - col.value = values - let attr = col.fieldId; - this.head_styledef.form.model[attr] = col.value; - var onChangeEvent = col.bind.onChangeEvent; //鍐呭鍙樺寲鍚庝簨浠�- if (onChangeEvent?.id) { //鍐呭鍙樺寲鍚庝簨浠�- this.onChange(onChangeEvent); - } - return - } - } else { - if (item) { - item.value = values - let attr = item.fieldId; - this.head_styledef.form.model[attr] = item.value; - var onChangeEvent = item.bind.onChangeEvent; //鍐呭鍙樺寲鍚庝簨浠�- if (onChangeEvent?.id) { //鍐呭鍙樺寲鍚庝簨浠�- this.onChange(onChangeEvent); - } - } - - } - - }, - - onModelValue(item) { - var attr = item.fieldId; - this.head_styledef.form.model[attr] = item.value; }, onDetail1EnterChange() {}, //鐐逛腑琛ㄥ崟 @@ -2015,71 +1889,8 @@ height: calc(100vh - 30rpx); padding: 15rpx 0; - .v-headStyle:first-child { - margin-top: 15rpx; - } - - .v-headStyle .txt_title { - font-size: 34rpx; - text-align: right; - display: inline-block; - vertical-align: 24rpx; - } - - .v-headStyle input { - display: inline-block; - /* border: 1px solid #d5d5d5; */ - /* width: 65%; */ - width: 85%; - height: 52rpx; - line-height: 34rpx; - background: #FFF; - border-radius: 0 !important; - color: #2d8cf0; - padding: 10rpx 8rpx 12rpx; - font-size: 34rpx; - font-family: inherit; - box-shadow: none !important; - transition-duration: 0.1s; - margin-top: 4rpx; - } - - .v-headStyle input::-webkit-input-placeholder { - font-size: 12rpx; - } - - .input-wrapper { - border: 1px solid #d5d5d5; - display: inline-block; - width: 65%; - line-height: 22rpx; - } - - [nvue] uni-view { - position: relative; - border: 0 solid #000; - box-sizing: border-box; - } - - .uni-input { - /* border: none; */ - } - - .uni-icon { - /* border: 1px solid red; */ - width: 30rpx; - padding: 10rpx 5rpx; - font-family: uniicons; - font-size: 40rpx; - font-weight: 400; - font-style: normal; - /* width: 48rpx; */ - height: 48rpx; - line-height: 48rpx; - color: #2d8cf0; - cursor: pointer; - display: inline-block; - vertical-align: 18rpx; + .v-headStyle { + width: 98%; } .v-content { diff --git a/pages/modal/3200_view.vue b/pages/modal/3200_view.vue index 63b1fa5..d10f7d2 100644 --- a/pages/modal/3200_view.vue +++ b/pages/modal/3200_view.vue @@ -12,172 +12,8 @@ </div> <!-- 鑷畾涔夎〃鍗曠被鍨嬫樉绀�--> <div v-if="!ViewHtml_Panel"> - <div v-for="(item,index) in detail2_styledef.form.items"> - <!-- 鏅�甯冨眬 --> - <view v-if="item.name!='Layout'"> - <text class="txt_title" :style="{'width':item.labelWidth+'px'}">{{item.label}}锛�/text> - <!-- 鏂囨湰妗�鏁板瓧妗�--> - <view class="dv_input" v-if="(item.name=='Input' || item.name=='InputNumber') "> - <text v-if="item.setting.prefix" class="uni-icon" :class="[item.setting.prefix]" - @click="onEnterChange(item)"></text> - <input class="uni-input" :class="item.disabled?'input-disabled':''" - :type="item.name=='Input'?'text':item.name=='InputNumber'?'number':'text'" - v-model="item.value" :disabled="item.disabled" :placeholder="item.placeholder" - :style="{'width':item.setting.prefix && item.setting.suffix?'78%':item.setting.prefix || item.setting.suffix?'87%':'96%'}" - :focus="focusMateria" @focus="ontap(item)" @keyup.enter="onEnterChange(item)" - @blur="onEnterChange(item)" :maxlength="-1" /> - <text v-if="item.setting.suffix" class="uni-icon" :class="[item.setting.suffix]" - @click="onEnterChange(item)"></text> - </view> - <!-- 涓嬫媺妗�鍗曢� item.useDict?item.dict:item.selections--> - <uni-data-select id="dv_select" v-if="item.name=='Select'" - :class="item.disabled?'input-disabled':''" v-model="item.value" - :localdata="item.dict" @change="onEnterChange(item)" :disabled="item.disabled" - :clear="false"></uni-data-select> - <!-- 澶氳鏂囨湰 --> - <view class="input-wrapper" v-if="item.name=='Textarea'"> - <textarea class="uni-input" :value="item.value" - :class="item.disabled?'input-disabled':''" :placeholder="item.placeholder" - @blur="onEnterChange(item)" style="height:60px;" :style="{'width':'96%'}" - :disabled="item.disabled"></textarea> - </view> - <!-- 澶嶉�妗�--> - <checkbox-group class="check_rememberPwd" v-if="item.name=='Checkbox'" - :class="item.disabled?'input-disabled':''" :disabled="item.disabled" - @change="onCheckBoxValue" :data-attr="item.fieldId" :data-index="index"> - <label v-for="(item2) in item.selections" :key="item2.value"> - <checkbox :value="item2.value" :checked="item.value.includes(item2.value)" /> - <text>{{item2.label}}</text> - </label> - </checkbox-group> - <!-- 鍗曢�妗�--> - <radio-group class="check_rememberPwd" v-if="item.name=='Radio'" - :class="item.disabled?'input-disabled':''" :disabled="item.disabled" - :style="{'margin-left':'10rpx'}" @change="onRadioBoxValue" :data-attr="item.fieldId" - :data-index="index"> - <label v-for="(item2) in item.selections" :key="item2.value"> - <radio :value="item2.value" :checked="item2.value === item.value" /> - <text>{{item2.label}}</text> - </label> - </radio-group> - <!-- Switch寮�叧 --> - <switch v-if="item.name=='Switch'" :class="item.disabled?'input-disabled':''" - :disabled="item.disabled" v-model="item.value" @change="onModelValue(item)" - :style="{'margin-left':'10rpx'}" /> - <!-- 鏃ユ湡鏃堕棿 --> - <!-- <view class="input-wrapper" - v-if="(item.name=='TimePicker' || item.name=='DatePicker') "> - <picker mode="date" class="date_iput" :class="item.disabled?'input-disabled':''" - :disabled="item.disabled" :value="item.value" @change="onModelValue(item)"> - <view class="picker">{{item.value}}</view> - </picker> - </view> --> - <view class="input-wrapper" - v-if="(item.name=='TimePicker' || item.name=='DatePicker' || item.name=='DatePickerRange') "> - <OIDatePicker v-if="item.name=='DatePicker'" - :class="item.disabled?'input-disabled':''" :disabled="item.disabled" - v-model="item.value" :placeholder="item.placeholder" - :defaultToday="item.setting.defaultToday" :format="item.setting.format" - @change="onModelValue(item)" /> - <OIDatePickerRange v-if="item.name=='DatePickerRange'" - :rangeSeparator="item.setting.separator" :format="item.setting.format" - :class="item.disabled?'input-disabled':''" :disabled="item.disabled" - v-model="item.value" :placeholder="item.placeholder" - @change="onModelValue(item)" /> - <OITimePicker v-if="item.name=='TimePicker'" - :class="item.disabled?'input-disabled':''" :disabled="item.disabled" - v-model="item.value" :placeholder="item.placeholder" - @change="onModelValue(item)" /> - </view> - </view> - <!-- 鏍呮牸甯冨眬 --> - <uni-row class="demo-uni-row" v-if="item.name=='Layout'"> - <uni-col v-for="(cols,key) in item.setting.colList" - :span="item.setting.spanList?item.setting.spanList[key]:24 / item.setting.col"> - <view v-if="cols!=null"> - <text class="txt_title" - :style="{'width':cols.labelWidth+'px'}">{{cols.label}}锛�/text> - <view class="dv_input" v-if="(cols.name=='Input' || cols.name=='InputNumber') "> - <text v-if="cols.setting.prefix" class="uni-icon" - :class="[cols.setting.prefix]" - @click="onEnterChange(cols)"></text> - <input class="uni-input" :class="cols.disabled?'input-disabled':''" - :type="cols.name=='Input'?'text':cols.name=='InputNumber'?'number':'text'" - v-model="cols.value" :disabled="cols.disabled" - :placeholder="cols.placeholder" - :style="{'width':cols.setting.prefix && cols.setting.suffix?'78%':cols.setting.prefix || cols.setting.suffix?'87%':'96%'}" - :focus="focusMateria" @focus="ontap(cols)" @blur="onEnterChange(cols)" - @keyup.enter="onEnterChange(cols)" :maxlength="-1" /> - <text v-if="cols.setting.suffix" class="uni-icon" - :class="[cols.setting.suffix]" - @click="onEnterChange(cols)"></text> - </view> - <!-- 涓嬫媺妗�鍗曢� cols.useDict?cols.dict:cols.selections--> - <uni-data-select id="dv_select" v-if="cols.name=='Select' " - :class="cols.disabled?'input-disabled':''" v-model="cols.value" - :localdata="cols.dict" @change="onEnterChange(cols)" - :disabled="cols.disabled" :clear="false"></uni-data-select> - <!-- 澶氳鏂囨湰 --> - <view class="input-wrapper" v-if="cols.name=='Textarea' "> - <textarea class="uni-input" :value="cols.value" - :class="cols.disabled?'input-disabled':''" - :placeholder="cols.placeholder" @blur="onEnterChange(cols)" - style="height:60px;" :style="{'width':'96%'}" - :disabled="cols.disabled"></textarea> - </view> - <!-- 澶嶉�妗�--> - <checkbox-group class="check_rememberPwd" v-if="cols.name=='Checkbox'" - :class="cols.disabled?'input-disabled':''" :disabled="cols.disabled" - @change="onCheckBoxValue" :data-attr="cols.fieldId" :data-index="index" - :data-iindex="key"> - <label v-for="(cols2) in cols.selections" :key="cols2.value"> - <checkbox :value="cols2.value" - :checked="cols.value.includes(cols2.value)" /> - <text>{{cols2.label}}</text> - </label> - </checkbox-group> - <!-- 鍗曢�妗�--> - <radio-group class="check_rememberPwd" v-if="cols.name=='Radio'" - :class="cols.disabled?'input-disabled':''" :disabled="cols.disabled" - :style="{'margin-left':'10rpx'}" @change="onRadioBoxValue" - :data-attr="cols.fieldId" :data-index="index" :data-iindex="key"> - <label v-for="(cols2) in cols.selections" :key="cols2.value"> - <radio :value="cols2.value" :checked="cols2.value === cols.value" /> - <text>{{cols2.label}}</text> - </label> - </radio-group> - <!-- Switch寮�叧 --> - <switch v-if="cols.name=='Switch'" :class="cols.disabled?'input-disabled':''" - :disabled="cols.disabled" v-model="cols.value" @change="onModelValue(cols)" - :style="{'margin-left':'10rpx'}" /> - <!-- 鏃ユ湡鏃堕棿 --> - <view class="input-wrapper" - v-if="(cols.name=='TimePicker' || cols.name=='DatePicker') && !cols.disabled"> - <!-- <picker mode="date" class="date_iput" - :class="cols.disabled?'input-disabled':''" :disabled="item.disabled" - :value="cols.value" @change="onModelValue(cols)"> - <view class="picker">{{cols.value}}</view> - </picker> --> - <OIDatePicker v-if="cols.name=='DatePicker'" - :class="cols.disabled?'input-disabled':''" :disabled="cols.disabled" - v-model="cols.value" :placeholder="cols.placeholder" - :defaultToday="cols.setting.defaultToday" :format="cols.setting.format" - @change="onModelValue(cols)" /> - <OIDatePickerRange v-if="cols.name=='DatePickerRange'" - :rangeSeparator="cols.setting.separator" :format="cols.setting.format" - :class="cols.disabled?'input-disabled':''" :disabled="cols.disabled" - v-model="cols.value" :placeholder="cols.placeholder" - @change="onModelValue(cols)" /> - <OITimePicker v-if="cols.name=='TimePicker'" - :class="cols.disabled?'input-disabled':''" :disabled="cols.disabled" - v-model="cols.value" :placeholder="cols.placeholder" - @change="onModelValue(cols)" /> - </view> + <OIForm :form="detail2_styledef.form.items" viewMode></OIForm> - </view> - </uni-col> - </uni-row> - </div> </div> </div> </view> @@ -213,17 +49,14 @@ runCustomEvent, dataObjQuery } from "@/api/data.js" - import OIDatePicker from '@/components/oi-date-time-picker/oi-date-picker.vue' - import OIDatePickerRange from '@/components/oi-date-time-picker/oi-date-picker-range.vue' - import OITimePicker from '@/components/oi-date-time-picker/oi-time-picker.vue' + import OIForm from '@/components/oi-form/index.vue' + export default { modules: { Base64, }, components: { - OIDatePicker, - OIDatePickerRange, - OITimePicker + OIForm }, onBackPress(e) { // console.log("鐩戝惉杩斿洖鎸夐挳浜嬩欢",e); diff --git a/pages/modal/5601.vue b/pages/modal/5601.vue index 1082962..bf0326f 100644 --- a/pages/modal/5601.vue +++ b/pages/modal/5601.vue @@ -1,122 +1,10 @@ <template> <view class="uni-page-modal-5601"> <!-- 琛ㄥご鏍峰紡 --> - <uni-forms ref="baseForm" label-align="right"> - <view v-for="(item,index) in head_styledef.form.items" :key="index" class="v-head-style"> - <!-- 鏅�甯冨眬 --> - <uni-forms-item v-if="item.name != 'Layout'" :label="item.label ?item.label +'锛�:'' " - :label-width="item.labelWidth+'px'"> - <uni-data-picker v-if="item.name=='Select'" :class="item.disabled?'input-disabled':''" - v-model="item.value" :localdata="item.useDict ? item.dict : item.selections" - @change="onEnterChange(item)" :readonly="item.disabled" :clear-icon="false" - :popup-title="item.label"></uni-data-picker> - <view class="input-wrapper" v-if="item.name=='Input' || item.name=='InputNumber'"> - <text v-if="item.setting.prefix" class="uni-icon" :class="[item.setting.prefix]" - @click="classAttr_extButton(item)"></text> - <input class="uni-input" :class="item.disabled?'input-disabled':''" - :style="{'padding-left':item.setting.prefix?0 : '8rpx','right':item.setting.suffix?0 : '8rpx'}" - :type="item.name=='Input'?'text':'number'" v-model="item.value" :disabled="item.disabled" - :placeholder="item.placeholder" :focus="focusFieldId == item.fieldId" @focus="ontap(item)" - @click="onClick(item)" @keyup.enter="onEnterChange(item)" @blur="onEnterChange(item)" - :maxlength="-1" /> - <text v-if="item.setting.suffix" class="uni-icon" :class="[item.setting.suffix]" - @click="classAttr_extButton(item)"></text> - </view> - <!-- 澶嶉�妗�--> - <checkbox-group v-if="item.name=='Checkbox'" :class="item.disabled?'input-disabled':''" - :disabled="item.disabled" @change="onCheckBoxValue" :data-attr="item.fieldId" - :data-index="index"> - <label v-for="(item2) in item.selections" :key="item2.value"> - <checkbox :value="item2.value" :checked="item.value.includes(item2.value)" /> - <text>{{item2.label}}</text> - </label> - </checkbox-group> - <!-- 鍗曢�妗�--> - <radio-group v-if="item.name=='Radio'" :class="item.disabled?'input-disabled':''" - :disabled="item.disabled" @change="onRadioBoxValue" :data-attr="item.fieldId" - :data-index="index"> - <label v-for="(item2) in item.selections" :key="item2.value"> - <radio :value="item2.value" :checked="item2.value === item.value" /> - <text>{{item2.label}}</text> - </label> - </radio-group> - <!-- Switch寮�叧 --> - <switch class="input-switch" v-if="item.name=='Switch'" :class="item.disabled?'input-disabled':''" - :disabled="item.disabled" v-model="item.value" @change="onEnterChange(item)" /> - <OIDatePicker v-if="item.name=='DatePicker'" :class="item.disabled?'input-disabled':''" - :disabled="item.disabled" v-model="item.value" :placeholder="item.placeholder" - :defaultToday="item.setting.defaultToday" :format="item.setting.format" - @change="onModelValue(item)" /> - <OIDatePickerRange v-if="item.name=='DatePickerRange'" :rangeSeparator="item.setting.separator" - :format="item.setting.format" :class="item.disabled?'input-disabled':''" - :disabled="item.disabled" v-model="item.value" :placeholder="item.placeholder" - @change="onModelValue(item)" /> - <OITimePicker v-if="item.name=='TimePicker'" :class="item.disabled?'input-disabled':''" - :disabled="item.disabled" v-model="item.value" :placeholder="item.placeholder" - @change="onModelValue(item)" /> + <OIForm ref="refBaseForm" class="v-headStyle" :form="head_styledef.form" :focusId="focusFieldId" + @click="onClick" @focus="ontap" @change="onEnterChange" @click-prefix="classAttr_extButton" + @click-suffix="classAttr_extButton"></OIForm> - </uni-forms-item> - <!-- 鏍呮牸甯冨眬 --> - <uni-row v-else :gutter="item.setting.gutter"> - <uni-col - :span=" item.setting.spanList && item.setting.spanList[key]? item.setting.spanList[key] : 24 / item.setting.col" - v-for="(col,key) in item.setting.colList"> - <uni-forms-item v-if="col!=null" :label="col.label ? col.label +'锛�:''" - :label-width="col.labelWidth+'px'"> - <uni-data-picker v-if="col.name=='Select'" :class="col.disabled?'input-disabled':''" - v-model="col.value" :localdata="col.useDict ? col.dict : col.selections" - @change="onEnterChange(col)" :readonly="col.disabled" :clear-icon="false" - :popup-title="col.label"></uni-data-picker> - <view class="input-wrapper" v-if="col.name=='Input' || col.name=='InputNumber'"> - <text v-if="col.setting.prefix" class="uni-icon" :class="[col.setting.prefix]" - @click="classAttr_extButton(col)"></text> - <input class="uni-input" :class="col.disabled?'input-disabled':''" - :style="{'padding-left':col.setting.prefix?0 : '8px','right':col.setting.suffix?0 : '8px'}" - :type="col.name=='Input'?'text':'number'" v-model="col.value" - :disabled="col.disabled" :placeholder="col.placeholder" - :focus="focusFieldId == col.fieldId" @focus="ontap(col)" @click="onClick(col)" - @keyup.enter="onEnterChange(col)" @blur="onEnterChange(col)" :maxlength="-1" /> - <text v-if="col.setting.suffix" class="uni-icon" :class="[col.setting.suffix]" - @click="classAttr_extButton(col)"></text> - </view> - <!-- 澶嶉�妗�--> - <checkbox-group v-if="col.name=='Checkbox'" :class="col.disabled?'input-disabled':''" - :disabled="col.disabled" @change="onCheckBoxValue" :data-attr="col.fieldId" - :data-index="index" :data-iindex="key"> - <label v-for="(col2) in col.selections" :key="col2.value"> - <checkbox :value="col2.value" :checked="col.value.includes(col2.value)" /> - <text>{{col2.label}}</text> - </label> - </checkbox-group> - <!-- 鍗曢�妗�--> - <radio-group v-if="col.name=='Radio'" :class="col.disabled?'input-disabled':''" - :disabled="col.disabled" @change="onRadioBoxValue" :data-attr="col.fieldId" - :data-index="index" :data-iindex="key"> - <label v-for="(col2) in col.selections" :key="col2.value"> - <radio :value="col2.value" :checked="col2.value === col.value" /> - <text>{{col2.label}}</text> - </label> - </radio-group> - <!-- Switch寮�叧 --> - <switch v-if="col.name=='Switch'" :class="col.disabled?'input-disabled':''" - :disabled="col.disabled" v-model="col.value" @change="onEnterChange(col)" /> - <OIDatePicker v-if="col.name=='DatePicker'" :class="col.disabled?'input-disabled':''" - :disabled="col.disabled" v-model="col.value" :placeholder="col.placeholder" - :defaultToday="col.setting.defaultToday" :format="col.setting.format" - @change="onModelValue(col)" /> - <OIDatePickerRange v-if="col.name=='DatePickerRange'" - :rangeSeparator="col.setting.separator" :format="col.setting.format" - :class="col.disabled?'input-disabled':''" :disabled="col.disabled" v-model="col.value" - :placeholder="col.placeholder" @change="onModelValue(col)" /> - <OITimePicker v-if="col.name=='TimePicker'" :class="col.disabled?'input-disabled':''" - :disabled="col.disabled" v-model="col.value" :placeholder="col.placeholder" - @change="onModelValue(col)" /> - </uni-forms-item> - <uni-forms-item v-else label=""></uni-forms-item> - </uni-col> - </uni-row> - </view> - </uni-forms> <view class="view-content"> <!-- 鐮佺洏瀛愮晫闈�--> <view v-if="param.Show_Welcom_Page==false" class="uni-panel-content"> @@ -139,39 +27,8 @@ @tap="onPanelClick(ii,style.form.htmlobjId)" :id="'dvpanel'+style.form.htmlobjId" :class="style.form.htmlobjId==active_id?'bk-active':''"> - <uni-forms class="dv-panel-form" label-align="right"> - <div class="dv-panel-form-item" v-for="(item,index) in style.form.items"> - <!-- 鏅�甯冨眬 --> - <uni-forms-item v-if="item.name != 'Layout'" - :label="item.label ?item.label +'锛�:'' " - :label-width="item.labelWidth+'px'"> - <span class="form-item-span" - v-if="item.disabled">{{item.value}}</span> - <input v-else class="uni-input" - :type="item.name=='InputNumber'?'number':'text'" - v-model="item.value" :disabled="item.disabled" - :placeholder="item.placeholder" :maxlength="-1" /> - </uni-forms-item> - <!-- 鏍呮牸甯冨眬 --> - <uni-row v-else :gutter="item.setting.gutter"> - <uni-col - :span=" item.setting.spanList && item.setting.spanList[key]? item.setting.spanList[key] : (24 / item.setting.col)" - v-for="(col,key) in item.setting.colList"> - <uni-forms-item v-if="col!=null" - :label="col.label ? col.label +'锛�:''" - :label-width="col.labelWidth+'px'"> - <span class="form-item-span" - v-if="col.disabled">{{col.value}}</span> - <input v-else class="uni-input" - :type="col.name=='InputNumber'?'number':'text'" - v-model="col.value" :disabled="col.disabled" - :placeholder="col.placeholder" :maxlength="-1" /> - </uni-forms-item> - <uni-forms-item v-else label=""></uni-forms-item> - </uni-col> - </uni-row> - </div> - </uni-forms> + <OIForm class="dv-panel-form" :form="style.form" viewMode></OIForm> + <div class="dv-panel-button" v-if="pageData.Select_Button==true || pageData.Row_Button.length > 0"> @@ -265,9 +122,7 @@ runCustomEvent, } from "@/api/data.js" import dayjs from "dayjs"; - import OIDatePicker from '@/components/oi-date-time-picker/oi-date-picker.vue' - import OIDatePickerRange from '@/components/oi-date-time-picker/oi-date-picker-range.vue' - import OITimePicker from '@/components/oi-date-time-picker/oi-time-picker.vue' + import OIForm from '@/components/oi-form/index.vue' export default { name: "PageModal5601", @@ -275,9 +130,7 @@ Base64, }, components: { - OIDatePicker, - OIDatePickerRange, - OITimePicker + OIForm, }, data() { return { @@ -773,10 +626,11 @@ console.log(result.decodedata); item.value = result.decodedata; var $this = this; - if (item.oldvalue != item.value && item.value.trim() != "") { - item.oldvalue = item.value; + let newVal = item.value.trim() + if (item.oldvalue != newVal) { + item.oldvalue = newVal; var attr = item.fieldId; - this.head_styledef.form.model[attr] = item.value; + this.head_styledef.form.model[attr] = newVal; var onChangeEvent = item.bind.onChangeEvent; //鍐呭鍙樺寲鍚庝簨浠� var onSuffixClickCallbackEvent = item.bind .onSuffixClickCallbackEvent; //鍚庡浘鏍囩偣鍑讳簨浠�@@ -787,36 +641,60 @@ if (onChangeEvent?.id) { //鍐呭鍙樺寲鍚庝簨浠� $this.onChange(onChangeEvent); } - if (item.value) { //绗竴涓緭鍏ユ涓嶄负绌�- //鍒濆鍖栵紝涓嬩釜杈撳叆妗唂ocus灞炴� - var findd = false - for (let i in $this.head_styledef.form.items) { - const ele = $this.head_styledef.form.items[i] - if (ele.name != "Layout") { - if (ele.name == 'Input' || ele.name == - 'InputNumber') { - if (attr == ele.fieldId) { - findd = true - } else { - if (findd) { - $this.setData({ - focusFieldId: ele.fieldId - }) - break - } + //鍒濆鍖栵紝涓嬩釜杈撳叆妗唂ocus灞炴� + var findd = false + for (let i in $this.head_styledef.form.items) { + const ele = $this.head_styledef.form.items[i] + if (ele.name != "Layout") { + if (ele.name == 'Input' || ele.name == + 'InputNumber') { + if (attr == ele.fieldId) { + findd = true + } else { + if (findd) { + $this.setData({ + focusFieldId: ele.fieldId + }) + break } } - } else { - if (findd) { - let curIndex = ele.setting.colList.findIndex(( - col, index2, arr) => { - return (col.name == 'Input' || col - .name == 'InputNumber'); + + } + } else { + if (findd) { + let curIndex = ele.setting.colList.findIndex(( + col, index2, arr) => { + return (col.name == 'Input' || col + .name == 'InputNumber'); + }) + if (curIndex > -1) { + $this.setData({ + focusFieldId: ele.setting + .colList[curIndex] + .fieldId }) - if (curIndex > -1) { + break + } + + } else { + let curIndex = ele.setting.colList.findIndex(( + col, index2, arr) => { + return attr == col.fieldId; + }) + if (curIndex > -1) { + findd = true + let curIndex2 = ele.setting.colList + .findIndex((col, index2, arr) => { + return (col.name == 'Input' || + col.name == + 'InputNumber') && + index2 > + curIndex; + }) + if (curIndex2 > -1) { $this.setData({ focusFieldId: ele.setting .colList[curIndex] @@ -824,47 +702,27 @@ }) break } - - } else { - let curIndex = ele.setting.colList.findIndex(( - col, index2, arr) => { - return attr == col.fieldId; - }) - if (curIndex > -1) { - findd = true - let curIndex2 = ele.setting.colList - .findIndex((col, index2, arr) => { - return (col.name == 'Input' || - col.name == - 'InputNumber') && - index2 > - curIndex; - }) - if (curIndex2 > -1) { - $this.setData({ - focusFieldId: ele.setting - .colList[curIndex] - .fieldId - }) - break - } - } } - } + } } - } }) }, onEnterChange(item) { //鍥炶溅锛岀偣鍑绘寜閽紝鍙栨秷鑺傜偣浜嬩欢 console.log(item); - if (item.oldvalue != item.value && item.value.trim() != "") { - item.oldvalue = item.value; + let newVal = item.value + if (typeof item.value == "string") { + newVal = item.value.trim() + if (!newVal) + return + } + if (item.oldvalue != newVal) { + item.oldvalue = newVal; var attr = item.fieldId; - this.head_styledef.form.model[attr] = item.value; + this.head_styledef.form.model[attr] = newVal; var onChangeEvent = item.bind.onChangeEvent; //鍐呭鍙樺寲鍚庝簨浠� if (onChangeEvent?.id) { //鍐呭鍙樺寲鍚庝簨浠�@@ -873,67 +731,7 @@ } }, - onCheckBoxValue(e) { //缁戝畾Model鍊�- let values = e.detail.value || [] - const item = this.head_styledef.form.items[e.currentTarget?.dataset?.index || 0] - if (item?.setting?.colList) { - const col = item.setting.colList[e.currentTarget?.dataset?.iindex || 0] - if (col) { - col.value = values - let attr = col.fieldId; - this.head_styledef.form.model[attr] = col.value; - var onChangeEvent = col.bind.onChangeEvent; //鍐呭鍙樺寲鍚庝簨浠�- if (onChangeEvent?.id) { //鍐呭鍙樺寲鍚庝簨浠�- this.onChange(onChangeEvent); - } - return - } - } else { - if (item) { - item.value = values - let attr = item.fieldId; - this.head_styledef.form.model[attr] = item.value; - var onChangeEvent = item.bind.onChangeEvent; //鍐呭鍙樺寲鍚庝簨浠�- if (onChangeEvent?.id) { //鍐呭鍙樺寲鍚庝簨浠�- this.onChange(onChangeEvent); - } - } - } - - }, - onRadioBoxValue(e) { //缁戝畾Model鍊�- let values = e.detail.value || "" - const item = this.head_styledef.form.items[e.currentTarget?.dataset?.index || 0] - if (item?.setting?.colList) { - const col = item.setting.colList[e.currentTarget?.dataset?.iindex || 0] - if (col) { - col.value = values - let attr = col.fieldId; - this.head_styledef.form.model[attr] = col.value; - var onChangeEvent = col.bind.onChangeEvent; //鍐呭鍙樺寲鍚庝簨浠�- if (onChangeEvent?.id) { //鍐呭鍙樺寲鍚庝簨浠�- this.onChange(onChangeEvent); - } - return - } - } else { - if (item) { - item.value = values - let attr = item.fieldId; - this.head_styledef.form.model[attr] = item.value; - var onChangeEvent = item.bind.onChangeEvent; //鍐呭鍙樺寲鍚庝簨浠�- if (onChangeEvent?.id) { //鍐呭鍙樺寲鍚庝簨浠�- this.onChange(onChangeEvent); - } - } - - } - - }, - onModelValue(item) { - var attr = item.fieldId; - this.head_styledef.form.model[attr] = item.value; - }, + classAttr_extButton(item) { var onSuffixClickCallbackEvent = item.bind.onSuffixClickCallbackEvent; //鍚庡浘鏍囩偣鍑讳簨浠� var onSuffixClickEvent = item.bind.onSuffixClickEvent; //鍚庡浘鏍囩偣鍑诲洖璋�diff --git a/pages/modal/form/index.vue b/pages/modal/form/index.vue index a1acb6d..55c95e5 100644 --- a/pages/modal/form/index.vue +++ b/pages/modal/form/index.vue @@ -2,122 +2,9 @@ <view class="uni-page-modal-form"> <view class="view-content"> <!-- 琛ㄥご鏍峰紡 --> - <uni-forms ref="baseForm" label-align="right"> - <view v-for="(item,index) in head_styledef.form.items" :key="index" class="v-head-style"> - <!-- 鏅�甯冨眬 --> - <uni-forms-item v-if="item.name != 'Layout'" :label="item.label ?item.label +'锛�:'' " - :label-width="item.labelWidth+'px'"> - <uni-data-picker v-if="item.name=='Select'" :class="item.disabled?'input-disabled':''" - v-model="item.value" :localdata="item.useDict ? item.dict : item.selections" - @change="onEnterChange(item)" :readonly="item.disabled" :clear-icon="false" - :popup-title="item.label"></uni-data-picker> - <view class="input-wrapper" v-if="item.name=='Input' || item.name=='InputNumber'"> - <text v-if="item.setting.prefix" class="uni-icon" :class="[item.setting.prefix]" - @click="classAttr_extButton(item)"></text> - <input class="uni-input" :class="item.disabled?'input-disabled':''" - :style="{'padding-left':item.setting.prefix?0 : '8rpx','right':item.setting.suffix?0 : '8rpx'}" - :type="item.name=='Input'?'text':'number'" v-model="item.value" - :disabled="item.disabled" :placeholder="item.placeholder" - :focus="focusFieldId == item.fieldId" @focus="ontap(item)" @click="onClick(item)" - @keyup.enter="onEnterChange(item)" @blur="onEnterChange(item)" :maxlength="-1" /> - <text v-if="item.setting.suffix" class="uni-icon" :class="[item.setting.suffix]" - @click="classAttr_extButton(item)"></text> - </view> - <!-- 澶嶉�妗�--> - <checkbox-group v-if="item.name=='Checkbox'" :class="item.disabled?'input-disabled':''" - :disabled="item.disabled" @change="onCheckBoxValue" :data-attr="item.fieldId" - :data-index="index"> - <label v-for="(item2) in item.selections" :key="item2.value"> - <checkbox :value="item2.value" :checked="item.value.includes(item2.value)" /> - <text>{{item2.label}}</text> - </label> - </checkbox-group> - <!-- 鍗曢�妗�--> - <radio-group v-if="item.name=='Radio'" :class="item.disabled?'input-disabled':''" - :disabled="item.disabled" @change="onRadioBoxValue" :data-attr="item.fieldId" - :data-index="index"> - <label v-for="(item2) in item.selections" :key="item2.value"> - <radio :value="item2.value" :checked="item2.value === item.value" /> - <text>{{item2.label}}</text> - </label> - </radio-group> - <!-- Switch寮�叧 --> - <switch class="input-switch" v-if="item.name=='Switch'" - :class="item.disabled?'input-disabled':''" :disabled="item.disabled" v-model="item.value" - @change="onEnterChange(item)" /> - <OIDatePicker v-if="item.name=='DatePicker'" :class="item.disabled?'input-disabled':''" - :disabled="item.disabled" v-model="item.value" :placeholder="item.placeholder" - :defaultToday="item.setting.defaultToday" :format="item.setting.format" - @change="onDatetimePickerChange(item)" /> - <OIDatePickerRange v-if="item.name=='DatePickerRange'" :rangeSeparator="item.setting.separator" - :format="item.setting.format" :class="item.disabled?'input-disabled':''" - :disabled="item.disabled" v-model="item.value" :placeholder="item.placeholder" - @change="onDatetimePickerChange(item)" /> - <OITimePicker v-if="item.name=='TimePicker'" :class="item.disabled?'input-disabled':''" - :disabled="item.disabled" v-model="item.value" :placeholder="item.placeholder" - @change="onDatetimePickerChange(item)" /> - </uni-forms-item> - <!-- 鏍呮牸甯冨眬 --> - <uni-row v-else :gutter="item.setting.gutter"> - <uni-col - :span=" item.setting.spanList && item.setting.spanList[key]? item.setting.spanList[key] : 24 / item.setting.col" - v-for="(col,key) in item.setting.colList"> - <uni-forms-item v-if="col!=null" :label="col.label ? col.label +'锛�:''" - :label-width="col.labelWidth+'px'"> - <uni-data-picker v-if="col.name=='Select'" :class="col.disabled?'input-disabled':''" - v-model="col.value" :localdata="col.useDict ? col.dict : col.selections" - @change="onEnterChange(col)" :readonly="col.disabled" :clear-icon="false" - :popup-title="col.label"></uni-data-picker> - <view class="input-wrapper" v-if="col.name=='Input' || col.name=='InputNumber'"> - <text v-if="col.setting.prefix" class="uni-icon" :class="[col.setting.prefix]" - @click="classAttr_extButton(col)"></text> - <input class="uni-input" :class="col.disabled?'input-disabled':''" - :style="{'padding-left':col.setting.prefix?0 : '8px','right':col.setting.suffix?0 : '8px'}" - :type="col.name=='Input'?'text':'number'" v-model="col.value" - :disabled="col.disabled" :placeholder="col.placeholder" - :focus="focusFieldId == col.fieldId" @focus="ontap(col)" @click="onClick(col)" - @keyup.enter="onEnterChange(col)" @blur="onEnterChange(col)" :maxlength="-1" /> - <text v-if="col.setting.suffix" class="uni-icon" :class="[col.setting.suffix]" - @click="classAttr_extButton(col)"></text> - </view> - <!-- 澶嶉�妗�--> - <checkbox-group v-if="col.name=='Checkbox'" :class="col.disabled?'input-disabled':''" - :disabled="col.disabled" @change="onCheckBoxValue" :data-attr="col.fieldId" - :data-index="index" :data-iindex="key"> - <label v-for="(col2) in col.selections" :key="col2.value"> - <checkbox :value="col2.value" :checked="col.value.includes(col2.value)" /> - <text>{{col2.label}}</text> - </label> - </checkbox-group> - <!-- 鍗曢�妗�--> - <radio-group v-if="col.name=='Radio'" :class="col.disabled?'input-disabled':''" - :disabled="col.disabled" @change="onRadioBoxValue" :data-attr="col.fieldId" - :data-index="index" :data-iindex="key"> - <label v-for="(col2) in col.selections" :key="col2.value"> - <radio :value="col2.value" :checked="col2.value === col.value" /> - <text>{{col2.label}}</text> - </label> - </radio-group> - <!-- Switch寮�叧 --> - <switch v-if="col.name=='Switch'" :class="col.disabled?'input-disabled':''" - :disabled="col.disabled" v-model="col.value" @change="onEnterChange(col)" /> - <OIDatePicker v-if="col.name=='DatePicker'" :class="col.disabled?'input-disabled':''" - :disabled="col.disabled" v-model="col.value" :placeholder="col.placeholder" - :defaultToday="col.setting.defaultToday" :format="col.setting.format" - @change="onDatetimePickerChange(col)" /> - <OIDatePickerRange v-if="col.name=='DatePickerRange'" - :rangeSeparator="col.setting.separator" :format="col.setting.format" - :class="col.disabled?'input-disabled':''" :disabled="col.disabled" - v-model="col.value" :placeholder="col.placeholder" - @change="onDatetimePickerChange(col)" /> - <OITimePicker v-if="col.name=='TimePicker'" :class="col.disabled?'input-disabled':''" - :disabled="col.disabled" v-model="col.value" :placeholder="col.placeholder" - @change="onDatetimePickerChange(col)" /> - </uni-forms-item> - </uni-col> - </uni-row> - </view> - </uni-forms> + <OIForm ref="refBaseForm" class="v-head-style" :form="head_styledef.form" :focusId="focusFieldId" + @click="onClick" @focus="ontap" @change="onEnterChange" @click-prefix="classAttr_extButton" + @click-suffix="classAttr_extButton"></OIForm> </view> <view class="view-bottom"> <button type="primary" @tap="ok" class="btn_add" :class="okLoading?'btn_disabled':''" @@ -166,18 +53,15 @@ dataObjInfo } from "@/api/data.js" import dayjs from "dayjs"; - import OIDatePicker from '@/components/oi-date-time-picker/oi-date-picker.vue' - import OIDatePickerRange from '@/components/oi-date-time-picker/oi-date-picker-range.vue' - import OITimePicker from '@/components/oi-date-time-picker/oi-time-picker.vue' + import OIForm from '@/components/oi-form/index.vue' + export default { name: "PageModalForm", modules: { Base64, }, components: { - OIDatePicker, - OIDatePickerRange, - OITimePicker + OIForm }, data() { return { @@ -650,10 +534,13 @@ console.log(result.decodedata); item.value = result.decodedata; var $this = this; - if (item.oldvalue != item.value && item.value.trim() != "") { - item.oldvalue = item.value; + let newVal = item.value.trim() + if (!newVal) + return + if (item.oldvalue != newVal) { + item.oldvalue = newVal; var attr = item.fieldId; - this.head_styledef.form.model[attr] = item.value; + this.head_styledef.form.model[attr] = newVal; var onChangeEvent = item.bind.onChangeEvent; //鍐呭鍙樺寲鍚庝簨浠� var onSuffixClickCallbackEvent = item.bind .onSuffixClickCallbackEvent; //鍚庡浘鏍囩偣鍑讳簨浠�@@ -664,36 +551,59 @@ if (onChangeEvent?.id) { //鍐呭鍙樺寲鍚庝簨浠� $this.onChange(onChangeEvent); } - if (item.value) { //绗竴涓緭鍏ユ涓嶄负绌�- //鍒濆鍖栵紝涓嬩釜杈撳叆妗唂ocus灞炴� - var findd = false - for (let i in $this.head_styledef.form.items) { - const ele = $this.head_styledef.form.items[i] + //鍒濆鍖栵紝涓嬩釜杈撳叆妗唂ocus灞炴� + var findd = false + for (let i in $this.head_styledef.form.items) { + const ele = $this.head_styledef.form.items[i] - if (ele.name != "Layout") { - if (ele.name == 'Input' || ele.name == - 'InputNumber') { - if (attr == ele.fieldId) { - findd = true - } else { - if (findd) { - $this.setData({ - focusFieldId: ele.fieldId - }) - break - } - + if (ele.name != "Layout") { + if (ele.name == 'Input' || ele.name == + 'InputNumber') { + if (attr == ele.fieldId) { + findd = true + } else { + if (findd) { + $this.setData({ + focusFieldId: ele.fieldId + }) + break } } - } else { - if (findd) { - let curIndex = ele.setting.colList.findIndex(( - col, index2, arr) => { - return (col.name == 'Input' || col - .name == 'InputNumber'); + + } + } else { + if (findd) { + let curIndex = ele.setting.colList.findIndex(( + col, index2, arr) => { + return (col.name == 'Input' || col + .name == 'InputNumber'); + }) + if (curIndex > -1) { + $this.setData({ + focusFieldId: ele.setting + .colList[curIndex] + .fieldId }) - if (curIndex > -1) { + break + } + + } else { + let curIndex = ele.setting.colList.findIndex(( + col, index2, arr) => { + return attr == col.fieldId; + }) + if (curIndex > -1) { + findd = true + let curIndex2 = ele.setting.colList + .findIndex((col, index2, arr) => { + return (col.name == 'Input' || + col.name == + 'InputNumber') && + index2 > + curIndex; + }) + if (curIndex2 > -1) { $this.setData({ focusFieldId: ele.setting .colList[curIndex] @@ -701,34 +611,9 @@ }) break } - - } else { - let curIndex = ele.setting.colList.findIndex(( - col, index2, arr) => { - return attr == col.fieldId; - }) - if (curIndex > -1) { - findd = true - let curIndex2 = ele.setting.colList - .findIndex((col, index2, arr) => { - return (col.name == 'Input' || - col.name == - 'InputNumber') && - index2 > - curIndex; - }) - if (curIndex2 > -1) { - $this.setData({ - focusFieldId: ele.setting - .colList[curIndex] - .fieldId - }) - break - } - } } - } + } } @@ -738,79 +623,22 @@ onEnterChange(item) { //鍥炶溅锛岀偣鍑绘寜閽紝鍙栨秷鑺傜偣浜嬩欢 console.log(item); - if (item.oldvalue != item.value && item.value.trim() != "") { - item.oldvalue = item.value; + let newVal = item.value + if (typeof item.value == "string") { + newVal = item.value.trim() + if (!newVal) + return + } + if (item.oldvalue != newVal) { + item.oldvalue = newVal; var attr = item.fieldId; - this.head_styledef.form.model[attr] = item.value; + this.head_styledef.form.model[attr] = newVal; var onChangeEvent = item.bind.onChangeEvent; //鍐呭鍙樺寲鍚庝簨浠�- if (onChangeEvent?.id) { //鍐呭鍙樺寲鍚庝簨浠� this.onChange(onChangeEvent); } } - }, - onCheckBoxValue(e) { //缁戝畾Model鍊�- let values = e.detail.value || [] - const item = this.head_styledef.form.items[e.currentTarget?.dataset?.index || 0] - if (item?.setting?.colList) { - const col = item.setting.colList[e.currentTarget?.dataset?.iindex || 0] - if (col) { - col.value = values - let attr = col.fieldId; - this.head_styledef.form.model[attr] = col.value; - var onChangeEvent = col.bind.onChangeEvent; //鍐呭鍙樺寲鍚庝簨浠�- if (onChangeEvent?.id) { //鍐呭鍙樺寲鍚庝簨浠�- this.onChange(onChangeEvent); - } - return - } - } else { - if (item) { - item.value = values - let attr = item.fieldId; - this.head_styledef.form.model[attr] = item.value; - var onChangeEvent = item.bind.onChangeEvent; //鍐呭鍙樺寲鍚庝簨浠�- if (onChangeEvent?.id) { //鍐呭鍙樺寲鍚庝簨浠�- this.onChange(onChangeEvent); - } - } - } - - }, - onRadioBoxValue(e) { //缁戝畾Model鍊�- let values = e.detail.value || "" - const item = this.head_styledef.form.items[e.currentTarget?.dataset?.index || 0] - if (item?.setting?.colList) { - const col = item.setting.colList[e.currentTarget?.dataset?.iindex || 0] - if (col) { - col.value = values - let attr = col.fieldId; - this.head_styledef.form.model[attr] = col.value; - var onChangeEvent = col.bind.onChangeEvent; //鍐呭鍙樺寲鍚庝簨浠�- if (onChangeEvent?.id) { //鍐呭鍙樺寲鍚庝簨浠�- this.onChange(onChangeEvent); - } - return - } - } else { - if (item) { - item.value = values - let attr = item.fieldId; - this.head_styledef.form.model[attr] = item.value; - var onChangeEvent = item.bind.onChangeEvent; //鍐呭鍙樺寲鍚庝簨浠�- if (onChangeEvent?.id) { //鍐呭鍙樺寲鍚庝簨浠�- this.onChange(onChangeEvent); - } - } - - } - - }, - onDatetimePickerChange(e) { - var attr = item.fieldId; - this.head_styledef.form.model[attr] = item.value; - }, classAttr_extButton(item) { var onSuffixClickCallbackEvent = item.bind.onSuffixClickCallbackEvent; //鍚庡浘鏍囩偣鍑讳簨浠� -- Gitblit v1.9.1