添加修改弹窗

src/views/room/modules/checkIn/BillRoomForm.vue

@@ -611,10 +611,14 @@
                   :scroll="{ y: 200, x: 500 }"
                 >
                   <template slot="prefPrice" slot-scope="text, record, index">
-                    <editable-cell
+                    <div @click="onCellExpand(index)">
+                      {{text}}
+                    <!-- <editable-cell
                       :text="text"
-                      @change="onCellChange('prefPrice', index, $event)"
-                    />
+                      
+                      @change.stop="onCellChange('prefPrice', index, $event)"
+                    /> -->
+                    </div>
                   </template>
                 </a-table>
                 <div
@@ -809,6 +813,39 @@
       ref="modalSelectRoomForm"
       @ok="modalFormOk"
     ></select-room-form-modal>
+
+    <!-- 修改每日单价弹窗 -->
+    <a-modal :visible="editPriceModal" title="调价" @cancel="editPriceModal = false" :width="800" @ok="editPriceOk">
+      <table>
+        <tr>
+          <td style="text-align:center;background:#722ed1;color:#fff;">
+            批量调价
+          </td>
+          <td style="text-align:center;background:#1890ff;color:#fff;">
+            价格调整(元/天)
+          </td>
+        </tr>
+        <th>
+          <td style="text-align:center;color:#722ed1;">
+            <div>每日房价</div>
+            <div v-if="model.roomPrices.length>0 && model.roomPrices[editPriceIndex]">
+              <a-input-number :defaultValue="model.roomPrices[editPriceIndex].prefPrice" @change="batchPrice"></a-input-number>
+            </div>
+          </td>
+        </th>
+        <th style="display:flex;flex-wrap:wrap;">
+          <td v-for="(item, index) in editPriceData" :key="index">
+            <div>
+              {{item.day}}
+            </div>
+            <div>
+              <a-input-number v-model="item.price"></a-input-number>
+            </div>
+          </td>
+        </th>
+      </table>
+    </a-modal>
+
   </a-spin>
 </template>
 
@@ -933,7 +970,12 @@ export default {
       depositSplit: true,
       paymentSplit: true,
       activeKey: "",
+      PriceData: [],
       newTabIndex: 0,
+      //调价弹窗
+      editPriceModal:false,
+      //调价的索引
+      editPriceIndex:null,
       selectedRowKeys: [],
       // data,
       columns,
@@ -1019,6 +1061,30 @@ export default {
     };
   },
   computed: {
+
+    editPriceData(){
+      let arr = []
+      arr.length = this.model.orderInfo.dayCount
+      
+      // model.orderInfo.arrivalTime2
+      // arr.forEach((ele,index)=>{
+      //   ele = {
+      //     day:this.addDate(this.model.orderInfo.arrivalTime2,index),
+      //     price:0
+      //   }
+      // })
+      for (let i = 0; i < arr.length; i++) {
+        arr[i] = {
+          day:this.addDate(this.model.orderInfo.arrivalTime2,i),
+          price:0
+        }
+      }
+      console.log(this.model.orderInfo.arrivalTime2);
+      console.log(arr);
+      this.PriceData = arr
+      return arr
+    },
+
     formDisabled() {
       return this.disabled;
     },
@@ -1117,6 +1183,62 @@ export default {
     //  this.getcesRoomLayout();
   },
   methods: {
+
+    //批量调价
+    batchPrice(e){
+      console.log(e);
+      this.editPriceData.forEach(ele=>{
+        ele.price = e
+      })
+    },
+
+
+    //根据传入的数字将日期加上对应的天数
+		addDate(date,days){
+			console.log(date, days);
+			let time = new Date(date);
+			time.setDate(time.getDate() + days);
+			let m = time.getMonth() + 1;
+			let d = time.getDate();
+			if (m<10) {
+				m = '0' + m;
+			}
+			if (d<10) {
+				d = '0' + d;
+			}
+			return time.getFullYear() + '-' + m + '-' + d;
+		},
+    /**
+     * 点击修改图标时
+     */
+    onCellExpand(idx){
+      console.log(idx);
+      this.editPriceIndex = idx
+      console.log('11111111111111111111111',this.model.roomPrices[this.editPriceIndex]);
+      this.editPriceModal = true;
+    },
+
+    /**
+     * 修改完成
+     */
+    editPriceOk(){
+      console.log(this.editPriceData);
+      this.model.roomPrices[this.editPriceIndex].editPriceTime = []
+      this.model.roomPrices[this.editPriceIndex].editPrice = []
+      this.editPriceData.forEach(ele=>{
+        this.model.roomPrices[this.editPriceIndex].editPriceTime.push(ele.day)
+        this.model.roomPrices[this.editPriceIndex].editPrice.push(ele.price)
+      })
+      console.log(this.model.roomPrices);
+      this.model.roomPrices[this.editPriceIndex].prefPrice = this.editPriceData[0].price
+      this.onCellChange('prefPrice', this.editPriceIndex, this.editPriceData[0].price)
+      this.editPriceData.forEach(ele=>{
+        ele.prcie = 0
+      })
+      console.log(this.editPriceData);
+      this.editPriceModal = false
+    },
+
     presetNumChange(e, record) {
       console.log(e, record);
     },
@@ -1344,6 +1466,8 @@ export default {
       });
     },
     onCellChange(key, dataIndex, value) {
+      console.log(key, value);
+      console.log(this.model.roomPrices[dataIndex]);
       const dataSource = [...this.model.roomPrices];
       const target = dataSource[dataIndex];
       console.log("target", target);
@@ -1537,8 +1661,10 @@ export default {
             .format("YYYY-MM-DD");
           that.model.livingRoomDayPrices.push({
             livingType: 1,
-            dayTime: dayTime,
-            price: t.prefPrice,
+            dayTime: t.editPriceTime? t.editPriceTime[b].toString() : dayTime,
+            price: t.editPrice? t.editPrice[b].toString() : t.prefPrice,
+            // dayTime: dayTime,
+            // price: t.prefPrice,
             roomLayoutId: t.layoutId,
             roomId: t.roomId,
           });