refactor: update lbp-text

ly525
1 parent 2de2fc0a
Showing 3 changed files with 32 additions and 118 deletions
front-end/h5/src/components/plugins/lbp-button.js
front-end/h5/src/components/plugins/lbp-text.js
front-end/h5/src/mixins/load-plugins.js
@@ -33,7 +33,6 @@ export default {
   },
   name: 'lbp-button',
   props: {
-    ...commonProps,
     text: {
       type: String,
       default: '按钮',
@@ -43,18 +42,16 @@ export default {
         require: true
       }
     },
-    type: {
-      type: String,
-      default: 'text'
-    },
-    required: {
-      type: Boolean,
-      default: false
-    },
-    disabled: {
-      type: Boolean,
-      default: false
-    }
+    vertical: commonProps.vertical,
+    backgroundColor: commonProps.backgroundColor,
+    color: commonProps.color,
+    fontSize: commonProps.fontSize,
+    lineHeight: commonProps.lineHeight,
+    borderWidth: commonProps.borderWidth,
+    borderRadius: commonProps.borderRadius,
+    borderColor: commonProps.borderColor,
+    textAlign: commonProps.textAlign
+
   },
   editorConfig: {
     components: {
@@ -3,27 +3,18 @@ import { quillEditor } from &#39;vue-quill-editor&#39;
 import 'quill/dist/quill.core.css'
 import 'quill/dist/quill.snow.css'
 import './styles/text-overwrite-quil-snow-theme.scss'
+import commonProps from './common/props.js'
 export default {
   render (h) {
-    const {
-      color,
-      textAlign,
-      fontSize,
-      lineHeight,
-      borderColor,
-      borderWidth
-    } = this
-
     const style = {
       position: 'relative',
-      textAlign,
-      fontSize,
-      color: `${color} !important`,
+      color: `${this.color} !important`,
       textDecoration: 'none',
-      backgroundColor: 'transparent',
-      lineHeight: lineHeight + 'em',
-      border: `${borderWidth}px solid ${borderColor}`
+      backgroundColor: this.backgroundColor || 'transparent',
+      lineHeight: `${this.lineHeight}em`,
+      border: `${this.borderWidth}px solid ${this.borderColor}`,
+      borderRadius: `${this.borderRadius}px`
     }
     const pureText = <div domPropsInnerHTML={this.text} class="ql-editor ql-container"></div>
     return (
@@ -79,89 +70,15 @@ export default {
     }
   },
   props: {
+    backgroundColor: commonProps.backgroundColor,
+    borderWidth: commonProps.borderWidth,
+    borderRadius: commonProps.borderRadius,
+    borderColor: commonProps.borderColor,
     text: {
       type: String,
       default: '双击修改文字'
-    },
-    disabled: {
-      type: Boolean,
-      default: false
-    },
-    backgroundColor: {
-      type: String,
-      default: 'transparent'
-    },
-    lineHeight: {
-      type: Number,
-      default: 1
-    },
-    borderWidth: {
-      type: Number,
-      default: 0
-    },
-    borderRadius: {
-      type: Number,
-      default: 0
-    },
-    borderColor: {
-      type: String,
-      default: '#ced4da'
-    },
-    borderStyle: {
-      type: String,
-      default: 'solid'
     }
   },
   editorConfig: {
-    propsConfig: {
-      borderColor: {
-        type: 'a-input', // lbs-color-picker
-        label: '边框颜色',
-        prop: {
-          type: 'color'
-        },
-        require: true,
-        defaultPropValue: '#333333'
-      },
-      borderWidth: {
-        type: 'a-input-number',
-        label: '边框宽度(px)',
-        require: true,
-        prop: {
-          step: 1,
-          min: 0,
-          max: 10
-        },
-        defaultPropValue: 0
-      },
-      borderRadius: {
-        type: 'a-input-number',
-        label: '圆角(px)',
-        require: true,
-        prop: {
-          step: 0.1,
-          min: 0,
-          max: 10
-        },
-        defaultPropValue: 0
-      },
-      borderStyle: {
-        type: 'a-input',
-        label: '边框形式',
-        require: true,
-        defaultPropValue: 'solid'
-      },
-      lineHeight: {
-        type: 'a-input-number',
-        label: '行高',
-        require: true,
-        prop: {
-          step: 0.1,
-          min: 0.1,
-          max: 10
-        },
-        defaultPropValue: 1
-      }
-    }
   }
 }
@@ -3,7 +3,7 @@ import Vue from &#39;vue&#39;
 import LbpButton from '../components/plugins/lbp-button'
 // import LbpPicture from '../components/plugins/lbp-picture'
 // import LbpVideo from '../components/plugins/lbp-video'
-// import LbpText from '../components/plugins/lbp-text'
+import LbpText from '../components/plugins/lbp-text'
 // import LbpFormInput from '../components/plugins/lbp-form-input'
 // import LbpFormButton from '../components/plugins/lbp-form-button'
 // import LbpFormRadioGroup from '../components/plugins/lbp-form-radio-group'
@@ -23,17 +23,17 @@ export const pluginsList = [
   //   visible: true,
   //   name: LbpPicture.name
   // },
-  // {
-  //   i18nTitle: {
-  //     'en-US': 'Text',
-  //     'zh-CN': '文字'
-  //   },
-  //   title: '文字',
-  //   icon: 'text-width',
-  //   component: LbpText,
-  //   visible: true,
-  //   name: LbpText.name
-  // },
+  {
+    i18nTitle: {
+      'en-US': 'Text',
+      'zh-CN': '文字'
+    },
+    title: '文字',
+    icon: 'text-width',
+    component: LbpText,
+    visible: true,
+    name: LbpText.name
+  },
   {
     i18nTitle: {
       'en-US': 'Button',