|
|
@@ -42,8 +42,14 @@
|
|
|
@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
|
|
|
+ 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>
|
|
|
@@ -65,7 +71,7 @@
|
|
|
@close.stop="tagClose2(index, item.name)"
|
|
|
v-for="(item, index) in model.rooms"
|
|
|
:key="index"
|
|
|
- >{{ item.name }}</a-tag
|
|
|
+ >{{ item.name }}</a-tag
|
|
|
>
|
|
|
</a-form-model-item>
|
|
|
</a-col>
|
|
|
@@ -83,7 +89,7 @@
|
|
|
tab-position="left"
|
|
|
:style="{ height: '300px' }"
|
|
|
>
|
|
|
- <a-tab-pane
|
|
|
+ <a-tab-pane
|
|
|
tab="全部"
|
|
|
key="room-all"
|
|
|
>
|
|
|
@@ -93,10 +99,17 @@
|
|
|
:span="24"
|
|
|
v-for="(item, index) in (roomList || [])"
|
|
|
:key="index"
|
|
|
+ v-if="item.floorRooms.length > 0"
|
|
|
>
|
|
|
- <div>{{item.buildingName + item.floorName}}</div>
|
|
|
+ <div>{{ item.buildingName + item.floorName }}</div>
|
|
|
<div style="display:flex;flex-wrap:wrap;">
|
|
|
- <div v-for="(r, rIndex) in item.floorRooms" :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
|
|
|
+ v-for="(r, rIndex) in item.floorRooms"
|
|
|
+ :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',
|
|
|
@@ -109,10 +122,10 @@
|
|
|
{{ r.name }}
|
|
|
</div>
|
|
|
</div> -->
|
|
|
- {{ r.name }}
|
|
|
+ {{ r.name }}
|
|
|
</div>
|
|
|
</div>
|
|
|
- </a-col>
|
|
|
+ </a-col>
|
|
|
</a-row>
|
|
|
</div>
|
|
|
</a-tab-pane>
|
|
|
@@ -155,287 +168,288 @@
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-import { httpAction, getAction } from "@/api/manage";
|
|
|
-import { validateDuplicateValue } from "@/utils/util";
|
|
|
+import { httpAction, getAction } from '@/api/manage'
|
|
|
+import { validateDuplicateValue } from '@/utils/util'
|
|
|
export default {
|
|
|
- name: "SelectRoomForm",
|
|
|
+ name: 'SelectRoomForm',
|
|
|
components: {},
|
|
|
props: {
|
|
|
- //表单禁用
|
|
|
+ // 表单禁用
|
|
|
disabled: {
|
|
|
type: Boolean,
|
|
|
default: false,
|
|
|
- required: false,
|
|
|
- },
|
|
|
+ required: false
|
|
|
+ }
|
|
|
},
|
|
|
data() {
|
|
|
- const rooms = [];
|
|
|
+ const rooms = []
|
|
|
for (let i = 0; i < 100; i++) {
|
|
|
rooms.push({
|
|
|
- id: "100" + i,
|
|
|
+ id: '100' + i,
|
|
|
roomNo: 1000 + i,
|
|
|
check: 0,
|
|
|
- kz: i == 1 ? 1 : 0,
|
|
|
- });
|
|
|
+ kz: i == 1 ? 1 : 0
|
|
|
+ })
|
|
|
}
|
|
|
- const rooms2 = [];
|
|
|
+ const rooms2 = []
|
|
|
for (let i = 0; i < 50; i++) {
|
|
|
rooms2.push({
|
|
|
- id: "200" + i,
|
|
|
+ id: '200' + i,
|
|
|
roomNo: 2000 + i,
|
|
|
check: 0,
|
|
|
- kz: i == 5 ? 1 : 0,
|
|
|
- });
|
|
|
+ kz: i == 5 ? 1 : 0
|
|
|
+ })
|
|
|
}
|
|
|
return {
|
|
|
visible: true,
|
|
|
roomList: [
|
|
|
- { key: "1层", child: rooms },
|
|
|
- { key: "2层", child: rooms2 },
|
|
|
+ { key: '1层', child: rooms },
|
|
|
+ { key: '2层', child: rooms2 }
|
|
|
],
|
|
|
roomStatusList: [],
|
|
|
checkedRoomStatusList: [],
|
|
|
roomTypeOptions: [],
|
|
|
roomStatusOptions: [],
|
|
|
- model: { roomType: "", rooms: [] },
|
|
|
+ model: { roomType: '', rooms: [] },
|
|
|
labelCol: {
|
|
|
xs: { span: 24 },
|
|
|
- sm: { span: 2 },
|
|
|
+ sm: { span: 2 }
|
|
|
},
|
|
|
wrapperCol: {
|
|
|
xs: { span: 24 },
|
|
|
- sm: { span: 16 },
|
|
|
+ sm: { span: 16 }
|
|
|
},
|
|
|
confirmLoading: false,
|
|
|
validatorRules: {
|
|
|
- dateRange: [{ required: true, message: "请选择维修时间!" }],
|
|
|
- remark: [{ required: true, message: "请输入维修原因!" }],
|
|
|
+ dateRange: [{ required: true, message: '请选择维修时间!' }],
|
|
|
+ remark: [{ required: true, message: '请输入维修原因!' }]
|
|
|
},
|
|
|
url: {
|
|
|
- add: "/business/busMeetingRoom/add",
|
|
|
- edit: "/business/busMeetingRoom/edit",
|
|
|
- queryById: "/business/busMeetingRoom/queryById",
|
|
|
+ add: '/business/busMeetingRoom/add',
|
|
|
+ edit: '/business/busMeetingRoom/edit',
|
|
|
+ queryById: '/business/busMeetingRoom/queryById'
|
|
|
},
|
|
|
- layoutName: "",
|
|
|
+ layoutName: '',
|
|
|
presetNum: 0,
|
|
|
canUserRooms: [],
|
|
|
oldcanUserRooms: [],
|
|
|
checkLayoutList: [],
|
|
|
roomLayoutList: [],
|
|
|
oldroomList: [],
|
|
|
- kzfLiving: false,
|
|
|
- };
|
|
|
+ kzfLiving: false
|
|
|
+ }
|
|
|
},
|
|
|
computed: {
|
|
|
formDisabled() {
|
|
|
- return this.disabled;
|
|
|
- },
|
|
|
+ return this.disabled
|
|
|
+ }
|
|
|
},
|
|
|
created() {
|
|
|
- var _info = JSON.parse(localStorage.getItem("storeInfo"));
|
|
|
+ var _info = JSON.parse(localStorage.getItem('storeInfo'))
|
|
|
if (_info) {
|
|
|
- this.model.hotelId = _info.id;
|
|
|
+ this.model.hotelId = _info.id
|
|
|
}
|
|
|
- //备份model原始值
|
|
|
- this.modelDefault = JSON.parse(JSON.stringify(this.model));
|
|
|
+ // 备份model原始值
|
|
|
+ this.modelDefault = JSON.parse(JSON.stringify(this.model))
|
|
|
|
|
|
- getAction("/rooms/cesRoomLayout/list", { pageSize: 99999, pageNo: 1 }).then(
|
|
|
+ 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);
|
|
|
- });
|
|
|
- }
|
|
|
+ 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) => {
|
|
|
+ )
|
|
|
+ getAction('/rooms/cesRooms/room-status-color', {}).then((res) => {
|
|
|
if (res.success) {
|
|
|
// this.roomStatusColorList = res.result;
|
|
|
- var list = [];
|
|
|
+ var list = []
|
|
|
res.result.forEach((item) => {
|
|
|
- list.push(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])
|
|
|
+ console.log(list)
|
|
|
+ this.roomStatusOptions = list
|
|
|
+ this.checkChange('', [this.roomStatusOptions[0].value, this.roomStatusOptions[1].value])
|
|
|
}
|
|
|
- });
|
|
|
- getAction("/business/busOtherEmptyDirtyRoom/queryByHotelId", {}).then(
|
|
|
+ })
|
|
|
+ getAction('/business/busOtherEmptyDirtyRoom/queryByHotelId', {}).then(
|
|
|
(res) => {
|
|
|
if (res.success) {
|
|
|
- this.kzfLiving = res.result.status === 1;
|
|
|
+ this.$nextTick(function () {
|
|
|
+ this.kzfLiving = res.result.status === 1
|
|
|
+ })
|
|
|
}
|
|
|
}
|
|
|
- );
|
|
|
+ )
|
|
|
+ // this.$forceUpdate();
|
|
|
},
|
|
|
methods: {
|
|
|
- filterColor(state){
|
|
|
- var color = '';
|
|
|
- let arr = this.roomStatusOptions.filter(item => item.value == state);
|
|
|
- color = arr[0] ? arr[0].extend : '';
|
|
|
- return color;
|
|
|
+ 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);
|
|
|
+ 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.checkedRoomStatusList.push(item.value)
|
|
|
}
|
|
|
this.checkChange()
|
|
|
},
|
|
|
|
|
|
- checkChange(e,stateList) {
|
|
|
- console.log("e", e);
|
|
|
- var list = this.oldroomList;
|
|
|
- console.log(list);
|
|
|
+ checkChange(e, stateList) {
|
|
|
+ console.log('e', e)
|
|
|
+ var list = this.oldroomList
|
|
|
+ console.log(list)
|
|
|
+ debugger
|
|
|
if (this.checkLayoutList.length > 0) {
|
|
|
- list = this.oldroomList.reduce((acc, curr) => {
|
|
|
+ this.roomList = this.oldroomList.reduce((acc, curr) => {
|
|
|
const floorRooms = curr.floorRooms.filter((room) =>
|
|
|
this.checkLayoutList.includes(room.layoutId)
|
|
|
- );
|
|
|
+ )
|
|
|
acc.push({
|
|
|
...curr,
|
|
|
floorRooms
|
|
|
- });
|
|
|
- return acc;
|
|
|
- }, []);
|
|
|
+ })
|
|
|
+ return acc
|
|
|
+ }, [])
|
|
|
}
|
|
|
if (this.checkedRoomStatusList.length > 0) {
|
|
|
- list = list.reduce((acc, curr) => {
|
|
|
+ this.roomList = list.reduce((acc, curr) => {
|
|
|
const floorRooms = curr.floorRooms.filter((room) =>
|
|
|
this.checkedRoomStatusList.includes(
|
|
|
room.roomStatus.toString()
|
|
|
)
|
|
|
- );
|
|
|
+ )
|
|
|
acc.push({
|
|
|
...curr,
|
|
|
floorRooms
|
|
|
- });
|
|
|
- return acc;
|
|
|
- }, []);
|
|
|
- }
|
|
|
- if (this.checkedRoomStatusList.length == 0) {
|
|
|
+ })
|
|
|
+ return acc
|
|
|
+ }, [])
|
|
|
+ } else if (this.checkedRoomStatusList.length == 0) {
|
|
|
let arr = []
|
|
|
- this.roomStatusOptions.forEach(ele=>{
|
|
|
+ this.roomStatusOptions.forEach(ele => {
|
|
|
arr.push(ele.value)
|
|
|
})
|
|
|
- list = list.reduce((acc, curr) => {
|
|
|
+ this.roomList = list.reduce((acc, curr) => {
|
|
|
const floorRooms = curr.floorRooms.filter((room) =>
|
|
|
arr.includes(
|
|
|
room.roomStatus.toString()
|
|
|
)
|
|
|
- );
|
|
|
+ )
|
|
|
acc.push({
|
|
|
...curr,
|
|
|
floorRooms
|
|
|
- });
|
|
|
- return acc;
|
|
|
- }, []);
|
|
|
+ })
|
|
|
+ return acc
|
|
|
+ }, [])
|
|
|
}
|
|
|
if (stateList && stateList.length > 0) {
|
|
|
- list = list.reduce((acc, curr) => {
|
|
|
+ this.roomList = list.reduce((acc, curr) => {
|
|
|
const floorRooms = curr.floorRooms.filter((room) =>
|
|
|
stateList.includes(room.roomStatus.toString())
|
|
|
- );
|
|
|
+ )
|
|
|
acc.push({
|
|
|
...curr,
|
|
|
floorRooms
|
|
|
- });
|
|
|
- return acc;
|
|
|
- }, []);
|
|
|
+ })
|
|
|
+ return acc
|
|
|
+ }, [])
|
|
|
}
|
|
|
- console.log("list2", list);
|
|
|
- this.roomList = list;
|
|
|
},
|
|
|
|
|
|
checkRoomClick(row) {
|
|
|
- console.log(row);
|
|
|
+ console.log(row)
|
|
|
if (!this.kzfLiving && row.roomStatus === 2) {
|
|
|
- this.$message.warning("空脏房不允许入住");
|
|
|
- return;
|
|
|
+ this.$message.warning('空脏房不允许入住')
|
|
|
+ return
|
|
|
}
|
|
|
if (row.check === 1) {
|
|
|
- row.check = 0;
|
|
|
- var index = this.model.rooms.findIndex((t) => t.id == row.id);
|
|
|
- this.model.rooms.splice(index, 1);
|
|
|
+ row.check = 0
|
|
|
+ var index = this.model.rooms.findIndex((t) => t.id == row.id)
|
|
|
+ this.model.rooms.splice(index, 1)
|
|
|
} else {
|
|
|
- row.check = 1;
|
|
|
- this.model.rooms.push(row);
|
|
|
+ row.check = 1
|
|
|
+ this.model.rooms.push(row)
|
|
|
}
|
|
|
},
|
|
|
tagClose2(index, key1) {
|
|
|
- this.model.rooms.splice(index, 1);
|
|
|
+ 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;
|
|
|
+ c.check = 0
|
|
|
+ return true
|
|
|
}
|
|
|
- return false;
|
|
|
- });
|
|
|
+ return false
|
|
|
+ })
|
|
|
if (r === true) {
|
|
|
- return true;
|
|
|
+ return true
|
|
|
}
|
|
|
- });
|
|
|
+ })
|
|
|
},
|
|
|
onChange(e) {
|
|
|
- console.log(e);
|
|
|
- var list = [];
|
|
|
+ console.log(e)
|
|
|
+ var list = []
|
|
|
this.oldroomList.forEach((item) => {
|
|
|
- var floorRooms = [];
|
|
|
+ var floorRooms = []
|
|
|
item.floorRooms.forEach((f) => {
|
|
|
if (e.includes(f.layoutId)) {
|
|
|
- floorRooms.push(f);
|
|
|
+ floorRooms.push(f)
|
|
|
}
|
|
|
- });
|
|
|
- var itemd = JSON.parse(JSON.stringify(item));
|
|
|
- itemd.floorRooms = floorRooms;
|
|
|
- list.push(itemd);
|
|
|
- });
|
|
|
- this.roomList = list;
|
|
|
+ })
|
|
|
+ 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);
|
|
|
+ console.log('this.oldroomList', this.oldroomList)
|
|
|
+ console.log('this.roomList', this.roomList)
|
|
|
this.checkChange()
|
|
|
},
|
|
|
add(row) {
|
|
|
- console.log("canUserRooms", row);
|
|
|
+ console.log('canUserRooms', row)
|
|
|
// this.canUserRooms = row;
|
|
|
- this.oldroomList = JSON.parse(JSON.stringify(row[0].buildingRooms));
|
|
|
+ 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);
|
|
|
+ this.roomList = row[0].buildingRooms
|
|
|
+ this.edit(this.modelDefault)
|
|
|
},
|
|
|
edit(record) {
|
|
|
- this.model = Object.assign({}, 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.model.rooms.push(f)
|
|
|
}
|
|
|
- });
|
|
|
- });
|
|
|
- this.visible = true;
|
|
|
+ })
|
|
|
+ })
|
|
|
+ this.visible = true
|
|
|
},
|
|
|
submitForm() {
|
|
|
- const that = this;
|
|
|
+ const that = this
|
|
|
if (that.model.rooms.length === 0) {
|
|
|
- that.$message.warning("请先选择房间");
|
|
|
- return;
|
|
|
+ that.$message.warning('请先选择房间')
|
|
|
+ return
|
|
|
}
|
|
|
- that.$emit("ok", that.model.rooms);
|
|
|
- },
|
|
|
- },
|
|
|
-};
|
|
|
+ that.$emit('ok', that.model.rooms)
|
|
|
+ }
|
|
|
+ }
|
|
|
+}
|
|
|
</script>
|
|
|
<style scoped>
|
|
|
#components-grid-demo-playground [class~="ant-col"] {
|