update

src/features/common/SpecBtns.tsx

@@ -93,10 +93,11 @@ export const EndFastBtn = (props: { onClick: Function, lowLight?: boolean }) =>
     )
 }
 
-export const SetScheduleBtn = (props: { onClick: Function, title: string,isFast?:boolean }) => {
+export const SetScheduleBtn = (props: { onClick: Function, title: string,isFast?:boolean, lowLight?: boolean }) => {
     return (
         <Buttons title={props.title} type={ButtonType.elevated}
             onClick={() => { props.onClick() }}
+            lowLight={props.lowLight ? props.lowLight : false}
             btnStyle={{
                 height: 50,
                 width:300,

src/features/trackTimeDuration/components/Dial.tsx

@@ -366,7 +366,6 @@ const Component = (props) => {
         const pointX = centerX + Math.cos(startAngle) * radius;
         const pointY = centerY + Math.sin(startAngle) * radius;
         const distance = Math.sqrt(Math.pow(canvasX - pointX, 2) + Math.pow(canvasY - pointY, 2));
-        console.log('distance' + distance)
         if (distance <= 40) {
             canStartDrag = true;
         } else {
@@ -376,7 +375,6 @@ const Component = (props) => {
         const pointX2 = centerX + Math.cos(endAngle) * radius;
         const pointY2 = centerY + Math.sin(endAngle) * radius;
         const distance2 = Math.sqrt(Math.pow(canvasX - pointX2, 2) + Math.pow(canvasY - pointY2, 2));
-        console.log('distance2' + distance2)
         if (distance2 <= 40) {
             canEndDrag = true;
         } else {
@@ -396,6 +394,11 @@ const Component = (props) => {
         if (canStartDrag || canEndDrag) {
             drawCanvas(currentContext);
             canRingDrag = false;
+
+            if (canStartDrag || canEndDrag){
+                var type = canStartDrag?1:2
+                global.startDuration(type)
+            }
             return;
         }
 
@@ -411,6 +414,14 @@ const Component = (props) => {
 
 
         drawCanvas(currentContext);
+
+        if (canStartDrag || canEndDrag || canRingDrag){
+            var type = canStartDrag?1:canEndDrag?2:3
+            global.startDuration(type)
+        }
+        else {
+            global.endDuration()
+        }
     };
 
     const normalizeAngle = (angle) => {
@@ -442,6 +453,7 @@ const Component = (props) => {
         canStartDrag = false;
         canEndDrag = false;
         canRingDrag = false;
+        global.endDuration()
         handleTouchMove(e)
     }
 

src/features/trackTimeDuration/components/SetSchedule.scss

@@ -22,6 +22,21 @@
     align-items: center;
     justify-content: center;
     background-color: orange;
+    flex-direction: column;
+}
+
+.item_title{
+    font-size: 28px;
+    line-height: 28px;
+    color: #fff;
+}
+
+.item_text{
+    margin-top: 10px;
+    font-size: 48px;
+    line-height: 48px;
+    color: #fff;
+    font-weight: bold;
 }
 
 .duration{

src/features/trackTimeDuration/components/SetSchedule.tsx

@@ -32,6 +32,7 @@ export default function Component() {
   const pickerRef = useRef<any>(null);
   // const [count,setCount] = useState(0)
   const [beginChange, setBeginChange] = useState(true)
+  const [operateType, setOperateType] = useState(0)
 
   var scheduleObj: { start_time: any; end_time: any; };
   if (scenario.name == 'FAST') {
@@ -225,11 +226,28 @@ export default function Component() {
 
   }
 
+  global.startDuration = (type) => {
+    setOperateType(type)
+    console.log(type)
+  }
+
   global.updateDuration = (start, end) => {
     var startCount = parseInt(start.split(':')[0]) * 60 + parseInt(start.split(':')[1])
     var endCount = parseInt(end.split(':')[0]) * 60 + parseInt(end.split(':')[1])
-    if (startCount % 15 == 0 || endCount % 15 == 0) {
-      Taro.vibrateShort()
+    if (operateType == 1 && startCount % 15 == 0) {
+      Taro.vibrateShort({
+        type: 'heavy',
+      })
+    }
+    else if (operateType == 2 && endCount % 15 == 0) {
+      Taro.vibrateShort({
+        type: 'heavy',
+      })
+    }
+    else if (operateType == 3 && (startCount % 15 == 0 || endCount % 15 == 0)) {
+      Taro.vibrateShort({
+        type: 'heavy',
+      })
     }
 
     setStartTime(start)
@@ -240,6 +258,11 @@ export default function Component() {
     saveTempCache(start, end)
   }
 
+  global.endDuration = () => {
+    setOperateType(0)
+    console.log(0)
+  }
+
   function layoutContent() {
     return <PickerViews ref={pickerRef} onChange={durationChange} items={durationDatas(common)} value={pickerValue} height={200} showBtns={true} onCancel={() => { setIsOpen(false) }} />
   }
@@ -257,28 +280,33 @@ export default function Component() {
 
     <View className="box">
       <View className="header">
-        <View className="item1" onClick={() => {
+        <View className="item1" style={{ opacity: operateType == 1 || operateType == 3 ? 1 : 0.4 }} onClick={() => {
           setChooseStart(true)
           setIsTimeOpen(true)
         }}>
-          <Text>{scenario.step == 'fast' ? 'Fast starts\n' + startTime : 'Sleep starts\n' + startTime}</Text>
+          <Text className="item_title">{scenario.step == 'fast' ? 'Fast starts' : 'Sleep starts'}</Text>
+          <Text className="item_text">{startTime}</Text>
         </View>
-        <View className="item1" onClick={() => {
+        <View className="item1" style={{ opacity: operateType == 2 || operateType == 3 ? 1 : 0.4 }} onClick={() => {
           setChooseStart(false)
           setIsTimeOpen(true)
         }}>
-          <Text>{scenario.step == 'fast' ? 'Fast ends\n' + endTime : 'Sleep ends\n' + endTime}</Text>
+          <Text className="item_title">{scenario.step == 'fast' ? 'Fast ends' : 'Sleep ends'}</Text>
+          <Text className="item_text">{endTime}</Text>
         </View>
 
       </View>
       <View style={{ flex: 1, display: 'flex', alignItems: 'center', justifyContent: 'center' }}>
         <Dial ref={canvasRef} />
       </View>
-      <Text className="duration" onClick={() => { setIsOpen(true) }}>{hours > 0 ? hours + ' hours ' : ''}{minutes > 0 ? minutes + ' minutes' : ''}</Text>
+      <Text className="duration" style={{ opacity: operateType == 1 || operateType == 2 ? 1 : 0.4 }} onClick={() => { setIsOpen(true) }}>{hours > 0 ? hours + ' hours ' : ''}{minutes > 0 ? minutes + ' minutes' : ''}</Text>
     </View>
 
     <Footer>
-      <SetScheduleBtn title={scenario.step == 'fast' ? 'Set fast schedule' : 'Set sleep schedule'} isFast={scenario.step == 'fast'} onClick={() => start()} />
+      <SetScheduleBtn title={scenario.step == 'fast' ? 'Set fast schedule' : 'Set sleep schedule'}
+        lowLight={operateType != 0}
+        isFast={scenario.step == 'fast'}
+        onClick={() => start()} />
     </Footer>
     {
       isOpen && <Modal children={layoutContent()} dismiss={() => setIsOpen(false)} confirm={() => {