ProcessManagement.js 12.4 KB
import React, {Component} from 'react';
import {
    View,
    Text,
    ScrollView, TouchableOpacity, Platform, Image
} from "react-native";
import {width} from "../utils/getSize";
import PickerView from "../components/PickerView";
import FiveStarView from "../components/FiveStarView";
import SliderView from "../components/SliderView";
import TextSingleEditView from "../components/TextSingleEditView";
import TextMultiEditView from "../components/TextMultiEditView";
import PhoneEditView from "../components/PhoneEditView";
import NumberEditView from "../components/NumberEditView";
import LocationTextView from "../components/LocationTextView";
import CalculatorView from "../components/CalculatorView";
import TabDetailView from "../components/TabDetailView";
import CheckboxView from "../components/CheckboxView";
import LabelLinkView from "../components/LabelLinkView";
import BooleanCheckView from "../components/BooleanCheckView";
import SelectItemView from "../components/SelectItemView";
import AttachmentUpdateView from "../components/AttachmentUpdateView";
import {isIdCard, isNotANumber, validateResult} from "../utils/utils";
import TagItemView from "../components/TagItemView";
import CascadeView from "../components/CascadeView";

export default class ProcessManagement extends Component {

    constructor(props) {
        super(props);
        this.state = {
            querySwitch: 'Common',
            amount: 0,// 金额
        };
    }

    componentWillMount() {
        //设置头部
        this.props.navigation.setParams({
            isBack: true,
            title: '组件'
        });
    }

    renderDividerView() {
        return (
            <View style={{width: width, height: 5, backgroundColor: 'rgba(245, 245, 245, 1)'}}/>
        )
    }

    onChangeCalculate = (text) => {
        console.log("=--200==-", text);
    }

    onChangeAmount = (amount, type) => {
        if (this.refs.calculate) {
            this.refs.calculate.calculateValue(amount, type)
        }
    }

