Auto commit

src/App.vue

@@ -11,7 +11,9 @@ export default {
       txtCount: '',
       txtRestInterval: '',
       txtRestIdx: '',
-      txtIntervalRest: ''
+      txtRestTime: '',
+      txtLastTime: '',
+      needClean: true
     }
   },
   methods: {
@@ -28,30 +30,60 @@ export default {
         }
       }
     },
+    setNum(num) {
+      return num >= 10 ? num : '0' + num
+    },
     getSchedule() {
-      const result = ''
+      let result = ''
       let dateTime = ''
       if (this.txtStart.trim().length > 0 && this.txtInterval.trim().length > 0 && this.txtCount.trim().length > 0) {
+        const count = this.txtLastInterval.trim().length > 0 ? parseInt(this.txtCount) - 1 : parseInt(this.txtCount)
         const interval = parseInt(this.txtInterval) * 60 * 1000
         dateTime = new Date(`2023-03-01 ${this.txtStart}`).getTime()
-        for (let index = 1; index <= parseInt(this.txtCount); index++) {
+        for (let index = 1; index <= parseInt(count); index++) {
           const curDate = new Date(dateTime)
-          result += `<p>${curDate.getHours()}:${curDate.getMinutes()}</p>`
+          dateTime += interval
+          const endDate = new Date(dateTime)
+          result += `<p>
+                      <span style="font-weight: 600; color: green;width: 120px; display:inline-block;margin-right: 16px;">【场次${index}】</span>
+                      ${this.setNum(curDate.getHours())}:${this.setNum(curDate.getMinutes())}-${this.setNum(endDate.getHours())}:${this.setNum(endDate.getMinutes())}
+                    </p>`
+
           if (this.txtRestIdx.trim().length > 0 && parseInt(this.txtRestIdx) === idx) {
-            const restTime = parseFloat(this.txtRestInterval) * 60 * 60 * 1000
-            date += restTime
-          } else {
-            date += interval
-          }      
+            // 分割间歇
+            const restTime = this.txtRestInterval.trim().length > 0 ? parseFloat(this.txtRestInterval) * 60 * 60 * 1000 : 0
+            dateTime += restTime
+          } else if (index < count && this.txtIntervalRest.trim().length > 0) {
+            // 演出间歇
+            const intervalRestTime = parseFloat(this.txtIntervalRest) * 60 * 1000
+            dateTime += intervalRestTime
+          } else if(index === count && this.txtLastInterval.trim().length > 0) {
+            // 演出间歇
+            const lastInterval = parseFloat(this.txtLastInterval) * 60 * 1000
+            dateTime += lastInterval
+          }
         }
+        console.log('result', result)
       } else {
         this.resultList = '';
         return false
       }
       if(this.txtLastInterval.length > 0) {
-        const lastInterval = parseInt(this.txtLastInterval) * 60 * 1000
+        const curDate = new Date(dateTime)
+        const lastTime = parseFloat(this.txtLastInterval) * 60 * 1000
+        dateTime += lastTime
+        const endDate = new Date(dateTime)
+        result += `<p>
+                    <span style="font-weight: 600; color: green;width: 120px; display:inline-block;margin-right: 16px;">【场次${this.txtCount}】</span>
+                    ${this.setNum(curDate.getHours())}:${this.setNum(curDate.getMinutes())}-${this.setNum(endDate.getHours())}:${this.setNum(endDate.getMinutes())}
+                  </p>`
+      }
+      if (this.needClean) {
+        this.resultList = result;
+      } else {
+        this.resultList += this.resultList.length > 0 ? '<hr>' : ''
+        this.resultList += result;
       }
-      this.resultList = result;
     }
   }
 }
@@ -93,14 +125,6 @@ export default {
         <label for="txtInterval">演出时长：</label>
         <input v-model="txtInterval" type="text" name="" id="txtInterval">（必填项，分钟）
       </div>
-      <div class="txt-box">
-        <label for="txtRestIdx">分割场次：</label>
-        <input v-model="txtRestIdx" type="text" name="" id="txtRestIdx">（第几场后休息）
-      </div>
-      <div class="txt-box">
-        <label for="txtRestInterval">分割间隙：</label>
-        <input v-model="txtRestInterval" type="text" name="" id="txtRestInterval">（小时）
-      </div>
       <div class="txt-box">
         <label for="txtIntervalRest">演出间歇：</label>
         <input v-model="txtIntervalRest" type="text" name="" id="txtIntervalRest">（分钟）
@@ -109,8 +133,20 @@ export default {
         <label for="txtLastInterval">压轴间隔：</label>
         <input v-model="txtLastInterval" type="text" name="" id="txtLastInterval">（分钟）
       </div>
+      <div class="txt-box">
+        <label for="txtLastTime">压轴时长：</label>
+        <input v-model="txtLastTime" type="text" name="" id="txtLastTime">（分钟）
+      </div>
+      <div class="txt-box">
+        <label for="txtRestIdx">分割场次：</label>
+        <input v-model="txtRestIdx" type="text" name="" id="txtRestIdx">（第几场后休息）
+      </div>
+      <div class="txt-box">
+        <label for="txtRestInterval">分割间隙：</label>
+        <input v-model="txtRestInterval" type="text" name="" id="txtRestInterval">（小时）
+      </div>
       <div>
-        <button @click="getTime">计算</button>
+        <button @click="getSchedule">计算</button> <input type="checkbox" name="" id="chkNeedClean" v-model="needClean"><label for="chkNeedClean">清空历史结果</label>
       </div>
       <br>
       <p>输入结果：</p>
@@ -135,8 +171,14 @@ section {
 section.bg-01 {
   background-color: #d0e4a8;
 }
+section.bg-01  .result {
+  border-color: rgb(1, 178, 1);
+}
 section.bg-02{
   background-color: #f5f5d5;
 }
+section.bg-02  .result {
+  border-color: orange;
+}
 
 </style>