70 lines
2.5 KiB
JavaScript
70 lines
2.5 KiB
JavaScript
/*
|
||
* Author: 黎永顺
|
||
* name: 启用设置
|
||
* Description:
|
||
* Date: 2023/7/19
|
||
*/
|
||
import React, { Component } from "react";
|
||
import { Button, Col, Row } from "antd";
|
||
import TipLabel from "../../../components/TipLabel";
|
||
import { WeaCheckbox, WeaFormItem, WeaInput, WeaLocaleProvider, WeaSearchGroup } from "ecCom";
|
||
import "./index.less";
|
||
|
||
const getLabel = WeaLocaleProvider.getLabel;
|
||
|
||
class EnableSettings extends Component {
|
||
render() {
|
||
const tipList = [
|
||
getLabel(111, "1、智能算薪默认是开启的，若购买了智能算薪，请先配置账号密码，在购买的流量足够的前提下即可正常使用；"),
|
||
getLabel(111, "2、您可在【接口流量统计】中查看接口流量使用情况；"),
|
||
getLabel(111, "3、您可以设置【流量不足提醒】，提前提醒可以避免次月要用时因流量不足无法使用的情况。"),
|
||
getLabel(111, "4、如您需了解您购买的流量的使用明细，可查看【流量使用记录】；")
|
||
];
|
||
const Input = label => {
|
||
return (
|
||
<WeaFormItem label={label} labelCol={{ span: 4 }} wrapperCol={{ span: 18 }}>
|
||
<WeaInput/>
|
||
</WeaFormItem>
|
||
);
|
||
};
|
||
const InputPassword = label => {
|
||
return (
|
||
<WeaFormItem label={label} labelCol={{ span: 4 }} wrapperCol={{ span: 18 }}>
|
||
<WeaInput type="password"/>
|
||
</WeaFormItem>
|
||
);
|
||
};
|
||
return (
|
||
<Row className="enable-settings" gutter={16}>
|
||
<Col span={16}>
|
||
<div className="swith-area">
|
||
<div className="left">
|
||
<div className="title">{getLabel(111, "智能算薪")}</div>
|
||
<div
|
||
className="info">{getLabel(111, "开启智能算薪并输入正确的账号密码，且购买了智能算薪流量，才能正常使用智能算薪功能。")}</div>
|
||
</div>
|
||
<div className="right"><WeaCheckbox display="switch"/></div>
|
||
</div>
|
||
<div className="userinfo">
|
||
<div className="left">
|
||
<WeaSearchGroup
|
||
showGroup needTigger={false} col={3}
|
||
items={[
|
||
{ com: Input(getLabel(111, "账号")) },
|
||
{ com: InputPassword(getLabel(111, "密码")) }
|
||
]}
|
||
/>
|
||
</div>
|
||
<div className="right"><Button type="primary">{getLabel(111, "提交")}</Button></div>
|
||
</div>
|
||
</Col>
|
||
<Col span={8}>
|
||
<TipLabel tipList={tipList}/>
|
||
</Col>
|
||
</Row>
|
||
);
|
||
}
|
||
}
|
||
|
||
export default EnableSettings;
|