|
|
@@ -1,16 +1,404 @@ |
|
|
|
<template> |
|
|
|
<div> |
|
|
|
违禁记录 |
|
|
|
</div> |
|
|
|
<div class="box-center"> |
|
|
|
<!-- 头 --> |
|
|
|
<div class="app-top"> |
|
|
|
<div class="app-titel" v-if="orgType != 3"> |
|
|
|
<div |
|
|
|
class="label" |
|
|
|
style="color: #32363d; font-weight: 400; font-size: 16px" |
|
|
|
> |
|
|
|
项目选择: |
|
|
|
</div> |
|
|
|
<div style="margin-left: 8px"> |
|
|
|
<el-select |
|
|
|
v-model="searchForm.projectId" |
|
|
|
@change="houseChange" |
|
|
|
placeholder="请选择" |
|
|
|
filterable |
|
|
|
> |
|
|
|
<el-option |
|
|
|
v-for="item in houseList" |
|
|
|
:key="item.id" |
|
|
|
:label="item.propertyName" |
|
|
|
:value="item.id" |
|
|
|
> |
|
|
|
</el-option> |
|
|
|
</el-select> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<!-- 选择时间 --> |
|
|
|
<div class="app-titel" style="margin-top: 1em"> |
|
|
|
<div class="label">接待时间:</div> |
|
|
|
<div class="toptimeqhuan"> |
|
|
|
<div |
|
|
|
v-for="(data, index) in timeToAhouseList" |
|
|
|
:key="index" |
|
|
|
:class="{ tophove: TimetoAhoose == data.id }" |
|
|
|
@click="tabtimetap(data.id)" |
|
|
|
> |
|
|
|
{{ data.title }} |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div style="margin-left: 26px"> |
|
|
|
<el-date-picker |
|
|
|
@change="confirmtime" |
|
|
|
v-model="customtime" |
|
|
|
type="daterange" |
|
|
|
range-separator="-" |
|
|
|
:default-time="['00:00:00', '23:59:59']" |
|
|
|
value-format="yyyy-MM-dd" |
|
|
|
start-placeholder="开始日期" |
|
|
|
end-placeholder="结束日期" |
|
|
|
> |
|
|
|
</el-date-picker> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<!-- 违禁标识 --> |
|
|
|
<div class="app-titel" style="margin-top: 1em"> |
|
|
|
<div class="div-lab"> |
|
|
|
<div class="label">违禁标识:</div> |
|
|
|
<el-select |
|
|
|
clearable |
|
|
|
filterable |
|
|
|
v-model="searchForm.tag" |
|
|
|
placeholder="请选择" |
|
|
|
class="div-inp" |
|
|
|
> |
|
|
|
<el-option |
|
|
|
v-for="item in prohibitedSignsList" |
|
|
|
:key="item.value" |
|
|
|
:label="item.label" |
|
|
|
:value="item.value" |
|
|
|
> |
|
|
|
</el-option> |
|
|
|
</el-select> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div class="div-lab"> |
|
|
|
<div class="label">处理状态:</div> |
|
|
|
<el-select |
|
|
|
clearable |
|
|
|
filterable |
|
|
|
v-model="searchForm.status" |
|
|
|
placeholder="请选择" |
|
|
|
class="div-inp" |
|
|
|
> |
|
|
|
<el-option |
|
|
|
v-for="item in processingStatusList" |
|
|
|
:key="item.value" |
|
|
|
:label="item.label" |
|
|
|
:value="item.value" |
|
|
|
> |
|
|
|
</el-option> |
|
|
|
</el-select> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div class="div-lab"> |
|
|
|
<div class="label">置业顾问:</div> |
|
|
|
<div> |
|
|
|
<el-input |
|
|
|
maxlength="10" |
|
|
|
clearable |
|
|
|
v-model="searchForm.name" |
|
|
|
></el-input> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<!-- 筛选 --> |
|
|
|
<div class="app-titel" style="margin-top: 1em; padding-left: 100px"> |
|
|
|
<el-button type="primary">筛选</el-button> |
|
|
|
<el-link style="margin-left: 1em" :underline="false" type="primary" |
|
|
|
>清空筛选条件</el-link |
|
|
|
> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<!-- 表格 --> |
|
|
|
<div class="cen-tab"> |
|
|
|
<el-table :data="tableData" stripe style="width: 100%"> |
|
|
|
<el-table-column prop="batchId" label="序号" width="70" align="center"> |
|
|
|
<template slot-scope="scope"> |
|
|
|
<span> {{ scope.$index + 1 }}</span> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column prop="houseName" label="接待编号" align="center"> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column |
|
|
|
prop="accountNum" |
|
|
|
label="接待开始时间" |
|
|
|
align="center" |
|
|
|
> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column |
|
|
|
prop="receptionCount" |
|
|
|
label="顾问" |
|
|
|
align="center" |
|
|
|
> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column |
|
|
|
prop="activeCustomer" |
|
|
|
label="客户" |
|
|
|
align="center"> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column |
|
|
|
prop="prohibitedCustomer" |
|
|
|
label="违禁命中" |
|
|
|
align="center" |
|
|
|
width="140" |
|
|
|
> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column |
|
|
|
prop="sumDuration" |
|
|
|
label="处理状态" |
|
|
|
align="center" |
|
|
|
width="100" |
|
|
|
> |
|
|
|
<template slot-scope="scope"> |
|
|
|
{{ scope.row.sumDuration }} |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column |
|
|
|
prop="fraction" |
|
|
|
label="处理人" |
|
|
|
align="center" |
|
|
|
width="110" |
|
|
|
> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column |
|
|
|
prop="prohibitedZb" |
|
|
|
label="违禁标识" |
|
|
|
align="center" |
|
|
|
width="100" |
|
|
|
> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column |
|
|
|
prop="addtodigestCount" |
|
|
|
label="无效原因" |
|
|
|
align="center" |
|
|
|
width="140" |
|
|
|
></el-table-column> |
|
|
|
|
|
|
|
<el-table-column label="操作" align="center" width="100"> |
|
|
|
<template slot-scope="{ row }"> |
|
|
|
<el-button type="text">查看</el-button> |
|
|
|
<el-button type="text">无效</el-button> |
|
|
|
<el-button type="text">有效</el-button> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
</el-table> |
|
|
|
<div style="display: flex; justify-content: flex-end; margin-top: 10px"> |
|
|
|
<el-pagination |
|
|
|
@size-change="handleSizeChange" |
|
|
|
@current-change="handleCurrentChange" |
|
|
|
:current-page="page" |
|
|
|
:page-sizes="[10, 30, 50]" |
|
|
|
:page-size="pagesize" |
|
|
|
layout="total, sizes, prev, pager, next, jumper" |
|
|
|
:total="total" |
|
|
|
> |
|
|
|
</el-pagination> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
|
|
|
|
<script> |
|
|
|
export default { |
|
|
|
data() { |
|
|
|
return { |
|
|
|
houseList: [], // 可切换的项目列表 |
|
|
|
orgType: localStorage.getItem("orgType"), // 组织类型 |
|
|
|
prohibitedSignsList: [ |
|
|
|
// 违禁标识 |
|
|
|
{ |
|
|
|
label: "全部", |
|
|
|
value: "", |
|
|
|
}, |
|
|
|
{ |
|
|
|
label: "有效违禁", |
|
|
|
value: "1", |
|
|
|
}, |
|
|
|
{ |
|
|
|
label: "无效违禁", |
|
|
|
value: "2", |
|
|
|
}, |
|
|
|
], |
|
|
|
processingStatusList: [ |
|
|
|
// 违禁处理状态 |
|
|
|
{ |
|
|
|
label: "全部", |
|
|
|
value: "", |
|
|
|
}, |
|
|
|
{ |
|
|
|
label: "待处理", |
|
|
|
value: "1", |
|
|
|
}, |
|
|
|
{ |
|
|
|
label: "已处理", |
|
|
|
value: "2", |
|
|
|
}, |
|
|
|
], |
|
|
|
|
|
|
|
} |
|
|
|
searchForm: { |
|
|
|
projectId: "", |
|
|
|
tag: "", // 选中违禁标识id (暂时使用) |
|
|
|
status: "", // 处理状态筛选id (暂时使用) |
|
|
|
name: "", // 置业顾问名称 (暂时使用) |
|
|
|
}, |
|
|
|
|
|
|
|
timeToAhouseList: [ |
|
|
|
// 筛选时间数组 |
|
|
|
{ |
|
|
|
title: "近7天", |
|
|
|
id: 4, |
|
|
|
}, |
|
|
|
{ |
|
|
|
title: "近15天", |
|
|
|
id: 5, |
|
|
|
}, |
|
|
|
{ |
|
|
|
title: "近30天", |
|
|
|
id: 6, |
|
|
|
}, |
|
|
|
], |
|
|
|
|
|
|
|
TimetoAhoose: 4, // 选中时间的下表 |
|
|
|
|
|
|
|
customtime: [], // 自定义时间选择数据 |
|
|
|
|
|
|
|
tableData: [], // 表格数据 |
|
|
|
}; |
|
|
|
}, |
|
|
|
|
|
|
|
created() { |
|
|
|
this.zkhousePage(); |
|
|
|
|
|
|
|
if (this.$route.query.date) { |
|
|
|
this.time = this.$route.query.date.split(","); |
|
|
|
this.searchForm.staDate = this.time[0]; |
|
|
|
this.searchForm.endDate = this.time[1]; |
|
|
|
console.log("时间"); |
|
|
|
} |
|
|
|
}, |
|
|
|
|
|
|
|
methods: { |
|
|
|
// 重置入参 |
|
|
|
resetParams() { |
|
|
|
// this.searchForm |
|
|
|
}, |
|
|
|
|
|
|
|
// 获取可以选择的项目 |
|
|
|
zkhousePage() { |
|
|
|
this.$api.api |
|
|
|
.findHouseByUser({ |
|
|
|
orgType: this.orgType, |
|
|
|
}) |
|
|
|
.then((res) => { |
|
|
|
// console.log(res) |
|
|
|
this.houseList = res.data; |
|
|
|
if (this.orgType == 3) { |
|
|
|
this.searchForm.projectId = localStorage.getItem("houseId"); |
|
|
|
} else { |
|
|
|
this.searchForm.projectId = res.data[0].id; |
|
|
|
} |
|
|
|
this.houseChange(); |
|
|
|
}); |
|
|
|
}, |
|
|
|
|
|
|
|
// 项目选择改变的时候 |
|
|
|
houseChange() {}, |
|
|
|
|
|
|
|
// 固定类型时间选择 |
|
|
|
tabtimetap(index) {}, |
|
|
|
|
|
|
|
// 自定义时间选择 |
|
|
|
confirmtime() {}, |
|
|
|
}, |
|
|
|
}; |
|
|
|
</script> |
|
|
|
|
|
|
|
<style lang="" scoped > |
|
|
|
<style lang="scss" scoped> |
|
|
|
.box-center { |
|
|
|
width: 100%; |
|
|
|
padding: 15px; |
|
|
|
min-width: 1000px; |
|
|
|
padding-bottom: 100px; |
|
|
|
|
|
|
|
.app-top { |
|
|
|
width: 100%; |
|
|
|
background: #ffffff; |
|
|
|
box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.04); |
|
|
|
border-radius: 4px; |
|
|
|
padding-top: 15px; |
|
|
|
padding-bottom: 15px; |
|
|
|
|
|
|
|
.app-titel { |
|
|
|
width: 100%; |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
flex-wrap: wrap; |
|
|
|
|
|
|
|
.label { |
|
|
|
font-size: 14px; |
|
|
|
font-weight: 400; |
|
|
|
color: #32363d; |
|
|
|
line-height: 32px; |
|
|
|
margin-left: 15px; |
|
|
|
min-width: 100px; |
|
|
|
text-align: right; |
|
|
|
} |
|
|
|
|
|
|
|
.toptimeqhuan { |
|
|
|
height: 30px; |
|
|
|
background: #ffffff; |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
|
|
|
|
div { |
|
|
|
padding-left: 20px; |
|
|
|
padding-right: 20px; |
|
|
|
text-align: center; |
|
|
|
line-height: 30px; |
|
|
|
font-size: 14px; |
|
|
|
border-radius: 4px; |
|
|
|
border: 1px solid #e0e0e0; |
|
|
|
} |
|
|
|
.btn { |
|
|
|
padding-left: 20px; |
|
|
|
padding-right: 20px; |
|
|
|
text-align: center; |
|
|
|
font-size: 14px; |
|
|
|
margin-right: 15px; |
|
|
|
border-radius: 4px; |
|
|
|
border: 1px solid #e0e0e0; |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.div-lab { |
|
|
|
display: flex; |
|
|
|
margin: 5px; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
|
|
|
|
.cen-tab { |
|
|
|
width: 100%; |
|
|
|
padding: 15px; |
|
|
|
background: #ffffff; |
|
|
|
margin-top: 15px; |
|
|
|
} |
|
|
|
|
|
|
|
.tophove { |
|
|
|
color: #ffffff; |
|
|
|
background: #409eff; |
|
|
|
border-color: #409eff; |
|
|
|
} |
|
|
|
|
|
|
|
.div-inp { |
|
|
|
width: 250px; |
|
|
|
} |
|
|
|
} |
|
|
|
</style> |