dbsz-common-ui

dbsz-common-ui

公用组件库

YearInput,
参数： format:{
            type:String,
            default:'yyyy.mm'
        },
        value:{
            type:[Number,String],
            default:''
        },
        disabled:{
          type:Boolean,
          default:false
        },
        style:{
          type:String,
          default:''
        },
        size:{
          type:String,
          default:''
        }
bcImport,
    参数：
    show: Boolean,
    value: Object,
    title: { type: String, default: '导入数据' },
    type: { type: String, default: 'front' },//导入方式：前端导入(front)、后端导入(backstage)
    //resultList:Array,//前端导入返回结果
    tempUrl: String,
    tempName: String,
    uploadUrl: String,
    importUrl: String,
    mattersTitle: { type: String, default: '注意事项' }, //注意事项标题
    mattersContent: { type: String, default: '' }, //注意事项内容
    maxSize: { type: Number, default: 2048 },  //
    disabled: { type: Boolean, default: false },
    fileType: { type: String, default: '.xls,.xlsx' },
    params: { type: Object, default: null },
    noticeTitle: { type: String, default: '导入结果' },
    importTypeList:{
    type:Array,
    default:()=>{
        return [
        {name:'新数据导入',value:'1'},
        {name:'覆盖导入',value:'2'}
        ]
    }
提供返回方法:['getImportResult','reloadData','getUploadResult','update:show'],
bcPage,
    参数：
     dataCount:Number,
        size:{
          type:String,
          default:'small'
        },
        pageSize: {
          type: Number,
          default: 10
        }
      },
    提供返回方法:['reload-data','update:pageSize'],
bcSenior,
    参数：
    common: Boolean,//是否显示常用查询
    keyValue2: Boolean,//是否显示关键字查询
    senior: Boolean,//是否显示高级查询
    clear: Boolean,//是否显示重置按钮
    saveToCommon: Boolean,//是否显示保存为常用筛选选项
    pageName: String,
    fieldList: Array,
    commonList: Array,
    item: Object,//用来和父组件同步筛选条件
    keyName:{
    type:String,
    default:''
    }, // 关键字名称 (keyName__commonlyKey,值) 
    返回方法：['update:item','seniorFind','clearAll'],
bcTable,
    参数：iviewuiplus的表格，参数看官网api

bcTree,
bcAuthorityTree,
    ztree的二次封装
    treeId:{ type: String, default: 'bc-tree' },
    searchId:{ type: String, default: 'keyword' },
    reload:{ type: Boolean, default: false },//重新加载
    showLine:{ type: Boolean, default: false }, //设置 zTree 是否显示节点之间的连线。
    showIcon:{ type: Boolean, default: false }, //设置 zTree 是否显示节点的图标。
    icon:{ type: String, default: '' }, //设置 zTree 是否显示节点的图标。
    selectedMulti:{ type: Boolean, default: false }, //设置是否允许同时选中多个节点。
    dblClickExpand:{ type: Boolean, default: true }, //双击节点时，是否自动展开父节点的标识.
    checkEnable:{ type: Boolean, default: false }, //设置 zTree 的节点上是否显示 checkbox / radio
    chkboxType: Object, //勾选 checkbox 对于父子节点的关联关系。[setting.check.enable = true 且 setting.check.chkStyle = "checkbox" 时生效]
    treeType:{ type: String, default: 'common' }, //树类型，区域(area)/单位(company)/通用(common)
    sequence:{ type: Boolean, default: false },
    url:{ type: String, default: '' }, //
    params: {type:Object,default:function() {return null}},
    setting: {type:Object,default:function() {return null}},
    selectedId:{type:String,default:''},//默认选中的节点id,如果传入first,那就是默认选中第一个
    selectedIds:{type:Array,default:() => {return []}},//默认选中的节点id,如果传入first,那就是默认选中第一个
    selectedType:{type:Array,default:() => {return []}},//可以选择的节点类型,是数组,允许配置多种类型 属性 type 一般是company dep person
    reSelect: { type: Boolean, default: false },//是否重新去选中默认节点
    showDep:{type: Boolean, default: false},//是否显示机构复选框
    ztreeName:{type: String, default: '组织机构树'},
    ztreeNameShow:{type: Boolean, default: false}//是否展示树文字说明

    this.$emit('onClick',event, treeId, treeNode);
    this.$emit('onCheck',event, treeId, treeNode);

bcUpload,
    show: {
        type: Boolean,
        default: true
      },
      showUploadList:{//是否显示上传文件列表
        type: Boolean,
        default: true
      },
      canUpload: {
        type: Boolean,
        default: true
      },
      key: {
        type: String,
        default: ''
      },
      multiple: {//是否支持多选文件
        type: Boolean,
        default: false
      },
      action: {//上传的地址，必填
        type: String,
        default: ()=>{
          let token=getToken()
          let uri='/api/v1/attach/binary?'+TOKEN_KEY+'='+token
          return uri
        }
      },
      format: {//支持的文件类型，与 accept 不同的是，format 是识别文件的后缀名，accept 为 input 标签原生的 accept 属性，会在选择文件时过滤，可以两者结合使用
        type: Array,
        default: function () {
          return []
        }
      },
      maxSize: {//文件大小限制，单位 kb
        type: Number,
        default: null,
      },
      fileArr: {//当前已上传文件集合
        type: Array,
        default: function () {
          return []
        }
      },
      fid: {
        type: String,
        default: ''
      },
      iconSize:{//图标大小
        type: String,
        default: '52'
      },
      divWidth:{//上传按钮宽度
        type: String,
        default: ''
      },
      divHeight:{//上传按钮高度
        type: String,
        default: ''
      },
    },
    emits:['on-success','on-error','on-remove'],
bcUploadImage,
    flag:{
        type: String,
        default: ''
      },
      width: {
        type: Number,
        default: 150
      },
      height: {
        type: Number,
        default: 170
      },
      maxFiles: {
        type: Number,
        default: 1
      },
      maxSize: {
        type: Number,
        default: 2048
      },
      defaultFileList: {
        type: Array,
        default: function(){
          return null
        }
      }
    },
    emits:['uploadImageCallback'],
fullScreen,
     elId:{ // 需要全屏的元素的ID
        type:String,
        default:''
    }
SvgIcon： 自定义svg图标
需要再vue.config.js中添加配置
// 设置 svg-sprite-loader
    config.module.rule('svg').exclude.add(resolve('src/icons')).end()
    config.module
      .rule('icons')
      .test(/\.svg$/)
      .include.add(resolve('src/icons'))
      .end()
      .use('svg-sprite-loader')
      .loader('svg-sprite-loader')
      .options({
        symbolId: 'icon-[name]'
      })
  },
  在src目录下添加icons文件夹，把自己需要的svg图标放到这个目录下

Compiles and hot-reloads for development

npm run serve

Compiles and minifies for production

npm run build

Lints and fixes files

npm run lint

Customize configuration

See Configuration Reference.