fmui-base 2.1.83 → 2.1.85

package/lib/poppage/treetable/treetable.jsx

@@ -0,0 +1,340 @@
+import React from 'react';
+
+import Boxs from 'saltui/lib/Boxs';
+import SearchBar from 'saltui/lib/SearchBar';
+import Button from 'saltui/lib/Button';
+import Popup from 'saltui/lib/Popup';
+
+const { HBox, Box,} = Boxs;
+
+import './treetable.less';
+
+
+
+export default class Page extends React.Component {
+  constructor(props) {
+    super(props);
+
+    var u = navigator.userAgent;
+    var isAndroid = u.indexOf('Android') > -1 || u.indexOf('Adr') > -1; //android终端
+    var isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
+    var height='';
+    if(isAndroid==true){
+        height = window.screen.height-70-44-45+"px";
+    }else if(isiOS==true){
+        height = window.screen.availHeight-70-44-45+"px";
+    }else {
+        if(window.screen.availHeight) {
+            height = '550px';
+        }
+    }
+
+    this.state = {
+      all:0,
+      height:height,
+      visible:false,
+
+      todoList:[ {
+        "checked":false,
+        "name":"一级11111111111111111111111",
+        "show":true,
+        "id":0,
+        "showSubList":false,
+        "checkedAll":false,
+        "todo":[
+        {
+          "name":"二级1111111111",
+          "show":true,
+          "id":1,
+          "pId":0,
+          "showSubList":false,
+          "checked":false,
+          "todo":[
+                {
+                  "name":"三级1111111111",
+                  "show":true,
+                  "id":2,
+                  "pId":1,
+                  "checked":false,
+                },
+                {
+                  "name":"三级22222",
+                  "show":true,
+                  "id":3,
+                  "pId":1,
+                  "checked":false,
+                },        
+          ]
+        },
+        {
+          "name":"二级222222222222222",
+          "show":true,
+          "id":2,
+          "pId":0,
+          "showSubList":false,
+          "checked":false,
+          "todo":[
+                {
+                  "name":"三级1111111111",
+                  "show":true,
+                  "id":3,
+                  "pId":2,
+                  "checked":false,
+                },
+                {
+                  "name":"三级22222",
+                  "show":true,
+                  "id":4,
+                  "pId":2,
+                  "checked":false,
+                },        
+          ]
+        }
+        ]
+      }
+     ],
+    };
+  }
+
+  componentDidMount (){
+  }
+
+  // 子组件初始化
+  initState() {
+    let t = this;
+    // 控制弹出
+    let visible = t.props.visible;
+
+    t.setState({
+        visible:visible,
+    });
+  }
+
+  //点击当前，子栏目全选是否取消
+  abc(sublist,list){
+    if (sublist != null && sublist.length > 0) {
+      for (var i = 0; i < sublist.length; i++) {
+        var obj = sublist[i];
+        if(list.checked == true){
+          obj.checked = true;
+        }else{
+          obj.checked = false;
+        }      
+        var todo = obj.todo;
+        this.abc(todo,obj);
+      }
+    }
+    return list;
+  }
+
+  //点击当前，父级栏目全选是否取消
+  mml(plist,id,list){
+   
+      var n = 0;
+      for ( var k = 0; k < list.length; k++){
+        if(list[k].checked == true){
+          n = n + 1;
+        }      
+      }
+      if (plist != null && plist.length > 0) {
+        for (var i = 0; i < plist.length; i++) {
+          var obj = plist[i];
+          if(obj.id == id){
+            if(obj.todo.length == n){
+              obj.checked = true;
+            }else{
+              obj.checked = false;
+            }
+          };
+          this.mml(obj.todo,list[i].pId,list)
+        }
+      }
+
+   // return plist;
+   
+  }
+
+  bindCheck1(i,e){
+    var todoList=this.state.todoList;
+    todoList[i].checked=!todoList[i].checked;
+    this.abc(todoList[i].todo,todoList[i]);
+
+    this.setState({
+      todoList:todoList,
+    })
+  }
+
+  bindCheck2(i,j,e){
+    var todoList=this.state.todoList;
+    j[i].checked=!j[i].checked;
+
+    this.abc(j[i].todo,j[i]);
+    var id = j[i].pId;
+    this.mml(todoList,id,j);
+
+    this.setState({
+      todoList:todoList,
+    })
+  }
+
+  showSubList1(i,e){ 
+    var todoList=this.state.todoList;
+    todoList[i].showSubList=!todoList[i].showSubList;
+
+    this.setState({
+      todoList:todoList,
+    })
+  }
+
+  showSubList2(i,j,e){ 
+  
+    j[i].showSubList=!j[i].showSubList;
+  
+    this.setState({
+      todoList:this.state.todoList,
+    })
+  }
+
+  // 点击蒙层关闭
+  closMask(){
+    this.props.closMask(this);
+  }
+
+  // 获取选择结构
+  getContent(){
+
+  }
+
+  render() {
+    const t = this;
+     const props = {
+      locale: 'zh_CN',
+      instantSearch: true,
+      hasHistory: true,
+      searchDelay: 450,
+      onEnter: () => { console.log('enter'); },
+      onExit: () => { console.log('exit'); },
+      onChange: (value) => {
+        console.log(`Typing>>${value}`);
+      },
+      onSearch: (value) => {
+        console.info(`Do search>>${value}`);
+        if (t.refs.list) {
+          t.refs.list.fetchData({
+            keyword: value,
+          });
+        }
+      },
+    };
+
+    return (
+
+      <div >
+        <Popup
+          content={
+              <div className="t-BCf"  style={{width:300}}>
+                <SearchBar {...props} />
+                <div className={this.state.checkedAll?"t-PL16 t-PR16 t-PT10 t-PB10 dd-top-border ":"t-PL16 t-PR16 t-PT10 t-PB10 un-checked dd-top-border"}>
+                    <HBox vAlign="center">
+                      <HBox>
+                        <div className='t-checkbox-field-icon-list' >
+                          <i className="iconfont icon-checked t-FCf t-FS14"></i>
+                        </div>
+                      </HBox>
+                      <Box flex={1} className="t-ML10">
+                          全选
+                      </Box>
+                    </HBox>
+                </div>
+                <div className="t-H10 t-BCf7"></div>
+                
+                {
+                  this.state.todoList.map(function(item,i){
+                    return(
+                      <div>
+                        <HBox vAlign="center" className="dd-top-border ">
+                         
+                          <Box className="t-PT12 t-PB12 t-PL16 t-PR6"><i className="iconfont icon-personnelregister t-FCd t-FS20"></i></Box>
+                          <HBox flex={1} onClick={this.showSubList1.bind(this,i)}>
+                            <Box flex={1} className="t-FS16 t-PL4 t-PR10 t-omit t-WB">{item.name}</Box>
+                            <Box className="t-PR16"><i className={item.showSubList?"iconfont icon-arrow-up t-rotate-180 t-FCc":"iconfont icon-arrow-up t-rotate-90 t-FCc"}></i></Box>
+                          </HBox>
+                          
+                        </HBox>
+                        <div className={item.showSubList?"":"t-DN"}>
+                        {
+                          item.todo.map(function(subItem,j,i){
+                            return(
+                              <div className="dd-top-border" >
+                                <HBox vAlign="center">
+                                  
+                                  <Box className="t-PT12 t-PB12 t-PL16 t-PR6"><i className="iconfont icon-personnelregister t-FCd t-FS20"></i></Box>
+                                  <HBox flex={1} onClick={this.showSubList2.bind(this,j,i)}>
+                                    <Box flex={1} className="t-FS16 t-PL4 t-PR10 t-omit t-WB">{subItem.name}</Box>
+                                    <Box className="t-PR16"><i className={subItem.showSubList?"iconfont icon-arrow-up t-rotate-180 t-FCc":"iconfont icon-arrow-up t-rotate-90 t-FCc"}></i></Box>
+                                  </HBox>
+                                </HBox>
+                                <div className={subItem.showSubList?"":"t-DN"}>
+                                    {
+                                      subItem.todo.map(function(subItem2,j,i){
+                                        return(
+                                          <div className="dd-top-border" onClick={this.bindCheck2.bind(this,j,i)}>
+                                            <HBox vAlign="center">
+                                              <Box className="t-PL16">
+                                                <div className={subItem2.checked?"t-checkbox-field-icon-list":"un-checked t-checkbox-field-icon-list"} >
+                                                  <i className="iconfont icon-checked t-FCf t-FS14"></i>
+                                                </div>
+                                              </Box>
+                                              <Box className="t-PT12 t-PB12 t-PL10 t-PR6"><i className="iconfont icon-personnelregister t-FCd t-FS20"></i></Box>
+                                              <Box flex={1} className="t-FS16 t-PL4 t-PR10 t-omit">{subItem2.name}</Box>
+                                      
+                                            </HBox>
+                                    
+                                          </div>
+                                        )
+                                      }.bind(this))
+                                    }
+                                        
+                                    </div>
+                         
+                              </div>
+                            )
+                          }.bind(this))
+                        }
+                            
+                        </div>
+                      </div>
+                      )
+                   
+                  }.bind(this))
+                }
+
+                <HBox vAlign="center" className="t-bottom-fixed t-P16 t-PT10 t-PB10">
+                  <Box flex={1} >
+                    
+                  </Box>
+                  <Box className="t-MR4">
+                    <Button type="secondary" size="small" display="inline">取消</Button>
+                  </Box>
+                  <Box>
+                    <Button type="primary" size="small" display="inline">确定</Button>
+                  </Box>
+                </HBox>
+                
+              </div>
+           
+
+             }
+          animationType="slide-left"
+          onMaskClick={() => { this.setState({ visible: false });this.closMask(); }}
+          visible={this.state.visible}
+        >
+          {null}
+        </Popup>
+     </div>
+        
+    );
+  }
+}
+
+

