会员/协议单位弹框

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

@@ -0,0 +1,221 @@
+<template>
+  <a-spin :spinning="confirmLoading">
+    <j-form-container :disabled="formDisabled">
+      <a-form-model
+        ref="form"
+        :model="model"
+        :rules="validatorRules"
+        slot="detail"
+      >
+        <a-row>
+          <a-col :span="12">
+            <a-form-model-item
+              label="名称"
+              :labelCol="labelCol"
+              :wrapperCol="wrapperCol"
+              prop="name"
+            >
+              <a-input v-model="model.customerName"></a-input>
+            </a-form-model-item>
+          </a-col>
+          <a-col :span="12">
+            <a-form-model-item
+              label="挂账额度"
+              :labelCol="labelCol"
+              :wrapperCol="wrapperCol"
+              prop="bookkeeping"
+            >
+              <a-input v-model="model.bookkeeping"></a-input>
+            </a-form-model-item>
+          </a-col>
+          <a-col :span="12">
+            <a-form-model-item
+              label="卡号"
+              :labelCol="labelCol"
+              :wrapperCol="wrapperCol"
+              prop="accountNo"
+            >
+              <a-input v-model="model.accountNo"></a-input>
+            </a-form-model-item>
+          </a-col>
+          <a-col :span="12">
+            <a-form-model-item
+              label="已用额度"
+              :labelCol="labelCol"
+              :wrapperCol="wrapperCol"
+              prop="amountUsed"
+            >
+              <a-input v-model="model.amountUsed"></a-input>
+            </a-form-model-item>
+          </a-col>
+          <!-- <a-col :span="12">
+            <a-form-model-item
+              label="级别"
+              :labelCol="labelCol"
+              :wrapperCol="wrapperCol"
+              prop="gradeName"
+            >
+              <a-input
+                v-model="model.gradeName"
+              ></a-input>
+            </a-form-model-item>
+          </a-col> -->
+          <a-col :span="12">
+            <a-form-model-item
+              label="剩余额度"
+              :labelCol="labelCol"
+              :wrapperCol="wrapperCol"
+              prop="balance"
+            >
+              <a-input v-model="model.balance"></a-input>
+            </a-form-model-item>
+          </a-col>
+          <a-col :span="12">
+            <a-form-model-item
+              label="联系人"
+              :labelCol="labelCol"
+              :wrapperCol="wrapperCol"
+              prop="contactsName"
+            >
+              <a-input v-model="model.contactsName"></a-input>
+            </a-form-model-item>
+          </a-col>
+          <a-col :span="12">
+            <a-form-model-item
+              label="联系方式"
+              :labelCol="labelCol"
+              :wrapperCol="wrapperCol"
+              prop="phone"
+            >
+              <a-input v-model="model.phone"></a-input>
+            </a-form-model-item>
+          </a-col>
+        </a-row>
+      </a-form-model>
+    </j-form-container>
+  </a-spin>
+</template>
+
+<script>
+import { httpAction, getAction } from "@/api/manage";
+import { validateDuplicateValue } from "@/utils/util";
+
+export default {
+  name: "BusMemberCardForm",
+  components: {},
+  props: {
+    //表单禁用
+    disabled: {
+      type: Boolean,
+      default: false,
+      required: false,
+    },
+  },
+  data() {
+    return {
+      model: { payType: 1, livingOrderId: "", certType: 1, gender: 1 },
+      labelCol: {
+        xs: { span: 24 },
+        sm: { span: 5 },
+      },
+      wrapperCol: {
+        xs: { span: 24 },
+        sm: { span: 16 },
+      },
+      confirmLoading: false,
+      validatorRules: {},
+      url: {
+        add: "/business/busRoomBookingOrders/booking-to-live",
+        edit: "/business/busMemberCard/edit",
+        queryById: "/business/busMemberCard/queryById",
+      },
+      gradeList: [],
+      paymentMethodList: [],
+      staffList: [],
+      customerList: [],
+      oldcustomerList: [],
+    };
+  },
+  computed: {
+    formDisabled() {
+      return this.disabled;
+    },
+  },
+  created() {
+    var _info = JSON.parse(localStorage.getItem("storeInfo"));
+    if (_info) {
+      this.model.hotelId = _info.id;
+    }
+    //备份model原始值
+    this.modelDefault = JSON.parse(JSON.stringify(this.model));
+    this.getbusCustomer();
+  },
+  methods: {
+    handleSearch(value) {
+      let result;
+      if (!value) {
+        result = this.oldcustomerList;
+      } else {
+        result = this.oldcustomerList.filter((t) => t.name.includes(value));
+      }
+      this.customerList = result;
+    },
+    handleSelectMember(e) {
+      var find = this.customerList.find((t) => t.id === e);
+      this.model.phone = find.phone;
+      this.model.customerName = find.name;
+      this.model.customerId = find.id;
+    },
+    getbusCustomer() {
+      getAction("/bus/busCustomer/list", {}).then((res) => {
+        if (res.success) {
+          this.customerList = res.result.records;
+          this.oldcustomerList = JSON.parse(JSON.stringify(this.customerList));
+        }
+      });
+    },
+    add(livingOrderId, roomId) {
+      this.modelDefault.livingOrderId = livingOrderId;
+      this.modelDefault.roomId = roomId;
+      this.edit(this.modelDefault);
+    },
+    edit(record) {
+      this.model = Object.assign({}, record);
+      this.model.amountUsed = this.model.amountUsed || 0;
+      this.model.balance = this.model.balance || 0;
+      this.visible = true;
+    },
+    submitForm() {
+      const that = this;
+      // 触发表单验证
+      this.$refs.form.validate((valid) => {
+        if (valid) {
+          that.confirmLoading = true;
+          // var customers = [];
+          // customers.push({
+          //   certNo: this.model.certNo,
+          //   certType: this.model.certType,
+          //   customerId: this.model.customerId,
+          //   customerName: this.model.customerName,
+          //   gender: this.model.gender,
+          //   phone: this.model.phone,
+          //   roomId: this.model.roomId,
+          // });
+          httpAction("/business/busLivingCustomer/add", this.model, "post")
+            .then((res) => {
+              if (res.success) {
+                that.$message.success("入住成功");
+                that.$emit("ok");
+              } else {
+                that.$message.warning(res.message);
+              }
+            })
+            .finally(() => {
+              that.confirmLoading = false;
+            });
+        }
+      });
+    },
+  },
+};
+</script>

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

@@ -0,0 +1,60 @@
+<template>
+  <j-modal
+    :title="title"
+    :width="width"
+    :visible="visible"
+    switchFullscreen
+    @ok="handleOk"
+    :okButtonProps="{ class:{'jee-hidden': disableSubmit} }"
+    @cancel="handleCancel"
+    cancelText="关闭">
+    <bus-member-card-form ref="realForm" @ok="submitCallback" :disabled="disableSubmit"></bus-member-card-form>
+  </j-modal>
+</template>
+
+<script>
+
+  import BusMemberCardForm from './AgreementUnitInfo'
+  export default {
+    name: 'BusMemberCardModal',
+    components: {
+      BusMemberCardForm
+    },
+    data () {
+      return {
+        title:'',
+        width:800,
+        visible: false,
+        disableSubmit: false
+      }
+    },
+    methods: {
+      add (livingOrderId,roomId) {
+        this.visible=true
+        this.$nextTick(()=>{
+          this.$refs.realForm.add(livingOrderId,roomId);
+        })
+      },
+      edit (record) {
+        this.visible=true
+        this.$nextTick(()=>{
+          this.$refs.realForm.edit(record);
+        })
+      },
+      close () {
+        this.$emit('close');
+        this.visible = false;
+      },
+      handleOk () {
+        this.$refs.realForm.submitForm();
+      },
+      submitCallback(){
+        this.$emit('ok');
+        this.visible = false;
+      },
+      handleCancel () {
+        this.close()
+      }
+    }
+  }
+</script>

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

@@ -82,7 +82,7 @@
                           },
                         ]"
                       >
-                        <a-auto-complete
+                        <a-auto-complete style="width: 80%;"
                           v-model="room.key1"
                           placeholder="请输入姓名"
                           @search="handleSearch"
@@ -96,6 +96,8 @@
                             >
                           </template>
                         </a-auto-complete>
+                        <span style="cursor: pointer;" v-if="room.busMemberCard&&room.busMemberCard.id" @click="showMemberCard(room.busMemberCard)">会员</span>
+                        <span style="cursor: pointer;" v-if="room.busMarketAgreementUnit&&room.busMarketAgreementUnit.id" @click="showAgreementUnit(room.busMarketAgreementUnit)">协议</span>
                       </a-form-model-item>
                     </a-col>
                     <a-col :span="8">
@@ -177,7 +179,7 @@
                       >
                         <a-input
                           v-model="room.key5"
