Commit 71e38278 authored by daywrite's avatar daywrite

统计分析增加查询条件

parent 76babba5
......@@ -12,4 +12,54 @@
font-size: 1.3em;
color: #649fd7;
}
.single {
& .el-radio-button__inner, .el-radio-button:last-child .el-radio-button__inner, .el-radio-button:first-child .el-radio-button__inner{
border-left: 1px solid #DCDFE6;
margin: 0 10px 5px 0;
border-radius: 3px;
}
& .el-radio-button__inner:hover{
color: #333;
background-color: #e6e6e6;
border-color: #adadad;
}
& .el-radio-button__orig-radio:checked+.el-radio-button__inner{
color: #fff;
background-color: #3c3c3c;
border-color: #373737;
box-shadow: 0 0 0 0 #373737;
}
& .el-radio-button__orig-radio:checked+.el-radio-button__inner:hover{
color: #333;
background-color: #d4d4d4;
border-color: #8c8c8c;
}
}
.mb10 {
margin-bottom:10px;
}
.el-radio-button__inner, .el-radio-button:last-child .el-radio-button__inner, .el-radio-button:first-child .el-radio-button__inner{
border-left: 1px solid #DCDFE6;
margin: 0 2px 0 0;
border-radius: 3px;
}
.el-radio-button__inner:hover{
color: #333;
background-color: #e6e6e6;
border-color: #adadad;
}
.el-radio-button__orig-radio:checked+.el-radio-button__inner{
color: #fff;
background-color: #17a2b8;
border-color: #17a2b8;
box-shadow: 0 0 0 0 #17a2b8;
}
.el-radio-button__orig-radio:checked+.el-radio-button__inner:hover{
color: #333;
background-color: #d4d4d4;
border-color: #8c8c8c;
}
.ec-page-wrapper .el-form-item__label {
color: white;
}
}
<template>
<section>
<div class="content">
<search-header
ref="searchHeader"
:title="'销售数据'"
@update:headerClear="() => searchClear()">
</search-header>
<time-search-form
<search-form
ref="timeSearchForm"
formSearchKey="projectSearch"
@update:list="search => timeSearchForm(search)">
</time-search-form>
<search-form
ref="clientForm"
:filter="filter"
@update:clientList="form =>{ updateForm(form) }">
@update:form="search => timeSearchForm(search)">
</search-form>
<div class="page-body-content">
<div class="mb10">
......@@ -78,9 +69,8 @@
<script>
import SearchHeader from '../../common/searchHeader'
import SearchForm from '../../common/SearchForm'
import countArr from './countArr'
import TimeSearchForm from './timeSearchForm'
import SearchForm from './searchForm'
import singleRadioTool from '../../common/singleRadioTool'
import individualContributions from './individualContributions.js'
import salesAchievements from './salesAchievements.js'
......@@ -97,7 +87,6 @@ export default {
components: {
SearchHeader,
SearchForm,
TimeSearchForm,
singleRadioTool,
countArr
},
......@@ -119,14 +108,21 @@ export default {
this.init()
},
// computed: {
// userArr () {
// let _ret = this.filter.find(item => item.key === 'dataUserId')
// return _ret && _ret.value
// }
// },
methods: {
init () {
this.getFilter()
this.getSalesChart()
// this.getSalesChart()
},
getSalesChart () {
requestAPI(api.getSalesChart, {})
getSalesChart (params) {
requestAPI(api.getSalesChart, params)
.then(res => {
this.result.countList = res.counts
this.c1(res.chars['individualContributions'])
......@@ -150,21 +146,11 @@ export default {
getFilter () {
requestAPI(api.getFilterSalesChart).then(res => {
this.filter = res
// let _inx = res.findIndex(item => item.key === 'CaseSearch[case_status]')
// let _newRes = res.splice(_inx, 1)
// this.filter = res
// let _navArray = _newRes[0].value
// _navArray.unshift({key: 'all', name: '全部'})
// this.navArray = _navArray
})
},
typeChange (val) {
let ret = this.setParams({
...this.form,
page: this.pagenation.thispage
}, { 'CaseSearch[case_status]': val })
this.getList(ret)
this.getSalesChart(val)
},
// 3.2关键字后面的重置
......@@ -182,11 +168,7 @@ export default {
// 5.3 TimeSearchForm
timeSearchForm (search) {
let ret = this.setParams({
...this.form,
page: this.pagenation.thispage
}, search)
this.getList(ret)
this.getSalesChart(search)
}
}
......
......@@ -14,8 +14,11 @@ export default {
text: ''
},
xAxis: {
type: 'category',
gridLineWidth: 1
type: 'category',
gridLineWidth: 1,
labels: {
useHTML:true
}
},
yAxis: {
title: {
......@@ -55,7 +58,7 @@ export default {
colorByPoint: true,
data: _data.series_data
// data: [{
// name: '刘人诚',
// name: '<div class="text-center"><img src="/files/cdn/a57be577deb434/avatar/9f73cfbd-bae6-3b50-b7ac-61b936c40727.png" class="chart-avatar img-circle" /><br/>刘人诚</div>',
// y: 1997600,
// drilldown: '刘人诚'
// }, {
......
......@@ -70,7 +70,6 @@ export default {
// enabled: true,
color: (Highcharts.theme && Highcharts.theme.dataLabelsColor) || 'white',
style: {
// 如果不需要数据标签阴影,可以将 textOutline 设置为 'none'
textOutline: '1px 1px black'
}
}
......@@ -78,18 +77,12 @@ export default {
},
series: [{
name: '北京方太国际有限公司',
projectName: '测试App功能',
money: '493500元',
data: [493500]
}, {
name: '北京方太国际有限公司',
projectName: '测试App功能',
money: '493500元',
data: [493500]
}, {
name: '上海假冒国际有限公司',
projectName: '测试App功能',
money: '493500元',
data: [9988000, 7834479.11]
}]
});
......
<template>
<section class="analysis-client">
<el-row :gutter="10" class="header-title">
<el-col :span="4">
<h2>销售数据</h2>
</el-col>
<el-col :span="20">
<el-form ref="form" size="mini">
<el-col :span="6" :xs="24">
<el-form-item label=" " label-width="42">
<el-radio-group v-model="form.period" size="mini" @change="periodChangeEvent">
<el-radio-button label="thisweek">本周</el-radio-button>
<el-radio-button label="lastweek">上周</el-radio-button>
<el-radio-button label="thismonth">本月</el-radio-button>
<el-radio-button label="lastmonth">上月</el-radio-button>
</el-radio-group>
<el-button-group>
<el-button type="primary" size="mini" :class="setYearClass" @click="triggerYear">{{setYearText}}
</el-button>
<el-dropdown size="small" placement="bottom-start" @command="handleCommand" trigger="click">
<el-button type="primary" size="mini" icon="el-icon-caret-bottom" class="trigger-year yearClass"></el-button>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item :command="year.value" v-for="(year, key) in perYears" :key="key">{{year.name}}
</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</el-button-group>
</el-form-item>
</el-col>
</el-form>
<el-form ref="clientTimeRange" size="mini">
<el-col :span="10" :offset="0" :xs="{span: 24, offset: 0}" class="form-content-time-range">
<el-form-item label-width="0">
<el-date-picker
size="mini"
v-model="form.from"
type="date"
value-format="yyyy-MM-dd"
placeholder="开始时间">
</el-date-picker>
<el-date-picker
size="mini"
v-model="form.to"
type="date"
value-format="yyyy-MM-dd"
placeholder="结束时间">
</el-date-picker>
<el-button type="primary" size="mini" class="head-date-button" @click="setSearchTime">确定</el-button>
</el-form-item>
</el-col>
</el-form>
<el-form ref="clientForm" size="mini" label-width="0" label-position="top">
<el-col :span="4">
<el-form-item>
<el-select v-model="form.dataUserId">
<el-option v-for="sItem in userArr"
:key="sItem.key"
:label="sItem.name"
:value="sItem.key"></el-option>
</el-select>
</el-form-item>
</el-col>
</el-form>
</el-col>
</el-row>
</section>
</template>
<script>
let checkDate = () => {
let setTimeFormat = (date) => {
let myYear = date.getFullYear()
let myMonth = date.getMonth() + 1
let myWeekday = date.getDate()
if (myMonth < 10) {
myMonth = '0' + myMonth
}
if (myWeekday < 10) {
myWeekday = '0' + myWeekday
}
return (myYear + '-' + myMonth + '-' + myWeekday)
}
let now = new Date() // 当前日期
let nowDayOfWeek = now.getDay() // 今天本周的第几天
let nowDay = now.getDate() // 当前日
let nowMonth = now.getMonth() // 当前月
let nowYear = now.getFullYear() // 当前年
return {
startWeek: setTimeFormat(new Date(nowYear, nowMonth, nowDay - nowDayOfWeek)),
endWeek: setTimeFormat(new Date(nowYear, nowMonth, nowDay + (6 - nowDayOfWeek))),
beforeStartWeek: setTimeFormat(new Date(nowYear, nowMonth, nowDay - nowDayOfWeek - 7)),
beforeEndWeek: setTimeFormat(new Date(nowYear, nowMonth, nowDay - nowDayOfWeek - 1)),
startMonth: setTimeFormat(new Date(nowYear, nowMonth, 1)),
endMonth: setTimeFormat(new Date(nowYear, nowMonth + 1, 0)),
beforeStartMonth: setTimeFormat(new Date(nowYear, nowMonth - 1, 1)),
beforeEndMonth: setTimeFormat(new Date(nowYear, nowMonth, 0))
}
}
const perYears = [
{
name: '本财年',
value: 'currentfascalyear'
},
{
name: '2017年',
value: 'year2017'
},
{
name: '2018年',
value: 'year2018'
},
{
name: '2019年',
value: 'year2019'
}
]
export default {
name: 'timeSearchForm',
props: ['filter'],
data () {
return {
form: {
from: '',
to: '',
period: '',
dataUserId: ''
},
perYears,
checkYear: 'currentfascalyear',
checkDate: checkDate()
}
},
created () {
},
computed: {
userArr () {
let _ret = this.filter
if (_ret && _ret.length !== 0) {
let _userArr = _ret.filter.find(item => item.key === 'dataUserId').value
this.form.dataUserId = _userArr[0].key
return _userArr
} else {
return []
}
},
setYearText () {
let year = this.perYears.find(i => i.value === this.checkYear)
if (year) {
return year.name
} else {
return '本财年'
}
},
setYearClass () {
if (this.form.period === '' && this.checkYear !== '') {
return 'check-year'
} else {
return ''
}
}
},
methods: {
triggerYear () {
if (this.checkYear === '') {
this.checkYear = 'currentfascalyear'
this.form.period = ''
this.setFullYear(new Date().getFullYear())
let _val = JSON.parse(JSON.stringify(this.form))
if (this.checkYear !== '') {
_val.period = this.checkYear
}
this.$emit('update:form', _val)
}
},
handleCommand (command) {
this.checkYear = command
this.form.period = ''
if (command === 'currentfascalyear') {
this.setFullYear(new Date().getFullYear())
} else {
this.setFullYear(command.replace(/[^0-9]/ig, ''))
}
let _val = JSON.parse(JSON.stringify(this.form))
if (this.checkYear !== '') {
_val.period = this.checkYear
}
this.$emit('update:form', _val)
},
setFullYear (year) {
let d = new Date()
d.setFullYear(year)
this.form.from = d.getFullYear() + '-01-01'
this.form.to = d.getFullYear() + '-12-31'
},
periodChangeEvent (val) {
this.checkYear = ''
debugger
if (val === 'thisweek') {
this.form.from = this.checkDate.startWeek
this.form.to = this.checkDate.endWeek
} else if (val === 'lastweek') {
this.form.from = this.checkDate.beforeStartWeek
this.form.to = this.checkDate.beforeEndWeek
} else if (val === 'thismonth') {
this.form.from = this.checkDate.startMonth
this.form.to = this.checkDate.endMonth
} else if (val === 'lastmonth') {
this.form.from = this.checkDate.beforeStartMonth
this.form.to = this.checkDate.beforeEndMonth
}
},
setSearchTime () {}
},
watch: {
'form': {
handler (val) {
let _val = JSON.parse(JSON.stringify(val))
if (this.checkYear !== '') {
_val.period = this.checkYear
}
this.$emit('update:form', _val)
},
deep: true,
immediate: true
}
}
}
</script>
<style scoped>
.form-content-time-top {
background: #FFF;
}
.form-content-time-top .el-form-item {
margin: 7px 0 9px;
}
.form-content-time-top .el-col {
padding: 0 15px;
}
.el-dropdown {
top: -1px;
}
.analysis-client .el-button-group > .el-button {
color: #333;
background-color: #fff;
border: 1px solid #ccc;
}
.analysis-client .el-dropdown > .el-button {
padding-left: 6px;
padding-right: 6px;
border-left-width: 1px;
border-left-color: #ccc;
}
.analysis-client .trigger-year {
color: #333;
background-color: #fff;
border-color: #ccc;
border-right: 1px solid #ccc !important;
}
.analysis-client .head-date-button {
color: #fff;
background-color: #333744;
border-color: #282b35;
}
.analysis-client .check-year {
color: #fff !important;
background-color: #17a2b8 !important;
border-color: #17a2b8 !important;
}
</style>
<template>
<section>
<el-row class="form-content-time-top">
<el-form ref="clientTimeForm" :model="clientTimeForm" size="mini">
<el-col :span="8" :xs="24">
<el-form-item label="提交时间:" label-width="42">
<el-radio-group v-model="clientTimeForm[formSearchKey + '[period]']" size="mini">
<el-radio-button label="all">本周</el-radio-button>
<el-radio-button label="today">上周</el-radio-button>
<el-radio-button label="tomorrow">本月</el-radio-button>
<el-radio-button label="aftertomorrow">上月</el-radio-button>
</el-radio-group>
<el-dropdown>
<el-button type="primary" size="mini">
本财年<i class="el-icon-arrow-down el-icon--right"></i>
</el-button>
<el-dropdown-menu slot="dropdown">
<el-dropdown-item>2017年</el-dropdown-item>
<el-dropdown-item>2018年</el-dropdown-item>
<el-dropdown-item>2019年</el-dropdown-item>
</el-dropdown-menu>
</el-dropdown>
</el-form-item>
</el-col>
</el-form>
<el-form ref="clientTimeRange" :model="clientTimeRange" size="mini">
<el-col :span="8" :offset="0" :xs="{span: 24, offset: 0}" class="form-content-time-range">
<el-form-item label-width="0">
<el-date-picker
size="mini"
v-model="clientTimeRange.from"
type="date"
value-format="yyyy-MM-dd"
placeholder="开始时间">
</el-date-picker>
<el-date-picker
size="mini"
v-model="clientTimeRange.to"
type="date"
value-format="yyyy-MM-dd"
placeholder="结束时间">
</el-date-picker>
<el-button type="primary" size="mini" @click="setSearchTime">确定</el-button>
</el-form-item>
</el-col>
</el-form>
</el-row>
</section>
</template>
<script>
import setParams from '../../common/setParams'
export default {
name: 'timeSearchForm',
mixins: [setParams],
props: ['formSearchKey'],
data () {
return {
clientTimeForm: {},
clientTimeRange: {
from: '',
to: ''
}
}
},
created () {
this.initParams()
this.init()
},
methods: {
init () {
this.$watch('clientTimeForm', (val) => {
let perid = val[this.formSearchKey + '[period]']
this.$emit('update:list', Object.assign({}, {[this.formSearchKey + '[period]']: perid}))
}, {deep: true})
},
initParams () {
this.setInitParams((ret) => {
this.$set(this.clientTimeForm, this.formSearchKey + '[period]', ret[this.formSearchKey + '[period]'] || 'all')
this.clientTimeRange.from = ret[this.formSearchKey + '[from]'] || ''
this.clientTimeRange.to = ret[this.formSearchKey + '[to]'] || ''
})
},
resetForm () {
this.clientTimeForm[this.formSearchKey + '[period]'] = 'all'
this.clientTimeRange.from = ''
this.clientTimeRange.to = ''
},
setSearchTime () {
let from = this.clientTimeRange.from
let to = this.clientTimeRange.to
this.$emit('update:list', Object.assign({}, {
[this.formSearchKey + '[from]']: from,
[this.formSearchKey + '[to]']: to
}, this.clientTimeForm))
}
},
watch: {
'formSearchKey': {
handler (val) {
this.$set(this.clientTimeForm, val + '[period]', 'all')
},
immediate: true
},
'clientTimeRange.from' (val) {
if (new Date(val) >= new Date(this.clientTimeRange.to)) {
this.clientTimeRange.to = val
}
},
'clientTimeRange.to' (val) {
if (new Date(val) <= new Date(this.clientTimeRange.from)) {
this.clientTimeRange.from = val
}
}
}
}
</script>
<style scoped>
.form-content-time-top {
background: #FFF;
}
.form-content-time-top .el-form-item {
margin: 7px 0 9px;
}
.form-content-time-top .el-col {
padding: 0 15px;
}
</style>
......@@ -41,7 +41,7 @@
import SearchHeader from '../../common/searchHeader'
import SearchForm from '../../common/SearchForm'
import countArr from '../analysis/countArr'
import TimeSearchForm from '../analysis/timeSearchForm'
import TimeSearchForm from '../analysis/searchForm'
import singleRadioTool from '../../common/singleRadioTool'
import preSalesAnalyze from '../pre-sales-analyze/preSalesAnalyze.js'
import {
......
......@@ -41,7 +41,7 @@
import SearchHeader from '../../common/searchHeader'
import SearchForm from '../../common/SearchForm'
import countArr from '../analysis/countArr'
import TimeSearchForm from '../analysis/timeSearchForm'
import TimeSearchForm from '../analysis/searchForm'
import singleRadioTool from '../../common/singleRadioTool'
import preSalesAnalyze from './preSalesAnalyze.js'
import {
......
......@@ -51,7 +51,7 @@
import SearchHeader from '../../common/searchHeader'
import SearchForm from '../../common/SearchForm'
import countArr from '../analysis/countArr'
import TimeSearchForm from '../analysis/timeSearchForm'
import TimeSearchForm from '../analysis/searchForm'
import singleRadioTool from '../../common/singleRadioTool'
import preSales from './preSales.js'
import {
......
......@@ -41,7 +41,7 @@
import SearchHeader from '../../common/searchHeader'
import SearchForm from '../../common/SearchForm'
import countArr from '../analysis/countArr'
import TimeSearchForm from '../analysis/timeSearchForm'
import TimeSearchForm from '../analysis/searchForm'
import singleRadioTool from '../../common/singleRadioTool'
import salesGoal from './salesGoal.js'
import {
......
......@@ -41,7 +41,7 @@
import SearchHeader from '../../common/searchHeader'
import SearchForm from '../../common/SearchForm'
import countArr from '../analysis/countArr'
import TimeSearchForm from '../analysis/timeSearchForm'
import TimeSearchForm from '../analysis/searchForm'
import singleRadioTool from '../../common/singleRadioTool'
import dataArchiveProfit from './dataArchiveProfit.js'
import {
......
This source diff could not be displayed because it is too large. You can view the blob instead.
This diff is collapsed.
This diff is collapsed.
This diff is collapsed.
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