feat: 增加全局readonly属性

Author: dream2023

lib/EleForm.vue

@@ -9,6 +9,7 @@
           :rules="computedRules"
           @submit.native.prevent="handleSubmitForm"
           ref="form"
+          :disabled="disabled"
           v-bind="formAttrs"
         >
           <!-- 默认插槽作为表单项 -->
@@ -29,7 +30,7 @@
                   :field="field"
                   :props="$props"
                   :formData="formData"
-                  :disabled="disabled || formItem._disabled"
+                  :disabled="formItem._disabled"
                   :type="formItem._type"
                   :options="formItem._options"
                 >
@@ -56,12 +57,13 @@
                         :field="field"
                         :formData="formData"
                         :name="field"
-                        :disabled="disabled || formItem._disabled"
+                        :disabled="formItem._disabled"
                         :type="formItem._type"
                         :options="formItem._options"
                       >
                         <component
-                          :disabled="disabled || formItem._disabled"
+                          :disabled="formItem._disabled"
+                          :readonly="readonly"
                           :desc="formItem"
                           :is="formItem._type"
                           :options="formItem._options"
@@ -222,6 +224,11 @@ export default {
       type: Boolean,
       default: false
     },
+    // 全局的readonly
+    readonly: {
+      type: Boolean,
+      default: false
+    },
     // 是否为弹窗
     isDialog: {
       type: Boolean,
@@ -393,6 +400,7 @@ export default {
     formDescKeys() {
       return Object.keys(this.computedFormDesc)
     },
+    // 对formDesc做处理
     computedFormDesc() {
       const desc = this.getDeepFormDesc(this.formDesc)
       Object.keys(desc).forEach(field => {

lib/mixins/attrsMixin.js

@@ -41,7 +41,8 @@ export default {
         this.defaultAttrs,
         this.globalComponentAttrs,
         this.customAttrs,
-        { disabled: this.disabled || this.customAttrs.disabled }
+        { disabled: this.disabled || this.customAttrs.disabled },
+        { readonly: this.readonly || this.customAttrs.readonly }
       )
     }
   }

lib/mixins/formMixin.js

@@ -11,40 +11,41 @@ export default {
   props: {
     value: {},
     disabled: Boolean,
+    readonly: Boolean,
     options: {
       type: Array,
-      default () {
+      default() {
         return []
       }
     },
     desc: {
       type: Object,
-      default () {
+      default() {
         return {}
       }
     }
   },
   computed: {
-    slots () {
+    slots() {
       return this.desc.slots || {}
     },
-    scopedSlots () {
+    scopedSlots() {
       return this.desc.scopedSlots || {}
     },
-    onEvents () {
+    onEvents() {
       return Object.assign({}, this.defaultOn, this.desc.on)
     }
   },
   watch: {
     // 当值发生变化时
     value: {
-      handler (value) {
+      handler(value) {
         this.handleValueChanged(value)
       },
       immediate: true
     }
   },
-  data () {
+  data() {
     return {
       // 默认事件
       defaultOn: {
@@ -56,7 +57,7 @@ export default {
   },
   methods: {
     // 模拟数据
-    mockData () {
+    mockData() {
       const Mock = mock()
       if (Mock) {
         if (this.desc.mock === true && this.mockRule !== false) {
@@ -80,12 +81,12 @@ export default {
     },
 
     // 变化处理
-    handleChange (value) {
+    handleChange(value) {
       this.$emit('input', value)
     },
 
     // 检查类型
-    checkType (val, isDefault = false) {
+    checkType(val, isDefault = false) {
       if (this.type && isDef(val)) {
         const isOk = is(val, this.type)
         if (!isOk) {
@@ -106,7 +107,7 @@ export default {
     },
 
     // 初始化数据
-    handleValueChanged (value) {
+    handleValueChanged(value) {
       if (this.desc.displayFormatter) {
         value = this.desc.displayFormatter(value)
       }