소스 검색

Merge branch 'master' of http://49.4.53.36:3000/hotel/hotel-saas-tenant-frontend

gqx 2 년 전
부모
커밋
86ab0aa480

+ 17 - 2
src/views/room/fangtailive.vue

@@ -82,9 +82,8 @@
               type="danger"
               type="danger"
               >联房</a-button
               >联房</a-button
             ><a-button
             ><a-button
-              disabled
               style="margin-bottom: 10px"
               style="margin-bottom: 10px"
-              @click="handleAdd"
+              @click="handleBatchCard"
               type="danger"
               type="danger"
               >批量制卡</a-button
               >批量制卡</a-button
             >
             >
@@ -776,6 +775,8 @@
     ></clean-room-modal>
     ></clean-room-modal>
     <posOrderModal ref="posOrderModal" />
     <posOrderModal ref="posOrderModal" />
     <batchCardModal ref="batchCheckInModal" @ok="modalBatchhFormOk" />
     <batchCardModal ref="batchCheckInModal" @ok="modalBatchhFormOk" />
+    <liveBatchCardModal ref="liveBatchCardModal" @ok="liveBatchCardOk" />
+    <batchCardModalCopy ref="batchCardModalCopy" />
 
 
     <!-- 右键菜单 -->
     <!-- 右键菜单 -->
     <look-room-modalVue ref="lookRoomModalVue" @ok="modalLockRoomFormOk" />
     <look-room-modalVue ref="lookRoomModalVue" @ok="modalLockRoomFormOk" />
@@ -816,6 +817,8 @@ import membermessage from "./membermessage";
 import membergoodsmanage from "./membergoodsmanage";
 import membergoodsmanage from "./membergoodsmanage";
 import fangwuLookRoom from "./fangwuLookRoom.vue";
 import fangwuLookRoom from "./fangwuLookRoom.vue";
 import posOrderModal from "./posOrderModal.vue";
 import posOrderModal from "./posOrderModal.vue";
+import liveBatchCardModal from "./modules/checkIn/liveBatchCardModal.vue";
+import batchCardModalCopy from './modules/checkIn/batchCardModalCopy.vue'
 
 
 import batchCardModal from "./modules/checkIn/batchCardModal.vue";
 import batchCardModal from "./modules/checkIn/batchCardModal.vue";
 
 
