fix: 一键同步客户信息

src/pages/Customer/Company/components/CompanyDetail/SyncClient.jsx

@@ -23,15 +23,15 @@ const SyncClient = ({ customer, client }) => {
 
   // eslint-disable-next-line consistent-return
   const handleOnConfirm = async () => {
-    const { checkValues = [], selectedKeys = [] } = state
+    const { checkValues, selectedKeys } = state
     if (checkValues?.length < 2) {
       return message.error('同步选项至少选中一个')
     }
     if (!selectedKeys?.length) {
-      return message.error('未勾选待同步的客户')
+      return message.warning('请选择需要同步的客户')
     }
     const params = { customerId: customer.id, clientIds: selectedKeys }
-    checkValues.forEach(item => {
+    checkValues?.forEach(item => {
       params[item] = true
     })
     const { code = -1 } = await syncToClient(params)
@@ -82,73 +82,75 @@ const SyncClient = ({ customer, client }) => {
     }
   ]
 
-  const { visible } = state
+  const { checkValues, visible } = state
   return (
     <>
-      <Button size="small" onClick={() => setState({ visible: true })}>
+      <Button size="small" onClick={() => setState({ ...state, visible: true })}>
         <div className="flex items-center justify-center">
           <Copy theme="two-tone" fill={['#333', '#535A5D']} />
           <span className="ml-1">同步地址信息</span>
         </div>
       </Button>
-      <Modal
-        width="70%"
-        title={`同步 ${customer.companyName} 信息`}
-        getContainer={false}
-        visible={visible}
-        onCancel={() => setState({ ...state, visible: false })}
-        onOk={handleOnConfirm}>
-        <div className="rounded-3 p-4 mb-2">
-          <Checkbox.Group
-            defaultValue={['district', 'address']}
-            onChange={e => setState({ ...state, checkValues: e })}>
-            <div>
-              <Checkbox value={'district'}>
-                <div className="w-100px text-left">地区</div>
-              </Checkbox>
-              <span>{customer.districtName?.replaceAll(' / ', ',')}</span>
-            </div>
-            <div>
-              <Checkbox value={'address'}>
-                <div className="w-100px text-left">地址</div>
-              </Checkbox>
-              <span>{customer.address}</span>
-            </div>
-            <div>
-              <Checkbox value={'ride'}>
-                <div className="w-100px text-left">乘车路线</div>
-              </Checkbox>
-              <span>{customer.ride}</span>
-            </div>
-            <div>
-              <Checkbox value={'landmarks'}>
-                <div className="w-100px text-left">地标建筑</div>
-              </Checkbox>
-              <span>{customer.landmarks}</span>
-            </div>
-            <div>
-              <Checkbox value={'stay'}>
-                <div className="w-100px text-left">参考住宿</div>
-              </Checkbox>
-              <span>{customer.stay}</span>
-            </div>
-          </Checkbox.Group>
-        </div>
-        <ProTable
-          search={false}
-          rowKey="id"
-          toolBarRender={false}
-          size="small"
-          columns={columns}
-          dataSource={client}
-          bordered
-          scroll={{ y: 400 }}
-          pagination={false}
-          rowSelection={{
-            onChange: selectedRowKeys => setState({ ...state, selectedKeys: selectedRowKeys })
-          }}
-        />
-      </Modal>
+      {visible ? (
+        <Modal
+          width="70%"
+          title={`同步 ${customer.companyName} 信息`}
+          getContainer={false}
+          visible={visible}
+          onCancel={() => setState({ ...state, visible: false })}
+          onOk={handleOnConfirm}>
+          <div className="rounded-3 p-4 mb-2">
+            <Checkbox.Group
+              defaultValue={checkValues}
+              onChange={e => setState({ ...state, checkValues: e })}>
+              <div>
+                <Checkbox value="district">
+                  <div className="w-100px text-left">地区</div>
+                </Checkbox>
+                <span>{customer.districtName?.replaceAll(' / ', ',')}</span>
+              </div>
+              <div>
+                <Checkbox value="address">
+                  <div className="w-100px text-left">地址</div>
+                </Checkbox>
+                <span>{customer.address}</span>
+              </div>
+              <div>
+                <Checkbox value="ride">
+                  <div className="w-100px text-left">乘车路线</div>
+                </Checkbox>
+                <span>{customer.ride}</span>
+              </div>
+              <div>
+                <Checkbox value="landmarks">
+                  <div className="w-100px text-left">地标建筑</div>
+                </Checkbox>
+                <span>{customer.landmarks}</span>
+              </div>
+              <div>
+                <Checkbox value="stay">
+                  <div className="w-100px text-left">参考住宿</div>
+                </Checkbox>
+                <span>{customer.stay}</span>
+              </div>
+            </Checkbox.Group>
+          </div>
+          <ProTable
+            search={false}
+            rowKey="id"
+            toolBarRender={false}
+            size="small"
+            columns={columns}
+            dataSource={client}
+            bordered
+            scroll={{ y: 400 }}
+            pagination={false}
+            rowSelection={{
+              onChange: selectedRowKeys => setState({ ...state, selectedKeys: selectedRowKeys })
+            }}
+          />
+        </Modal>
+      ) : null}
     </>
   )
 }