户室开锁记录

src/views/reservation/completeIndex.vue

@@ -0,0 +1,375 @@
+<template>
+  <div>
+    <el-row class="handle-box" style="margin-bottom: 10px">
+      <el-col :span="24">
+        <el-input
+          v-model="search.keyword"
+          style="margin-left:16px;width: 200px"
+          size="small"
+          placeholder="请输入购房人姓名或电话"
+          class="ch-input ch-input-size"
+          @keyup.enter.native="handleSearch()"
+        />
+        <el-date-picker
+          v-model="dateRange"
+          size="small"
+          type="daterange"
+          range-separator="至"
+          value-format="yyyy-MM-dd"
+          start-placeholder="创建日期起"
+          end-placeholder="创建日期止"
+          @change="handleSearch"
+        />
+        <el-select v-model="search.parkInfoId" filterable clearable size="small" placeholder="楼盘/小区" @change="parkChange">
+          <el-option
+            v-for="item in parkOptions"
+            :key="item.id"
+            :value="item.id"
+            :label="item.groupName"
+          />
+        </el-select>
+        <el-select v-model="search.mnpBuildingId" filterable clearable size="small" placeholder="单元/楼栋号" @change="handleSearch">
+          <el-option
+            v-for="item in buildingOptions"
+            :key="item.id"
+            :value="item.id"
+            :label="item.buildNum"
+          />
+        </el-select>
+        <el-input
+          v-model="search.parkRoomNo"
+          size="small"
+          placeholder="户室号"
+          class="ch-input ch-input-size"
+          @keyup.enter.native="handleSearch()"
+        />
+        <el-input
+          v-model="search.roomAddress"
+          style="width: 200px"
+          size="small"
+          placeholder="地址"
+          class="ch-input ch-input-size"
+          @keyup.enter.native="handleSearch()"
+        />
+      </el-col>
+      <el-col :span="24">
+        <el-button :loading="btnLoading" size="small" class="ch-button" style="float:right;margin-top: 4px;margin-left: 10px" @click.native="handleExport()"><i class="el-icon-download" />&nbsp;导出</el-button>
+        <el-button size="small" class="ch-button" style="float:right;margin-top: 4px;margin-left: 10px" @click="handleSearch()"><i class="el-icon-search" />&nbsp;查询</el-button>
+        <el-button size="small" class="ch-button-warning" style="float:right;margin-top: 4px" @click="handleReset()"><i class="el-icon-refresh" />&nbsp;重置</el-button>
+      </el-col>
+    </el-row>
+    <el-row class="handle-box">
+      <el-col :span="24">
+        <el-table
+          ref="multipleTable"
+          v-loading="loading"
+          :data="AllData"
+          border
+          :header-cell-style="{ background:'#f2f2f2'}"
+        >
+          <el-table-column type="index" label="序号" width="60" />
+          <el-table-column label="楼盘/小区" prop="parkInfoName" min-width="100" />
+          <el-table-column label="分期" prop="parkFloorDiscName" min-width="100" />
+          <el-table-column label="单元/楼栋号" prop="mnpBuildingNo" min-width="120" />
+          <el-table-column label="户室号" prop="parkRoomNo" />
+          <el-table-column label="申请人" prop="applicantName" />
+          <el-table-column label="申请人电话" prop="applicantPhone" min-width="120" />
+          <el-table-column label="购房人" prop="buyerName" />
+          <el-table-column label="购房人电话" prop="buyerPhone" min-width="120" />
+          <el-table-column label="状态" prop="reservationStatusStr" />
+          <el-table-column label="门锁" prop="doorStatus" />
+          <el-table-column label="开锁日期" prop="reservationDate" min-width="100" />
+          <el-table-column label="看房时段" min-width="100">
+            <template v-slot="scope">
+              {{ scope.row.reservationTimeStart + '~' + scope.row.reservationTimeEnd }}
+            </template>
+          </el-table-column>
+          <el-table-column label="开门密码" prop="doorPassStatusStr" min-width="100" />
+          <el-table-column label="备注" prop="lookingNotes" min-width="200" />
+          <el-table-column label="操作" width="200" fixed="right">
+            <template scope="scope">
+              <el-button size="small" type="primary" @click="handleEdit(scope.row)">备注</el-button>
+              <el-button size="small" type="primary" @click="handleDetail(scope.row)">查看预约单</el-button>
+            </template>
+          </el-table-column>
+        </el-table>
+        <div class="table-page">
+          <el-pagination
+            :current-page.sync="currentPage"
+            :page-sizes="[10, 20, 50, 100]"
+            :page-size="pageSize"
+            background
+            layout="total, sizes, prev, pager, next, jumper"
+            :total="allpage"
+            @size-change="handleSizeChange"
+            @current-change="handleCurrentChange"
+          />
+        </div>
+      </el-col>
+    </el-row>
+
+    <el-dialog
+      :title="dialogTitle"
+      :visible.sync="dialogVisible"
+      width="70%"
+      top="50px"
+      :close-on-click-modal="false"
+      :close-on-press-escape="false"
+      append-to-body
+      @close="handleEditClose"
+    >
+      <reservation-edit v-if="dialogVisible" ref="editDialog" @handleClose="handleEditClose" />
+    </el-dialog>
+
+    <el-dialog
+      title="看房备注"
+      :visible.sync="notesVisible"
+      width="50%"
+      top="50px"
+      :close-on-click-modal="false"
+      :close-on-press-escape="false"
+      append-to-body
+      @close="handleNotesClose"
+    >
+      <looking-notes-edit v-if="notesVisible" ref="notesDialog" @handleClose="handleNotesClose" />
+    </el-dialog>
+
+  </div>
+</template>
+<script>
+import Base from '@/views/base/base'
+import ReservationEdit from '@/views/reservation/reservationEdit.vue'
+import LookingNotesEdit from '@/views/reservation/lookingNotesEdit.vue'
+import constant from '@/static/utils/constant'
+import qs from 'qs'
+import axios from 'axios'
+
+export default {
+    name: 'CompleteIndex',
+    components: { LookingNotesEdit, ReservationEdit },
+    mixins: [Base],
+    data() {
+        return {
+            dateRange: [],
+            search: {
+                keyword: '',
+                createTimeStart: '',
+                createTimeEnd: '',
+                parkRoomNo: '',
+                parkInfoId: '',
+                mnpBuildingId: '',
+                roomAddress: ''
+            },
+            AllData: [],
+            parkOptions: [],
+            buildingOptions: [],
+            loading: false,
+            dialogTitle: '',
+            dialogVisible: false,
+            notesVisible: false,
+            btnLoading: false
+        }
+    },
+    mounted() {
+        this.getParkOptions()
+        this.getBuildingOptions()
+        this.getData()
+    },
+    methods: {
+        getData() {
+            const _this = this
+            _this.loading = true
+            _this.AllData = []
+
+            this.search.pageNum = this.currentPage
+            this.search.pageSize = this.pageSize
+            this.baseRequest('completeListPage', this.search).then((res) => {
+                _this.AllData = res.data.rows
+                _this.allpage = res.data.total || 0
+                _this.loading = false
+            })
+        },
+        getParkOptions() {
+            this.parkRequest('listAll', {}).then(res => { this.parkOptions = res.data || [] })
+        },
+        parkChange(val) {
+            this.search.mnpBuildingId = ''
+            this.getBuildingOptions()
+            this.handleSearch()
+        },
+        getBuildingOptions() {
+            const postData = {}
+            if (this.search.parkInfoId) {
+                postData.groupId = this.search.parkInfoId
+            }
+            this.buildingRequest('listAll', postData).then(res => { this.buildingOptions = res.data || [] })
+        },
+        handleSearch() {
+            if (this.dateRange && this.dateRange.length) {
+                this.search.createTimeStart = this.dateRange[0]
+                this.search.createTimeEnd = this.dateRange[1]
+            } else {
+                this.search.createTimeStart = ''
+                this.search.createTimeEnd = ''
+            }
+            this.currentPage = 1
+            this.getData()
+        },
+        handleReset() {
+            for (const i in this.search) {
+                if (i !== 'pageNum' && i !== 'pageSize') {
+                    this.search[i] = ''
+                }
+            }
+            this.dateRange = []
+            this.handleSearch()
+        },
+        handleEdit(val) {
+            this.notesVisible = true
+            this.$nextTick(() => {
+                this.$refs.notesDialog.initData(val.id)
+            })
+        },
+        handleDetail(val) {
+            this.dialogVisible = true
+            this.dialogTitle = '详情'
+            this.$nextTick(() => {
+                this.$refs.editDialog.initData(val.id, true)
+            })
+        },
+        handleEditClose(refresh) {
+            this.dialogVisible = false
+            if (refresh) {
+                this.getData()
+            }
+        },
+        handleNotesClose(refresh) {
+            this.notesVisible = false
+            if (refresh) {
+                this.getData()
+            }
+        },
+        handleExport() {
+            this.btnLoading = true
+            axios({
+                headers: {
+                    'MVVM-Key': String(new Date().getTime()),
+                    xx: 'anything'
+                },
+                method: 'post',
+                url: constant.BASE_URI + '/ParkRoomReservationController/exportData',
+                responseType: 'blob',
+                data: qs.stringify(this.search)
+            }).then(res => {
+                this.downloadExcel(res.data, '数据导出.xlsx')
+            }).finally(() => {
+                this.btnLoading = false
+            })
+        },
+        downloadExcel(blobPart, filename) {
+            const blob = new Blob([blobPart], {
+                type: 'application/vnd.ms-excel'
+            })
+            // 创建一个超链接，将文件流赋进去，然后实现这个超链接的单击事件
+            const elink = document.createElement('a')
+            elink.download = decodeURIComponent(filename)
+            elink.style.display = 'none'
+            elink.href = URL.createObjectURL(blob)
+            document.body.appendChild(elink)
+            elink.click()
+            URL.revokeObjectURL(elink.href) // 释放URL 对象
+            document.body.removeChild(elink)
+        },
+        baseRequest(opUrl, postData) {
+            return this.$channel.globeRequest('ParkRoomReservationController', opUrl, postData, '')
+        },
+        parkRequest(opUrl, postData, isArr) {
+            return this.$channel.globeRequest('ParkInfoController', opUrl, postData, 'project', isArr)
+        },
+        buildingRequest(opUrl, postData, isArr) {
+            return this.$channel.globeRequest('MnpBuildingController', opUrl, postData, 'project', isArr)
+        }
+    }
+}
+</script>
+
+<style scoped>
+.el-dropdown {
+  vertical-align: top;
+}
+.el-dropdown + .el-dropdown {
+  margin-left: 15px;
+}
+.el-icon-arrow-down {
+  font-size: 12px;
+}
+.ch-input .el-input__inner {
+    border-color: #32323A;
+}
+
+.ch-input-size {
+    width: 150px;
+}
+
+.ch-button {
+    border-color: #32323A;
+    background-color: #32323A;
+    color: #fff;
+}
+
+.ch-button-warning {
+    margin-left: 10px;
+    border-color: #E6A23C;
+    background-color: #E6A23C;
+    color: #fff;
+}
+
+.ch-button-export {
+    margin-left: 10px;
+    border-color: #98CC1F;
+    background-color: #98CC1F;
+    color: #fff;
+}
+
+.listBox {
+    margin-left: 20px;
+    display: flex;
+    flex-wrap: wrap;
+}
+
+.list {
+
+    border-radius: 4px;
+    margin-right: 20px;
+    margin-top: 15px;
+    cursor: pointer;
+    margin-bottom: 15px;
+    width: 138px;
+    height: 28px;
+    text-align: center;
+    line-height: 28px;
+    background: #EBEBEB;
+    color: #777777;
+}
+
+.checked {
+    color: #2C27D0;
+    background: #EAEAF8;
+    /*border: 1px solid #3377ff;*/
+}
+
+.ch-button-danger {
+    margin-left: 10px;
+    border-color: #ff4949;
+    background-color: #ff4949;
+    color: #fff;
+}
+::v-deep .rowStyle {
+    background-color: #e8f7fd !important;
+    color: #1890ff;
+}
+::v-deep .el-table tbody tr:hover > td {
+    background-color: #e8f7fd !important;
+}
+
+</style>

