<!--
|
* @Descripttion:
|
* @version:
|
* @Author: Pengjiantian
|
* @Date: 2019-08-26 15:08:09
|
* @LastEditors : PengJianTian
|
* @LastEditTime : 2019-12-25 17:17:14
|
-->
|
<template>
|
<!-- min-width:1047px -->
|
<div id="area" style="min-width:1054px">
|
<!-- <div> -->
|
<el-container style="min-width:auto">
|
<el-main style="overflow:hidden">
|
<el-form label-position="right" ref="form" :model="form" id="search-form">
|
<el-row :gutter="20">
|
<el-col :md="8" :lg="6">
|
<el-form-item label="楼栋编号" prop="buildId">
|
<el-input v-model="form.buildId" placeholder="请输入"></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :md="8" :lg="6">
|
<el-form-item label="项目名称" prop="productname">
|
<el-input v-model="form.productname" placeholder="请输入"></el-input>
|
</el-form-item>
|
</el-col>
|
<el-col :md="8" :lg="6">
|
<el-form-item label="楼栋或车位楼层" prop="buildName">
|
<el-input v-model="form.buildName" placeholder="请输入"></el-input>
|
</el-form-item>
|
</el-col>
|
<search-select
|
v-show="showFormMore"
|
label="楼栋交易阶段"
|
codeNo="buildTransStatus"
|
v-model="form.buildTransStatus"
|
prop="buildTransStatus"
|
></search-select>
|
<search-select v-show="showFormMore" label="准入状态" codeNo="admittanceType" v-model="form.flag" prop="flag"></search-select>
|
<!-- <el-col :md="8" :lg="6" :offset="showFormMore?12:0"> -->
|
<el-col :md="8" :lg="6" style="flex: 1;display:flex;justify-content:flex-end">
|
<el-form-item :class="showFormMore?'pull-right':'pull-left'">
|
<el-button size="mini" @click="handleReset">重置</el-button>
|
<el-button type="primary" size="mini" @click="handleSubmit" style="margin-left:22px">搜索</el-button>
|
<el-button type="text" @click="handleFormMore" class="from-buttons">
|
{{ formMoreText }}
|
<i :class="showFormMore?'el-icon-arrow-up':'el-icon-arrow-down'"></i>
|
</el-button>
|
</el-form-item>
|
</el-col>
|
</el-row>
|
</el-form>
|
<el-row>
|
<el-button
|
type="primary"
|
icon="el-icon-circle-plus-outline"
|
size="small"
|
@click="handleAdd"
|
v-if="powerControl.addAuilding"
|
>新增楼栋或车位楼层</el-button
|
>
|
<el-button
|
type="primary"
|
icon="el-icon-upload"
|
size="small"
|
@click="dialogVisible = true"
|
>批量导入</el-button
|
>
|
</el-row>
|
<el-row>
|
<el-table
|
v-loading="listLoading"
|
:data="tableData"
|
fit
|
stripe
|
highlight-current-row
|
max-height="540"
|
style="width: 100%;margin-top: 30px;"
|
>
|
<el-table-column label=" " type="index" align="center" width="50px"> </el-table-column>
|
<el-table-column prop="buildId" label="楼栋编号" width="180"> </el-table-column>
|
<el-table-column prop="productname" label="项目名称" width="180"> </el-table-column>
|
<el-table-column prop="buildName" label="楼栋或车位楼层" width="180"> </el-table-column>
|
<el-table-column prop="propertytypeDesc" label="物业类型" width="180"> </el-table-column>
|
<el-table-column prop="buildTransStatusDesc" label="楼栋交易阶段" width="180"> </el-table-column>
|
<el-table-column prop="flagDesc" label="准入状态" width="180"> </el-table-column>
|
<el-table-column prop="admittancedate" label="准入时间" width="180"> </el-table-column>
|
<el-table-column prop="exitdate" label="准出时间" width="180"> </el-table-column>
|
<el-table-column prop="shproductDesc" label="是否社会化" width="180"> </el-table-column>
|
<el-table-column prop="housedate" label="预计交房日期" width="180"> </el-table-column>
|
<el-table-column prop="updateuseridDesc" label="修改人" width="180"> </el-table-column>
|
<el-table-column label="申请管理" fixed="right" width="140">
|
<!-- <template slot-scope="scope">
|
<el-button
|
v-if="scope.row.opertion.admittance"
|
type="text"
|
size="small"
|
@click="handleAdmittance(scope.row)"
|
>准入</el-button
|
>
|
<el-button v-if="scope.row.opertion.modify" type="text" size="small" @click="handleModify(scope.row)"
|
>修改</el-button
|
>
|
<el-button v-if="scope.row.opertion.prompt" type="text" size="small" @click="handlePrompt(scope.row)"
|
>准出</el-button
|
>
|
<el-button v-if="scope.row.opertion.detail" type="text" size="small" @click="handleDetail(scope.row)"
|
>详情</el-button
|
>
|
</template> -->
|
<template slot-scope="scope">
|
<!-- style="margin:0 20px 0 0" -->
|
<!-- 默认显示第一个 -->
|
<el-button
|
type="text"
|
@click="handler(scope.row,scope.row.btns[0])"
|
>{{scope.row.btns[0]}}</el-button>
|
<!-- 只有两个按钮时默认显示 -->
|
<el-button
|
type="text"
|
@click="handler(scope.row,scope.row.btns[1])"
|
v-if="scope.row.btns.length === 2"
|
>{{scope.row.btns[1]}}</el-button>
|
<el-popover
|
:ref="scope.$index"
|
placement="bottom"
|
@show="scope.row.isSwitch=true;$set(tableData,scope.$index,scope.row)"
|
@hide="scope.row.isSwitch=false;$set(tableData,scope.$index,scope.row)"
|
trigger="hover"
|
popper-class="custom_popper"
|
v-if="scope.row.btns.length !== 2"
|
>
|
<div style="text-align: center; margin: 2px 0">
|
<el-button
|
type="text"
|
style="padding:0"
|
v-for="(item,index) in scope.row.btns"
|
:key="index"
|
v-show="index!=0"
|
@click="scope._self.$refs[scope.$index].doClose();handler(scope.row,item)"
|
>{{item}}</el-button>
|
</div>
|
<!-- 只有一个按钮时置灰 -->
|
<el-button style="margin-left:20px;margin-right:6px" type="text" slot="reference" :disabled="scope.row.btns.length<2">
|
更多
|
<i style="font-size:14px"
|
:class="[{'el-icon-arrow-down':!scope.row.isSwitch && scope.row.btns.length>2},{'el-icon-arrow-up':scope.row.isSwitch}]"
|
></i>
|
</el-button>
|
</el-popover>
|
</template>
|
</el-table-column>
|
</el-table>
|
<pagination
|
v-show="total > 0"
|
:total="total"
|
:page.sync="listQuery.currentPage"
|
:limit.sync="listQuery.pageSize"
|
@pagination="initTable"
|
/>
|
</el-row>
|
</el-main>
|
</el-container>
|
<el-dialog
|
title="批量导入"
|
:visible.sync="dialogVisible"
|
:close-on-click-modal="false"
|
:close-on-press-escape="false"
|
:destroy-on-close="true"
|
:show-close="false"
|
width="450"
|
center
|
custom-class="school_dialog_footer_set"
|
>
|
<el-upload
|
class="upload-main"
|
drag
|
action=""
|
:headers="uploadHeader"
|
:http-request="handleUpload"
|
:show-file-list="false"
|
>
|
<i class="el-icon-upload"></i>
|
<div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
|
<div class="el-upload__tip" slot="tip">
|
<a @click="downloadFile">模板下载</a>
|
</div>
|
</el-upload>
|
<span slot="footer" class="dialog-footer">
|
<el-button @click="dialogVisible = false">取 消</el-button>
|
</span>
|
</el-dialog>
|
</div>
|
</template>
|
|
<script>
|
import '../../style/areaBuilding.styl'
|
// import '@/views/area/style/table.styl'
|
import { qryBuildListByPage, buildAdmitIn, buildAdmitOut, importBuildings, getContractUrl } from '@/api/area/building'
|
import Pagination from '@/components/Pagination'
|
import SearchSelect from './SearchSelect'
|
export default {
|
components: { SearchSelect, Pagination },
|
data: function() {
|
return {
|
form: {
|
buildId: '',
|
buildName: '',
|
buildTransStatus: '',
|
flag: '',
|
productname: ''
|
},
|
formMoreText: '展开',
|
showFormMore: false,
|
// 分页
|
listLoading: true,
|
tableData: [],
|
total: 0,
|
listQuery: {
|
currentPage: 1,
|
pageSize: 10
|
},
|
powerControl:{
|
addAuilding: false, // 新增楼栋
|
qryBuildDetail: false, // 修改
|
queryBuildTabAttrs: false, // 详情
|
buildAdmitIn: false, // 准入
|
buildAdmitOut: false, // 准出
|
},
|
clientWidth: 0,
|
dialogVisible: false,
|
uploadHeader: {
|
"Content-Type": "multipart/form-data; boundary=ReaquestHeader"
|
}
|
}
|
},
|
created() {
|
this.initTable()
|
},
|
mounted() {
|
if (this.window.location.host.indexOf('236') != -1 || this.window.location.host.indexOf('localhost') != -1) {
|
this.powerControl.addAuilding = this.window.top._area_building_add = true // 新增楼栋
|
this.powerControl.qryBuildDetail = this.window.top._server_qryBuildDetail = true // 修改
|
this.powerControl.queryBuildTabAttrs = this.window.top._server_queryBuildTabAttrs = true // 详情
|
this.powerControl.buildAdmitIn = this.window.top._server_buildAdmitIn = true // 准入
|
this.powerControl.buildAdmitOut = this.window.top._server_buildAdmitOut = true // 准出
|
} else {
|
this.powerControl.addAuilding = this.window.top._server_qryBuildDetail // 新增楼栋
|
this.powerControl.qryBuildDetail = this.window.top._server_qryBuildDetail // 修改
|
this.powerControl.queryBuildTabAttrs = this.window.top._server_queryBuildTabAttrs // 详情
|
this.powerControl.buildAdmitIn = this.window.top._server_buildAdmitIn // 准入
|
this.powerControl.buildAdmitOut = this.window.top._server_buildAdmitOut // 准出
|
}
|
window.addEventListener('resize', this.updateClientWidth)
|
this.updateClientWidth()
|
},
|
methods: {
|
initTable() {
|
this.listLoading = true
|
let params = Object.assign(this.listQuery, this.form)
|
qryBuildListByPage(params).then(res => {
|
this.tableData = res.result.records
|
this.showBtn(this.tableData)
|
this.total = res.result.total
|
this.listLoading = false
|
})
|
},
|
updateClientWidth() {
|
const clientWidth = document.documentElement.clientWidth || 0
|
this.clientWidth = clientWidth
|
// console.log(this.clientWidth)
|
},
|
handleFormMore() {
|
this.showFormMore = !this.showFormMore
|
this.showFormMore ? (this.formMoreText = '收起') : (this.formMoreText = '展开')
|
},
|
handleSubmit() {
|
// 每次搜索都是从第一页开始搜索
|
this.listQuery.currentPage = 1
|
this.initTable()
|
},
|
handleReset() {
|
this.$refs['form'].resetFields()
|
},
|
// 列表更多处理
|
// 处理列表各种操作管理
|
handler(row, key) {
|
switch (key) {
|
case '修改':
|
this.handleModify(row)
|
break
|
case '详情':
|
this.handleDetail(row)
|
break
|
case '准入':
|
this.handleAdmittance(row)
|
break
|
case '准出':
|
this.handlePrompt(row)
|
break
|
default:
|
break
|
}
|
},
|
// 排序展示列表需要的按钮
|
showBtn(array) {
|
// 给每一行数据天年btns属性
|
array.forEach(val => {
|
val.btns = []
|
val.opertion.detail==1 && this.powerControl.queryBuildTabAttrs ?val.btns.push('详情'):''
|
val.opertion.modify==1 && this.powerControl.qryBuildDetail ?val.btns.push('修改'):''
|
val.opertion.admittance==1 && this.powerControl.buildAdmitIn ?val.btns.push('准入'):''
|
val.opertion.prompt==1 && this.powerControl.buildAdmitOut ?val.btns.push('准出'):''
|
});
|
},
|
// 新增
|
handleAdd() {
|
let buildParams = {
|
pageType: 'update',
|
serialNo: '',
|
objectNo: ''
|
}
|
this.$store.commit('SET_buildParams', buildParams)
|
this.$router.push({ path: '/area/building/update/buildInfo' })
|
},
|
// 修改
|
handleModify(row) {
|
let buildParams = {
|
pageType: 'update',
|
serialNo: row.serialno,
|
objectNo: row.objectno,
|
operation: 'modify',
|
projectid: row.projectid,
|
readonly: true
|
}
|
this.$store.commit('SET_buildParams', buildParams)
|
this.$router.push({ path: '/area/building/update/buildInfo' })
|
},
|
// 准入
|
async handleAdmittance(row) {
|
let params = { serialNo: row.serialno }
|
let confirm = await this.$confirm(`请确认是否准入"${row.productname}"！`, '楼栋准入确认', {
|
confirmButtonText: '确定',
|
cancelButtonText: '取消',
|
customClass: 'build_messages_box',
|
confirmButtonClass: 'build_messages_box_confirm',
|
cancelButtonClass: 'build_messages_box_cancel',
|
center: true
|
})
|
.then(() => {
|
return true
|
})
|
.catch(() => {})
|
if (confirm) {
|
let res = await buildAdmitIn(params)
|
if (res.code === '00') {
|
this.$message.success('处理成功！')
|
this.initTable()
|
}
|
}
|
},
|
// 准出
|
async handlePrompt(row) {
|
let params = { serialNo: row.serialno }
|
let confirm = await this.$confirm(`请确认是否准出"${row.productname}"！`, '楼栋准出确认', {
|
confirmButtonText: '确定',
|
cancelButtonText: '取消',
|
customClass: 'build_messages_box',
|
confirmButtonClass: 'build_messages_box_confirm',
|
cancelButtonClass: 'build_messages_box_cancel',
|
center: true
|
})
|
.then(() => {
|
return true
|
})
|
.catch(() => {})
|
if (confirm) {
|
let res = await buildAdmitOut(params)
|
if (res.code === '00') {
|
this.$message.success('处理成功！')
|
this.initTable()
|
}
|
}
|
},
|
// 详情
|
handleDetail(row) {
|
let buildParams = {
|
pageType: 'details',
|
serialNo: row.serialno
|
}
|
this.$store.commit('SET_buildParams', buildParams)
|
this.$router.push({ path: '/area/building/details/buildInfo' })
|
},
|
async handleUpload(file) {
|
if (file.file) {
|
const formData = new FormData();
|
formData.append("file", file.file);
|
await importBuildings(formData).then(res => {
|
if (res.code === "00") {
|
this.$message.success("导入成功");
|
this.dialogVisible = false;
|
this.handleSubmit();
|
}
|
});
|
}
|
},
|
// 下载-楼栋准入导入模板
|
async downloadFile() {
|
await getContractUrl({ edocno: "importBuildingsTemp" }).then(res => {
|
if (res.code === "00") {
|
let fileUrl = res.result.url
|
let alink = document.createElement("a");
|
alink.download="楼栋准入导入模板.xlsx"//文件名,大部分浏览器兼容,IE10及以下不兼容
|
alink.href=fileUrl;//创建 url地址
|
alink.click();
|
}
|
});
|
}
|
}
|
}
|
</script>
|
|
<style lang="stylus">
|
.build_messages_box.el-message-box--center
|
width 458px
|
height 173px
|
.el-message-box__header
|
// font-family PingFangSC-Medium,PingFangSC
|
font-size 18px
|
font-width bold
|
padding-top 40px
|
.el-message-box__headerbtn
|
top 20px
|
right 20px
|
background rgba(245,245,245,1)
|
.el-message-box__content
|
line-height 20px
|
.el-message-box__btns
|
padding-top 30px
|
.build_messages_box_confirm
|
margin-left 40px
|
.build_messages_box_cancel,.build_messages_box_confirm
|
width 120px
|
height 30px
|
span
|
font-size 14px
|
|
.school_dialog_footer_set
|
.el-dialog__body
|
text-align center
|
.el-upload__tip
|
color #409eff
|
a
|
cursor pointer
|
</style>
|
