测试

src/views/rental/Detail.vue

@@ -51,7 +51,7 @@
               <el-table-column prop="tenantName" label="租客" min-width="100"></el-table-column>
               <el-table-column prop="startDate" label="开始日期" min-width="100"></el-table-column>
               <el-table-column prop="endDate" label="结束日期" min-width="100"></el-table-column>
-              <el-table-column prop="rent" label="租金(元/月)" min-width="100"></el-table-column>
+              <el-table-column prop="rent" label="租金(元)" min-width="100"></el-table-column>
               <el-table-column prop="deposit" label="押金(元)" min-width="90"></el-table-column>
               <el-table-column prop="remark" label="备注" min-width="120"></el-table-column>
               <el-table-column prop="status" label="状态" min-width="80">
@@ -102,8 +102,8 @@
               </el-table-column>
               <el-table-column prop="status" label="状态" min-width="80">
                 <template slot-scope="scope">
-                  <el-tag :type="scope.row.status === 'paid' ? 'success' : 'warning'" size="small">
+                  <el-tag :type="getWaterBillStatusType(scope.row.status)" size="small">
-                    {{ scope.row.status === 'paid' ? '已支付' : '未支付' }}
+                    {{ getWaterBillStatusText(scope.row.status) }}
                   </el-tag>
                 </template>
               </el-table-column>
@@ -139,16 +139,17 @@
             <el-date-picker v-model="waterBillForm.endDate" type="date" placeholder="选择结束日期" style="width: 100%"></el-date-picker>
           </el-form-item>
           <el-form-item label="起始度数" prop="startReading">
-            <el-input v-model.number="waterBillForm.startReading" placeholder="请输入起始度数"></el-input>
+            <el-input v-model="waterBillForm.startReading" placeholder="请输入起始度数"></el-input>
           </el-form-item>
           <el-form-item label="结束度数" prop="endReading">
-            <el-input v-model.number="waterBillForm.endReading" placeholder="请输入结束度数"></el-input>
+            <el-input v-model="waterBillForm.endReading" placeholder="请输入结束度数"></el-input>
           </el-form-item>
           <el-form-item label="单价(元/吨)" prop="unitPrice">
-            <el-input v-model.number="waterBillForm.unitPrice" placeholder="请输入单价"></el-input>
+            <el-input v-model="waterBillForm.unitPrice" placeholder="请输入单价"></el-input>
           </el-form-item>
           <el-form-item label="状态" prop="status">
             <el-select v-model="waterBillForm.status" placeholder="请选择状态" style="width: 100%">
+              <el-option label="未出账" value="unbilled"></el-option>
               <el-option label="未支付" value="unpaid"></el-option>
               <el-option label="已支付" value="paid"></el-option>
             </el-select>
@@ -226,14 +227,21 @@ export default {
         startReading: '',
         endReading: '',
         unitPrice: '',
-        status: 'unpaid'
+        status: 'unbilled'
       },
       waterBillRules: {
         startDate: [{ required: true, message: '请选择开始日期', trigger: 'change' }],
-        endDate: [{ required: true, message: '请选择结束日期', trigger: 'change' }],
+        startReading: [
-        startReading: [{ required: true, message: '请输入起始度数', trigger: 'blur' }],
+          { required: true, message: '请输入起始度数', trigger: 'blur' },
-        endReading: [{ required: true, message: '请输入结束度数', trigger: 'blur' }],
+          { pattern: /^\d+(\.\d{1,2})?$/, message: '请输入有效的数字，最多保留两位小数', trigger: 'blur' }
-        unitPrice: [{ required: true, message: '请输入单价', trigger: 'blur' }],
+        ],
+        endReading: [
+          { pattern: /^\d+(\.\d{1,2})?$/, message: '请输入有效的数字，最多保留两位小数', trigger: 'blur' }
+        ],
+        unitPrice: [
+          { required: true, message: '请输入单价', trigger: 'blur' },
+          { pattern: /^\d+(\.\d{1,2})?$/, message: '请输入有效的数字，最多保留两位小数', trigger: 'blur' }
+        ],
         status: [{ required: true, message: '请选择状态', trigger: 'change' }]
       },
       rentalDialogVisible: false,