src/views/reservation/index.vue

@@ -142,7 +142,6 @@ export default {
                 _this.AllData = res.data.rows
                 _this.allpage = res.data.total || 0
                 _this.loading = false
-            }).catch(() => {
             })
         },
         handleSearch() {

src/views/reservation/lookingNotesEdit.vue

@@ -0,0 +1,104 @@
+<template>
+  <div v-loading="loading">
+    <el-form ref="form" :model="form" style="width: 100%;padding: 5px" :rules="rules" label-width="auto">
+      <el-row>
+        <el-col style="padding-bottom: 10px">
+          <el-card shadow="always" style="padding: 15px 5px 5px 15px">
+            <el-row>
+              <el-col :span="24">
+                <el-form-item prop="lookingNotes" label="备注">
+                  <el-input
+                    v-model="form.lookingNotes"
+                    type="textarea"
+                    placeholder="请输入"
+                    :autosize="{ minRows: 2, maxRows: 4}"
+                    maxlength="1000"
+                    show-word-limit
+                  />
+                </el-form-item>
+              </el-col>
+            </el-row>
+          </el-card>
+        </el-col>
+      </el-row>
+    </el-form>
+    <div slot="footer" style="text-align: right">
+      <el-button @click="handleClose">关 闭</el-button>
+      <el-button type="primary" @click="confirmSubmit()">提 交</el-button>
+    </div>
+  </div>
+</template>
+
+<script>
+
+export default {
+    name: 'LookingNotesEdit',
+    data() {
+        return {
+            id: '',
+            loading: false,
+            form: {
+                lookingNotes: ''
+            },
+            rules: {}
+        }
+    },
+    methods: {
+        initData(id) {
+            this.id = id
+            this.getData()
+        },
+        getData() {
+            this.loading = true
+            this.baseRequest('getById', { id: this.id }).then(res => {
+                this.form.lookingNotes = res.data.lookingNotes || ''
+                this.loading = false
+            })
+        },
+        handleClose() {
+            this.$emit('handleClose')
+        },
+        confirmSubmit() {
+            this.$refs.form.validate((valid) => {
+                if (valid) {
+                    const postData = {
+                        id: this.id,
+                        lookingNotes: this.form.lookingNotes
+                    }
+                    this.loading = true
+                    this.baseRequest('editLookingNotes', postData).then(res => {
+                        this.loading = false
+                        if (res.data.key === 200) {
+                            this.$message.success('提交成功')
+                            this.$emit('handleClose', true)
+                        } else {
+                            this.$message.error(res.data.msg)
+                        }
+                    })
+                } else {
+                    return false
+                }
+            })
+        },
+        baseRequest(opUrl, postData, isArr) {
+            return this.$channel.globeRequest('ParkRoomReservationController', opUrl, postData, 'project', isArr)
+        }
+    }
+}
+</script>
+
+<style lang="scss" scoped>
+ .doubleInput{
+   display: flex;
+   ::v-deep{
+     .el-input{
+       width: 50%;
+     }
+   }
+ }
+</style>
+<style lang="scss">
+.changedItem .el-form-item__label{
+    background-color: yellow;
+}
+</style>