package/lib/positioning/positioning.jsx

@@ -0,0 +1,92 @@
+import React from 'react';
+
+import TextField from 'saltui/lib/TextField';
+const { RightAddon } = TextField;
+import AngleRight from 'salt-icon/lib/AngleRight';
+
+export default class PageHome extends React.Component {
+
+  constructor(props) {
+    super(props);
+    var label = props.label;
+    if(!label){
+      label = '';
+    }
+    this.state = {
+    };
+  }
+
+  componentDidMount() {
+    let t = this;
+  }
+
+  //点击
+  click(){
+    let t = this;
+    var value = this.props.value;
+    if(t.props.readOnly){//只读
+      var canShowLocate = this.props.canShowLocate;
+      if(canShowLocate == null || canShowLocate == undefined || (typeof(canShowLocate) !== 'boolean' && canShowLocate == '')){
+        canShowLocate = true;
+      }else{
+        canShowLocate = canShowLocate;
+      }
+      if(value && canShowLocate){
+        if(value.latitude && value.longitude){
+          showLocate(value);
+        }
+      }
+      
+    }else{
+      if(value){
+        if(value.latitude && value.longitude){
+          getLocate(value,function(result){
+            var name = result.province+result.city+result.adName+result.snippet+result.title;
+            var returnData = {'name':name,'latitude':result.latitude,'longitude':result.longitude};
+            t.props.onChange(returnData);
+          });
+        }else{
+          getLocate(null,function(result){
+            var name = result.province+result.city+result.adName+result.snippet+result.title;
+            var returnData = {'name':name,'latitude':result.latitude,'longitude':result.longitude};
+            t.props.onChange(returnData);
+          });
+        }
+      }else{
+        getLocate(null,function(result){
+          var name = result.province+result.city+result.adName+result.snippet+result.title;
+          var returnData = {'name':name,'latitude':result.latitude,'longitude':result.longitude};
+          t.props.onChange(returnData);
+        });
+      }
+     
+    }
+  }
+
+  //初始化ids
+  initData(){
+  }
+
+  //加载文件列表
+
+  render() {
+    const t = this;
+    return (
+      <div className="" onClick={this.click.bind(this)}>
+        <TextField
+            required={t.props.required}
+            readOnly={true}
+            label={t.props.label}
+            placeholder={t.props.readOnly?'':t.props.placeholder}
+            value={t.props.value == null || t.props.value == undefined ?'':t.props.value.name}
+          >
+            <RightAddon>
+              <AngleRight width={20} height={20} fill="#ccc" className={t.props.readOnly?'t-DN':'demo-t-list-arrow'} />
+            </RightAddon>
+        </TextField>
+      </div>
+
+    );
+  }
+}
+