@@ -280,6 +288,30 @@ export default {
     }
   },
   methods: {
+    formatDate(date) {
+      if (!date) return null
+      const d = new Date(date)
+      const year = d.getFullYear()
+      const month = String(d.getMonth() + 1).padStart(2, '0')
+      const day = String(d.getDate()).padStart(2, '0')
+      return `${year}-${month}-${day}`
+    },
+    getWaterBillStatusType(status) {
+      switch (status) {
+        case 'paid': return 'success'
+        case 'unpaid': return 'warning'
+        case 'unbilled': return 'info'
+        default: return ''
+      }
+    },
+    getWaterBillStatusText(status) {
+      switch (status) {
+        case 'paid': return '已支付'
+        case 'unpaid': return '未支付'
+        case 'unbilled': return '未出账'
+        default: return status
+      }
+    },
     handleResize() {
       this.$forceUpdate()
     },
@@ -494,12 +526,12 @@ export default {
       this.waterBillForm = {
         id: '',
         roomId: this.$route.params.id,
-        startDate: '',
+        startDate: new Date(),
         endDate: '',
         startReading: '',
         endReading: '',
         unitPrice: '',
-        status: 'unpaid'
+        status: 'unbilled'
       }
       this.waterBillDialogVisible = true
     },
@@ -514,11 +546,21 @@ export default {
     async handleSaveWaterBill() {
       try {
         const roomId = this.$route.params.id
+        const data = {
+          roomId,
+          startDate: this.waterBillForm.startDate ? this.formatDate(this.waterBillForm.startDate) : null,
+          endDate: this.waterBillForm.endDate ? this.formatDate(this.waterBillForm.endDate) : null,
+          startReading: this.waterBillForm.startReading !== '' ? parseFloat(this.waterBillForm.startReading) : null,
+          endReading: this.waterBillForm.endReading !== '' ? parseFloat(this.waterBillForm.endReading) : null,
+          unitPrice: this.waterBillForm.unitPrice !== '' ? parseFloat(this.waterBillForm.unitPrice) : null,
+          status: this.waterBillForm.status
+        }
+        
         if (this.waterBillForm.id) {
-          await waterBillApi.update(this.waterBillForm.id, this.waterBillForm)
+          await waterBillApi.update(this.waterBillForm.id, data)
           this.$message.success('水费记录更新成功')
         } else {
-          await waterBillApi.create({ ...this.waterBillForm, roomId })
+          await waterBillApi.create(data)
           this.$message.success('水费记录添加成功')
         }
         this.waterBillDialogVisible = false

src/views/rental/RentalArchive.vue

@@ -51,7 +51,7 @@
           <el-button @click="resetSearch">重置</el-button>
         </el-form-item>
       </el-form>
-      
+
       <!-- PC端表格 -->
       <div class="table-wrapper hidden-xs-only">
         <el-table :data="rentalList" style="width: 100%" v-loading="isLoading">
@@ -73,7 +73,7 @@
           </el-table-column>
           <el-table-column prop="startDate" label="开始日期" min-width="100"></el-table-column>
           <el-table-column prop="endDate" label="结束日期" min-width="100"></el-table-column>
-          <el-table-column prop="rent" label="租金(元/月)" min-width="100"></el-table-column>
+          <el-table-column prop="rent" label="租金(元)" min-width="100"></el-table-column>
           <el-table-column prop="deposit" label="押金(元)" min-width="100"></el-table-column>
           <el-table-column prop="remark" label="备注" min-width="120"></el-table-column>
           <el-table-column prop="status" label="状态" min-width="80">
@@ -93,7 +93,7 @@
           </el-table-column>
         </el-table>
       </div>
-      
+
       <!-- 移动端卡片列表 -->
       <div class="mobile-list hidden-sm-and-up">
         <div v-for="item in rentalList" :key="item.id" class="mobile-card">
@@ -140,7 +140,7 @@
           </div>
         </div>
       </div>
-      
+
       <div class="pagination-wrapper">
         <el-pagination
           @size-change="handleSizeChange"
@@ -453,16 +453,16 @@ export default {
     margin-right: 0;
     margin-bottom: 10px;
   }
-  
+
   .search-form .el-form-item__content {
     width: 100%;
   }
-  
+
   .search-form .el-select,
   .search-form .el-date-picker {
     width: 100%;
   }
-  
+
   .pagination-wrapper {
     justify-content: center;
   }

src/views/rental/WaterArchive.vue

@@ -33,6 +33,7 @@
         <el-form-item label="状态">
           <el-select v-model="searchForm.status" placeholder="请选择状态">
             <el-option label="全部" value=""></el-option>
+            <el-option label="未出账" value="unbilled"></el-option>
             <el-option label="未支付" value="unpaid"></el-option>
             <el-option label="已支付" value="paid"></el-option>
           </el-select>
@@ -64,8 +65,8 @@
           </el-table-column>
           <el-table-column prop="status" label="状态" min-width="80">
             <template slot-scope="scope">
-              <el-tag :type="scope.row.status === 'paid' ? 'success' : 'warning'" size="small">
+              <el-tag :type="getWaterBillStatusType(scope.row.status)" size="small">
-                {{ scope.row.status === 'paid' ? '已支付' : '未支付' }}
+                {{ getWaterBillStatusText(scope.row.status) }}
               </el-tag>
             </template>
           </el-table-column>
@@ -84,8 +85,8 @@
         <div v-for="item in waterBillList" :key="item.id" class="mobile-card">
           <div class="mobile-card-header">
             <span class="mobile-card-title">{{ getApartmentName(item.roomId) }} - {{ getRoomNumber(item.roomId) }}</span>
-            <el-tag :type="item.status === 'paid' ? 'success' : 'warning'" size="mini">
+            <el-tag :type="getWaterBillStatusType(item.status)" size="mini">
-              {{ item.status === 'paid' ? '已支付' : '未支付' }}
+              {{ getWaterBillStatusText(item.status) }}
             </el-tag>
           </div>
           <div class="mobile-card-body">
@@ -144,16 +145,17 @@
           <el-date-picker v-model="waterBillForm.endDate" type="date" placeholder="选择结束日期" style="width: 100%"></el-date-picker>
         </el-form-item>
         <el-form-item label="起始度数" prop="startReading">
-          <el-input v-model.number="waterBillForm.startReading" placeholder="请输入起始度数"></el-input>
+          <el-input v-model="waterBillForm.startReading" placeholder="请输入起始度数"></el-input>
         </el-form-item>
         <el-form-item label="结束度数" prop="endReading">
-          <el-input v-model.number="waterBillForm.endReading" placeholder="请输入结束度数"></el-input>
+          <el-input v-model="waterBillForm.endReading" placeholder="请输入结束度数"></el-input>
         </el-form-item>
         <el-form-item label="单价(元/吨)" prop="unitPrice">
-          <el-input v-model.number="waterBillForm.unitPrice" placeholder="请输入单价"></el-input>
+          <el-input v-model="waterBillForm.unitPrice" placeholder="请输入单价"></el-input>
         </el-form-item>
         <el-form-item label="状态" prop="status">
           <el-select v-model="waterBillForm.status" placeholder="请选择状态" style="width: 100%">
+            <el-option label="未出账" value="unbilled"></el-option>
             <el-option label="未支付" value="unpaid"></el-option>
             <el-option label="已支付" value="paid"></el-option>
           </el-select>
@@ -197,15 +199,22 @@ export default {
         startReading: '',
         endReading: '',
         unitPrice: '',
-        status: 'unpaid'
+        status: 'unbilled'
       },
       waterBillRules: {
         roomId: [{ required: true, message: '请选择房间', trigger: 'change' }],
         startDate: [{ required: true, message: '请选择开始日期', trigger: 'change' }],
-        endDate: [{ required: true, message: '请选择结束日期', trigger: 'change' }],
+        startReading: [
-        startReading: [{ required: true, message: '请输入起始度数', trigger: 'blur' }],
+          { required: true, message: '请输入起始度数', trigger: 'blur' },
-        endReading: [{ required: true, message: '请输入结束度数', trigger: 'blur' }],
+          { pattern: /^\d+(\.\d{1,2})?$/, message: '请输入有效的数字，最多保留两位小数', trigger: 'blur' }
-        unitPrice: [{ required: true, message: '请输入单价', trigger: 'blur' }],
+        ],
+        endReading: [
+          { pattern: /^\d+(\.\d{1,2})?$/, message: '请输入有效的数字，最多保留两位小数', trigger: 'blur' }
+        ],
+        unitPrice: [
+          { required: true, message: '请输入单价', trigger: 'blur' },
+          { pattern: /^\d+(\.\d{1,2})?$/, message: '请输入有效的数字，最多保留两位小数', trigger: 'blur' }
+        ],
         status: [{ required: true, message: '请选择状态', trigger: 'change' }]
       }
     }
@@ -225,6 +234,30 @@ export default {
     window.removeEventListener('resize', this.handleResize)
   },
   methods: {
+    formatDate(date) {
+      if (!date) return null
+      const d = new Date(date)
+      const year = d.getFullYear()
+      const month = String(d.getMonth() + 1).padStart(2, '0')
+      const day = String(d.getDate()).padStart(2, '0')
+      return `${year}-${month}-${day}`
+    },
+    getWaterBillStatusType(status) {
+      switch (status) {
+        case 'paid': return 'success'
+        case 'unpaid': return 'warning'
+        case 'unbilled': return 'info'
+        default: return ''
+      }
+    },
+    getWaterBillStatusText(status) {
+      switch (status) {
+        case 'paid': return '已支付'
+        case 'unpaid': return '未支付'
+        case 'unbilled': return '未出账'
+        default: return status
+      }
+    },
     handleResize() {
       this.$forceUpdate()
     },
@@ -331,12 +364,12 @@ export default {
       this.waterBillForm = {
         id: '',
         roomId: '',
-        startDate: '',
+        startDate: new Date(),
         endDate: '',
         startReading: '',
         endReading: '',
         unitPrice: '',
-        status: 'unpaid'
+        status: 'unbilled'
       }
       this.waterBillDialogVisible = true
     },
@@ -350,11 +383,21 @@ export default {
     },
     async handleSave() {
       try {
+        const data = {
+          roomId: this.waterBillForm.roomId,
+          startDate: this.waterBillForm.startDate ? this.formatDate(this.waterBillForm.startDate) : null,
+          endDate: this.waterBillForm.endDate ? this.formatDate(this.waterBillForm.endDate) : null,
+          startReading: this.waterBillForm.startReading !== '' ? parseFloat(this.waterBillForm.startReading) : null,
+          endReading: this.waterBillForm.endReading !== '' ? parseFloat(this.waterBillForm.endReading) : null,
+          unitPrice: this.waterBillForm.unitPrice !== '' ? parseFloat(this.waterBillForm.unitPrice) : null,
+          status: this.waterBillForm.status
+        }
+        
         if (this.waterBillForm.id) {
-          await waterBillApi.update(this.waterBillForm.id, this.waterBillForm)
+          await waterBillApi.update(this.waterBillForm.id, data)
           this.$message.success('水费记录更新成功')
         } else {
-          await waterBillApi.create(this.waterBillForm)
+          await waterBillApi.create(data)
           this.$message.success('水费记录添加成功')
         }
         this.waterBillDialogVisible = false