    render() {
        let singleData = {name: "单行输入", data: '{\"placeholder\": \"test\"}'};
        //console.log("isNumber====", validateResult('99', 12, 2))

        let cascadeData = {placeholder: '请选择',
            dataType: 'STATIC',
            dataContent:[{key:"2983",title:"江苏",children:[{key:"2894",title:"苏州", children:[{key:"2895",title:"虎丘区"}]},
                    {key:"2894",title:"南京", children:[{key:"2895",title:"雨花区"},{key:"2895",title:"玄武区", children:[{key:"2895",title:"看时间"},{key:"2895",title:"景区",
                                children:[{key:"9045",title:"秦淮河"},{label:"9045",title:"夫子庙"}]}]}]}
                ]},
                {key:"5634",title:"中国",children:[{key:"5632",title:"北京", children:[{key:"903",title:"北京"}]},
                        {key:"9045",title:"上海"}, {key:"9045",title:"广州"}]},
            ],
            enableMultiple: false,
            enableFilter: false,
        };

        let cascadeDataJsonStr = JSON.stringify(cascadeData);

        //let calcData = {expression: "数量*金额", showChinese: true}

        let calcData = {placeholder: '计算结果', expression: 'NUMBER*MONEY', showChinese:true};

        let tableData = {
            placeholder: '请添加', buttonText: '添加', type: 'table',
            tabDataList: [
                [{name: '日期', type: 'DATE', isRequired: true, data: '{}', value: '01-15'},
                 {name: '数量', type: 'NUMBER', isRequired: true, data: '{\"placeholder\": \"请输入\"}', value: '3'},
                 {name: '金额', type: 'MONEY', isRequired: true, data: '{\"placeholder\": \"请输入\"}', value: '5'},
                 {name: '计算公式', type: 'CALCULATOR', isRequired: true, data: JSON.stringify(calcData), value: '{\"expression\":\"dd\", \"result\":\"15\"}'}
                ],
                [{name: '日期', type: 'DATE', isRequired: true, data: '{}', value: '01-18'},
                    {name: '数量', type: 'NUMBER', isRequired: true, data: '{\"placeholder\": \"请输入\"}', value: '9'},
                    {name: '金额', type: 'MONEY', isRequired: true, data: '{\"placeholder\": \"请输入\"}', value: '34'},
                    {name: '计算公式', type: 'CALCULATOR', isRequired: true, data: JSON.stringify(calcData), value: '{\"expression\":\"dd\", \"result\":\"45\"}'}
                ],
            ]
        };

        return (
            <View style={{flex: 1, backgroundColor: 'white'}}>
                <ScrollView
                    horizontal={false}
                >
                    <CascadeView
                        attrData={{name: "级联选择", isRequired: true, type: 'CASCADE', data:cascadeDataJsonStr}}
                    />
                    {this.renderDividerView()}
                    <TabDetailView
                        navigation={this.props.navigation}
                        attrData={{name: "数量", type: 'TABLE', data:JSON.stringify(tableData)}}
                    />
                    {this.renderDividerView()}
                    <PickerView
                        attrData={{name: "日期", type: 'DATE', data:'{\"placeholder\": \"请选择\", \"dateFormat\":\"yyyy-MM\"}'}}
                    />
                    {/*<NumberEditView
                        attrData={{name: "数量", type: 'count', data:'{\"placeholder\": \"请输入\"}'}}
                        onChangeText={this.onChangeAmount}
                    />
                    {this.renderDividerView()}
                    <NumberEditView
                        attrData={{name: "金额(元)", type: 'money', data:'{\"placeholder\": \"请输入\"}'}}
                        onChangeText={this.onChangeAmount}
                    />
                    <CalculatorView
                        ref={'calculate'}
                        attrData={{name: "计算公式", data:JSON.stringify(calcData)}}
                        editable={false}
                        onChangeText={this.onChangeCalculate}
                    />*/}
                    {/*<SelectItemView
                            modalTitle={'经营单元选择'}
                            attrData={{name: "经营单元", type: 'OPERATING_UNIT', data:'{\"placeholder\": \"请选择经营单元\", \"isActive\" : true}'}}
                        />
                        <SelectItemView
                            modalTitle={'岗位选择'}
                            attrData={{name: "岗位", type: 'POSITION', data:'{\"placeholder\": \"请选择合适的岗位\"}'}}
                        />
                        {this.renderDividerView()}
                        <AttachmentUpdateView
                            attrData={{name: "附件", type: 'ATTACHMENT', data:'{\"placeholder\": \"请选择\"}'}}
                        />
                        {this.renderDividerView()}
                        <SelectItemView
                            modalTitle={'部门选择'}
                            attrData={{name: "部门", type: 'ORGANIZATION', data:'{\"placeholder\": \"请注意填写格式\", \"multipleSelect\" : true}'}}
                        />
                        {this.renderDividerView()}
                        <BooleanCheckView
                            attrData={{name: "测试是否", type: 'BOOLEAN', data:'{\"booleanDefault\": true}'}}
                        />
                        {this.renderDividerView()}
                        <CheckboxView
                            attrData={{name: "单选框", type: 'SELECT', data:'{\"placeholder\": \"请选择\",\"options\":[{\"value\":\"标准采购订单\",\"checked\":true},{\"value\":\"内部采购订单\",\"checked\":false}]}'}}
                        />
                        <CheckboxView
                            attrData={{name: "多选框", type: 'CHECKBOX', data:'{\"placeholder\": \"请选择\", \"options\":[{\"value\":\"标准采购订单\",\"checked\":true},{\"value\":\"内部采购订单\",\"checked\":false}]}'}}
                        />
                        {this.renderDividerView()}*/}
                    {/*<PickerView
                            attrData={{name: "日期", type: 'DATE', data:'{\"placeholder\": \"请选择\", \"dateFormat\":\"yyyy-MM-dd HH:mm\"}'}}
                        />
                        {this.renderDividerView()}
                        <PickerView
                            attrData={{name: "日期区间", type: 'PERIOD', data:'{\"beginPlaceholder\": \"请选择请假开始日期\", \"endPlaceholder\": \"请选择请假结束日期\", \"dateFormat\":\"yyyy-MM-dd HH:mm:ss\"}'}}
                        />
                        {this.renderDividerView()}
                        <PickerView
                            attrData={{name: "省市区", type: 'CITY', data:'{\"placeholder\": \"请选择\"}'}}
                        />*/}
                    {this.renderDividerView()}
                        <FiveStarView
                            attrData={{name: "评分", data:'{\"placeholder\": \"请选择请\", \"default\": 5}'}}
                        />
                    {/*{this.renderDividerView()}
                        <SliderView
                            attrData={{name: "滑块", data:'{\"step\":2}'}}
                        />
                        {this.renderDividerView()}
                        <NumberEditView
                            attrData={{name: "数字输入", data:'{\"placeholder\": \"请输入\"}', uom: '小时'}}
                            //onChangeText={this.onChangeAmount}
                        />
                        {this.renderDividerView()}
                        <NumberEditView
                            attrData={{name: "身份证", data:'{\"placeholder\": \"请输入\"}'}}
                            inputType={'default'}
                            //onChangeText={this.onChangeAmount}
                        />
                        {this.renderDividerView()}
                        <NumberEditView
                            attrData={{name: "金额(元)", data:'{\"placeholder\": \"请输入\"}'}}
                            onChangeText={this.onChangeAmount}
                        />
                        {this.renderDividerView()}
                        <CalculatorView
                            ref={'calculate'}
                            attrData={{name: "计算公式", data:'{\"placeholder\": \"test\"}'}}
                            editable={false}
                            onChangeText={this.onChangeCalculate}
                        />
                        {this.renderDividerView()}
                        <TextSingleEditView
                            attrData={singleData}
                            onChangeText={(text)=>{
                                singleData.value = text
                            }}
                        />
                        {this.renderDividerView()}
                        <PhoneEditView
                            attrData={{name: "电话", data:'{\"placeholder\": \"test\"}'}}
                        />
                        {this.renderDividerView()}
                        <TextMultiEditView
                            attrData={{name: "多行输入", data:'{\"placeholder\": \"test\"}'}}
                        />*/}
                    {/*{this.renderDividerView()}
                        <LocationTextView
                            attrData={{}}
                        />*/}
                    {/*{this.renderDividerView()}
                        <TabDetailView
                            attrData={{data:'{\"placeholder\": \"test\", \"buttonText\": \"添加\"}'}}
                        />
                        {this.renderDividerView()}*/}
                    {/*<LabelLinkView
                        navigation={this.props.navigation}
                        attrData={{data: '{\"placeholder\": \"请注意填写格式\", \"hyperlink\":\"https://www.baidu.com\"}'}}
                    />
                    {this.renderDividerView()}
                    <TagItemView
                        attrData={{
                            name: '标签',
                            labelName: '一般',
                            labelColor: 'rgba(255, 87, 51, 1)',
                            data: '{\"placeholder\": \"请注意填写格式\", \"hyperlink\":\"https://www.baidu.com\"}'
                        }}
                        navigation={this.props.navigation}
                    />*/}
                </ScrollView>
            </View>
        );
    }
}