feat：接口对接，打包

package.json

@@ -2,6 +2,7 @@
   "name": "wecom-sidebar",
   "version": "0.1.0",
   "private": true,
+  "homepage":".",
   "dependencies": {
     "@ant-design/icons": "^4.7.0",
     "@babel/core": "7.12.3",

src/api/index.ts

 import axios from 'axios'
-import qs from 'qs'
-axios.defaults.headers['Content-Type'] = 'application/x-www-form-urlencoded'; 
+// import qs from 'qs'
+axios.defaults.headers['Content-Type'] = 'application/json;charset=UTF-8'; 
 
 // 后端地址
 // const baseURL = 'http://192.168.30.239:5000'
@@ -114,8 +114,7 @@ export const addWxLabel = async (params:any) => {
 }
 // 删除
 export const deleteWxLabel = async (data:any) => {
-  const response = await api.post('/user_center/deleteWxLabel', 
-    [...data]
+  const response = await api.post('/user_center/deleteWxLabel', data
   )
   return response.data;
 }

src/css/home.css

@@ -257,3 +257,15 @@
 .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

@@ -2,7 +2,7 @@ import React, {FC, useEffect, useState} from "react";
 import Cookies from "js-cookie";
 import {fetchUser,getBaseInfoByWxId,addWxLabel,getWxLabel,deleteWxLabel,updateBaseInfoFromCompanyWx} from "../api";
 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 jt from './../assets/images/jt.png'
 import {jsSdk} from "../index"
@@ -17,26 +17,27 @@ const Home: FC = () => {
   const [labelColor,setlabelColor]= useState<string>('blue');
   const [cindex,setIndex] = useState<any>(0)
   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 [idTypeOpt] = useState<any>([
     {
-      value: '0',
+      value: 0,
       label: '身份证',
     },
     {
-      value: '1',
+      value: 1,
       label: '护照',
     },
     {
-      value: '2',
+      value: 2,
       label: '港澳回乡证',
     },
     {
-      value: '3',
+      value: 3,
       label: '台胞证',
     },
     {
-      value: '4',
+      value: 4,
       label: '其它',
     },
   ])
@@ -84,6 +85,11 @@ const tailLayout = {
     console.log(customInfo)
     debugger
   };
+  const updown=()=>(e:any)=>{
+    console.log(e)
+    debugger
+    setOpen(e)
+  }
   const testClick=(): void=>{
     console.log('aaaa')
     setCustomInfoEdit(!customInfoEdit)
@@ -120,6 +126,7 @@ const tailLayout = {
     let data:any = {wxId:res.userId}
     const userInfo = await getBaseInfoByWxId(data)
     if(userInfo.data && userInfo.data.userInfo){
+      form.setFieldsValue({...userInfo.data.userInfo});
       setCustomInfo({...userInfo.data.userInfo})
     }
     console.log(userInfo)
@@ -159,6 +166,12 @@ const tailLayout = {
       }
     }
   }
+  const onChange=()=>{
+
+  }
+  const onSearch=()=>{
+    
+  }
 
   useEffect(() => {
     getUserInfo();
@@ -194,8 +207,23 @@ const tailLayout = {
                 </div>
                 <div className="flex mgt20">
                   <span>添加标签：</span>
+                  {/* {labelValue} */}
                   {/* <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 className="flex flex-warp mgt20">
                   <span>添加颜色：</span>
@@ -211,14 +239,15 @@ const tailLayout = {
 
             ): ('')}
           <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}>
+              <div className={!open?"ssbox":""}>
                 {!customInfoEdit?(<div className="flex spaceBetween showt">
                   <span>{customInfo.realName || '-' }</span>
                   <div className='grad'>{ customInfo.account_level || '重要客户' }</div>
                 </div>): ('')}
                 {customInfoEdit?(
                   <Form.Item name="realName" label="客户名称" >
-                  <Input  placeholder="请输入客户名称" value={customInfo.realName} defaultValue={customInfo.realName}/>
+                      <Input  placeholder="请输入客户名称" value={customInfo.realName}/>
                     </Form.Item>
                 ): ('')}
                   
@@ -243,8 +272,8 @@ const tailLayout = {
                     
                     {customInfoEdit?( <Form.Item name="sex" label="性别" >
                     <Radio.Group value={customInfo.sex}>
-                  <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>
-                  <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>
+                      <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>)
                   :('')}
@@ -252,14 +281,13 @@ const tailLayout = {
                     <Select
                       placeholder="请选择证件类型"
                       value={customInfo.idType}
-                  defaultValue={idTypeOptObj[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} defaultValue={customInfo.idNumber}/>
+                  <Input  placeholder="请输入证件号" value={customInfo.idNumber}/>
                   </Form.Item>):('')}
                   {/* {customInfoEdit?(<Form.Item name="mobileNumber" label="手机号" >
                     {customInfo.mobileNumber}
@@ -308,6 +336,7 @@ const tailLayout = {
                       <span className='greyWord'>证件号：</span>
                       <span>{customInfo.idNumber || '-'}</span>
                   </div>):('')}
+              </div>
               {!customInfoEdit?(<div className="labels grey">
                 <div className="greyWord">客户标签</div>
                 <div className="flex flex-wrap w100">
@@ -315,7 +344,8 @@ const tailLayout = {
                 </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}>
                 <Button type="primary" htmlType="submit">
                   Submit
@@ -327,6 +357,7 @@ const tailLayout = {
                   Fill form
                 </Button>
               </Form.Item> */}
+              
             </Form>
           </div>
         </div>

src/pages/findCustom.tsx

@@ -4,6 +4,8 @@ import {jsSdk} from "../index";
 import {Button, Input,Table,Tabs,Space} from "antd";
 import {SearchOutlined } from '@ant-design/icons';
 import {selectUserBase,linkData,unlinkData} from "../api";
+import creatHistory from 'history/createHashHistory'  //返回上一页这段代码
+const history = creatHistory();
 
 const {TextArea} = Input
 const { TabPane } = Tabs;
@@ -130,6 +132,9 @@ const Actions: React.FC = () => {
       getUserBase()
     }
   }
+  const back = ()=>{
+    history.goBack()
+  }
 
   useEffect(() => {
     getUserBase()
@@ -137,6 +142,7 @@ const Actions: React.FC = () => {
 
   return (
     <div>
+      <Button type='primary' className='back' onClick={back.bind(this)}>返回</Button>
       <div className="flex search">
         <Input className='searchInt' allowClear placeholder="请输入客户信息"  prefix={<SearchOutlined />} onChange={inputChange}  onKeyDown={getInput}/>
         {/* <Button size='small'>取消</Button> */}