theluyuan/xm-select
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

调整样式

Browse Source
This commit is contained in:
maplemei 2019-11-11 11:54:51 +08:00
parent b8c1eff607
commit e02db53b89
15 changed files with 114 additions and 51 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
dist/index.html vendored
View File

@ -1 +1,7 @@
<!DOCTYPE html><html><head><link rel="preload" href="./xm-select.js" as="script"><link rel="preload" href="./static/docs.js" as="script"><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"><title>xm-select</title><link rel="stylesheet" href="https://www.layuicdn.com/layui-v2.5.5/css/layui.css"><script src="https://www.layuicdn.com/layui-v2.5.5/layui.all.js"></script><script src="https://unpkg.com/axios/dist/axios.min.js"></script></head><body><div id="app"></div><script type="text/javascript" src="./xm-select.js"></script><script type="text/javascript" src="./static/docs.js"></script></body></html> <!DOCTYPE html><html><head><script>var _hmt = _hmt || [];
(function() {
var hm = document.createElement("script");
hm.src = "https://hm.baidu.com/hm.js?758a90d7d534804ddd66137da7c9ee69";
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(hm, s);
})();</script><link rel="preload" href="./xm-select.js" as="script"><link rel="preload" href="./static/docs.js" as="script"><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"><title>xm-select</title><link rel="stylesheet" href="https://www.layuicdn.com/layui-v2.5.5/css/layui.css"><script src="https://www.layuicdn.com/layui-v2.5.5/layui.all.js"></script><script src="https://unpkg.com/axios/dist/axios.min.js"></script></head><body><div id="app"></div><script type="text/javascript" src="./xm-select.js"></script><script type="text/javascript" src="./static/docs.js"></script></body></html>

2
dist/static/2.js vendored
View File

File diff suppressed because one or more lines are too long

2
dist/static/3.js vendored
View File

File diff suppressed because one or more lines are too long

8
dist/static/docs.js vendored
View File

File diff suppressed because one or more lines are too long

2
dist/xm-select.js vendored
View File

File diff suppressed because one or more lines are too long

6
docs/entry.js
View File

