yangdan8
GitHub
commit
4ac6bce418
51 changed files with 1008 additions and 105 deletions
|
|
@ -40,13 +40,6 @@ iView
|
||||||
</a>
|
</a>
|
||||||
</td>
|
</td>
|
||||||
</tr>
|
</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>
|
</tbody>
|
||||||
</table>
|
</table>
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -68,6 +68,7 @@ nav {
|
||||||
<li><router-link to="/time">Time</router-link></li>
|
<li><router-link to="/time">Time</router-link></li>
|
||||||
<li><router-link to="/cell">Cell</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="/drawer">Drawer</router-link></li>
|
||||||
|
<li><router-link to="/icon">Icon</router-link></li>
|
||||||
</ul>
|
</ul>
|
||||||
</nav>
|
</nav>
|
||||||
<router-view></router-view>
|
<router-view></router-view>
|
||||||
|
|
|
||||||
|
|
@ -229,6 +229,10 @@ const router = new VueRouter({
|
||||||
{
|
{
|
||||||
path: '/drawer',
|
path: '/drawer',
|
||||||
component: (resolve) => require(['./routers/drawer.vue'], resolve)
|
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 type="default">Small</Button>
|
||||||
</Button-group>
|
</Button-group>
|
||||||
|
|
||||||
<br><br><br><br><br>
|
<br><br>
|
||||||
|
<Button to="/icon">Open New Window</Button>
|
||||||
|
<br><br><br>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
|
|
|
||||||
|
|
@ -3,7 +3,7 @@
|
||||||
<Card title="选项" :padding="0" shadow style="width: 300px;">
|
<Card title="选项" :padding="0" shadow style="width: 300px;">
|
||||||
<CellGroup @on-click="handleClick">
|
<CellGroup @on-click="handleClick">
|
||||||
<Cell title="标题一" name="a1" label="附属内容" to="/button">
|
<Cell title="标题一" name="a1" label="附属内容" to="/button">
|
||||||
<Badge count="10" slot="extra"></Badge>
|
<Badge :count="10" slot="extra"></Badge>
|
||||||
</Cell>
|
</Cell>
|
||||||
<Cell title="标题一" name="a2" label="附属内容" extra="详细信息"></Cell>
|
<Cell title="标题一" name="a2" label="附属内容" extra="详细信息"></Cell>
|
||||||
<Cell title="标题一" name="a3" label="附属内容" extra="详细信息" to="/button"></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>
|
<template>
|
||||||
<div style="margin: 200px;">
|
<div style="margin: 100px;">
|
||||||
<Select size="small" v-model="model10" multiple style="width:260px">
|
<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>
|
<Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
|
||||||
</Select>
|
</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>
|
<Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
|
||||||
</Select>
|
</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>
|
<Option v-for="item in cityList" :value="item.value" :key="item.value">{{ item.label }}</Option>
|
||||||
</Select>
|
</Select>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -22,7 +60,7 @@
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
value: 'London',
|
value: 'London',
|
||||||
label: 'LondonLondonLondonLondonLondonLondonLondonLondonLondonLondonLondonLondonLondonLondonLondonLondonLondonLondon'
|
label: 'London'
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
value: 'Sydney',
|
value: 'Sydney',
|
||||||
|
|
@ -41,7 +79,13 @@
|
||||||
label: 'Canberra'
|
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",
|
"name": "iview",
|
||||||
"version": "3.2.2",
|
"version": "3.3.3",
|
||||||
"lockfileVersion": 1,
|
"lockfileVersion": 1,
|
||||||
"requires": true,
|
"requires": true,
|
||||||
"dependencies": {
|
"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": {
|
"builtin-status-codes": {
|
||||||
"version": "3.0.0",
|
"version": "3.0.0",
|
||||||
"resolved": "https://registry.npmjs.org/builtin-status-codes/-/builtin-status-codes-3.0.0.tgz",
|
"resolved": "https://registry.npmjs.org/builtin-status-codes/-/builtin-status-codes-3.0.0.tgz",
|
||||||
|
|
@ -13571,6 +13577,70 @@
|
||||||
"integrity": "sha1-yy4SAwZ+DI3h9hQJS5/kVwTqYAM=",
|
"integrity": "sha1-yy4SAwZ+DI3h9hQJS5/kVwTqYAM=",
|
||||||
"dev": true
|
"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": {
|
"tsscmp": {
|
||||||
"version": "1.0.6",
|
"version": "1.0.6",
|
||||||
"resolved": "https://registry.npmjs.org/tsscmp/-/tsscmp-1.0.6.tgz",
|
"resolved": "https://registry.npmjs.org/tsscmp/-/tsscmp-1.0.6.tgz",
|
||||||
|
|
@ -13578,6 +13648,15 @@
|
||||||
"dev": true,
|
"dev": true,
|
||||||
"optional": 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": {
|
"tty-browserify": {
|
||||||
"version": "0.0.0",
|
"version": "0.0.0",
|
||||||
"resolved": "https://registry.npmjs.org/tty-browserify/-/tty-browserify-0.0.0.tgz",
|
"resolved": "https://registry.npmjs.org/tty-browserify/-/tty-browserify-0.0.0.tgz",
|
||||||
|
|
@ -13631,6 +13710,12 @@
|
||||||
"integrity": "sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c=",
|
"integrity": "sha1-hnrHTjhkGHsdPUfZlqeOxciDB3c=",
|
||||||
"dev": true
|
"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": {
|
"uglify-js": {
|
||||||
"version": "2.8.29",
|
"version": "2.8.29",
|
||||||
"resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-2.8.29.tgz",
|
"resolved": "https://registry.npmjs.org/uglify-js/-/uglify-js-2.8.29.tgz",
|
||||||
|
|
@ -14276,9 +14361,9 @@
|
||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
"vue": {
|
"vue": {
|
||||||
"version": "2.6.6",
|
"version": "2.6.10",
|
||||||
"resolved": "https://registry.npmjs.org/vue/-/vue-2.6.6.tgz",
|
"resolved": "https://registry.npmjs.org/vue/-/vue-2.6.10.tgz",
|
||||||
"integrity": "sha512-Y2DdOZD8sxApS+iUlwv1v8U1qN41kq6Kw45lM6nVZKhygeWA49q7VCCXkjXqeDBXgurrKWkYQ9cJeEJwAq0b9Q==",
|
"integrity": "sha512-ImThpeNU9HbdZL3utgMCq0oiMzAkt1mcgy3/E6zWC/G6AaQoeuFdsl9nDhTDU3X1R6FK7nsIUuRACVcjI+A2GQ==",
|
||||||
"dev": true
|
"dev": true
|
||||||
},
|
},
|
||||||
"vue-hot-reload-api": {
|
"vue-hot-reload-api": {
|
||||||
|
|
@ -14578,9 +14663,9 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
"vue-template-compiler": {
|
"vue-template-compiler": {
|
||||||
"version": "2.6.6",
|
"version": "2.6.10",
|
||||||
"resolved": "https://registry.npmjs.org/vue-template-compiler/-/vue-template-compiler-2.6.6.tgz",
|
"resolved": "https://registry.npmjs.org/vue-template-compiler/-/vue-template-compiler-2.6.10.tgz",
|
||||||
"integrity": "sha512-OakxDGyrmMQViCjkakQFbDZlG0NibiOzpLauOfyCUVRQc9yPmTqpiz9nF0VeA+dFkXegetw0E5x65BFhhLXO0A==",
|
"integrity": "sha512-jVZkw4/I/HT5ZMvRnhv78okGusqe0+qH2A0Em0Cp8aq78+NK9TII263CDVz2QXZsIT+yyV/gZc/j/vlwa+Epyg==",
|
||||||
"dev": true,
|
"dev": true,
|
||||||
"requires": {
|
"requires": {
|
||||||
"de-indent": "1.0.2",
|
"de-indent": "1.0.2",
|
||||||
|
|
|
||||||
11
package.json
11
package.json
|
|
@ -1,6 +1,6 @@
|
||||||
{
|
{
|
||||||
"name": "iview",
|
"name": "iview",
|
||||||
"version": "3.3.3",
|
"version": "3.4.0-rc.2",
|
||||||
"title": "iView",
|
"title": "iView",
|
||||||
"description": "A high quality UI components Library with Vue.js",
|
"description": "A high quality UI components Library with Vue.js",
|
||||||
"homepage": "http://www.iviewui.com",
|
"homepage": "http://www.iviewui.com",
|
||||||
|
|
@ -29,8 +29,9 @@
|
||||||
"dist:locale": "webpack --config build/webpack.dist.locale.config.js",
|
"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",
|
"dist": "npm run dist:style && npm run dist:dev && npm run dist:prod && npm run dist:locale",
|
||||||
"lint": "eslint --fix --ext .js,.vue src",
|
"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",
|
"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"
|
"prepare": "npm run dist"
|
||||||
},
|
},
|
||||||
"repository": {
|
"repository": {
|
||||||
|
|
@ -103,15 +104,17 @@
|
||||||
"sinon": "^4.4.2",
|
"sinon": "^4.4.2",
|
||||||
"sinon-chai": "^3.3.0",
|
"sinon-chai": "^3.3.0",
|
||||||
"style-loader": "^0.20.2",
|
"style-loader": "^0.20.2",
|
||||||
|
"tslint": "^5.14.0",
|
||||||
|
"typescript": "^3.3.4000",
|
||||||
"uglifyjs-webpack-plugin": "^1.3.0",
|
"uglifyjs-webpack-plugin": "^1.3.0",
|
||||||
"url-loader": "^1.1.2",
|
"url-loader": "^1.1.2",
|
||||||
"vue": "^2.5.17",
|
"vue": "^2.6.10",
|
||||||
"vue-hot-reload-api": "^2.3.1",
|
"vue-hot-reload-api": "^2.3.1",
|
||||||
"vue-html-loader": "^1.2.4",
|
"vue-html-loader": "^1.2.4",
|
||||||
"vue-loader": "^14.2.1",
|
"vue-loader": "^14.2.1",
|
||||||
"vue-router": "^3.0.2",
|
"vue-router": "^3.0.2",
|
||||||
"vue-style-loader": "^4.1.2",
|
"vue-style-loader": "^4.1.2",
|
||||||
"vue-template-compiler": "^2.5.17",
|
"vue-template-compiler": "^2.6.10",
|
||||||
"webpack": "^3.11.0",
|
"webpack": "^3.11.0",
|
||||||
"webpack-dev-server": "^2.11.3",
|
"webpack-dev-server": "^2.11.3",
|
||||||
"webpack-merge": "^3.0.0"
|
"webpack-merge": "^3.0.0"
|
||||||
|
|
|
||||||
|
|
@ -67,9 +67,15 @@ const Transition = {
|
||||||
export default {
|
export default {
|
||||||
name: 'CollapseTransition',
|
name: 'CollapseTransition',
|
||||||
functional: true,
|
functional: true,
|
||||||
render(h, { children }) {
|
props: {
|
||||||
|
appear: Boolean
|
||||||
|
},
|
||||||
|
render(h, { children, props }) {
|
||||||
const data = {
|
const data = {
|
||||||
on: Transition
|
on: Transition,
|
||||||
|
props: {
|
||||||
|
appear: props.appear
|
||||||
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
return h('transition', data, children);
|
return h('transition', data, children);
|
||||||
|
|
|
||||||
|
|
@ -1,5 +1,5 @@
|
||||||
<template>
|
<template>
|
||||||
<transition :name="transitionName" @enter="handleEnter" @leave="handleLeave">
|
<transition :name="transitionName" @enter="handleEnter" @leave="handleLeave" appear>
|
||||||
<div :class="classes" :style="styles">
|
<div :class="classes" :style="styles">
|
||||||
<template v-if="type === 'notice'">
|
<template v-if="type === 'notice'">
|
||||||
<div :class="contentClasses" ref="content" v-html="content"></div>
|
<div :class="contentClasses" ref="content" v-html="content"></div>
|
||||||
|
|
|
||||||
|
|
@ -17,7 +17,7 @@
|
||||||
v-show="filterable && query === ''"
|
v-show="filterable && query === ''"
|
||||||
@click="handleFocus">{{ displayRender }}</div>
|
@click="handleFocus">{{ displayRender }}</div>
|
||||||
<Icon type="ios-close-circle" :class="[prefixCls + '-arrow']" v-show="showCloseIcon" @click.native.stop="clearSelect"></Icon>
|
<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>
|
</slot>
|
||||||
</div>
|
</div>
|
||||||
<transition name="transition-drop">
|
<transition name="transition-drop">
|
||||||
|
|
@ -47,7 +47,7 @@
|
||||||
@click="handleSelectItem(index)" v-html="item.display"></li>
|
@click="handleSelectItem(index)" v-html="item.display"></li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</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>
|
</div>
|
||||||
</Drop>
|
</Drop>
|
||||||
</transition>
|
</transition>
|
||||||
|
|
@ -232,6 +232,41 @@
|
||||||
return item;
|
return item;
|
||||||
});
|
});
|
||||||
return selections;
|
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: {
|
methods: {
|
||||||
|
|
|
||||||
|
|
@ -1,13 +1,16 @@
|
||||||
<template>
|
<template>
|
||||||
<li :class="classes">
|
<li :class="classes">
|
||||||
{{ data.label }}
|
{{ 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>
|
<i v-if="showLoading" class="ivu-icon ivu-icon-ios-loading ivu-load-loop"></i>
|
||||||
</li>
|
</li>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
|
import Icon from '../icon/icon.vue';
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'Casitem',
|
name: 'Casitem',
|
||||||
|
components: { Icon },
|
||||||
props: {
|
props: {
|
||||||
data: Object,
|
data: Object,
|
||||||
prefixCls: String,
|
prefixCls: String,
|
||||||
|
|
@ -28,6 +31,41 @@
|
||||||
},
|
},
|
||||||
showLoading () {
|
showLoading () {
|
||||||
return 'loading' in this.data && this.data.loading;
|
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>
|
||||||
<div class="ivu-cell-arrow" v-if="to">
|
<div class="ivu-cell-arrow" v-if="to">
|
||||||
<slot name="arrow">
|
<slot name="arrow">
|
||||||
<Icon type="ios-arrow-forward"></Icon>
|
<Icon :type="arrowType" :custom="customArrowType" :size="arrowSize" />
|
||||||
</slot>
|
</slot>
|
||||||
</div>
|
</div>
|
||||||
</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: {
|
methods: {
|
||||||
handleClickItem (event, new_window) {
|
handleClickItem (event, new_window) {
|
||||||
|
|
|
||||||
|
|
@ -4,7 +4,7 @@
|
||||||
<Icon type="ios-arrow-forward" v-if="!hideArrow"></Icon>
|
<Icon type="ios-arrow-forward" v-if="!hideArrow"></Icon>
|
||||||
<slot></slot>
|
<slot></slot>
|
||||||
</div>
|
</div>
|
||||||
<collapse-transition>
|
<collapse-transition v-if="mounted">
|
||||||
<div :class="contentClasses" v-show="isActive">
|
<div :class="contentClasses" v-show="isActive">
|
||||||
<div :class="boxClasses"><slot name="content"></slot></div>
|
<div :class="boxClasses"><slot name="content"></slot></div>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -31,7 +31,8 @@
|
||||||
data () {
|
data () {
|
||||||
return {
|
return {
|
||||||
index: 0, // use index for default when name is null
|
index: 0, // use index for default when name is null
|
||||||
isActive: false
|
isActive: false,
|
||||||
|
mounted: false
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
|
|
@ -60,6 +61,9 @@
|
||||||
isActive: this.isActive
|
isActive: this.isActive
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
mounted () {
|
||||||
|
this.mounted = true;
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
|
||||||
|
|
@ -10,7 +10,7 @@
|
||||||
:name="name"
|
:name="name"
|
||||||
:value="currentValue"
|
:value="currentValue"
|
||||||
type="hidden">
|
type="hidden">
|
||||||
<i :class="arrowClasses"></i>
|
<Icon :type="arrowType" :custom="customArrowType" :size="arrowSize" :class="arrowClasses"></Icon>
|
||||||
<div
|
<div
|
||||||
ref="input"
|
ref="input"
|
||||||
:tabindex="disabled ? undefined : 0"
|
:tabindex="disabled ? undefined : 0"
|
||||||
|
|
@ -125,6 +125,7 @@ import Hue from './hue.vue';
|
||||||
import Alpha from './alpha.vue';
|
import Alpha from './alpha.vue';
|
||||||
import iInput from '../input/input.vue';
|
import iInput from '../input/input.vue';
|
||||||
import iButton from '../button/button.vue';
|
import iButton from '../button/button.vue';
|
||||||
|
import Icon from '../icon/icon.vue';
|
||||||
import Locale from '../../mixins/locale';
|
import Locale from '../../mixins/locale';
|
||||||
import {oneOf} from '../../utils/assist';
|
import {oneOf} from '../../utils/assist';
|
||||||
import Emitter from '../../mixins/emitter';
|
import Emitter from '../../mixins/emitter';
|
||||||
|
|
@ -134,7 +135,7 @@ import {changeColor, toRGBAString} from './utils';
|
||||||
export default {
|
export default {
|
||||||
name: 'ColorPicker',
|
name: 'ColorPicker',
|
||||||
|
|
||||||
components: {Drop, RecommendColors, Saturation, Hue, Alpha, iInput, iButton},
|
components: {Drop, RecommendColors, Saturation, Hue, Alpha, iInput, iButton, Icon},
|
||||||
|
|
||||||
directives: {clickOutside, TransferDom},
|
directives: {clickOutside, TransferDom},
|
||||||
|
|
||||||
|
|
@ -260,8 +261,6 @@ export default {
|
||||||
computed: {
|
computed: {
|
||||||
arrowClasses() {
|
arrowClasses() {
|
||||||
return [
|
return [
|
||||||
this.iconPrefixCls,
|
|
||||||
`${this.iconPrefixCls}-ios-arrow-down`,
|
|
||||||
`${this.inputPrefixCls}-icon`,
|
`${this.inputPrefixCls}-icon`,
|
||||||
`${this.inputPrefixCls}-icon-normal`,
|
`${this.inputPrefixCls}-icon-normal`,
|
||||||
];
|
];
|
||||||
|
|
@ -352,6 +351,41 @@ export default {
|
||||||
[`${this.prefixCls}-confirm-color-editable`]: this.editable
|
[`${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
|
<div
|
||||||
:class="wrapperClasses"
|
:class="wrapperClasses"
|
||||||
v-click-outside:mousedown.capture="handleClose"
|
v-click-outside:mousedown.capture="handleClose"
|
||||||
|
v-click-outside:touchstart.capture="handleClose"
|
||||||
v-click-outside.capture="handleClose"
|
v-click-outside.capture="handleClose"
|
||||||
>
|
>
|
||||||
<div ref="reference" :class="[prefixCls + '-rel']">
|
<div ref="reference" :class="[prefixCls + '-rel']">
|
||||||
|
|
@ -21,14 +22,13 @@
|
||||||
@on-input-change="handleInputChange"
|
@on-input-change="handleInputChange"
|
||||||
@on-focus="handleFocus"
|
@on-focus="handleFocus"
|
||||||
@on-blur="handleBlur"
|
@on-blur="handleBlur"
|
||||||
@on-click="handleIconClick"
|
|
||||||
@click.native="handleFocus"
|
@click.native="handleFocus"
|
||||||
@keydown.native="handleKeydown"
|
@keydown.native="handleKeydown"
|
||||||
@mouseenter.native="handleInputMouseenter"
|
@mouseenter.native="handleInputMouseenter"
|
||||||
@mouseleave.native="handleInputMouseleave"
|
@mouseleave.native="handleInputMouseleave"
|
||||||
|
>
|
||||||
:icon="iconType"
|
<Icon @click="handleIconClick" :type="arrowType" :custom="customArrowType" :size="arrowSize" slot="suffix" />
|
||||||
></i-input>
|
</i-input>
|
||||||
</slot>
|
</slot>
|
||||||
</div>
|
</div>
|
||||||
<transition name="transition-drop">
|
<transition name="transition-drop">
|
||||||
|
|
@ -79,6 +79,7 @@
|
||||||
|
|
||||||
import iInput from '../../components/input/input.vue';
|
import iInput from '../../components/input/input.vue';
|
||||||
import Drop from '../../components/select/dropdown.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 {directive as clickOutside} from 'v-click-outside-x';
|
||||||
import TransferDom from '../../directives/transfer-dom';
|
import TransferDom from '../../directives/transfer-dom';
|
||||||
import { oneOf } from '../../utils/assist';
|
import { oneOf } from '../../utils/assist';
|
||||||
|
|
@ -120,7 +121,7 @@
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
mixins: [ Emitter ],
|
mixins: [ Emitter ],
|
||||||
components: { iInput, Drop },
|
components: { iInput, Drop, Icon },
|
||||||
directives: { clickOutside, TransferDom },
|
directives: { clickOutside, TransferDom },
|
||||||
props: {
|
props: {
|
||||||
format: {
|
format: {
|
||||||
|
|
@ -267,12 +268,6 @@
|
||||||
opened () {
|
opened () {
|
||||||
return this.open === null ? this.visible : this.open;
|
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 () {
|
transition () {
|
||||||
const bottomPlaced = this.placement.match(/^bottom/);
|
const bottomPlaced = this.placement.match(/^bottom/);
|
||||||
return bottomPlaced ? 'slide-up' : 'slide-down';
|
return bottomPlaced ? 'slide-up' : 'slide-down';
|
||||||
|
|
@ -282,6 +277,80 @@
|
||||||
},
|
},
|
||||||
isConfirm(){
|
isConfirm(){
|
||||||
return this.confirm || this.type === 'datetime' || this.type === 'datetimerange' || this.multiple;
|
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: {
|
methods: {
|
||||||
|
|
@ -313,6 +382,7 @@
|
||||||
this.visible = false;
|
this.visible = false;
|
||||||
e && e.preventDefault();
|
e && e.preventDefault();
|
||||||
e && e.stopPropagation();
|
e && e.stopPropagation();
|
||||||
|
this.$emit('on-clickoutside', e);
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -303,6 +303,9 @@
|
||||||
if (this.$slots.header === undefined) {
|
if (this.$slots.header === undefined) {
|
||||||
this.showHead = !!val;
|
this.showHead = !!val;
|
||||||
}
|
}
|
||||||
|
},
|
||||||
|
width (val) {
|
||||||
|
this.dragWidth = val;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
|
||||||
|
|
@ -57,6 +57,10 @@
|
||||||
transferClassName: {
|
transferClassName: {
|
||||||
type: String
|
type: String
|
||||||
},
|
},
|
||||||
|
stopPropagation: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
|
},
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
transition () {
|
transition () {
|
||||||
|
|
@ -164,6 +168,7 @@
|
||||||
},
|
},
|
||||||
mounted () {
|
mounted () {
|
||||||
this.$on('on-click', (key) => {
|
this.$on('on-click', (key) => {
|
||||||
|
if (this.stopPropagation) return;
|
||||||
const $parent = this.hasParent();
|
const $parent = this.hasParent();
|
||||||
if ($parent) $parent.$emit('on-click', key);
|
if ($parent) $parent.$emit('on-click', key);
|
||||||
});
|
});
|
||||||
|
|
|
||||||
|
|
@ -292,6 +292,7 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
change (event) {
|
change (event) {
|
||||||
|
if (event.type == 'change') return;
|
||||||
|
|
||||||
if (event.type == 'input' && !this.activeChange) return;
|
if (event.type == 'input' && !this.activeChange) return;
|
||||||
let val = event.target.value.trim();
|
let val = event.target.value.trim();
|
||||||
|
|
|
||||||
|
|
@ -312,6 +312,7 @@
|
||||||
this.$emit('input', '');
|
this.$emit('input', '');
|
||||||
this.setCurrentValue('');
|
this.setCurrentValue('');
|
||||||
this.$emit('on-change', e);
|
this.$emit('on-change', e);
|
||||||
|
this.$emit('on-clear');
|
||||||
},
|
},
|
||||||
handleSearch () {
|
handleSearch () {
|
||||||
if (this.disabled) return false;
|
if (this.disabled) return false;
|
||||||
|
|
|
||||||
|
|
@ -2,6 +2,7 @@ import LoadingBar from './loading-bar';
|
||||||
|
|
||||||
let loadingBarInstance;
|
let loadingBarInstance;
|
||||||
let color = 'primary';
|
let color = 'primary';
|
||||||
|
let duration = 800;
|
||||||
let failedColor = 'error';
|
let failedColor = 'error';
|
||||||
let height = 2;
|
let height = 2;
|
||||||
let timer;
|
let timer;
|
||||||
|
|
@ -32,7 +33,7 @@ function hide() {
|
||||||
percent: 0
|
percent: 0
|
||||||
});
|
});
|
||||||
}, 200);
|
}, 200);
|
||||||
}, 800);
|
}, duration);
|
||||||
}
|
}
|
||||||
|
|
||||||
function clearTimer() {
|
function clearTimer() {
|
||||||
|
|
@ -96,6 +97,9 @@ export default {
|
||||||
if (options.color) {
|
if (options.color) {
|
||||||
color = options.color;
|
color = options.color;
|
||||||
}
|
}
|
||||||
|
if (options.duration) {
|
||||||
|
duration = options.duration;
|
||||||
|
}
|
||||||
if (options.failedColor) {
|
if (options.failedColor) {
|
||||||
failedColor = options.failedColor;
|
failedColor = options.failedColor;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -133,9 +133,9 @@
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
mounted () {
|
mounted () {
|
||||||
this.updateActiveName();
|
|
||||||
this.openedNames = [...this.openNames];
|
this.openedNames = [...this.openNames];
|
||||||
this.updateOpened();
|
this.updateOpened();
|
||||||
|
this.$nextTick(() => this.updateActiveName());
|
||||||
this.$on('on-menu-item-select', (name) => {
|
this.$on('on-menu-item-select', (name) => {
|
||||||
this.currentActiveName = name;
|
this.currentActiveName = name;
|
||||||
this.$emit('on-select', name);
|
this.$emit('on-select', name);
|
||||||
|
|
|
||||||
|
|
@ -2,7 +2,7 @@
|
||||||
<li :class="classes" @mouseenter="handleMouseenter" @mouseleave="handleMouseleave">
|
<li :class="classes" @mouseenter="handleMouseenter" @mouseleave="handleMouseleave">
|
||||||
<div :class="[prefixCls + '-submenu-title']" ref="reference" @click.stop="handleClick" :style="titleStyle">
|
<div :class="[prefixCls + '-submenu-title']" ref="reference" @click.stop="handleClick" :style="titleStyle">
|
||||||
<slot name="title"></slot>
|
<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>
|
</div>
|
||||||
<collapse-transition v-if="mode === 'vertical'">
|
<collapse-transition v-if="mode === 'vertical'">
|
||||||
<ul :class="[prefixCls]" v-show="opened"><slot></slot></ul>
|
<ul :class="[prefixCls]" v-show="opened"><slot></slot></ul>
|
||||||
|
|
@ -75,6 +75,41 @@
|
||||||
return this.hasParentSubmenu && this.mode !== 'horizontal' ? {
|
return this.hasParentSubmenu && this.mode !== 'horizontal' ? {
|
||||||
paddingLeft: 43 + (this.parentSubmenuNum - 1) * 24 + 'px'
|
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: {
|
methods: {
|
||||||
|
|
|
||||||
|
|
@ -109,7 +109,8 @@ Modal.newInstance = properties => {
|
||||||
on: {
|
on: {
|
||||||
input: (status) => {
|
input: (status) => {
|
||||||
this.visible = status;
|
this.visible = status;
|
||||||
}
|
},
|
||||||
|
'on-cancel': this.cancel
|
||||||
}
|
}
|
||||||
}, [
|
}, [
|
||||||
h('div', {
|
h('div', {
|
||||||
|
|
|
||||||
|
|
@ -60,7 +60,9 @@
|
||||||
},
|
},
|
||||||
maskClosable: {
|
maskClosable: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: true
|
default () {
|
||||||
|
return !this.$IVIEW || this.$IVIEW.modal.maskClosable === '' ? true : this.$IVIEW.modal.maskClosable;
|
||||||
|
}
|
||||||
},
|
},
|
||||||
title: {
|
title: {
|
||||||
type: String
|
type: String
|
||||||
|
|
|
||||||
|
|
@ -111,6 +111,11 @@
|
||||||
// default by css: 8px 16px
|
// default by css: 8px 16px
|
||||||
padding: {
|
padding: {
|
||||||
type: String
|
type: String
|
||||||
|
},
|
||||||
|
// 3.4.0
|
||||||
|
disabled: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
data () {
|
data () {
|
||||||
|
|
@ -181,6 +186,8 @@
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
handleClick () {
|
handleClick () {
|
||||||
|
if (this.disabled) return;
|
||||||
|
|
||||||
if (this.confirm) {
|
if (this.confirm) {
|
||||||
this.visible = !this.visible;
|
this.visible = !this.visible;
|
||||||
return true;
|
return true;
|
||||||
|
|
@ -208,6 +215,8 @@
|
||||||
this.visible = false;
|
this.visible = false;
|
||||||
},
|
},
|
||||||
handleFocus (fromInput = true) {
|
handleFocus (fromInput = true) {
|
||||||
|
if (this.disabled) return;
|
||||||
|
|
||||||
if (this.trigger !== 'focus' || this.confirm || (this.isInput && !fromInput)) {
|
if (this.trigger !== 'focus' || this.confirm || (this.isInput && !fromInput)) {
|
||||||
return false;
|
return false;
|
||||||
}
|
}
|
||||||
|
|
@ -220,6 +229,8 @@
|
||||||
this.visible = false;
|
this.visible = false;
|
||||||
},
|
},
|
||||||
handleMouseenter () {
|
handleMouseenter () {
|
||||||
|
if (this.disabled) return;
|
||||||
|
|
||||||
if (this.trigger !== 'hover' || this.confirm) {
|
if (this.trigger !== 'hover' || this.confirm) {
|
||||||
return false;
|
return false;
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -1,8 +1,21 @@
|
||||||
<template>
|
<template>
|
||||||
<div @click="onHeaderClick">
|
<div @click="onHeaderClick" :class="headCls">
|
||||||
<div class="ivu-tag ivu-tag-checked" v-for="item in selectedMultiple">
|
<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>
|
<span class="ivu-tag-text">{{ item.label }}</span>
|
||||||
<Icon type="ios-close" @click.native.stop="removeTag(item)"></Icon>
|
<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>
|
</div>
|
||||||
<span
|
<span
|
||||||
:class="singleDisplayClasses"
|
:class="singleDisplayClasses"
|
||||||
|
|
@ -26,7 +39,7 @@
|
||||||
|
|
||||||
ref="input">
|
ref="input">
|
||||||
<Icon type="ios-close-circle" :class="[prefixCls + '-arrow']" v-if="resetSelect" @click.native.stop="onClear"></Icon>
|
<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>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script>
|
<script>
|
||||||
|
|
@ -77,6 +90,17 @@
|
||||||
queryProp: {
|
queryProp: {
|
||||||
type: String,
|
type: String,
|
||||||
default: ''
|
default: ''
|
||||||
|
},
|
||||||
|
prefix: {
|
||||||
|
type: String
|
||||||
|
},
|
||||||
|
// 3.4.0
|
||||||
|
maxTagCount: {
|
||||||
|
type: Number
|
||||||
|
},
|
||||||
|
// 3.4.0
|
||||||
|
maxTagPlaceholder: {
|
||||||
|
type: Function
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
data () {
|
data () {
|
||||||
|
|
@ -92,6 +116,7 @@
|
||||||
singleDisplayClasses(){
|
singleDisplayClasses(){
|
||||||
const {filterable, multiple, showPlaceholder} = this;
|
const {filterable, multiple, showPlaceholder} = this;
|
||||||
return [{
|
return [{
|
||||||
|
[prefixCls + '-head-with-prefix']: this.$slots.prefix || this.prefix,
|
||||||
[prefixCls + '-placeholder']: showPlaceholder && !filterable,
|
[prefixCls + '-placeholder']: showPlaceholder && !filterable,
|
||||||
[prefixCls + '-selected-value']: !showPlaceholder && !multiple && !filterable,
|
[prefixCls + '-selected-value']: !showPlaceholder && !multiple && !filterable,
|
||||||
}];
|
}];
|
||||||
|
|
@ -143,6 +168,47 @@
|
||||||
},
|
},
|
||||||
selectedMultiple(){
|
selectedMultiple(){
|
||||||
return this.multiple ? this.values : [];
|
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: {
|
methods: {
|
||||||
|
|
|
||||||
|
|
@ -3,6 +3,7 @@
|
||||||
:class="classes"
|
:class="classes"
|
||||||
v-click-outside.capture="onClickOutside"
|
v-click-outside.capture="onClickOutside"
|
||||||
v-click-outside:mousedown.capture="onClickOutside"
|
v-click-outside:mousedown.capture="onClickOutside"
|
||||||
|
v-click-outside:touchstart.capture="onClickOutside"
|
||||||
>
|
>
|
||||||
<div
|
<div
|
||||||
ref="reference"
|
ref="reference"
|
||||||
|
|
@ -33,18 +34,23 @@
|
||||||
:multiple="multiple"
|
:multiple="multiple"
|
||||||
:values="values"
|
:values="values"
|
||||||
:clearable="canBeCleared"
|
:clearable="canBeCleared"
|
||||||
|
:prefix="prefix"
|
||||||
:disabled="disabled"
|
:disabled="disabled"
|
||||||
:remote="remote"
|
:remote="remote"
|
||||||
:input-element-id="elementId"
|
:input-element-id="elementId"
|
||||||
:initial-label="initialLabel"
|
:initial-label="initialLabel"
|
||||||
:placeholder="placeholder"
|
:placeholder="placeholder"
|
||||||
:query-prop="query"
|
:query-prop="query"
|
||||||
|
:max-tag-count="maxTagCount"
|
||||||
|
:max-tag-placeholder="maxTagPlaceholder"
|
||||||
|
|
||||||
@on-query-change="onQueryChange"
|
@on-query-change="onQueryChange"
|
||||||
@on-input-focus="isFocused = true"
|
@on-input-focus="isFocused = true"
|
||||||
@on-input-blur="isFocused = false"
|
@on-input-blur="isFocused = false"
|
||||||
@on-clear="clearSingleSelect"
|
@on-clear="clearSingleSelect"
|
||||||
/>
|
>
|
||||||
|
<slot name="prefix" slot="prefix"></slot>
|
||||||
|
</select-head>
|
||||||
</slot>
|
</slot>
|
||||||
</div>
|
</div>
|
||||||
<transition name="transition-drop">
|
<transition name="transition-drop">
|
||||||
|
|
@ -235,6 +241,18 @@
|
||||||
transferClassName: {
|
transferClassName: {
|
||||||
type: String
|
type: String
|
||||||
},
|
},
|
||||||
|
// 3.4.0
|
||||||
|
prefix: {
|
||||||
|
type: String
|
||||||
|
},
|
||||||
|
// 3.4.0
|
||||||
|
maxTagCount: {
|
||||||
|
type: Number
|
||||||
|
},
|
||||||
|
// 3.4.0
|
||||||
|
maxTagPlaceholder: {
|
||||||
|
type: Function
|
||||||
|
}
|
||||||
},
|
},
|
||||||
mounted(){
|
mounted(){
|
||||||
this.$on('on-select-selected', this.onOptionClick);
|
this.$on('on-select-selected', this.onOptionClick);
|
||||||
|
|
|
||||||
|
|
@ -8,6 +8,7 @@
|
||||||
:step="step"
|
:step="step"
|
||||||
:value="exportValue[0]"
|
:value="exportValue[0]"
|
||||||
:disabled="disabled"
|
:disabled="disabled"
|
||||||
|
:active-change="activeChange"
|
||||||
@on-change="handleInputChange"></Input-number>
|
@on-change="handleInputChange"></Input-number>
|
||||||
<div
|
<div
|
||||||
:class="[prefixCls + '-wrap']"
|
:class="[prefixCls + '-wrap']"
|
||||||
|
|
@ -148,6 +149,11 @@
|
||||||
},
|
},
|
||||||
name: {
|
name: {
|
||||||
type: String
|
type: String
|
||||||
|
},
|
||||||
|
// 3.4.0
|
||||||
|
activeChange: {
|
||||||
|
type: Boolean,
|
||||||
|
default: true
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
data () {
|
data () {
|
||||||
|
|
|
||||||
|
|
@ -8,7 +8,7 @@
|
||||||
<table-tr
|
<table-tr
|
||||||
:draggable="draggable"
|
:draggable="draggable"
|
||||||
:row="row"
|
:row="row"
|
||||||
:key="row._rowKey"
|
:key="rowKey ? row._rowKey : index"
|
||||||
:prefix-cls="prefixCls"
|
:prefix-cls="prefixCls"
|
||||||
@mouseenter.native.stop="handleMouseIn(row._index)"
|
@mouseenter.native.stop="handleMouseIn(row._index)"
|
||||||
@mouseleave.native.stop="handleMouseOut(row._index)"
|
@mouseleave.native.stop="handleMouseOut(row._index)"
|
||||||
|
|
@ -31,7 +31,7 @@
|
||||||
</table-tr>
|
</table-tr>
|
||||||
<tr v-if="rowExpanded(row._index)" :class="{[prefixCls + '-expanded-hidden']: fixed}">
|
<tr v-if="rowExpanded(row._index)" :class="{[prefixCls + '-expanded-hidden']: fixed}">
|
||||||
<td :colspan="columns.length" :class="prefixCls + '-expanded-cell'">
|
<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>
|
</td>
|
||||||
</tr>
|
</tr>
|
||||||
</template>
|
</template>
|
||||||
|
|
@ -63,6 +63,10 @@
|
||||||
draggable: {
|
draggable: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: false
|
default: false
|
||||||
|
},
|
||||||
|
rowKey: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
|
|
|
||||||
|
|
@ -171,7 +171,8 @@
|
||||||
this.$parent.selectAll(status);
|
this.$parent.selectAll(status);
|
||||||
},
|
},
|
||||||
handleSort (index, type) {
|
handleSort (index, type) {
|
||||||
const column = this.columns[index];
|
// 在固定列时，寻找正确的 index #5580
|
||||||
|
const column = this.columns.find(item => item._index === index);
|
||||||
const _index = column._index;
|
const _index = column._index;
|
||||||
|
|
||||||
if (column._sortType === type) {
|
if (column._sortType === type) {
|
||||||
|
|
@ -180,7 +181,8 @@
|
||||||
this.$parent.handleSort(_index, type);
|
this.$parent.handleSort(_index, type);
|
||||||
},
|
},
|
||||||
handleSortByHead (index) {
|
handleSortByHead (index) {
|
||||||
const column = this.columns[index];
|
// 在固定列时，寻找正确的 index #5580
|
||||||
|
const column = this.columns.find(item => item._index === index);
|
||||||
if (column.sortable) {
|
if (column.sortable) {
|
||||||
const type = column._sortType;
|
const type = column._sortType;
|
||||||
if (type === 'normal') {
|
if (type === 'normal') {
|
||||||
|
|
|
||||||
|
|
@ -21,6 +21,7 @@
|
||||||
:styleObject="tableStyle"
|
:styleObject="tableStyle"
|
||||||
:columns="cloneColumns"
|
:columns="cloneColumns"
|
||||||
:data="rebuildData"
|
:data="rebuildData"
|
||||||
|
:row-key="rowKey"
|
||||||
:columns-width="columnsWidth"
|
:columns-width="columnsWidth"
|
||||||
:obj-data="objData"></table-body>
|
:obj-data="objData"></table-body>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -59,6 +60,7 @@
|
||||||
:styleObject="fixedTableStyle"
|
:styleObject="fixedTableStyle"
|
||||||
:columns="leftFixedColumns"
|
:columns="leftFixedColumns"
|
||||||
:data="rebuildData"
|
:data="rebuildData"
|
||||||
|
:row-key="rowKey"
|
||||||
:columns-width="columnsWidth"
|
:columns-width="columnsWidth"
|
||||||
:obj-data="objData"></table-body>
|
:obj-data="objData"></table-body>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -84,6 +86,7 @@
|
||||||
:styleObject="fixedRightTableStyle"
|
:styleObject="fixedRightTableStyle"
|
||||||
:columns="rightFixedColumns"
|
:columns="rightFixedColumns"
|
||||||
:data="rebuildData"
|
:data="rebuildData"
|
||||||
|
:row-key="rowKey"
|
||||||
:columns-width="columnsWidth"
|
:columns-width="columnsWidth"
|
||||||
:obj-data="objData"></table-body>
|
:obj-data="objData"></table-body>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -149,6 +152,10 @@
|
||||||
height: {
|
height: {
|
||||||
type: [Number, String]
|
type: [Number, String]
|
||||||
},
|
},
|
||||||
|
// 3.4.0
|
||||||
|
maxHeight: {
|
||||||
|
type: [Number, String]
|
||||||
|
},
|
||||||
stripe: {
|
stripe: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: false
|
default: false
|
||||||
|
|
@ -196,6 +203,11 @@
|
||||||
return oneOf(value, ['dark', 'light']);
|
return oneOf(value, ['dark', 'light']);
|
||||||
},
|
},
|
||||||
default: 'dark'
|
default: 'dark'
|
||||||
|
},
|
||||||
|
// #5380 开启后，:key 强制更新，否则使用 index
|
||||||
|
rowKey: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
data () {
|
data () {
|
||||||
|
|
@ -275,6 +287,10 @@
|
||||||
const height = parseInt(this.height);
|
const height = parseInt(this.height);
|
||||||
style.height = `${height}px`;
|
style.height = `${height}px`;
|
||||||
}
|
}
|
||||||
|
if (this.maxHeight) {
|
||||||
|
const maxHeight = parseInt(this.maxHeight);
|
||||||
|
style.maxHeight = `${maxHeight}px`;
|
||||||
|
}
|
||||||
if (this.width) style.width = `${this.width}px`;
|
if (this.width) style.width = `${this.width}px`;
|
||||||
return style;
|
return style;
|
||||||
},
|
},
|
||||||
|
|
@ -336,7 +352,11 @@
|
||||||
let style = {};
|
let style = {};
|
||||||
if (this.bodyHeight !== 0) {
|
if (this.bodyHeight !== 0) {
|
||||||
const height = this.bodyHeight;
|
const height = this.bodyHeight;
|
||||||
|
if (this.height) {
|
||||||
style.height = `${height}px`;
|
style.height = `${height}px`;
|
||||||
|
} else if (this.maxHeight) {
|
||||||
|
style.maxHeight = `${height}px`;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
return style;
|
return style;
|
||||||
},
|
},
|
||||||
|
|
@ -548,7 +568,7 @@
|
||||||
this.objData[_index]._isExpanded = status;
|
this.objData[_index]._isExpanded = status;
|
||||||
this.$emit('on-expand', JSON.parse(JSON.stringify(this.cloneData[_index])), 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());
|
this.$nextTick(()=>this.fixedBody());
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
|
|
@ -578,12 +598,16 @@
|
||||||
},
|
},
|
||||||
|
|
||||||
fixedHeader () {
|
fixedHeader () {
|
||||||
if (this.height) {
|
if (this.height || this.maxHeight) {
|
||||||
this.$nextTick(() => {
|
this.$nextTick(() => {
|
||||||
const titleHeight = parseInt(getStyle(this.$refs.title, 'height')) || 0;
|
const titleHeight = parseInt(getStyle(this.$refs.title, 'height')) || 0;
|
||||||
const headerHeight = parseInt(getStyle(this.$refs.header, 'height')) || 0;
|
const headerHeight = parseInt(getStyle(this.$refs.header, 'height')) || 0;
|
||||||
const footerHeight = parseInt(getStyle(this.$refs.footer, 'height')) || 0;
|
const footerHeight = parseInt(getStyle(this.$refs.footer, 'height')) || 0;
|
||||||
|
if (this.height) {
|
||||||
this.bodyHeight = this.height - titleHeight - headerHeight - footerHeight;
|
this.bodyHeight = this.height - titleHeight - headerHeight - footerHeight;
|
||||||
|
} else if (this.maxHeight) {
|
||||||
|
this.bodyHeight = this.maxHeight - titleHeight - headerHeight - footerHeight;
|
||||||
|
}
|
||||||
this.$nextTick(()=>this.fixedBody());
|
this.$nextTick(()=>this.fixedBody());
|
||||||
});
|
});
|
||||||
} else {
|
} else {
|
||||||
|
|
@ -986,6 +1010,9 @@
|
||||||
height () {
|
height () {
|
||||||
this.handleResize();
|
this.handleResize();
|
||||||
},
|
},
|
||||||
|
maxHeight () {
|
||||||
|
this.handleResize();
|
||||||
|
},
|
||||||
showHorizontalScrollBar () {
|
showHorizontalScrollBar () {
|
||||||
this.handleResize();
|
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-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>
|
<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="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="barClasses" :style="barStyle"></div>
|
||||||
<div :class="tabCls(item)" v-for="(item, index) in navList" @click="handleChange(index)">
|
<div :class="tabCls(item)" v-for="(item, index) in navList" @click="handleChange(index)">
|
||||||
<Icon v-if="item.icon !== ''" :type="item.icon"></Icon>
|
<Icon v-if="item.icon !== ''" :type="item.icon"></Icon>
|
||||||
<Render v-if="item.labelType === 'function'" :render="item.label"></Render>
|
<Render v-if="item.labelType === 'function'" :render="item.label"></Render>
|
||||||
<template v-else>{{ item.label }}</template>
|
<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>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -169,6 +169,41 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
return style;
|
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: {
|
methods: {
|
||||||
|
|
|
||||||
|
|
@ -1,10 +1,10 @@
|
||||||
<template>
|
<template>
|
||||||
<collapse-transition>
|
<collapse-transition :appear="appear">
|
||||||
<ul :class="classes">
|
<ul :class="classes">
|
||||||
<li>
|
<li>
|
||||||
<span :class="arrowClasses" @click="handleExpand">
|
<span :class="arrowClasses" @click="handleExpand">
|
||||||
<Icon v-if="showArrow" type="ios-arrow-forward"></Icon>
|
<Icon v-if="showArrow" :type="arrowType" :custom="customArrowType" :size="arrowSize" />
|
||||||
<Icon v-if="showLoading" type="ios-loading" class="ivu-load-loop"></Icon>
|
<Icon v-if="showLoading" type="ios-loading" class="ivu-load-loop" />
|
||||||
</span>
|
</span>
|
||||||
<Checkbox
|
<Checkbox
|
||||||
v-if="showCheckbox"
|
v-if="showCheckbox"
|
||||||
|
|
@ -17,6 +17,7 @@
|
||||||
<span v-else :class="titleClasses" @click="handleSelect">{{ data.title }}</span>
|
<span v-else :class="titleClasses" @click="handleSelect">{{ data.title }}</span>
|
||||||
<Tree-node
|
<Tree-node
|
||||||
v-if="data.expand"
|
v-if="data.expand"
|
||||||
|
:appear="appearByClickArrow"
|
||||||
v-for="(item, i) in children"
|
v-for="(item, i) in children"
|
||||||
:key="i"
|
:key="i"
|
||||||
:data="item"
|
:data="item"
|
||||||
|
|
@ -61,11 +62,16 @@
|
||||||
showCheckbox: {
|
showCheckbox: {
|
||||||
type: Boolean,
|
type: Boolean,
|
||||||
default: false
|
default: false
|
||||||
|
},
|
||||||
|
appear: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
data () {
|
data () {
|
||||||
return {
|
return {
|
||||||
prefixCls: prefixCls
|
prefixCls: prefixCls,
|
||||||
|
appearByClickArrow: false
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
|
|
@ -127,6 +133,41 @@
|
||||||
},
|
},
|
||||||
children () {
|
children () {
|
||||||
return this.data[this.childrenKey];
|
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: {
|
methods: {
|
||||||
|
|
@ -134,6 +175,9 @@
|
||||||
const item = this.data;
|
const item = this.data;
|
||||||
if (item.disabled) return;
|
if (item.disabled) return;
|
||||||
|
|
||||||
|
// Vue.js 2.6.9 对 transition 的 appear 进行了调整，导致 iView 初始化时无动画，加此方法来判断通过点击箭头展开时，加 appear，否则初始渲染时 appear 为 false
|
||||||
|
this.appearByClickArrow = true;
|
||||||
|
|
||||||
// async loading
|
// async loading
|
||||||
if (item[this.childrenKey].length === 0) {
|
if (item[this.childrenKey].length === 0) {
|
||||||
const tree = findComponentUpward(this, 'Tree');
|
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 = {
|
Vue.prototype.$IVIEW = {
|
||||||
size: opts.size || '',
|
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;
|
Vue.prototype.$Loading = LoadingBar;
|
||||||
|
|
|
||||||
|
|
@ -15,21 +15,46 @@ export default {
|
||||||
return oneOf(value, ['_blank', '_self', '_parent', '_top']);
|
return oneOf(value, ['_blank', '_self', '_parent', '_top']);
|
||||||
},
|
},
|
||||||
default: '_self'
|
default: '_self'
|
||||||
}
|
},
|
||||||
|
append: {
|
||||||
|
type: Boolean,
|
||||||
|
required: false,
|
||||||
|
default: false,
|
||||||
|
},
|
||||||
},
|
},
|
||||||
computed: {
|
computed: {
|
||||||
linkUrl () {
|
linkUrl () {
|
||||||
const type = typeof this.to;
|
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: {
|
methods: {
|
||||||
handleClick (new_window = false) {
|
handleClick (new_window = false) {
|
||||||
|
const router = this.$router;
|
||||||
|
|
||||||
if (new_window) {
|
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 {
|
} else {
|
||||||
const isRoute = this.$router;
|
if (router) {
|
||||||
if (isRoute) {
|
|
||||||
this.replace ? this.$router.replace(this.to) : this.$router.push(this.to);
|
this.replace ? this.$router.replace(this.to) : this.$router.push(this.to);
|
||||||
} else {
|
} else {
|
||||||
window.location.href = this.to;
|
window.location.href = this.to;
|
||||||
|
|
|
||||||
|
|
@ -3,9 +3,9 @@
|
||||||
|
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family: @ionicons-font-family;
|
font-family: @ionicons-font-family;
|
||||||
src:
|
src: url("@{ionicons-font-path}/ionicons.woff2?v=@{ionicons-version}") format("woff2"),
|
||||||
url("@{ionicons-font-path}/ionicons.ttf?v=@{ionicons-version}") format("truetype"),
|
|
||||||
url("@{ionicons-font-path}/ionicons.woff?v=@{ionicons-version}") format("woff"),
|
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");
|
url("@{ionicons-font-path}/ionicons.svg?v=@{ionicons-version}#Ionicons") format("svg");
|
||||||
font-weight: normal;
|
font-weight: normal;
|
||||||
font-style: 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();
|
.inner-arrow();
|
||||||
}
|
}
|
||||||
&-visible &-arrow:nth-of-type(2) {
|
&-visible &-arrow:nth-of-type(2) {
|
||||||
transform: rotate(180deg);
|
transform: translateY(-50%) rotate(180deg);
|
||||||
}
|
}
|
||||||
|
|
||||||
.@{select-dropdown-prefix-cls} {
|
.@{select-dropdown-prefix-cls} {
|
||||||
|
|
@ -126,7 +126,7 @@
|
||||||
|
|
||||||
& &-item{
|
& &-item{
|
||||||
position: relative;
|
position: relative;
|
||||||
padding-right: 24px;
|
padding-right: 36px;
|
||||||
transition: all @transition-time @ease-in-out;
|
transition: all @transition-time @ease-in-out;
|
||||||
|
|
||||||
i{
|
i{
|
||||||
|
|
@ -134,7 +134,8 @@
|
||||||
position: absolute;
|
position: absolute;
|
||||||
right: 15px;
|
right: 15px;
|
||||||
top: 50%;
|
top: 50%;
|
||||||
margin-top: -6px;
|
//margin-top: -6px;
|
||||||
|
transform: translateY(-50%);
|
||||||
}
|
}
|
||||||
|
|
||||||
&-active{
|
&-active{
|
||||||
|
|
|
||||||
|
|
@ -19,6 +19,7 @@
|
||||||
border: 1px solid @border-color-base;
|
border: 1px solid @border-color-base;
|
||||||
border-radius: @btn-border-radius;
|
border-radius: @btn-border-radius;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
cursor: default;
|
||||||
|
|
||||||
&-handler-wrap {
|
&-handler-wrap {
|
||||||
width: 22px;
|
width: 22px;
|
||||||
|
|
|
||||||
|
|
@ -160,16 +160,24 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
&-vertical &-submenu-title-icon{
|
&-vertical &-submenu-title-icon{
|
||||||
float: right;
|
// #5592 支持自定义图标 size 后，换一种位置
|
||||||
position: relative;
|
//float: right;
|
||||||
top: 4px;
|
//position: relative;
|
||||||
|
//top: 4px;
|
||||||
|
position: absolute;
|
||||||
|
top: 50%;
|
||||||
|
right: 24px;
|
||||||
|
transform: translateY(-50%);
|
||||||
}
|
}
|
||||||
&-submenu-title-icon {
|
&-submenu-title-icon {
|
||||||
transition: transform @transition-time @ease-in-out;
|
transition: transform @transition-time @ease-in-out;
|
||||||
}
|
}
|
||||||
&-opened > * > &-submenu-title-icon{
|
&-horizontal &-opened > * > &-submenu-title-icon{
|
||||||
transform: rotate(180deg);
|
transform: rotate(180deg);
|
||||||
}
|
}
|
||||||
|
&-vertical &-opened > * > &-submenu-title-icon{
|
||||||
|
transform: translateY(-50%) rotate(180deg);
|
||||||
|
}
|
||||||
|
|
||||||
&-vertical &-submenu{
|
&-vertical &-submenu{
|
||||||
&-nested{
|
&-nested{
|
||||||
|
|
|
||||||
|
|
@ -43,7 +43,7 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.@{select-prefix-cls}-arrow {
|
.@{select-prefix-cls}-arrow {
|
||||||
transform: rotate(180deg);
|
transform: translateY(-50%) rotate(180deg);
|
||||||
display: inline-block;
|
display: inline-block;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
@ -53,7 +53,7 @@
|
||||||
.disabled();
|
.disabled();
|
||||||
|
|
||||||
.@{select-prefix-cls}-arrow {
|
.@{select-prefix-cls}-arrow {
|
||||||
display: none;
|
color: @slider-disabled-color;
|
||||||
}
|
}
|
||||||
|
|
||||||
&:hover {
|
&:hover {
|
||||||
|
|
@ -185,7 +185,7 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
&-multiple &-input{
|
&-multiple &-input{
|
||||||
height: @input-height-base - 3px;
|
height: @input-height-base - 2px;
|
||||||
line-height: @input-height-base;
|
line-height: @input-height-base;
|
||||||
padding: 0 0 0 4px;
|
padding: 0 0 0 4px;
|
||||||
}
|
}
|
||||||
|
|
@ -208,7 +208,7 @@
|
||||||
margin: 3px 4px 3px 0;
|
margin: 3px 4px 3px 0;
|
||||||
max-width: 99%;
|
max-width: 99%;
|
||||||
position: relative;
|
position: relative;
|
||||||
span{
|
span:not(.ivu-select-max-tag){
|
||||||
display: block;
|
display: block;
|
||||||
margin-right: 14px;
|
margin-right: 14px;
|
||||||
overflow: hidden;
|
overflow: hidden;
|
||||||
|
|
@ -256,6 +256,33 @@
|
||||||
& &-dropdown{
|
& &-dropdown{
|
||||||
width: auto;
|
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);
|
.select-item(@select-prefix-cls, @select-item-prefix-cls);
|
||||||
|
|
|
||||||
|
|
@ -7,6 +7,7 @@
|
||||||
border: 1px solid @border-color-base;
|
border: 1px solid @border-color-base;
|
||||||
border-bottom: 0;
|
border-bottom: 0;
|
||||||
border-right: 0;
|
border-right: 0;
|
||||||
|
overflow: hidden; // 开启 max-height 时，没有 overflow: hidden，则底部多出 1px，早期没有 overflow 是因为有些控件没有加 transfer
|
||||||
}
|
}
|
||||||
width: inherit;
|
width: inherit;
|
||||||
height: 100%;
|
height: 100%;
|
||||||
|
|
|
||||||
|
|
@ -203,7 +203,7 @@
|
||||||
&&-card > &-bar &-nav-wrap {
|
&&-card > &-bar &-nav-wrap {
|
||||||
margin-bottom: 0;
|
margin-bottom: 0;
|
||||||
}
|
}
|
||||||
&&-card > &-bar &-tab .@{css-prefix-iconfont}-ios-close {
|
&&-card > &-bar &-tab &-close {
|
||||||
width: 0;
|
width: 0;
|
||||||
height: 22px;
|
height: 22px;
|
||||||
font-size: 22px;
|
font-size: 22px;
|
||||||
|
|
@ -221,8 +221,8 @@
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
&&-card > &-bar &-tab-active .@{css-prefix-iconfont}-ios-close,
|
&&-card > &-bar &-tab-active &-close,
|
||||||
&&-card > &-bar &-tab:hover .@{css-prefix-iconfont}-ios-close {
|
&&-card > &-bar &-tab:hover &-close {
|
||||||
width: 22px;
|
width: 22px;
|
||||||
transform: translateZ(0);
|
transform: translateZ(0);
|
||||||
margin-right: -6px;
|
margin-right: -6px;
|
||||||
|
|
|
||||||
|
|
@ -20,7 +20,7 @@
|
||||||
top: 50%;
|
top: 50%;
|
||||||
right: 8px;
|
right: 8px;
|
||||||
line-height: 1;
|
line-height: 1;
|
||||||
margin-top: -7px;
|
transform: translateY(-50%);
|
||||||
font-size: @font-size-base;
|
font-size: @font-size-base;
|
||||||
color: @subsidiary-color;
|
color: @subsidiary-color;
|
||||||
transition: all @transition-time @ease-in-out;
|
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 可以阻止关闭
|
* 返回 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
|
* @default primary
|
||||||
*/
|
*/
|
||||||
color?: string;
|
color?: string;
|
||||||
|
/**
|
||||||
|
* 自动消失的延时, 默认为800ms
|
||||||
|
* @default 800
|
||||||
|
*/
|
||||||
|
duration?: number;
|
||||||
/**
|
/**
|
||||||
* 失败时的进度条颜色，默认为 iView 主色
|
* 失败时的进度条颜色，默认为 iView 主色
|
||||||
* @default error
|
* @default error
|
||||||
|
|
|
||||||
2
types/time.d.ts
vendored
2
types/time.d.ts
vendored
|
|
@ -2,7 +2,7 @@
|
||||||
// Project: https://github.com/iview/iview
|
// Project: https://github.com/iview/iview
|
||||||
// Definitions by: yangdan
|
// Definitions by: yangdan
|
||||||
// Definitions: https://github.com/yangdan8/iview.git
|
// Definitions: https://github.com/yangdan8/iview.git
|
||||||
import Vue, { VNode } from 'vue';
|
import Vue from 'vue';
|
||||||
|
|
||||||
export declare interface Time extends Vue {
|
export declare interface Time extends Vue {
|
||||||
/**
|
/**
|
||||||
|
|
|
||||||
Loading…
Add table
Reference in a new issue