@@ -854,6 +857,8 @@ export default {
     exchangeHousesModalVue,
     exchangeHousesModalVue,
     posOrderModal,
     posOrderModal,
     batchCardModal,
     batchCardModal,
+    liveBatchCardModal,
+    batchCardModalCopy
   },
   },
   data() {
   data() {
     return {
     return {
@@ -1057,6 +1062,16 @@ export default {
     // this.$refs.ModalEditScheduleRoom.disableSubmit = false;
     // this.$refs.ModalEditScheduleRoom.disableSubmit = false;
   },
   },
   methods: {
   methods: {
+
+    handleBatchCard() {
+      this.$refs.liveBatchCardModal.visible = true;
+    },
+
+    liveBatchCardOk(e){
+      console.log(e);
+      this.$refs.batchCardModalCopy.edit(e)
+    },
+
     addUnion() {
     addUnion() {
       var selectRoom = [];
       var selectRoom = [];
       this.roomList.forEach((t) => {
       this.roomList.forEach((t) => {

+ 186 - 0
src/views/room/modules/checkIn/batchCardDetailCopy.vue

@@ -0,0 +1,186 @@
+<template>
+<div>
+    <a-card title="批量制卡" style="width: 100%">
+        <div slot="extra" style="display:flex;align-items:center;">
+            <a-switch></a-switch>制卡完毕自动跳转下一张
+        </div>
+        <p>
+            <a-row type="flex" justify="center">
+                <a-col :span="12">
+                    <div style="display:flex;flex-direction:column;justify-content:center;align-items:center;">
+                        <h3 style="color:rgba(42, 130, 228, 1)">
+                            当前房间号
+                        </h3>
+                        <div style="color:#fff;background: rgba(42, 130, 228, 1);line-height:60px;width:50%;text-align:center;border-radius:12px;">
+                            {{roomList[roomIndex] && roomList[roomIndex].name}}
+                        </div>
+                    </div>
+                </a-col>
+                <a-col :span="12">
+                    <div style="display:flex;flex-direction:column;justify-content:flex-end;height:100%;">
+                        <div style="display:flex;align-items:center;justify-content:space-between">
+                            <div>
+                                入住时长:{{'--'}}天
+                            </div>
+                            <div>
+                                已制卡:{{'--'}}张
+                            </div>
+                        </div>
+                        <div>
+                            <!-- 入住时间:{{roomList[roomIndex] && roomList[roomIndex].Info.arrivalTime2}} -->
+                            入住时间:{{'--'}}
+                        </div>
+                        <div>
+                            <!-- 预离时间:{{roomList[roomIndex] && roomList[roomIndex].Info.dueOutTime2}} -->
+                            预离时间:{{'--'}}
+                        </div>
+                    </div>
+                </a-col>
+            </a-row>
+        </p>
+        <p>
+            <a-row :gutter="[6,6]">
+                <a-col :span="5">
+                    <a-button @click="changeErr">制新卡</a-button>
+                </a-col>
+                <a-col :span="5">
+                    <a-button @click="changeErr">复制卡</a-button>
+                </a-col>
+                <a-col :span="4">
+                    <a-button @click="changeErr">读卡</a-button>
+                </a-col>
+                <a-col :span="4">
+                    <a-button @click="changeErr">注销</a-button>
+                </a-col>
+                <a-col :span="5" v-if="roomIndex>0">
+                    <a-button @click="handleCutRoom">上一张</a-button>
+                </a-col>
+                <a-col :span="5" v-if="roomIndex<roomList.length-1">
+                    <a-button @click="handleAddRoom">下一张</a-button>
+                </a-col>
+            </a-row>
+        </p>
+        <p>
+            <a-table ref="table" size="middle" :scroll="{ x: '100%' }" bordered rowKey="id" :columns="columns" :dataSource="roomList" :pagination="ipagination" :loading="loading" class="j-table-force-nowrap">
+                <span slot="state" slot-scope="record">
+                    {{record?'已制卡':''}}
+                    <!-- {{record}} -->
+                </span>
+                <!-- <template slot="num" slot-scope="text, record, index">
+                    {{ (ipagination.current-1)*ipagination.pageSize+index+1}}
+                </template> -->
+                <span slot="action" slot-scope="text, record">
+                    <a @click="ok(record)">选择</a>
+                </span>
+            </a-table>
+        </p>
+    </a-card>
+</div>
+</template>
+
+<script>
+export default {
+    data() {
+        return {
+            // 表头
+            columns: [
+                // {
+                //     title: "序号",
+                //     align: "center",
+                //     loading:false,
+                //     width: 60,
+                //     scopedSlots: {
+                //         customRender: 'num'
+                //     }
+                // },
+                {
+                    title: "房间号",
+                    align: "center",
+                    dataIndex: "name",
+                },
+                {
+                    title: "房型",
+                    align: "center",
+                    dataIndex: "layoutName",
+                },
+                {
+                    title: "住客姓名",
+                    align: "center",
+                    dataIndex: "roomInfo.key1",
+                },
+                {
+                    title: "手机号码",
+                    align: "center",
+                    dataIndex: "roomInfo.key5",
+                },
+                {
+                    title: "",
+                    align: "center",
+                    dataIndex: "iscard",
+                }
+            ],
+            ipagination:{},
+            dataSource:[],
+            loading:false,
+            roomList:[],
+            roomIndex:0,
+        }
+    },
+    methods: {
+        changeErr(){
+            this.$message.error('接口程序未打开,请打开接口程序')
+        },
+        handleAddRoom(){
+            console.log(this.roomIndex);
+            if (this.roomIndex == this.roomList.length-1) {
+                this.$message.error('已经是最后一间了')
+                return                
+            }else{
+                this.roomIndex++;
+            }
+        },
+        handleCutRoom(){
+            console.log(this.roomIndex);
+            if (this.roomIndex == 0) {
+                this.$message.error('已经是第一间了')
+                return                
+            }
+            this.roomIndex--;
+        },
+        edit(record){
+            console.log(record);
+            // let arr = []
+            // arr = record.roomPrices
+            // console.log(arr);
+            // arr.forEach(ele=>{
+            //     ele.roomInfo = record.roomIds.filter(item=> item.roomId==ele.roomId)[0]
+            //     ele.Info = record.orderInfo
+            // })
+            // console.log(arr);
+            this.roomList = record;
+        },
+        submitForm(){
+            this.$emit('ok')
+        }
+    }
+}
+</script>
+
+<style scoped>
+/deep/.ant-table-thead > tr > th {
+  background: rgba(42, 130, 228, 1);
+  color: #ffffff;
+}
+/deep/.ant-divider-horizontal {
+  margin: 12px 0 !important;
+}
+/deep/ .ant-table-tbody .ant-table-row td {
+  padding-top: 5px;
+  padding-bottom: 5px;
+}
+/deep/.ant-table-thead > tr > th,
+.ant-table-tbody > tr > td {
+  padding: 5px 5px !important;
+  overflow-wrap: break-word;
+}
+</style>

+ 59 - 0
src/views/room/modules/checkIn/batchCardModalCopy.vue

@@ -0,0 +1,59 @@
+<template>
+  <j-modal
+    :title="title"
+    :width="width"
+    :visible="visible"
+    @ok="handleOk"
+    :okButtonProps="{ class:{'jee-hidden': disableSubmit} }"
+    @cancel="handleOk"
+    cancelText="关闭">
+    <pos-type-form ref="realForm" @ok="submitCallback" :disabled="disableSubmit"></pos-type-form>
+  </j-modal>
+</template>
+
+<script>
+
+  import PosTypeForm from './batchCardDetailCopy.vue'
+  export default {
+    name: 'PosTypeModal',
+    components: {
+      PosTypeForm
+    },
+    data () {
+      return {
+        title:'',
+        width:500,
+        visible: false,
+        disableSubmit: false
+      }
+    },
+    methods: {
+      add () {
+        this.visible=true
+        this.$nextTick(()=>{
+          this.$refs.realForm.add();
+        })
+      },
+      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>

+ 500 - 0
src/views/room/modules/checkIn/liveBatchCardForm.vue

@@ -0,0 +1,500 @@
+<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="24">
+            <a-form-model-item
+              label="房型"
+              :labelCol="labelCol"
+              :wrapperCol="wrapperCol"
+            >
+              <a-checkbox-group @change="checkChange" v-model="checkLayoutList">
+                <a-row>
+                  <a-col
+                    :span="6"
+                    v-for="(item, index) in roomLayoutList"
+                    :key="item.id"
+                  >
+                    <a-checkbox :value="item.id">
+                      {{ item.name }}
+                    </a-checkbox>
+                  </a-col>
+                </a-row>
+              </a-checkbox-group>
+            </a-form-model-item>
+          </a-col>
+          <a-col :span="24">
+            <a-form-model-item
+              label="房态"
+              :labelCol="labelCol"
+              :wrapperCol="wrapperCol"
+              prop="roomStatus"
+            >
+              <!-- <a-checkbox-group
+                v-model="checkedRoomStatusList"
+                :options="roomStatusOptions"
+                @change="checkChange"
+              /> -->
+              <div style="display:flex;flex-wrap:wrap;">
+                <div v-for="(item, index) in roomStatusOptions" :class="{'check':checkedRoomStatusList.some(ele=> ele==item.value)}" :key="index" class="nocheck room-status" :style="{borderLeft:`2px solid ${item.extend}`}" @click="roomStatusChange(item, index)">
+                  {{item.label}}
+                </div>
+              </div>
+            </a-form-model-item>
+          </a-col>
+          <a-col :span="24">
+            <a-form-model-item
+              label="已选"
+              :labelCol="labelCol"
+              :wrapperCol="{
+                xs: { span: 24 },
+                sm: { span: 20 },
+              }"
+              prop="roomStatus"
+            >
+              <a-tag
+                color="blue"
+                closable
+                :visible="visible"
+                @close.stop="tagClose2(index, item.name)"
+                v-for="(item, index) in model.rooms"
+                :key="index"
+                >{{ item.name }}</a-tag
+              >
+            </a-form-model-item>
+          </a-col>
+          <a-col :span="24">
+            <a-form-model-item
+              label="房间"
+              :labelCol="labelCol"
+              :wrapperCol="{
+                xs: { span: 24 },
+                sm: { span: 20 },
+              }"
+            >
+              <!-- <a-tabs
+                default-active-key="room-all"
+                tab-position="left"
+                :style="{ height: '300px' }"
+              >
+              <a-tab-pane
+                  tab="全部"
+                  key="room-all"
+                > -->
+                  <div>
+                    <a-row :gutter="[8, 8]" style="overflow: auto;height:300px;">
+                      <a-col
+                        :span="24"
+                        v-for="(item, index) in (roomList || [])"
+                        :key="index"
+                      >
+                        <div>{{item.name}}</div>
+                        <div style="display:flex;flex-wrap:wrap;">
+                            <div v-for="(r, rIndex) in item.rooms" :style="{'border-left-color':filterColor(r.roomStatus)}" @click="checkRoomClick(r)" :key="'floorRooms' + rIndex" :class="[r.check == 1 ? 'check' : 'nocheck', r.kz == 1 ? 'kz' : '',]" class="nocheck room-status">
+                            <!-- <div 
+                            :class="[
+                              r.check == 1 ? 'check' : 'nocheck',
+                              r.kz == 1 ? 'kz' : '',
+                            ]"
+                            style="display:flex;flex-wrap:wrap;"
+                            @click="checkRoomClick(r)"
+                          >
+                            <div class="nocheck room-status">
+                              {{ r.name }}
+                            </div>
+                          </div> -->
+                          {{ r.name }}
+                          </div>
+                        </div>
+                        </a-col>
+                    </a-row>
+                  </div>
+                <!-- </a-tab-pane>
+                <a-tab-pane
+                  v-for="(room, index) in roomList"
+                  :key="'room' + index"
+                  :tab="room.name"
+                >
+                  <div
+                    id="components-grid-demo-playground"
+                    style="height: 300px; overflow: hidden auto"
+                  >
+                    <a-row :gutter="[8, 8]">
+                      <a-col
+                        :span="3"
+                        v-for="(r, rIndex) in room.rooms"
+                        :key="'floorRooms' + rIndex"
+                      >
+                        <div
+                          :class="[
+                            r.check == 1 ? 'check' : 'nocheck',
+                            r.kz == 1 ? 'kz' : '',
+                          ]"
+                          :style="{'border-left-color':filterColor(r.roomStatus)}"
+                          @click="checkRoomClick(r)"
+                        >
+                          {{ r.name }}
+                        </div></a-col
+                      >
+                    </a-row>
+                  </div>
+                </a-tab-pane>
+              </a-tabs> -->
+            </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: "SelectRoomForm",
+  components: {},
+  props: {
+    //表单禁用
+    disabled: {
+      type: Boolean,
+      default: false,
+      required: false,
+    },
+  },
+  data() {
+    const rooms = [];
+    for (let i = 0; i < 100; i++) {
+      rooms.push({
+        id: "100" + i,
+        roomNo: 1000 + i,
+        check: 0,
+        kz: i == 1 ? 1 : 0,
+      });
+    }
+    const rooms2 = [];
+    for (let i = 0; i < 50; i++) {
+      rooms2.push({
+        id: "200" + i,
+        roomNo: 2000 + i,
+        check: 0,
+        kz: i == 5 ? 1 : 0,
+      });
+    }
+    return {
+      visible: true,
+      roomList: [
+        // { key: "1层", child: rooms },
+        // { key: "2层", child: rooms2 },
+      ],
+      roomStatusList: [],
+      checkedRoomStatusList: [],
+      roomTypeOptions: [],
+      roomStatusOptions: [],
+      model: { roomType: "", rooms: [] },
+      labelCol: {
+        xs: { span: 24 },
+        sm: { span: 2 },
+      },
+      wrapperCol: {
+        xs: { span: 24 },
+        sm: { span: 16 },
+      },
+      confirmLoading: false,
+      validatorRules: {
+        dateRange: [{ required: true, message: "请选择维修时间!" }],
+        remark: [{ required: true, message: "请输入维修原因!" }],
+      },
+      url: {
+        add: "/business/busMeetingRoom/add",
+        edit: "/business/busMeetingRoom/edit",
+        queryById: "/business/busMeetingRoom/queryById",
+      },
+      layoutName: "",
+      presetNum: 0,
+      canUserRooms: [],
+      oldcanUserRooms: [],
+      checkLayoutList: [],
+      roomLayoutList: [],
+      oldroomList: [],
+      kzfLiving: false,
+    };
+  },
+  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));
+
+    getAction("/rooms/cesRoomLayout/list", { pageSize: 99999, pageNo: 1 }).then(
+      (res) => {
+        if (res.success) {
+          this.roomLayoutList = res.result.records;
+          if (this.roomLayoutList && this.roomLayoutList.length > 0) {
+            this.roomLayoutList.forEach((item) => {
+              this.checkLayoutList.push(item.id);
+            });
+          }
+        }
+      }
+    );
+    getAction("/rooms/cesRooms/room-status-color", {}).then((res) => {
+            if (res.success) {
+                // this.roomStatusColorList = res.result;
+                var list = [];
+                res.result.forEach((item) => {
+                    list.push(item);
+                });
+                // list = list.filter(item => item.label == '空净' || item.label == '空脏')
+                console.log(list);
+                this.roomStatusOptions = list;
+                this.checkChange('',[this.roomStatusOptions[0].value,this.roomStatusOptions[1].value])
+            }
+        });
+    getAction("/business/busOtherEmptyDirtyRoom/queryByHotelId", {}).then(
+        (res) => {
+          if (res.success) {
+            this.kzfLiving = res.result.status === 1;
+          }
+        }
+      );
+    this.getData()
+  },
+  methods: {
+    filterColor(state){
+      var color = '';
+      let arr = this.roomStatusOptions.filter(item => item.value == state);
+      color = arr[0] ? arr[0].extend : '';
+      return color;
+    },
+
+    roomStatusChange(item, index){
+      console.log('roomStatusChange');
+      if (this.checkedRoomStatusList.some(ele=> ele==item.value)) {
+        var index = this.checkedRoomStatusList.findIndex((t) => t == item.value);
+        this.checkedRoomStatusList.splice(index, 1);
+      } else {
+        this.checkedRoomStatusList.push(item.value);        
+      }
+      this.checkChange()
+    },
+
+    checkChange(e,stateList) {
+            console.log("e", e);
+            var list = this.oldroomList;
+            console.log(list);
+            console.log(this.checkedRoomStatusList);
+            if (this.checkLayoutList.length > 0) {
+                list = this.oldroomList.reduce((acc, curr) => {
+                    const rooms = curr.rooms.filter((room) =>
+                        this.checkLayoutList.includes(room.layoutId)
+                    );
+                    acc.push({
+                        ...curr,
+                        rooms
+                    });
+                    return acc;
+                }, []);
+            }
+            if (this.checkedRoomStatusList.length > 0) {
+                list = list.reduce((acc, curr) => {
+                    const rooms = curr.rooms.filter((room) =>
+                        this.checkedRoomStatusList.includes(
+                            room.roomStatus.toString()
+                        )
+                    );
+                    acc.push({
+                        ...curr,
+                        rooms
+                    });
+                    return acc;
+                }, []);
+            }
+            if (this.checkedRoomStatusList.length == 0) {
+              let arr = []
+              this.roomStatusOptions.forEach(ele=>{
+                arr.push(ele.value)
+              })
+              list = list.reduce((acc, curr) => {
+                  const rooms = curr.rooms.filter((room) =>
+                      arr.includes(
+                          room.roomStatus.toString()
+                      )
+                  );
+                  acc.push({
+                      ...curr,
+                      rooms
+                  });
+                  return acc;
+              }, []);
+            }
+            if (stateList && stateList.length > 0) {
+                list = list.reduce((acc, curr) => {
+                    const rooms = curr.rooms.filter((room) =>
+                        stateList.includes(room.roomStatus.toString())
+                    );
+                    acc.push({
+                        ...curr,
+                        rooms
+                    });
+                    return acc;
+                }, []);              
+            }
+            console.log("list2", list);
+            this.roomList = list;
+        },
+
+    checkRoomClick(row) {
+      console.log(row);
+      if (!this.kzfLiving && row.roomStatus === 2) {
+            this.$message.warning("空脏房不允许入住");
+            return;
+          }
+      if (row.check === 1) {
+        row.check = 0;
+        var index = this.model.rooms.findIndex((t) => t.key1 == row.key1);
+        this.model.rooms.splice(index, 1);
+      } else {
+        row.check = 1;
+        this.model.rooms.push(row);
+      }
+    },
+    tagClose2(index, key1) {
+      this.model.rooms.splice(index, 1);
+      this.roomList.some((t) => {
+        var r = t.floorRooms.some((c) => {
+          if (c.name === key1) {
+            c.check = 0;
+            return true;
+          }
+          return false;
+        });
+        if (r === true) {
+          return true;
+        }
+      });
+    },
+    onChange(e) {
+      console.log(e);
+      var list = [];
+      this.oldroomList.forEach((item) => {
+        var floorRooms = [];
+        item.floorRooms.forEach((f) => {
+          if (e.includes(f.layoutId)) {
+            floorRooms.push(f);
+          }
+        });
+        var itemd = JSON.parse(JSON.stringify(item));
+        itemd.floorRooms = floorRooms;
+        list.push(itemd);
+      });
+      this.roomList = list;
+      // result = this.oldcustomerList.filter((t) => t.name.includes(value));
+      console.log("this.oldroomList", this.oldroomList);
+      console.log("this.roomList", this.roomList);
+      this.checkChange()
+    },
+    add(row) {
+      console.log("canUserRooms", row);
+      // this.canUserRooms = row;
+      this.oldroomList = JSON.parse(JSON.stringify(row[0].buildingRooms));
+
+      // this.layoutName = row.layout.name;
+      // this.presetNum = row.layout.presetNum;
+      this.roomList = row[0].buildingRooms;
+      this.edit(this.modelDefault);
+    },
+    edit(record) {
+      this.model = Object.assign({}, record);
+      this.roomList.forEach((t) => {
+        t.floorRooms.forEach((f) => {
+          if (f.check && f.check == 1) {
+            this.model.rooms.push(f);
+          }
+        });
+      });
+      this.visible = true;
+    },
+    getData(){
+      getAction("/business/busRoomBookingOrders/rili-fangtai").then((res) => {
+        if (res.success) {
+          this.roomList = res.result.floorRoomVos;
+          this.oldroomList = JSON.parse(JSON.stringify(res.result.floorRoomVos));
+        }
+      });
+    },
+    submitForm() {
+      const that = this;
+      if (that.model.rooms.length === 0) {
+        that.$message.warning("请先选择房间");
+        return;
+      }
+      that.$emit("ok", that.model.rooms);
+    },
+  },
+};
+</script>
+<style scoped>
+#components-grid-demo-playground [class~="ant-col"] {
+  background: transparent;
+  border: 0;
+}
+#components-grid-demo-playground [class~="ant-col"] > div {
+  /* background: #00a0e9; */
+  height: 28px;
+  line-height: 28px;
+  font-size: 13px;
+  text-align: center;
+  cursor: pointer;
+  border-radius: 5px;
+}
+#components-grid-demo-playground .check {
+  border: 1px solid #00a0e9;
+}
+#components-grid-demo-playground .kz {
+  background: rgba(166, 166, 166, 1);
+}
+#components-grid-demo-playground pre {
+  background: #f9f9f9;
+  border-radius: 6px;
+  font-size: 13px;
+  padding: 8px 16px;
+}
+#components-grid-demo-playground .nocheck {
+  border: 1px solid #cccccc;
+  border-left-width: 2px;
+}
+.check {
+  border: 1px solid #00a0e9 !important;
+}
+.nocheck {
+  border: 1px solid #cccccc;
+}
+.room-status{
+  /* height: 100%; */
+  /* line-height: 100%; */
+  font-size: 13px;
+  text-align: center;
+  cursor: pointer;
+  border-radius: 5px;
+  margin-right: 10px;
+  border: 1px solid #cccccc;
+  padding: 0px 16px;
+  margin-top: 5px;
+  border-left-width: 2px;
+  border-left-style: solid;
+}
+</style>

