|  |  |  | 
|---|
|  |  |  | <!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> | 
|---|
|  |  |  | <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 { | 
|---|
|  |  |  | 
|---|
|  |  |  | <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-select v-model="form.year" style="width:120px;" placeholder="请选择年份"> | 
|---|
|  |  |  | <el-option v-for="item in years" | 
|---|
|  |  |  | :key="item" | 
|---|
|  |  |  | :label="item" | 
|---|
|  |  |  | 
|---|
|  |  |  | </el-select> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item> | 
|---|
|  |  |  | <el-select v-model="form.month" style="width:120px;" placeholder="请选择"> | 
|---|
|  |  |  | <el-select v-model="form.month" style="width:120px;" placeholder="请选择月份"> | 
|---|
|  |  |  | <el-option v-for="item in months" | 
|---|
|  |  |  | :key="item" | 
|---|
|  |  |  | :label="item" | 
|---|
|  |  |  | 
|---|
|  |  |  | </el-select> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | <el-form-item> | 
|---|
|  |  |  | <el-select v-model="form.day" style="width:120px;" placeholder="请选择"> | 
|---|
|  |  |  | <el-select v-model="form.day" style="width:120px;" placeholder="请选择日"> | 
|---|
|  |  |  | <el-option v-for="item in days" | 
|---|
|  |  |  | :key="item" | 
|---|
|  |  |  | :label="item" | 
|---|
|  |  |  | 
|---|
|  |  |  | 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.shopId" placeholder="请选择所属门店"> | 
|---|
|  |  |  | <el-option v-for="item in shopList" | 
|---|
|  |  |  | :key="item.id" | 
|---|
|  |  |  | :label="item.shopName" | 
|---|
|  |  |  | :value="item.id"> | 
|---|
|  |  |  | :key="item.id" | 
|---|
|  |  |  | :label="item.shopName" | 
|---|
|  |  |  | :value="item.id"> | 
|---|
|  |  |  | </el-option> | 
|---|
|  |  |  | </el-select> | 
|---|
|  |  |  | </el-form-item> | 
|---|
|  |  |  | 
|---|
|  |  |  |  | 
|---|
|  |  |  | </el-row> | 
|---|
|  |  |  | <el-row class="table-style"> | 
|---|
|  |  |  | <el-table :data="tableData" | 
|---|
|  |  |  | :height="height" | 
|---|
|  |  |  | style="width: 100%"> | 
|---|
|  |  |  | <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="订单编号"> | 
|---|
|  |  |  | 
|---|
|  |  |  | <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="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"> | 
|---|
|  |  |  | 
|---|
|  |  |  | <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:src="@{/js/systools/MJsBase.js}"></script> | 
|---|
|  |  |  | <script type="text/javascript" th:inline="javascript"> | 
|---|
|  |  |  | var vue = new Vue({ | 
|---|
|  |  |  | el : "#app", | 
|---|
|  |  |  | data : { | 
|---|
|  |  |  | tableData : [], | 
|---|
|  |  |  | customColumns : [], | 
|---|
|  |  |  | achieveRulsList : [], | 
|---|
|  |  |  | shopList : [], | 
|---|
|  |  |  | achieveUsers : [], | 
|---|
|  |  |  | height:'calc(100vh - 240px)', | 
|---|
|  |  |  | years : [2010, 2011, 2012, 2013, 2014, 2015, 2016, 2017, 2018, 2019, 2020, 2021], | 
|---|
|  |  |  | 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 : { | 
|---|
|  |  |  | 
|---|
|  |  |  | timeRange : '', | 
|---|
|  |  |  | vipQueryKey : '', | 
|---|
|  |  |  | beaultId : '', | 
|---|
|  |  |  | achieveRuleId : '', | 
|---|
|  |  |  | shopId : '' | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | page : { | 
|---|
|  |  |  | 
|---|
|  |  |  | this.queryCustomColumns(); | 
|---|
|  |  |  | this.queryShops(); | 
|---|
|  |  |  | this.queryAchieveUsers(); | 
|---|
|  |  |  | this.getAchieveRule(); | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | methods : { | 
|---|
|  |  |  | queryTableData () { | 
|---|
|  |  |  |  | 
|---|
|  |  |  | let _this = this; | 
|---|
|  |  |  | var form = _this.form; | 
|---|
|  |  |  | var page = _this.page; | 
|---|
|  |  |  | var params = _this.form; | 
|---|
|  |  |  | 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; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | 
|---|
|  |  |  | 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({ | 
|---|
|  |  |  | p:params | 
|---|
|  |  |  | }).invoke(basePath + "/admin/achieve/findDailyInfoNew", function (loj) { | 
|---|
|  |  |  | _this.tableData = loj.getValue("rows"); | 
|---|
|  |  |  | _this.page.total = loj.getResult().total; | 
|---|
|  |  |  |  | 
|---|
|  |  |  | AjaxProxy.requst({ | 
|---|
|  |  |  | app: _this, | 
|---|
|  |  |  | data: params, | 
|---|
|  |  |  | url: basePath + "/admin/achieve/findDailyInfoNew", | 
|---|
|  |  |  | callback: function (loj) { | 
|---|
|  |  |  | _this.tableData = loj.rows; | 
|---|
|  |  |  | _this.page.total = loj.total; | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }); | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | queryCustomColumns() { | 
|---|
|  |  |  | 
|---|
|  |  |  | } | 
|---|
|  |  |  | }); | 
|---|
|  |  |  | }, | 
|---|
|  |  |  | /** | 
|---|
|  |  |  | * 获取规则 | 
|---|
|  |  |  | */ | 
|---|
|  |  |  | 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({ | 
|---|