addRoom.jsx 4.0KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596
  1. import withLayout from '@/layouts'
  2. import Taro from '@tarojs/taro'
  3. import CustomNav from '@/components/CustomNav'
  4. import { useEffect, useState } from "react"
  5. import './addRoom.less'
  6. import { saveRoom, getHotelDetail } from '@/services/landlord'
  7. export default withLayout((props) => {
  8. const { hotelId, hotelName } = props.router.params
  9. const [roomModel, setRoomModel] = useState({
  10. hotelId,
  11. roomName: '',
  12. address: '',
  13. location: '',
  14. parkingAddress: '',
  15. parkingLocation: '',
  16. wifiName: '',
  17. wifiPassword: '',
  18. weight: '',
  19. })
  20. const onRoomMap = () => {
  21. Taro.chooseLocation().then((res) => {
  22. setRoomModel({ ...roomModel, location: res.longitude + ',' + res.latitude })
  23. })
  24. }
  25. const onParkMap = () => {
  26. Taro.chooseLocation().then((res) => {
  27. setRoomModel({ ...roomModel, parkingLocation: res.longitude + ',' + res.latitude })
  28. })
  29. }
  30. const sumbit = () => {
  31. if(
  32. roomModel.roomName!=''&&
  33. roomModel.address!=''&&
  34. roomModel.location!=''&&
  35. roomModel.weight!=''
  36. )
  37. {
  38. saveRoom(roomModel).then(() => {
  39. Taro.showModal({
  40. title: '保存成功',
  41. showCancel:false
  42. }).then(() => {
  43. Taro.navigateBack()
  44. })
  45. })
  46. } else{
  47. Taro.showToast({
  48. title: '有必填项未填哦',
  49. icon: 'none',
  50. })
  51. }
  52. }
  53. return (
  54. <view className='page-index'>
  55. <CustomNav title={hotelName} />
  56. <view className='from-room' >
  57. <mp-form models={roomModel} >
  58. <mp-cells title='请填写新增的房源信息' footer=' ' >
  59. <mp-cell prop='roomName' title='房屋名称:' extClass='font'>
  60. <input focus dataField='roomName' onInput={(e) => setRoomModel({ ...roomModel, roomName: e.detail.value })} value={roomModel.roomName} placeholder='请输入房屋名称(必填)' />
  61. </mp-cell>
  62. <mp-cell prop='address' title='位置信息:' extClass='font'>
  63. <input dataField='address' onInput={(e) => setRoomModel({ ...roomModel, address: e.detail.value })} value={roomModel.address} placeholder='请输入房屋位置(必填)' />
  64. </mp-cell>
  65. <mp-cell prop='location' title='定位经纬度:' extClass='font'>
  66. <label onClick={onRoomMap}>{roomModel.location == '' ? '房间定位(必填)' : roomModel.location}</label>
  67. </mp-cell>
  68. <mp-cell prop='parkingAddress' title='停车场位置:' extClass='font'>
  69. <input dataField='parkingAddress' onInput={(e) => setRoomModel({ ...roomModel, parkingAddress: e.detail.value })} value={roomModel.parkingAddress} placeholder='请输入停车场位置' />
  70. </mp-cell>
  71. <mp-cell prop='parkingLocation' title='定位经纬度:' extClass='font'>
  72. <label onClick={onParkMap}>{roomModel.parkingLocation == '' ? '停车场定位' : roomModel.parkingLocation}</label>
  73. </mp-cell>
  74. <mp-cell prop='wifiName' title='Wi-Fi名称:' extClass='font'>
  75. <input dataField='wifiName' onInput={(e) => setRoomModel({ ...roomModel, wifiName: e.detail.value })} value={roomModel.wifiName} placeholder='请输入wifi名称' />
  76. </mp-cell>
  77. <mp-cell prop='wifiPassword' title='Wi-Fi密码:' extClass='font'>
  78. <input dataField='wifiPassword' onInput={(e) => setRoomModel({ ...roomModel, wifiPassword: e.detail.value })} value={roomModel.wifiPassword} placeholder='请输入wifi密码' />
  79. </mp-cell>
  80. <mp-cell prop='weight' title='权重:' extClass='font'>
  81. <input type='number' dataField='weight' onInput={(e) => setRoomModel({ ...roomModel, weight: e.detail.value })} placeholder='请输入权重(必填)' />
  82. </mp-cell>
  83. <mp-cell>
  84. <button className='button-OK' onClick={sumbit}>确定</button>
  85. </mp-cell>
  86. </mp-cells>
  87. </mp-form>
  88. </view>
  89. </view>
  90. )
  91. })