Merge branch 'master' of https://github.com/iview/iview into carousel
Conflicts: src/styles/components/index.less test/app.vue test/main.js
This commit is contained in:
Rijn
commit
50f4ac7088
27 changed files with 463 additions and 249 deletions
|
|
@ -5,7 +5,7 @@
|
|||
<Icon type="ios-person-outline" slot="prepend"></Icon>
|
||||
</i-input>
|
||||
</Form-item>
|
||||
<Form-item prop="password">
|
||||
<Form-item prop="password" :show-message="false">
|
||||
<i-input type="password" :value.sync="formInline.password" placeholder="Password">
|
||||
<Icon type="ios-locked-outline" slot="prepend"></Icon>
|
||||
</i-input>
|
||||
|
|
|
|||
|
|
@ -1,4 +1,6 @@
|
|||
<template>
|
||||
<Input-number :max="10" :min="1" :value="1"></Input-number>
|
||||
<br><br>
|
||||
<i-input type="textarea" :autosize="true" placeholder="请输入..."></i-input>
|
||||
<i-input type="textarea" :autosize="{minRows: 2,maxRows: 5}" placeholder="请输入..."></i-input>
|
||||
<i-input name="a" icon="ios-clock-outline" @on-focus="focus" @on-blur="blur" readonly style="width:200px;" :value.sync="v" @on-enter="enter" @on-click="iconclick" size="large" placeholder="请输入"></i-input>
|
||||
|
|
|
|||
|
|
@ -1,28 +1,51 @@
|
|||
<template>
|
||||
<Menu mode="horizontal" theme="primary" active-key="1">
|
||||
<Submenu key="1">
|
||||
<template slot="title">
|
||||
<Icon type="soup-can-outline"></Icon>
|
||||
数据管理
|
||||
</template>
|
||||
<Menu-group title="使用">
|
||||
<Menu-item key="1-1">新增和启动新增和启动</Menu-item>
|
||||
<Menu-item key="1-2">活跃分析</Menu-item>
|
||||
<Menu-item key="1-3">时段分析</Menu-item>
|
||||
</Menu-group>
|
||||
<Menu-group title="留存">
|
||||
<Menu-item key="1-4">用户留存</Menu-item>
|
||||
<Menu-item key="1-5">流失用户</Menu-item>
|
||||
</Menu-group>
|
||||
</Submenu>
|
||||
</Menu>
|
||||
<br>
|
||||
<p>切换主题</p>
|
||||
<Radio-group :model.sync="theme1">
|
||||
<Radio value="light"></Radio>
|
||||
<Radio value="dark"></Radio>
|
||||
<Radio value="primary"></Radio>
|
||||
</Radio-group>
|
||||
<div style="margin: 50px;position:relative;top: 0;left: 0;">
|
||||
<Menu mode="horizontal" :theme="theme1" active-key="1">
|
||||
<Menu-item key="1">
|
||||
<Icon type="ios-paper"></Icon>
|
||||
内容管理
|
||||
</Menu-item>
|
||||
<Menu-item key="2">
|
||||
<Icon type="ios-people"></Icon>
|
||||
用户管理
|
||||
</Menu-item>
|
||||
<Menu-item key="1">
|
||||
<Icon type="ios-paper"></Icon>
|
||||
内容管理
|
||||
</Menu-item>
|
||||
<Menu-item key="2">
|
||||
<Icon type="ios-people"></Icon>
|
||||
用户管理
|
||||
</Menu-item>
|
||||
<Menu-item key="1">
|
||||
<Icon type="ios-paper"></Icon>
|
||||
内容管理
|
||||
</Menu-item>
|
||||
<Menu-item key="2">
|
||||
<Icon type="ios-people"></Icon>
|
||||
用户管理
|
||||
</Menu-item>
|
||||
<Submenu key="3">
|
||||
<template slot="title">
|
||||
<Icon type="stats-bars"></Icon>
|
||||
统计分析
|
||||
</template>
|
||||
<Menu-group title="使用">
|
||||
<Menu-item key="3-1">新增和新</Menu-item>
|
||||
<Menu-item key="3-2">活跃分析</Menu-item>
|
||||
<Menu-item key="3-3">时段分析</Menu-item>
|
||||
</Menu-group>
|
||||
<Menu-group title="留存">
|
||||
<Menu-item key="3-4">用户留存</Menu-item>
|
||||
<Menu-item key="3-5">流失用户</Menu-item>
|
||||
</Menu-group>
|
||||
</Submenu>
|
||||
<Menu-item key="4">
|
||||
<Icon type="settings"></Icon>
|
||||
综合设置
|
||||
</Menu-item>
|
||||
</Menu>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
|
|
|
|||
|
|
@ -1,183 +1,22 @@
|
|||
<style>
|
||||
.tooltip_out{
|
||||
padding: 150px;
|
||||
}
|
||||
body{
|
||||
height: 1000px;
|
||||
padding: 10px;
|
||||
}
|
||||
.api table{
|
||||
font-family: Consolas,Menlo,Courier,monospace;
|
||||
font-size: 13px;
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0;
|
||||
empty-cells: show;
|
||||
border: 1px solid #e9e9e9;
|
||||
width: 100%;
|
||||
margin-bottom: 24px;
|
||||
}
|
||||
.api table th{
|
||||
background: #f7f7f7;
|
||||
white-space: nowrap;
|
||||
color: #5c6b77;
|
||||
font-weight: 600;
|
||||
}
|
||||
.api table td, .api table th{
|
||||
border: 1px solid #e9e9e9;
|
||||
padding: 8px 16px;
|
||||
text-align: left;
|
||||
}
|
||||
.tip{
|
||||
width: 24px;
|
||||
position: fixed;
|
||||
top: 10px;
|
||||
right: 10px;
|
||||
}
|
||||
.tip-inner{
|
||||
width: 24px;
|
||||
height: 24px;
|
||||
line-height: 22px;
|
||||
text-align: center;
|
||||
background: #fff;
|
||||
border: 1px solid #3399ff;
|
||||
color: #3399ff;
|
||||
border-radius: 50%;
|
||||
cursor: pointer;
|
||||
}
|
||||
.tip-content{
|
||||
width: 200px;
|
||||
height: 100px;
|
||||
white-space: normal;
|
||||
}
|
||||
</style>
|
||||
<template>
|
||||
<Tooltip content="这里是提示文字">
|
||||
当鼠标经过这段文字时，会显示一个气泡框
|
||||
</Tooltip>
|
||||
<div class="tooltip_out">
|
||||
<!--<Tooltip placement="top" content="Tooltip 文字提示">-->
|
||||
<!--<strong>-->
|
||||
<!--<a>Link</a>-->
|
||||
<!--</strong>-->
|
||||
<!--</Tooltip>-->
|
||||
<!--<Poptip trigger="hover" title="提示标题" content="提示内容">-->
|
||||
<!--<i-button>hover 激活</i-button>-->
|
||||
<!--</Poptip>-->
|
||||
<!--<Poptip content="提示内容" title="tip">-->
|
||||
<!--<i-button>click 激活</i-button>-->
|
||||
<!--</Poptip>-->
|
||||
<!--<Poptip content="提示内容">-->
|
||||
<!--<div slot="title"><i>自定义标题</i></div>-->
|
||||
<!--<i-button>click 激活</i-button>-->
|
||||
<!--</Poptip>-->
|
||||
<!--<Tooltip class="tip" placement="left-start" trigger="hover">-->
|
||||
<!--<div class="tip-inner">-->
|
||||
<!--<Icon type="information"></Icon>-->
|
||||
<!--</div>-->
|
||||
<!--<div class="tip-content" slot="content">-->
|
||||
<!--<p>iView 最新版本为 0.9.7，该版本对很多组件 UI 进行了调整</p>-->
|
||||
<!--</div>-->
|
||||
<!--</Tooltip>-->
|
||||
<!--<Poptip>-->
|
||||
<!--<a>click 激活</a>-->
|
||||
<!--<div slot="title"><i>自定义标题</i></div>-->
|
||||
<!--<div slot="content">-->
|
||||
<!--<a>关闭提示框</a>-->
|
||||
<!--</div>-->
|
||||
<!--</Poptip>-->
|
||||
<!--<Poptip placement="right" width="300">-->
|
||||
<!--<i-button type="ghost">click 激活</i-button>-->
|
||||
<!--<div class="api" slot="content">-->
|
||||
<!--<table>-->
|
||||
<!--<thead>-->
|
||||
<!--<tr>-->
|
||||
<!--<th>属性</th>-->
|
||||
<!--<th>说明</th>-->
|
||||
<!--<th>类型</th>-->
|
||||
<!--<th>默认值</th>-->
|
||||
<!--</tr>-->
|
||||
<!--</thead>-->
|
||||
<!--<tbody>-->
|
||||
<!--<tr>-->
|
||||
<!--<td>content</td>-->
|
||||
<!--<td>显示的内容</td>-->
|
||||
<!--<td>String | Number</td>-->
|
||||
<!--<td>空</td>-->
|
||||
<!--</tr>-->
|
||||
<!--<tr>-->
|
||||
<!--<td>placement</td>-->
|
||||
<!--<td>提示框出现的位置，可选值为<code>top</code><code>top-start</code><code>top-end</code><code>bottom</code><code>bottom-start</code><code>bottom-end</code><code>left</code><code>left-start</code><code>left-end</code><code>right</code><code>right-start</code><code>right-end</code></td>-->
|
||||
<!--<td>String</td>-->
|
||||
<!--<td>bottom</td>-->
|
||||
<!--</tr>-->
|
||||
<!--<tr>-->
|
||||
<!--<td>disabled</td>-->
|
||||
<!--<td>是否禁用提示框</td>-->
|
||||
<!--<td>Boolean</td>-->
|
||||
<!--<td>false</td>-->
|
||||
<!--</tr>-->
|
||||
<!--<tr>-->
|
||||
<!--<td>delay</td>-->
|
||||
<!--<td>延迟显示，单位毫秒</td>-->
|
||||
<!--<td>Number</td>-->
|
||||
<!--<td>0</td>-->
|
||||
<!--</tr>-->
|
||||
<!--</tbody>-->
|
||||
<!--</table>-->
|
||||
<!--</div>-->
|
||||
<!--</Poptip>-->
|
||||
<!--<Poptip title="标题" content="内容">-->
|
||||
<!--<Button>click 触发</Button>-->
|
||||
<!--</Poptip>-->
|
||||
<!--<Poptip title="标题" content="内容" trigger="hover">-->
|
||||
<!--<Button>hover 触发</Button>-->
|
||||
<!--</Poptip>-->
|
||||
<Poptip title="确定删除这条信息吗？" confirm content="内容" trigger="focus" @on-ok="ok" @on-cancel="cancel" @on-popper-hide="hide">
|
||||
<a><strong>Delete</strong></a>
|
||||
<div style="margin: 100px">
|
||||
<Poptip trigger="hover" placement="bottom" title="提示标题" content="提示内容">
|
||||
<i-button>hover 激活</i-button>
|
||||
</Poptip>
|
||||
<Poptip title="提示标题" placement="bottom" content="提示内容">
|
||||
<i-button>click 激活</i-button>
|
||||
</Poptip>
|
||||
<Poptip trigger="focus" title="提示标题" content="提示内容">
|
||||
<i-input type="textarea"></i-input>
|
||||
<!--<i-button>focus 激活</i-button>-->
|
||||
</Poptip>
|
||||
<Poptip trigger="focus" placement="bottom" title="提示标题" content="提示内容">
|
||||
<i-input></i-input>
|
||||
</Poptip>
|
||||
<!--<Poptip title="标题" content="内容" trigger="focus">-->
|
||||
<!--<input type="text">-->
|
||||
<!--</Poptip>-->
|
||||
<!--<Poptip title="标题" content="内容" trigger="focus">-->
|
||||
<!--<Button>focus 触发</Button>-->
|
||||
<!--</Poptip>-->
|
||||
<!--<Tooltip content="这里是提示文字">-->
|
||||
<!--当鼠标经过这段文字时，会显示一个气泡框-->
|
||||
<!--</Tooltip>-->
|
||||
<!--<Poptip>-->
|
||||
<!--<a>click 激活</a>-->
|
||||
<!--<div slot="content">-->
|
||||
<!--<a>关闭提示框</a>-->
|
||||
<!--</div>-->
|
||||
<!--</Poptip>-->
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { Tooltip, iButton, Row, iCol, Poptip, iSelect, iOption, Message, Icon } from 'iview';
|
||||
|
||||
export default {
|
||||
components: { Tooltip, iButton, Row, iCol, Poptip, iSelect, iOption, Message, Icon },
|
||||
props: {
|
||||
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
|
||||
},
|
||||
methods: {
|
||||
ok () {
|
||||
Message.info('ok');
|
||||
},
|
||||
cancel () {
|
||||
Message.info('cancel');
|
||||
},
|
||||
hide () {
|
||||
Message.info('hide')
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
25
test/routers/rate.vue
Normal file
25
test/routers/rate.vue
Normal file
|
|
@ -0,0 +1,25 @@
|
|||
<template>
|
||||
<Row>
|
||||
<i-col span="12">
|
||||
<Rate show-text :value.sync="valueText"></Rate>
|
||||
</i-col>
|
||||
<i-col span="12">
|
||||
<Rate show-text :value.sync="valueCustomText">
|
||||
<span style="color: #f5a623">{{ valueCustomText }}</span>
|
||||
</Rate>
|
||||
</i-col>
|
||||
</Row>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
props: {},
|
||||
data () {
|
||||
return {
|
||||
valueText: 3,
|
||||
valueCustomText: 3.8
|
||||
};
|
||||
},
|
||||
computed: {},
|
||||
methods: {}
|
||||
};
|
||||
</script>
|
||||
|
|
@ -1,24 +1,49 @@
|
|||
<template>
|
||||
<i-select :model.sync="model9" style="width:200px">
|
||||
<i-option value="beijing" label="北京市">
|
||||
<span>北京</span>
|
||||
<span style="float:right;color:#ccc">Beiing</span>
|
||||
</i-option>
|
||||
<i-option value="shanghai" label="上海市">
|
||||
<span>上海</span>
|
||||
<span style="float:right;color:#ccc">ShangHai</span>
|
||||
</i-option>
|
||||
<i-option value="shenzhen" label="深圳市">
|
||||
<span>深圳</span>
|
||||
<span style="float:right;color:#ccc">ShenZhen</span>
|
||||
</i-option>
|
||||
</i-select>
|
||||
<Row>
|
||||
<i-col span="12" style="padding-right:10px">
|
||||
<i-select :model.sync="model11" filterable>
|
||||
<i-option v-for="item in cityList" :value="item.value">{{ item.label }}</i-option>
|
||||
</i-select>
|
||||
</i-col>
|
||||
<i-col span="12">
|
||||
<i-select :model.sync="model12" filterable multiple>
|
||||
<i-option v-for="item in cityList" :value="item.value">{{ item.label }}</i-option>
|
||||
</i-select>
|
||||
</i-col>
|
||||
</Row>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
data () {
|
||||
return {
|
||||
model9: 'shanghai'
|
||||
cityList: [
|
||||
{
|
||||
value: 'beijing',
|
||||
label: '北京市'
|
||||
},
|
||||
{
|
||||
value: 'shanghai',
|
||||
label: '上海市'
|
||||
},
|
||||
{
|
||||
value: 'shenzhen',
|
||||
label: '深圳市'
|
||||
},
|
||||
{
|
||||
value: 'hangzhou',
|
||||
label: '杭州市'
|
||||
},
|
||||
{
|
||||
value: 'nanjing',
|
||||
label: '南京市'
|
||||
},
|
||||
{
|
||||
value: 'chongqing',
|
||||
label: '重庆市'
|
||||
}
|
||||
],
|
||||
model11: '',
|
||||
model12: []
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue