@@ -1239,4 +1239,12 @@ export function updateMessageType(data) { | |||
method: 'post', | |||
data: data | |||
}) | |||
} | |||
// 日报 | |||
export function findByProjectId(data) { | |||
return request({ | |||
url: `/autoSR/customer/message/findByProjectId?id=${data}`, | |||
method: 'GET', | |||
}) | |||
} |
@@ -10,11 +10,12 @@ | |||
</div> | |||
</div> --> | |||
<div class="top-bar__left"> | |||
<div | |||
v-if="showCollapse" | |||
class="avue-breadcrumb" | |||
> | |||
<i style="color:#868686" :class="[isCollapse?'el-icon-s-unfold':'el-icon-s-fold' ]" @click="setCollapse" /> | |||
<div v-if="showCollapse" class="avue-breadcrumb"> | |||
<i | |||
style="color: #868686" | |||
:class="[isCollapse ? 'el-icon-s-unfold' : 'el-icon-s-fold']" | |||
@click="setCollapse" | |||
/> | |||
</div> | |||
</div> | |||
<div class="top-bar__title" style="display: flex; align-items: center"> | |||
@@ -42,8 +43,18 @@ | |||
: "项目后台" | |||
}} | |||
</div> | |||
<el-button @click="goChange" class="avue-header" style="margin-left: 10px;color: #2671E2;border:1px solid #2671E2;padding: 10px;">切换后台</el-button> | |||
<el-button | |||
@click="goChange" | |||
class="avue-header" | |||
style=" | |||
margin-left: 10px; | |||
color: #2671e2; | |||
border: 1px solid #2671e2; | |||
padding: 10px; | |||
" | |||
>切换后台</el-button | |||
> | |||
</div> | |||
<div | |||
v-if="companyName" | |||
@@ -63,7 +74,16 @@ | |||
<div class="daili"> | |||
{{ companyName }} | |||
</div> | |||
<el-button @click="goBack" class="avue-header" style="margin-left: 10px;color: #2671E2;border:1px solid #2671E2;padding: 10px;">{{ | |||
<el-button | |||
@click="goBack" | |||
class="avue-header" | |||
style=" | |||
margin-left: 10px; | |||
color: #2671e2; | |||
border: 1px solid #2671e2; | |||
padding: 10px; | |||
" | |||
>{{ | |||
orgType == 0 | |||
? "切换后台" | |||
: orgType == 1 | |||
@@ -71,7 +91,8 @@ | |||
: orgType == 2 | |||
? "切换公司" | |||
: "切换项目" | |||
}}</el-button> | |||
}}</el-button | |||
> | |||
</div> | |||
</div> | |||
<div class="top-bar__right"> | |||
@@ -109,42 +130,41 @@ | |||
<i class="noticeIcon"></i> | |||
<span>通知(0)</span> | |||
</div> --> | |||
<el-popover placement="bottom" trigger="hover" width="350" @show="getMessage"> | |||
<el-popover | |||
placement="bottom" | |||
trigger="hover" | |||
width="350" | |||
@show="getMessage" | |||
> | |||
<el-tabs v-model="activeName" @tab-click="handleClick"> | |||
<el-tab-pane label="接待报告" name="first"> | |||
<el-tab-pane label="接待报告" name="2"> | |||
<el-table :data="gridDatas" @row-click="msgTaps"> | |||
<el-table-column | |||
width="324" | |||
property="date" | |||
:show-header="false" | |||
> | |||
<template slot-scope="scope"> | |||
<div class="date"> | |||
<span>{{ scope.row.dates }}</span> | |||
<span>{{ scope.row.date }}</span> | |||
</div> | |||
</template> | |||
<el-table-column prop="title" :show-header="false"> | |||
</el-table-column> | |||
<el-table-column prop="createTime" :show-header="false"> | |||
</el-table-column> | |||
</el-table> | |||
</el-tab-pane> | |||
<el-tab-pane label="升级公告" name="second"> | |||
<el-tab-pane label="升级公告" name="3"> | |||
<el-table :data="gridData" @row-click="msgTap"> | |||
<el-table-column | |||
width="324" | |||
property="date" | |||
:show-header="false" | |||
> | |||
<template slot-scope="scope"> | |||
<div class="date"> | |||
<span>{{ scope.row.title }}</span> | |||
<span>{{ scope.row.createTime }}</span> | |||
</div> | |||
</template> | |||
<el-table-column width="324" property="date" :show-header="false"> | |||
<template slot-scope="scope"> | |||
<div class="date"> | |||
<span>{{ scope.row.title }}</span> | |||
<span>{{ scope.row.createTime }}</span> | |||
</div> | |||
</template> | |||
</el-table-column> | |||
</el-table> | |||
</el-tab-pane> | |||
</el-tabs> | |||
<i slot="reference" @click="toMessageList" class="el-icon-bell" style="font-size: 18px;margin-right: 24px;cursor: pointer;"></i> | |||
<i | |||
slot="reference" | |||
@click="toMessageList" | |||
class="el-icon-bell" | |||
style="font-size: 18px; margin-right: 24px; cursor: pointer" | |||
></i> | |||
</el-popover> | |||
<el-tooltip | |||
@@ -178,49 +198,54 @@ | |||
> | |||
</el-tooltip> | |||
<el-dropdown style="cursor: pointer"> | |||
<span class="el-dropdown-link" style="display:flex;align-items: center;"> | |||
<el-avatar :size="30" :src="circleUrl" style="margin-right:5px"></el-avatar> | |||
<span | |||
class="el-dropdown-link" | |||
style="display: flex; align-items: center" | |||
> | |||
<el-avatar | |||
:size="30" | |||
:src="circleUrl" | |||
style="margin-right: 5px" | |||
></el-avatar> | |||
{{ userInfo.username }} | |||
<i class="el-icon-arrow-down el-icon--right" /> | |||
</span> | |||
<el-dropdown-menu slot="dropdown" style="width:160px"> | |||
<el-dropdown-menu slot="dropdown" style="width: 160px"> | |||
<el-dropdown-item divided> | |||
<router-link to="/"> | |||
<span class="accountIcon"> | |||
<i class="accountIcon1"></i> | |||
首页 | |||
</span> | |||
<span class="accountIcon"> | |||
<i class="accountIcon1"></i> | |||
首页 | |||
</span> | |||
</router-link> | |||
</el-dropdown-item> | |||
<el-dropdown-item divided @click.native="$refs.seting.open()" | |||
> | |||
<el-dropdown-item divided @click.native="$refs.seting.open()"> | |||
<span class="accountIcon"> | |||
<i class="accountIcon3"></i> | |||
主题设置 | |||
</span> | |||
<i class="accountIcon3"></i> | |||
主题设置 | |||
</span> | |||
</el-dropdown-item> | |||
<el-dropdown-item v-if="false" divided> | |||
<router-link to="/help/index"> | |||
<span class="accountIcon"> | |||
<i class="accountIcon2"></i> | |||
帮助中心 | |||
</span> | |||
<i class="accountIcon2"></i> | |||
帮助中心 | |||
</span> | |||
</router-link> | |||
</el-dropdown-item> | |||
<el-dropdown-item divided> | |||
<router-link to="/info/index"> | |||
<span class="accountIcon"> | |||
<i class="accountIcon3"></i> | |||
账号设置 | |||
</span> | |||
<i class="accountIcon3"></i> | |||
账号设置 | |||
</span> | |||
</router-link> | |||
</el-dropdown-item> | |||
<el-dropdown-item divided @click.native="logout" | |||
> | |||
<el-dropdown-item divided @click.native="logout"> | |||
<span class="accountIcon"> | |||
<i class="accountIcon4"></i> | |||
退出系统 | |||
</span> | |||
<i class="accountIcon4"></i> | |||
退出系统 | |||
</span> | |||
</el-dropdown-item> | |||
</el-dropdown-menu> | |||
</el-dropdown> | |||
@@ -251,13 +276,14 @@ export default { | |||
filters: {}, | |||
data() { | |||
return { | |||
circleUrl:"https://cube.elemecdn.com/3/7c/3ea6beec64369c2642b92c6726f1epng.png", | |||
circleUrl: | |||
"https://cube.elemecdn.com/3/7c/3ea6beec64369c2642b92c6726f1epng.png", | |||
options: [], | |||
value: "", | |||
companyName: localStorage.getItem("topName"), | |||
orgType: localStorage.getItem("orgType"), | |||
info: {}, | |||
activeName: 'first', | |||
activeName: "2", | |||
gridData: [], // 消息列表 | |||
gridDatas: [], // 日/周报列表 | |||
}; | |||
@@ -297,40 +323,61 @@ export default { | |||
getMessage() { | |||
// 固定获取当前的项目的 | |||
let paramsData = { | |||
id: '', // | |||
id: "", // | |||
num: 1, // 第几页 | |||
size: 10, // 条数 | |||
} | |||
this.$api.http.messageList(paramsData).then(res => { | |||
console.log(res, 'asdkdakl;asdadl;skdasl;adskl;sadkl;dsak;ldsa;lksd') | |||
if (res.success) { | |||
this.gridData = res.data.list.records | |||
} | |||
}).catch(e => { | |||
console.log(e) | |||
}) | |||
size: 5, // 条数 | |||
messageType: Number(this.activeName), | |||
}; | |||
this.$api.http | |||
.messageList(paramsData) | |||
.then((res) => { | |||
console.log(res, "asdkdakl;asdadl;skdasl;adskl;sadkl;dsak;ldsa;lksd"); | |||
if (res.success) { | |||
if (paramsData.messageType == 3) | |||
this.gridData = res.data.list.records; | |||
if (paramsData.messageType != 3) | |||
this.gridDatas = res.data.list.records; | |||
} | |||
}) | |||
.catch((e) => { | |||
console.log(e); | |||
}); | |||
}, | |||
// 跳转公告列表页面 | |||
toMessageList() { | |||
this.$router.push('/message') | |||
this.$router.push("/message"); | |||
}, | |||
// 弹窗消息点击触发事件 | |||
msgTaps(e) { | |||
console.log(e, 'asdjilksajl') | |||
return | |||
console.log(e, "asdjilksajl"); | |||
// return | |||
if (e.messageType == 1) { | |||
// 日报 | |||
this.$router.push({ | |||
path: "/reportExcel/dayReport", | |||
query: { | |||
id: e.id, | |||
}, | |||
}); | |||
} | |||
// 日报 | |||
// this.$router.push('/reportExcel/dayReport') | |||
// 周报 | |||
// this.$router.push('/reportExcel/weekReport') | |||
if (e.messageType == 2) { | |||
// 周报 | |||
this.$router.push({ | |||
path: "/reportExcel/weekReport", | |||
query: { | |||
id: e.id, | |||
}, | |||
}); | |||
} | |||
}, | |||
// 弹窗消息点击触发事件 | |||
msgTap(e) { | |||
console.log(e, 'asdjilksajl') | |||
this.$store.commit('setMessage', e) | |||
this.$router.push('/message/detail') | |||
console.log(e, "asdjilksajl"); | |||
this.$store.commit("setMessage", e); | |||
this.$router.push("/message/detail"); | |||
}, | |||
handleScreen() { | |||
@@ -545,7 +592,7 @@ export default { | |||
setScreen() { | |||
this.$store.commit("SET_FULLSCREEN"); | |||
}, | |||
helpCenter(){ | |||
helpCenter() { | |||
this.$router.push({ path: "/login" }); | |||
}, | |||
logout() { | |||
@@ -564,76 +611,82 @@ export default { | |||
</script> | |||
<style lang="scss" scoped> | |||
.accountIcon{ | |||
.accountIcon { | |||
display: flex; | |||
align-items: center; | |||
.accountIcon1{ | |||
.accountIcon1 { | |||
display: block; | |||
background: url('../../../../public/img/icon/accountIconSel1.png') no-repeat; | |||
background: url("../../../../public/img/icon/accountIconSel1.png") no-repeat; | |||
width: 16px; | |||
height: 16px; | |||
background-size: 100%; | |||
margin-right: 8px; | |||
} | |||
.accountIcon2{ | |||
.accountIcon2 { | |||
display: block; | |||
background: url('../../../../public/img/icon/accountIconSel2.png') no-repeat; | |||
background: url("../../../../public/img/icon/accountIconSel2.png") no-repeat; | |||
width: 16px; | |||
height: 16px; | |||
background-size: 100%; | |||
margin-right: 8px; | |||
} | |||
.accountIcon3{ | |||
.accountIcon3 { | |||
display: block; | |||
background: url('../../../../public/img/icon/accountIconSel3.png') no-repeat; | |||
background: url("../../../../public/img/icon/accountIconSel3.png") no-repeat; | |||
width: 16px; | |||
height: 16px; | |||
background-size: 100%; | |||
margin-right: 8px; | |||
} | |||
.accountIcon4{ | |||
.accountIcon4 { | |||
display: block; | |||
background: url('../../../../public/img/icon/accountIconSel4.png') no-repeat; | |||
background: url("../../../../public/img/icon/accountIconSel4.png") no-repeat; | |||
width: 16px; | |||
height: 16px; | |||
background-size: 100%; | |||
margin-right: 8px; | |||
} | |||
} | |||
.notice{ | |||
.notice { | |||
display: flex; | |||
align-items: center; | |||
margin-right: 20px; | |||
cursor: pointer; | |||
.noticeIcon{ | |||
.noticeIcon { | |||
display: block; | |||
background: url('../../../../public/img/icon/noticeIcon.png') no-repeat; | |||
background: url("../../../../public/img/icon/noticeIcon.png") no-repeat; | |||
width: 16px; | |||
height: 16px; | |||
background-size: 100%; | |||
} | |||
span{ | |||
font-size: 15px;color: #32363D;font-weight: 400;margin-left: 5px; | |||
span { | |||
font-size: 15px; | |||
color: #32363d; | |||
font-weight: 400; | |||
margin-left: 5px; | |||
} | |||
} | |||
.msg{ | |||
.msg { | |||
display: flex; | |||
align-items: center; | |||
margin-right: 20px; | |||
cursor: pointer; | |||
.msgIcon{ | |||
.msgIcon { | |||
display: block; | |||
background: url('../../../../public/img/icon/msgIcon.png') no-repeat; | |||
background: url("../../../../public/img/icon/msgIcon.png") no-repeat; | |||
width: 16px; | |||
height: 16px; | |||
background-size: 100%; | |||
} | |||
span{ | |||
font-size: 15px;color: #32363D;font-weight: 400;margin-left: 5px; | |||
span { | |||
font-size: 15px; | |||
color: #32363d; | |||
font-weight: 400; | |||
margin-left: 5px; | |||
} | |||
} | |||
.daili { | |||
color: #32363D; | |||
color: #32363d; | |||
font-size: 14px; | |||
margin-left: 4px; | |||
} | |||
@@ -657,8 +710,8 @@ export default { | |||
display: flex; | |||
flex-direction: column; | |||
} | |||
/deep/ .el-dropdown-menu__item--divided{ | |||
border:none !important; | |||
/deep/ .el-dropdown-menu__item--divided { | |||
border: none !important; | |||
} | |||
/deep/.has-gutter { | |||
display: none; | |||
@@ -455,9 +455,11 @@ export default { | |||
this.addFlag = boolean; | |||
if (row.messageType) { | |||
console.log(row.messageType, "这里是messagetype"); | |||
this.checkList = row.messageType.split(',') | |||
this.$forceUpdate() // 某些浏览器上无法更新 | |||
this.checkList = row.messageType.split(","); | |||
} else { | |||
this.checkList = []; | |||
} | |||
this.$forceUpdate(); // 某些浏览器上无法更新 | |||
}, | |||
// 取消推送 | |||
@@ -468,11 +470,11 @@ export default { | |||
// 确认添加 | |||
addPush() { | |||
console.log(this.checkList) | |||
console.log(this.checkList); | |||
if (this.checkList.length > 0) { | |||
this.form.messageType = this.checkList.join(","); | |||
} else { | |||
this.form.messageType = '' | |||
this.form.messageType = ""; | |||
} | |||
putObj(this.form).then((res) => { | |||
console.log(res); | |||
@@ -114,6 +114,7 @@ export default { | |||
size:10, | |||
orgType:this.selValue, | |||
} | |||
if (data.orgType == 3) data.messageType = 3 | |||
this.filefindByPage(data) | |||
}, | |||
methods: { | |||
@@ -125,6 +126,7 @@ export default { | |||
startTime:this.time[0], | |||
endTime:this.time[1], | |||
} | |||
if (data.orgType == 3) data.messageType = 3 | |||
this.filefindByPage(data) | |||
}, | |||
timeChange() {}, | |||
@@ -141,6 +143,7 @@ export default { | |||
startTime:this.time[0], | |||
endTime:this.time[1] | |||
} | |||
if (data.orgType == 3) data.messageType = 3 | |||
this.filefindByPage(data); | |||
}, | |||
empty() { | |||
@@ -1,42 +1,67 @@ | |||
<template> | |||
<div class="app-container calendar-list-container"> | |||
<basic-container> | |||
<template> | |||
<!-- 内容盒子 --> | |||
<div class="table-box"> | |||
<el-table | |||
:data="tableData" | |||
style="width: 100%" | |||
:show-header="false" | |||
@row-click="toDetail" | |||
> | |||
<el-table-column> | |||
<template slot-scope="scope"> | |||
<div class="line-box"> | |||
<div class="title" :class="{point: scope.row.readFlag == 0}">{{ scope.row.title }}</div> | |||
</div> | |||
</template> | |||
</el-table-column> | |||
<el-table-column prop="createTime" width="300"> </el-table-column> | |||
</el-table> | |||
</div> | |||
<div class="btmpagiation"> | |||
<div class="block"> | |||
<el-pagination | |||
@size-change="handleSizeChange" | |||
@current-change="handleCurrentChange" | |||
:current-page="currentPage" | |||
:page-sizes="[10, 20, 30, 40]" | |||
:page-size="paramsObj.size" | |||
layout="total, sizes, prev, pager, next, jumper" | |||
:total="total" | |||
<div class="app-container"> | |||
<div class="containerbox"> | |||
<!-- 内容盒子 --> | |||
<div class="table-box"> | |||
<!-- <el-tabs v-model="activeName" @tab-click="handleClick"> --> | |||
<!-- <el-tab-pane label="接待报告" name="2"> --> | |||
<el-table class="tabs" :data="gridDatas" @row-click="msgTaps"> | |||
<el-table-column prop="title" :show-header="false"> | |||
</el-table-column> | |||
<el-table-column prop="createTime" :show-header="false"> | |||
</el-table-column> | |||
</el-table> | |||
<!-- </el-tab-pane> --> | |||
<!-- <el-tab-pane label="升级公告" name="3"> | |||
<el-table | |||
:data="tableData" | |||
style="width: 100%; height: 100%" | |||
:show-header="false" | |||
@row-click="toDetail" | |||
> | |||
</el-pagination> | |||
</div> | |||
</div> | |||
</template> | |||
</basic-container> | |||
<el-table-column> | |||
<template slot-scope="scope"> | |||
<div class="line-box"> | |||
<div | |||
class="title" | |||
:class="{ point: scope.row.readFlag == 0 }" | |||
> | |||
{{ scope.row.title }} | |||
</div> | |||
</div> | |||
</template> | |||
</el-table-column> | |||
<el-table-column prop="createTime" width="300"> </el-table-column> | |||
</el-table> | |||
<el-table :data="gridData" @row-click="msgTap"> | |||
<el-table-column width="324" property="date" :show-header="false"> | |||
<template slot-scope="scope"> | |||
<div class="date"> | |||
<span>{{ scope.row.title }}</span> | |||
<span>{{ scope.row.createTime }}</span> | |||
</div> | |||
</template> | |||
</el-table-column> | |||
</el-table> | |||
</el-tab-pane> --> | |||
<!-- </el-tabs> --> | |||
</div> | |||
<div class="btmpagiation"> | |||
<el-pagination | |||
@size-change="handleSizeChange" | |||
@current-change="handleCurrentChange" | |||
:current-page="currentPage" | |||
:page-sizes="[10, 20, 30, 40]" | |||
:page-size="paramsObj.size" | |||
layout="total, sizes, prev, pager, next, jumper" | |||
:total="total" | |||
> | |||
</el-pagination> | |||
</div> | |||
</div> | |||
</div> | |||
</template> | |||
@@ -56,31 +81,71 @@ export default { | |||
// 当前页面的参数 | |||
num: 1, | |||
size: 10, | |||
messageType: 2, | |||
}, | |||
gridData: [], // 消息列表 | |||
gridDatas: [], // 日/周报列表 | |||
pageObj: {}, // 当前列表页的全部数据 | |||
activeName: "2", // 当前选中的table | |||
}; | |||
}, | |||
computed: { | |||
// 数据总条数 | |||
total() { | |||
return this.pageObj.list.total | |||
} | |||
return this.pageObj.list.total; | |||
}, | |||
}, | |||
mounted() { | |||
this.getMessageList() | |||
this.getMessageList(); | |||
}, | |||
methods: { | |||
// 弹窗消息点击触发事件 | |||
msgTap(e) { | |||
console.log(e, 'asdjilksajl') | |||
this.$store.commit('setMessage', e) | |||
this.$router.push('/message/detail') | |||
}, | |||
// 弹窗消息点击触发事件 | |||
msgTaps(e) { | |||
console.log(e, "asdjilksajl"); | |||
// return | |||
if (e.messageType == 1) { | |||
// 日报 | |||
this.$router.push({ | |||
path: "/reportExcel/dayReport", | |||
query: { | |||
id: e.id, | |||
}, | |||
}); | |||
} | |||
if (e.messageType == 2) { | |||
// 周报 | |||
this.$router.push({ | |||
path: "/reportExcel/weekReport", | |||
query: { | |||
id: e.id, | |||
}, | |||
}); | |||
} | |||
}, | |||
// 获取公告列表 | |||
getMessageList() { | |||
this.$api.http | |||
.messageList(this.paramsObj) | |||
.then((res) => { | |||
if (res.success) { | |||
this.tableData = res.data.list.records; | |||
this.pageObj = res.data | |||
if (this.paramsObj.messageType == 3) | |||
this.gridData = res.data.list.records; | |||
if (this.paramsObj.messageType != 3) | |||
this.gridDatas = res.data.list.records; | |||
this.pageObj = res.data; | |||
} | |||
}) | |||
.catch((e) => { | |||
@@ -90,20 +155,19 @@ export default { | |||
// 跳转详情页面 | |||
toDetail(item) { | |||
this.$store.commit('setMessage', item) | |||
this.$store.commit("setMessage", item); | |||
this.$router.push("/message/detail"); | |||
}, | |||
// 改变当前分页条数 | |||
handleSizeChange(val) { | |||
console.log(`每页 ${val} 条`); | |||
this.paramsObj.size = val | |||
this.getMessageList() | |||
this.paramsObj.size = val; | |||
this.getMessageList(); | |||
}, | |||
handleCurrentChange(val) { | |||
this.paramsObj.num = val | |||
this.getMessageList() | |||
this.paramsObj.num = val; | |||
this.getMessageList(); | |||
}, | |||
}, | |||
}; | |||
@@ -111,8 +175,37 @@ export default { | |||
<style lang="scss" scoped> | |||
.app-container { | |||
padding: 0 20px; | |||
width: 100%; | |||
height: 100%; | |||
} | |||
.containerbox { | |||
width: 100%; | |||
height: 95%; | |||
background: #fff; | |||
border-radius: 8px; | |||
overflow: hidden; | |||
display: flex; | |||
flex-direction: column; | |||
} | |||
.table-box { | |||
flex-grow: 1; | |||
padding: 0 20px; | |||
height: calc(100% - 72px); | |||
display: flex; | |||
flex-direction: column; | |||
.tabs { | |||
width: 100%; | |||
height: 100%; | |||
overflow-y: scroll; | |||
} | |||
} | |||
.btmpagiation { | |||
margin-top: 20px; | |||
flex-shrink: 0; | |||
margin: 20px 0; | |||
padding: 0 20px; | |||
display: flex; | |||
justify-content: flex-end; | |||
} | |||
@@ -3,11 +3,11 @@ | |||
<div class="page-box"> | |||
<div class="head-box"> | |||
<p class="h-item"> | |||
<span class="titles">桃源山庄数智工牌日报</span> | |||
<span>01月24日</span> | |||
<span class="titles">{{ projectName }}销讲助手日报</span> | |||
<span>{{ weekObj.createTime | fomatDate }}</span> | |||
</p> | |||
<p class="h-item" style="padding: 8px 0 0 0"> | |||
<span class="times">生成时间:2022-01-30 8:00</span> | |||
生成时间:<span class="times">{{ weekObj.createTime || "--" }}</span> | |||
</p> | |||
</div> | |||
@@ -15,37 +15,72 @@ | |||
<div class="page-contanier"> | |||
<div class="item"> | |||
<span class="serial">01</span> | |||
<div class="texts">接待量 100</div> | |||
<div class="texts">有效接待 80</div> | |||
<div class="texts">有效接待率 80</div> | |||
<div class="texts">对比昨天 -5%</div> | |||
<div class="texts">接待量 {{ weekObj.receptionCount || 0 }}</div> | |||
<div class="texts"> | |||
有效接待 {{ weekObj.activeCustomer || 0 }} | |||
</div> | |||
<div class="texts"> | |||
有效接待率 {{ weekObj.validReceptionRate > 0 ? "+" : "" | |||
}}{{ weekObj.validReceptionRate || 0 }}% | |||
</div> | |||
<div class="texts"> | |||
对比昨天 | |||
<span | |||
:class="{ | |||
down: weekObj.validReceptionRatePK < 0, | |||
up: weekObj.validReceptionRatePK > 0, | |||
}" | |||
>{{ weekObj.validReceptionRatePK > 0 ? "+" : "" | |||
}}{{ weekObj.validReceptionRatePK || 0 }}%</span | |||
> | |||
</div> | |||
</div> | |||
<div class="item"> | |||
<span class="serial">02</span> | |||
<div class="texts">销讲执行率 100</div> | |||
<div class="texts">对比昨天 -5%</div> | |||
<div class="texts">销讲执行率 {{ weekObj.fraction || 0 }}%</div> | |||
<div class="texts"> | |||
对比昨天 | |||
<span | |||
:class="{ | |||
down: weekObj.fractionPK < 0, | |||
up: weekObj.fractionPK > 0, | |||
}" | |||
>{{ weekObj.fractionPK > 0 ? "+" : "" | |||
}}{{ weekObj.fractionPK || 0 }}%</span | |||
> | |||
</div> | |||
</div> | |||
<div class="item"> | |||
<span class="serial">03</span> | |||
<div class="texts">销讲执行率 100</div> | |||
<div class="texts">对比昨天 -5%</div> | |||
<div class="texts"> | |||
平均接待时长 {{ weekObj.avgDuration || 0 }}min | |||
</div> | |||
<div class="texts"> | |||
对比昨天 <span | |||
:class="{ | |||
down: weekObj.avgDurationPK < 0, | |||
up: weekObj.avgDurationPK > 0, | |||
}" | |||
>{{ weekObj.avgDurationPK > 0 ? "+" : "" | |||
}}{{ weekObj.avgDurationPK }}min</span | |||
> | |||
</div> | |||
</div> | |||
<div class="item littles"> | |||
<span class="serial">04</span> | |||
<div class="texts">销讲维度执行前三:</div> | |||
<div class="list"> | |||
<div class="list-item"> | |||
<span class="left">1</span> | |||
<span class="right">产品设计(100%)</span> | |||
</div> | |||
<div class="list-item"> | |||
<span class="left">2</span> | |||
<span class="right">沙盘讲解(100%)</span> | |||
</div> | |||
<div class="list-item"> | |||
<span class="left">3</span> | |||
<span class="right">品牌介绍(100%)</span> | |||
<div | |||
class="list-item" | |||
v-for="(rank, rankIndex) in carryOutTop" | |||
:key="rankIndex" | |||
> | |||
<span class="left">{{ rankIndex + 1 }}</span> | |||
<span class="right" | |||
>{{ rank.title || "--" }}({{ rank.value || 0 }}%)</span | |||
> | |||
</div> | |||
<div v-if="carryOutTop.length == 0" class="empty">暂无数据</div> | |||
</div> | |||
</div> | |||
@@ -53,18 +88,17 @@ | |||
<span class="serial">05</span> | |||
<div class="texts">销讲维度执行弱项前三:</div> | |||
<div class="list"> | |||
<div class="list-item"> | |||
<span class="left">1</span> | |||
<span class="right">产品设计(100%)</span> | |||
</div> | |||
<div class="list-item"> | |||
<span class="left">2</span> | |||
<span class="right">沙盘讲解(100%)</span> | |||
</div> | |||
<div class="list-item"> | |||
<span class="left">3</span> | |||
<span class="right">品牌介绍(100%)</span> | |||
<div | |||
class="list-item" | |||
v-for="(rank, rankIndex) in carryOutLast" | |||
:key="rankIndex" | |||
> | |||
<span class="left">{{ rankIndex + 1 }}</span> | |||
<span class="right" | |||
>{{ rank.title || "--" }} ({{ rank.value || 0 }}%)</span | |||
> | |||
</div> | |||
<div v-if="carryOutLast.length == 0" class="empty">暂无数据</div> | |||
</div> | |||
</div> | |||
@@ -72,18 +106,17 @@ | |||
<span class="serial">06</span> | |||
<div class="texts">置业顾问平均执行率排名:</div> | |||
<div class="list"> | |||
<div class="list-item"> | |||
<span class="left">1</span> | |||
<span class="right">产品设计(100%)</span> | |||
</div> | |||
<div class="list-item"> | |||
<span class="left">2</span> | |||
<span class="right">沙盘讲解(100%)</span> | |||
</div> | |||
<div class="list-item"> | |||
<span class="left">3</span> | |||
<span class="right">品牌介绍(100%)</span> | |||
<div | |||
class="list-item" | |||
v-for="(rank, rankIndex) in consultant" | |||
:key="rankIndex" | |||
> | |||
<span class="left">{{ rankIndex + 1 }}</span> | |||
<span class="right" | |||
>{{ rank.title || "--" }}({{ rank.value || 0 }}%)</span | |||
> | |||
</div> | |||
<div class="empty" v-if="consultant.length == 0">暂无数据</div> | |||
</div> | |||
</div> | |||
@@ -91,40 +124,46 @@ | |||
<span class="serial">07</span> | |||
<div class="texts">置业顾问平均接访录音排名:</div> | |||
<div class="list"> | |||
<div class="list-item"> | |||
<span class="left">1</span> | |||
<span class="right">产品设计(100%)</span> | |||
</div> | |||
<div class="list-item"> | |||
<span class="left">2</span> | |||
<span class="right">沙盘讲解(100%)</span> | |||
</div> | |||
<div class="list-item"> | |||
<span class="left">3</span> | |||
<span class="right">品牌介绍(100%)</span> | |||
<div | |||
class="list-item" | |||
v-for="(rank, rankIndex) in recording" | |||
:key="rankIndex" | |||
> | |||
<span class="left">{{ rankIndex + 1 }}</span> | |||
<span class="right" | |||
>{{ rank.title || "--" }}({{ rank.value || 0 }}min)</span | |||
> | |||
</div> | |||
<div v-if="recording.length == 0" class="empty">暂无数据</div> | |||
</div> | |||
</div> | |||
<div class="item"> | |||
<span class="serial">08</span> | |||
<div class="texts">执行率最低的顾问:孙俊 34%</div> | |||
<div class="texts">对比昨天 -5%</div> | |||
<div class="texts"> | |||
执行率最低的顾问:{{ lowest.title }} {{ lowest.value }}% | |||
</div> | |||
</div> | |||
<div class="item"> | |||
<span class="serial">09</span> | |||
<div class="texts">客户画像触达: 897</div> | |||
<div class="texts"> | |||
客户画像触达: {{ weekObj.reachSum || 0 }}次 | |||
</div> | |||
</div> | |||
<div class="item"> | |||
<span class="serial">10</span> | |||
<div class="texts">未标记接待数: 15</div> | |||
<div class="texts"> | |||
未标记接待数: {{ weekObj.unlabelledReceptionNum || 0 }}条 | |||
</div> | |||
</div> | |||
<div class="item"> | |||
<span class="serial">11</span> | |||
<div class="texts">设备情况:在线15 离线4</div> | |||
<div class="texts"> | |||
设备情况:在线{{ onlineNum }} 离线{{ offlineNum || 0 }} | |||
</div> | |||
</div> | |||
</div> | |||
</div> | |||
@@ -133,97 +172,231 @@ | |||
<script> | |||
export default { | |||
data() { | |||
return {}; | |||
return { | |||
needList: ["XJTop", "ZXLTop", "avgJds"], // 需要转换数组的内容 | |||
carryOutTop: [], // 销讲维度执行前三: | |||
carryOutLast: [], // 销讲维度执行倒三: | |||
consultant: [], // 置业顾问排名 | |||
recording: [], // 录音排名 | |||
lowest: {}, // 执行率最低的顾问 | |||
id: "", // 消息id | |||
projectName: "", // 项目名称 | |||
weekObj: {}, // 日报详情 | |||
}; | |||
}, | |||
}; | |||
</script> | |||
<style lang="scss" scoped> | |||
.pages { | |||
margin: 20px 0 0 0; | |||
padding: 0 16px; | |||
width: 100%; | |||
computed: { | |||
onlineNum() { | |||
if (this.weekObj.equipmentInfo && this.weekObj.equipmentInfo.onlineNum) { | |||
return this.weekObj.equipmentInfo.onlineNum; | |||
} else { | |||
return 0; | |||
} | |||
}, | |||
offlineNum() { | |||
if (this.weekObj.equipmentInfo && this.weekObj.equipmentInfo.offlineNum) { | |||
return this.weekObj.equipmentInfo.offlineNum; | |||
} else { | |||
return 0; | |||
} | |||
}, | |||
}, | |||
mounted() { | |||
if (this.$route.query.id) this.id = this.$route.query.id; | |||
this.getDetail(); | |||
}, | |||
.page-box { | |||
padding: 16px 18px; | |||
background: #fff; | |||
.head-box { | |||
padding: 0 0 16px 0; | |||
width: 100%; | |||
display: flex; | |||
flex-direction: column; | |||
justify-content: center; | |||
border-bottom: 1px solid #e0e0e0; | |||
.h-item { | |||
margin: 0; | |||
.titles { | |||
margin: 0 16px 0 0; | |||
font-size: 18px; | |||
font-weight: 500; | |||
methods: { | |||
// 获取详情 | |||
getDetail() { | |||
this.$api.api.findByProjectId(this.id).then((res) => { | |||
if (res.code == 10000) { | |||
var data = JSON.parse(res.data.zkMessage.content); | |||
this.weekObj = { | |||
...res.data.zkMessage, | |||
...data, | |||
}; | |||
this.projectName = res.data.projectName; | |||
this.init(); | |||
} | |||
}); | |||
}, | |||
.times { | |||
font-size: 14px; | |||
color: #666666; | |||
} | |||
// 分割数组排名前三,倒三 | |||
getTopThree() { | |||
if (this.weekObj.XJTopList && this.weekObj.XJTopList.length > 0) { | |||
let arr = this.weekObj.XJTopList.slice(0, 3); | |||
arr.forEach((item) => { | |||
if (item.value != 100) { | |||
this.carryOutLast.push(item); | |||
} | |||
}); | |||
this.carryOutTop = this.weekObj.XJTopList.reverse().slice(0, 3); | |||
} | |||
if (this.weekObj.ZXLTopList && this.weekObj.ZXLTopList.length > 0) { | |||
this.lowest = this.weekObj.ZXLTopList[0]; | |||
this.consultant = this.weekObj.ZXLTopList.reverse().slice(0, 3); | |||
} | |||
} | |||
.page-contanier { | |||
padding: 20px 0 0 0; | |||
display: flex; | |||
flex-wrap: wrap; | |||
.item { | |||
margin: 0 0 20px 0; | |||
width: 100%; | |||
display: flex; | |||
align-items: center; | |||
&.littles { | |||
width: 25%; | |||
flex-wrap: wrap; | |||
.list { | |||
margin: 12px 0 0 38px; | |||
width: 75%; | |||
.list-item { | |||
margin-bottom: 12px; | |||
display: flex; | |||
align-content: center; | |||
.left { | |||
margin-right: 8px; | |||
width: 20px; | |||
height: 20px; | |||
border-radius: 50%; | |||
color: #fff; | |||
background: #2671e2; | |||
text-align: center; | |||
line-height: 20px; | |||
} | |||
} | |||
if (this.weekObj.avgJdsList && this.weekObj.avgJdsList.length > 0) { | |||
this.recording = this.weekObj.avgJdsList.reverse().slice(0, 3); | |||
} | |||
}, | |||
init() { | |||
// 把对象转成数组并在后续的步骤方便处理 | |||
this.needList.forEach((item) => { | |||
if (this.weekObj[item] && Object.keys(this.weekObj[item]).length > 0) { | |||
this.weekObj[item + "List"] = []; // 销讲执行 | |||
for (let i in this.weekObj[item]) { | |||
this.weekObj[item + "List"].push({ | |||
title: i, | |||
value: this.weekObj[item][i], | |||
}); | |||
} | |||
} | |||
}); | |||
this.sortInitArr(); | |||
}, | |||
.serial { | |||
padding: 4px; | |||
border: 1px solid #999999; | |||
font-size: 16px; | |||
color: #333; | |||
font-weight: 500; | |||
border-radius: 4px; | |||
// 排序对象转换后的数组 | |||
sortInitArr() { | |||
this.needList.forEach((item) => { | |||
if (this.weekObj[item + "List"]) { | |||
this.bubbleSort(this.weekObj[item + "List"]); | |||
} | |||
}); | |||
this.getTopThree(); | |||
}, | |||
.texts { | |||
margin-left: 10px; | |||
// 冒泡排序 | |||
bubbleSort(arr) { | |||
for (let i = 0; i < arr.length - 1; i += 1) { | |||
//通过 arr.length 次把第一位放到最后,完成排序 | |||
//-i是因为最后的位置是会动态改变的,当完成一次后,最后一位会变成倒数第二位 | |||
for (let j = 0; j < arr.length - 1 - i; j += 1) { | |||
if (arr[j].value > arr[j + 1].value) { | |||
const temp = arr[j]; | |||
arr[j] = arr[j + 1]; | |||
arr[j + 1] = temp; | |||
} | |||
} | |||
} | |||
} | |||
} | |||
}, | |||
}, | |||
filters: { | |||
// 格式化时间 | |||
fomatDate(date) { | |||
if (!date) return "--"; | |||
var arr = date.split(" "); | |||
var str = arr[0]; | |||
var result = str.split("-"); | |||
return result[1] + "-" + result[2]; | |||
}, | |||
}, | |||
}; | |||
</script> | |||
<style lang="scss" scoped> | |||
.pages { | |||
margin: 20px 0 0 0; | |||
padding: 0 16px; | |||
width: 100%; | |||
} | |||
.pages .page-box { | |||
padding: 16px 18px; | |||
background: #fff; | |||
} | |||
.head-box { | |||
padding: 0 0 16px 0; | |||
width: 100%; | |||
display: flex; | |||
flex-direction: column; | |||
justify-content: center; | |||
border-bottom: 1px solid #e0e0e0; | |||
} | |||
.head-box .h-item { | |||
margin: 0; | |||
} | |||
.head-box .titles { | |||
margin: 0 16px 0 0; | |||
font-size: 18px; | |||
font-weight: 500; | |||
} | |||
.head-box .times { | |||
font-size: 14px; | |||
color: #666666; | |||
} | |||
.page-contanier { | |||
padding: 20px 0 0 0; | |||
display: flex; | |||
flex-wrap: wrap; | |||
} | |||
.page-contanier .item { | |||
margin: 0 0 20px 0; | |||
width: 100%; | |||
display: flex; | |||
align-items: center; | |||
} | |||
.page-contanier .littles { | |||
width: 25%; | |||
flex-wrap: wrap; | |||
} | |||
.page-contanier .littles .list { | |||
margin: 0 0 0 38px; | |||
padding: 14px 0 0 0; | |||
width: 75%; | |||
min-height: 120px; | |||
} | |||
.page-contanier .littles .list .list-item { | |||
margin-bottom: 12px; | |||
display: flex; | |||
align-content: center; | |||
} | |||
.page-contanier .littles .list .list-item .left { | |||
margin-right: 8px; | |||
width: 20px; | |||
height: 20px; | |||
border-radius: 50%; | |||
color: #fff; | |||
background: #2671e2; | |||
text-align: center; | |||
line-height: 20px; | |||
} | |||
.page-contanier .item .serial { | |||
padding: 4px; | |||
border: 1px solid #999999; | |||
font-size: 16px; | |||
color: #333; | |||
font-weight: 500; | |||
border-radius: 4px; | |||
} | |||
.page-contanier .item .texts { | |||
margin-left: 10px; | |||
} | |||
.up { | |||
color: #43cd80; | |||
} | |||
.down { | |||
color: #e6273a; | |||
} | |||
.empty { | |||
width: 126px; | |||
height: 120px; | |||
display: flex; | |||
justify-content: center; | |||
align-items: center; | |||
} | |||
</style> |
@@ -3,10 +3,10 @@ | |||
* https://cli.vuejs.org/zh/config/ | |||
*/ | |||
// const url = 'http://192.168.31.161:9999' //长龙 | |||
// const url = 'http://192.168.31.101:9999' // 胜浩 | |||
const url = 'http://192.168.31.108:9999' // 胜浩 | |||
// const url = 'https://zanyong.hfju.com' // 正式域名 | |||
// const url = 'http://127.0.0.1:9999' // 本地 | |||
const url = 'http://81.70.55.170:9999' // 新测试 | |||
// const url = 'http://81.70.55.170:9999' // 新测试 | |||
// const url = 'http://82.156.35.22:9999' // 新正式ip | |||
const CompressionWebpackPlugin = require('compression-webpack-plugin') | |||
const productionGzipExtensions = ['js', 'css'] | |||