+ 65 - 0
src/views/room/modules/checkIn/liveBatchCardModal.vue

@@ -0,0 +1,65 @@
+<template>
+  <j-modal
+    :title="title"
+    :width="width"
+    :visible="visible"
+    switchFullscreen
+    @ok="handleOk"
+    :okButtonProps="{ class: { 'jee-hidden': disableSubmit } }"
+    @cancel="handleCancel"
+    cancelText="关闭"
+  >
+    <select-room-form
+      ref="realForm"
+      @ok="submitCallback"
+      :disabled="disableSubmit"
+    ></select-room-form>
+  </j-modal>
+</template>
+
+<script>
+import SelectRoomForm from "./liveBatchCardForm.vue";
+export default {
+  name: "SelectRoomFormModal",
+  components: {
+    SelectRoomForm,
+  },
+  data() {
+    return {
+      title: "选择制卡房间号",
+      width: 800,
+      visible: false,
+      disableSubmit: false,
+    };
+  },
+  methods: {
+    add(row) {
+      this.visible = true;
+      this.$nextTick(() => {
+        this.$refs.realForm.add(row);
+      });
+    },
+    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(e) {
+      console.log("e", e);
+      this.$emit("ok", e);
+      this.visible = false;
+    },
+    handleCancel() {
+      this.close();
+    },
+  },
+};
+</script>