@cloud-ui/u-number-portlet.vue

    0.9.1 • Public • Published

    UNumberPortlet 数字窗格

    这里是数字窗格的基本描述。

    示例

    基本用法

    <u-number-portlet title="服务数" :value="20"></u-number-portlet>

    单位

    <u-number-portlet title="公有云" :value="20" unit="%"></u-number-portlet>

    对齐

    <u-number-portlet title="公有云" :value="20" unit="%" alignment="center"
        style="width: 300px"></u-number-portlet>

    布局

    <template>
    <u-grid-layout>
        <u-grid-layout-row :repeat="3">
            <u-grid-layout-column>
                <u-number-portlet title="服务数" :value="20"></u-number-portlet>
            </u-grid-layout-column>
            <u-grid-layout-column>
                <u-number-portlet title="实例数" :value="30"></u-number-portlet>
            </u-grid-layout-column>
            <u-grid-layout-column>
                <u-number-portlet title="请求数" :value="20"></u-number-portlet>
            </u-grid-layout-column>
        </u-grid-layout-row>
    </u-grid-layout>
    </template>

    颜色

    <template>
    <u-grid-layout>
        <u-grid-layout-row :repeat="4">
            <u-grid-layout-column>
                <u-number-portlet title="服务数" :value="20" color="primary"></u-number-portlet>
            </u-grid-layout-column>
            <u-grid-layout-column>
                <u-number-portlet title="实例数" :value="30" color="success"></u-number-portlet>
            </u-grid-layout-column>
            <u-grid-layout-column>
                <u-number-portlet title="请求数" :value="20" color="warning"></u-number-portlet>
            </u-grid-layout-column>
            <u-grid-layout-column>
                <u-number-portlet title="错误数" :value="20" color="error"></u-number-portlet>
            </u-grid-layout-column>
        </u-grid-layout-row>
    </u-grid-layout>
    </template>

    API

    Props/Attrs

    Prop/Attr Type Default Description
    value Number 数值
    title String 标题
    alignment String 'left' 'left'``'center'``'right'
    unit String 单位
    color String 颜色

    Install

    npm i @cloud-ui/u-number-portlet.vue

    DownloadsWeekly Downloads

    13

    Version

    0.9.1

    License

    MIT

    Unpacked Size

    383 kB

    Total Files

    21

    Last publish

    Collaborators

    • lip966
    • damowangdexiaogenban
    • lifuquan
    • rainfore
    • zhangxiaoyudaisy