liukangdong
2025-02-08 b1e21adbd4fccedc31701f2564b01cabe9941a5f
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
<template>
  <GlobalWindow width="720px" :title="title" :visible.sync="visible" :confirm-working="isWorking" @confirm="confirm">
    <el-form :model="form" ref="form" :rules="rules">
      <el-form-item label="所属项目" prop="projectId">
        <el-select v-model="form.projectId" @change="changeProject" placeholder="请选择项目" clearable>
          <el-option v-for="item in projectList" :key="item.id" :label="item.name" :value="item.id"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="所属楼宇" prop="buildingId">
        <el-select v-model="form.buildingId" @change="changeBuild" placeholder="请选择楼宇" clearable>
          <el-option v-for="item in buildList" :key="item.id" :label="item.name" :value="item.id"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="楼层" prop="floor">
        <el-select v-model="form.floor" placeholder="请选择楼层" clearable>
          <el-option v-for="item in floorList" :key="item.id" :label="item.name" :value="item.id"></el-option>
        </el-select>
      </el-form-item>
      <el-form-item label="房号" prop="roomNum">
        <el-input v-model="form.roomNum" placeholder="请输入房号" v-trim />
      </el-form-item>
      <el-form-item label="房间编号" prop="code">
        <el-input v-model="form.code" placeholder="请输入房间编号" v-trim />
      </el-form-item>
      <el-form-item label="是否招商" prop="isInvestment">
        <el-switch v-model="form.isInvestment" :active-value="1" :inactive-value="0">
        </el-switch>
      </el-form-item>
      <el-form-item label="建筑面积(m²)" prop="area">
        <el-input v-model="form.area" placeholder="请输入建筑面积(m²)" v-trim />
      </el-form-item>
      <el-form-item label="计租面积(m²)" prop="rentArea">
        <el-input v-model="form.rentArea" placeholder="请输入计租面积(m²)" v-trim />
      </el-form-item>
      <el-form-item label="计费面积(m²)" prop="feeArea">
        <el-input v-model="form.feeArea" placeholder="请输入计费面积(m²)" v-trim />
      </el-form-item>
    </el-form>
  </GlobalWindow>
</template>
 
<script>
import BaseOpera from '@/components/base/BaseOpera'
import GlobalWindow from '@/components/common/GlobalWindow'
import { getProjectList } from '@/api/project/ywProject'
import { getBuildList } from '@/api/project/ywBuilding'
import { getFloorList } from '@/api/project/yeFloor'
import { detailById } from '@/api/project/ywRoom'
export default {
  name: 'OperaYwRoomWindow',
  extends: BaseOpera,
  components: { GlobalWindow },
  data() {
    return {
      // 表单数据
      form: {
        id: null,
        creator: '',
        createDate: '',
        editor: '',
        editDate: '',
        isdeleted: '',
        name: '',
        remark: '',
        status: '',
        sortnum: '',
        imgurl: '',
        code: '',
        roomNum: '',
        isInvestment: 0,
        area: '',
        feeArea: '',
        rentArea: '',
        floor: '',
        projectId: '',
        buildingId: ''
      },
      // 验证规则
      rules: {
        projectId: [{ required: true, message: '请选择项目名称' }],
        buildingId: [{ required: true, message: '请选择项目名称' }],
        floor: [{ required: true, message: '请选择楼层' }],
        roomNum: [{ required: true, message: '请输入房号' }],
        isInvestment: [{ required: true, message: '是否招商' }],
        area: [{ required: true, message: '请输入建筑面积' }],
        rentArea: [{ required: true, message: '请输入计租面积' }],
      },
      projectList: [],
      buildList: [],
      floorList: [],
    }
  },
  created() {
    this.config({
      api: '/project/ywRoom',
      'field.id': 'id'
    })
  },
  methods: {
    open(title, target, type) {
      this.title = title
      this.visible = true
      this.getProject()
      this.buildList = []
      this.floorList = []
      // 新建组织
      if (target == null) {
        this.$nextTick(() => {
          this.$refs.form.resetFields()
          this.form[this.configData['field.id']] = null
          this.form.type = type
        })
        return
      }
      // 编辑
      this.$nextTick(() => {
        this.getDetail(target.id)
      })
    },
    confirm() {
      if (!this.form.feeArea) {
        this.form.feeArea = this.form.rentArea
      }
      if (this.form.id == null || this.form.id === '') {
        this.__confirmCreate()
        return
      }
      this.__confirmEdit()
    },
    getDetail(id) {
      detailById(id).then(res => {
        this.form = res || {}
        if (res.projectId) {
          getBuildList({ projectId: res.projectId }).then(res => {
            this.buildList = res || []
          })
        }
        if (res.buildingId) {
          getFloorList({ buildingId: res.buildingId }).then(res => {
            this.floorList = res || []
          })
        }
      })
    },
    getProject() {
      getProjectList({}).then(res => {
        this.projectList = res || []
        if (this.projectList.length > 0) {
          this.$set(this.form, 'projectId', this.projectList[0].id)
          this.changeProject(this.projectList[0].id)
        }
      })
 
    },
    changeProject(e) {
      this.form.buildingId = ''
      getBuildList({ projectId: e }).then(res => {
        this.buildList = res || []
        // if(this.buildList.length > 0){
        //   this.form.buildingId = this.buildList[0].id
        // }
      })
    },
    changeBuild(e) {
      this.form.floor = ''
      getFloorList({ buildingId: e }).then(res => {
        this.floorList = res || []
      })
    },
  }
}
</script>