|
|
|
@@ -1,16 +1,350 @@ |
|
|
|
<template> |
|
|
|
<div> |
|
|
|
工作统计 |
|
|
|
</div> |
|
|
|
<div class="box-center"> |
|
|
|
<!-- 头 --> |
|
|
|
<div class="app-top"> |
|
|
|
<div class="app-titel" style="margin-top: 10px"> |
|
|
|
|
|
|
|
<div class="div-lab"> |
|
|
|
<div class="label" style="min-width: 80px"> 日期： </div> |
|
|
|
<el-date-picker |
|
|
|
v-model="starTime" |
|
|
|
class="div-inp" |
|
|
|
@change="timeChange1" |
|
|
|
style="width: 250px" |
|
|
|
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 class="div-lab"> |
|
|
|
<div class="label">运营：</div> |
|
|
|
<el-select |
|
|
|
v-model="operationStaffId" |
|
|
|
placeholder="请选择" |
|
|
|
class="div-inp" |
|
|
|
filterable |
|
|
|
clearable |
|
|
|
> |
|
|
|
<el-option |
|
|
|
v-for="item in operaList" |
|
|
|
:key="item.accountId" |
|
|
|
:label="item.name" |
|
|
|
:value="item.accountId" |
|
|
|
> |
|
|
|
</el-option> |
|
|
|
</el-select> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<div class="app-titel" style="margin-top: 10px"> |
|
|
|
<div class="label" style="color: #ffffff">筛选相关：</div> |
|
|
|
<div style="margin-left: 5px"> |
|
|
|
<el-button @click="screen" type="primary">筛选</el-button> |
|
|
|
</div> |
|
|
|
<div style="margin-left: 20px"> |
|
|
|
<el-button @click="empty">清空筛选条件</el-button> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<!-- 表格 --> |
|
|
|
<div class="cen-tab"> |
|
|
|
<el-table :data="tableData" stripe style="width: 100%" > |
|
|
|
<el-table-column |
|
|
|
prop="propertyName" |
|
|
|
label="运营" |
|
|
|
align="center" |
|
|
|
> |
|
|
|
</el-table-column> |
|
|
|
|
|
|
|
<el-table-column |
|
|
|
width="120" |
|
|
|
prop="startWorking" |
|
|
|
label="负责设备总数" |
|
|
|
align="center" |
|
|
|
> |
|
|
|
</el-table-column> |
|
|
|
|
|
|
|
<el-table-column prop="endWorking" width="120" label="负责楼盘数" align="center"> |
|
|
|
</el-table-column> |
|
|
|
|
|
|
|
<el-table-column prop="endWorking" label="平均执行率" width="120" align="center"> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column prop="endWorking" width="120" label="常错词添加数" align="center"> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column prop="endWorking" width="120" label="接待错词修改条数" align="center"> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column prop="endWorking" width="120" label="标记顾问数" align="center"> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column prop="endWorking" width="120" label="未标顾问接待数" align="center"> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column prop="endWorking" width="120" label="新增违禁词数" align="center"> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column prop="endWorking" width="120" label="客户标签修改次数" align="center"> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column prop="endWorking" width="120" label="销讲话术更新次数" align="center"> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column prop="endWorking" width="120" label="登录楼盘次数" align="center"> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column prop="endWorking" width="140" label="最后一次登录楼盘时间" align="center"> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column label="操作" align="center" width="120" fixed="right"> |
|
|
|
<template slot-scope="{ row }"> |
|
|
|
<el-button |
|
|
|
type="text" |
|
|
|
@click="toinfo(row)" |
|
|
|
>查看工作明细</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="currentPage" |
|
|
|
:page-sizes="[10, 30, 50]" |
|
|
|
:page-size="size" |
|
|
|
layout="total, sizes, prev, pager, next, jumper" |
|
|
|
:total="total" |
|
|
|
> |
|
|
|
</el-pagination> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<el-dialog title="明细" :visible.sync="texteditorishow" center width="80%" :close-on-click-modal="false"> |
|
|
|
<div class="dtit-box"> |
|
|
|
<div class="div-lab1"> |
|
|
|
<div class="label1" style="margin-left:0px;"> 日期： </div> |
|
|
|
<el-date-picker |
|
|
|
v-model="starTime" |
|
|
|
@change="timeChange1" |
|
|
|
style="width: 200px" |
|
|
|
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 class="div-lab1"> |
|
|
|
<div class="label1"> 楼盘： </div> |
|
|
|
<el-input |
|
|
|
style="width: 180px" |
|
|
|
maxlength="30" |
|
|
|
clearable |
|
|
|
v-model="name" |
|
|
|
placeholder="请输入内容" |
|
|
|
></el-input> |
|
|
|
</div> |
|
|
|
<div class="div-lab1"> |
|
|
|
<div class="label1"> 操作类型： </div> |
|
|
|
<el-input |
|
|
|
style="width: 180px" |
|
|
|
maxlength="30" |
|
|
|
clearable |
|
|
|
v-model="name" |
|
|
|
placeholder="请输入内容" |
|
|
|
></el-input> |
|
|
|
</div> |
|
|
|
<div class="div-lab1"> |
|
|
|
<div class="label1"> 操作内容： </div> |
|
|
|
<el-input |
|
|
|
style="width:180px" |
|
|
|
maxlength="30" |
|
|
|
clearable |
|
|
|
v-model="name" |
|
|
|
placeholder="请输入内容" |
|
|
|
></el-input> |
|
|
|
</div> |
|
|
|
<div class="div-lab1"> |
|
|
|
<div class="label1">搜索</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div style="width:100%;margin-top: 8px;"> |
|
|
|
<el-table :data="tableData" stripe style="width: 100%" height="300" |
|
|
|
:header-cell-style="{background:'#E0E0E0'}"> |
|
|
|
<el-table-column |
|
|
|
prop="propertyName" |
|
|
|
label="操作时间" |
|
|
|
align="center" |
|
|
|
> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column |
|
|
|
prop="startWorking" |
|
|
|
label="楼盘" |
|
|
|
align="center" |
|
|
|
> |
|
|
|
</el-table-column> |
|
|
|
<el-table-column prop="endWorking" label="操作类型" align="center"> |
|
|
|
</el-table-column> |
|
|
|
|
|
|
|
<el-table-column prop="endWorking" label="操作内容" align="center"> |
|
|
|
</el-table-column> |
|
|
|
</el-table> |
|
|
|
</div> |
|
|
|
<div style="display: flex; justify-content: flex-end; margin-top: 10px"> |
|
|
|
<el-pagination |
|
|
|
@size-change="handleSizeChange" |
|
|
|
@current-change="handleCurrentChange" |
|
|
|
:current-page="currentPage" |
|
|
|
:page-sizes="[10, 30, 50]" |
|
|
|
:page-size="size" |
|
|
|
layout="total, sizes, prev, pager, next, jumper" |
|
|
|
:total="total" |
|
|
|
> |
|
|
|
</el-pagination> |
|
|
|
</div> |
|
|
|
</el-dialog> |
|
|
|
|
|
|
|
|
|
|
|
</div> |
|
|
|
</template> |
|
|
|
|
|
|
|
<script> |
|
|
|
import { mapGetters } from "vuex"; |
|
|
|
import { getAreaList } from "@/api/modules/api"; |
|
|
|
export default { |
|
|
|
data() { |
|
|
|
return { |
|
|
|
starTime:"", |
|
|
|
tableData:[ |
|
|
|
{propertyName:'还是卡顿和'} |
|
|
|
], |
|
|
|
operaList:[], |
|
|
|
operationStaffId:'', |
|
|
|
total:0, |
|
|
|
size:0, |
|
|
|
currentPage:1, |
|
|
|
texteditorishow:false, |
|
|
|
name:'' |
|
|
|
|
|
|
|
} |
|
|
|
</script> |
|
|
|
}; |
|
|
|
}, |
|
|
|
computed: { |
|
|
|
...mapGetters(["permissions"]), |
|
|
|
}, |
|
|
|
created() { |
|
|
|
this.cus_build_index_add = this.permissions["cus_build_index_add"]; |
|
|
|
}, |
|
|
|
mounted() { |
|
|
|
|
|
|
|
}, |
|
|
|
methods: { |
|
|
|
//查看工作明细 |
|
|
|
toinfo(){ |
|
|
|
this.texteditorishow=true |
|
|
|
}, |
|
|
|
//清空 |
|
|
|
empty(){ |
|
|
|
|
|
|
|
}, |
|
|
|
//筛选 |
|
|
|
screen(){ |
|
|
|
|
|
|
|
<style lang="" scoped > |
|
|
|
}, |
|
|
|
// 时间选择 |
|
|
|
timeChange1(){ |
|
|
|
|
|
|
|
}, |
|
|
|
handleSizeChange(val) { |
|
|
|
console.log(`每页 ${val} 条`); |
|
|
|
this.size = val; |
|
|
|
}, |
|
|
|
handleCurrentChange(val) { |
|
|
|
console.log(`当前页: ${val}`); |
|
|
|
this.currentPage = val; |
|
|
|
}, |
|
|
|
|
|
|
|
}, |
|
|
|
}; |
|
|
|
</script> |
|
|
|
|
|
|
|
<style scoped="scoped" lang="scss" > |
|
|
|
.box-center { |
|
|
|
width: 100%; |
|
|
|
padding: 15px; |
|
|
|
min-width: 1000px; |
|
|
|
padding-bottom: 100px; |
|
|
|
} |
|
|
|
.cen-tab { |
|
|
|
width: 100%; |
|
|
|
padding: 15px; |
|
|
|
background: #ffffff; |
|
|
|
margin-top: 15px; |
|
|
|
} |
|
|
|
.tophove { |
|
|
|
color: #ffffff; |
|
|
|
background: #2671e2; |
|
|
|
} |
|
|
|
.dtit-box{ |
|
|
|
width: 100%; |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
flex-wrap: wrap; |
|
|
|
.div-lab1{ |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
margin: 5px; |
|
|
|
.label1{ |
|
|
|
font-size: 14px; |
|
|
|
color: #32363d; |
|
|
|
line-height: 32px; |
|
|
|
margin-left: 6px; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
.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; |
|
|
|
} |
|
|
|
.toptimeqhuan div { |
|
|
|
padding-left: 20px; |
|
|
|
padding-right: 20px; |
|
|
|
text-align: center; |
|
|
|
line-height: 30px; |
|
|
|
font-size: 14px; |
|
|
|
margin-right: 15px; |
|
|
|
border-radius: 4px; |
|
|
|
border: 1px solid #e0e0e0; |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
.div-lab { |
|
|
|
display: flex; |
|
|
|
margin: 5px; |
|
|
|
} |
|
|
|
.div-inp { |
|
|
|
width: 250px; |
|
|
|
} |
|
|
|
</style> |
