8/19 账单-时间类型-自然/滚动

src/views/system/Sdb/SdbBill/index.vue

@@ -77,15 +77,30 @@
             placeholder="选择账单生成年份"
             style="width: 100%"
           />
+          <!--          滚动月份 -->
           <el-date-picker
             format="YYYY-MM"
             value-format="YYYY-MM"
-            v-else
+            v-else-if="BillForm.chargePeriod === '1'"
             v-model="BillForm.yearMonths"
+            :disabled-date="handleDisableMonth"
             type="months"
             placeholder="选择账单生成月份"
             style="width: 100%"
           />
+          <!--          滚动季度 -->
+          <el-date-picker
+            format="YYYY-MM"
+            value-format="YYYY-MM"
+            v-else-if="BillForm.chargePeriod === '3'"
+            v-model="BillForm.yearQuarters"
+            type="months"
+            placeholder="选择账单生成季度"
+            :disabled-date="handleDisableMonth"
+            style="width: 100%"
+          />
+          <!--          季度账单-滚动季度 -->
+          <!--          <QuarterSelect v-if="BillForm.chargePeriod === '3' && BillForm.periodCalcType === '1'" v-model="myQuarter" @change="onQuarterChange" />-->
         </el-form-item>
         <!--        <el-form-item label="选择生成账单的房屋">-->
         <!--          <div class="flex flex-col">-->
@@ -239,16 +254,24 @@ const BillVisible = ref(false);
 const BillForm = ref<{
   title: string;
   billId: string;
+  /**
+   * 收费周期 0年 1月 2日 3 季度 4永久；为空时取账单配置
+   */
   chargePeriod: string;
   chargeScope: string;
   yearMonths?: string[];
+  periodCalcType: string;
   houseId: string[];
+  yearQuarters?: string[];
   year?: string[];
+  startDate?: string;
+  endDate?: string;
 }>({
   title: '',
   billId: '',
   chargePeriod: '1', // 账单类型
   chargeScope: '0',
+  periodCalcType: '0',
   houseId: []
 });
 // const HolderRef = ref<InstanceType<typeof House>>();
@@ -266,9 +289,14 @@ function handleChange(row: BillVO) {
   BillForm.value.title = row.billName;
   BillForm.value.chargePeriod = row.chargePeriod;
   BillForm.value.billId = row.id;
+  BillForm.value.periodCalcType = row.periodCalcType;
+  BillForm.value.startDate = row.startDate;
+  BillForm.value.endDate = row.endDate;
   if (BillForm.value.chargePeriod === '1') {
     BillForm.value['yearMonths'] = [];
-  } else {
+  } else if (BillForm.value.chargePeriod === '3') {
+    BillForm.value['yearQuarters'] = [];
+  } else if (BillForm.value.chargePeriod === '0') {
     BillForm.value['year'] = [];
   }
 }
@@ -281,6 +309,7 @@ function handleChangeApi() {
 }
 function clearChangeBillForm() {
   BillForm.value = {
+    periodCalcType: undefined,
     title: '',
     billId: '',
     chargePeriod: '1',
@@ -289,6 +318,17 @@ function clearChangeBillForm() {
   };
 }
 
+function handleDisableMonth(date: Date) {
+  if (!BillForm.value.startDate || !BillForm.value.endDate) return false;
+  return date.getTime() < new Date(BillForm.value.startDate).getTime() || date.getTime() > new Date(BillForm.value.endDate).getTime();
+}
+
+const myQuarter = ref('2026-2');
+
+function onQuarterChange(val: string) {
+  console.log(val);
+}
+
 onMounted(() => {
   getList();
 });