1.0.2 • Published 5 months ago

iform-pending v1.0.2

Weekly downloads
-
License
AK
Repository
-
Last release
5 months ago

iform-penging

一款基于Vue框架和Element-UI组件库开发的待办中心栏目和待办消息

iform-penging有两种组件:

  • 待办中心栏目(iform-penging-column)
  • 待办消息(iform-penging-message)

install 安装

    npm install iform-penging --save

use 使用

在main.js中写入下面的代码

    import Vue from 'vue'
    import IformPenging from 'iform-penging'
    Vue.use(IformPenging)

接下来,你就可以在页面中使用IformPenging

<template>
     <iform-pending-message
    :url="pendingUrl"
    :headers="pendingHeaders"
    :more-url="pendingMoreUrl"
    />
    <p/>
    <iform-pending-column
    :url="pendingUrl"
    :headers="pendingHeaders"
    :more-url="pendingMoreUrl"
    :height="430"
    />

</template>
<script>
    export default {
        data () {
            return {
               //api地址
                pendingUrl:"http://192.168.3.230:42000/iform",
                      //api地址请求头,主要设置token
                 pendingHeaders:{
                    'X-Authorization-access_token':'e3ae39424a44438d9458c69aeb631cb5'
                 }, 
                //点击更多跳转的地址
                 pendingMoreUrl:"http://localhost:9528/#/"
            }
        }
    }
</script>

如果页面直接引用 【推荐该方案】

<template>
    <iform-pending-message
    :url="pendingUrl"
    :headers="pendingHeaders"
    :more-url="pendingMoreUrl"
    />
    <p/>
    <iform-pending-column
    :url="pendingUrl"
    :headers="pendingHeaders"
    :more-url="pendingMoreUrl"
    :height="430"
    />
</template>
<script>
import { IformPendingColumn } from 'iform-pending'
import { IformPendingMessage } from 'iform-pending'
    export default {
      components: {
        IformPendingColumn,
        IformPendingMessage
      },
        data () {
            return {
               //api地址
                pendingUrl:"http://192.168.3.230:42000/iform",
                      //api地址请求头,主要设置token
                 pendingHeaders:{
                    'X-Authorization-access_token':'e3ae39424a44438d9458c69aeb631cb5'
                 }, 
                //点击更多跳转的地址
                 pendingMoreUrl:"http://localhost:9528/#/"
            }
        }
    }
</script>

iform-pending-column 配置说明:

属性 Attributes

属性说明 类型 默认值
urlapi地址String-
headersapi地址请求头,主要设置tokenObject-
more-url点击更多和栏目的跳转地址String-
height栏目的高度Number400
limit栏目的显示条数Number20

iform-pending-message 配置说明:

属性 Attributes

属性说明 类型 默认值
urlapi地址String-
headersapi地址请求头,主要设置tokenObject-
more-url点击更多和栏目的跳转地址String-
limit栏目的显示条数Number3

插槽 Slots

name说明
icon图标插槽String-
1.0.2

5 months ago