-                          placeholder="请输入姓名"
+                          placeholder="请输入手机号"
                         ></a-input>
                       </a-form-model-item>
                     </a-col>
@@ -511,6 +513,41 @@
                     </a-select>
                   </a-form-model-item>
                 </a-col>
+                <a-col :span="12" v-if="model.orderInfo.customerType === 3">
+                  <a-form-model-item
+                    label="协议单位"
+                    :labelCol="labelCol"
+                    :wrapperCol="wrapperCol"
+                    prop="orderInfo.roomPriceSlnId"
+                  >
+                    <a-select
+                      placeholder="协议单位"
+                      option-label-prop="label"
+                      v-model="model.orderInfo.contractTeamId"
+                      @change="contractTeamIdChange"
+                    >
+                      <a-select-option
+                        :key="item.id"
+                        :value="item.id"
+                        :label="item.customerName"
+                        v-for="(item, index) in busMarketAgreementUnitList"
+                      >
+                        {{ item.customerName }}
+                      </a-select-option>
+                    </a-select>
+                  </a-form-model-item>
+                </a-col>
+                <a-col :span="12"></a-col>
+                <a-col :span="12" v-if="model.orderInfo.customerType === 3">
+                  <a-form-model-item
+                    label="协议合同"
+                    :labelCol="labelCol"
+                    :wrapperCol="wrapperCol"
+                    prop="orderInfo.contractTeamProtocolId"
+                  >
+                    <span style="color:red;cursor: pointer;">{{ model.orderInfo.contractTeamProtocolName }}</span>
+                  </a-form-model-item>
+                </a-col>
                 <a-col :span="12">
                   <a-form-model-item
                     label="房价方案"
@@ -849,7 +886,8 @@
         </th>
       </table>
     </a-modal>
-
+<member-card-modal ref="modalMemberCardInfo"></member-card-modal>
+<agreement-unit-modal ref="modalAgreementUnitInfo"></agreement-unit-modal>
   </a-spin>
 </template>
 
@@ -859,6 +897,8 @@ import { validateDuplicateValue } from "@/utils/util";
 import moment from "moment";
 import EditableCell from "./EditableCell.vue";
 import SelectRoomFormModal from "./SelectRoomFormModal.vue";
+import MemberCardModal from "./MemberCardModal";
+import AgreementUnitModal from "./AgreementUnitModal";
 const columns = [
   // {
   //     title: "",
@@ -928,38 +968,16 @@ const columns2 = [
     scopedSlots: { customRender: "money" },
   },
 ];
