Commit 77acb4c2 by 彭祥礼

增加KPI管理菜单及菜单内功能

parent 383d4b56
import {postAction,downFilePost} from '@/api/manage'
const prefix = '/manager/ciop';
// 楼长KPI管理
let initSubstName = (params) => postAction(prefix + "/lzKpi/initSubstName" , params);
let getSchoolNames = (params) => postAction(prefix + "/lzKpi/getSchoolNames" , params);
let uploadExcel = (params) => downFilePost(prefix + "/lzKpi/excelOut" , params);
let downloadMoBan = (params) => downFilePost(prefix + "/lzKpi/downloadMoBan" , params);
let lzKpiList = (params) => postAction(prefix + "/lzKpi/list" , params);
let lzKpiDelete = (params) => postAction(prefix + "/lzKpi/delete", params);
let lzKpiInsert = (params) => postAction(prefix + "/lzKpi/insert" , params);
let lzKpiUpdate = (params) => postAction(prefix + "/lzKpi/update",params);
export {
initSubstName,
getSchoolNames,
uploadExcel,
downloadMoBan,
lzKpiList,
lzKpiDelete,
lzKpiInsert,
lzKpiUpdate,
}
<template>
<div class="flex-container">
<!-- 查询区域 -->
<div class="table-page-search-wrapper">
<!-- 搜索区域 -->
<a-form layout="inline">
<a-row :gutter="24">
<a-col :md="4" :sm="8">
<a-form-item label="姓名">
<a-input placeholder="姓名" v-model="queryParam.userName" style="width: 8rem;"></a-input>
</a-form-item>
</a-col>
<a-col :md="4" :sm="8">
<a-form-item label="县分">
<a-select v-model="queryParam.substName" @change="getSchoolNames" style="width: 8rem;">
<a-select-option key="">--全部--</a-select-option>
<a-select-option v-for="d in subNames" :key="d.value" :value="d.value">{{d.text}}
</a-select-option>
</a-select>
</a-form-item>
</a-col>
<a-col :md="6" :sm="12">
<a-form-item label="学校">
<a-select v-model="queryParam.schoolName" style="width: 15rem;">
<a-select-option key="">--全部--</a-select-option>
<a-select-option v-for="d in schoolNames" :key="d.value" :value="d.value">{{d.text}}
</a-select-option>
</a-select>
</a-form-item>
</a-col>
<a-col :md="4" :sm="8">
<a-form-item label="KPI月份">
<a-month-picker @change="onChange" v-model="queryParam.month" placeholder="选择KPI月份" style="width: 8rem;"/>
</a-form-item>
</a-col>
<span class="table-page-search-submitButtons" style="float: left; overflow: hidden;">
<a-col :md="6" :sm="24">
<a-button @click="search()" type="primary">查询</a-button>
<a-divider type="vertical"/>
<a-button @click="modifyfunction()" type="primary">添加</a-button>
<a-divider type="vertical"/>
<a-button @click="excelInto()" type="primary">KPI数据导入</a-button>
<a-divider type="vertical"/>
<a-button @click="excelOut()" type="primary">KPI数据导出</a-button>
</a-col>
</span>
</a-row>
</a-form>
</div>
<a-modal
title="批量导入"
:visible="kpiModifyvisible"
@ok="createfunctionOk0"
@cancel="createfunctionCancel0"
html-type="submit"
width="400px"
>
<a-row :gutter="24">
<a-col :md="24" :sm="12">
<p style="text-align:center">{{ importTile }}</p>
</a-col>
</a-row>
<import-btn :url="importUrl" :responseFun="doPush">
<a-tooltip placement="topLeft" title="导入文件" arrowPointAtCenter>
<a-row :gutter="24">
<a-col :md="24" :sm="12">
<p>
选择文件:
<a-button type="primary">选择文件</a-button>
</p>
</a-col>
</a-row>
</a-tooltip>
</import-btn>
<a-row :gutter="24">
<a-col :md="24" :sm="12">
<p v-show="YRYMmoBan">
模板下载:
<a-button type="primary" @click="downloadMoBan">楼长KPI管理信息模板</a-button>
</p>
</a-col>
</a-row>
<a-row :gutter="24" :v-show="KDmoBan">
<a-col :md="24" :sm="12">
<p>说明:</p>
<p>1.批量导入请严格按照模版进行导入;</p>
</a-col>
</a-row>
</a-modal>
<!--列表-->
<s-table :columns="columns" :data="rowdata" bordered ref="table" size="small" class="flex-filling"
:locale="emptyText">
<!--拦截器-->
<template slot="productLastUpdateTime" slot-scope="text">
{{ text | dayjs}}
</template>
<!--拦截器-->
<template slot="productCreateTime" slot-scope="text">
{{ text | dayjs}}
</template>
<template slot="productState" slot-scope="text">
<p v-if="text=='0'">正常</p>
<p v-else=""></p>
</template>
<template slot="operation" slot-scope="text,record">
<span>
<a @click="modifyfunction(record)">KPI打分</a>
<a-divider v-show="false" type="vertical"/>
<a-popconfirm title="确定不显示吗" v-show="false" v-if="record.isDel == 0" @confirm="remove(record.id,1)">
<a>隐藏</a>
</a-popconfirm>
<a-popconfirm v-show="false" title="确定显示吗" v-if="record.isDel == 1" @confirm="remove(record.id,0)">
<a>显示</a>
</a-popconfirm>
</span>
</template>
</s-table>
<!----弹框-->
<a-modal :title="add ?'添加正则配置': '编辑正则配置'" :visible="modifyvisible" @ok="createfunctionOk"
@cancel="createfunctionCancel" html-type="submit" width="1024px">
<a-form :form="Formtable">
<a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="姓名:">
<a-input placeholder="姓名" v-decorator="[ 'sysuName']" disabled/>
</a-form-item>
<a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="学校:">
<a-input placeholder="学校" v-decorator="[ 'schoolName', ]" disabled/>
</a-form-item>
<a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="汇总任务量(满分:30):">
<a-input-number placeholder="汇总任务量" :min="0"
v-decorator="[ 'reportDaily', {rules: [{ required: true, message: '汇总任务量不能为空!' }]} ]"
style="width: 20rem;"/>
</a-form-item>
<a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="参与集中营销(满分:30):">
<a-input-number placeholder="参与集中营销" :min="0"
v-decorator="[ 'collectiveSales', {rules: [{required: true, message: '参与集中营销不能为空!' }]} ]"
style="width: 20rem;"/>
</a-form-item>
<a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="组织周例会(满分:10):">
<a-input-number placeholder="组织周例会" :min="0"
v-decorator="[ 'weeklyMeeting', {rules: [{ required: true, message: '组织周例会不能为空!' }]} ]"
style="width: 20rem;"/>
</a-form-item>
<a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="定制扫楼营销方案(满分:10):">
<a-input-number placeholder="定制扫楼营销方案" :min="0"
v-decorator="[ 'organTraining', {rules: [{ required: true, message: '定制扫楼营销方案不能为空!' }]} ]"
style="width: 20rem;"/>
</a-form-item>
<a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="组织培训(满分:20):">
<a-input-number placeholder="组织培训" :min="0"
v-decorator="[ 'designPlan', {rules: [{required: true, message: '组织培训不能为空!' }]} ]"
style="width: 20rem;"/>
</a-form-item>
<a-form-item v-show="false" :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="KPI总值:">
<a-input-number placeholder="KPI总值" :min="0"
v-decorator="[ 'kpi', {rules: [{ required: true, message: 'KPI总值不能为空!'}]} ]"
style="width: 20rem;"/>
</a-form-item>
<a-form-item v-show="add" :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="KPI月份:">
<a-month-picker @change="onChange" placeholder="选择KPI月份" v-decorator="[ 'month' ]"
style="width: 20rem;"/>
</a-form-item>
<a-form-item v-show="false" :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="是否删除:">
<a-select v-decorator="['isDel']" style="width: 330px">
<a-select-option key="1"></a-select-option>
<a-select-option key="0"></a-select-option>
</a-select>
</a-form-item>
</a-form>
</a-modal>
</div>
</template>
<script>
import STable from '@/components/table';
import ImportBtn from "../../../components/sysmanage/ImportBtn";
import {
lzKpiList, lzKpiDelete, lzKpiInsert, lzKpiUpdate,
getSchoolNames, initSubstName, uploadExcel, downloadMoBan
} from "@/api/school-center/louZhangManagerAPI"
import {cloneObject, exportFile} from '@/utils/util';
import Vue from 'vue';
import {DatetimePicker} from 'vant';
import moment from "moment";
import ConstantActivity from "@/constant/ConstantActivity";
Vue.use(DatetimePicker);
export default {
name: "louZhangKPI",
components: {
STable, ImportBtn
},
data() {
return {
emptyText: {emptyText: '暂无数据'},
Formtable: this.$form.createForm(this),
modifyvisible: false,
kpiModifyvisible: false,
title: ConstantActivity.title,
add: true,
queryParam: {
userName: '',
substName: '',
schoolName: '',
month: '',
},
subNames: [],
schoolNames: [],
modelData: {
id: '',
userId: '',
sysuName: '',
account: '',
substName: '',
schoolName: '',
reportDaily: '',
collectiveSales: '',
weeklyMeeting: '',
organTraining: '',
designPlan: '',
kpi: '',
month: '',
isDel: '0'
},
columns: [
{dataIndex: 'sysuName', width: 40, title: '姓名'},
{dataIndex: 'account', width: 50, title: '账号'},
{dataIndex: 'substName', width: 30, title: '县分'},
{dataIndex: 'schoolName', width: 70, title: '学校'},
{dataIndex: 'reportDaily', width: 30, title: '汇总任务量'},
{dataIndex: 'collectiveSales', width: 30, title: '参与集中营销'},
{dataIndex: 'weeklyMeeting', width: 30, title: '组织周例会'},
{dataIndex: 'organTraining', width: 30, title: '定制扫楼营销方案 '},
{dataIndex: 'designPlan', width: 30, title: '组织培训 '},
{dataIndex: 'kpi', width: 30, title: 'KPI总值'},
{dataIndex: 'month', width: 30, title: 'KPI月份 '},
{
dataIndex: 'operation',
width: 30,
title: '操作',
scopedSlots: {customRender: 'operation'},
fixed: "right"
}
],
rowdata: parameter => {
let params = {
pageNo: parameter.pageNo,
pageSize: parameter.pageSize
}
let obj = cloneObject(this.queryParam)
//表示
return lzKpiList(Object.assign(params, obj)).then(res => {
let data = {}
if (res.state !== 'success') {
this.$message.error("查询失败!", 5);
this.emptyText.emptyText = '查询失败!'
data = {
data: [],
pageSize: parameter.pageSize,
pageNo: 1,
totalCount: 0
}
} else {
data = {
data: res.data.records,
pageSize: parameter.pageSize,
pageNo: parameter.pageNo,
totalCount: res.data.total
}
}
return data
})
},
importTile: "",
importUrl: "",
YRYMmoBan: true,
}
},
methods: {
moment,
onChange(date, dateString) {
console.log(dateString);
this.modelData.month = dateString;
},
excelOut() {
let params = {
pageNo: 1,
pageSize: 10
}
let obj = cloneObject(this.queryParam)
let nowdate = moment().format("YYYY-MM-DD");
//导出
exportFile(
uploadExcel(Object.assign(params, obj)),
"楼长KPI管理信息" + nowdate + ".xls",
);
},
excelInto() {
this.importTile = "批量导入楼长KPI管理信息";
this.YRYMmoBan = true;
this.importUrl = "manager/ciop/lzKpi/importDate";
this.kpiModifyvisible = true
},
downloadMoBan: function () {
exportFile(downloadMoBan(), "楼长KPI管理信息.xlsx");
},
doPush(res) {
console.log(res);
if (!res || !res.response) {
this.$message.error("上传文件出错!", 10);
return false;
}
const response = res.response;
if (response.state !== "success") {
this.$message.error(response.msg ? response.msg : "上传文件出错!", 10);
return false;
}
this.$message.success("上传成功!" + response.data, 5);
},
createfunctionOk0() {
this.kpiModifyvisible = false;
this.clearmodel0();
},
createfunctionCancel0() {
this.kpiModifyvisible = false;
this.clearmodel0();
},
clearmodel0() {
this.importTile = "";
this.YRYMmoBan = false;
this.importUrl = "";
},
search() {
this.$refs.table.refresh({search: true})
},
remove(id, isdel) {
lzKpiDelete({'id': id, 'isdel': isdel}).then((res) => {
if (res.state == "success") {
this.$notification.success({message: res.data, description: '', duration: 4})
}
this.$refs.table.refresh({search: true})
})
},
modifyfunction(data) {
if (data != undefined) {
this.modelData.id = data.id
this.modelData.userId = data.userId
this.modelData.month = data.month
setTimeout(() => {
this.Formtable.setFieldsValue({
"sysuName": data.sysuName,
"account": data.account,
"substName": data.substName,
"schoolName": data.schoolName,
"reportDaily": data.reportDaily,
"collectiveSales": data.collectiveSales,
"weeklyMeeting": data.weeklyMeeting,
"organTraining": data.organTraining,
"designPlan": data.designPlan,
"month": data.month,
"kpi": data.kpi,
"isDel": data.isDel
})
}, 0)
this.add = false;
}
this.modifyvisible = true;
},
createfunctionOk() {
let that = this;
that.Formtable.validateFields(['sysuName', 'account', 'substName', 'schoolName', 'reportDaily', 'collectiveSales', 'weeklyMeeting', 'organTraining', 'designPlan', "month", 'kpi', 'isDel'], {force: true}, (err, values) => {
if (err) {
return;
}
that.modelData.reportDaily = values.reportDaily
that.modelData.collectiveSales = values.collectiveSales
that.modelData.weeklyMeeting = values.weeklyMeeting
that.modelData.organTraining = values.organTraining
that.modelData.designPlan = values.designPlan
that.modelData.kpi = values.reportDaily + values.collectiveSales + values.weeklyMeeting + values.organTraining + values.designPlan
that.modelData.isDel = 0
if (this.add) {
let obj = that.modelData;
delete obj.id
let lzKpi = JSON.stringify(obj);
lzKpiInsert({lzKpi}).then((res) => {
this.modifyvisible = false;
this.clearmodel()
if (res.state == "success") {
this.$notification.success({message: res.data, description: '', duration: 4})
}
this.search()
})
} else {
let obj = that.modelData;
let lzKpi = JSON.stringify(obj);
lzKpiUpdate({lzKpi}).then((res) => {
this.modifyvisible = false;
this.clearmodel()
if (res.state == "success") {
this.$notification.success({message: res.data, description: '', duration: 4})
}
this.search()
})
}
})
},
createfunctionCancel() {
this.modifyvisible = false;
this.clearmodel()
this.add = true;
},
//清除弹窗信息
clearmodel() {
this.add = true
this.modelData.id = ''
this.modelData.month = ''
this.Formtable.setFieldsValue({
"sysuName": '',
"account": '',
"substName": '',
"schoolName": '',
"reportDaily": '',
"collectiveSales": '',
"weeklyMeeting": '',
"organTraining": '',
"designPlan": '',
"kpi": '',
"month": '',
"isDel": 1
})
},
getSchoolNames() {
this.schoolNames = []
getSchoolNames({"substName": this.queryParam.substName}).then((res) => {
if (res.state == "success") {
const result = res.data
result.forEach((r) => {
if (r.schoolName === 'null')
return;
this.schoolNames.push({
value: r.schoolName,
text: r.schoolName
})
})
}
})
},
initSubstName() {
initSubstName().then((res) => {
if (res.state == "success") {
const result = res.data
result.forEach((r) => {
if (r.subName === 'null')
return;
this.subNames.push({
value: r.subName,
text: r.subName
})
})
}
})
}
},
mounted() {
this.initSubstName();
this.getSchoolNames();
}
}
</script>
<style scoped>
</style>
\ No newline at end of file
<template>
<div class="flex-container">
<!-- 查询区域 -->
<div class="table-page-search-wrapper">
<!-- 搜索区域 -->
<a-form layout="inline">
<a-row :gutter="24">
<a-col :md="6" :sm="12">
<a-form-item label="正则名称">
<a-input placeholder="正则名称" v-model="queryParam.regularName" ></a-input>
</a-form-item>
</a-col>
<span class="table-page-search-submitButtons" style="float: left; overflow: hidden;">
<a-col :md="6" :sm="24">
<a-button @click="search()" type="primary">查询</a-button>
<a-divider type="vertical"/>
<a-button @click="modifyfunction()" type="primary">添加</a-button>
</a-col>
</span>
</a-row>
</a-form>
</div>
<!--列表-->
<s-table :columns="columns" :data="rowdata" bordered ref="table" size="small" class="flex-filling" :locale="emptyText">
<!--拦截器-->
<template slot="productLastUpdateTime" slot-scope="text">
{{ text | dayjs}}
</template>
<!--拦截器-->
<template slot="productCreateTime" slot-scope="text">
{{ text | dayjs}}
</template>
<template slot="productState" slot-scope="text">
<p v-if="text=='0'">正常</p>
<p v-else=""></p>
</template>
<template slot="operation" slot-scope="text,record">
<span>
<a @click="modifyfunction(record)">编辑</a>
<a-divider type="vertical"/>
<a-popconfirm title="确定不显示吗" v-if="record.isShow == 1" @confirm="remove(record.regularId,0)">
<a>隐藏</a>
</a-popconfirm>
<a-popconfirm title="确定显示吗" v-if="record.isShow == 0" @confirm="remove(record.regularId,1)">
<a>显示</a>
</a-popconfirm>
</span>
</template>
</s-table>
<!----弹框-->
<a-modal :title="add ?'添加正则配置': '编辑正则配置'" :visible="modifyvisible" @ok="createfunctionOk" @cancel="createfunctionCancel" html-type="submit" width="1024px">
<a-form :form="Formtable">
<a-form-item v-show="false" :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="">
<a-input placeholder="regularId" v-decorator="[ 'regularId', {rules: [{ required: true, message: 'regularId' ,validator: 'click'}]} ]"></a-input>
</a-form-item>
<a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="正则名称:">
<a-input placeholder="正则名称" v-decorator="[ 'regularName', {rules: [{ required: true, message: '学校名称不能为空!' ,validator: 'click'}]} ]"></a-input>
</a-form-item>
<a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="正则表达示:">
<a-input placeholder="正则表达示" v-decorator="[ 'regular', {rules: [{ required: true, message: '表达示不能为空!' ,validator: 'click'}]} ]"></a-input>
</a-form-item>
<a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="错误提示:">
<a-input placeholder="错误提示" v-decorator="[ 'tips', {rules: [{required: true, message: '装机地址不能为空!' ,validator: 'click'}]} ]"></a-input>
</a-form-item>
<a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="输入框默认值:">
<a-input placeholder="输入框默认值" v-decorator="[ 'placeholder', {rules: [{ required: true, message: '外线方式不能为空!' ,validator: 'click'}]} ]"></a-input>
</a-form-item>
<a-form-item :labelCol="{span: 5}" :wrapperCol="{span: 9, offset: 1}" label="是否显示:">
<a-select v-decorator="[ 'isShow' ]" style="width: 330px">
<a-select-option key="1"></a-select-option>
<a-select-option key="0"></a-select-option>
</a-select>
</a-form-item>
</a-form>
</a-modal>
</div>
</template>
<script>
import STable from '@/components/table';
import {regularList,regularDelete,regularInsert,regularUpdate} from "@/api/school-center/louZhangManagerAPI"
import {cloneObject} from '@/utils/util';
export default {
name: "lzSalary",
components: {
STable,
},
data(){
return {
emptyText: {emptyText: '暂无数据'},
Formtable: this.$form.createForm(this),
modifyvisible: false,
add: true,
queryParam: {
regularName :'',
},
modelData:{
regularId: '',
regularName:'',
regular:'',
tips:'',
placeholder:'',
isShow: '1'
},
columns: [
{dataIndex: 'regularId', width: 20, title: 'regularId',istrue: true},
{dataIndex: 'regularName', width: 70, title: '正则名称'},
{dataIndex: 'regular', width: 100, title: '正则表达示 '},
{dataIndex: 'tips', width: 70, title: '错误提示'},
{dataIndex: 'placeholder', width: 70, title: '输入框默认提示 '},
{
dataIndex: 'operation',
width: 26,
title: '操作',
scopedSlots: {customRender: 'operation'},
fixed: "right"
}]
,
rowdata: parameter => {
let params = {
pageNo: parameter.pageNo,
pageSize: parameter.pageSize
}
let obj = cloneObject(this.queryParam)
//表示
return regularList(Object.assign(params,obj)).then(res => {
let data = {}
if (res.state !== 'success') {
this.$message.error("查询失败!", 5);
this.emptyText.emptyText = '查询失败!'
data = {
data: [],
pageSize: parameter.pageSize,
pageNo: 1,
totalCount: 0
}
} else {
data = {
data: res.data.records,
pageSize: parameter.pageSize,
pageNo: parameter.pageNo,
totalCount: res.data.total
}
}
return data
})
}
}
},
methods:{
search() {
this.$refs.table.refresh({search: true})
},
remove(regularId,isShow) {
regularDelete({'regularId':regularId,'isShow':isShow}).then((res) => {
if(res.state=="success"){
this.$notification.success({message: res.data, description: '', duration: 4})
}
this.$refs.table.refresh({search: true})
})
},
modifyfunction(data){
if(data != undefined ){
this.modelData.regularId=data.regularId
setTimeout(()=>{
this.Formtable.setFieldsValue({
"regularId":data.regularId,
"regularName":data.regularName,
"regular":data.regular,
"tips":data.tips,
"placeholder":data.placeholder,
"isShow":data.isShow
})
},0)
this.add=false;
}
this.modifyvisible=true;
},
createfunctionOk(){
let that = this;
that.Formtable.validateFields(['regularName','regular','tips','placeholder','isShow'], {force: true}, (err, values) => {
if (err ) {
return;
}
that.modelData.regularName=values.regularName
that.modelData.regular=values.regular
that.modelData.tips=values.tips
that.modelData.placeholder=values.placeholder
that.modelData.isShow=values.isShow
if(this.add){
let obj= that.modelData;
delete obj.id
let regular= JSON.stringify(obj);
regularInsert({regular}).then((res) => {
this.modifyvisible=false;
this.clearmodel()
if(res.state=="success"){
this.$notification.success({message: res.data, description: '', duration: 4})
}
this.search()
})
}else {
let obj= that.modelData;
let regular= JSON.stringify(obj);
regularUpdate({regular}).then((res) => {
this.modifyvisible=false;
this.clearmodel()
if(res.state=="success"){
this.$notification.success({message: res.data, description: '', duration: 4})
}
this.search()
})
}
})
},
createfunctionCancel(){
this.modifyvisible=false;
this.clearmodel()
this.add=true;
},
//清除弹窗信息
clearmodel() {
this.add=true
this.modelData.regularId=''
this.Formtable.setFieldsValue({
"regularName":'',
"regular":'',
"tips":'',
"placeholder":'',
"isShow":'',
})
}
}
}
</script>
<style scoped>
</style>
\ No newline at end of file
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