chore: upgrade common props to use select type

ly525 · 小小鲁班
1 parent 25ac0f18
Showing 4 changed files with 29 additions and 122 deletions
front-end/h5/package.json
front-end/h5/src/components/plugins/lbp-form-button.js
front-end/h5/src/components/plugins/lbp-form-input.js
front-end/h5/yarn.lock
@@ -17,7 +17,7 @@
     "@luban-h5/lbc-button": "^0.0.3",
     "@luban-h5/lbp-slide": "^0.0.7",
     "@luban-h5/lbs-text-align": "^0.0.3",
-    "@luban-h5/plugin-common-props": "^0.1.6",
+    "@luban-h5/plugin-common-props": "^0.2.6",
     "animate.css": "^3.7.2",
     "ant-design-vue": "^1.3.14",
     "core-js": "^2.6.5",
@@ -73,53 +73,4 @@ export default {
       req.send(formData)
     }
   },
-  componentsForPropsEditor: {
-    'lbs-select-input-type': {
-      props: ['value'],
-      computed: {
-        value_: {
-          get () {
-            return this.value
-          },
-          set (val) {
-            this.$emit('input', val)
-          }
-        }
-      },
-      template: `
-          <a-select v-model="value_" placeholder="类型">
-            <a-option
-              v-for="item in options"
-              :key="item.value"
-              :label="item.label"
-              :value="item.value">
-            </a-option>
-          </a-select>
-        `,
-      data: () => ({
-        options: [
-          {
-            label: '文字',
-            value: 'text'
-          },
-          {
-            label: '密码',
-            value: 'password'
-          },
-          {
-            label: '日期',
-            value: 'date'
-          },
-          {
-            label: '邮箱',
-            value: 'email'
-          },
-          {
-            label: '手机号',
-            value: 'tel'
-          }
-        ]
-      })
-    }
-  }
 }
 // https://github.com/luban-h5-components/plugin-common-props
 import PropTypes from '@luban-h5/plugin-common-props'
  
+const typeOptions = [
+  {
+    label: '文字',
+    value: 'text'
+  },
+  {
+    label: '密码',
+    value: 'password'
+  },
+  {
+    label: '日期',
+    value: 'date'
+  },
+  {
+    label: '邮箱',
+    value: 'email'
+  },
+  {
+    label: '手机号',
+    value: 'tel'
+  }
+]
+
 export default {
   name: 'lbp-form-input',
   render (h) {
@@ -26,14 +49,7 @@ export default {
     />
   },
   props: {
-    type: {
-      type: String,
-      default: 'text',
-      editor: {
-        type: 'lbs-select-input-type',
-        label: '类型'
-      }
-    },
+    type: PropTypes.select({ defaultValue: 'text', label: '类型', options: typeOptions }),
     name: PropTypes.string({ defaultValue: 'name', label: 'name' }),
     disabled: PropTypes.boolean({ label: 'disabled' }),
     fontSize: PropTypes.number({ label: '字号(px)' }),
@@ -47,66 +63,6 @@ export default {
     vertical: PropTypes.boolean(),
     lineHeight: PropTypes.number({ label: '行高(px)', defaultValue: 1 })
   },
-  componentsForPropsEditor: {
-    'lbs-select-input-type': {
-      props: ['value'],
-      computed: {
-        value_: {
-          get () {
-            return this.value
-          },
-          set (val) {
-            this.$emit('input', val)
-          }
-        }
-      },
-      render (h) {
-        return (
-          <a-select
-            placeholder="类型"
-            value={this.value}
-            onChange={(value) => {
-              this.$emit('input', value)
-              this.$emit('change', value)
-            }}
-          >
-            {
-              this.options.map(option => (
-                <a-select-option
-                  key={option.value}
-                  value={option.value}
-                >{option.label}</a-select-option>
-              ))
-            }
-          </a-select>
-        )
-      },
-      data: () => ({
-        options: [
-          {
-            label: '文字',
-            value: 'text'
-          },
-          {
-            label: '密码',
-            value: 'password'
-          },
-          {
-            label: '日期',
-            value: 'date'
-          },
-          {
-            label: '邮箱',
-            value: 'email'
-          },
-          {
-            label: '手机号',
-            value: 'tel'
-          }
-        ]
-      })
-    }
-  }
 }
  
 // .lb-plugin__input {
@@ -792,10 +792,10 @@
   resolved "https://registry.yarnpkg.com/@luban-h5/plugin-common-props/-/plugin-common-props-0.0.1.tgz#10fe5d5b2dda1db64912b3b99779aec60b5ea956"
   integrity sha512-D8UEBht2BCJt8YDHqcYj0hQmn3WM3QdX3Rw8eaZP02o0NeNe2oDPKE4mCM3eN9U1ygcrDf9bR48RB9YgHJRHGA==
  
-"@luban-h5/plugin-common-props@^0.1.6":
-  version "0.1.6"
-  resolved "https://registry.npmjs.org/@luban-h5/plugin-common-props/-/plugin-common-props-0.1.6.tgz#b4d44dd139ac99c58274c909fb61ca6df9051aa4"
-  integrity sha512-0+0yuLioozw+wx+3Ui9JYTIT7mKWVtKKrSZAe49ldfmhkA0zsv2phIkAVwqDDtsxuwO0t8a0fA05GwY6WRMjIA==
+"@luban-h5/plugin-common-props@^0.2.6":
+  version "0.2.6"
+  resolved "https://registry.npmjs.org/@luban-h5/plugin-common-props/-/plugin-common-props-0.2.6.tgz#a834f6564ef845238f14f449d0047f6b13a57adf"
+  integrity sha512-MQ94psT35blUdOb9vX1AfJCNVfVfCz+7v1d0sgY+4rSesaEU12HnlDg8Aaqfq5ePs6IQUSOtRWRgWSS4u6cKhQ==
  
 "@mrmlnc/readdir-enhanced@^2.2.1":
   version "2.2.1"