sun-vue-components

Installation

    cnpm i sun-vue-components -S

    import sun from 'sun-vue-components'

    Vue.use(sun)

Usage

vue-loading-template

Use SVG for loading.

Attributes

Parameter	Type	Required	Default	Description
svgType	String	false	bars	设置图标样式 支持 'balls', 'bars', 'beat', 'bubbles', 'cylon', 'spin', 'spiningDubbles', 'barsCylon'
svgColor	String	false	#eceacf	设置图标颜色,如果showText为true,也会设置为字体颜色
svgSize	Object	false	{width:50px,height:50px}	设置图标大小
showText	Boolean	false	false	是否显示文字
LoadingText	String	flase	拼命加载数据中...	设置显示的文字
bgColor	String	false	{color: 'rgba(255,255,255,0.5)'}	设置整个盒子的背景颜色
size	Object	false	{width: 100%,height:100%}	设置整个盒子的宽高
pos	Object	false	{position:absolute;top:0;left:0}	设置整个盒子的位置

eg:

    <sun-loading-template :showText="true"></sun-loading-template>

tip:

    如果webpack配置了url-load 会转换为base64 需要引入一个 raw-loader svg才可以正常显示
    {
        test: /\.svg$/,
        loader: "raw-loader"
    }

barCode

Use barCode for jsbarcode.

Parameter	Type	Required	Default	Description
data	default	true	''	根据传入的内容生成条形码
width	String	false	"small"	生成条形码的宽度 tiny/small/large/
height	Number	flase	60	条形码生成的高度
showText	Boolean	false	true	是否在条形码下方显示出传入的data
fontSize	Number	false	20	显示的文字大小
pos	Object	false	{position: 'absolute',left: 0,top:0}	条形码显示的位置

eg:

   <sun-barcode :data="1231231212313123"></sun-barcode>

message

Message弹框针对Pc端

Parameter	Type	Required	Default	Description
message	String	false	''	弹框显示的内容
time	Number	false	''	弹框多少秒后自动消失

eg:

   this.$sun_message({
      message: '这是一个message',
      time: 5000
    })