Skip to content

W
wecom-sidebar
Commit e4bdbaf3 authored by Aivs's avatar Aivs
Browse files
Options

feat：接口对接，打包

parent 7f0d87d4
Hide whitespace changes
Inline Side-by-side
Showing with 153 additions and 104 deletions
package.json
View file @ e4bdbaf3
...@@ -2,6 +2,7 @@ ...@@ -2,6 +2,7 @@
"name": "wecom-sidebar", "name": "wecom-sidebar",
"version": "0.1.0", "version": "0.1.0",
"private": true, "private": true,
"homepage":".",
"dependencies": { "dependencies": {
"@ant-design/icons": "^4.7.0", "@ant-design/icons": "^4.7.0",
"@babel/core": "7.12.3", "@babel/core": "7.12.3",
......
src/api/index.ts
View file @ e4bdbaf3
import axios from 'axios' import axios from 'axios'
import qs from 'qs' // import qs from 'qs'
axios.defaults.headers['Content-Type'] = 'application/x-www-form-urlencoded'; axios.defaults.headers['Content-Type'] = 'application/json;charset=UTF-8';
// 后端地址 // 后端地址
// const baseURL = 'http://192.168.30.239:5000' // const baseURL = 'http://192.168.30.239:5000'
...@@ -114,8 +114,7 @@ export const addWxLabel = async (params:any) => { ...@@ -114,8 +114,7 @@ export const addWxLabel = async (params:any) => {
} }
// 删除 // 删除
export const deleteWxLabel = async (data:any) => { export const deleteWxLabel = async (data:any) => {
const response = await api.post('/user_center/deleteWxLabel', const response = await api.post('/user_center/deleteWxLabel', data
[...data]
) )
return response.data; return response.data;
} }
......
src/css/home.css
View file @ e4bdbaf3
...@@ -256,4 +256,16 @@ ...@@ -256,4 +256,16 @@
} }
.none{ .none{
display: none; display: none;
}
.ssbox{
/* height:170px;
overflow: hidden; */
}
.dicon{
text-align: center;
color:#C7C7CC;
}
.back{
width:100%;
border-radius:0 !important;
} }
\ No newline at end of file
src/pages/Home.tsx
View file @ e4bdbaf3
...@@ -2,7 +2,7 @@ import React, {FC, useEffect, useState} from "react"; ...@@ -2,7 +2,7 @@ import React, {FC, useEffect, useState} from "react";
import Cookies from "js-cookie"; import Cookies from "js-cookie";
import {fetchUser,getBaseInfoByWxId,addWxLabel,getWxLabel,deleteWxLabel,updateBaseInfoFromCompanyWx} from "../api"; import {fetchUser,getBaseInfoByWxId,addWxLabel,getWxLabel,deleteWxLabel,updateBaseInfoFromCompanyWx} from "../api";
import {Spin,Form, Input, Button, Select,Radio,Tag} from "antd"; import {Spin,Form, Input, Button, Select,Radio,Tag} from "antd";
import { SearchOutlined } from '@ant-design/icons'; import { SearchOutlined,DownOutlined,UpOutlined } from '@ant-design/icons';
import './../css/home.css' import './../css/home.css'
import jt from './../assets/images/jt.png' import jt from './../assets/images/jt.png'
import {jsSdk} from "../index" import {jsSdk} from "../index"
...@@ -17,26 +17,27 @@ const Home: FC = () => { ...@@ -17,26 +17,27 @@ const Home: FC = () => {
const [labelColor,setlabelColor]= useState<string>('blue'); const [labelColor,setlabelColor]= useState<string>('blue');
const [cindex,setIndex] = useState<any>(0) const [cindex,setIndex] = useState<any>(0)
const [customInfo,setCustomInfo] = useState<any>({}); const [customInfo,setCustomInfo] = useState<any>({});
const [open,setOpen]= useState<boolean>(false);
const [labels,setLabels] = useState<any>([{id:2,labelName:'跑步',color:'blue'},{id:2,labelName:'教育',color:'green'}]); const [labels,setLabels] = useState<any>([{id:2,labelName:'跑步',color:'blue'},{id:2,labelName:'教育',color:'green'}]);
const [idTypeOpt] = useState<any>([ const [idTypeOpt] = useState<any>([
{ {
value: '0', value: 0,
label: '身份证', label: '身份证',
}, },
{ {
value: '1', value: 1,
label: '护照', label: '护照',
}, },
{ {
value: '2', value: 2,
label: '港澳回乡证', label: '港澳回乡证',
}, },
{ {
value: '3', value: 3,
label: '台胞证', label: '台胞证',
}, },
{ {
value: '4', value: 4,
label: '其它', label: '其它',
}, },
]) ])
...@@ -84,6 +85,11 @@ const tailLayout = { ...@@ -84,6 +85,11 @@ const tailLayout = {
console.log(customInfo) console.log(customInfo)
debugger debugger
}; };
const updown=()=>(e:any)=>{
console.log(e)
debugger
setOpen(e)
}
const testClick=(): void=>{ const testClick=(): void=>{
console.log('aaaa') console.log('aaaa')
setCustomInfoEdit(!customInfoEdit) setCustomInfoEdit(!customInfoEdit)
...@@ -120,6 +126,7 @@ const tailLayout = { ...@@ -120,6 +126,7 @@ const tailLayout = {
let data:any = {wxId:res.userId} let data:any = {wxId:res.userId}
const userInfo = await getBaseInfoByWxId(data) const userInfo = await getBaseInfoByWxId(data)
if(userInfo.data && userInfo.data.userInfo){ if(userInfo.data && userInfo.data.userInfo){
form.setFieldsValue({...userInfo.data.userInfo});
setCustomInfo({...userInfo.data.userInfo}) setCustomInfo({...userInfo.data.userInfo})
} }
console.log(userInfo) console.log(userInfo)
...@@ -159,6 +166,12 @@ const tailLayout = { ...@@ -159,6 +166,12 @@ const tailLayout = {
} }
} }
} }
const onChange=()=>{
}
const onSearch=()=>{
}
useEffect(() => { useEffect(() => {
getUserInfo(); getUserInfo();
...@@ -194,8 +207,23 @@ const tailLayout = { ...@@ -194,8 +207,23 @@ const tailLayout = {
</div> </div>
<div className="flex mgt20"> <div className="flex mgt20">
<span>添加标签：</span> <span>添加标签：</span>
{/* {labelValue} */}
{/* <TextArea style={{width: '100%', marginBottom: 8}} value={labelValue} onChange={e => labelAdd(e.target.value)}/> */} {/* <TextArea style={{width: '100%', marginBottom: 8}} value={labelValue} onChange={e => labelAdd(e.target.value)}/> */}
<input type="text" className="greyInt" onChange={labelAdd} onKeyDown={getInput}/> <input type="text" className="greyInt" value={labelValue} onChange={labelAdd} onKeyDown={getInput}/>
{/* <Select
showSearch
placeholder="Select a person"
optionFilterProp="children"
onChange={onChange}
onSearch={onSearch}
filterOption={(input:any, option:any) =>
option.children.toLowerCase().indexOf(input.toLowerCase()) >= 0
}
>
<Option value="jack">Jack</Option>
<Option value="lucy">Lucy</Option>
<Option value="tom">Tom</Option>
</Select> */}
</div> </div>
<div className="flex flex-warp mgt20"> <div className="flex flex-warp mgt20">
<span>添加颜色：</span> <span>添加颜色：</span>
...@@ -211,103 +239,104 @@ const tailLayout = { ...@@ -211,103 +239,104 @@ const tailLayout = {
): ('')} ): ('')}
<div className="inner flex spaceBetween"> <div className="inner flex spaceBetween">
<Form {...layout} name="control-hooks" onFinish={onFinish} initialValues={customInfo}> <Form {...layout} name="control-hooks" onFinish={onFinish} initialValues={customInfo} form={form}>
{!customInfoEdit?(<div className="flex spaceBetween showt"> <div className={!open?"ssbox":""}>
<span>{customInfo.realName || '-' }</span> {!customInfoEdit?(<div className="flex spaceBetween showt">
<div className='grad'>{ customInfo.account_level || '重要客户' }</div> <span>{customInfo.realName || '-' }</span>
</div>): ('')} <div className='grad'>{ customInfo.account_level || '重要客户' }</div>
{customInfoEdit?( </div>): ('')}
<Form.Item name="realName" label="客户名称" > {customInfoEdit?(
<Input placeholder="请输入客户名称" value={customInfo.realName} defaultValue={customInfo.realName}/> <Form.Item name="realName" label="客户名称" >
</Form.Item> <Input placeholder="请输入客户名称" value={customInfo.realName}/>
): ('')} </Form.Item>
): ('')}
{!customInfoEdit?(<div className="flex flex-wrap">
<div className="flex mgr20"> {!customInfoEdit?(<div className="flex flex-wrap">
<span className='greyWord'>性别：</span> <div className="flex mgr20">
{customInfo.sex===1?( <span className='greyWord'>性别：</span>
<div><span className="radio-wight radio-text radio-text-m"> ♂</span> <span className="radio-text radio-text-m"> 男</span></div>) {customInfo.sex===1?(
:( <div><span className="radio-wight radio-text radio-text-m"> ♂</span> <span className="radio-text radio-text-m"> 男</span></div>)
<div><span className="radio-wight radio-text radio-text-w"> ♂</span> <span className="radio-text radio-text-w"> 女</span></div> :(
)} <div><span className="radio-wight radio-text radio-text-w"> ♂</span> <span className="radio-text radio-text-w"> 女</span></div>
)}
</div>
<div className="flex mgr20">
<span className='greyWord'>手机号：</span>
<span>{customInfo.mobileNumber || '-'}</span>
</div>
<div className="flex">
<span className='greyWord'>积分：</span>
<span>{customInfo.point || '-'}</span>
</div>
</div>):('')}
{customInfoEdit?( <Form.Item name="sex" label="性别" >
<Radio.Group value={customInfo.sex}>
<Radio value={1} ><span className="radio-wight radio-text radio-text-m"> ♂</span> <span className="radio-text radio-text-m"> 男</span></Radio>
<Radio value={2}><span className="radio-wight radio-text radio-text-w"> ♀</span> <span className="radio-text radio-text-w"> 女</span></Radio>
</Radio.Group>
</Form.Item>)
:('')}
{customInfoEdit?(<Form.Item name="idType" label="证件类型" >
<Select
placeholder="请选择证件类型"
value={customInfo.idType}
allowClear
>
{idTypeOpt.map((item:any) => <Option value={item.value}>{item.label}</Option>)}
</Select>
</Form.Item>):('')}
{customInfoEdit?(<Form.Item name="idNumber" label="证件号" >
<Input placeholder="请输入证件号" value={customInfo.idNumber}/>
</Form.Item>):('')}
{/* {customInfoEdit?(<Form.Item name="mobileNumber" label="手机号" >
{customInfo.mobileNumber}
</Form.Item>):('')}
{customInfoEdit?(<Form.Item name="point" label="积分" >
{customInfo.point}
</Form.Item>):('')} */}
<div className="flex">
<span className='greyWord'>公司：</span>
<span>{customInfo.corp || '-'}</span>
</div> </div>
<div className="flex mgr20"> <div className="flex">
<span className='greyWord'>手机号：</span> <span className='greyWord'>职务：</span>
<span>{customInfo.mobileNumber || '-'}</span> <span>{customInfo.position || '-'}</span>
</div> </div>
<div className="flex"> <div className="flex">
<span className='greyWord'>积分：</span> <span className='greyWord'>最后跟进：</span>
<span>{customInfo.point || '-'}</span> <span>{customInfo.corp || '-'}</span>
</div> </div>
</div>):('')} <div className="flex">
<span className='greyWord'>备注：</span>
{customInfoEdit?( <Form.Item name="sex" label="性别" > <span>{customInfo.keywords}</span>
<Radio.Group value={customInfo.sex}> </div>
<Radio value={1} checked={customInfo.sex===1}><span className="radio-wight radio-text radio-text-m"> ♂</span> <span className="radio-text radio-text-m"> 男</span></Radio> <div className="flex">
<Radio value={2} checked={customInfo.sex===2}><span className="radio-wight radio-text radio-text-w"> ♀</span> <span className="radio-text radio-text-w"> 女</span></Radio> <span className='greyWord'>地区：</span>
</Radio.Group> <span>{customInfo.area || '-'}</span>
</Form.Item>) </div>
:('')} <div className="flex">
{customInfoEdit?(<Form.Item name="idType" label="证件类型" > <span className='greyWord'>收货地址：</span>
<Select <span>{customInfo.addr || '-'}</span>
placeholder="请选择证件类型" </div>
value={customInfo.idType} <div className="flex">
defaultValue={idTypeOptObj[customInfo.idType]} <span className='greyWord'>Email：</span>
allowClear <span>{customInfo.email || '-'}</span>
> </div>
{idTypeOpt.map((item:any) => <Option value={item.value}>{item.label}</Option>)} <div className="flex">
</Select> <span className='greyWord'>戈友ID：</span>
</Form.Item>):('')} <span>{customInfo.gyId || '-'}</span>
{customInfoEdit?(<Form.Item name="idNumber" label="证件号" > </div>
<Input placeholder="请输入证件号" value={customInfo.idNumber} defaultValue={customInfo.idNumber}/> {!customInfoEdit?(
</Form.Item>):('')} <div className="flex">
{/* {customInfoEdit?(<Form.Item name="mobileNumber" label="手机号" > <span className='greyWord'>证件类型：</span>
{customInfo.mobileNumber} <span>{idTypeOptObj[customInfo.idType] || '-'}</span>
</Form.Item>):('')} </div>):('')}
{customInfoEdit?(<Form.Item name="point" label="积分" > {!customInfoEdit?(<div className="flex">
{customInfo.point} <span className='greyWord'>证件号：</span>
</Form.Item>):('')} */} <span>{customInfo.idNumber || '-'}</span>
<div className="flex"> </div>):('')}
<span className='greyWord'>公司：</span>
<span>{customInfo.corp || '-'}</span>
</div>
<div className="flex">
<span className='greyWord'>职务：</span>
<span>{customInfo.position || '-'}</span>
</div>
<div className="flex">
<span className='greyWord'>最后跟进：</span>
<span>{customInfo.corp || '-'}</span>
</div>
<div className="flex">
<span className='greyWord'>备注：</span>
<span>{customInfo.keywords}</span>
</div>
<div className="flex">
<span className='greyWord'>地区：</span>
<span>{customInfo.area || '-'}</span>
</div>
<div className="flex">
<span className='greyWord'>收货地址：</span>
<span>{customInfo.addr || '-'}</span>
</div>
<div className="flex">
<span className='greyWord'>Email：</span>
<span>{customInfo.email || '-'}</span>
</div>
<div className="flex">
<span className='greyWord'>戈友ID：</span>
<span>{customInfo.gyId || '-'}</span>
</div> </div>
{!customInfoEdit?(
<div className="flex">
<span className='greyWord'>证件类型：</span>
<span>{idTypeOptObj[customInfo.idType] || '-'}</span>
</div>):('')}
{!customInfoEdit?(<div className="flex">
<span className='greyWord'>证件号：</span>
<span>{customInfo.idNumber || '-'}</span>
</div>):('')}
{!customInfoEdit?(<div className="labels grey"> {!customInfoEdit?(<div className="labels grey">
<div className="greyWord">客户标签</div> <div className="greyWord">客户标签</div>
<div className="flex flex-wrap w100"> <div className="flex flex-wrap w100">
...@@ -315,7 +344,8 @@ const tailLayout = { ...@@ -315,7 +344,8 @@ const tailLayout = {
</div> </div>
</div>):('')} </div>):('')}
{!open?<div className="dicon" onClick={updown.bind(this,'true') }><DownOutlined /></div>
:<div className="dicon" onClick={updown.bind(this,'false') }><UpOutlined /></div>}
{/* <Form.Item {...tailLayout}> {/* <Form.Item {...tailLayout}>
<Button type="primary" htmlType="submit"> <Button type="primary" htmlType="submit">
Submit Submit
...@@ -327,6 +357,7 @@ const tailLayout = { ...@@ -327,6 +357,7 @@ const tailLayout = {
Fill form Fill form
</Button> </Button>
</Form.Item> */} </Form.Item> */}
</Form> </Form>
</div> </div>
</div> </div>
......
src/pages/findCustom.tsx
View file @ e4bdbaf3
...@@ -4,6 +4,8 @@ import {jsSdk} from "../index"; ...@@ -4,6 +4,8 @@ import {jsSdk} from "../index";
import {Button, Input,Table,Tabs,Space} from "antd"; import {Button, Input,Table,Tabs,Space} from "antd";
import {SearchOutlined } from '@ant-design/icons'; import {SearchOutlined } from '@ant-design/icons';
import {selectUserBase,linkData,unlinkData} from "../api"; import {selectUserBase,linkData,unlinkData} from "../api";
import creatHistory from 'history/createHashHistory' //返回上一页这段代码
const history = creatHistory();
const {TextArea} = Input const {TextArea} = Input
const { TabPane } = Tabs; const { TabPane } = Tabs;
...@@ -130,6 +132,9 @@ const Actions: React.FC = () => { ...@@ -130,6 +132,9 @@ const Actions: React.FC = () => {
getUserBase() getUserBase()
} }
} }
const back = ()=>{
history.goBack()
}
useEffect(() => { useEffect(() => {
getUserBase() getUserBase()
...@@ -137,6 +142,7 @@ const Actions: React.FC = () => { ...@@ -137,6 +142,7 @@ const Actions: React.FC = () => {
return ( return (
<div> <div>
<Button type='primary' className='back' onClick={back.bind(this)}>返回</Button>
<div className="flex search"> <div className="flex search">
<Input className='searchInt' allowClear placeholder="请输入客户信息" prefix={<SearchOutlined />} onChange={inputChange} onKeyDown={getInput}/> <Input className='searchInt' allowClear placeholder="请输入客户信息" prefix={<SearchOutlined />} onChange={inputChange} onKeyDown={getInput}/>
{/* <Button size='small'>取消</Button> */} {/* <Button size='small'>取消</Button> */}
......
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