cuiqian2004
2025-03-21 0ecc402885f332b21923bb12183dc072306f2b39
components/oi-form/index.vue
@@ -1,27 +1,32 @@
<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>
      <view v-for="(item,index) in form.items" :key="index">
         <!-- 栅格布局 -->
         <uni-row v-if="item.name == 'Layout'" v-show="!item.isHidden" :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" :key="key">
               <OIFormItem v-if="col != null" :focusId="focusId" :viewMode="viewMode" :data="col"
                  :hiddenIds="hiddenIds" @on-change="onChange" @on-focus="onFocus" @on-click="onClick"
                  @on-click-prefix="onClickPrefix" @on-click-suffix="onClickSuffix"></OIFormItem>
               <uni-forms-item v-else label=""></uni-forms-item>
            </uni-col>
         </uni-row>
         <OIFormItem v-else :hiddenIds="hiddenIds" :focusId="focusId" :viewMode="viewMode" :data="item"
            @change="onChange" @focus="onFocus" @click="onClick" @click-prefix="onClickPrefix"
            @click-suffix="onClickSuffix">
            @on-change="onChange" @on-focus="onFocus" @on-click="onClick" @on-click-prefix="onClickPrefix"
            @on-click-suffix="onClickSuffix">
         </OIFormItem>
      </template>
      </view>
   </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: {
@@ -73,27 +78,30 @@
         onChange(item) {
            var attr = item.fieldId;
            this.form.model[attr] = item.value;
            this.$emit("change", item)
            this.$emit("on-change", item)
         },
         onClick(item) {
            this.$emit("click", item)
            this.$emit("on-click", item)
         },
         onFocus(item) {
            this.$emit("focus", item)
            this.$emit("on-focus", item)
         },
         onClickPrefix(item) {
            this.$emit("click-prefix", item)
            this.$emit("on-click-prefix", item)
         },
         onClickSuffix(item) {
            this.$emit("click-suffix", item)
            this.$emit("on-click-suffix", item)
         },
      }
      },
      // beforeUpdate() {
      //    console.log("beforeUpdate form", this.form)
      // },
      // updated() {
      //    console.log("updated form", this.form)
      // }
   };
</script>
<style lang="less">
   .oi-form {
   }
   .oi-form {}
</style>