-const data = [];
-for (let i = 0; i < 2; i++) {
-  data.push({
-    id: i,
-    key1: `100${i}`,
-    key2: "双人床",
-    key3: 298,
-    key4: 298,
-    key5: 2,
-    key6: 298,
-    key7: 298,
-  });
-}
-const data2 = [];
-for (let i = 0; i < 2; i++) {
-  data2.push({
-    id: i,
-    key1: "押金",
-    key2: "支付宝",
-    key3: 298,
-    key4: 298,
-  });
-}
-const panes = [
-  { roomNo: "1001", content: "", id: "1001" },
-  { roomNo: "1002", content: "", id: "1002" },
-];
 const date = new Date();
 const endDate = new Date(date.setDate(date.getDate() + 1));
 export default {
   name: "BillRoomForm",
-  components: { EditableCell, SelectRoomFormModal },
+  components: {
+    EditableCell,
+    SelectRoomFormModal,
+    MemberCardModal,
+    AgreementUnitModal,
+  },
   props: {
     //表单禁用
     disabled: {
@@ -991,9 +1009,9 @@ export default {
       model: {
         // data: data,
         orderInfo: {
-          rooms: panes,
-          data: data,
-          data2: data2,
+          rooms: [],
+          data: [],
+          data2: [],
           bookingOrdersType: 1,
           arrivalTime2: moment(new Date()).format("YYYY-MM-DD"),
           dueOutTime2: moment(endDate).format("YYYY-MM-DD"),
@@ -1005,6 +1023,7 @@ export default {
           hourRoomId: "",
           breakfastNum: 0,
           vipCustomerId: "",
+          customerType: 1,
         },
         roomIds: [],
         livingRoomDayPrices: [],
@@ -1062,6 +1081,8 @@ export default {
       roomIdsIndex: 0,
       busMemberCardList: [],
       payTypeList: [],
+      busMemberCard: {},
+      busMarketAgreementUnitList: [],
     };
   },
   computed: {
@@ -1115,6 +1136,10 @@ export default {
       });
       return text;
     },
+    cPhone() {
+      let a = this.model.roomIds.map((t) => t.key5);
+      return a;
+    },
   },
   watch: {
     depositSplit(value) {
@@ -1180,6 +1205,44 @@ export default {
         this.model.orderFees = [...list, ...list2];
       }
     },
+    // "model.roomIds": {
+    //   handler(newValue, oldValue) {
+    //     console.log(newValue, oldValue);
+    //   },
+    //   deep: true,
+    //   immediate: true,
+    // },
+    cPhone: {
+      handler: function (val, old) {
+        var index = this.model.roomIds.findIndex((t) => t.id == this.activeKey);
+        if (index >= 0) {
+          var find = this.model.roomIds[index];
+          find.busMemberCard = this.busMemberCardList.find(
+            (t) => t.mobile == val[index]
+          );
+          if (!find.busMemberCard) {
+            find.busMarketAgreementUnit = this.busMarketAgreementUnitList.find(
+              (t) => t.phone == val[index]
+            );
+          } else {
+            find.busMarketAgreementUnit = {};
+          }
+          if (find.busMemberCard && find.busMemberCard.id) {
+            this.model.orderInfo.customerType = 2;
+            this.model.orderInfo.roomPriceSlnId = find.busMemberCard.id;
+          } else if (
+            find.busMarketAgreementUnit &&
+            find.busMarketAgreementUnit.id
+          ) {
+            this.model.orderInfo.customerType = 3;
+          } else {
+            this.model.orderInfo.customerType = 1;
+          }
+        }
+      },
+      deep: true,
+      immediate: true,
+    },
   },
   created() {
     var _info = JSON.parse(localStorage.getItem("storeInfo"));
@@ -1194,6 +1257,9 @@ export default {
     }).then((res) => {
       if (res.success) {
         this.customerSourceList = res.result.records;
+        if (this.customerSourceList) {
+          this.model.orderInfo.customerSource = this.customerSourceList[0].id;
+        }
       }
     });
     getAction("/business/busDictItem/list", {
@@ -1243,6 +1309,14 @@ export default {
         this.busMemberCardList = res.result.records;
       }
     });
+    getAction("/business/busMarketAgreementUnit/list", {
+      pageSize: 99999,
+      pageNo: 1,
+    }).then((res) => {
+      if (res.success) {
+        this.busMarketAgreementUnitList = res.result.records;
+      }
+    });
 
     postAction("/rooms/cesAllDayPriceRule/fetch", { hotelId: _info.id }).then(
       (res) => {
@@ -1265,6 +1339,32 @@ export default {
     //  this.getcesRoomLayout();
   },
   methods: {
+    contractTeamIdChange(e) {
+      this.model.orderInfo.contractTeamId = e;
+      getAction("/business/busMarketAgreementCustomer/list", {
+        agreementId: this.model.orderInfo.contractTeamId,
+      }).then((res) => {
+        if (res.success) {
+          var list = res.result.records;
+          if (list && list.length > 0) {
+            this.model.orderInfo.contractTeamProtocolName = list[0].name;
+            this.model.orderInfo.contractTeamProtocolId = list[0].id;
+          }
+        }
+      });
+    },
+    showMemberCard(busMemberCard) {
+      console.log("busMemberCard", busMemberCard);
+      this.$refs.modalMemberCardInfo.edit(busMemberCard);
+      this.$refs.modalMemberCardInfo.title = "会员信息";
+      this.$refs.modalMemberCardInfo.disableSubmit = true;
+    },
+    showAgreementUnit(busMarketAgreementUnit) {
+      console.log("busMarketAgreementUnit", busMarketAgreementUnit);
+      this.$refs.modalAgreementUnitInfo.edit(busMarketAgreementUnit);
+      this.$refs.modalAgreementUnitInfo.title = "协议单位信息";
+      this.$refs.modalAgreementUnitInfo.disableSubmit = true;
+    },
     //批量调价
     batchPrice(e) {
       console.log(e);
@@ -1569,13 +1669,16 @@ export default {
       this.customerList = result;
     },
     handleSelectMember(room, e) {
+      console.log("room", room);
       var find = this.customerList.find((t) => t.id === e);
-      room.key1 = find.name;
-      room.key2 = 1;
-      room.key3 = "汉";
-      // room.key4 = find.phone;
-      room.key5 = find.phone;
-      // room.key6 = "火星";
+      // room.key1 = find.name;
+      // room.key2 = 1;
+      // room.key3 = "汉";
+      // room.key5 = find.phone;
+      this.$set(room, "key1", find.name);
+      this.$set(room, "key2", 1);
+      this.$set(room, "key3", "汉");
+      this.$set(room, "key5", find.phone);
       this.$set(room, "customerId", find.id);
     },
     pulsRoom() {
@@ -1737,13 +1840,13 @@ export default {
     addList(roomLiveList, key) {
       console.log("roomLiveList", roomLiveList);
       this.modelDefault = Object.assign({}, this.modelDefault, {
-        roomIds: roomLiveList,
+        roomIds: JSON.parse(JSON.stringify(roomLiveList)),
       });
       this.modelDefault.orderInfo.bookingOrdersType = key;
       this.edit(this.modelDefault);
     },
     async edit(record) {
-      console.log("edit");
+      console.log("edit", record);
       this.visible = true;
       this.model = Object.assign({}, record);
       console.log("this.model", this.model);
@@ -1753,6 +1856,9 @@ export default {
       if (this.payTypeList == 0) {
         await this.getbusRoomPayType();
       }
+      if (this.customerSourceList) {
+        this.model.orderInfo.customerSource = this.customerSourceList[0].id;
+      }
       if (this.model.roomIds && this.model.roomIds.length > 0) {
         this.activeKey = this.model.roomIds[0].id;
 

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

@@ -0,0 +1,222 @@
+<template>
+  <a-spin :spinning="confirmLoading">
+    <j-form-container :disabled="formDisabled">
+      <a-form-model
+        ref="form"
+        :model="model"
+        :rules="validatorRules"
+        slot="detail"
+      >
+        <a-row>
+          <a-col :span="12">
+            <a-form-model-item
+              label="姓名"
+              :labelCol="labelCol"
+              :wrapperCol="wrapperCol"
+              prop="certType"
+            >
+              <a-input
+                v-model="model.name"
+              ></a-input>
+            </a-form-model-item>
+          </a-col>
+          <a-col :span="12">
+            <a-form-model-item
+              label="证件号"
+              :labelCol="labelCol"
+              :wrapperCol="wrapperCol"
+              prop="cardInnerNo"
+            >
+              <a-input
+                v-model="model.cardInnerNo"
+              ></a-input>
+            </a-form-model-item>
+          </a-col>
+          <a-col :span="12">
+            <a-form-model-item
+              label="卡号"
+              :labelCol="labelCol"
+              :wrapperCol="wrapperCol"
+              prop="cardNo"
+            >
+              <a-input
+                v-model="model.cardNo"
+              ></a-input>
+            </a-form-model-item>
+          </a-col>
+          <a-col :span="12">
+            <a-form-model-item
+              label="手机号"
+              :labelCol="labelCol"
+              :wrapperCol="wrapperCol"
+              prop="mobile"
+            >
+              <a-input
+                v-model="model.mobile"
+              ></a-input>
+            </a-form-model-item>
+          </a-col>
+          <a-col :span="12">
+            <a-form-model-item
+              label="会员级别"
+              :labelCol="labelCol"
+              :wrapperCol="wrapperCol"
+              prop="gradeName"
+            >
+              <a-input
+                v-model="model.gradeName"
+              ></a-input>
+            </a-form-model-item>
+          </a-col>
+          <a-col :span="12">
+            <a-form-model-item
+              label="余额"
+              :labelCol="labelCol"
+              :wrapperCol="wrapperCol"
+              prop="balance"
+            >
+              <a-input
+                v-model="model.balance"
+              ></a-input>
+            </a-form-model-item>
+          </a-col>
+          <a-col :span="12">
+            <a-form-model-item
+              label="积分"
+              :labelCol="labelCol"
+              :wrapperCol="wrapperCol"
+              prop="integral"
+            >
+              <a-input
+                v-model="model.integral"
+              ></a-input>
+            </a-form-model-item>
+          </a-col>
+        </a-row>
+      </a-form-model>
+    </j-form-container>
+  </a-spin>
+</template>
+
+<script>
+import { httpAction, getAction } from "@/api/manage";
+import { validateDuplicateValue } from "@/utils/util";
+
+export default {
+  name: "BusMemberCardForm",
+  components: {},
+  props: {
+    //表单禁用
+    disabled: {
+      type: Boolean,
+      default: false,
+      required: false,
+    },
+  },
+  data() {
+    return {
+      model: { payType: 1, livingOrderId: "", certType: 1, gender: 1 },
+      labelCol: {
+        xs: { span: 24 },
+        sm: { span: 5 },
+      },
+      wrapperCol: {
+        xs: { span: 24 },
+        sm: { span: 16 },
+      },
+      confirmLoading: false,
+      validatorRules: {
+      },
+      url: {
+        add: "/business/busRoomBookingOrders/booking-to-live",
+        edit: "/business/busMemberCard/edit",
+        queryById: "/business/busMemberCard/queryById",
+      },
+      gradeList: [],
+      paymentMethodList: [],
+      staffList: [],
+      customerList: [],
+      oldcustomerList: [],
+    };
+  },
+  computed: {
+    formDisabled() {
+      return this.disabled;
+    },
+  },
+  created() {
+    var _info = JSON.parse(localStorage.getItem("storeInfo"));
+    if (_info) {
+      this.model.hotelId = _info.id;
+    }
+    //备份model原始值
+    this.modelDefault = JSON.parse(JSON.stringify(this.model));
+    this.getbusCustomer();
+  },
+  methods: {
+    handleSearch(value) {
+      let result;
+      if (!value) {
+        result = this.oldcustomerList;
+      } else {
+        result = this.oldcustomerList.filter((t) => t.name.includes(value));
+      }
+      this.customerList = result;
+    },
+    handleSelectMember(e) {
+      var find = this.customerList.find((t) => t.id === e);
+      this.model.phone = find.phone;
+      this.model.customerName = find.name;
+      this.model.customerId = find.id;
+    },
+    getbusCustomer() {
+      getAction("/bus/busCustomer/list", {}).then((res) => {
+        if (res.success) {
+          this.customerList = res.result.records;
+          this.oldcustomerList = JSON.parse(JSON.stringify(this.customerList));
+        }
+      });
+    },
+    add(livingOrderId, roomId) {
+      this.modelDefault.livingOrderId = livingOrderId;
+      this.modelDefault.roomId = roomId;
+      this.edit(this.modelDefault);
+    },
+    edit(record) {
+      this.model = Object.assign({}, record);
+      this.visible = true;
+    },
+    submitForm() {
+      const that = this;
+      // 触发表单验证
+      this.$refs.form.validate((valid) => {
+        if (valid) {
+          that.confirmLoading = true;
+          // var customers = [];
+          // customers.push({
+          //   certNo: this.model.certNo,
+          //   certType: this.model.certType,
+          //   customerId: this.model.customerId,
+          //   customerName: this.model.customerName,
+          //   gender: this.model.gender,
+          //   phone: this.model.phone,
+          //   roomId: this.model.roomId,
+          // });
+          httpAction("/business/busLivingCustomer/add", this.model, "post")
+            .then((res) => {
+              if (res.success) {
+                that.$message.success("入住成功");
+                that.$emit("ok");
+              } else {
+                that.$message.warning(res.message);
+              }
+            })
+            .finally(() => {
+              that.confirmLoading = false;
+            });
+        }
+      });
+    },
+  },
+};
+</script>

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

@@ -0,0 +1,60 @@
+<template>
+  <j-modal
+    :title="title"
+    :width="width"
+    :visible="visible"
+    switchFullscreen
+    @ok="handleOk"
+    :okButtonProps="{ class:{'jee-hidden': disableSubmit} }"
+    @cancel="handleCancel"
+    cancelText="关闭">
+    <bus-member-card-form ref="realForm" @ok="submitCallback" :disabled="disableSubmit"></bus-member-card-form>
+  </j-modal>
+</template>
+
+<script>
+
+  import BusMemberCardForm from './MemberCardInfo'
+  export default {
+    name: 'BusMemberCardModal',
+    components: {
+      BusMemberCardForm
+    },
+    data () {
+      return {
+        title:'',
+        width:800,
+        visible: false,
+        disableSubmit: false
+      }
+    },
+    methods: {
+      add (livingOrderId,roomId) {
+        this.visible=true
+        this.$nextTick(()=>{
+          this.$refs.realForm.add(livingOrderId,roomId);
+        })
+      },
+      edit (record) {
+        this.visible=true
+        this.$nextTick(()=>{
+          this.$refs.realForm.edit(record);
+        })
+      },
+      close () {
+        this.$emit('close');
+        this.visible = false;
+      },
+      handleOk () {
+        this.$refs.realForm.submitForm();
+      },
+      submitCallback(){
+        this.$emit('ok');
+        this.visible = false;
+      },
+      handleCancel () {
+        this.close()
+      }
+    }
+  }
+</script>