feat: add checkbox

src/components/location-dialog/index.less

@@ -16,7 +16,6 @@
   &__confirm-button {
     .button(@width: 360px, @height: 72px, @fontSize: 28px, @fontWeight: 400, @borderRadius: 44px);
     margin-top: 40px;
-    margin-bottom: 40px;
   }
 
   // &__cancel-button {
@@ -32,4 +31,8 @@
   //     border-color: transparent
   //   }
   // }
+
+  &__checkbox {
+    margin-top: 40px;
+  }
 }

src/components/location-dialog/index.tsx

@@ -1,8 +1,10 @@
 import { Button } from '@tarojs/components';
 
 import { Dialog } from '@taroify/core';
+import { useCallback, useState } from 'react';
 
-import { ProtocolPrivacy } from '@/components/protocol-privacy';
+import { ProtocolPrivacyCheckbox } from '@/components/protocol-privacy';
+import Toast from '@/utils/toast';
 
 import './index.less';
 
@@ -16,15 +18,28 @@ const PREFIX = 'location-dialog';
 
 export default function LocationDialog(props: IProps) {
   const { open, onClick, onClose } = props;
+  const [checked, setChecked] = useState(false);
+
+  const handleTipCheck = useCallback(() => {
+    Toast.info('请先阅读并同意协议');
+  }, []);
+
   return (
     <Dialog open={open} onClose={onClose}>
       <Dialog.Content>
         <div className={`${PREFIX}__container`}>
           <div className={`${PREFIX}__title`}>{`我们需要获取您的位置信息\n以便推荐附近的通告或主播`}</div>
-          <Button className={`${PREFIX}__confirm-button`} onClick={onClick}>
-            授权
-          </Button>
-          <ProtocolPrivacy />
+          {!checked && (
+            <Button className={`${PREFIX}__confirm-button`} onClick={handleTipCheck}>
+              授权
+            </Button>
+          )}
+          {checked && (
+            <Button className={`${PREFIX}__confirm-button`} onClick={onClick}>
+              授权
+            </Button>
+          )}
+          <ProtocolPrivacyCheckbox checked={checked} onChange={setChecked} className={`${PREFIX}__checkbox`} />
         </div>
       </Dialog.Content>
     </Dialog>