houseadd.vue 7.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190
  1. <template>
  2. <view class="check">
  3. <view class="cbox">
  4. <view class="chtop flexc">
  5. <view class="line"></view>
  6. <view>房屋信息</view>
  7. </view>
  8. <view class="chmain">
  9. <uni-forms ref="form" :model="datainfo" :rules="rules">
  10. <uni-forms-item label="房屋坐落" required name="location">
  11. <view class="flexc">
  12. <uni-easyinput :disabled="isdisabled" v-model="datainfo.location" :inputBorder='false' placeholder="请输入房屋坐落" />
  13. <view class="rimg"></view>
  14. </view>
  15. </uni-forms-item>
  16. <uni-forms-item label="权利人姓名" name="ownerName">
  17. <view class="flexc">
  18. <uni-easyinput :disabled="isdisabled" v-model="datainfo.ownerName" :inputBorder='false' placeholder="请输入权利人姓名" />
  19. <view class="rimg"></view>
  20. </view>
  21. </uni-forms-item>
  22. <uni-forms-item label="建筑面积" required name="area">
  23. <view class="flexc">
  24. <uni-easyinput :disabled="isdisabled" v-model="datainfo.area" :inputBorder='false' placeholder="请输入建筑面积" />
  25. <view class="tips">m²</view>
  26. <view class="rimg"></view>
  27. </view>
  28. </uni-forms-item>
  29. <uni-forms-item label="小区名称" name="communityName">
  30. <view class="flexc">
  31. <uni-easyinput :disabled="isdisabled" v-model="datainfo.communityName" :inputBorder='false' placeholder="请输入小区名称" />
  32. <view class="rimg"></view>
  33. </view>
  34. </uni-forms-item>
  35. <uni-forms-item label="门牌号" required name="detailedAddress">
  36. <view class="flexc">
  37. <uni-easyinput :disabled="isdisabled" v-model="datainfo.detailedAddress" :inputBorder='false' placeholder="请输入门牌号" />
  38. <view class="rimg"></view>
  39. </view>
  40. </uni-forms-item>
  41. <uni-forms-item label="有无车位" name="hasParkingSpace">
  42. <picker range-key='dictLabel' :disabled="isdisabled" :value="ywcwidx" :range="ywcwList" @change='bindDateChanged'>
  43. <view class="flexc">
  44. <view class="flex1 txr f13 co27" v-if="datainfo.hasParkingSpace&&!ywcw">{{statusFormats(datainfo.hasParkingSpace,ywcwList,'ywcw')}}</view>
  45. <view class="flex1 txr f13" v-else :class="ywcw?'co27':'coa'">{{ywcw||"请选择有/无"}}</view>
  46. <view class="rimg"><image :src="rimg"></image></view>
  47. </view>
  48. </picker>
  49. </uni-forms-item>
  50. <uni-forms-item label="车位号" name="phonenumber">
  51. <view class="flexc">
  52. <uni-easyinput :disabled="isdisabled" v-model="datainfo.phonenumber" :inputBorder='false' placeholder="请输入车位号" />
  53. <view class="rimg"></view>
  54. </view>
  55. </uni-forms-item>
  56. </uni-forms>
  57. <view class="rhbtn mt30" @click="getSubmit">确定添加</view>
  58. </view>
  59. </view>
  60. <loading></loading>
  61. </view>
  62. </template>
  63. <script>
  64. import config from '@/config'
  65. import { checkPermi, checkRole } from "@/utils/permission"; // 权限判断函数
  66. import {uploadIdentify,selectValueKey,geocodeAddress} from '@/utils/common.js'
  67. import {getDictionaryFn} from "@/api/system/user.js"
  68. import {houseInfoAdd,houseInfoPut,houseInfoDet} from "@/api/work/work.js"
  69. export default{
  70. components:{},
  71. data(){
  72. return{
  73. rimg: require('@/people/static/people/rimg.png'),
  74. cmico:require('@/people/static/people/cmico.png'),
  75. baseUrl:config.baseUrl,
  76. datainfo:{
  77. // "houseId":"",//房屋信息主键
  78. "ownerName":"",//权利人姓名
  79. "location":"",//房屋坐落位置
  80. "rightType":"",//权利类型,如所有权、使用权等
  81. "area":"",//房屋面积,单位为平方米
  82. // "documentNumber":"",//房屋相关的字第号
  83. // "propertyUnitNumber":"",//不动产单元号
  84. // "coOwnership":"",//房屋的共有情况,如共有比例等
  85. // "usageType":"",//房屋用途,如住宅、商业等
  86. // "usagePeriod":"",//房屋使用期限
  87. // "registrationDate":"",//房屋登记日期
  88. // "coOwner":"",//共有人姓名,多个共有人可以用逗号分隔
  89. "detailedAddress":"",//房屋的详细门牌号
  90. "hasParkingSpace":"",//是否有车位,Y表示有,N表示无
  91. "communityName":"",//房屋所在小区名称
  92. // "houseStatus":""//房屋状态:1-自住,2-出租,3-空闲,4-待售
  93. },
  94. rules: {
  95. location: {rules: [{required: true,errorMessage: '请输入房屋坐落位置' }]},
  96. detailedAddress: {rules: [{required: true,errorMessage: '请输入详细门牌号' }]},
  97. area: {rules: [{required: true,errorMessage: '请输入面积' }]},
  98. },
  99. id:'',
  100. ptype:'add',
  101. fwzt:'',
  102. qllx:'',
  103. fwyt:'',
  104. ywcw:'',
  105. fwztidx:'',
  106. qllxidx:'',
  107. fwytidx:'',
  108. ywcwidx:'',
  109. fwztList:[],
  110. qllxList:[],
  111. fwytList:[],
  112. ywcwList:[{dictLabel:'有',dictValue:'Y'},{dictLabel:'无',dictValue:'N'},],
  113. isdisabled:false,
  114. latitude:'',
  115. longitude:"",
  116. }
  117. },
  118. onLoad: function(e) {
  119. // this.init()
  120. },
  121. methods:{
  122. checkPermi, checkRole,
  123. statusFormats(data, list,type) {
  124. var aite=selectValueKey(list, data);
  125. if(type=='ywcw'){
  126. this.ywcwidx=aite.key;
  127. }
  128. return aite.actions;
  129. },
  130. bindDateChanged(e){
  131. var val=e.detail.value;
  132. this.datainfo.hasParkingSpace=this.ywcwList[val].dictValue;
  133. this.ywcw=this.ywcwList[val].dictLabel;
  134. },
  135. getSubmit(){
  136. this.$refs.form.validate().then(res => {
  137. var params=JSON.parse(JSON.stringify(this.datainfo))
  138. houseInfoAdd(params).then(res=>{
  139. if(res.code==200){
  140. this.$toast("新增成功")
  141. setTimeout(function(){
  142. uni.$emit("refHouseList")
  143. uni.navigateBack({
  144. delta:1
  145. })
  146. },1500)
  147. }
  148. })
  149. })
  150. },
  151. }
  152. }
  153. </script>
  154. <style>
  155. page{background: #F3F3F0;}
  156. </style>
  157. <style lang="scss" scoped>
  158. .coa /deep/ .uni-date__x-input{text-align: right;color: #AAAAAA;}
  159. .check /deep/ .uni-date-editor--x__disabled{opacity: 1;}
  160. .check /deep/ .uni-forms-item{min-height: 106rpx;box-sizing: border-box;display: flex;align-items: center;margin-bottom: 0;border-bottom: 2rpx solid #E6E6E6;padding:10rpx 0;}
  161. .check /deep/ .uni-forms-item__label{font-weight: bold;font-size: 26rpx;color: #222327;flex: 0 0 auto;width: auto !important;}
  162. .check /deep/ .uni-easyinput{flex: 1;text-align: right;font-size: 26rpx;color: #222327;}
  163. .check /deep/ .uni-easyinput__content-textarea{min-height: 40rpx;font-size: 26rpx;}
  164. .check /deep/ .uni-easyinput__placeholder-class{font-size: 26rpx;color: #AAAAAA;}
  165. .check /deep/ .uni-input-input{font-size: 26rpx;}
  166. .check /deep/ .uni-textarea-textarea{font-size: 26rpx;}
  167. .check /deep/ .uni-forms-item__label text{width: 110rpx;text-align-last: justify;}
  168. .check /deep/ .uni-forms-item__label .is-required{width: auto;}
  169. .check /deep/ .is-disabled{color: #222327;background-color: #ffffff !important;}
  170. .check{min-height: 100vh;padding: 20rpx 18rpx 22rpx;box-sizing: border-box;display: flex;box-sizing: border-box;}
  171. .cbox{background: #FFFFFF;border-radius: 20rpx;flex: 1;padding-bottom: 28rpx;
  172. .chtop{padding-top: 32rpx;margin-bottom: 22rpx;
  173. .line{width: 14rpx;height: 48rpx;background: #0256FD;border-radius:0 12rpx 12rpx 0;margin-right: 18rpx;}
  174. view{font-weight: bold;font-size: 32rpx;color: #272727;}
  175. }
  176. .chmain{
  177. padding: 0 32rpx;
  178. .upbox{height: 224rpx;background: #EFF4FF;border-radius: 20rpx;display: flex;align-items: center;justify-content: center;flex-direction: column;margin-bottom: 8rpx;overflow: auto;
  179. .img{width: 100%;height: 100%;}
  180. .addimg{width: 90rpx;height: 90rpx;margin-bottom: 8rpx;}
  181. view{font-weight: bold;font-size: 26rpx;color: #4C6686;}
  182. }
  183. }
  184. .rimg{width: 16rpx;height: 28rpx;flex: 0 0 auto;margin-left: 20rpx;
  185. image{width: 100%;height: 100%;}
  186. }
  187. }
  188. .tips{font-weight: bold;color: #272727;font-size: 26rpx;margin-left: 8rpx;}
  189. </style>