Skip to content

S
SuperMan
Commit b4034d5b authored by 黄奎's avatar 黄奎
Browse files
Options

页面修改

parent c71dbf8a
Hide whitespace changes
Inline Side-by-side
Showing with 1110 additions and 786 deletions
src/assets/utils/chartsUtils.js
View file @ b4034d5b
......@@ -112,113 +112,117 @@ var chartsUtils = {
},
//销售 任务管理 部门执行力
saleTaskDepartment: function(id, myTitle, myValue, insideColor, outsideColor) {
var myChart3 = selfechart.init(document.getElementById(id));
myChart3.setOption({
series: [{
name: '业务指标',
type: 'gauge',
detail: {
show: true,
backgroundColor: 'rgba(0,0,0,0)',
borderWidth: 0,
borderColor: '#ccc',
offsetCenter: [0, '10%'],
formatter: '{value}%',
textStyle: {
color: insideColor, //百分比
fontSize: 15
}
},
radius: '90%',
startAngle: 200,
endAngle: -25,
data: [{ value: myValue, name: myTitle }],
splitLine: {
show: false
},
axisLine: {
show: true,
lineStyle: {
color: [
[1, 'transparent']
],
width: 2
}
}, //缩在里面的标线
axisTick: {
min: 0,
max: 100,
splitNumber: 3, //缩在里面的标线的宽度
length: 2, // //缩在里面的标线的长度
lineStyle: { // 属性lineStyle控制线条样式
color: insideColor //刻度
}
},
axisLabel: {
formatter: function(v) {
return "";
var obj=document.getElementById(id);
if(obj!=null)
{
var myChart3 = selfechart.init(obj);
myChart3.setOption({
series: [{
name: '业务指标',
type: 'gauge',
detail: {
show: true,
backgroundColor: 'rgba(0,0,0,0)',
borderWidth: 0,
borderColor: '#ccc',
offsetCenter: [0, '10%'],
formatter: '{value}%',
textStyle: {
color: insideColor, //百分比
fontSize: 15
}
},
radius: '90%',
startAngle: 200,
endAngle: -25,
data: [{ value: myValue, name: myTitle }],
splitLine: {
show: false
},
axisLine: {
show: true,
lineStyle: {
color: [
[1, 'transparent']
],
width: 2
}
}, //缩在里面的标线
axisTick: {
min: 0,
max: 100,
splitNumber: 3, //缩在里面的标线的宽度
length: 2, // //缩在里面的标线的长度
lineStyle: { // 属性lineStyle控制线条样式
color: insideColor //刻度
}
},
axisLabel: {
formatter: function(v) {
return "";
}
},
//指针的宽度
pointer: {
width: 0
},
title: {
show: true,
offsetCenter: [0, '40%'],
textStyle: {
color: '#9E9E9E',
fontSize: 14
}
}
},
//指针的宽度
pointer: {
width: 0
},
title: {
show: true,
offsetCenter: [0, '40%'],
textStyle: {
color: '#9E9E9E',
fontSize: 14
}
{ //空仪表,最外层边框
name: '',
type: 'gauge',
startAngle: 200,
endAngle: -25,
radius: "100%",
//symbol: 'circle', //设定为实心点
//symbolSize: 20, //设定实心点的大小
detail: { formatter: '{value}%' },
axisLine: { //仪表圈
show: true,
lineStyle: {
color: [
[myValue / 100, insideColor], //完成度
[1, outsideColor]
],
shadowColor: [
[myValue / 100, 'black'],
[1, outsideColor]
],
width: 2
}
},
splitLine: { //分割线
show: false
},
axisTick: { //刻度线
show: false
},
axisLabel: { //刻度标签
show: false
},
pointer: { //指针
show: true,
width: 5,
shadowColor: 'black', //默认透明
shadowBlur: 5
},
detail: {
show: false
},
data: []
}
},
{ //空仪表,最外层边框
name: '',
type: 'gauge',
startAngle: 200,
endAngle: -25,
radius: "100%",
//symbol: 'circle', //设定为实心点
//symbolSize: 20, //设定实心点的大小
detail: { formatter: '{value}%' },
axisLine: { //仪表圈
show: true,
lineStyle: {
color: [
[myValue / 100, insideColor], //完成度
[1, outsideColor]
],
shadowColor: [
[myValue / 100, 'black'],
[1, outsideColor]
],
width: 2
}
},
splitLine: { //分割线
show: false
},
axisTick: { //刻度线
show: false
},
axisLabel: { //刻度标签
show: false
},
pointer: { //指针
show: true,
width: 5,
shadowColor: 'black', //默认透明
shadowBlur: 5
},
detail: {
show: false
},
data: []
}
]
})
]
})
}
},
saleIndex: function(id, data) {
var myChart4 = selfechart.init(document.getElementById(id));
......
src/components/SalesModule/saleTaskManagement.vue
View file @ b4034d5b
<template>
<div class="saleTaskList">
<div v-show="addTask" class="addTaskLayer">
<p class="addTaskTitle">{{$t('salesModule.ReleaseTask')}}</p>
<div class="addMsg">
<div>
<p>{{$t('salesModule.BaseInfo')}}</p>
<el-form :model="addTaskMsg" :rules="rules" ref="addTaskMsg" label-width="80px">
<el-form-item class='w300' :label="$t('salesModule.TaskName')" maxlength='20' prop="TaskName">
<el-input type="text" :disabled='isAllocatingTask' v-model='addTaskMsg.TaskName' :placeholder="$t('visaT.Pleasefillin')"></el-input>
</el-form-item>
<el-form-item class='w300' :label="$t('salesModule.TaskType')" prop="TaskType">
<el-select :placeholder="$t('pub.pleaseSel')" :disabled='isDisabled||isAllocatingTask' v-model='addTaskMsg.TaskType'>
<el-option v-for='item in taskTypeList'
:label='item.Name'
:value='item.Id'
:key='item.Id'
></el-option>
</el-select>
</el-form-item>
<el-form-item class='w300' :label="$t('salesModule.TaskTotal')" prop="TaskNum">
<el-input type="text" :disabled='isAllocatingTask' :placeholder="$t('visaT.Pleasefillin')" v-model.number='addTaskMsg.TaskNum' ></el-input>
</el-form-item>
<el-form-item v-show='isAllocatingTask' class='w300' :label="$t('salesModule.KeFenNum')" prop="RealTaskNum">
<el-input type="text" :disabled='isAllocatingTask' :placeholder="$t('visaT.Pleasefillin')" v-model.number='addTaskMsg.RealTaskNum' ></el-input>
</el-form-item>
<el-form-item class='w500' :label="$t('salesModule.TimeRange')" prop="taskTime">
<el-date-picker class="h34"
:disabled='isAllocatingTask'
type="daterange"
:picker-options="pickerOptions"
v-model='addTaskMsg.taskTime'
value-format="yyyy-MM-dd"
range-separator="-"
:start-placeholder="$t('system.table_begTime')"
:end-placeholder="$t('salesModule.EndTime')">
</el-date-picker>
</el-form-item>
<el-form-item :label="$t('salesModule.TaskRemark')" prop='Remarks'>
<el-input type="textarea" :disabled='isAllocatingTask' maxlength="200" class="w350" v-model='addTaskMsg.Remarks'></el-input>
</el-form-item>
</el-form>
</div>
<div>
<p>{{$t('salesModule.JoinDepart')}}</p>
<el-form :model="membersArr" :rules="rules" ref="membersArr" label-width="80px">
<el-form-item class='w300' :label="$t('salesModule.JoinPart')" v-if='taskMembers.Type==1' >
<!--<el-select placeholder="请选项" class='multiple_input' filterable multiple :disabled='isOK' v-model='membersArr' @change='addTaskItem'>
<div class="saleTaskList">
<div v-show="addTask" class="addTaskLayer">
<p class="addTaskTitle">{{$t('salesModule.ReleaseTask')}}</p>
<div class="addMsg">
<div>
<p>{{$t('salesModule.BaseInfo')}}</p>
<el-form :model="addTaskMsg" :rules="rules" ref="addTaskMsg" label-width="80px">
<el-form-item class='w300' :label="$t('salesModule.TaskName')" maxlength='20' prop="TaskName">
<el-input type="text" :disabled='isAllocatingTask' v-model='addTaskMsg.TaskName'
:placeholder="$t('visaT.Pleasefillin')"></el-input>
</el-form-item>
<el-form-item class='w300' :label="$t('salesModule.TaskType')" prop="TaskType">
<el-select :placeholder="$t('pub.pleaseSel')" :disabled='isDisabled||isAllocatingTask'
v-model='addTaskMsg.TaskType'>
<el-option v-for='item in taskTypeList' :label='item.Name' :value='item.Id' :key='item.Id'></el-option>
</el-select>
</el-form-item>
<el-form-item class='w300' :label="$t('salesModule.TaskTotal')" prop="TaskNum">
<el-input type="text" :disabled='isAllocatingTask' :placeholder="$t('visaT.Pleasefillin')"
v-model.number='addTaskMsg.TaskNum'></el-input>
</el-form-item>
<el-form-item v-show='isAllocatingTask' class='w300' :label="$t('salesModule.KeFenNum')" prop="RealTaskNum">
<el-input type="text" :disabled='isAllocatingTask' :placeholder="$t('visaT.Pleasefillin')"
v-model.number='addTaskMsg.RealTaskNum'></el-input>
</el-form-item>
<el-form-item class='w500' :label="$t('salesModule.TimeRange')" prop="taskTime">
<el-date-picker class="h34" :disabled='isAllocatingTask' type="daterange" :picker-options="pickerOptions"
v-model='addTaskMsg.taskTime' value-format="yyyy-MM-dd" range-separator="-"
:start-placeholder="$t('system.table_begTime')" :end-placeholder="$t('salesModule.EndTime')">
</el-date-picker>
</el-form-item>
<el-form-item :label="$t('salesModule.TaskRemark')" prop='Remarks'>
<el-input type="textarea" :disabled='isAllocatingTask' maxlength="200" class="w350"
v-model='addTaskMsg.Remarks'></el-input>
</el-form-item>
</el-form>
</div>
<div>
<p>{{$t('salesModule.JoinDepart')}}</p>
<el-form :model="membersArr" :rules="rules" ref="membersArr" label-width="80px">
<el-form-item class='w300' :label="$t('salesModule.JoinPart')" v-if='taskMembers.Type==1'>
<!--<el-select placeholder="请选项" class='multiple_input' filterable multiple :disabled='isOK' v-model='membersArr' @change='addTaskItem'>
<el-option v-for='item in taskMembers.date'
:label='item.Name'
:value='item.Id'
:key='item.Id'
></el-option>
</el-select>-->
<treeselect
:multiple="true"
:options="taskMembers.date"
:flat="true"
@select='addTaskItem'
@deselect='deleteTaskItem'
:sort-value-by="sortValueBy"
:normalizer="normalizer"
v-model="membersArr"
/>
</el-form-item>
<el-form-item class='w300' :label="$t('salesModule.JoinPeople')" v-if='taskMembers.Type==2'>
<!--<el-select placeholder="请选项" class='multiple_input' filterable multiple :disabled='isOK'
<treeselect :multiple="true" :options="taskMembers.date" :flat="true" @select='addTaskItem'
@deselect='deleteTaskItem' :sort-value-by="sortValueBy" :normalizer="normalizer" v-model="membersArr" />
</el-form-item>
<el-form-item class='w300' :label="$t('salesModule.JoinPeople')" v-if='taskMembers.Type==2'>
<!--<el-select placeholder="请选项" class='multiple_input' filterable multiple :disabled='isOK'
v-model='membersArr'
@change='addTaskItem'
>
......@@ -80,648 +67,981 @@
:key='item.Id'
></el-option>
</el-select>-->
<treeselect
:multiple="true"
:options="taskMembers.date"
:flat="true"
@select='addTaskItem'
@deselect='deleteTaskItem'
:sort-value-by="sortValueBy"
:normalizer="normalizer"
v-model="membersArr"
/>
</el-form-item>
</el-form>
<p style="text-align:center" v-show="taskMembers.date.length==0">{{$t('system.content_noData')}}</p>
</div>
<div class="addTaskLayerTableScroll" style="max-width:600px; overflow-x: auto;">
<p>{{$t('salesModule.TaskFenPei')}}</p>
<table class="addTaskLayerTable" border="0" cellspacing="1" cellpadding="1">
<tr>
<th v-for="item in addTaskTableList">{{item.name}}</th>
</tr>
<tr>
<td v-for="item in addTaskTableList">
<input v-model="item.value" type="number" :placeholder="$t('salesModule.PositiveInteger')" style="text-align: center;border: none;" />
</td>
</tr>
<tr>
<td v-for="item in addTaskTableList">
<div class="addTaskLayerTableDiv" v-if='item.PrevFinish!=-1'>
<p class="finish finishH">{{$t('salesModule.SimilarTask')}}</p>
<p>
<el-progress type="circle" width='40' :percentage="item.Percentage" :stroke-width="w2" color="#2AAEF2"></el-progress>
</p>
</div>
<div v-if='item.PrevFinish!=-1' class="addTaskLayerTableDiv">
<p class="finish finishNumTips">{{$t('salesModule.LastComplete')}}</p>
<p class="finishNum">{{item.PrevFinish}}</p>
</div>
<div v-if='item.PrevFinish==-1' class="finish">
{{$t('salesModule.NoHistoryTask')}}
</div>
</td>
</tr>
</table>
</div>
</div>
<p style="text-align: right; width: 100%; clear: both;">
<input type="button" class="hollowFixedBtn" :value="$t('pub.cancelBtn')" @click="clearMsg"/>
<input v-if='!isAllocatingTask' type="button" class="normalBtn" :value="$t('pub.saveBtn')" @click="submitForm('addTaskMsg')"/>
<input v-if='isAllocatingTask' type="button" class="normalBtn" :value="$t('pub.saveBtn')" @click="saveAllocatingTask"/>
</p>
</div>
<ul>
<li>
<p>{{$t('salesModule.DepartNewTask')}}</p>
<div class="itemCont" id='deparmentTask'>
<div class="noDataNotice" v-if='departmetTaskList.length==0'>
<i class="iconfont icon-kong"></i>
<p>{{$t('salesModule.NoTasks')}}</p>
</div>
<div class="contTypeOne" v-for="(item,index) in departmetTaskList">
<p>
<el-popover placement="bottom" width="260" trigger="hover">
<div class="saleTaskpopover">
<p style="font-size: 14px;font-weight: bold; color: #333; margin: 10px 0;">{{item.TaskName}}</p>
<table class="saleTaskpopoverTable" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="80"><i class="iconfont icon-img-ren"></i>{{$t('salesModule.IssuedPeople')}}</td>
<td>{{item.CreateBy}}</td>
</tr>
<tr>
<td><i class="iconfont icon-ico-time"></i>{{$t('salesModule.IssuedTime')}}</td>
<td>{{item.CreateDate}}</td>
</tr>
<tr>
<td><i class="iconfont icon-ico-renwuyaoqiu"></i>{{$t('salesModule.TaskYaoQiu')}}</td>
<td><span style="color: #257BF1;">{{item.TaskNum}}人</span></td>
</tr>
<tr>
<td><i class="iconfont icon-ico-shijianfanwei"></i>{{$t('salesModule.TimeRange')}}</td>
<td>{{item.StartTime}}{{$t('restaurant.res_To')}}{{item.EndTime}}</td>
</tr>
<tr>
<td><i class="iconfont icon-ico-beizhu"></i>{{$t('salesModule.TaskRemark')}}</td>
<td>{{item.Remarks}}</td>
</tr>
</table>
<input type="button" class="normalBtn w220" :value="$t('salesModule.TaskStart')" @click="allocatingTask(item)"/>
</div>
<span style="font-size: 16px; color: #333; cursor: pointer;" slot="reference">{{item.TaskName}}</span>
</el-popover>
<em>{{item.CreateBy}}</em><i class="iconfont icon-ico-fenjie fr" @click="allocatingTask(item)"></i></p>
<p><el-progress :stroke-width="w12" :percentage="0" :show-text='false'></el-progress></p>
<p class="smallfont">0/{{item.TaskNum}}{{item.Unit}}</p>
</div>
</div>
</li>
<li>
<p>{{$t('salesModule.NowTask')}}</p>
<div class="itemCont width530" id='nowTask'>
<div class="noDataNotice" v-if='nowTaskList.length==0'>
<i class="iconfont icon-kong"></i>
<p>{{$t('salesModule.NoTaskIn')}}</p>
</div>
<div class="contTypeTwo" v-for="(item,index) in nowTaskList">
<el-progress type="circle" width='88' :percentage="item.rate" :color="item.color"></el-progress>
<p class="goSaleTaskDetail" @click="goUrl('saleTaskDetail',item.id,'任务详情')">{{item.taskName}}</p>
</div>
</div>
</li>
<li>
<p>{{$t('salesModule.DepartmentExecution')}}<span @click="goUrl('saleTaskHistory',0,'历史任务')">{{$t('salesModule.HistoryTask')}}</span></p>
<div class="itemCont width590 myChatList">
<div id="mychart0" style="width: 130px; height: 130px;"></div>
<div id="mychart1" style="width: 130px; height: 130px;"></div>
<div id="mychart2" style="width: 130px; height: 130px;"></div>
<div id="mychart3" style="width: 130px; height: 130px;"></div>
<div id="mychart4" style="width: 130px; height: 130px;"></div>
</div>
</li>
<li>
<p>{{$t('salesModule.MyTasks')}}<span @click="addNewTask"><i class="iconfont icon-ico-xinzengrenwu" style="vertical-align:middle;margin-right:5px; margin-top: -3px;font-size:14px;"></i>{{$t('salesModule.AddTasks')}}</span></p>
<div class="itemCont" id='myTask'>
<div class="noDataNotice" v-if='myTaskList.length==0'>
<i class="iconfont icon-kong"></i>
<p>{{$t('salesModule.NoTaskIn')}}</p>
<p>{{$t('salesModule.ClickAddTasks')}}</p>
</div>
<div class="contTypeOne" v-for='(item,index) in myTaskList'>
<p>{{item.TaskName}} <span class="fr" :style="{color:item.Color}">{{item.StatusName}}</span></p>
<p><el-progress :stroke-width="w12" :percentage="(item.FinishNum/item.TaskNum)*100" :color='item.Color' :show-text='false'></el-progress></p>
<p class="smallfont">{{item.FinishNum}}/{{item.TaskNum}}{{item.Unit}}</p>
</div>
</div>
</li>
<li>
<p>{{$t('salesModule.TodayTask')}}</p>
<div class="itemCont width530" id='todayTask'>
<div class="noDataNotice" v-if='todayTaskListNew.length==0&&todayTaskList.length==0'>
<i class="iconfont icon-kong"></i>
<p>{{$t('salesModule.NoActive')}}</p>
</div>
<div class="contTypeThree" v-for="(item,index) in todayTaskListNew">
<div class="name">
<img v-if='!item.emPhoto' src="../../assets/img/litheader.png"/>
<img v-if='item.emPhoto' :onerror="defaultImg" :src='item.emPhoto'/>
{{item.employeeName}}
</div>
<div class="department">
<i class="iconfont icon-bumen"></i>
{{item.departmentName}}
</div>
<div class="message"><p class="msg">{{item.taskName}}</p><p>{{$t('salesModule.Contribution')}}<span>+{{item.taskNum}}</span></p></div>
<div class="time">
<i class="iconfont icon-qingjia"></i>
{{item.createDate}}
</div>
</div>
<div class="contTypeThree" v-for="(item,index) in todayTaskList">
<div class="name">
<img v-if='!item.emPhoto' src="../../assets/img/litheader.png"/>
<img v-if='item.emPhoto' :onerror="defaultImg" :src='item.emPhoto'/>
{{item.employeeName}}
</div>
<div class="department">
<i class="iconfont icon-bumen"></i>
{{item.departmentName}}
</div>
<div class="message"><p class="msg">{{item.taskName}}</p><p>{{$t('salesModule.Contribution')}}<span>+{{item.taskNum}}</span></p></div>
<div class="time">
<i class="iconfont icon-qingjia"></i>
{{item.createDate}}
</div>
</div>
</div>
</li>
</ul>
</div>
<treeselect :multiple="true" :options="taskMembers.date" :flat="true" @select='addTaskItem'
@deselect='deleteTaskItem' :sort-value-by="sortValueBy" :normalizer="normalizer" v-model="membersArr" />
</el-form-item>
</el-form>
<p style="text-align:center" v-show="taskMembers&&taskMembers.date&&taskMembers.date.length==0">{{$t('system.content_noData')}}</p>
</div>
<div class="addTaskLayerTableScroll" style="max-width:600px; overflow-x: auto;">
<p>{{$t('salesModule.TaskFenPei')}}</p>
<table class="addTaskLayerTable" border="0" cellspacing="1" cellpadding="1">
<tr>
<th v-for="item in addTaskTableList">{{item.name}}</th>
</tr>
<tr>
<td v-for="item in addTaskTableList">
<input v-model="item.value" type="number" :placeholder="$t('salesModule.PositiveInteger')"
style="text-align: center;border: none;" />
</td>
</tr>
<tr>
<td v-for="item in addTaskTableList">
<div class="addTaskLayerTableDiv" v-if='item.PrevFinish!=-1'>
<p class="finish finishH">{{$t('salesModule.SimilarTask')}}</p>
<p>
<el-progress type="circle" width='40' :percentage="item.Percentage" :stroke-width="w2"
color="#2AAEF2"></el-progress>
</p>
</div>
<div v-if='item.PrevFinish!=-1' class="addTaskLayerTableDiv">
<p class="finish finishNumTips">{{$t('salesModule.LastComplete')}}</p>
<p class="finishNum">{{item.PrevFinish}}</p>
</div>
<div v-if='item.PrevFinish==-1' class="finish">
{{$t('salesModule.NoHistoryTask')}}
</div>
</td>
</tr>
</table>
</div>
</div>
<p style="text-align: right; width: 100%; clear: both;">
<input type="button" class="hollowFixedBtn" :value="$t('pub.cancelBtn')" @click="clearMsg" />
<input v-if='!isAllocatingTask' type="button" class="normalBtn" :value="$t('pub.saveBtn')"
@click="submitForm('addTaskMsg')" />
<input v-if='isAllocatingTask' type="button" class="normalBtn" :value="$t('pub.saveBtn')"
@click="saveAllocatingTask" />
</p>
</div>
<ul>
<li>
<p>{{$t('salesModule.DepartNewTask')}}</p>
<div class="itemCont" id='deparmentTask'>
<div class="noDataNotice" v-if='departmetTaskList&&departmetTaskList.length==0'>
<i class="iconfont icon-kong"></i>
<p>{{$t('salesModule.NoTasks')}}</p>
</div>
<div class="contTypeOne" v-for="(item,index) in departmetTaskList">
<p>
<el-popover placement="bottom" width="260" trigger="hover">
<div class="saleTaskpopover">
<p style="font-size: 14px;font-weight: bold; color: #333; margin: 10px 0;">{{item.TaskName}}</p>
<table class="saleTaskpopoverTable" border="0" cellspacing="0" cellpadding="0">
<tr>
<td width="80"><i class="iconfont icon-img-ren"></i>{{$t('salesModule.IssuedPeople')}}</td>
<td>{{item.CreateBy}}</td>
</tr>
<tr>
<td><i class="iconfont icon-ico-time"></i>{{$t('salesModule.IssuedTime')}}</td>
<td>{{item.CreateDate}}</td>
</tr>
<tr>
<td><i class="iconfont icon-ico-renwuyaoqiu"></i>{{$t('salesModule.TaskYaoQiu')}}</td>
<td><span style="color: #257BF1;">{{item.TaskNum}}人</span></td>
</tr>
<tr>
<td><i class="iconfont icon-ico-shijianfanwei"></i>{{$t('salesModule.TimeRange')}}</td>
<td>{{item.StartTime}}{{$t('restaurant.res_To')}}{{item.EndTime}}</td>
</tr>
<tr>
<td><i class="iconfont icon-ico-beizhu"></i>{{$t('salesModule.TaskRemark')}}</td>
<td>{{item.Remarks}}</td>
</tr>
</table>
<input type="button" class="normalBtn w220" :value="$t('salesModule.TaskStart')"
@click="allocatingTask(item)" />
</div>
<span style="font-size: 16px; color: #333; cursor: pointer;" slot="reference">{{item.TaskName}}</span>
</el-popover>
<em>{{item.CreateBy}}</em><i class="iconfont icon-ico-fenjie fr" @click="allocatingTask(item)"></i>
</p>
<p>
<el-progress :stroke-width="w12" :percentage="0" :show-text='false'></el-progress>
</p>
<p class="smallfont">0/{{item.TaskNum}}{{item.Unit}}</p>
</div>
</div>
</li>
<li>
<p>{{$t('salesModule.NowTask')}}</p>
<div class="itemCont width530" id='nowTask'>
<div class="noDataNotice" v-if='nowTaskList&&nowTaskList.length==0'>
<i class="iconfont icon-kong"></i>
<p>{{$t('salesModule.NoTaskIn')}}</p>
</div>
<div class="contTypeTwo" v-for="(item,index) in nowTaskList">
<el-progress type="circle" width='88' :percentage="item.rate" :color="item.color"></el-progress>
<p class="goSaleTaskDetail" @click="goUrl('saleTaskDetail',item.id,'任务详情')">{{item.taskName}}</p>
</div>
</div>
</li>
<li>
<p>{{$t('salesModule.DepartmentExecution')}}<span
@click="goUrl('saleTaskHistory',0,'历史任务')">{{$t('salesModule.HistoryTask')}}</span></p>
<div class="itemCont width590 myChatList">
<div id="mychart0" style="width: 130px; height: 130px;"></div>
<div id="mychart1" style="width: 130px; height: 130px;"></div>
<div id="mychart2" style="width: 130px; height: 130px;"></div>
<div id="mychart3" style="width: 130px; height: 130px;"></div>
<div id="mychart4" style="width: 130px; height: 130px;"></div>
</div>
</li>
<li>
<p>{{$t('salesModule.MyTasks')}}<span @click="addNewTask"><i class="iconfont icon-ico-xinzengrenwu"
style="vertical-align:middle;margin-right:5px; margin-top: -3px;font-size:14px;"></i>{{$t('salesModule.AddTasks')}}</span>
</p>
<div class="itemCont" id='myTask'>
<div class="noDataNotice" v-if='myTaskList&&myTaskList.length==0'>
<i class="iconfont icon-kong"></i>
<p>{{$t('salesModule.NoTaskIn')}}</p>
<p>{{$t('salesModule.ClickAddTasks')}}</p>
</div>
<div class="contTypeOne" v-for='(item,index) in myTaskList'>
<p>{{item.TaskName}} <span class="fr" :style="{color:item.Color}">{{item.StatusName}}</span></p>
<p>
<el-progress :stroke-width="w12" :percentage="(item.FinishNum/item.TaskNum)*100" :color='item.Color'
:show-text='false'></el-progress>
</p>
<p class="smallfont">{{item.FinishNum}}/{{item.TaskNum}}{{item.Unit}}</p>
</div>
</div>
</li>
<li>
<p>{{$t('salesModule.TodayTask')}}</p>
<div class="itemCont width530" id='todayTask'>
<div class="noDataNotice" v-if='todayTaskListNew.length==0&&todayTaskList.length==0'>
<i class="iconfont icon-kong"></i>
<p>{{$t('salesModule.NoActive')}}</p>
</div>
<div class="contTypeThree" v-for="(item,index) in todayTaskListNew">
<div class="name">
<img v-if='!item.emPhoto' src="../../assets/img/litheader.png" />
<img v-if='item.emPhoto' :onerror="defaultImg" :src='item.emPhoto' />
{{item.employeeName}}
</div>
<div class="department">
<i class="iconfont icon-bumen"></i>
{{item.departmentName}}
</div>
<div class="message">
<p class="msg">{{item.taskName}}</p>
<p>{{$t('salesModule.Contribution')}}<span>+{{item.taskNum}}</span></p>
</div>
<div class="time">
<i class="iconfont icon-qingjia"></i>
{{item.createDate}}
</div>
</div>
<div class="contTypeThree" v-for="(item,index) in todayTaskList">
<div class="name">
<img v-if='!item.emPhoto' src="../../assets/img/litheader.png" />
<img v-if='item.emPhoto' :onerror="defaultImg" :src='item.emPhoto' />
{{item.employeeName}}
</div>
<div class="department">
<i class="iconfont icon-bumen"></i>
{{item.departmentName}}
</div>
<div class="message">
<p class="msg">{{item.taskName}}</p>
<p>{{$t('salesModule.Contribution')}}<span>+{{item.taskNum}}</span></p>
</div>
<div class="time">
<i class="iconfont icon-qingjia"></i>
{{item.createDate}}
</div>
</div>
</div>
</li>
</ul>
</div>
</template>
<script>
import Treeselect from '@riophae/vue-treeselect'
import '@riophae/vue-treeselect/dist/vue-treeselect.css'
export default {
components: { Treeselect },
data(){
return{
value: [ 'c', 'aaa', 'bb' ],
options: [
{
id: 'a',
label: 'a',
children: [ {
id: 'aa',
label: 'aa',
}, {
id: 'ab',
label: 'ab',
} ],
},{
id: 'b',
label: 'b',
},
{
id: 'c',
label: 'c',
}
],
normalizer(node) {
return {
id: node.Id,
label: node.Name,
children: node.ChlidList,
}
},
sortValueBy: 'ORDER_SELECTED',
pickerOptions: {
disabledDate: (time) => { //disabledDate true 为禁止选择
return time.getTime() < Date.now()-86400000
}
},
timer:null,
w12:12,
w2:2,
defaultImg: 'this.src="' + require("../../assets/img/litheader.png") + '"',
allocatingTaskId:'',
isAllocatingTask:false,
isOK:false,
isDisabled:false,
membersArr:[],
membersArrCopy:[],
addTask:false,
addMsg1:{},
layerMsg:{
TaskUserId:0
},
departmetTaskMsg:{
pageIndex:1,
pageSize:5
},
nowTaskMsg:{
pageIndex:1,
pageSize:15
},
myTaskMsg:{
pageIndex:1,
pageSize:5
},
todayTaskMsg:{
pageIndex:1,
pageSize:10,
Id:0
},
todayTaskMsgNew:{
Id:0
},
addTaskMsg:{
TaskName:'',
StartTime:'',
EndTime:'',
TaskNum:'',
TaskType:1,
Remarks:'',
UserTaskList:[],
taskTime:'',
RealTaskNum:'0'
},
rules:{
TaskName:[
{ required: true, message:this.$t('rule.EnterTaskName'), trigger: 'blur' }
],
TaskType:[
{ required: true, message:this.$t('rule.ChoiceTaskType'), trigger: 'change' }
],
TaskNum:[
{ required: true, message:this.$t('rule.EnterNum'), trigger: 'blur' },
{ pattern: /^[1-9]\d*$/, message:this.$t('rule.OnlyInter') }
],
taskTime:[
{ required: true, message:this.$t('rule.ChoiceRQFW'), trigger: 'change' }
],
Remarks:[
{ required: false, message:this.$t('rule.EnterMark'), trigger: 'blur' }
],
},
addTaskTableList:[],
//返回数据
taskMemberList:[],
departmetTaskList:[],
nowTaskList:[],
todayTaskList:[],
todayTaskListNew:[],
departmentPowerList:[],
myTaskList:[],
taskTypeList:[],
taskMembers:{}
}
},
mounted() {
this.getDepartmetTask()
this.getNowTask()
this.getDepartmentPower()
this.getMyTask()
this.getTodayTask()
this.getTodayTaskNew()
this.getTaskMember()
let that=this
import Treeselect from '@riophae/vue-treeselect'
import '@riophae/vue-treeselect/dist/vue-treeselect.css'
export default {
components: {
Treeselect
},
data() {
return {
value: ['c', 'aaa', 'bb'],
options: [{
id: 'a',
label: 'a',
children: [{
id: 'aa',
label: 'aa',
}, {
id: 'ab',
label: 'ab',
}],
}, {
id: 'b',
label: 'b',
},
{
id: 'c',
label: 'c',
}
],
normalizer(node) {
return {
id: node.Id,
label: node.Name,
children: node.ChlidList,
}
},
sortValueBy: 'ORDER_SELECTED',
pickerOptions: {
disabledDate: (time) => { //disabledDate true 为禁止选择
return time.getTime() < Date.now() - 86400000
}
},
timer: null,
w12: 12,
w2: 2,
defaultImg: 'this.src="' + require("../../assets/img/litheader.png") + '"',
allocatingTaskId: '',
isAllocatingTask: false,
isOK: false,
isDisabled: false,
membersArr: [],
membersArrCopy: [],
addTask: false,
addMsg1: {},
layerMsg: {
TaskUserId: 0
},
departmetTaskMsg: {
pageIndex: 1,
pageSize: 5
},
nowTaskMsg: {
pageIndex: 1,
pageSize: 15
},
myTaskMsg: {
pageIndex: 1,
pageSize: 5
},
todayTaskMsg: {
pageIndex: 1,
pageSize: 10,
Id: 0
},
todayTaskMsgNew: {
Id: 0
},
addTaskMsg: {
TaskName: '',
StartTime: '',
EndTime: '',
TaskNum: '',
TaskType: 1,
Remarks: '',
UserTaskList: [],
taskTime: '',
RealTaskNum: '0'
},
rules: {
TaskName: [{
required: true,
message: this.$t('rule.EnterTaskName'),
trigger: 'blur'
}],
TaskType: [{
required: true,
message: this.$t('rule.ChoiceTaskType'),
trigger: 'change'
}],
TaskNum: [{
required: true,
message: this.$t('rule.EnterNum'),
trigger: 'blur'
},
{
pattern: /^[1-9]\d*$/,
message: this.$t('rule.OnlyInter')
}
],
taskTime: [{
required: true,
message: this.$t('rule.ChoiceRQFW'),
trigger: 'change'
}],
Remarks: [{
required: false,
message: this.$t('rule.EnterMark'),
trigger: 'blur'
}],
},
addTaskTableList: [],
//返回数据
taskMemberList: [],
departmetTaskList: [],
nowTaskList: [],
todayTaskList: [],
todayTaskListNew: [],
departmentPowerList: [],
myTaskList: [],
taskTypeList: [],
taskMembers: {}
}
},
mounted() {
this.getDepartmetTask()
this.getNowTask()
this.getDepartmentPower()
this.getMyTask()
this.getTodayTask()
this.getTodayTaskNew()
this.getTaskMember()
let that = this
let deparmentTask = document.getElementById('deparmentTask'),
nowTask = document.getElementById('nowTask'),
myTask = document.getElementById('myTask'),
todayTask = document.getElementById('todayTask');
if (deparmentTask) {
deparmentTask.addEventListener('scroll',function(){ //部门新任务
if(this.scrollHeight-this.scrollTop===this.clientHeight){
that.departmetTaskMsg.pageIndex=Math.ceil(that.departmetTaskList.length/5)+1
deparmentTask.addEventListener('scroll', function () { //部门新任务
if (this.scrollHeight - this.scrollTop === this.clientHeight) {
that.departmetTaskMsg.pageIndex = Math.ceil(that.departmetTaskList.length / 5) + 1
that.getDepartmetTask()
}
})
}
if (nowTask) {
nowTask.addEventListener('scroll',function(){ //当前
if(this.scrollHeight-this.scrollTop===this.clientHeight){
that.nowTaskMsg.pageIndex=Math.ceil(that.nowTaskList.length/15)+1
if (nowTask) {
nowTask.addEventListener('scroll', function () { //当前
if (this.scrollHeight - this.scrollTop === this.clientHeight) {
that.nowTaskMsg.pageIndex = Math.ceil(that.nowTaskList.length / 15) + 1
that.getNowTask()
}
})
}
if (myTask) {
myTask.addEventListener('scroll',function(){ //我发布的任务
if(this.scrollHeight-this.scrollTop===this.clientHeight){
that.myTaskMsg.pageIndex=Math.ceil(that.myTaskList.length/5)+1
if (myTask) {
myTask.addEventListener('scroll', function () { //我发布的任务
if (this.scrollHeight - this.scrollTop === this.clientHeight) {
that.myTaskMsg.pageIndex = Math.ceil(that.myTaskList.length / 5) + 1
that.getMyTask()
}
})
}
if (todayTask) {
todayTask.addEventListener('scroll',function(){ //我发布的任务
if(this.scrollHeight-this.scrollTop===this.clientHeight){
that.todayTaskMsg.pageIndex=Math.ceil(that.todayTaskList.length/10)+1
todayTask.addEventListener('scroll', function () { //我发布的任务
if (this.scrollHeight - this.scrollTop === this.clientHeight) {
that.todayTaskMsg.pageIndex = Math.ceil(that.todayTaskList.length / 10) + 1
that.getTodayTask()
}
})
}
},
methods: {
clearMsg(){
this.addTask=false
this.$refs['addTaskMsg'].resetFields();
this.membersArr=[]
this.membersArrCopy=[]
this.addTaskTableList=[]
},
submitForm(msg) {//提交创建、修改表单
this.$refs[msg].validate((valid) => {
if (valid) {
this.saveNewTask()
} else {
return false;
}
});
},
saveAllocatingTask(){
let addAllocatingMsg=[]
let i=0;
this.addTaskTableList.forEach(item=>{
addAllocatingMsg.push({Id:item.id,DepOrEmpId:item.DepOrEmpId,TaskNum:item.value,RealTaskNum:item.value,Type:item.type})
i+=parseInt(item.value)
})
if(this.membersArr.length==0){
this.$message.error('请选择分配对象！')
return
}
// if(this.addTaskMsg.TaskNum!=i)
// {
// this.$message.error('任务数量和分配数量之和不相等，请修改！')
// return
// }
this.apipost('Sell_Post_Management_AllotSellTask',{UserTaskId:this.allocatingTaskId,UserTaskList:addAllocatingMsg},res=>{
if(res.data.resultCode==1){
this.$message.success(res.data.message)
this.clearMsg()
this.departmetTaskList=[]
this.myTaskList=[]
this.departmetTaskMsg.PageIndex=1
this.myTaskMsg.pageIndex=1
this.getDepartmetTask()
this.getMyTask()
}else{
this.$message.error(res.data.message)
}
},err=>{})
},
allocatingTask(obj){
this.layerMsg.TaskUserId=obj.Id
this.getTaskMember()
this.allocatingTaskId=obj.Id
this.addTask=true
this.isAllocatingTask=true
this.getTaskType()
this.membersArr=[]
this.addTaskTableList=[]
this.apipost('Sell_Get_Management_GetSellDepartmentTaskInfo',{UserTaskId:obj.Id},res=>{
if(res.data.resultCode==1){
let msg=res.data.data
this.addTaskMsg.TaskName=msg.TaskName
this.addTaskMsg.TaskType=msg.TaskType
this.addTaskMsg.TaskNum=msg.TaskNum
this.addTaskMsg.RealTaskNum=msg.RealTaskNum
this.addTaskMsg.taskTime=[msg.StartTime,msg.EndTime]
this.addTaskMsg.Remarks=msg.Remarks
msg.UserTaskList.forEach(item=>{
this.membersArr.push(item.DepOrEmpId)
this.membersArrCopy.push(item.DepOrEmpId)
this.addTaskTableList.push({type:item.Type,id:item.Id,DepOrEmpId:item.DepOrEmpId,name:item.DepEmpName,value:item.RealTaskNum,Percentage:item.Percentage,PrevFinish:item.PrevFinish})
})
}
},err=>{})
},
addTaskItem(node){
let taskItemMsg={}
taskItemMsg.JoinId=node.Id
taskItemMsg.JoinType=this.taskMembers.Type
taskItemMsg.TaskType=this.addTaskMsg.TaskType
this.apipost('Sell_Get_Management_GetPrevTaskRecord',taskItemMsg,res=>{
if(res.data.resultCode==1){
this.addTaskTableList.push({type:taskItemMsg.JoinType,id:0,DepOrEmpId:taskItemMsg.JoinId,name:node.Name,value:'',Percentage:res.data.data.Percentage,PrevFinish:res.data.data.PrevFinish})
}
},err=>{})
},
deleteTaskItem(node){
if(this.addTaskTableList.findIndex(item=>item.DepOrEmpId==node.Id)!=-1){
this.addTaskTableList.splice(this.addTaskTableList.findIndex(item=>item.DepOrEmpId==node.Id),1)
}
},
getTaskMember(){
this.apipost('Sell_Get_Management_GetNowDepartmentChild',this.layerMsg,res=>{
if(res.data.resultCode==1){
this.taskMembers=res.data.data
this.taskMemberList=res.data.data.date
}
},err=>{})
},
addNewTask(){
this.addTask=true
this.isAllocatingTask=false
this.layerMsg.TaskUserId=0
this.getTaskMember()
this.getTaskType()
},
saveNewTask(){
this.addTaskMsg.UserTaskList=[]
this.addTaskMsg.StartTime=this.addTaskMsg.taskTime[0]
this.addTaskMsg.EndTime=this.addTaskMsg.taskTime[1]
this.addTaskMsg.RealTaskNum=this.addTaskMsg.TaskNum
let i=0;
this.addTaskTableList.forEach(item=>{
this.addTaskMsg.UserTaskList.push({Type:item.type,RealTaskNum:item.value,TaskNum:item.value,DepOrEmpId:item.DepOrEmpId})
i+=parseInt(item.value)
})
if(this.addTaskTableList.length==0){
this.$message.error('请选择分配对象！')
return
}
this.apipost('Sell_Post_Management_SetSellTask',this.addTaskMsg,res=>{
if(res.data.resultCode==1){
this.clearMsg()
this.departmetTaskList=[]
this.myTaskList=[]
this.departmetTaskMsg.PageIndex=1
this.myTaskMsg.pageIndex=1
this.getDepartmetTask()
this.getMyTask()
this.$message.success(res.data.message)
}else{
this.$message.error(res.data.message)
}
},err=>{})
},
getTaskType(){
this.apipost('Sell_Get_Management_GetSellTaskTypeList',{},res=>{
if(res.data.resultCode==1){
this.taskTypeList=res.data.data
}
},err=>{})
},
getDepartmetTask(){
this.apipost('Sell_Get_Management_GetSellDepartmentTaskList',this.departmetTaskMsg,res=>{
if(res.data.resultCode==1){
this.departmetTaskList=this.departmetTaskList.concat(res.data.data.pageData)
}
},err=>{})
},
getNowTask(){
this.apipost('TaskManagemnet_post_GetNowTaskForEmployee',this.nowTaskMsg,res=>{
if(res.data.resultCode==1){
this.nowTaskList=this.nowTaskList.concat(res.data.data.pageData)
}
},err=>{})
},
getDepartmentPower(){
this.apipost('TaskManagemnet_post_GetExecutiveForce',{},res=>{
if(res.data.resultCode==1){
this.departmentPowerList=res.data.data
this.departmentPowerList.forEach((i,index)=>{
let insideColor
let outsideColor
if(i.rate==0){
insideColor='#999999'
outsideColor='#999999'
}else if(i.rate<50&&i.rate>0){
insideColor='#E85252'
outsideColor='#FFDDDD'
}else if(50<=i.rate&&i.rate<80){
insideColor='#FFBA1F'
outsideColor='#FFE09B'
}else if(80<=i.rate&&i.rate<100){
insideColor='#2AAEF2'
outsideColor='#BDE9FF'
}else if(i.rate==100){
insideColor='#47BF8C'
outsideColor='#47BF8C'
}
this.$nextTick(()=>{
this.$chartsUtils.saleTaskDepartment('mychart'+index,i.taskTypeStr,i.rate,insideColor,outsideColor)
})
})
}
},err=>{})
},
getMyTask(){
this.apipost('Sell_Management_TaskForMyIssue',this.myTaskMsg,res=>{
if(res.data.resultCode==1){
this.myTaskList=this.myTaskList.concat(res.data.data.pageData)
}
},err=>{})
},
getTodayTask(){
this.apipost('TaskManagemnet_post_GetListSellContribution',this.todayTaskMsg,res=>{
if(res.data.resultCode==1){
this.todayTaskList=this.todayTaskList.concat(res.data.data.pageData)
if(this.todayTaskList.length>0){
this.todayTaskMsg.Id=this.todayTaskList[0].id
this.todayTaskMsgNew.Id=this.todayTaskList[0].id
}
}
},err=>{})
},
getTodayTaskNew(){
this.timer = setInterval(()=>{
this.apipost('TaskManagemnet_post_GetRefreshList',this.todayTaskMsgNew,res=>{
if(res.data.resultCode==1){
if(res.data.data.length>0){
this.todayTaskListNew=res.data.data.concat(this.todayTaskListNew)
this.todayTaskMsgNew.Id=this.todayTaskListNew[0].id
}else{
}
}
},err=>{})
},60000)
},
goUrl (path,id,title) {
this.$router.push({ name: path,query:{"id":id,"PersonOrDepartment":0,blank:'y',tab:title} })
}
},beforeDestroy(){
if(this.timer) { //如果定时器还在运行 或者直接关闭，不用判断
clearInterval(this.timer); //关闭
}
}
},
methods: {
clearMsg() {
this.addTask = false
this.$refs['addTaskMsg'].resetFields();
this.membersArr = []
this.membersArrCopy = []
this.addTaskTableList = []
},
submitForm(msg) { //提交创建、修改表单
this.$refs[msg].validate((valid) => {
if (valid) {
this.saveNewTask()
} else {
return false;
}
});
},
saveAllocatingTask() {
let addAllocatingMsg = []
let i = 0;
this.addTaskTableList.forEach(item => {
addAllocatingMsg.push({
Id: item.id,
DepOrEmpId: item.DepOrEmpId,
TaskNum: item.value,
RealTaskNum: item.value,
Type: item.type
})
i += parseInt(item.value)
})
if (this.membersArr.length == 0) {
this.$message.error('请选择分配对象！')
return
}
// if(this.addTaskMsg.TaskNum!=i)
// {
// this.$message.error('任务数量和分配数量之和不相等，请修改！')
// return
// }
this.apipost('Sell_Post_Management_AllotSellTask', {
UserTaskId: this.allocatingTaskId,
UserTaskList: addAllocatingMsg
}, res => {
if (res.data.resultCode == 1) {
this.$message.success(res.data.message)
this.clearMsg()
this.departmetTaskList = []
this.myTaskList = []
this.departmetTaskMsg.PageIndex = 1
this.myTaskMsg.pageIndex = 1
this.getDepartmetTask()
this.getMyTask()
} else {
this.$message.error(res.data.message)
}
}, err => {})
},
allocatingTask(obj) {
this.layerMsg.TaskUserId = obj.Id
this.getTaskMember()
this.allocatingTaskId = obj.Id
this.addTask = true
this.isAllocatingTask = true
this.getTaskType()
this.membersArr = []
this.addTaskTableList = []
this.apipost('Sell_Get_Management_GetSellDepartmentTaskInfo', {
UserTaskId: obj.Id
}, res => {
if (res.data.resultCode == 1) {
let msg = res.data.data
this.addTaskMsg.TaskName = msg.TaskName
this.addTaskMsg.TaskType = msg.TaskType
this.addTaskMsg.TaskNum = msg.TaskNum
this.addTaskMsg.RealTaskNum = msg.RealTaskNum
this.addTaskMsg.taskTime = [msg.StartTime, msg.EndTime]
this.addTaskMsg.Remarks = msg.Remarks
msg.UserTaskList.forEach(item => {
this.membersArr.push(item.DepOrEmpId)
this.membersArrCopy.push(item.DepOrEmpId)
this.addTaskTableList.push({
type: item.Type,
id: item.Id,
DepOrEmpId: item.DepOrEmpId,
name: item.DepEmpName,
value: item.RealTaskNum,
Percentage: item.Percentage,
PrevFinish: item.PrevFinish
})
})
}
}, err => {})
},
addTaskItem(node) {
let taskItemMsg = {}
taskItemMsg.JoinId = node.Id
taskItemMsg.JoinType = this.taskMembers.Type
taskItemMsg.TaskType = this.addTaskMsg.TaskType
this.apipost('Sell_Get_Management_GetPrevTaskRecord', taskItemMsg, res => {
if (res.data.resultCode == 1) {
this.addTaskTableList.push({
type: taskItemMsg.JoinType,
id: 0,
DepOrEmpId: taskItemMsg.JoinId,
name: node.Name,
value: '',
Percentage: res.data.data.Percentage,
PrevFinish: res.data.data.PrevFinish
})
}
}, err => {})
},
deleteTaskItem(node) {
if (this.addTaskTableList.findIndex(item => item.DepOrEmpId == node.Id) != -1) {
this.addTaskTableList.splice(this.addTaskTableList.findIndex(item => item.DepOrEmpId == node.Id), 1)
}
},
getTaskMember() {
this.apipost('Sell_Get_Management_GetNowDepartmentChild', this.layerMsg, res => {
if (res.data.resultCode == 1) {
this.taskMembers = res.data.data
this.taskMemberList = res.data.data.date
}
}, err => {})
},
addNewTask() {
this.addTask = true
this.isAllocatingTask = false
this.layerMsg.TaskUserId = 0
this.getTaskMember()
this.getTaskType()
},
saveNewTask() {
this.addTaskMsg.UserTaskList = []
this.addTaskMsg.StartTime = this.addTaskMsg.taskTime[0]
this.addTaskMsg.EndTime = this.addTaskMsg.taskTime[1]
this.addTaskMsg.RealTaskNum = this.addTaskMsg.TaskNum
let i = 0;
this.addTaskTableList.forEach(item => {
this.addTaskMsg.UserTaskList.push({
Type: item.type,
RealTaskNum: item.value,
TaskNum: item.value,
DepOrEmpId: item.DepOrEmpId
})
i += parseInt(item.value)
})
if (this.addTaskTableList.length == 0) {
this.$message.error('请选择分配对象！')
return
}
this.apipost('Sell_Post_Management_SetSellTask', this.addTaskMsg, res => {
if (res.data.resultCode == 1) {
this.clearMsg()
this.departmetTaskList = []
this.myTaskList = []
this.departmetTaskMsg.PageIndex = 1
this.myTaskMsg.pageIndex = 1
this.getDepartmetTask()
this.getMyTask()
this.$message.success(res.data.message)
} else {
this.$message.error(res.data.message)
}
}, err => {})
},
getTaskType() {
this.apipost('Sell_Get_Management_GetSellTaskTypeList', {}, res => {
if (res.data.resultCode == 1) {
this.taskTypeList = res.data.data
}
}, err => {})
},
getDepartmetTask() {
this.apipost('Sell_Get_Management_GetSellDepartmentTaskList', this.departmetTaskMsg, res => {
if (res.data.resultCode == 1) {
this.departmetTaskList = this.departmetTaskList.concat(res.data.data.pageData)
}
}, err => {})
},
getNowTask() {
this.apipost('TaskManagemnet_post_GetNowTaskForEmployee', this.nowTaskMsg, res => {
if (res.data.resultCode == 1) {
this.nowTaskList = this.nowTaskList.concat(res.data.data.pageData)
}
}, err => {})
},
getDepartmentPower() {
this.apipost('TaskManagemnet_post_GetExecutiveForce', {}, res => {
if (res.data.resultCode == 1) {
this.departmentPowerList = res.data.data
this.departmentPowerList.forEach((i, index) => {
let insideColor
let outsideColor
if (i.rate == 0) {
insideColor = '#999999'
outsideColor = '#999999'
} else if (i.rate < 50 && i.rate > 0) {
insideColor = '#E85252'
outsideColor = '#FFDDDD'
} else if (50 <= i.rate && i.rate < 80) {
insideColor = '#FFBA1F'
outsideColor = '#FFE09B'
} else if (80 <= i.rate && i.rate < 100) {
insideColor = '#2AAEF2'
outsideColor = '#BDE9FF'
} else if (i.rate == 100) {
insideColor = '#47BF8C'
outsideColor = '#47BF8C'
}
this.$nextTick(() => {
this.$chartsUtils.saleTaskDepartment('mychart' + index, i.taskTypeStr, i.rate, insideColor,
outsideColor)
})
})
}
}, err => {})
},
getMyTask() {
this.apipost('Sell_Management_TaskForMyIssue', this.myTaskMsg, res => {
if (res.data.resultCode == 1) {
this.myTaskList = this.myTaskList.concat(res.data.data.pageData)
}
}, err => {})
},
getTodayTask() {
this.apipost('TaskManagemnet_post_GetListSellContribution', this.todayTaskMsg, res => {
if (res.data.resultCode == 1) {
this.todayTaskList = this.todayTaskList.concat(res.data.data.pageData)
if (this.todayTaskList&&this.todayTaskList.length > 0) {
this.todayTaskMsg.Id = this.todayTaskList[0].id
this.todayTaskMsgNew.Id = this.todayTaskList[0].id
}
}
}, err => {})
},
getTodayTaskNew() {
this.timer = setInterval(() => {
this.apipost('TaskManagemnet_post_GetRefreshList', this.todayTaskMsgNew, res => {
if (res.data.resultCode == 1) {
if (res.data.data && res.data.data.length > 0) {
this.todayTaskListNew = res.data.data.concat(this.todayTaskListNew)
this.todayTaskMsgNew.Id = this.todayTaskListNew[0].id
} else {
}
}
}, err => {})
}, 60000)
},
goUrl(path, id, title) {
this.$router.push({
name: path,
query: {
"id": id,
"PersonOrDepartment": 0,
blank: 'y',
tab: title
}
})
}
},
beforeDestroy() {
if (this.timer) { //如果定时器还在运行 或者直接关闭，不用判断
clearInterval(this.timer); //关闭
}
}
}
</script>
<style>
.saleTaskList .noDataNotice{ text-align: center; padding-top: 80px; color: #999; font-size: 14px; }
.saleTaskList .noDataNotice>i{font-size: 120px; color: #ccc;}
.saleTaskList .noDataNotice>p{margin-top: 10px;}
.saleTaskList{position: absolute; left: 0; top:35px; padding-left:20px ; }
.saleTaskList .goSaleTaskDetail{cursor: pointer;}
.saleTaskList .goSaleTaskDetail:hover{color: #E95252;}
.saleTaskList ul li{float: left; margin:10px 30px 0 0;}
.saleTaskList .itemCont::-webkit-scrollbar{width: 4px;height: 1px;}
.saleTaskList .itemCont::-webkit-scrollbar-thumb{box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.2);border-radius: 4px;background: #eee;}
.saleTaskList ul li .itemCont{width: 460px; height: 360px; border:1px solid #e5e5e5; background: #fff; border-radius: 4px; overflow-y: auto; padding:10px 20px;}
.saleTaskList ul li .width530{width: 530px!important;}
.saleTaskList ul li .width590{width: 590px!important;}
.saleTaskList .myChatList>div{float: left;margin:20px 25px 19px;}
.saleTaskList .itemCont .contTypeOne .el-progress__text{font-size: 14px!important;}
.saleTaskList ul li>p{height: 14px; line-height: 14px; border-left:3px solid #E95252; font-size: 14px; color: #333; margin: 20px 0; text-indent: 10px;}
.saleTaskList .addTaskTitle{height: 14px; line-height: 14px; border-left:3px solid #E95252; font-size: 14px; color: #333; margin: 20px 0; text-indent: 10px;}
.saleTaskList .contTypeOne {margin-bottom:15px ;}
.saleTaskList .contTypeOne p{font-size: 16px; color: #333;}
.saleTaskList .contTypeOne p.smallfont{font-size: 14px; color: #666;}
.saleTaskList .contTypeOne p{line-height:40px;}
.saleTaskList .contTypeOne p i{color: #E95252; cursor: pointer;}
.saleTaskList .contTypeOne p>em{color: #fff; background: #2C6ED5; font-size: 12px; font-style: normal; padding:0 2px; border-radius: 4px; margin-left:8px;}
.saleTaskList .contTypeOne p>span{font-size: 12px; color: #47BF8C;}
.saleTaskList .contTypeTwo {float: left; width: 126px; height: 126px; text-align: center; margin: 10px;}
.saleTaskList .contTypeTwo>p{font-size: 14px; color: #666;margin-top: 10px;}
.saleTaskList .itemCont .contTypeTwo .el-progress__text{font-size: 20px!important;}
.saleTaskList ul li>p>span{float: right; color: #E95252; cursor:pointer;}
.saleTaskList .itemCont .contTypeThree{margin:20px 0; overflow: hidden;line-height: 30px; height: 30px}
.saleTaskList .itemCont .contTypeThree>div{float: left; font-size: 14px;}
.saleTaskList .itemCont .contTypeThree .name{width: 100px;}
.saleTaskList .itemCont .contTypeThree .name>img{width: 24px; height: 24px; border-radius: 12px; vertical-align:middle}
.saleTaskList .itemCont .contTypeThree .department{width: 110px;}
.saleTaskList .itemCont .contTypeThree .message{width:200px;}
.saleTaskList .itemCont .contTypeThree .message>p{float: left;}
.saleTaskList .itemCont .contTypeThree .message>p>span{color:#47BF8C;}
.saleTaskList .itemCont .contTypeThree .message p.msg{max-width: 120px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap}
.saleTaskList .itemCont .contTypeThree .time{float: right; text-align: right; color: #999;}
.saleTaskpopover{padding:0 10px 10px; font-size: 12px;}
.saleTaskpopoverTable{margin: 10px 0 20px 0;}
.saleTaskpopoverTable tr{height: 34px; }
.saleTaskpopoverTable td{font-size: 12px!important; color: #666;}
.saleTaskpopoverTable td>i{margin-right: 3px; color: #d9d9d9;}
.saleTaskList .addTaskLayer{position:absolute; padding:0 20px 20px; left: 0; bottom: 0; width: 100%; min-height:520px; z-index: 5; background: #ffffff; border-top: 1px solid #D2D2D2;}
.saleTaskList .addTaskLayer .addMsg{width: 100%; height: 420px;}
.saleTaskList .addTaskLayer .addMsg>div{float: left; min-height: 300px; font-size: 12px; padding:0 13px; margin-right: 30px;}
.saleTaskList .addTaskLayer .addMsg>div>p{margin: 15px 0;}
.addTaskLayer .el-form-item__label{font-size: 12px!important;}
.addTaskLayer .el-date-editor.el-range-editor.el-input__inner.el-date-editor--daterange{border-radius: 17px;}
.el-select .el-input {border-radius: 17px;height: 34px;}
.h34 .el-range__icon,.h34 .el-range-separator{line-height: 29px;}
.addTaskLayerTable{background: #EDEDED;}
.addTaskLayerTable td{padding: 10px; background: #FFF; text-align: center;}
.addTaskLayerTable th{background: #EDEDED; padding:10px;}
.addTaskLayerTableDiv{overflow: hidden;}
.addTaskLayerTableDiv>p{display:inline-block;margin-bottom: 10px;}
.addTaskLayerTableDiv .finish{width: 56px; text-align:left;}
.addTaskLayerTableDiv .finishH{height: 30px;}
.finishNumTips{height: 12px;}
.finishNum{width: 40px;}
.addTaskLayer .vue-treeselect__x{display: none;}
.saleTaskList .noDataNotice {
text-align: center;
padding-top: 80px;
color: #999;
font-size: 14px;
}
.saleTaskList .noDataNotice>i {
font-size: 120px;
color: #ccc;
}
.saleTaskList .noDataNotice>p {
margin-top: 10px;
}
.saleTaskList {
position: absolute;
left: 0;
top: 35px;
padding-left: 20px;
}
.saleTaskList .goSaleTaskDetail {
cursor: pointer;
}
.saleTaskList .goSaleTaskDetail:hover {
color: #E95252;
}
.saleTaskList ul li {
float: left;
margin: 10px 30px 0 0;
}
.saleTaskList .itemCont::-webkit-scrollbar {
width: 4px;
height: 1px;
}
.saleTaskList .itemCont::-webkit-scrollbar-thumb {
box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.2);
border-radius: 4px;
background: #eee;
}
.saleTaskList ul li .itemCont {
width: 460px;
height: 360px;
border: 1px solid #e5e5e5;
background: #fff;
border-radius: 4px;
overflow-y: auto;
padding: 10px 20px;
}
.saleTaskList ul li .width530 {
width: 530px !important;
}
.saleTaskList ul li .width590 {
width: 590px !important;
}
.saleTaskList .myChatList>div {
float: left;
margin: 20px 25px 19px;
}
.saleTaskList .itemCont .contTypeOne .el-progress__text {
font-size: 14px !important;
}
.saleTaskList ul li>p {
height: 14px;
line-height: 14px;
border-left: 3px solid #E95252;
font-size: 14px;
color: #333;
margin: 20px 0;
text-indent: 10px;
}
.saleTaskList .addTaskTitle {
height: 14px;
line-height: 14px;
border-left: 3px solid #E95252;
font-size: 14px;
color: #333;
margin: 20px 0;
text-indent: 10px;
}
.saleTaskList .contTypeOne {
margin-bottom: 15px;
}
.saleTaskList .contTypeOne p {
font-size: 16px;
color: #333;
}
.saleTaskList .contTypeOne p.smallfont {
font-size: 14px;
color: #666;
}
.saleTaskList .contTypeOne p {
line-height: 40px;
}
.saleTaskList .contTypeOne p i {
color: #E95252;
cursor: pointer;
}
.saleTaskList .contTypeOne p>em {
color: #fff;
background: #2C6ED5;
font-size: 12px;
font-style: normal;
padding: 0 2px;
border-radius: 4px;
margin-left: 8px;
}
.saleTaskList .contTypeOne p>span {
font-size: 12px;
color: #47BF8C;
}
.saleTaskList .contTypeTwo {
float: left;
width: 126px;
height: 126px;
text-align: center;
margin: 10px;
}
.saleTaskList .contTypeTwo>p {
font-size: 14px;
color: #666;
margin-top: 10px;
}
.saleTaskList .itemCont .contTypeTwo .el-progress__text {
font-size: 20px !important;
}
.saleTaskList ul li>p>span {
float: right;
color: #E95252;
cursor: pointer;
}
.saleTaskList .itemCont .contTypeThree {
margin: 20px 0;
overflow: hidden;
line-height: 30px;
height: 30px
}
.saleTaskList .itemCont .contTypeThree>div {
float: left;
font-size: 14px;
}
.saleTaskList .itemCont .contTypeThree .name {
width: 100px;
}
.saleTaskList .itemCont .contTypeThree .name>img {
width: 24px;
height: 24px;
border-radius: 12px;
vertical-align: middle
}
.saleTaskList .itemCont .contTypeThree .department {
width: 110px;
}
.saleTaskList .itemCont .contTypeThree .message {
width: 200px;
}
.saleTaskList .itemCont .contTypeThree .message>p {
float: left;
}
.saleTaskList .itemCont .contTypeThree .message>p>span {
color: #47BF8C;
}
.saleTaskList .itemCont .contTypeThree .message p.msg {
max-width: 120px;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap
}
.saleTaskList .itemCont .contTypeThree .time {
float: right;
text-align: right;
color: #999;
}
.saleTaskpopover {
padding: 0 10px 10px;
font-size: 12px;
}
.saleTaskpopoverTable {
margin: 10px 0 20px 0;
}
.saleTaskpopoverTable tr {
height: 34px;
}
.saleTaskpopoverTable td {
font-size: 12px !important;
color: #666;
}
.saleTaskpopoverTable td>i {
margin-right: 3px;
color: #d9d9d9;
}
.saleTaskList .addTaskLayer {
position: absolute;
padding: 0 20px 20px;
left: 0;
bottom: 0;
width: 100%;
min-height: 520px;
z-index: 5;
background: #ffffff;
border-top: 1px solid #D2D2D2;
}
.saleTaskList .addTaskLayer .addMsg {
width: 100%;
height: 420px;
}
.saleTaskList .addTaskLayer .addMsg>div {
float: left;
min-height: 300px;
font-size: 12px;
padding: 0 13px;
margin-right: 30px;
}
.saleTaskList .addTaskLayer .addMsg>div>p {
margin: 15px 0;
}
.addTaskLayer .el-form-item__label {
font-size: 12px !important;
}
.addTaskLayer .el-date-editor.el-range-editor.el-input__inner.el-date-editor--daterange {
border-radius: 17px;
}
.el-select .el-input {
border-radius: 17px;
height: 34px;
}
.h34 .el-range__icon,
.h34 .el-range-separator {
line-height: 29px;
}
.addTaskLayerTable {
background: #EDEDED;
}
.addTaskLayerTable td {
padding: 10px;
background: #FFF;
text-align: center;
}
.addTaskLayerTable th {
background: #EDEDED;
padding: 10px;
}
.addTaskLayerTableDiv {
overflow: hidden;
}
.addTaskLayerTableDiv>p {
display: inline-block;
margin-bottom: 10px;
}
.addTaskLayerTableDiv .finish {
width: 56px;
text-align: left;
}
.addTaskLayerTableDiv .finishH {
height: 30px;
}
.finishNumTips {
height: 12px;
}
.finishNum {
width: 40px;
}
.addTaskLayer .vue-treeselect__x {
display: none;
}
</style>
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment