|
<!DOCTYPE HTML>
|
<html xmlns:th="http://www.thymeleaf.org" xmlns:matrix="http://www.w3.org/1999/xhtml">
|
<head>
|
<meta charset="utf-8">
|
<META HTTP-EQUIV="Pragma" CONTENT="no-cache">
|
<meta name="renderer" content="webkit|ie-comp|ie-stand">
|
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
|
<meta name="viewport"
|
content="width=device-width,initial-scale=1,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
|
<meta http-equiv="Cache-Control" content="no-siteapp" />
|
<LINK rel="Bookmark" href="../images/favicon.ico">
|
<!-- 本框架基本脚本和样式 -->
|
<script type="text/javascript" th:src="@{/js/systools/MBaseVue.js}"></script>
|
<script type="text/javascript" th:src="@{/js/plugin/jquery-2.1.4.min.js}"></script>
|
<script type="text/javascript" th:src="@{/js/plugin/jquery.query.js}"></script>
|
<script type="text/javascript" th:src="@{/plugin/moment.min.js}"></script>
|
<link rel="stylesheet" th:href="@{/plugin/element-ui/index.css}">
|
<link th:href="@{/css/styleOne/style.min.css}" rel="stylesheet" type="text/css"/>
|
<script type="text/javascript" th:src="@{/js/function/public.js}"></script>
|
</head>
|
<style>
|
.table-style {
|
margin: 20px 0;
|
padding: 20px 10px;
|
border: 1px solid #DCDFE6;
|
background-color: white;
|
}
|
.search-form {
|
background-color: white;
|
padding-top: 10px;
|
padding-left: 20px;
|
padding-bottom: 10px;
|
}
|
</style>
|
<body>
|
<div id="app" style="">
|
<el-row class="search-form">
|
<el-form ref="form" :model="form" inline>
|
<el-form-item label="选择年月">
|
<el-select v-model="form.year" style="width:120px;" placeholder="请选择年份">
|
<el-option v-for="item in years"
|
:key="item"
|
:label="item"
|
:value="item"></el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item>
|
<el-select v-model="form.month" style="width:120px;" placeholder="请选择月份">
|
<el-option v-for="item in months"
|
:key="item"
|
:label="item"
|
:value="item"></el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item>
|
<el-select v-model="form.day" style="width:120px;" placeholder="请选择日">
|
<el-option v-for="item in days"
|
:key="item"
|
:label="item"
|
:value="item"></el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="日期范围">
|
<el-date-picker v-model="form.timeRange"
|
type="datetimerange"
|
range-separator="至"
|
start-placeholder="开始日期"
|
end-placeholder="结束日期">
|
</el-date-picker>
|
</el-form-item>
|
<el-form-item label="业绩规则" prop="achieveRuleId">
|
<el-select v-model="form.achieveRuleId" filterable placeholder="请选择业绩规则">
|
<el-option
|
v-for="item in achieveRulsList"
|
:key="item.id"
|
:label="item.name"
|
:value="item.id">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
<el-form-item label="会员">
|
<el-input v-model="form.vipQueryKey"></el-input>
|
</el-form-item>
|
|
<el-form-item label="业绩归属人">
|
<el-select v-model="form.beaultId" placeholder="请选择">
|
<el-option v-for="item in achieveUsers"
|
:key="item.suId"
|
:label="item.suName"
|
:value="item.suId"></el-option>
|
</el-select>
|
</el-form-item>
|
|
<el-form-item label="门店">
|
<el-select v-model="form.shopId" placeholder="请选择所属门店">
|
<el-option v-for="item in shopList"
|
:key="item.id"
|
:label="item.shopName"
|
:value="item.id">
|
</el-option>
|
</el-select>
|
</el-form-item>
|
|
<el-button type="primary" @click="search" >搜索</el-button>
|
<el-button @click="resetForm('form')">重置</el-button>
|
<el-button type="warning" @click="exportExcel">导出</el-button>
|
</el-form>
|
|
</el-row>
|
<el-row class="table-style">
|
<el-table :data="tableData" style="width: 100%">
|
<el-table-column type="index" width="30"></el-table-column>
|
<el-table-column prop="datatime" width="150" label="时间"></el-table-column>
|
<el-table-column prop="orderNo" width="180" label="订单编号">
|
<template slot-scope="scope">
|
<el-link @click="jumpOrder(scope.row.orderType, scope.row.orderNo)" type="primary">{{scope.row.orderNo}}</el-link>
|
</template>
|
</el-table-column>
|
<el-table-column prop="orderType" label="订单类型"></el-table-column>
|
<el-table-column prop="vipName" label="会员姓名"></el-table-column>
|
<el-table-column prop="proName" label="产品" width="200"></el-table-column>
|
<el-table-column prop="achieveRuleName" label="业绩规则" width="200"></el-table-column>
|
<el-table-column prop="cateName" label="产品分类"></el-table-column>
|
<el-table-column prop="zkTotal" label="订单金额"></el-table-column>
|
<el-table-column prop="goodsCash" label="现金"></el-table-column>
|
<el-table-column prop="cardCash" label="划扣"></el-table-column>
|
<!-- <el-table-column prop="goodsCash" label="订单业绩"></el-table-column>-->
|
<el-table-column prop="meiliao" label="员工"></el-table-column>
|
<el-table-column v-for="(item, index) in customColumns" width="120" :key="index" :label="item.value">
|
<template slot-scope="scope">
|
<span v-if="item.value == scope.row.achieveType">{{scope.row.goodsCash}}</span>
|
</template>
|
</el-table-column>
|
<el-table-column prop="hisConsume" label="本金消耗"></el-table-column>
|
<el-table-column prop="freeConsume" label="赠送消耗"></el-table-column>
|
<el-table-column prop="projPercentage" label="服务提成"></el-table-column>
|
<el-table-column prop="numberOfPeople" label="人头"></el-table-column>
|
<el-table-column prop="projNum" label="项目个数"></el-table-column>
|
<el-table-column prop="projTime" label="服务时间"></el-table-column>
|
<el-table-column prop="guwen" label="操作人"></el-table-column>
|
<el-table-column prop="shopName" label="门店"></el-table-column>
|
</el-table>
|
<el-row style="margin-top: 10px;">
|
<el-pagination
|
@size-change="handleSizeChange"
|
@current-change="handleCurrentChange"
|
:current-page="page.currentPage"
|
:page-sizes="[10, 20, 30, 50]"
|
:page-size="page.size"
|
layout="total, sizes, prev, pager, next, jumper"
|
:total="page.total">
|
</el-pagination>
|
</el-row>
|
</el-row>
|
</div>
|
<script type="text/javascript" th:src="@{/plugin/layer/layer.js}"></script>
|
<script type="text/javascript" th:src="@{/js/systools/AjaxProxyVue.js}"></script>
|
<script type="text/javascript" th:src="@{/js/plugin/vue.js}"></script>
|
<script type="text/javascript" th:src="@{/plugin/element-ui/index.js}"></script>
|
<script type="text/javascript" th:src="@{/plugin/moment.min.js}"></script>
|
<script type="text/javascript" th:inline="javascript">
|
var vue = new Vue({
|
el : "#app",
|
data : {
|
tableData : [],
|
customColumns : [],
|
achieveRulsList : [],
|
shopList : [],
|
achieveUsers : [],
|
years : [2010, 2011, 2012, 2013, 2014, 2015, 2016, 2017, 2018, 2019, 2020, 2021,2022],
|
months : ["01", "02", "03", "04", "05", "06", "07", "08", "09", "10", "11", "12"],
|
days : [],
|
form : {
|
year : '',
|
month : '',
|
day : '',
|
timeRange : '',
|
vipQueryKey : '',
|
beaultId : '',
|
achieveRuleId : '',
|
shopId : ''
|
},
|
page : {
|
currentPage : 1,
|
size : 10,
|
total : 0
|
}
|
},
|
created : function() {
|
this.initDays();
|
this.queryCustomColumns();
|
this.queryShops();
|
this.queryAchieveUsers();
|
this.getAchieveRule();
|
},
|
methods : {
|
queryTableData () {
|
|
let _this = this;
|
let form = _this.form;
|
let page = _this.page;
|
let params = {};
|
params.year=form.year;
|
params.achieveRuleId=form.achieveRuleId;
|
params.month=form.month;
|
params.year=form.year;
|
params.day=form.day;
|
params.vipQueryKey=form.vipQueryKey;
|
params.beaultId=form.beaultId;
|
params.shopId=form.shopId;
|
params.limit = page.size;
|
params.offset = (page.currentPage - 1) * page.size;
|
|
if (form.timeRange) {
|
params.beginTime = form.timeRange?moment(form.timeRange[0]).format("YYYY-MM-DD HH:mm"):'';
|
params.endTime = form.timeRange?moment(form.timeRange[1]).format("YYYY-MM-DD HH:mm"):'';
|
}
|
|
AjaxProxy.requst({
|
app: _this,
|
data: params,
|
url: basePath + "/admin/achieve/findDailyInfoNew",
|
callback: function (loj) {
|
_this.tableData = loj.rows;
|
_this.page.total = loj.total;
|
}
|
});
|
},
|
queryCustomColumns() {
|
let _this = this;
|
AjaxProxy.requst({
|
app: _this,
|
url: basePath + '/admin/customerDictionary/getListByParentCode/YJLX',
|
callback: function (data) {
|
_this.customColumns = data.rows;
|
_this.queryTableData();
|
}
|
});
|
},
|
/**
|
* 获取规则
|
*/
|
getAchieveRule(){
|
let _this = this;
|
AjaxProxy.requst({
|
app: _this,
|
data: {pageNum:1,pageSize:1000},
|
url: basePath + "/admin/achieveRule/selectList",
|
callback: function (data) {
|
_this.achieveRulsList=data.rows;
|
}
|
});
|
},
|
queryShops() {
|
let _this = this;
|
AjaxProxy.requst({
|
app: _this,
|
url: basePath + '/admin/shopInfo/findAllWithPermi',
|
callback: function (data) {
|
_this.shopList = data.rows;
|
}
|
});
|
},
|
queryAchieveUsers() {
|
let _this = this;
|
AjaxProxy.requst({
|
app: _this,
|
url: basePath + '/admin/getShopStaffByRoleName?roleName=美疗师',
|
callback: function (data) {
|
_this.achieveUsers = data.rows;
|
}
|
});
|
},
|
resetForm(formName) {
|
// this.$refs[formName].resetFields();
|
this.form = {
|
timeRange : '',
|
vipQueryKey : '',
|
beaultId : '',
|
shopId : ''
|
}
|
},
|
search() {
|
this.queryTableData();
|
},
|
handleSizeChange(val) {
|
this.page.size = val;
|
this.queryTableData();
|
},
|
handleCurrentChange(val) {
|
this.page.currentPage = val;
|
this.queryTableData();
|
},
|
initDays() {
|
let _this = this;
|
for (var i = 1; i <= 31 ; i++) {
|
_this.days.push(i);
|
}
|
},
|
getRequestParam() {
|
var form = this.form;
|
var params = form;
|
if (form.timeRange) {
|
params.beginTime = form.timeRange?moment(form.timeRange[0]).format("YYYY-MM-DD HH:mm"):'';
|
params.endTime = form.timeRange?moment(form.timeRange[1]).format("YYYY-MM-DD HH:mm"):'';
|
}
|
return params;
|
},
|
exportExcel() {
|
window.location.href=basePath+"/admin/achieve/exportDailyInfoNew?"+MTools.jsonToUrlParam(this.getRequestParam());
|
},
|
jumpOrder(type, value) {
|
if(type=='服务单') {
|
fnPublci.showServiceOrder(1, value);
|
} else {
|
fnPublci.showOrder(1, value);
|
}
|
}
|
}
|
});
|
</script>
|
</body>
|
</html>
|
