feat(plugin): add rate componnet; #!zh: 增加评分组件

ly525
1 parent 91e1cbad
Showing 2 changed files with 102 additions and 0 deletions
front-end/h5/src/components/plugins/lbp-rate.js
front-end/h5/src/mixins/load-plugins.js
+/*
+ * @Author: ly525
+ * @Date: 2020-05-17 20:04:23
+ * @LastEditors: ly525
+ * @LastEditTime: 2020-05-17 21:33:31
+ * @FilePath: /luban-h5/front-end/h5/src/components/plugins/lbp-rate.js
+ * @Github: https://github.com/ly525/luban-h5
+ * @Description: Do not edit
+ * @Copyright 2018 - 2019 luban-h5. All Rights Reserved
+ */
+import PropTypes from '@luban-h5/plugin-common-props'
+import { Rate } from 'vant'
+import 'vant/lib/rate/style'
+import 'vant/lib/icon/local.css'
+
+export default {
+  name: 'lbp-rate',
+  props: {
+    value: PropTypes.number({
+      defaultValue: 5,
+      label: '当前分值'
+    }),
+    count: PropTypes.number({
+      defaultValue: 5,
+      label: '图标总数'
+    }),
+    size: PropTypes.number({
+      defaultValue: 16,
+      label: '图标大小'
+    }),
+    gutter: PropTypes.number({
+      defaultValue: 16,
+      label: '图标间距'
+    }),
+    mode: {
+      type: String,
+      default: '',
+      editor: {
+        type: 'a-select',
+        label: '模式',
+        props: {
+          options: [
+            {
+              label: 'star',
+              value: 'star'
+            },
+            {
+              label: '点赞',
+              value: 'like'
+            },
+            {
+              label: 'Good',
+              value: 'good-job'
+            }
+          ]
+        }
+      }
+    }
+  },
+  componentsForPropsEditor: {
+  },
+  mounted () {
+  },
+  methods: {
+
+  },
+  render () {
+    return <Rate
+      value={this.value}
+      count={this.count}
+      size={this.size}
+      color={this.color}
+      gutter={this.gutter}
+      void-icon="star"
+      void-color="#eee"
+    />
+  }
+}
@@ -12,6 +12,8 @@ import LbpBackground from &#39;../components/plugins/lbp-background&#39;
 import LbpSlide from '../components/plugins/lbp-slide'
 import LbpBgMusic from '../components/plugins/lbp-bg-music'
 import LbpNoticeBar from '../components/plugins/lbp-notice-bar'
+import LbpRate from '../components/plugins/lbp-rate'
+// import LbpTabs from '../components/plugins/lbp-tabs'
  
 export const pluginsList = [
   {
@@ -25,6 +27,28 @@ export const pluginsList = [
     visible: true,
     name: LbpNoticeBar.name
   },
+  // {
+  //   title: '标签页',
+  //   i18nTitle: {
+  //     'en-US': 'Tabs',
+  //     'zh-CN': '标签页'
+  //   },
+  //   icon: 'tab',
+  //   component: LbpTabs,
+  //   visible: true,
+  //   name: LbpTabs.name
+  // },
+  {
+    title: '评分',
+    i18nTitle: {
+      'en-US': 'Rate',
+      'zh-CN': '评分'
+    },
+    icon: 'star-o',
+    component: LbpRate,
+    visible: true,
+    name: LbpRate.name
+  },
   {
     title: '图片',
     i18nTitle: {