0
点赞
收藏
分享

微信扫一扫

jenkins中编译出现,sonar问题

鱼板番茄 04-14 07:00 阅读 1

安装步骤

1. 使用NPM进行安装

npm install vx-easyui --save

2. 引入 EasyUI 文件

EasyUI JS文件导入.

import 'vx-easyui/dist/themes/default/easyui.css';
import 'vx-easyui/dist/themes/icon.css';
import 'vx-easyui/dist/themes/vue.css';
import EasyUI from 'vx-easyui';
Vue.use(EasyUI);

3. 将组件导入“App.vue”

<template>
<div>
<DataGrid :data="data" style="height:250px">
<GridColumn field="itemid" title="Item ID"></GridColumn>
<GridColumn field="name" title="Name"></GridColumn>
<GridColumn field="listprice" title="List Price" align="right"></GridColumn>
<GridColumn field="unitcost" title="Unit Cost" align="right"></GridColumn>
<GridColumn field="attr" title="Attribute" width="30%"></GridColumn>
<GridColumn field="status" title="Status" align="center"></GridColumn>
</DataGrid>
</div>
</template>
<script>
export default {
data() {
return {
data: [
{
"code": "FI-SW-01",
"name": "Koi",
"unitcost": 10.00,
"status": "P",
"listprice": 36.50,
"attr": "Large",
"itemid": "EST-1"
},
{
"code": "K9-DL-01",
"name": "Dalmation",
"unitcost": 12.00,
"status": "P",
"listprice": 18.50,
"attr": "Spotted Adult Female",
"itemid": "EST-10"
},
{
"code": "RP-SN-01",
"name": "Rattlesnake",
"unitcost": 12.00,
"status": "P",
"listprice": 38.50,
"attr": "Venomless",
"itemid": "EST-11"
},
{
"code": "RP-SN-01",
"name": "Rattlesnake",
"unitcost": 12.00,
"status": "P",
"listprice": 26.50,
"attr": "Rattleless",
"itemid": "EST-12"
},
{
"code": "RP-LI-02",
"name": "Iguana",
"unitcost": 12.00,
"status": "P",
"listprice": 35.50,
"attr": "Green Adult",
"itemid": "EST-13"
},
{
"code": "FL-DSH-01",
"name": "Manx",
"unitcost": 12.00,
"status": "P",
"listprice": 158.50,
"attr": "Tailless",
"itemid": "EST-14"
},
{
"code": "FL-DSH-01",
"name": "Manx",
"unitcost": 12.00,
"status": "P",
"listprice": 83.50,
"attr": "With tail",
"itemid": "EST-15"
},
{
"code": "FL-DLH-02",
"name": "Persian",
"unitcost": 12.00,
"status": "P",
"listprice": 23.50,
"attr": "Adult Female",
"itemid": "EST-16"
},
{
"code": "FL-DLH-02",
"name": "Persian",
"unitcost": 12.00,
"status": "P",
"listprice": 89.50,
"attr": "Adult Male",
"itemid": "EST-17"
},
{
"code": "AV-CB-01",
"name": "Amazon Parrot",
"unitcost": 92.00,
"status": "P",
"listprice": 63.50,
"attr": "Adult Male",
"itemid": "EST-18"
}
]
}
}
}
</script>

ButtonGroup(按钮组)

继承

none

用法

<ButtonGroup selectionMode="single">
<LinkButton iconCls="icon-add" :toggle="true" :selected="true">Add</LinkButton>
<LinkButton iconCls="icon-remove" :toggle="true">Remove</LinkButton>
<LinkButton iconCls="icon-save" :toggle="true">Save</LinkButton>
<LinkButton iconCls="icon-cut" :disabled="true">Cut</LinkButton>
</ButtonGroup>

属性

名称 类型 描述 默认
selectionMode string 按钮选择模式。可选的值:multiple, single.。 multiple

FieldBase(基本字段)

继承

none

属性

名称 类型 描述 默认
名称 string 字段名 null
invalid boolean 定义该值是否无效 false
validateOnBlur boolean 定义在失去焦点时是否验证。 false
validateOnChange boolean 定义是否在值更改时验证。 false

Tree(树)

继承

none

用法

<Tree :data="data" @selectionChange="selection=$event"></Tree>
<p v-if="selection">选择: {
  {selection.text}}</p>

属性

名称 类型 描述 默认
data array 要加载的数据 []
selectLeafOnly boolean 定义是否只选择叶节点。 false
checkbox boolean 定义是否在每个节点前显示复选框。 false
cascadeCheck boolean 定义是否进行级联检查。 true
cascadeCheck boolean 定义是否进行级联检查。 true

作用域

名称 参数 描述
默认 node 节点作用域。
editor node 编辑节点作用域。

事件

名称 参数 描述
selectionChange node 选择节点时触发。
nodeClick node 单击节点时触发。
nodeDblClick node 双击节点时触发。
nodeExpand node 在展开节点时触发。
nodeCollapse node 当节点被折叠时触发。
nodeCheck node 检查节点时触发
nodeUncheck node 当节点未选中时触发
checkChange nodes 更改选中节点时触发。
nodeContextMenu node, originalEvent 右击节点时触发。
editBegin {node, originalValue} 在开始编辑节点时触发。
editEnd {node, originalValue} 结束编辑节点时触发。
editCancel {node, originalValue} 取消编辑节点时触发。

方法

名称 参数 返回值 描述
selectNode node void 选择一个节点。
checkNode node void 检查节点。
uncheckNode node void 取消一个节点。
uncheckAllNodes none void 取消所有节点。
doFilter q void 执行筛选操作
beginEdit node void 开始编辑节点。
endEdit none void 结束当前编辑节点。
cancelEdit none void 取消当前编辑节点。

