<template>
  <a-spin :spinning="confirmLoading">
    <div style="gap: 10px; display: flex; margin: 10px">
      <a-button>加入团队</a-button>
      <a-button @click="editOrder">确认修改</a-button>
    </div>
    <j-form-container>
      <a-form-model
        ref="form"
        :model="model"
        :rules="validatorRules"
        slot="detail"
      >
        <a-row>
          <div style="display: flex; gap: 15px">
            <div style="width: 39%">
              <h4 style="color: rgba(255, 141, 26, 1); font-weight: 600">
                团队信息
              </h4>
              <a-divider />
              <a-col :span="24">
                <a-form-model-item
                  label="团队名称"
                  :labelCol="labelCol"
                  :wrapperCol="wrapperCol"
                  prop="orderInfo.teamName"
                >
                  <a-input
                    v-model="model.orderInfo.teamName"
                    placeholder="团队名称"
                  ></a-input>
                </a-form-model-item>
              </a-col>
              <a-col :span="24">
                <a-form-model-item
                  label="团队类型"
                  :labelCol="labelCol"
                  :wrapperCol="wrapperCol"
                  prop="orderInfo.teamTypeDicId"
                >
                  <a-select
                    placeholder="团队类型"
                    v-model="model.orderInfo.teamTypeDicId"
                  >
                    <a-select-option
                      :value="item.id"
                      v-for="(item, index) in teamTypeDicList"
                      :key="item.id"
                    >
                      {{ item.itemText }}
                    </a-select-option>
                  </a-select>
                </a-form-model-item>
              </a-col>
              <a-col :span="24">
                <a-form-model-item
                  label="团队人数"
                  :labelCol="labelCol"
                  :wrapperCol="wrapperCol"
                  prop="orderInfo.teamPeopleNumber"
                >
                  <a-input-number
                    v-model="model.orderInfo.teamPeopleNumber"
                    placeholder="团队人数"
                    :min="1"
                    @change="dayCountChange"
                  ></a-input-number>
                </a-form-model-item>
              </a-col>
              <a-col :span="24">
                <a-form-model-item
                  label="早餐"
                  :labelCol="labelCol"
                  :wrapperCol="wrapperCol"
                  prop="orderInfo.breakfastNum"
                >
                  <a-input-number
                    v-model="model.orderInfo.breakfastNum"
                    placeholder="早餐"
                    :min="0"
                  ></a-input-number>
                </a-form-model-item>
              </a-col>

              <a-col :span="24">
                <a-form-model-item
                  label="客人来源"
                  :labelCol="labelCol"
                  :wrapperCol="wrapperCol"
                  prop="orderInfo.customerSource"
                >
                  <a-select
                    placeholder="客人来源"
                    v-model="model.orderInfo.customerSource"
                  >
                    <a-select-option
                      :value="item.id"
                      v-for="(item, index) in customerSourceList"
                      :key="item.id"
                    >
                      {{ item.itemText }}
                    </a-select-option>
                  </a-select>
                </a-form-model-item>
              </a-col>
              <a-col :span="24">
                <a-form-model-item
                  label="公付项目"
                  :labelCol="labelCol"
                  :wrapperCol="wrapperCol"
                  prop="orderInfo.publicConsumeProject"
                >
                  <a-select
                    mode="multiple"
                    placeholder="公付项目"
                    v-model="model.orderInfo.publicConsumeProject"
                  >
                    <a-select-option :value="1"> 房费 </a-select-option>
                    <a-select-option :value="2"> 消费 </a-select-option>
                    <a-select-option :value="3"> 会员费 </a-select-option>
                    <a-select-option :value="4"> 会议费 </a-select-option>
                  </a-select>
                </a-form-model-item>
              </a-col>
              <a-col :span="24">
                <a-form-model-item
                  label="客人类型"
                  :labelCol="labelCol"
                  :wrapperCol="wrapperCol"
                  prop="orderInfo.customerType"
                >
                  <a-select
                    placeholder="客人类型"
                    v-model="model.orderInfo.customerType"
                  >
                    <a-select-option :value="1"> 散客 </a-select-option>
                    <a-select-option :value="2"> 会员 </a-select-option>
                    <a-select-option :value="3"> 协议单位 </a-select-option>
                    <a-select-option :value="4"> 中介 </a-select-option>
                  </a-select>
                </a-form-model-item>
              </a-col>
              <a-col :span="24" v-if="model.orderInfo.bookingType === 1">
                <a-form-model-item
                  label="房价方案"
                  :labelCol="labelCol"
                  :wrapperCol="wrapperCol"
                  prop="orderInfo.roomPriceSlnId"
                >
                  <a-select
                    placeholder="房价方案"
                    v-model="model.orderInfo.roomPriceSlnId"
                  >
                    <a-select-option value="会员价"> 会员价 </a-select-option>
                    <a-select-option value="平日价"> 平日价 </a-select-option>
                  </a-select>
                </a-form-model-item>
              </a-col>
              <h4 style="color: rgba(255, 141, 26, 1); font-weight: 600">
                其他信息
              </h4>
              <a-divider />
              <a-col :span="24">
                <a-form-model-item
                  label="联系人"
                  :labelCol="labelCol"
                  :wrapperCol="wrapperCol"
                  prop="contactName"
                >
                  <a-auto-complete
                    v-model="model.contactName"
                    placeholder="联系人"
                    @search="handleSearch"
                    @select="(e) => handleSelectMember(e)"
                  >
                    <template slot="dataSource">
                      <a-select-option v-for="item in result" :key="item">{{
                        item
                      }}</a-select-option>
                    </template>
                  </a-auto-complete>
                </a-form-model-item>
              </a-col>
              <a-col :span="24">
                <a-form-model-item
                  label="电话"
                  :labelCol="labelCol"
                  :wrapperCol="wrapperCol"
                  prop="phone"
                >
                  <a-input v-model="model.phone" placeholder="电话"></a-input>
                </a-form-model-item>
              </a-col>
              <a-col :span="24">
                <a-form-model-item
                  label="领队"
                  :labelCol="labelCol"
                  :wrapperCol="wrapperCol"
                  prop="orderInfo.leaderName"
                >
                  <a-input
                    v-model="model.orderInfo.leaderName"
                    placeholder="领队"
                  ></a-input>
                </a-form-model-item>
              </a-col>
              <a-col :span="24">
                <a-form-model-item
                  label="担保方式"
                  :labelCol="labelCol"
                  :wrapperCol="wrapperCol"
                  prop="orderInfo.warrantType"
                >
                  <a-select
                    placeholder="担保方式"
                    v-model="model.orderInfo.warrantType"
                  >
                    <a-select-option :value="1"> 无担保 </a-select-option>
                    <a-select-option :value="2"> 有担保 </a-select-option>
                    <a-select-option :value="3"> OTA担保 </a-select-option>
                  </a-select>
                </a-form-model-item>
              </a-col>
              <a-col :span="24">
                <a-form-model-item
                  label="销售员"
                  :labelCol="labelCol"
                  :wrapperCol="wrapperCol"
                  prop="orderInfo.warranter"
                >
                  <a-select
                    placeholder="销售员"
                    v-model="model.orderInfo.warranter"
                  >
                    <a-select-option
                      value="item.id"
                      v-for="item in warranterList"
                      :key="item.id"
                    >
                      {{ item.name }}
                    </a-select-option>
                  </a-select>
                </a-form-model-item>
              </a-col>
              <a-col :span="24">
                <a-form-model-item
                  label="外部单号"
                  :labelCol="labelCol"
                  :wrapperCol="wrapperCol"
                  prop="orderInfo.outerOrdersNo"
                >
                  <a-input
                    v-model="model.orderInfo.outerOrdersNo"
                    placeholder="外部单号"
                  ></a-input>
                </a-form-model-item>
              </a-col>
              <a-col :span="24">
                <a-form-model-item
                  label="备注"
                  :labelCol="labelCol"
                  :wrapperCol="wrapperCol"
                  prop="orderInfo.remark"
                >
                  <a-textarea
                    v-model="model.orderInfo.remark"
                    rows="4"
                    placeholder="备注"
                  />
                </a-form-model-item>
              </a-col>
            </div>
            <div style="width: 61%">
              <h4 style="color: rgba(255, 141, 26, 1); font-weight: 600">
                团队汇总
              </h4>
              <a-divider />

              <a-table
                :columns="columns"
                :data-source="model.batchRooms"
                :pagination="false"
                rowKey="batchNo"
              >
                <div
                  slot="expandedRowRender"
                  slot-scope="record, index, indent, expanded"
                  style="margin: 0"
                >
                  <a-table
                    :columns="columns2"
                    :data-source="record.buildingRooms"
                    :pagination="false"
                    :rowKey="rowKey"
                  >
                    <span slot="action" slot-scope="text, record, index">
                      <a @click="pulsRoom(brindex, index)">退出团队</a>
                    </span>
                  </a-table>
                </div>
              </a-table>
            </div>
          </div>
        </a-row>
      </a-form-model>
    </j-form-container>
    <select-room-form-modal
      ref="modalSelectRoomForm"
      @ok="modalFormOk"
    ></select-room-form-modal>
    <batch-select-room-type-form-modal
      ref="modalBatchSelectRoomTypeForm"
      @ok="modalBatchSelectRoomTypeFormOk"
      :orderInfo="model.orderInfo"
      :batchRoomsTypeList="batchRoomsTypeList"
      :hourRoomRuleList="hourRoomRuleList"
    ></batch-select-room-type-form-modal>
    <edit-batch-select-room-type-form-modal
      ref="modalEditBatchSelectRoomTypeForm"
      @ok="modalEditBatchSelectRoomTypeFormOk"
      :orderInfo="batchOrderInfo"
      :batchRoomsTypeList="batchRoomsTypeList"
    ></edit-batch-select-room-type-form-modal>
  </a-spin>