@ -22,6 +22,12 @@ const router = new VueRouter({
routes routes
}); });
router.beforeEach((to, from, next) => {
if (to.path) {
_hmt.push(['_trackPageview', to.fullPath]);
}
next();
});
router.afterEach(route => { router.afterEach(route => {
Vue.nextTick(() => { Vue.nextTick(() => {

9
docs/index.ejs
View File

@ -1,6 +1,15 @@
<!DOCTYPE html> <!DOCTYPE html>
<html> <html>
<head> <head>
<script>
var _hmt = _hmt || [];
(function() {
var hm = document.createElement("script");
hm.src = "https://hm.baidu.com/hm.js?758a90d7d534804ddd66137da7c9ee69";
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(hm, s);
})();
</script>
<% for (var chunk in htmlWebpackPlugin.files.css) { %> <% for (var chunk in htmlWebpackPlugin.files.css) { %>
<link rel="preload" href="<%= htmlWebpackPlugin.files.css[chunk] %>" as="style"> <link rel="preload" href="<%= htmlWebpackPlugin.files.css[chunk] %>" as="style">
<% } %> <% } %>

43
docs/mds/ZP02.md
View File

@ -24,37 +24,18 @@ var demo1 = xmSelect.render({
var ele = layui.eleTree.render({ var ele = layui.eleTree.render({
elem: '#ele1', elem: '#ele1',
data: [ data: [
{ { id: 1, label: "安徽省", children: [
id: 1, { id: 2, label: "马鞍山市", disabled: true, children: [
label: "安徽省", { id: 3, label: "和县" },
children: [ { id: 4, label: "花山区" }
{ ]}
id: 2, ]},
label: "马鞍山市", { id: 5, label: "河南省", children: [
disabled: true, { id: 6, label: "郑州市" },
children: [ { id: 7, label: "开封市" },
{ { id: 8, label: "焦作市" },
id: 3, { id: 9, label: "洛阳市" },
label: "和县", ]}
},
{
id: 4,
label: "花山区",
}
]
}
]
},
{
id: 5,
label: "河南省",
children: [
{
id: 6,
label: "郑州市"
}
]
}
], ],
showCheckbox: true, showCheckbox: true,
defaultExpandAll: true, defaultExpandAll: true,

65
docs/mds/ZP03.md Normal file
View File

@ -0,0 +1,65 @@
## 下拉树
### layuiTree
结合 `layui` 的 `tree`, <a href='https://www.layui.com/doc/modules/tree.html' target='_blank'>传送门</a>
:::demo
```html
<div id="demo1" class="xm-select-demo"></div>
<script>
var data = [
{ id: 1, title: "安徽省", children: [
{ id: 2, title: "马鞍山市", disabled: true, children: [
{ id: 3, title: "和县" },
{ id: 4, title: "花山区" }
]}
]},
{ id: 5, title: "河南省", children: [
{ id: 6, title: "郑州市" },
{ id: 7, title: "开封市" },
{ id: 8, title: "焦作市" },
{ id: 9, title: "洛阳市" },
]}
]
//先渲染多选
var demo1 = xmSelect.render({
el: '#demo1',
theme: {
color: '#5FB878',
},
content: '<div id="layuiTree"></div>',
data: data,
prop: {
name: 'title',
value: 'id',
}
})
//渲染自定义内容
var ele = layui.tree.render({
id: 'demoId',
elem: '#layuiTree',
data: data,
showCheckbox: true,
oncheck: function(obj){
var checkData = layui.tree.getChecked('demoId');
}
});
//监听下拉多选的选择
demo1.update({
on({ arr, change, isAdd }){
if(isAdd === false){//监听取消
ele.setChecked(arr.map(item => item.id), true);
}
},
});
</script>
```
:::

7
docs/plugins/baidu/statistical.js
View File

@ -1,7 +0,0 @@
var _hmt = _hmt || [];
(function() {
var hm = document.createElement("script");
hm.src = "https://hm.baidu.com/hm.js?758a90d7d534804ddd66137da7c9ee69";
var s = document.getElementsByTagName("script")[0];
s.parentNode.insertBefore(hm, s);
})();

1
docs/plugins/index.js
View File

@ -1,3 +1,2 @@
import './baidu/statistical.js'
import './eleTree/eleTree.js' import './eleTree/eleTree.js'
import './eleTree/eleTree.css' import './eleTree/eleTree.css'

3
docs/router.js
View File

@ -97,7 +97,8 @@ export default [{
component: Component, component: Component,
children: [ children: [
{ path: '/example-plugin/ZP01', name: '下拉自定义', component: importMd('/ZP01') }, { path: '/example-plugin/ZP01', name: '下拉自定义', component: importMd('/ZP01') },
{ path: '/example-plugin/ZP02', name: '下拉树', component: importMd('/ZP02') }, { path: '/example-plugin/ZP02', name: '下拉树 EleTree', component: importMd('/ZP02') },
// { path: '/example-plugin/ZP03', name: '下拉树 LayuiTree', component: importMd('/ZP03') },
] ]
}, { }, {
path: '/question', path: '/question',

2
src/components/element/framework.js
View File

@ -269,7 +269,7 @@ class Framework extends Component{
<Label { ...labelProps } /> <Label { ...labelProps } />
<div class={ bodyClass } ref={ ref => this.bodyView = ref}> <div class={ bodyClass } ref={ ref => this.bodyView = ref}>
{ config.content ? ( { config.content ? (
<Custom content={ config.content } /> <Custom content={ config.content } height={ config.height } />
) : ( ) : (
<General { ...bodyProps } /> <General { ...bodyProps } />
) } ) }

6
src/components/element/model/custom.js
View File

@ -20,8 +20,10 @@ class Custom extends Component{
render(config) { render(config) {
this.prepare = true; this.prepare = true;
return ( return (
<div onClick={ this.blockClick } class="xm-body-custom" dangerouslySetInnerHTML={{ __html: config.content }}> <div onClick={ this.blockClick } class="xm-body-custom" >
<div class="scroll-body" style={ {maxHeight: config.height} }>
<div style="margin: 5px 0" dangerouslySetInnerHTML={{ __html: config.content }}></div>
</div>
</div> </div>
) )
} }

1
src/style/index.less
View File

@ -163,6 +163,7 @@ xm-select{
padding: 5px 0; padding: 5px 0;
z-index: 999; z-index: 999;
width: 100%; width: 100%;
min-width: fit-content;
border: @border; border: @border;
// max-height: 300px; // max-height: 300px;
// overflow-y: auto; // overflow-y: auto;