Accordion(分类)

继承

none

用法

<Accordion style="height:250px">
<AccordionPanel :title="'Title1'">
<p>Content1</p>
</AccordionPanel>
<AccordionPanel :title="'Title2'">
<p>Content2</p>
</AccordionPanel>
<AccordionPanel :title="'Title3'">
<p>Content3</p>
</AccordionPanel>
</Accordion>

属性

名称 类型 描述 默认
border boolean 定义是否显示边框。 true
multiple boolean 为True时展开多个面板。 false
animte boolean 定义展开或折叠面板时是否显示动画效果。 false
selectedIndex number,array 已初始化的选中面板索引。 0

事件

名称 参数 描述
panelSelect panel 选中面板时触发
panelUnselect panel 未选中面板时触发。

方法

名称 参数 返回值 描述
select index void 选择指定的面板。
unselect index void 取消选择指定的面板。
getPanel index AccordionPanel 获得指定面板。
getPanelIndex panel number 获得指定面板索引。
getSelectedIndex none number 获取第一个选中面板的索引。
getSelectedPanel none AccordionPanel 获取第一个选中的面板。
getSelectedPanels none AccordionPanel[] 获取所有选中的面板

Messager(消息窗口)

继承

none

属性

名称 类型 描述 默认
ok string 确定按钮文本。 Ok
cancel string 取消按钮文本。 Cancel
title string 消息标题。
msg string 要在对话框中显示的消息。
icon string 要在对话框上显示的图标类。

方法

名称 参数 返回值 描述
alert options void 显示警告消息对话框。

代码实例:

this.$messager.alert({
	title: "Info",
	icon: "info",
	msg: "Here is a info message!"
});
confirm options void 显示确认消息对话框。

代码实例:

this.$messager.confirm({
	title: "Confirm",
	msg: "Are you confirm this?",
	result: r => {
	  if (r) {
	    alert("confirmed: " + r);
	  }
	}
});
prompt options void 显示提示消息对话框。

代码实例:

this.$messager.prompt({
	title: "Prompt",
	msg: "Please type something",
	result: r => {
	  if (r) {
	    alert("you type: " + r);
	  }
	}
});

GridColumnGroup(表格列组)

继承

none

属性

名称 类型 描述 默认
frozen boolean 定义是否冻结列组。 false
align string 列组对齐方式。可选的值:'left','right'。 left
width number,string 列组宽度。 null

ComboBox(下拉列表框)

继承

ComboBase

用法

<Label for="c1" align="top">选择一个值:</Label>
<ComboBox inputId="c1" v-model="value" :data="data"></ComboBox>
<p v-if="value">选择值: {
  {value}}</p>

属性

名称 类型 描述 默认
value string,number,array 字段值。 null
data array 要加载的数据。 []
valueField string 绑定到此组件的底层数据值名称。 value
textField string 绑定到此组件的基础数据字段名。 text
limitToList boolean 为True时,将输入值限制为列出的项。 true
lazy boolean 定义是否延迟加载数据。 false
virtualScroll boolean 定义是否启用虚拟滚动。 false
rowHeight number 行高度,当virtualScroll设置为true时启用此属性。 30
pageNumber number 设置virtualScroll属性时,初始化页码。 1
pageSize number 设置virtualScroll属性时,初始化页面大小。 10
total number 设置virtualScroll属性时,初始化总记录数。 0

作用域

名称 参数 描述
item row,rowIndex 数据项的作用域。

事件

名称 参数 描述
selectionChange event 更改选择时触发。
filterChange pageNumber, pageSize, filterValue 当过滤器值更改时触发。

SubMenu(子菜单)

继承

none

属性

名称 类型 描述 默认
menuCls string 菜单样式类。 null
menuStyle Object 菜单内联样式。 null
menuWidth any 菜单宽度。 null

TimeSpinner(时间微调框)

继承

SpinnerBase

用法

<TimeSpinner placeholder="Select a time"
             v-model="time"
             min="08:30"
             max="18:10">
</TimeSpinner>
<p v-if="time">选择: {
  {time}}</p>

属性

名称 类型 描述 默认
value string 字段值。 null
min string 最小允许时间。 null
max string 最大允许时间。 null
increment number 单击微调按钮时增加值。 1
highlight number 初始化突出显示的字段,0 =小时,1 =分钟 0
format string 时间格式。 HH:mm

Form(基本表单)

继承

none

用法

<Form ref="form" :model="user" :rules="rules" @validate="errors=$event">
<div style="margin-bottom:20px">
<Label for="name" align="top">Name:</Label>
<TextBox inputId="name" name="name" v-model="user.name"></TextBox>
<div class="error">{
  {getError('name')}}</div>
</div>
<div style="margin-bottom:20px">
<Label for="email" align="top">Email:</Label>
<TextBox inputId="email" name="email" v-model="user.email"></TextBox>
<div class="error">{
  {getError('email')}}</div>
</div>
<div style="margin-bottom:20px">
<Label for="hero" align="top">Select a hero:</Label>
<ComboBox inputId=hero name="hero" :data="heroes" v-model="user.hero"></ComboBox>
<div class="error">{
  {getError('hero')}}</div>
</div>
<div style="margin-bottom:20px">
<CheckBox inputId="accept" name="accept" v-model="user.accept"></CheckBox>
<Label for="accept">Accept Me</Label>
</div>
<div style="margin-bottom:20px">
<LinkButton :disabled="false" @click="submitForm()">Submit</LinkButton>
</div>
</Form>

属性

名称 类型 描述 默认
model Object 表单数据。 null
rules Ob
举报

相关推荐

0 条评论