Skip to content

J
jinfa-platform
Commit c1314d42 authored by tjy's avatar tjy
Browse files
Options

调整页面,新增会员维护

parent d9900e69
Expand all Show whitespace changes
Inline Side-by-side
Showing with 412 additions and 133 deletions
src/global/styles/global.less
View file @ c1314d42
/********************************** 布局 ******************************************/
@import './mixins/layout.less';
@makeCenters: text, block, flex, flexAlign, flexJustify, absolute, fixed, margin;
@makeCenters : text,
block,
flex,
flexAlign,
flexJustify,
absolute,
fixed,
margin;
@makeCentersLen: length(@makeCenters);
.loopCenter(@list, @i: 1, @val: extract(@list, @i)) when (@i < @makeCentersLen + 1) {
.center-@{val} {
.make-center(@val);
}
.loopCenter(@list, @i + 1)
};
}
;
.loopCenter(@makeCenters);
// antd default
h1, h2, h3, h4, h5, h6 {
h1,
h2,
h3,
h4,
h5,
h6 {
color: #6B778C;
}
.@{prefix}-margin_content {
.center-margin;
width: 1190px;
......@@ -30,19 +45,20 @@ h1, h2, h3, h4, h5, h6 {
// 公共的title伪类竖线
.commonPanelTitle {
padding-left: 8px;
position: relative;
position : relative;
&::before {
content: "";
display: inline-block;
position: absolute;
left: 0;
top: 50%;
margin-top: -.42667rem;
width: 2px;
height: .85333rem;
content : "";
display : inline-block;
position : absolute;
left : 0;
top : 50%;
margin-top : -.42667rem;
width : 2px;
height : .85333rem;
background-color: @primary-color;
box-shadow: 0 0.14933rem 0.256rem 0 rgba(97,144,232,.2);
border-radius: 1px;
box-shadow : 0 0.14933rem 0.256rem 0 rgba(97, 144, 232, .2);
border-radius : 1px;
}
}
......@@ -50,49 +66,63 @@ h1, h2, h3, h4, h5, h6 {
.commonShowBlock {
display: block;
}
.commonShow {
display: inline-block;
}
.commonHide {
display: none;
}
// 公共着色 主体颜色
.commonPickColor{
.commonPickColor {
color: @main-color;
}
// 公共状态 圆点
.commonStatus {
display: inline-block;
width:8px;
height:8px;
margin-right: 6px;
border-radius: 50%;
display : inline-block;
width : 8px;
height : 8px;
margin-right : 6px;
border-radius : 50%;
vertical-align: middle;
}
.commonStatusStop{
.commonStatusStop {
.commonStatus();
background-color: @status-stop; // 停用
}
.commonStatusModify{
.commonStatusModify {
.commonStatus();
background-color: @status-modify; // 已修改
}
.commonStatusValid{
.commonStatusValid {
.commonStatus();
background-color: @status-valid; // 已生成，有效、审核通过
}
.commonStatusInvalid {
.commonStatus();
background-color: @status-valid; // 有效、已生成
background-color: @status-invalid; // 未生成，无效、待审核
}
.commonStatusInvalid{
.commonStatusNoPass {
.commonStatus();
background-color: @status-invalid; // 无效、未生成
background-color: @status-nopass; // 审核不通过
}
.mb-30{
.mb-30 {
margin-bottom: 30px;
}
.sc-fzpans {
display: block;
width: 100%;
width : 100%;
}
......
src/global/styles/theme.less
View file @ c1314d42
......@@ -4,7 +4,7 @@
@prefix: lingxi-business;
// layout
@header-nav-height: 64px;
@header-nav-height : 64px;
@layout-min-content-height: 100vh;
/**
......@@ -18,12 +18,13 @@
// layout
@header-global-nav-bg: #38414A;
@menu-select-color: rgba(0, 0, 0, 0.85);
@menu-select-bg: rgba(0,0,0,.02);
@menu-circle-color: #D8DEE4;
@menu-select-color : rgba(0, 0, 0, 0.85);
@menu-select-bg : rgba(0, 0, 0, .02);
@menu-circle-color : #D8DEE4;
// status circle color
@status-stop: #C1C7D0; // 停用
@status-modify: #669EDE; //已修改
@status-valid: #41CC9E; // 已生成，有效
@status-invalid: #FFC400; // 未生成，无效
\ No newline at end of file
@status-stop : #C1C7D0; // 停用
@status-modify : #669EDE; // 已修改、待提交
@status-valid : #41CC9E; // 已生成，有效、审核通过
@status-invalid: #FFC400; // 未生成，无效、待审核
@status-nopass: #EF6260; // 审核不通过
\ No newline at end of file
src/layouts/BasicLayout.tsx
View file @ c1314d42
......@@ -73,7 +73,6 @@ const BasicLayout: React.FC<BasicLayoutProps> = (props) => {
const menuData = basicInfo.menuData ? basicInfo.menuData.filter(item => !item.redirect) : []
const menuRouter = getMenuRouter(menuData, location.pathname)
console.log(menuData)
useEffect(() => {
if (menuRouter && menuRouter.children) {
......
src/pages/member/memberImport/addMember.tsx
View file @ c1314d42
This diff is collapsed.
src/pages/member/memberImport/index.less
View file @ c1314d42
.nameCell {
.col {
margin-bottom: 16px;
&:nth-last-of-type(1) {
text-align: right;
}
}
.select {
width : 160px;
margin : 0 0 16px 16px;
text-align: left;
&:nth-of-type(1) {
margin-left: 0;
}
}
.nameCell {
text-align: left;
.nameCellTitle {
color : @main-color;
cursor: pointer;
}
.levelIcon1 {
width : 100%;
height : 16px;
......@@ -24,13 +46,13 @@
background-size: 54px 16px;
margin-top : 8px;
}
}
}
.importBtn {
.importBtn {
margin: 0 16px;
}
}
.headerTop {
.headerTop {
display : flex;
align-items: center;
......@@ -45,9 +67,37 @@
margin-left: 16px;
}
}
}
}
.saveBtn {
.saveBtn {
color : #fff;
background: @main-color
}
\ No newline at end of file
}
.address {
display: flex;
&-addition {
display : inline-block;
width : 32px;
height : 32px;
text-align : center;
margin-left : 24px;
border : 1px solid #EBFBFC;
border-radius: 2px;
cursor : pointer;
overflow : hidden;
&:hover {
background-color: #00B37A;
border : 0;
color : #fff;
}
&-icon {
width : 20px;
height: 20px;
color : '#6B778C';
}
}
}
\ No newline at end of file
src/pages/member/memberImport/index.tsx
View file @ c1314d42
This diff is collapsed.
src/pages/member/memberLevel/addEquity.tsx
View file @ c1314d42
......@@ -141,7 +141,7 @@ const addEquity: React.FC<[]> = () => {
return (
<PageHeaderWrapper
onBack={() => window.history.back()}
title={[
title={
<>
<div className='headerTop'>
<div className='headerTop-icon'>钻</div>
......@@ -149,8 +149,8 @@ const addEquity: React.FC<[]> = () => {
<div className='headerTop-identity'>商户会员</div>
</div>
</>
]}
content={[
}
content={
<div className='headerMain'>
<div className='headerMain-left'>
<div className='headerMain-left-option'>
......@@ -182,7 +182,7 @@ const addEquity: React.FC<[]> = () => {
<Button className='saveBtn' icon={<ContainerOutlined />}>保存</Button>
</div>
</div>
]}
}
>
<Card>
<StandardTable
......
src/pages/member/memberLevel/index.less
View file @ c1314d42
.row {
display : flex;
justify-content: flex-end;
box-sizing : border-box;
.col {
padding : 0 8px;
.col {
margin-bottom: 12px;
}
text-align : right;
}
.resetBtn {
margin-left: 16px;
}
.headerMain {
......@@ -54,9 +52,10 @@
}
}
.nameCellTitle {
color : @main-color;
cursor: pointer;
}
.levelIcon1 {
width : 100%;
......
src/pages/member/memberLevel/index.tsx
View file @ c1314d42
import React, { ReactNode, useState, useRef } from 'react'
import React, { ReactNode, useState, useRef, useEffect } from 'react'
import { history } from 'umi'
import { Row, Col, Button, Popconfirm, Card, Input } from 'antd'
import { Row, Col, Tooltip, Button, Popconfirm, Card, Input } from 'antd'
import { PageHeaderWrapper } from '@ant-design/pro-layout'
import {
UpOutlined,
DownOutlined,
PlayCircleOutlined,
EyeOutlined
} from '@ant-design/icons'
import { PlayCircleOutlined, PauseCircleOutlined, EyeOutlined } from '@ant-design/icons'
import { StandardTable } from 'god'
import { ColumnType } from 'antd/lib/table/interface'
import './index.less'
interface Item {
key: string;
id: string;
level: string;
levelTab: string;
levelType: string;
scoreTab: string;
name: string;
type: string;
roleType: string;
thresvalue: string;
status: number;
}
import style from './index.less'
const data = [
{
......@@ -82,8 +63,8 @@ const data = [
]
const memberLevel: React.FC<[]> = () => {
let [isSearch, setIsSearch] = useState(false)
const ref = useRef({})
const [keywords, setKeywords] = useState('')
const columns: ColumnType<any>[] = [
{
......@@ -97,14 +78,14 @@ const memberLevel: React.FC<[]> = () => {
dataIndex: 'level',
align: 'center',
key: 'level',
render: (text: any, record: any) => <div className={`levelIcon${record.level}`}></div>
render: (text: any, record: any) => <div className={style[`levelIcon${record.level}`]}></div>
},
{
title: '会员等级标签',
dataIndex: 'levelTab',
align: 'center',
key: 'levelTab',
render: (text: any, record: any) => <span className="commonPickColor" onClick={() => handleSee(record)}>{text}&nbsp;<EyeOutlined /></span>
render: (text: any, record: any) => <span className={style.nameCellTitle} onClick={() => handleSee(record)}>{text}&nbsp;<EyeOutlined /></span>
},
{
title: '会员等级类型',
......@@ -157,7 +138,25 @@ const memberLevel: React.FC<[]> = () => {
okText="是"
cancelText="否"
>
<Button type="link" onClick={() => handleModify(record)} style={record.status === 1 ? { color: '#00B37A' } : { color: 'red' }}>{record.status === 1 ? '有效' : '无效'} <PlayCircleOutlined /></Button>
<Button
type='link'
onClick={() => handleModify(record)}
style={record.status === 1 ?
{ color: '#00B37A' } : { color: 'red' }}
>
{
record.status === 1 ?
<>
<span>有效</span>
<PlayCircleOutlined />
</>
:
<>
<span>无效</span>
<PauseCircleOutlined />
</>
}
</Button>
</Popconfirm>
)
return component
......@@ -185,6 +184,10 @@ const memberLevel: React.FC<[]> = () => {
})
}
useEffect(() => {
console.log(keywords)
})
const handleSee = (record: any) => {
}
......@@ -202,13 +205,9 @@ const memberLevel: React.FC<[]> = () => {
console.log('执行状态修改', record)
}
const handleSearch = (val: string) => {
console.log(val)
}
const handleSearch = () => { }
const handleReset = () => {
}
const handleReset = () => { }
const handleSet = (record: any) => {
history.push('/memberCenter/memberAbility/manage/level/addEquity')
......@@ -222,29 +221,23 @@ const memberLevel: React.FC<[]> = () => {
currentRef={ref}
fetchTableData={(params: any) => fetchData(params)}
controlRender={
<Row className='row'>
<Col className='col' span={4}>
<Input.Search placeholder="搜索" onSearch={(val) => handleSearch(val)} />
</Col>
<Col className='col'>
<Button onClick={() => setIsSearch(isSearch = !isSearch)}>高级筛选{isSearch ? <UpOutlined /> : <DownOutlined />}</Button>
</Col>
<Col className='col'>
<Button onClick={() => handleReset()}>重置</Button>
</Col>
{
isSearch ?
<Col span={24} className='row'>
<Col className='col' span={4}>
<Input placeholder="会员等级标签"></Input>
</Col>
<Col className='col' span={4}>
<Input placeholder="会员角色名称"></Input>
</Col>
<Row>
<Col className={style.col} span={12} offset={12}>
<Tooltip
trigger={['focus']}
placement="top"
title={<span>输入ID、会员等级、会员角色名称&nbsp;&nbsp;进行搜索</span>}
>
<Input.Search
style={{ width: '232px' }}
value={keywords}
placeholder="搜索"
onChange={(e) => setKeywords(e.target.value)}
onSearch={() => handleSearch}
/>
</Tooltip>
<Button className={style.resetBtn} onClick={() => handleReset()}>重置</Button>
</Col>
:
''
}
</Row>
}
/>
......
src/pages/member/memberMaintain/index.less
View file @ c1314d42
.nameCell {
text-align: left;
.nameCellTitle {
color : @main-color;
cursor: pointer;
}
.levelIcon1 {
width : 100%;
height : 16px;
background : url("../../../assets/imgs/level1@2x.png") no-repeat;
background-size: 54px 16px;
margin-top : 8px;
}
.levelIcon2 {
width : 100%;
height : 16px;
background : url("../../../assets/imgs/level2@2x.png") no-repeat;
background-size: 54px 16px;
margin-top : 8px;
}
.levelIcon3 {
width : 100%;
height : 16px;
background : url("../../../assets/imgs/level3@2x.png") no-repeat;
background-size: 54px 16px;
margin-top : 8px;
}
}
.col {
margin : 0 16px 16px 0;
&-open {
color : #fff;
background-color: #6B778C;
}
&-close {
color : #595959;
background-color: #fff;
}
}
.selectBtn {
margin: 0 16px;
}
.select {
width : 160px;
margin: 0 16px 16px 0;
&:nth-last-of-type(1) {
margin-right: 0;
}
}
\ No newline at end of file
src/pages/member/memberMaintain/index.tsx
View file @ c1314d42
This diff is collapsed.
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment