yangdan8
GitHub
commit
4ac6bce418
51 changed files with 1008 additions and 105 deletions
|
|
@ -40,13 +40,6 @@ iView
|
|||
</a>
|
||||
</td>
|
||||
</tr>
|
||||
<tr>
|
||||
<td align="center" valign="middle">
|
||||
<a href="https://uniapp.dcloud.io/?hmsr=iview&hmpl=&hmcu=&hmkw=&hmci=" target="_blank">
|
||||
<img width="300" src="https://file.iviewui.com/asd/asd-uniapp.png">
|
||||
</a>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
|
||||
|
|
|
|||
|
|
@ -68,6 +68,7 @@ nav {
|
|||
<li><router-link to="/time">Time</router-link></li>
|
||||
<li><router-link to="/cell">Cell</router-link></li>
|
||||
<li><router-link to="/drawer">Drawer</router-link></li>
|
||||
<li><router-link to="/icon">Icon</router-link></li>
|
||||
</ul>
|
||||
</nav>
|
||||
<router-view></router-view>
|
||||
|
|
|
|||
|
|
@ -229,6 +229,10 @@ const router = new VueRouter({
|
|||
{
|
||||
path: '/drawer',
|
||||
component: (resolve) => require(['./routers/drawer.vue'], resolve)
|
||||
},
|
||||
{
|
||||
path: '/icon',
|
||||
component: (resolve) => require(['./routers/icon.vue'], resolve)
|
||||
}
|
||||
]
|
||||
});
|
||||
|
|
|
|||
|
|
@ -220,7 +220,9 @@
|
|||
<Button type="default">Small</Button>
|
||||
</Button-group>
|
||||
|
||||
<br><br><br><br><br>
|
||||
<br><br>
|
||||
<Button to="/icon">Open New Window</Button>
|
||||
<br><br><br>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
|
|
|
|||
|
|
@ -3,7 +3,7 @@
|
|||
<Card title="选项" :padding="0" shadow style="width: 300px;">
|
||||
<CellGroup @on-click="handleClick">
|
||||
<Cell title="标题一" name="a1" label="附属内容" to="/button">
|
||||
<Badge count="10" slot="extra"></Badge>
|
||||
<Badge :count="10" slot="extra"></Badge>
|
||||
</Cell>
|
||||
<Cell title="标题一" name="a2" label="附属内容" extra="详细信息"></Cell>
|
||||
<Cell title="标题一" name="a3" label="附属内容" extra="详细信息" to="/button"></Cell>
|
||||
|
|
|
|||
15
examples/routers/icon.vue
Normal file
15
examples/routers/icon.vue
Normal file
File diff suppressed because one or more lines are too long
|
|
@ -1,12 +1,50 @@
|
|||
<template>
|
||||
<div style="margin: 200px;">
|
||||
<Select size="small" v-model="model10" multiple style="width:260px">
|
||||
<div style="margin: 100px;">
|
||||
<Select v-model="model1" filterable style="width:200px" prefix="ios-albums">
|
||||
<Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
|
||||
</Select>
|
||||
<Select v-model="model10" multiple style="width:260px">
|
||||
|
||||
<Select v-model="model10" filterable :max-tag-count="2" multiple style="width:400px">
|
||||
<Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
|
||||
</Select>
|
||||
<Select size="large" v-model="model10" multiple style="width:260px">
|
||||
|
||||
<Select v-model="model10" filterable :max-tag-count="2" multiple style="width:400px" prefix="ios-albums">
|
||||
<Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
|
||||
</Select>
|
||||
|
||||
<br><br>
|
||||
|
||||
<Select v-model="model1" style="width:200px">
|
||||
<Icon type="ios-alarm" slot="prefix" color="red" />
|
||||
<Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
|
||||
</Select>
|
||||
|
||||
<Select v-model="model1" style="width:200px">
|
||||
<Avatar src="https://dev-file.iviewui.com/userinfoPDvn9gKWYihR24SpgC319vXY8qniCqj4/avatar" slot="prefix" size="small" />
|
||||
<Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
|
||||
</Select>
|
||||
|
||||
<Select v-model="model10" :max-tag-count="3" :max-tag-placeholder="more" multiple style="width:400px" prefix="ios-albums">
|
||||
<Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
|
||||
</Select>
|
||||
|
||||
<br><br>
|
||||
|
||||
<Select size="small" v-model="model1" style="width:200px" prefix="ios-albums">
|
||||
<Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
|
||||
</Select>
|
||||
|
||||
<Select size="small" v-model="model10" multiple style="width:400px" prefix="ios-albums">
|
||||
<Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
|
||||
</Select>
|
||||
|
||||
<br><br>
|
||||
|
||||
<Select size="large" v-model="model1" style="width:200px" prefix="ios-albums">
|
||||
<Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
|
||||
</Select>
|
||||
|
||||
<Select size="large" v-model="model10" multiple style="width:400px" prefix="ios-albums">
|
||||
<Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
|
||||
</Select>
|
||||
</div>
|
||||
|
|
@ -22,7 +60,7 @@
|
|||
},
|
||||
{
|
||||
value: 'London',
|
||||
label: 'LondonLondonLondonLondonLondonLondonLondonLondonLondonLondonLondonLondonLondonLondonLondonLondonLondonLondon'
|
||||
label: 'London'
|
||||
},
|
||||
{
|
||||
value: 'Sydney',
|
||||
|
|
@ -41,7 +79,13 @@
|
|||
label: 'Canberra'
|
||||
}
|
||||
],
|
||||
model10: ['New York', 'London']
|
||||
model1: '',
|
||||
model10: []
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
more (num) {
|
||||
return 'more' + num;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
|||
99
package-lock.json
generated
99
package-lock.json
generated
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "iview",
|
||||
"version": "3.2.2",
|
||||
"version": "3.3.3",
|
||||
"lockfileVersion": 1,
|
||||
"requires": true,
|
||||
"dependencies": {
|
||||
|
|
@ -1898,6 +1898,12 @@
|
|||
}
|
||||
}
|
||||
},
|
||||
"builtin-modules": {
|
||||
"version": "1.1.1",
|
||||
"resolved": "https://registry.npmjs.org/builtin-modules/-/builtin-modules-1.1.1.tgz",
|
||||
"integrity": "sha1-Jw8HbFpywC9bZaR9+Uxf46J4iS8=",
|
||||
"dev": true
|
||||
},
|
||||
"builtin-status-codes": {
|
||||
"version": "3.0.0",
|
||||
"resolved": "https://registry.npmjs.org/builtin-status-codes/-/builtin-status-codes-3.0.0.tgz",
|
||||
|
|
@ -13571,6 +13577,70 @@
|
|||
"integrity": "sha1-yy4SAwZ+DI3h9hQJS5/kVwTqYAM=",
|
||||
"dev": true
|
||||
},
|
||||
"tslib": {
|
||||
"version": "1.9.3",
|
||||
"resolved": "https://registry.npmjs.org/tslib/-/tslib-1.9.3.tgz",
|
||||
"integrity": "sha512-4krF8scpejhaOgqzBEcGM7yDIEfi0/8+8zDRZhNZZ2kjmHJ4hv3zCbQWxoJGz1iw5U0Jl0nma13xzHXcncMavQ==",
|
||||
"dev": true
|
||||
},
|
||||
"tslint": {
|
||||
"version": "5.14.0",
|
||||
"resolved": "https://registry.npmjs.org/tslint/-/tslint-5.14.0.tgz",
|
||||
"integrity": "sha512-IUla/ieHVnB8Le7LdQFRGlVJid2T/gaJe5VkjzRVSRR6pA2ODYrnfR1hmxi+5+au9l50jBwpbBL34txgv4NnTQ==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"babel-code-frame": "6.26.0",
|
||||
"builtin-modules": "1.1.1",
|
||||
"chalk": "2.4.2",
|
||||
"commander": "2.19.0",
|
||||
"diff": "3.5.0",
|
||||
"glob": "7.1.3",
|
||||
"js-yaml": "3.7.0",
|
||||
"minimatch": "3.0.4",
|
||||
"mkdirp": "0.5.1",
|
||||
"resolve": "1.10.0",
|
||||
"semver": "5.6.0",
|
||||
"tslib": "1.9.3",
|
||||
"tsutils": "2.29.0"
|
||||
},
|
||||
"dependencies": {
|
||||
"ansi-styles": {
|
||||
"version": "3.2.1",
|
||||
"resolved": "https://registry.npmjs.org/ansi-styles/-/ansi-styles-3.2.1.tgz",
|
||||
"integrity": "sha512-VT0ZI6kZRdTh8YyJw3SMbYm/u+NqfsAxEpWO0Pf9sq8/e94WxxOpPKx9FR1FlyCtOVDNOQ+8ntlqFxiRc+r5qA==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"color-convert": "1.9.3"
|
||||
}
|
||||
},
|
||||
"chalk": {
|
||||
"version": "2.4.2",
|
||||
"resolved": "https://registry.npmjs.org/chalk/-/chalk-2.4.2.tgz",
|
||||
"integrity": "sha512-Mti+f9lpJNcwF4tWV8/OrTTtF1gZi+f8FqlyAdouralcFWFQWF2+NgCHShjkCb+IFBLq9buZwE1xckQU4peSuQ==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"ansi-styles": "3.2.1",
|
||||
"escape-string-regexp": "1.0.5",
|
||||
"supports-color": "5.5.0"
|
||||
}
|
||||
},
|
||||
"has-flag": {
|
||||
"version": "3.0.0",
|
||||
"resolved": "https://registry.npmjs.org/has-flag/-/has-flag-3.0.0.tgz",
|
||||
"integrity": "sha1-tdRU3CGZriJWmfNGfloH87lVuv0=",
|
||||
"dev": true
|
||||
},
|
||||
"supports-color": {
|
||||
"version": "5.5.0",
|
||||
"resolved": "https://registry.npmjs.org/supports-color/-/supports-color-5.5.0.tgz",
|
||||
"integrity": "sha512-QjVjwdXIt408MIiAqCX4oUKsgU2EqAGzs2Ppkm4aQYbjm+ZEWEcW4SfFNTr4uMNZma0ey4f5lgLrkB0aX0QMow==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"has-flag": "3.0.0"
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
"tsscmp": {
|
||||
"version": "1.0.6",
|
||||
"resolved": "https://registry.npmjs.org/tsscmp/-/tsscmp-1.0.6.tgz",
|
||||
|
|
@ -13578,6 +13648,15 @@
|
|||
"dev": true,
|
||||
"optional": true
|
||||
},
|
||||
"tsutils": {
|
||||
"version": "2.29.0",
|
||||
"resolved": "https://registry.npmjs.org/tsutils/-/tsutils-2.29.0.tgz",
|
||||
"integrity": "sha512-g5JVHCIJwzfISaXpXE1qvNalca5Jwob6FjI4AoPlqMusJ6ftFE7IkkFoMhVLRgK+4Kx3gkzb8UZK5t5yTTvEmA==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"tslib": "1.9.3"
|
||||
}
|
||||
},
|
||||
"tty-browserify": {
|
||||
"version": "0.0.0",
|
||||
"resolved": "https://registry.npmjs.org/tty-browserify/-/tty-browserify-0.0.0.tgz",
|
||||
|
|
@ -13631,6 +13710,12 @@
|
|||
"integrity": "sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c=",
|
||||
"dev": true
|
||||
},
|
||||
"typescript": {
|
||||
"version": "3.3.4000",
|
||||
"resolved": "https://registry.npmjs.org/typescript/-/typescript-3.3.4000.tgz",
|
||||
"integrity": "sha512-jjOcCZvpkl2+z7JFn0yBOoLQyLoIkNZAs/fYJkUG6VKy6zLPHJGfQJYFHzibB6GJaF/8QrcECtlQ5cpvRHSMEA==",
|
||||
"dev": true
|
||||
},
|
||||
"uglify-js": {
|
||||
"version": "2.8.29",
|
||||
"resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-2.8.29.tgz",
|
||||
|
|
@ -14276,9 +14361,9 @@
|
|||
"dev": true
|
||||
},
|
||||
"vue": {
|
||||
"version": "2.6.6",
|
||||
"resolved": "https://registry.npmjs.org/vue/-/vue-2.6.6.tgz",
|
||||
"integrity": "sha512-Y2DdOZD8sxApS+iUlwv1v8U1qN41kq6Kw45lM6nVZKhygeWA49q7VCCXkjXqeDBXgurrKWkYQ9cJeEJwAq0b9Q==",
|
||||
"version": "2.6.10",
|
||||
"resolved": "https://registry.npmjs.org/vue/-/vue-2.6.10.tgz",
|
||||
"integrity": "sha512-ImThpeNU9HbdZL3utgMCq0oiMzAkt1mcgy3/E6zWC/G6AaQoeuFdsl9nDhTDU3X1R6FK7nsIUuRACVcjI+A2GQ==",
|
||||
"dev": true
|
||||
},
|
||||
"vue-hot-reload-api": {
|
||||
|
|
@ -14578,9 +14663,9 @@
|
|||
}
|
||||
},
|
||||
"vue-template-compiler": {
|
||||
"version": "2.6.6",
|
||||
"resolved": "https://registry.npmjs.org/vue-template-compiler/-/vue-template-compiler-2.6.6.tgz",
|
||||
"integrity": "sha512-OakxDGyrmMQViCjkakQFbDZlG0NibiOzpLauOfyCUVRQc9yPmTqpiz9nF0VeA+dFkXegetw0E5x65BFhhLXO0A==",
|
||||
"version": "2.6.10",
|
||||
"resolved": "https://registry.npmjs.org/vue-template-compiler/-/vue-template-compiler-2.6.10.tgz",
|
||||
"integrity": "sha512-jVZkw4/I/HT5ZMvRnhv78okGusqe0+qH2A0Em0Cp8aq78+NK9TII263CDVz2QXZsIT+yyV/gZc/j/vlwa+Epyg==",
|
||||
"dev": true,
|
||||
"requires": {
|
||||
"de-indent": "1.0.2",
|
||||
|
|
|
|||
11
package.json
11
package.json
|
|
@ -1,6 +1,6 @@
|
|||
{
|
||||
"name": "iview",
|
||||
"version": "3.3.3",
|
||||
"version": "3.4.0-rc.2",
|
||||
"title": "iView",
|
||||
"description": "A high quality UI components Library with Vue.js",
|
||||
"homepage": "http://www.iviewui.com",
|
||||
|
|
@ -29,8 +29,9 @@
|
|||
"dist:locale": "webpack --config build/webpack.dist.locale.config.js",
|
||||
"dist": "npm run dist:style && npm run dist:dev && npm run dist:prod && npm run dist:locale",
|
||||
"lint": "eslint --fix --ext .js,.vue src",
|
||||
"tslint": "tslint --type-check --fix --project .",
|
||||
"unit": "cross-env BABEL_ENV=test karma start test/unit/karma.conf.js --single-run",
|
||||
"test": "npm run lint && npm run unit",
|
||||
"test": "npm run lint && npm run tslint && npm run unit",
|
||||
"prepare": "npm run dist"
|
||||
},
|
||||
"repository": {
|
||||
|
|
@ -103,15 +104,17 @@
|
|||
"sinon": "^4.4.2",
|
||||
"sinon-chai": "^3.3.0",
|
||||
"style-loader": "^0.20.2",
|
||||
"tslint": "^5.14.0",
|
||||
"typescript": "^3.3.4000",
|
||||
"uglifyjs-webpack-plugin": "^1.3.0",
|
||||
"url-loader": "^1.1.2",
|
||||
"vue": "^2.5.17",
|
||||
"vue": "^2.6.10",
|
||||
"vue-hot-reload-api": "^2.3.1",
|
||||
"vue-html-loader": "^1.2.4",
|
||||
"vue-loader": "^14.2.1",
|
||||
"vue-router": "^3.0.2",
|
||||
"vue-style-loader": "^4.1.2",
|
||||
"vue-template-compiler": "^2.5.17",
|
||||
"vue-template-compiler": "^2.6.10",
|
||||
"webpack": "^3.11.0",
|
||||
"webpack-dev-server": "^2.11.3",
|
||||
"webpack-merge": "^3.0.0"
|
||||
|
|
|
|||
|
|
@ -67,9 +67,15 @@ const Transition = {
|
|||
export default {
|
||||
name: 'CollapseTransition',
|
||||
functional: true,
|
||||
render(h, { children }) {
|
||||
props: {
|
||||
appear: Boolean
|
||||
},
|
||||
render(h, { children, props }) {
|
||||
const data = {
|
||||
on: Transition
|
||||
on: Transition,
|
||||
props: {
|
||||
appear: props.appear
|
||||
}
|
||||
};
|
||||
|
||||
return h('transition', data, children);
|
||||
|
|
|
|||
|
|
@ -1,5 +1,5 @@
|
|||
<template>
|
||||
<transition :name="transitionName" @enter="handleEnter" @leave="handleLeave">
|
||||
<transition :name="transitionName" @enter="handleEnter" @leave="handleLeave" appear>
|
||||
<div :class="classes" :style="styles">
|
||||
<template v-if="type === 'notice'">
|
||||
<div :class="contentClasses" ref="content" v-html="content"></div>
|
||||
|
|
|
|||
|
|
@ -17,7 +17,7 @@
|
|||
v-show="filterable && query === ''"
|
||||
@click="handleFocus">{{ displayRender }}</div>
|
||||
<Icon type="ios-close-circle" :class="[prefixCls + '-arrow']" v-show="showCloseIcon" @click.native.stop="clearSelect"></Icon>
|
||||
<Icon type="ios-arrow-down" :class="[prefixCls + '-arrow']"></Icon>
|
||||
<Icon :type="arrowType" :custom="customArrowType" :size="arrowSize" :class="[prefixCls + '-arrow']"></Icon>
|
||||
</slot>
|
||||
</div>
|
||||
<transition name="transition-drop">
|
||||
|
|
@ -47,7 +47,7 @@
|
|||
@click="handleSelectItem(index)" v-html="item.display"></li>
|
||||
</ul>
|
||||
</div>
|
||||
<ul v-show="filterable && query !== '' && !querySelections.length" :class="[prefixCls + '-not-found-tip']"><li>{{ localeNotFoundText }}</li></ul>
|
||||
<ul v-show="(filterable && query !== '' && !querySelections.length) || !data.length" :class="[prefixCls + '-not-found-tip']"><li>{{ localeNotFoundText }}</li></ul>
|
||||
</div>
|
||||
</Drop>
|
||||
</transition>
|
||||
|
|
@ -232,6 +232,41 @@
|
|||
return item;
|
||||
});
|
||||
return selections;
|
||||
},
|
||||
// 3.4.0, global setting customArrow 有值时，arrow 赋值空
|
||||
arrowType () {
|
||||
let type = 'ios-arrow-down';
|
||||
|
||||
if (this.$IVIEW) {
|
||||
if (this.$IVIEW.cascader.customArrow) {
|
||||
type = '';
|
||||
} else if (this.$IVIEW.cascader.arrow) {
|
||||
type = this.$IVIEW.cascader.arrow;
|
||||
}
|
||||
}
|
||||
return type;
|
||||
},
|
||||
// 3.4.0, global setting
|
||||
customArrowType () {
|
||||
let type = '';
|
||||
|
||||
if (this.$IVIEW) {
|
||||
if (this.$IVIEW.cascader.customArrow) {
|
||||
type = this.$IVIEW.cascader.customArrow;
|
||||
}
|
||||
}
|
||||
return type;
|
||||
},
|
||||
// 3.4.0, global setting
|
||||
arrowSize () {
|
||||
let size = '';
|
||||
|
||||
if (this.$IVIEW) {
|
||||
if (this.$IVIEW.cascader.arrowSize) {
|
||||
size = this.$IVIEW.cascader.arrowSize;
|
||||
}
|
||||
}
|
||||
return size;
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
|
|
|||
|
|
@ -1,13 +1,16 @@
|
|||
<template>
|
||||
<li :class="classes">
|
||||
{{ data.label }}
|
||||
<i v-if="showArrow" class="ivu-icon ivu-icon-ios-arrow-forward"></i>
|
||||
<Icon :type="arrowType" :custom="customArrowType" :size="arrowSize" v-if="showArrow" />
|
||||
<i v-if="showLoading" class="ivu-icon ivu-icon-ios-loading ivu-load-loop"></i>
|
||||
</li>
|
||||
</template>
|
||||
<script>
|
||||
import Icon from '../icon/icon.vue';
|
||||
|
||||
export default {
|
||||
name: 'Casitem',
|
||||
components: { Icon },
|
||||
props: {
|
||||
data: Object,
|
||||
prefixCls: String,
|
||||
|
|
@ -28,6 +31,41 @@
|
|||
},
|
||||
showLoading () {
|
||||
return 'loading' in this.data && this.data.loading;
|
||||
},
|
||||
// 3.4.0, global setting customArrow 有值时，arrow 赋值空
|
||||
arrowType () {
|
||||
let type = 'ios-arrow-forward';
|
||||
|
||||
if (this.$IVIEW) {
|
||||
if (this.$IVIEW.cascader.customItemArrow) {
|
||||
type = '';
|
||||
} else if (this.$IVIEW.cascader.itemArrow) {
|
||||
type = this.$IVIEW.cascader.itemArrow;
|
||||
}
|
||||
}
|
||||
return type;
|
||||
},
|
||||
// 3.4.0, global setting
|
||||
customArrowType () {
|
||||
let type = '';
|
||||
|
||||
if (this.$IVIEW) {
|
||||
if (this.$IVIEW.cascader.customItemArrow) {
|
||||
type = this.$IVIEW.cascader.customItemArrow;
|
||||
}
|
||||
}
|
||||
return type;
|
||||
},
|
||||
// 3.4.0, global setting
|
||||
arrowSize () {
|
||||
let size = '';
|
||||
|
||||
if (this.$IVIEW) {
|
||||
if (this.$IVIEW.cascader.itemArrowSize) {
|
||||
size = this.$IVIEW.cascader.itemArrowSize;
|
||||
}
|
||||
}
|
||||
return size;
|
||||
}
|
||||
}
|
||||
};
|
||||
|
|
|
|||
|
|
@ -25,7 +25,7 @@
|
|||
</div>
|
||||
<div class="ivu-cell-arrow" v-if="to">
|
||||
<slot name="arrow">
|
||||
<Icon type="ios-arrow-forward"></Icon>
|
||||
<Icon :type="arrowType" :custom="customArrowType" :size="arrowSize" />
|
||||
</slot>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -83,6 +83,41 @@
|
|||
}
|
||||
];
|
||||
},
|
||||
// 3.4.0, global setting customArrow 有值时，arrow 赋值空
|
||||
arrowType () {
|
||||
let type = 'ios-arrow-forward';
|
||||
|
||||
if (this.$IVIEW) {
|
||||
if (this.$IVIEW.cell.customArrow) {
|
||||
type = '';
|
||||
} else if (this.$IVIEW.cell.arrow) {
|
||||
type = this.$IVIEW.cell.arrow;
|
||||
}
|
||||
}
|
||||
return type;
|
||||
},
|
||||
// 3.4.0, global setting
|
||||
customArrowType () {
|
||||
let type = '';
|
||||
|
||||
if (this.$IVIEW) {
|
||||
if (this.$IVIEW.cell.customArrow) {
|
||||
type = this.$IVIEW.cell.customArrow;
|
||||
}
|
||||
}
|
||||
return type;
|
||||
},
|
||||
// 3.4.0, global setting
|
||||
arrowSize () {
|
||||
let size = '';
|
||||
|
||||
if (this.$IVIEW) {
|
||||
if (this.$IVIEW.cell.arrowSize) {
|
||||
size = this.$IVIEW.cell.arrowSize;
|
||||
}
|
||||
}
|
||||
return size;
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleClickItem (event, new_window) {
|
||||
|
|
|
|||
|
|
@ -4,7 +4,7 @@
|
|||
<Icon type="ios-arrow-forward" v-if="!hideArrow"></Icon>
|
||||
<slot></slot>
|
||||
</div>
|
||||
<collapse-transition>
|
||||
<collapse-transition v-if="mounted">
|
||||
<div :class="contentClasses" v-show="isActive">
|
||||
<div :class="boxClasses"><slot name="content"></slot></div>
|
||||
</div>
|
||||
|
|
@ -31,7 +31,8 @@
|
|||
data () {
|
||||
return {
|
||||
index: 0, // use index for default when name is null
|
||||
isActive: false
|
||||
isActive: false,
|
||||
mounted: false
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
|
|
@ -60,6 +61,9 @@
|
|||
isActive: this.isActive
|
||||
});
|
||||
}
|
||||
},
|
||||
mounted () {
|
||||
this.mounted = true;
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -10,7 +10,7 @@
|
|||
:name="name"
|
||||
:value="currentValue"
|
||||
type="hidden">
|
||||
<i :class="arrowClasses"></i>
|
||||
<Icon :type="arrowType" :custom="customArrowType" :size="arrowSize" :class="arrowClasses"></Icon>
|
||||
<div
|
||||
ref="input"
|
||||
:tabindex="disabled ? undefined : 0"
|
||||
|
|
@ -125,6 +125,7 @@ import Hue from './hue.vue';
|
|||
import Alpha from './alpha.vue';
|
||||
import iInput from '../input/input.vue';
|
||||
import iButton from '../button/button.vue';
|
||||
import Icon from '../icon/icon.vue';
|
||||
import Locale from '../../mixins/locale';
|
||||
import {oneOf} from '../../utils/assist';
|
||||
import Emitter from '../../mixins/emitter';
|
||||
|
|
@ -134,7 +135,7 @@ import {changeColor, toRGBAString} from './utils';
|
|||
export default {
|
||||
name: 'ColorPicker',
|
||||
|
||||
components: {Drop, RecommendColors, Saturation, Hue, Alpha, iInput, iButton},
|
||||
components: {Drop, RecommendColors, Saturation, Hue, Alpha, iInput, iButton, Icon},
|
||||
|
||||
directives: {clickOutside, TransferDom},
|
||||
|
||||
|
|
@ -260,8 +261,6 @@ export default {
|
|||
computed: {
|
||||
arrowClasses() {
|
||||
return [
|
||||
this.iconPrefixCls,
|
||||
`${this.iconPrefixCls}-ios-arrow-down`,
|
||||
`${this.inputPrefixCls}-icon`,
|
||||
`${this.inputPrefixCls}-icon-normal`,
|
||||
];
|
||||
|
|
@ -352,6 +351,41 @@ export default {
|
|||
[`${this.prefixCls}-confirm-color-editable`]: this.editable
|
||||
}
|
||||
];
|
||||
},
|
||||
// 3.4.0, global setting customArrow 有值时，arrow 赋值空
|
||||
arrowType () {
|
||||
let type = 'ios-arrow-down';
|
||||
|
||||
if (this.$IVIEW) {
|
||||
if (this.$IVIEW.colorPicker.customArrow) {
|
||||
type = '';
|
||||
} else if (this.$IVIEW.colorPicker.arrow) {
|
||||
type = this.$IVIEW.colorPicker.arrow;
|
||||
}
|
||||
}
|
||||
return type;
|
||||
},
|
||||
// 3.4.0, global setting
|
||||
customArrowType () {
|
||||
let type = '';
|
||||
|
||||
if (this.$IVIEW) {
|
||||
if (this.$IVIEW.colorPicker.customArrow) {
|
||||
type = this.$IVIEW.colorPicker.customArrow;
|
||||
}
|
||||
}
|
||||
return type;
|
||||
},
|
||||
// 3.4.0, global setting
|
||||
arrowSize () {
|
||||
let size = '';
|
||||
|
||||
if (this.$IVIEW) {
|
||||
if (this.$IVIEW.colorPicker.arrowSize) {
|
||||
size = this.$IVIEW.colorPicker.arrowSize;
|
||||
}
|
||||
}
|
||||
return size;
|
||||
}
|
||||
},
|
||||
|
||||
|
|
|
|||
|
|
@ -2,6 +2,7 @@
|
|||
<div
|
||||
:class="wrapperClasses"
|
||||
v-click-outside:mousedown.capture="handleClose"
|
||||
v-click-outside:touchstart.capture="handleClose"
|
||||
v-click-outside.capture="handleClose"
|
||||
>
|
||||
<div ref="reference" :class="[prefixCls + '-rel']">
|
||||
|
|
@ -21,14 +22,13 @@
|
|||
@on-input-change="handleInputChange"
|
||||
@on-focus="handleFocus"
|
||||
@on-blur="handleBlur"
|
||||
@on-click="handleIconClick"
|
||||
@click.native="handleFocus"
|
||||
@keydown.native="handleKeydown"
|
||||
@mouseenter.native="handleInputMouseenter"
|
||||
@mouseleave.native="handleInputMouseleave"
|
||||
|
||||
:icon="iconType"
|
||||
></i-input>
|
||||
>
|
||||
<Icon @click="handleIconClick" :type="arrowType" :custom="customArrowType" :size="arrowSize" slot="suffix" />
|
||||
</i-input>
|
||||
</slot>
|
||||
</div>
|
||||
<transition name="transition-drop">
|
||||
|
|
@ -79,6 +79,7 @@
|
|||
|
||||
import iInput from '../../components/input/input.vue';
|
||||
import Drop from '../../components/select/dropdown.vue';
|
||||
import Icon from '../../components/icon/icon.vue';
|
||||
import {directive as clickOutside} from 'v-click-outside-x';
|
||||
import TransferDom from '../../directives/transfer-dom';
|
||||
import { oneOf } from '../../utils/assist';
|
||||
|
|
@ -120,7 +121,7 @@
|
|||
|
||||
export default {
|
||||
mixins: [ Emitter ],
|
||||
components: { iInput, Drop },
|
||||
components: { iInput, Drop, Icon },
|
||||
directives: { clickOutside, TransferDom },
|
||||
props: {
|
||||
format: {
|
||||
|
|
@ -267,12 +268,6 @@
|
|||
opened () {
|
||||
return this.open === null ? this.visible : this.open;
|
||||
},
|
||||
iconType () {
|
||||
let icon = 'ios-calendar-outline';
|
||||
if (this.type === 'time' || this.type === 'timerange') icon = 'ios-time-outline';
|
||||
if (this.showClose) icon = 'ios-close-circle';
|
||||
return icon;
|
||||
},
|
||||
transition () {
|
||||
const bottomPlaced = this.placement.match(/^bottom/);
|
||||
return bottomPlaced ? 'slide-up' : 'slide-down';
|
||||
|
|
@ -282,6 +277,80 @@
|
|||
},
|
||||
isConfirm(){
|
||||
return this.confirm || this.type === 'datetime' || this.type === 'datetimerange' || this.multiple;
|
||||
},
|
||||
// 3.4.0, global setting customArrow 有值时，arrow 赋值空
|
||||
arrowType () {
|
||||
let type = '';
|
||||
|
||||
if (this.type === 'time' || this.type === 'timerange') {
|
||||
type = 'ios-time-outline';
|
||||
|
||||
if (this.$IVIEW) {
|
||||
if (this.$IVIEW.timePicker.customIcon) {
|
||||
type = '';
|
||||
} else if (this.$IVIEW.timePicker.icon) {
|
||||
type = this.$IVIEW.timePicker.icon;
|
||||
}
|
||||
}
|
||||
} else {
|
||||
type = 'ios-calendar-outline';
|
||||
|
||||
if (this.$IVIEW) {
|
||||
if (this.$IVIEW.datePicker.customIcon) {
|
||||
type = '';
|
||||
} else if (this.$IVIEW.datePicker.icon) {
|
||||
type = this.$IVIEW.datePicker.icon;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (this.showClose) type = 'ios-close-circle';
|
||||
|
||||
return type;
|
||||
},
|
||||
// 3.4.0, global setting
|
||||
customArrowType () {
|
||||
let type = '';
|
||||
|
||||
if (!this.showClose) {
|
||||
if (this.type === 'time' || this.type === 'timerange') {
|
||||
if (this.$IVIEW) {
|
||||
if (this.$IVIEW.timePicker.customIcon) {
|
||||
type = this.$IVIEW.timePicker.customIcon;
|
||||
}
|
||||
}
|
||||
} else {
|
||||
if (this.$IVIEW) {
|
||||
if (this.$IVIEW.datePicker.customIcon) {
|
||||
type = this.$IVIEW.datePicker.customIcon;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return type;
|
||||
},
|
||||
// 3.4.0, global setting
|
||||
arrowSize () {
|
||||
let size = '';
|
||||
|
||||
if (!this.showClose) {
|
||||
if (this.type === 'time' || this.type === 'timerange') {
|
||||
if (this.$IVIEW) {
|
||||
if (this.$IVIEW.timePicker.iconSize) {
|
||||
size = this.$IVIEW.timePicker.iconSize;
|
||||
}
|
||||
}
|
||||
} else {
|
||||
if (this.$IVIEW) {
|
||||
if (this.$IVIEW.datePicker.iconSize) {
|
||||
size = this.$IVIEW.datePicker.iconSize;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
return size;
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
|
@ -313,6 +382,7 @@
|
|||
this.visible = false;
|
||||
e && e.preventDefault();
|
||||
e && e.stopPropagation();
|
||||
this.$emit('on-clickoutside', e);
|
||||
return;
|
||||
}
|
||||
|
||||
|
|
|
|||
|
|
@ -303,6 +303,9 @@
|
|||
if (this.$slots.header === undefined) {
|
||||
this.showHead = !!val;
|
||||
}
|
||||
},
|
||||
width (val) {
|
||||
this.dragWidth = val;
|
||||
}
|
||||
}
|
||||
};
|
||||
|
|
|
|||
|
|
@ -57,6 +57,10 @@
|
|||
transferClassName: {
|
||||
type: String
|
||||
},
|
||||
stopPropagation: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
transition () {
|
||||
|
|
@ -164,6 +168,7 @@
|
|||
},
|
||||
mounted () {
|
||||
this.$on('on-click', (key) => {
|
||||
if (this.stopPropagation) return;
|
||||
const $parent = this.hasParent();
|
||||
if ($parent) $parent.$emit('on-click', key);
|
||||
});
|
||||
|
|
|
|||
|
|
@ -292,6 +292,7 @@
|
|||
}
|
||||
},
|
||||
change (event) {
|
||||
if (event.type == 'change') return;
|
||||
|
||||
if (event.type == 'input' && !this.activeChange) return;
|
||||
let val = event.target.value.trim();
|
||||
|
|
|
|||
|
|
@ -312,6 +312,7 @@
|
|||
this.$emit('input', '');
|
||||
this.setCurrentValue('');
|
||||
this.$emit('on-change', e);
|
||||
this.$emit('on-clear');
|
||||
},
|
||||
handleSearch () {
|
||||
if (this.disabled) return false;
|
||||
|
|
|
|||
|
|
@ -2,6 +2,7 @@ import LoadingBar from './loading-bar';
|
|||
|
||||
let loadingBarInstance;
|
||||
let color = 'primary';
|
||||
let duration = 800;
|
||||
let failedColor = 'error';
|
||||
let height = 2;
|
||||
let timer;
|
||||
|
|
@ -32,7 +33,7 @@ function hide() {
|
|||
percent: 0
|
||||
});
|
||||
}, 200);
|
||||
}, 800);
|
||||
}, duration);
|
||||
}
|
||||
|
||||
function clearTimer() {
|
||||
|
|
@ -96,6 +97,9 @@ export default {
|
|||
if (options.color) {
|
||||
color = options.color;
|
||||
}
|
||||
if (options.duration) {
|
||||
duration = options.duration;
|
||||
}
|
||||
if (options.failedColor) {
|
||||
failedColor = options.failedColor;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -133,9 +133,9 @@
|
|||
}
|
||||
},
|
||||
mounted () {
|
||||
this.updateActiveName();
|
||||
this.openedNames = [...this.openNames];
|
||||
this.updateOpened();
|
||||
this.$nextTick(() => this.updateActiveName());
|
||||
this.$on('on-menu-item-select', (name) => {
|
||||
this.currentActiveName = name;
|
||||
this.$emit('on-select', name);
|
||||
|
|
|
|||
|
|
@ -2,7 +2,7 @@
|
|||
<li :class="classes" @mouseenter="handleMouseenter" @mouseleave="handleMouseleave">
|
||||
<div :class="[prefixCls + '-submenu-title']" ref="reference" @click.stop="handleClick" :style="titleStyle">
|
||||
<slot name="title"></slot>
|
||||
<Icon type="ios-arrow-down" :class="[prefixCls + '-submenu-title-icon']"></Icon>
|
||||
<Icon :type="arrowType" :custom="customArrowType" :size="arrowSize" :class="[prefixCls + '-submenu-title-icon']" />
|
||||
</div>
|
||||
<collapse-transition v-if="mode === 'vertical'">
|
||||
<ul :class="[prefixCls]" v-show="opened"><slot></slot></ul>
|
||||
|
|
@ -75,6 +75,41 @@
|
|||
return this.hasParentSubmenu && this.mode !== 'horizontal' ? {
|
||||
paddingLeft: 43 + (this.parentSubmenuNum - 1) * 24 + 'px'
|
||||
} : {};
|
||||
},
|
||||
// 3.4.0, global setting customArrow 有值时，arrow 赋值空
|
||||
arrowType () {
|
||||
let type = 'ios-arrow-down';
|
||||
|
||||
if (this.$IVIEW) {
|
||||
if (this.$IVIEW.menu.customArrow) {
|
||||
type = '';
|
||||
} else if (this.$IVIEW.menu.arrow) {
|
||||
type = this.$IVIEW.menu.arrow;
|
||||
}
|
||||
}
|
||||
return type;
|
||||
},
|
||||
// 3.4.0, global setting
|
||||
customArrowType () {
|
||||
let type = '';
|
||||
|
||||
if (this.$IVIEW) {
|
||||
if (this.$IVIEW.menu.customArrow) {
|
||||
type = this.$IVIEW.menu.customArrow;
|
||||
}
|
||||
}
|
||||
return type;
|
||||
},
|
||||
// 3.4.0, global setting
|
||||
arrowSize () {
|
||||
let size = '';
|
||||
|
||||
if (this.$IVIEW) {
|
||||
if (this.$IVIEW.menu.arrowSize) {
|
||||
size = this.$IVIEW.menu.arrowSize;
|
||||
}
|
||||
}
|
||||
return size;
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
|
|
|||
|
|
@ -109,7 +109,8 @@ Modal.newInstance = properties => {
|
|||
on: {
|
||||
input: (status) => {
|
||||
this.visible = status;
|
||||
}
|
||||
},
|
||||
'on-cancel': this.cancel
|
||||
}
|
||||
}, [
|
||||
h('div', {
|
||||
|
|
|
|||
|
|
@ -60,7 +60,9 @@
|
|||
},
|
||||
maskClosable: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
default () {
|
||||
return !this.$IVIEW || this.$IVIEW.modal.maskClosable === '' ? true : this.$IVIEW.modal.maskClosable;
|
||||
}
|
||||
},
|
||||
title: {
|
||||
type: String
|
||||
|
|
|
|||
|
|
@ -111,6 +111,11 @@
|
|||
// default by css: 8px 16px
|
||||
padding: {
|
||||
type: String
|
||||
},
|
||||
// 3.4.0
|
||||
disabled: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
data () {
|
||||
|
|
@ -181,6 +186,8 @@
|
|||
},
|
||||
methods: {
|
||||
handleClick () {
|
||||
if (this.disabled) return;
|
||||
|
||||
if (this.confirm) {
|
||||
this.visible = !this.visible;
|
||||
return true;
|
||||
|
|
@ -208,6 +215,8 @@
|
|||
this.visible = false;
|
||||
},
|
||||
handleFocus (fromInput = true) {
|
||||
if (this.disabled) return;
|
||||
|
||||
if (this.trigger !== 'focus' || this.confirm || (this.isInput && !fromInput)) {
|
||||
return false;
|
||||
}
|
||||
|
|
@ -220,6 +229,8 @@
|
|||
this.visible = false;
|
||||
},
|
||||
handleMouseenter () {
|
||||
if (this.disabled) return;
|
||||
|
||||
if (this.trigger !== 'hover' || this.confirm) {
|
||||
return false;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -1,8 +1,21 @@
|
|||
<template>
|
||||
<div @click="onHeaderClick">
|
||||
<div class="ivu-tag ivu-tag-checked" v-for="item in selectedMultiple">
|
||||
<div @click="onHeaderClick" :class="headCls">
|
||||
<span :class="[prefixCls + '-prefix']" v-if="$slots.prefix || prefix">
|
||||
<slot name="prefix">
|
||||
<Icon :type="prefix" v-if="prefix" />
|
||||
</slot>
|
||||
</span>
|
||||
<div
|
||||
class="ivu-tag ivu-tag-checked"
|
||||
v-for="(item, index) in selectedMultiple"
|
||||
v-if="maxTagCount === undefined || index < maxTagCount">
|
||||
<span class="ivu-tag-text">{{ item.label }}</span>
|
||||
<Icon type="ios-close" @click.native.stop="removeTag(item)"></Icon>
|
||||
</div><div class="ivu-tag ivu-tag-checked" v-if="maxTagCount !== undefined && selectedMultiple.length > maxTagCount">
|
||||
<span class="ivu-tag-text ivu-select-max-tag">
|
||||
<template v-if="maxTagPlaceholder">{{ maxTagPlaceholder(selectedMultiple.length - maxTagCount) }}</template>
|
||||
<template v-else>+ {{ selectedMultiple.length - maxTagCount }}...</template>
|
||||
</span>
|
||||
</div>
|
||||
<span
|
||||
:class="singleDisplayClasses"
|
||||
|
|
@ -26,7 +39,7 @@
|
|||
|
||||
ref="input">
|
||||
<Icon type="ios-close-circle" :class="[prefixCls + '-arrow']" v-if="resetSelect" @click.native.stop="onClear"></Icon>
|
||||
<Icon type="ios-arrow-down" :class="[prefixCls + '-arrow']" v-if="!resetSelect && !remote && !disabled"></Icon>
|
||||
<Icon :type="arrowType" :custom="customArrowType" :size="arrowSize" :class="[prefixCls + '-arrow']" v-if="!resetSelect && !remote"></Icon>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
|
|
@ -77,6 +90,17 @@
|
|||
queryProp: {
|
||||
type: String,
|
||||
default: ''
|
||||
},
|
||||
prefix: {
|
||||
type: String
|
||||
},
|
||||
// 3.4.0
|
||||
maxTagCount: {
|
||||
type: Number
|
||||
},
|
||||
// 3.4.0
|
||||
maxTagPlaceholder: {
|
||||
type: Function
|
||||
}
|
||||
},
|
||||
data () {
|
||||
|
|
@ -92,6 +116,7 @@
|
|||
singleDisplayClasses(){
|
||||
const {filterable, multiple, showPlaceholder} = this;
|
||||
return [{
|
||||
[prefixCls + '-head-with-prefix']: this.$slots.prefix || this.prefix,
|
||||
[prefixCls + '-placeholder']: showPlaceholder && !filterable,
|
||||
[prefixCls + '-selected-value']: !showPlaceholder && !multiple && !filterable,
|
||||
}];
|
||||
|
|
@ -143,6 +168,47 @@
|
|||
},
|
||||
selectedMultiple(){
|
||||
return this.multiple ? this.values : [];
|
||||
},
|
||||
// 使用 prefix 时，在 filterable
|
||||
headCls () {
|
||||
return {
|
||||
[`${prefixCls}-head-flex`]: this.filterable && (this.$slots.prefix || this.prefix)
|
||||
};
|
||||
},
|
||||
// 3.4.0, global setting customArrow 有值时，arrow 赋值空
|
||||
arrowType () {
|
||||
let type = 'ios-arrow-down';
|
||||
|
||||
if (this.$IVIEW) {
|
||||
if (this.$IVIEW.select.customArrow) {
|
||||
type = '';
|
||||
} else if (this.$IVIEW.select.arrow) {
|
||||
type = this.$IVIEW.select.arrow;
|
||||
}
|
||||
}
|
||||
return type;
|
||||
},
|
||||
// 3.4.0, global setting
|
||||
customArrowType () {
|
||||
let type = '';
|
||||
|
||||
if (this.$IVIEW) {
|
||||
if (this.$IVIEW.select.customArrow) {
|
||||
type = this.$IVIEW.select.customArrow;
|
||||
}
|
||||
}
|
||||
return type;
|
||||
},
|
||||
// 3.4.0, global setting
|
||||
arrowSize () {
|
||||
let size = '';
|
||||
|
||||
if (this.$IVIEW) {
|
||||
if (this.$IVIEW.select.arrowSize) {
|
||||
size = this.$IVIEW.select.arrowSize;
|
||||
}
|
||||
}
|
||||
return size;
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
|
|
|||
|
|
@ -3,6 +3,7 @@
|
|||
:class="classes"
|
||||
v-click-outside.capture="onClickOutside"
|
||||
v-click-outside:mousedown.capture="onClickOutside"
|
||||
v-click-outside:touchstart.capture="onClickOutside"
|
||||
>
|
||||
<div
|
||||
ref="reference"
|
||||
|
|
@ -33,18 +34,23 @@
|
|||
:multiple="multiple"
|
||||
:values="values"
|
||||
:clearable="canBeCleared"
|
||||
:prefix="prefix"
|
||||
:disabled="disabled"
|
||||
:remote="remote"
|
||||
:input-element-id="elementId"
|
||||
:initial-label="initialLabel"
|
||||
:placeholder="placeholder"
|
||||
:query-prop="query"
|
||||
:max-tag-count="maxTagCount"
|
||||
:max-tag-placeholder="maxTagPlaceholder"
|
||||
|
||||
@on-query-change="onQueryChange"
|
||||
@on-input-focus="isFocused = true"
|
||||
@on-input-blur="isFocused = false"
|
||||
@on-clear="clearSingleSelect"
|
||||
/>
|
||||
>
|
||||
<slot name="prefix" slot="prefix"></slot>
|
||||
</select-head>
|
||||
</slot>
|
||||
</div>
|
||||
<transition name="transition-drop">
|
||||
|
|
@ -235,6 +241,18 @@
|
|||
transferClassName: {
|
||||
type: String
|
||||
},
|
||||
// 3.4.0
|
||||
prefix: {
|
||||
type: String
|
||||
},
|
||||
// 3.4.0
|
||||
maxTagCount: {
|
||||
type: Number
|
||||
},
|
||||
// 3.4.0
|
||||
maxTagPlaceholder: {
|
||||
type: Function
|
||||
}
|
||||
},
|
||||
mounted(){
|
||||
this.$on('on-select-selected', this.onOptionClick);
|
||||
|
|
|
|||
|
|
@ -8,6 +8,7 @@
|
|||
:step="step"
|
||||
:value="exportValue[0]"
|
||||
:disabled="disabled"
|
||||
:active-change="activeChange"
|
||||
@on-change="handleInputChange"></Input-number>
|
||||
<div
|
||||
:class="[prefixCls + '-wrap']"
|
||||
|
|
@ -148,6 +149,11 @@
|
|||
},
|
||||
name: {
|
||||
type: String
|
||||
},
|
||||
// 3.4.0
|
||||
activeChange: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
}
|
||||
},
|
||||
data () {
|
||||
|
|
|
|||
|
|
@ -8,7 +8,7 @@
|
|||
<table-tr
|
||||
:draggable="draggable"
|
||||
:row="row"
|
||||
:key="row._rowKey"
|
||||
:key="rowKey ? row._rowKey : index"
|
||||
:prefix-cls="prefixCls"
|
||||
@mouseenter.native.stop="handleMouseIn(row._index)"
|
||||
@mouseleave.native.stop="handleMouseOut(row._index)"
|
||||
|
|
@ -31,7 +31,7 @@
|
|||
</table-tr>
|
||||
<tr v-if="rowExpanded(row._index)" :class="{[prefixCls + '-expanded-hidden']: fixed}">
|
||||
<td :colspan="columns.length" :class="prefixCls + '-expanded-cell'">
|
||||
<Expand :key="row._rowKey" :row="row" :render="expandRender" :index="row._index"></Expand>
|
||||
<Expand :key="rowKey ? row._rowKey : index" :row="row" :render="expandRender" :index="row._index"></Expand>
|
||||
</td>
|
||||
</tr>
|
||||
</template>
|
||||
|
|
@ -63,6 +63,10 @@
|
|||
draggable: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
rowKey: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
|
|
|
|||
|
|
@ -171,7 +171,8 @@
|
|||
this.$parent.selectAll(status);
|
||||
},
|
||||
handleSort (index, type) {
|
||||
const column = this.columns[index];
|
||||
// 在固定列时，寻找正确的 index #5580
|
||||
const column = this.columns.find(item => item._index === index);
|
||||
const _index = column._index;
|
||||
|
||||
if (column._sortType === type) {
|
||||
|
|
@ -180,7 +181,8 @@
|
|||
this.$parent.handleSort(_index, type);
|
||||
},
|
||||
handleSortByHead (index) {
|
||||
const column = this.columns[index];
|
||||
// 在固定列时，寻找正确的 index #5580
|
||||
const column = this.columns.find(item => item._index === index);
|
||||
if (column.sortable) {
|
||||
const type = column._sortType;
|
||||
if (type === 'normal') {
|
||||
|
|
|
|||
|
|
@ -21,6 +21,7 @@
|
|||
:styleObject="tableStyle"
|
||||
:columns="cloneColumns"
|
||||
:data="rebuildData"
|
||||
:row-key="rowKey"
|
||||
:columns-width="columnsWidth"
|
||||
:obj-data="objData"></table-body>
|
||||
</div>
|
||||
|
|
@ -59,6 +60,7 @@
|
|||
:styleObject="fixedTableStyle"
|
||||
:columns="leftFixedColumns"
|
||||
:data="rebuildData"
|
||||
:row-key="rowKey"
|
||||
:columns-width="columnsWidth"
|
||||
:obj-data="objData"></table-body>
|
||||
</div>
|
||||
|
|
@ -84,6 +86,7 @@
|
|||
:styleObject="fixedRightTableStyle"
|
||||
:columns="rightFixedColumns"
|
||||
:data="rebuildData"
|
||||
:row-key="rowKey"
|
||||
:columns-width="columnsWidth"
|
||||
:obj-data="objData"></table-body>
|
||||
</div>
|
||||
|
|
@ -149,6 +152,10 @@
|
|||
height: {
|
||||
type: [Number, String]
|
||||
},
|
||||
// 3.4.0
|
||||
maxHeight: {
|
||||
type: [Number, String]
|
||||
},
|
||||
stripe: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
|
|
@ -196,6 +203,11 @@
|
|||
return oneOf(value, ['dark', 'light']);
|
||||
},
|
||||
default: 'dark'
|
||||
},
|
||||
// #5380 开启后，:key 强制更新，否则使用 index
|
||||
rowKey: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
data () {
|
||||
|
|
@ -275,6 +287,10 @@
|
|||
const height = parseInt(this.height);
|
||||
style.height = `${height}px`;
|
||||
}
|
||||
if (this.maxHeight) {
|
||||
const maxHeight = parseInt(this.maxHeight);
|
||||
style.maxHeight = `${maxHeight}px`;
|
||||
}
|
||||
if (this.width) style.width = `${this.width}px`;
|
||||
return style;
|
||||
},
|
||||
|
|
@ -336,7 +352,11 @@
|
|||
let style = {};
|
||||
if (this.bodyHeight !== 0) {
|
||||
const height = this.bodyHeight;
|
||||
if (this.height) {
|
||||
style.height = `${height}px`;
|
||||
} else if (this.maxHeight) {
|
||||
style.maxHeight = `${height}px`;
|
||||
}
|
||||
}
|
||||
return style;
|
||||
},
|
||||
|
|
@ -548,7 +568,7 @@
|
|||
this.objData[_index]._isExpanded = status;
|
||||
this.$emit('on-expand', JSON.parse(JSON.stringify(this.cloneData[_index])), status);
|
||||
|
||||
if(this.height){
|
||||
if(this.height || this.maxHeight){
|
||||
this.$nextTick(()=>this.fixedBody());
|
||||
}
|
||||
},
|
||||
|
|
@ -578,12 +598,16 @@
|
|||
},
|
||||
|
||||
fixedHeader () {
|
||||
if (this.height) {
|
||||
if (this.height || this.maxHeight) {
|
||||
this.$nextTick(() => {
|
||||
const titleHeight = parseInt(getStyle(this.$refs.title, 'height')) || 0;
|
||||
const headerHeight = parseInt(getStyle(this.$refs.header, 'height')) || 0;
|
||||
const footerHeight = parseInt(getStyle(this.$refs.footer, 'height')) || 0;
|
||||
if (this.height) {
|
||||
this.bodyHeight = this.height - titleHeight - headerHeight - footerHeight;
|
||||
} else if (this.maxHeight) {
|
||||
this.bodyHeight = this.maxHeight - titleHeight - headerHeight - footerHeight;
|
||||
}
|
||||
this.$nextTick(()=>this.fixedBody());
|
||||
});
|
||||
} else {
|
||||
|
|
@ -986,6 +1010,9 @@
|
|||
height () {
|
||||
this.handleResize();
|
||||
},
|
||||
maxHeight () {
|
||||
this.handleResize();
|
||||
},
|
||||
showHorizontalScrollBar () {
|
||||
this.handleResize();
|
||||
},
|
||||
|
|
|
|||
|
|
@ -13,13 +13,13 @@
|
|||
<span :class="[prefixCls + '-nav-prev', scrollable ? '' : prefixCls + '-nav-scroll-disabled']" @click="scrollPrev"><Icon type="ios-arrow-back"></Icon></span>
|
||||
<span :class="[prefixCls + '-nav-next', scrollable ? '' : prefixCls + '-nav-scroll-disabled']" @click="scrollNext"><Icon type="ios-arrow-forward"></Icon></span>
|
||||
<div ref="navScroll" :class="[prefixCls + '-nav-scroll']">
|
||||
<div ref="nav" :class="[prefixCls + '-nav']" class="nav-text" :style="navStyle">
|
||||
<div ref="nav" :class="[prefixCls + '-nav']" :style="navStyle">
|
||||
<div :class="barClasses" :style="barStyle"></div>
|
||||
<div :class="tabCls(item)" v-for="(item, index) in navList" @click="handleChange(index)">
|
||||
<Icon v-if="item.icon !== ''" :type="item.icon"></Icon>
|
||||
<Render v-if="item.labelType === 'function'" :render="item.label"></Render>
|
||||
<template v-else>{{ item.label }}</template>
|
||||
<Icon v-if="showClose(item)" type="ios-close" @click.native.stop="handleRemove(index)"></Icon>
|
||||
<Icon :class="[prefixCls + '-close']" v-if="showClose(item)" :type="arrowType" :custom="customArrowType" :size="arrowSize" @click.native.stop="handleRemove(index)"></Icon>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
@ -169,6 +169,41 @@
|
|||
}
|
||||
|
||||
return style;
|
||||
},
|
||||
// 3.4.0, global setting customArrow 有值时，arrow 赋值空
|
||||
arrowType () {
|
||||
let type = 'ios-close';
|
||||
|
||||
if (this.$IVIEW) {
|
||||
if (this.$IVIEW.tabs.customCloseIcon) {
|
||||
type = '';
|
||||
} else if (this.$IVIEW.tabs.closeIcon) {
|
||||
type = this.$IVIEW.tabs.closeIcon;
|
||||
}
|
||||
}
|
||||
return type;
|
||||
},
|
||||
// 3.4.0, global setting
|
||||
customArrowType () {
|
||||
let type = '';
|
||||
|
||||
if (this.$IVIEW) {
|
||||
if (this.$IVIEW.tabs.customCloseIcon) {
|
||||
type = this.$IVIEW.tabs.customCloseIcon;
|
||||
}
|
||||
}
|
||||
return type;
|
||||
},
|
||||
// 3.4.0, global setting
|
||||
arrowSize () {
|
||||
let size = '';
|
||||
|
||||
if (this.$IVIEW) {
|
||||
if (this.$IVIEW.tabs.closeIconSize) {
|
||||
size = this.$IVIEW.tabs.closeIconSize;
|
||||
}
|
||||
}
|
||||
return size;
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
|
|
|||
|
|
@ -1,10 +1,10 @@
|
|||
<template>
|
||||
<collapse-transition>
|
||||
<collapse-transition :appear="appear">
|
||||
<ul :class="classes">
|
||||
<li>
|
||||
<span :class="arrowClasses" @click="handleExpand">
|
||||
<Icon v-if="showArrow" type="ios-arrow-forward"></Icon>
|
||||
<Icon v-if="showLoading" type="ios-loading" class="ivu-load-loop"></Icon>
|
||||
<Icon v-if="showArrow" :type="arrowType" :custom="customArrowType" :size="arrowSize" />
|
||||
<Icon v-if="showLoading" type="ios-loading" class="ivu-load-loop" />
|
||||
</span>
|
||||
<Checkbox
|
||||
v-if="showCheckbox"
|
||||
|
|
@ -17,6 +17,7 @@
|
|||
<span v-else :class="titleClasses" @click="handleSelect">{{ data.title }}</span>
|
||||
<Tree-node
|
||||
v-if="data.expand"
|
||||
:appear="appearByClickArrow"
|
||||
v-for="(item, i) in children"
|
||||
:key="i"
|
||||
:data="item"
|
||||
|
|
@ -61,11 +62,16 @@
|
|||
showCheckbox: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
},
|
||||
appear: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
data () {
|
||||
return {
|
||||
prefixCls: prefixCls
|
||||
prefixCls: prefixCls,
|
||||
appearByClickArrow: false
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
|
|
@ -127,6 +133,41 @@
|
|||
},
|
||||
children () {
|
||||
return this.data[this.childrenKey];
|
||||
},
|
||||
// 3.4.0, global setting customArrow 有值时，arrow 赋值空
|
||||
arrowType () {
|
||||
let type = 'ios-arrow-forward';
|
||||
|
||||
if (this.$IVIEW) {
|
||||
if (this.$IVIEW.tree.customArrow) {
|
||||
type = '';
|
||||
} else if (this.$IVIEW.tree.arrow) {
|
||||
type = this.$IVIEW.tree.arrow;
|
||||
}
|
||||
}
|
||||
return type;
|
||||
},
|
||||
// 3.4.0, global setting
|
||||
customArrowType () {
|
||||
let type = '';
|
||||
|
||||
if (this.$IVIEW) {
|
||||
if (this.$IVIEW.tree.customArrow) {
|
||||
type = this.$IVIEW.tree.customArrow;
|
||||
}
|
||||
}
|
||||
return type;
|
||||
},
|
||||
// 3.4.0, global setting
|
||||
arrowSize () {
|
||||
let size = '';
|
||||
|
||||
if (this.$IVIEW) {
|
||||
if (this.$IVIEW.tree.arrowSize) {
|
||||
size = this.$IVIEW.tree.arrowSize;
|
||||
}
|
||||
}
|
||||
return size;
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
|
@ -134,6 +175,9 @@
|
|||
const item = this.data;
|
||||
if (item.disabled) return;
|
||||
|
||||
// Vue.js 2.6.9 对 transition 的 appear 进行了调整，导致 iView 初始化时无动画，加此方法来判断通过点击箭头展开时，加 appear，否则初始渲染时 appear 为 false
|
||||
this.appearByClickArrow = true;
|
||||
|
||||
// async loading
|
||||
if (item[this.childrenKey].length === 0) {
|
||||
const tree = findComponentUpward(this, 'Tree');
|
||||
|
|
|
|||
53
src/index.js
53
src/index.js
|
|
@ -168,7 +168,58 @@ const install = function(Vue, opts = {}) {
|
|||
|
||||
Vue.prototype.$IVIEW = {
|
||||
size: opts.size || '',
|
||||
transfer: 'transfer' in opts ? opts.transfer : ''
|
||||
transfer: 'transfer' in opts ? opts.transfer : '',
|
||||
select: {
|
||||
arrow: opts.select ? opts.select.arrow ? opts.select.arrow : '' : '',
|
||||
customArrow: opts.select ? opts.select.customArrow ? opts.select.customArrow : '' : '',
|
||||
arrowSize: opts.select ? opts.select.arrowSize ? opts.select.arrowSize : '' : ''
|
||||
},
|
||||
cell: {
|
||||
arrow: opts.cell ? opts.cell.arrow ? opts.cell.arrow : '' : '',
|
||||
customArrow: opts.cell ? opts.cell.customArrow ? opts.cell.customArrow : '' : '',
|
||||
arrowSize: opts.cell ? opts.cell.arrowSize ? opts.cell.arrowSize : '' : ''
|
||||
},
|
||||
menu: {
|
||||
arrow: opts.menu ? opts.menu.arrow ? opts.menu.arrow : '' : '',
|
||||
customArrow: opts.menu ? opts.menu.customArrow ? opts.menu.customArrow : '' : '',
|
||||
arrowSize: opts.menu ? opts.menu.arrowSize ? opts.menu.arrowSize : '' : ''
|
||||
},
|
||||
tree: {
|
||||
arrow: opts.tree ? opts.tree.arrow ? opts.tree.arrow : '' : '',
|
||||
customArrow: opts.tree ? opts.tree.customArrow ? opts.tree.customArrow : '' : '',
|
||||
arrowSize: opts.tree ? opts.tree.arrowSize ? opts.tree.arrowSize : '' : ''
|
||||
},
|
||||
cascader: {
|
||||
arrow: opts.cascader ? opts.cascader.arrow ? opts.cascader.arrow : '' : '',
|
||||
customArrow: opts.cascader ? opts.cascader.customArrow ? opts.cascader.customArrow : '' : '',
|
||||
arrowSize: opts.cascader ? opts.cascader.arrowSize ? opts.cascader.arrowSize : '' : '',
|
||||
itemArrow: opts.cascader ? opts.cascader.itemArrow ? opts.cascader.itemArrow : '' : '',
|
||||
customItemArrow: opts.cascader ? opts.cascader.customItemArrow ? opts.cascader.customItemArrow : '' : '',
|
||||
itemArrowSize: opts.cascader ? opts.cascader.itemArrowSize ? opts.cascader.itemArrowSize : '' : ''
|
||||
},
|
||||
colorPicker: {
|
||||
arrow: opts.colorPicker ? opts.colorPicker.arrow ? opts.colorPicker.arrow : '' : '',
|
||||
customArrow: opts.colorPicker ? opts.colorPicker.customArrow ? opts.colorPicker.customArrow : '' : '',
|
||||
arrowSize: opts.colorPicker ? opts.colorPicker.arrowSize ? opts.colorPicker.arrowSize : '' : ''
|
||||
},
|
||||
datePicker: {
|
||||
icon: opts.datePicker ? opts.datePicker.icon ? opts.datePicker.icon : '' : '',
|
||||
customIcon: opts.datePicker ? opts.datePicker.customIcon ? opts.datePicker.customIcon : '' : '',
|
||||
iconSize: opts.datePicker ? opts.datePicker.iconSize ? opts.datePicker.iconSize : '' : ''
|
||||
},
|
||||
timePicker: {
|
||||
icon: opts.timePicker ? opts.timePicker.icon ? opts.timePicker.icon : '' : '',
|
||||
customIcon: opts.timePicker ? opts.timePicker.customIcon ? opts.timePicker.customIcon : '' : '',
|
||||
iconSize: opts.timePicker ? opts.timePicker.iconSize ? opts.timePicker.iconSize : '' : ''
|
||||
},
|
||||
tabs: {
|
||||
closeIcon: opts.tabs ? opts.tabs.closeIcon ? opts.tabs.closeIcon : '' : '',
|
||||
customCloseIcon: opts.tabs ? opts.tabs.customCloseIcon ? opts.tabs.customCloseIcon : '' : '',
|
||||
closeIconSize: opts.tabs ? opts.tabs.closeIconSize ? opts.tabs.closeIconSize : '' : ''
|
||||
},
|
||||
modal: {
|
||||
maskClosable: opts.modal ? 'maskClosable' in opts.modal ? opts.modal.maskClosable : '' : ''
|
||||
}
|
||||
};
|
||||
|
||||
Vue.prototype.$Loading = LoadingBar;
|
||||
|
|
|
|||
|
|
@ -15,21 +15,46 @@ export default {
|
|||
return oneOf(value, ['_blank', '_self', '_parent', '_top']);
|
||||
},
|
||||
default: '_self'
|
||||
}
|
||||
},
|
||||
append: {
|
||||
type: Boolean,
|
||||
required: false,
|
||||
default: false,
|
||||
},
|
||||
},
|
||||
computed: {
|
||||
linkUrl () {
|
||||
const type = typeof this.to;
|
||||
return type === 'string' ? this.to : null;
|
||||
if (type !== 'string') {
|
||||
return null;
|
||||
}
|
||||
if (this.to.includes('//')) {
|
||||
/* Absolute URL, we do not need to route this */
|
||||
return this.to;
|
||||
}
|
||||
const router = this.$router;
|
||||
if (router) {
|
||||
const current = this.$route;
|
||||
const route = router.resolve(this.to, current, this.append);
|
||||
return route ? route.href : this.to;
|
||||
}
|
||||
return this.to;
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleClick (new_window = false) {
|
||||
const router = this.$router;
|
||||
|
||||
if (new_window) {
|
||||
window.open(this.to);
|
||||
let to = this.to;
|
||||
if (router) {
|
||||
const current = this.$route;
|
||||
const route = router.resolve(this.to, current, this.append);
|
||||
to = route ? route.href : this.to;
|
||||
}
|
||||
window.open(to);
|
||||
} else {
|
||||
const isRoute = this.$router;
|
||||
if (isRoute) {
|
||||
if (router) {
|
||||
this.replace ? this.$router.replace(this.to) : this.$router.push(this.to);
|
||||
} else {
|
||||
window.location.href = this.to;
|
||||
|
|
|
|||
|
|
@ -3,9 +3,9 @@
|
|||
|
||||
@font-face {
|
||||
font-family: @ionicons-font-family;
|
||||
src:
|
||||
url("@{ionicons-font-path}/ionicons.ttf?v=@{ionicons-version}") format("truetype"),
|
||||
src: url("@{ionicons-font-path}/ionicons.woff2?v=@{ionicons-version}") format("woff2"),
|
||||
url("@{ionicons-font-path}/ionicons.woff?v=@{ionicons-version}") format("woff"),
|
||||
url("@{ionicons-font-path}/ionicons.ttf?v=@{ionicons-version}") format("truetype"),
|
||||
url("@{ionicons-font-path}/ionicons.svg?v=@{ionicons-version}#Ionicons") format("svg");
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
|
|
|
|||
BIN
src/styles/common/iconfont/fonts/ionicons.woff2
Normal file
BIN
src/styles/common/iconfont/fonts/ionicons.woff2
Normal file
Binary file not shown.
|
|
@ -68,7 +68,7 @@
|
|||
.inner-arrow();
|
||||
}
|
||||
&-visible &-arrow:nth-of-type(2) {
|
||||
transform: rotate(180deg);
|
||||
transform: translateY(-50%) rotate(180deg);
|
||||
}
|
||||
|
||||
.@{select-dropdown-prefix-cls} {
|
||||
|
|
@ -126,7 +126,7 @@
|
|||
|
||||
& &-item{
|
||||
position: relative;
|
||||
padding-right: 24px;
|
||||
padding-right: 36px;
|
||||
transition: all @transition-time @ease-in-out;
|
||||
|
||||
i{
|
||||
|
|
@ -134,7 +134,8 @@
|
|||
position: absolute;
|
||||
right: 15px;
|
||||
top: 50%;
|
||||
margin-top: -6px;
|
||||
//margin-top: -6px;
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
|
||||
&-active{
|
||||
|
|
|
|||
|
|
@ -19,6 +19,7 @@
|
|||
border: 1px solid @border-color-base;
|
||||
border-radius: @btn-border-radius;
|
||||
overflow: hidden;
|
||||
cursor: default;
|
||||
|
||||
&-handler-wrap {
|
||||
width: 22px;
|
||||
|
|
|
|||
|
|
@ -160,16 +160,24 @@
|
|||
}
|
||||
|
||||
&-vertical &-submenu-title-icon{
|
||||
float: right;
|
||||
position: relative;
|
||||
top: 4px;
|
||||
// #5592 支持自定义图标 size 后，换一种位置
|
||||
//float: right;
|
||||
//position: relative;
|
||||
//top: 4px;
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
right: 24px;
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
&-submenu-title-icon {
|
||||
transition: transform @transition-time @ease-in-out;
|
||||
}
|
||||
&-opened > * > &-submenu-title-icon{
|
||||
&-horizontal &-opened > * > &-submenu-title-icon{
|
||||
transform: rotate(180deg);
|
||||
}
|
||||
&-vertical &-opened > * > &-submenu-title-icon{
|
||||
transform: translateY(-50%) rotate(180deg);
|
||||
}
|
||||
|
||||
&-vertical &-submenu{
|
||||
&-nested{
|
||||
|
|
|
|||
|
|
@ -43,7 +43,7 @@
|
|||
}
|
||||
|
||||
.@{select-prefix-cls}-arrow {
|
||||
transform: rotate(180deg);
|
||||
transform: translateY(-50%) rotate(180deg);
|
||||
display: inline-block;
|
||||
}
|
||||
}
|
||||
|
|
@ -53,7 +53,7 @@
|
|||
.disabled();
|
||||
|
||||
.@{select-prefix-cls}-arrow {
|
||||
display: none;
|
||||
color: @slider-disabled-color;
|
||||
}
|
||||
|
||||
&:hover {
|
||||
|
|
@ -185,7 +185,7 @@
|
|||
}
|
||||
|
||||
&-multiple &-input{
|
||||
height: @input-height-base - 3px;
|
||||
height: @input-height-base - 2px;
|
||||
line-height: @input-height-base;
|
||||
padding: 0 0 0 4px;
|
||||
}
|
||||
|
|
@ -208,7 +208,7 @@
|
|||
margin: 3px 4px 3px 0;
|
||||
max-width: 99%;
|
||||
position: relative;
|
||||
span{
|
||||
span:not(.ivu-select-max-tag){
|
||||
display: block;
|
||||
margin-right: 14px;
|
||||
overflow: hidden;
|
||||
|
|
@ -256,6 +256,33 @@
|
|||
& &-dropdown{
|
||||
width: auto;
|
||||
}
|
||||
|
||||
&-prefix{
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
i{
|
||||
vertical-align: top;
|
||||
}
|
||||
}
|
||||
&-head-with-prefix{
|
||||
display: inline-block !important;
|
||||
vertical-align: middle;
|
||||
}
|
||||
&-single &-prefix{
|
||||
padding-left: 4px;
|
||||
}
|
||||
&-single &-head-with-prefix, &-multiple &-head-with-prefix{
|
||||
padding-left: 0 !important;
|
||||
}
|
||||
|
||||
&-head-flex{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
&-multiple &-head-flex &-prefix{
|
||||
margin-right: 4px;
|
||||
}
|
||||
}
|
||||
|
||||
.select-item(@select-prefix-cls, @select-item-prefix-cls);
|
||||
|
|
|
|||
|
|
@ -7,6 +7,7 @@
|
|||
border: 1px solid @border-color-base;
|
||||
border-bottom: 0;
|
||||
border-right: 0;
|
||||
overflow: hidden; // 开启 max-height 时，没有 overflow: hidden，则底部多出 1px，早期没有 overflow 是因为有些控件没有加 transfer
|
||||
}
|
||||
width: inherit;
|
||||
height: 100%;
|
||||
|
|
|
|||
|
|
@ -203,7 +203,7 @@
|
|||
&&-card > &-bar &-nav-wrap {
|
||||
margin-bottom: 0;
|
||||
}
|
||||
&&-card > &-bar &-tab .@{css-prefix-iconfont}-ios-close {
|
||||
&&-card > &-bar &-tab &-close {
|
||||
width: 0;
|
||||
height: 22px;
|
||||
font-size: 22px;
|
||||
|
|
@ -221,8 +221,8 @@
|
|||
}
|
||||
}
|
||||
|
||||
&&-card > &-bar &-tab-active .@{css-prefix-iconfont}-ios-close,
|
||||
&&-card > &-bar &-tab:hover .@{css-prefix-iconfont}-ios-close {
|
||||
&&-card > &-bar &-tab-active &-close,
|
||||
&&-card > &-bar &-tab:hover &-close {
|
||||
width: 22px;
|
||||
transform: translateZ(0);
|
||||
margin-right: -6px;
|
||||
|
|
|
|||
|
|
@ -20,7 +20,7 @@
|
|||
top: 50%;
|
||||
right: 8px;
|
||||
line-height: 1;
|
||||
margin-top: -7px;
|
||||
transform: translateY(-50%);
|
||||
font-size: @font-size-base;
|
||||
color: @subsidiary-color;
|
||||
transition: all @transition-time @ease-in-out;
|
||||
|
|
|
|||
23
tsconfig.json
Normal file
23
tsconfig.json
Normal file
|
|
@ -0,0 +1,23 @@
|
|||
{
|
||||
"compilerOptions": {
|
||||
"target": "esnext",
|
||||
"module": "esnext",
|
||||
"strict": true,
|
||||
"jsx": "preserve",
|
||||
"importHelpers": true,
|
||||
"moduleResolution": "node",
|
||||
"experimentalDecorators": true,
|
||||
"esModuleInterop": true,
|
||||
"allowSyntheticDefaultImports": true,
|
||||
"sourceMap": true,
|
||||
"baseUrl": ".",
|
||||
"paths": {
|
||||
"@/*": ["src/*"]
|
||||
},
|
||||
"lib": ["esnext", "dom", "dom.iterable", "scripthost"]
|
||||
},
|
||||
"include": [
|
||||
"types/*.ts",
|
||||
],
|
||||
"exclude": ["node_modules"]
|
||||
}
|
||||
127
tslint.json
Normal file
127
tslint.json
Normal file
|
|
@ -0,0 +1,127 @@
|
|||
{
|
||||
"defaultSeverity": "warning",
|
||||
"extends": ["tslint:recommended"],
|
||||
"linterOptions": {
|
||||
"exclude": ["node_modules/**"]
|
||||
},
|
||||
"rules": {
|
||||
"jsx-boolean-value": false,
|
||||
"jsx-curly-spacing": false,
|
||||
"jsx-no-multiline-js": false,
|
||||
"jsx-wrap-multiline": false,
|
||||
"jsx-alignment": false,
|
||||
"jsx-no-lambda": true,
|
||||
"jsx-no-string-ref": false,
|
||||
"class-name": false,
|
||||
"max-line-length": [true, 180],
|
||||
"member-ordering": [true, "statics-first"],
|
||||
"new-parens": true,
|
||||
"no-consecutive-blank-lines": true,
|
||||
"no-mergeable-namespace": true,
|
||||
"no-switch-case-fall-through": true,
|
||||
"no-trailing-whitespace": true,
|
||||
"no-unused-variable": [true],
|
||||
"no-var-keyword": true,
|
||||
"one-variable-per-declaration": [false, "ignore-for-loop"],
|
||||
"triple-equals": [false, "allow-null-check"],
|
||||
"use-isnan": false,
|
||||
//ts专用
|
||||
"prefer-const": false, //true, //const偏好
|
||||
"adjacent-overload-signatures": true, //Enforces function overloads to be consecutive.
|
||||
"ban-comma-operator": true, //禁止逗号运算符。
|
||||
"ban-type": [true, ["object", "User {} instead."], ["string"]], //禁止类型
|
||||
//"member-access": [true, "no-public" || "check-accessor" || "check-constructor" || "check-parameter-property"], //类成员必须声明 private public ....
|
||||
"member-order": [false], //类声明排序
|
||||
"no-any": false, //true, //不需使用any类型
|
||||
"no-empty-interface": true, //禁止空接口 {}
|
||||
"no-import-side-effect": [
|
||||
true,
|
||||
{
|
||||
"ignore-module": "(\\.html|\\.css)$"
|
||||
}
|
||||
], //禁止导入带有副作用的语句
|
||||
"no-inferrable-types": [true, "ignore-params", "ignore-properties"], //不允许将变量或参数初始化为数字,字符串或布尔值的显式类型声明。
|
||||
"no-internal-module": true, //不允许内部模块
|
||||
"no-magic-numbers": false, //[true, 1, 2, 3], //不允许在变量赋值之外使用常量数值。当没有指定允许值列表时,默认允许-1,0和1
|
||||
"no-namespace": false, //[true, "allpw-declarations"], //不允许使用内部modules和命名空间
|
||||
"no-non-null-assertion": true, //不允许使用!后缀操作符的非空断言。
|
||||
"no-parameter-reassignment": false, //true, //不允许重新分配参数
|
||||
"no-reference": false, //true, // 禁止使用/// <reference path=> 导入 ,使用import代替
|
||||
"no-unnecessary-type-assertion": true, //如果类型断言没有改变表达式的类型就发出警告
|
||||
"no-var-requires": true, //不允许使用var module = require("module"),用 import foo = require('foo')导入
|
||||
"only-arrow-functions": false, //[true, "allow-declarations", "allow-named-functions"], //允许箭头表达式,不需要传统表达式 ； 允许独立的函数声明 ；允许表达,function foo() {}但不是function() {}
|
||||
"prefer-for-of": true, //建议使用for(..of)
|
||||
"promise-function-async": true, //要求异步函数返回promise
|
||||
"typedef": false, //[true, "call-signature", "parameter", "member-variable-declaration"], // 需要定义的类型存在
|
||||
"typedef-whitespace": true, //类型声明的冒号之前是否需要空格,在类型定义的时候，是否允许使用空格, 使用false，表示不对此项进行校验,不启用此项的校验
|
||||
"unified-signatures": true, //重载可以被统一联合成一个
|
||||
//function 专用
|
||||
"await-promise": true, //警告不是一个promise的await
|
||||
// "ban": [
|
||||
// true,
|
||||
// "eval",
|
||||
// {
|
||||
// "name": "$",
|
||||
// "message": "please don't"
|
||||
// },
|
||||
// ["describe", "only"],
|
||||
// {
|
||||
// "name": ["it", "only"],
|
||||
// "message": "don't focus tests"
|
||||
// },
|
||||
// {
|
||||
// "name": ["chai", "assert", "equal"],
|
||||
// "message": "Use 'strictEqual' instead."
|
||||
// },
|
||||
// {
|
||||
// "name": ["*", "forEach"],
|
||||
// "message": "Use a regular for loop instead."
|
||||
// }
|
||||
// ],
|
||||
"curly": true, //for if do while 要有括号
|
||||
"forin": false, //true, //用for in 必须用if进行过滤
|
||||
"import-blacklist": true, //允许使用import require导入具体的模块
|
||||
"label-postion": true, //允许在do/for/while/swith中使用label
|
||||
"no-arg": true, //不允许使用 argument.callee
|
||||
"no-bitwise": false, //true, //不允许使用按位运算符
|
||||
"no-conditional-assignmen": true, //不允许在do-while/for/if/while判断语句中使用赋值语句
|
||||
"no-console": [true, "time", "timeEnd"], //不能使用console
|
||||
"no-construct": true, //不允许使用 String/Number/Boolean的构造函数
|
||||
"no-debugger": true, //不允许使用debugger
|
||||
"no-duplicate-super": true, //构造函数两次用super会发出警告
|
||||
"no-empty": false, //true, //不允许空的块
|
||||
"no-eval": true, //不允许使用eval
|
||||
"no-floating-promises": true, //必须正确处理promise的返回函数
|
||||
"no-for-in-array": true, //不允许使用for in 遍历数组
|
||||
"no-implicit-dependencies": true, //不允许在项目的package.json中导入未列为依赖项的模块
|
||||
"no-inferred-empty-object-type": true, //不允许在函数和构造函数中使用{}的类型推断
|
||||
"no-invalid-template-strings": true, //警告在非模板字符中使用${
|
||||
"no-invalid-this": false, //true, //不允许在非class中使用 this关键字
|
||||
"no-misused-new": true, //禁止定义构造函数或new class
|
||||
"no-null-keyword": false, // true, //不允许使用null关键字
|
||||
"no-object-literal-type-assertion": false, //true, //禁止objext出现在类型断言表达式中
|
||||
"no-return-await": true, //不允许return await
|
||||
"arrow-parens": false, //true, //箭头函数定义的参数需要括号
|
||||
"quotemark": [true, "single", "jsx-double", "avoid-escape"], //引号的使用规则
|
||||
"semicolon": false, //[true, "never", "ignore-interfaces"], //分号的使用规则
|
||||
"indent": false, //[true, "tabs", 2], //使用Tab进行缩进，每次强制缩进2个字符
|
||||
"whitespace": [
|
||||
true,
|
||||
"check-branch",
|
||||
"check-decl",
|
||||
"check-operator",
|
||||
"check-type"
|
||||
], //空格的校验
|
||||
"member-access": false, //类成员的显示可见性声明，即显示定义一个类的成员是否可见，即对类成员定义public | static 等
|
||||
"one-line": false //, //要求指定的标记与它们之前的表达式位于同一行
|
||||
// "trailing-comma": [true, { //对尾随逗号的校验
|
||||
// "multiline": {
|
||||
// "objects": "ignore",
|
||||
// "arrays": "never",
|
||||
// "functions": "never",
|
||||
// "typeLiterals": "ignore"
|
||||
// },
|
||||
//"esSpecCompliant": true //是否允许尾随逗号出现在剩余变量中
|
||||
// }]
|
||||
}
|
||||
}
|
||||
2
types/drawer.d.ts
vendored
2
types/drawer.d.ts
vendored
|
|
@ -75,7 +75,7 @@ export declare interface Drawer extends Vue {
|
|||
/**
|
||||
* 返回 Promise 可以阻止关闭
|
||||
*/
|
||||
'before-close'?: () => void | PromiseConstructor;
|
||||
'before-close'?: () => void | Promise<any>;
|
||||
/**
|
||||
* 关闭抽屉时触发
|
||||
*/
|
||||
|
|
|
|||
5
types/loading-bar.d.ts
vendored
5
types/loading-bar.d.ts
vendored
|
|
@ -41,6 +41,11 @@ export declare interface LoadingBarConfig {
|
|||
* @default primary
|
||||
*/
|
||||
color?: string;
|
||||
/**
|
||||
* 自动消失的延时, 默认为800ms
|
||||
* @default 800
|
||||
*/
|
||||
duration?: number;
|
||||
/**
|
||||
* 失败时的进度条颜色，默认为 iView 主色
|
||||
* @default error
|
||||
|
|
|
|||
2
types/time.d.ts
vendored
2
types/time.d.ts
vendored
|
|
@ -2,7 +2,7 @@
|
|||
// Project: https://github.com/iview/iview
|
||||
// Definitions by: yangdan
|
||||
// Definitions: https://github.com/yangdan8/iview.git
|
||||
import Vue, { VNode } from 'vue';
|
||||
import Vue from 'vue';
|
||||
|
||||
export declare interface Time extends Vue {
|
||||
/**
|
||||
|
|
|
|||
Loading…
Add table
Reference in a new issue