</template>

<script>
import { httpAction, getAction, postAction } from "@/api/manage";
import { validateDuplicateValue } from "@/utils/util";
import moment from "moment";
import EditableCell from "@views/room/modules/checkIn/EditableCell.vue";
import SelectRoomFormModal from "./SelectRoomFormModal.vue";
import BatchSelectRoomTypeFormModal from "./BatchSelectRoomTypeFormModal.vue";
import EditBatchSelectRoomTypeFormModal from "./EditBatchSelectRoomTypeFormModal.vue";

const date = new Date();
const endDate = new Date(date.setDate(date.getDate() + 1));
const columns = [
  {
    title: "批次",
    dataIndex: "batchNo",
    customRender: function (text, record, index) {
      return index + 1;
    },
  },
  {
    title: "预抵时间",
    dataIndex: "arrivalTime",
  },
  {
    title: "预离时间",
    dataIndex: "dueOutTime",
  },
  {
    title: "天数",
    dataIndex: "dayCount",
  },
];
const data = [];
for (let i = 0; i < 2; i++) {
  data.push({
    id: i,
    key1: `双人床` + i,
    key2: 298,
    key3: 298,
    key4: 8,
    key5: 0,
    key6: 0,
  });
}
export default {
  name: "ScheduleRoomForm",
  components: {
    EditableCell,
    SelectRoomFormModal,
    BatchSelectRoomTypeFormModal,
    EditBatchSelectRoomTypeFormModal,
  },
  props: {
    //表单禁用
    disabled: {
      type: Boolean,
      default: false,
      required: false,
    },
    id: {
      type: String,
      default: "",
    },
  },
  data() {
    return {
      // id: "",
      visible: true,
      columns,
      columns2: [
        {
          title: "姓名",
          dataIndex: "name",
        },
        {
          title: "房号",
          dataIndex: "marketPrice",
        },
        {
          title: "房型",
          dataIndex: "favPrice",
        },
        {
          title: "入住时间",
          dataIndex: "canUseCount",
        },
        {
          title: "状态",
          dataIndex: "canUseCount",
        },
        {
          title: "操作",
          dataIndex: "action",
          align: "center",
          fixed: "right",
          width: 70,
          scopedSlots: { customRender: "action" },
        },
      ],
      batchOrderInfo: {},
      model: {
        // data: data,
        orderInfo: {
          bookingOrdersType: 2,
          arrivalTime2: moment(new Date()).format("YYYY-MM-DD"),
          dueOutTime2: moment(endDate).format("YYYY-MM-DD"),
          arrivalTimeSpan: moment("18:00", "HH:mm"),
          dueOutTimeSpan: moment("12:00", "HH:mm"),
          bookingType: 1,
          dayCount: 1,
          warrantType: 1,
          hourRoomId: "",
          breakfastNum: 0,
          teamPeopleNumber: 0,
        },
        roomIds: [],
        layoutDayPrices: [],
      },
      labelCol: {
        xs: { span: 24 },
        sm: { span: 5 },
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 16 },
      },
      confirmLoading: false,
      validatorRules: {
        "orderInfo.teamName": [{ required: true, message: "请输入团队名称!" }],
        "orderInfo.teamTypeDicId": [
          { required: true, message: "请选择团队类型!" },
        ],
        "orderInfo.bookingType": [
          { required: true, message: "请选择入住类型!" },
        ],
        "orderInfo.arrivalTime2": [
          { required: true, message: "请选择预抵时间!" },
        ],
        "orderInfo.dueOutTime2": [
          { required: true, message: "请选择预离时间!" },
        ],
        "orderInfo.customerSource": [
          { required: true, message: "请选择客人来源!" },
        ],
        "orderInfo.bookingDicWay": [
          { required: true, message: "请选择预定方式!" },
        ],
        "orderInfo.customerType": [
          { required: true, message: "请选择客人类型!" },
        ],
        contactName: [{ required: true, message: "请输入联系人!" }],
        phone: [{ required: true, message: "请输入电话!" }],
      },
      url: {
        add: "/business/busRoomBookingOrders/add",
        edit: "/business/busRoomBookingOrders/edit",
        queryById: "/business/busMeetingRoom/queryById",
        getBookingOrderInfo:
          "/business/busRoomBookingOrders/getBookingOrderInfo",
      },
      result: [],
      selectIndex: 0,
      selectChidIndex: 0,
      customerSourceList: [],
      bookingdicWayList: [],
      warranterList: [],
      hourRoomRuleList: [],
      canUserRooms: [],
      teamTypeDicList: [],
      batchRoomsTypeList: [],
      customerList: [],
      oldcustomerList: [],
    };
  },
  computed: {
    formDisabled() {
      return this.disabled;
    },
    amount() {
      var sum = 0;
      this.canUserRooms.forEach((t) => {
        sum += t.layout.favPrice * t.layout.presetNum;
      });
      return sum.toFixed(2);
    },
  },
  created() {
    this.load();
  },
  mounted() {
    // this.pulsBatch();
  },
  methods: {
    load(id) {
      // this.id = id;
      var _info = JSON.parse(localStorage.getItem("storeInfo"));
      if (_info) {
        this.model.hotelId = _info.id;
      }
      //备份model原始值
      this.modelDefault = JSON.parse(JSON.stringify(this.model));

      getAction("/business/busDictItem/list", {
        hotelId: _info.id,
        dictId: "1639544105636417538",
      }).then((res) => {
        if (res.success) {
          this.teamTypeDicList = res.result.records;
        }
      });
      getAction("/business/busDictItem/list", {
        hotelId: _info.id,
        dictId: "1639538915239743490",
      }).then((res) => {
        if (res.success) {
          this.customerSourceList = res.result.records;
        }
      });
      getAction("/business/busDictItem/list", {
        hotelId: _info.id,
        dictId: "1639544187093995521",
      }).then((res) => {
        if (res.success) {
          this.bookingdicWayList = res.result.records;
        }
      });
      getAction("/business/busSalesPerson/list", {
        hotelId: _info.id,
        pageNo: 1,
        pageSize: 100,
      }).then((res) => {
        if (res.success) {
          this.warranterList = res.result.records;
        }
      });

      getAction("/rooms/cesHourRoomRule/list", {
        pageNo: 1,
        pageSize: 100,
      }).then((res) => {
        if (res.success) {
          this.hourRoomRuleList = res.result.records;
        }
      });

      // postAction("/rooms/cesAllDayPriceRule/fetch", { hotelId: _info.id }).then(
      //   (res) => {
      //     if (res.success) {
      //       if (
      //         res.result &&
      //         res.result.cesAllDayPriceRule &&
      //         res.result.cesAllDayPriceRule.leaveTime
      //       ) {
      //         this.model.orderInfo.dueOutTimeSpan = moment(
      //           res.result.cesAllDayPriceRule.leaveTime,
      //           "HH:mm"
      //         );
      //       }
      //     }

      //     // this.loadRooms();
      //   }
      // );
      this.getBookingOrderInfo();
    },
    getbusCustomer() {
      getAction("/bus/busCustomer/list", {}).then((res) => {
        if (res.success) {
          this.customerList = res.result.records;
          this.oldcustomerList = JSON.parse(JSON.stringify(this.customerList));
          var find = this.oldcustomerList.find(
            (t) => t.id == this.model.orderInfo.contactId
          );
          if (find) {
            this.model.contactName = find.name;
            this.model.phone = find.phone;
          }

          this.$emit("ok", this.model);
        }
      });
    },
    getBookingOrderInfo() {
      console.log("this.id", this.id);
      getAction(this.url.getBookingOrderInfo, {
        bookingNo: this.id,
      }).then((res) => {
        if (res.success) {
          this.model = res.result;
          var publicConsumeProject = [];
          if (this.model.orderInfo.publicRoomFee == 1) {
            publicConsumeProject.push(1);
          }
          if (this.model.orderInfo.publicConsumeFee == 1) {
            publicConsumeProject.push(2);
          }
          if (this.model.orderInfo.publicVipFee == 1) {
            publicConsumeProject.push(3);
          }
          if (this.model.orderInfo.publicMeetingFee == 1) {
            publicConsumeProject.push(4);
          }

          // this.model.orderInfo.publicConsumeProject = publicConsumeProject;
          this.$set(this.model.orderInfo,'publicConsumeProject',publicConsumeProject)

          this.getbusCustomer();
          // this.loadRooms();
        }
      });
    },
    deleteBatch(index) {
      this.batchRoomsTypeList.splice(index, 1);
    },
    presetNumChange(e, record) {
      console.log(e);
      record.layout.canUseCount = record.layout.oldTags - e;
    },
    onCellChange(key, dataIndex, value) {
      const dataSource = [...this.canUserRooms];
      const target = dataSource[dataIndex];
      console.log("target", target);
      if (target && target.layout) {
        target.layout[key] = value;
        this.canUserRooms = dataSource;
      }
      console.log("this.canUserRooms", this.canUserRooms);
    },
    rowKey(record) {
      return record.name;
    },
    loadRooms() {
      getAction("/rooms/cesRooms/can-user-rooms", {
        startOf:
          this.model.orderInfo.arrivalTime2 +
          " " +
          moment(this.model.orderInfo.arrivalTimeSpan).format("HH:mm"),
        endOf:
          this.model.orderInfo.dueOutTime2 +
          " " +
          moment(this.model.orderInfo.dueOutTimeSpan).format("HH:mm"),
        bookingType: this.model.orderInfo.bookingType,
        hourRoomRuleId: this.model.orderInfo.hourRoomId,
      }).then((res) => {
        if (res.success) {
          res.result.forEach((t) => {
            t.layout = Object.assign({}, t.layout, {
              presetNum: 0,
              oldTags: t.layout.canUseCount,
            });
            t.buildingRooms.forEach((b) => {
              b.floorRooms.forEach((f) => {
                this.$set(f, "check", 0);
              });
            });
          });
          this.canUserRooms = res.result;
        }
      });
    },
    bookingTypeChange(e) {
      if (this.model.orderInfo.bookingType == 1) {
        this.model.orderInfo.hourRoomId = "";
      } else {
        var hourRoomRule = this.hourRoomRuleList[0];
        if (hourRoomRule) {
          this.model.orderInfo.hourRoomId = hourRoomRule.id;
        }
      }
      // this.loadRooms();
      this.batchRoomsTypeList = [];
    },
    dayCountChange(e) {
      this.model.orderInfo.dueOutTime2 = moment(
        this.model.orderInfo.arrivalTime2
      )
        .add(e, "days")
        .format("YYYY-MM-DD");
      this.loadRooms();
    },
    disabledDate(current) {
      return current && current < moment().add(-1, "days").endOf("day");
    },
    arrivalTimeChange(e) {
      this.model.orderInfo.dayCount = Math.abs(
        parseInt(
          (new Date(this.model.orderInfo.arrivalTime2).getTime() -
            new Date(this.model.orderInfo.dueOutTime2).getTime()) /
            (1000 * 60 * 60 * 24)
        )
      );
      this.loadRooms();
    },
    arrivalTimeSpanChange(m, time) {
      console.log(time);
      console.log(moment(m).format("HH:mm"));
    },
    tagClose2(brindex, index, bIndex, rindex) {
      var id =
        this.batchRoomsTypeList[brindex].data[index].buildingRooms[bIndex]
          .floorRooms[rindex].id;
      var findIndex = this.batchRoomsTypeList[brindex].data[
        index
      ].rooms.findIndex((t) => t.id === id);
      this.batchRoomsTypeList[brindex].data[index].rooms.splice(findIndex, 1);

      console.log(this.batchRoomsTypeList[brindex].data[index]);
      this.$set(
        this.batchRoomsTypeList[brindex].data[index].buildingRooms[bIndex]
          .floorRooms[rindex],
        "check",
        0
      );
    },
    modalEditBatchSelectRoomTypeFormOk(e) {
      console.log("e", e);
      var find = this.batchRoomsTypeList[this.selectIndex];
      if (find) {
        this.$set(this.batchRoomsTypeList, this.selectIndex, e);
        console.log("find", find);
      } else {
        this.batchRoomsTypeList.push(e);
      }
    },
    modalBatchSelectRoomTypeFormOk(e) {
      console.log("e", e);
      var find = this.batchRoomsTypeList.find((t) => t.key === e.key);
      if (find) {
        find.amount = (Number(e.amount) + Number(find.amount)).toFixed(2);
        e.data.forEach((t) => {
          var layoutType = find.data.find((f) => f.layout.id === t.layout.id);
          if (layoutType) {
            layoutType.layout.presetNum += t.layout.presetNum;
            layoutType.layout.canUseCount -= t.layout.presetNum;
            t.rooms.forEach((room) => {
              if (room.check && room.check === 1) {
                layoutType.buildingRooms.forEach((buildingRoom) => {
                  // buildingRoom.floorRooms.forEach((floorRoom) => {
                  var buildingRoomFind = buildingRoom.floorRooms.find(
                    (br) => br.id === room.id
                  );
                  console.log("buildingRoomFind", buildingRoomFind);
                  if (buildingRoomFind) {
                    buildingRoomFind.check = 1;
                  }
                  // });
                });
                layoutType.rooms.push(room);
              }
            });
          } else {
            console.log(2);
            console.log(t);
            find.data = [...find.data, ...e.data];
          }
        });
      } else {
        this.batchRoomsTypeList.push(e);
      }
    },
    modalFormOk(e) {
      // this.modelDefault = Object.assign({}, this.modelDefault, {
      //   rooms: e,
      // });
      // this.edit(this.modelDefault);
      this.$set(
        this.batchRoomsTypeList[this.selectIndex].data[this.selectChidIndex],
        "rooms",
        e
      );
      console.log(
        this.batchRoomsTypeList[this.selectIndex].data[this.selectChidIndex]
      );
    },
    pulsBatch(index) {
      this.selectIndex = index;
      this.$refs.modalBatchSelectRoomTypeForm.add();
      this.$refs.modalBatchSelectRoomTypeForm.title = "添加批次";
      this.$refs.modalBatchSelectRoomTypeForm.disableSubmit = false;
    },
    editBatch(index) {
      this.selectIndex = index;
      var item = this.batchRoomsTypeList[index];
      item.bookingType = this.model.orderInfo.bookingType;
      item.hourRoomId = this.model.orderInfo.hourRoomId;
      this.batchOrderInfo = item;
      console.log("item", item);
      this.$refs.modalEditBatchSelectRoomTypeForm.add(item);
      this.$refs.modalEditBatchSelectRoomTypeForm.title = "修改批次";
      this.$refs.modalEditBatchSelectRoomTypeForm.disableSubmit = false;
    },

    pulsRoom(brindex, index) {
      this.selectIndex = brindex;
      this.selectChidIndex = index;
      console.log(this.batchRoomsTypeList[this.selectIndex].data[index]);
      this.$refs.modalSelectRoomForm.add(
        this.batchRoomsTypeList[this.selectIndex].data[index]
      );
      this.$refs.modalSelectRoomForm.title = "排房";
      this.$refs.modalSelectRoomForm.disableSubmit = false;
    },
    handleSearch(value) {
      let result;
      if (!value) {
        result = [];
      } else {
        result = ["a", "b", "c"].map(
          (domain) => `${value}${domain}(15888888888)`
        );
      }
      this.result = result;
    },
    handleSelectMember(e) {
      this.model.mobile = "158888888888";
    },
    moment,
    onChange(date, dateString) {
      console.log(date, dateString);
    },
    add() {
      this.edit(this.modelDefault);
    },
    addList(roomLiveList) {
      this.modelDefault = Object.assign({}, this.modelDefault, {
        rooms: roomLiveList,
      });
      this.edit(this.modelDefault);
    },
    edit(record) {
      this.model = Object.assign({}, record);
      this.visible = true;
    },
    editOrder() {
      this.submitForm();
    },
    submitForm() {
      const that = this;
      if (
        that.model.orderInfo.publicConsumeProject &&
        that.model.orderInfo.publicConsumeProject.length > 0
      ) {
        var publicRoomFee = that.model.orderInfo.publicConsumeProject.some(
          (t) => t == 1
        );
        that.model.orderInfo.publicRoomFee = publicRoomFee ? 1 : 0;
        var publicConsumeFee = that.model.orderInfo.publicConsumeProject.some(
          (t) => t == 2
        );
        that.model.orderInfo.publicConsumeFee = publicConsumeFee ? 1 : 0;
        var publicVipFee = that.model.orderInfo.publicConsumeProject.some(
          (t) => t == 3
        );
        that.model.orderInfo.publicVipFee = publicVipFee ? 1 : 0;
        var publicMeetingFee = that.model.orderInfo.publicConsumeProject.some(
          (t) => t == 4
        );
        that.model.orderInfo.publicMeetingFee = publicMeetingFee ? 1 : 0;
      }
      // 触发表单验证
      this.$refs.form.validate((valid) => {
        if (valid) {
          that.confirmLoading = true;
          let httpurl = "";
          let method = "";
          if (!this.model.orderInfo.id) {
            httpurl += this.url.add;
            method = "post";
          } else {
            httpurl += this.url.edit;
            method = "put";
          }
          httpAction(httpurl, this.model, method)
            .then((res) => {
              if (res.success) {
                that.$message.success(res.message);
                that.getBookingOrderInfo();
              } else {
                that.$message.warning(res.message);
              }
            })
            .finally(() => {
              that.confirmLoading = false;
            });
        }
      });
    },
  },
};
</script>
<style scoped>
/deep/.ant-divider-horizontal {
  margin: 12px 0 !important;
}
/deep/ .ant-form-item {
  margin-bottom: 5px !important;
}

/deep/ .ant-btn-link {
  flex: 1;
  color: rgba(255, 141, 26, 1) !important;
}
</style>