Skip to content

W
WX_h5
Commit af328873 authored by godwithdh's avatar godwithdh
Browse files
Options

tiip_form

parent 24810931
Hide whitespace changes
Inline Side-by-side
Showing with 233 additions and 120 deletions
src/components/dateMonth.vue 0 → 100644
View file @ af328873
<style lang="less">
#dateMonth{
display: flex;
justify-content: space-between;
align-items: center;
background: #fff;
margin: 10px;
border-radius: 3px;
>button{
padding: 10px;
position:relative;
overflow: hidden;
&:after{
content:" ";
width:0;
height:0;
left:50%;
top:50%;
position:absolute;
background:rgba(50, 125, 255, 0.4);
border-radius: 50%;
transform:translate(-50%,-50%);
}
&:active:after{
transition: all 0.4s;
width:100px;
height:100px;
}
}
}
</style>
<template>
<div id="dateMonth">
<button @click="setMonth(-1)">上个月</button>
<div @click="selectDate">{{month}}</div>
<button @click="setMonth(1)">下个月</button>
</div>
</template>
<script>
import Util from '@/libs/util.js'
import searchComponent from '@/components/search'
import { Datetime } from 'vux'
import { setTimeout } from 'timers';
export default {
name:"dateMonth",
components:{Datetime},
mounted(){
window.mon=this
this.$nextTick(()=>{
var date=new Date()
date.setDate(1)
this.start=new Date(date)
date.setMonth(date.getMonth()+1)
date.setDate(0)
this.end=new Date(date)
this.getMonth()
})
},
data(){
return{
start:"",
end:"",
isShow:false,
}
},
computed:{
month(){
return Util.dateFormat(this.end,"yyyy年MM月")
},
},
methods:{
selectDate(){
this.$vux.datetime.show({
value: Util.dateFormat(this.end,"yyy-MM-dd"), // 其他参数同 props
format:"YYYY-MM",
confirmText:"确认",
cancelText:"取消",
onConfirm:v=>{
var date=new Date(v)
this.start=new Date(date)
date.setMonth(date.getMonth()+1)
date.setDate(0)
this.end=new Date(date)
this.getMonth()
},
})
},
setMonth(val){
this.start.setMonth(this.start.getMonth()+val)
this.start=new Date(this.start)
this.end.setDate(1)
this.end.setMonth(this.end.getMonth()+val+1)
this.end.setDate(0)
this.end=new Date(this.end)
this.getMonth()
},
getMonth(){
this.$emit("month",Util.dateFormat(this.start,"yyyy-MM-dd"),Util.dateFormat(this.end,"yyyy-MM-dd"))
}
},
}
</script>
src/main.js
View file @ af328873
...@@ -19,7 +19,7 @@ import 'babel-polyfill' ...@@ -19,7 +19,7 @@ import 'babel-polyfill'
import echarts from 'echarts' import echarts from 'echarts'
import Calendar from 'vue-mobile-calendar/lib/install.js' import Calendar from 'vue-mobile-calendar/lib/install.js'
import F2 from '@antv/f2'; import F2 from '@antv/f2';
import { ConfirmPlugin,ToastPlugin } from 'vux' import { ConfirmPlugin,ToastPlugin,DatetimePlugin } from 'vux'
import urlFun from './libs/host.js' import urlFun from './libs/host.js'
import Meta from 'vue-meta'; import Meta from 'vue-meta';
...@@ -33,6 +33,7 @@ Vue.use(Http); ...@@ -33,6 +33,7 @@ Vue.use(Http);
Vue.use(Toast) Vue.use(Toast)
Vue.use(ConfirmPlugin); Vue.use(ConfirmPlugin);
Vue.use(ToastPlugin); Vue.use(ToastPlugin);
Vue.use(DatetimePlugin);
Vue.prototype.global = new Vue({}); Vue.prototype.global = new Vue({});
......
src/view/tiip/IntReportForms/Repayment.vue
View file @ af328873
...@@ -48,7 +48,7 @@ ...@@ -48,7 +48,7 @@
</style> </style>
<template> <template>
<div id="repayment"> <div id="repayment">
<searchComponent :search='search' /> <dateMonth @month="searchData"/>
<div class="iCard"> <div class="iCard">
<div class="head"> <div class="head">
<div style="background:#3BA5EF"> <div style="background:#3BA5EF">
...@@ -96,19 +96,14 @@ ...@@ -96,19 +96,14 @@
<script> <script>
import Util from '@/libs/util.js' import Util from '@/libs/util.js'
import { Confirm } from 'vux' import { Confirm } from 'vux'
import searchComponent from '@/components/search' import dateMonth from '@/components/dateMonth'
import { setTimeout } from 'timers'; import { setTimeout } from 'timers';
export default { export default {
name:"repayment", name:"repayment",
components:{searchComponent}, components:{dateMonth},
data(){ data(){
return{ return{
search:{
dBeginDate:Util.dateFormat(new Date(),'yyyy-MM-01'),
dEndDate:Util.dateFormat(new Date(),'yyyy-MM-dd'),
},
value1:{}, value1:{},
value2:[], value2:[],
option:{ option:{
...@@ -149,26 +144,20 @@ export default { ...@@ -149,26 +144,20 @@ export default {
}) })
this.$nextTick(async ()=>{ this.$nextTick(async ()=>{
this.chart=this.$echarts.init(this.$refs.chart) this.chart=this.$echarts.init(this.$refs.chart)
await this.searchData()
})
this.global.$off('searchData');
this.global.$on('searchData',async ()=>{
this.value2=[]
this.value3=[]
await this.searchData()
}) })
}, },
methods:{ methods:{
number(val){ number(val){
return (Math.round((val||0)*100)/100).toLocaleString() return (Math.round((val||0)*100)/100).toLocaleString()
}, },
async searchData(){ async searchData(start,end){
this.value2=[]
this.value3=[]
var value=await this.request("getTiipReceive",{ var value=await this.request("getTiipReceive",{
data:{ data:{
dStartDate:this.search.dBeginDate, dStartDate:start,
dEndDate:this.search.dEndDate dEndDate:end
} }
},"加载中",{}) },"加载中",{})
value.set1[0]&&(this.value1=value.set1[0]) value.set1[0]&&(this.value1=value.set1[0])
......
src/view/tiip/IntReportForms/cost.vue
View file @ af328873
...@@ -21,7 +21,7 @@ ...@@ -21,7 +21,7 @@
</style> </style>
<template> <template>
<div id="cost"> <div id="cost">
<searchComponent :search="search" /> <dateMonth @month="searchData" />
<div class="iCard"> <div class="iCard">
<div class="head">当月总费用进度情况(万)</div> <div class="head">当月总费用进度情况(万)</div>
<div ref="chart1" :style="{height:'220px',opacity:value1.length>0?1:0}"/> <div ref="chart1" :style="{height:'220px',opacity:value1.length>0?1:0}"/>
...@@ -47,16 +47,12 @@ ...@@ -47,16 +47,12 @@
</template> </template>
<script> <script>
import Util from '@/libs/util.js' import Util from '@/libs/util.js'
import searchComponent from '@/components/search' import dateMonth from '@/components/dateMonth'
export default { export default {
name:"cost", name:"cost",
components:{searchComponent}, components:{dateMonth},
data(){ data(){
return{ return{
search:{
dBeginDate:Util.dateFormat(new Date(),'yyyy-MM-01'),
dEndDate:Util.dateFormat(new Date(),'yyyy-MM-dd'),
},
value1:[], value1:[],
chart1:null, chart1:null,
...@@ -73,23 +69,17 @@ export default { ...@@ -73,23 +69,17 @@ export default {
this.chart1=this.$echarts.init(this.$refs.chart1) this.chart1=this.$echarts.init(this.$refs.chart1)
this.chart2=this.$echarts.init(this.$refs.chart2) this.chart2=this.$echarts.init(this.$refs.chart2)
this.chart3=this.$echarts.init(this.$refs.chart3) this.chart3=this.$echarts.init(this.$refs.chart3)
this.searchData()
})
this.global.$off('searchData');
this.global.$on('searchData',async ()=>{
this.value2=[]
this.value3=[]
await this.searchData()
}) })
}, },
methods:{ methods:{
async searchData(){ async searchData(start,end){
this.value2=[]
this.value3=[]
var value=await this.request("getTiipCost",{ var value=await this.request("getTiipCost",{
data:{ data:{
dStartDate:this.search.dBeginDate, dStartDate:start,
dEndDate:this.search.dEndDate, dEndDate:end,
} }
},"加载中",{}) },"加载中",{})
this.value1=value.set1||[] this.value1=value.set1||[]
...@@ -118,7 +108,7 @@ export default { ...@@ -118,7 +108,7 @@ export default {
}, },
legend: { legend: {
data:title, data:title,
x: 'left' x: 'left',
}, },
grid:{ grid:{
left: '2%', // 与容器左侧的距离 left: '2%', // 与容器左侧的距离
......
src/view/tiip/IntReportForms/empAna.vue
View file @ af328873
...@@ -30,7 +30,7 @@ ...@@ -30,7 +30,7 @@
<template> <template>
<div id="empAna"> <div id="empAna">
<div class="HEADER"> <div class="HEADER">
<searchComponent :search="search" /> <dateMonth @month="searchData" />
</div> </div>
<div class="CONTENT"> <div class="CONTENT">
<div class="iCard" ref="chart1"> <div class="iCard" ref="chart1">
...@@ -59,20 +59,20 @@ ...@@ -59,20 +59,20 @@
</template> </template>
<script> <script>
import Util from '@/libs/util.js' import Util from '@/libs/util.js'
import searchComponent from "@/components/search" import dateMonth from '@/components/dateMonth'
import { employees } from '@/view/shopVersion/form/empAna/mixins/employees' import { employees } from '@/view/shopVersion/form/empAna/mixins/employees'
import { receivable } from '@/view/shopVersion/form/empAna/mixins/receivable' import { receivable } from '@/view/shopVersion/form/empAna/mixins/receivable'
import { orderAmount } from '@/view/shopVersion/form/empAna/mixins/orderAmount' import { orderAmount } from '@/view/shopVersion/form/empAna/mixins/orderAmount'
import { setTimeout } from 'timers'; import { setTimeout } from 'timers';
export default { export default {
name:"empAna", name:"empAna",
components:{searchComponent}, components:{dateMonth},
mixins: [employees,receivable,orderAmount], mixins: [employees,receivable,orderAmount],
data(){ data(){
return{ return{
search:{ searchValue:{
dBeginDate:Util.dateFormat(new Date(),"yyyy-MM-01"), dBeginDate:null,
dEndDate:Util.dateFormat(new Date(),"yyyy-MM-dd"), dEndDate:null,
}, },
typeList:{time:true}, typeList:{time:true},
direction:'vertical', direction:'vertical',
...@@ -113,47 +113,77 @@ export default { ...@@ -113,47 +113,77 @@ export default {
this.$nextTick(async ()=>{ this.$nextTick(async ()=>{
this.renderResize(); this.renderResize();
await this.getData(); // await this.getData();
if(this.chartData1.length>0){ // if(this.chartData1.length>0){
await this.renderChart1() // await this.renderChart1()
} // }
if(this.chartData2.length>0){ // if(this.chartData2.length>0){
await this.renderChart2() // await this.renderChart2()
} // }
if(this.chartData3.length>0){ // if(this.chartData3.length>0){
await this.renderChart3() // await this.renderChart3()
} // }
}) })
this.global.$off("searchData"); // this.global.$off("searchData");
this.global.$on("searchData",async ()=>{ // this.global.$on("searchData",async ()=>{
this.chartData1=[] // this.chartData1=[]
this.chartData2=[] // this.chartData2=[]
this.chartData3=[] // this.chartData3=[]
if(this.chartData1.length > 0){ // if(this.chartData1.length > 0){
await this.chart1.destroy(); // await this.chart1.destroy();
} // }
if(this.chartData2.length > 0){ // if(this.chartData2.length > 0){
await this.chart2.destroy(); // await this.chart2.destroy();
} // }
if(this.chartData3.length > 0){ // if(this.chartData3.length > 0){
await this.chart3.destroy(); // await this.chart3.destroy();
} // }
await this.getData(); // await this.getData();
if(this.chartData1.length > 0){ // if(this.chartData1.length > 0){
await this.renderChart1(); // await this.renderChart1();
} // }
if(this.chartData2.length > 0){ // if(this.chartData2.length > 0){
await this.renderChart2(); // await this.renderChart2();
} // }
if(this.chartData3.length > 0){ // if(this.chartData3.length > 0){
await this.renderChart3(); // await this.renderChart3();
} // }
}); // });
}, },
methods:{ methods:{
searchData(start,end){
this.searchValue.dBeginDate=start
this.searchValue.dEndDate=end
this.$nextTick(async ()=>{
this.chartData1=[]
this.chartData2=[]
this.chartData3=[]
if(this.chartData1.length > 0){
await this.chart1.destroy();
}
if(this.chartData2.length > 0){
await this.chart2.destroy();
}
if(this.chartData3.length > 0){
await this.chart3.destroy();
}
await this.getData();
if(this.chartData1.length > 0){
await this.renderChart1();
}
if(this.chartData2.length > 0){
await this.renderChart2();
}
if(this.chartData3.length > 0){
await this.renderChart3();
}
})
},
renderResize(){ renderResize(){
let width = document.documentElement.clientWidth; let width = document.documentElement.clientWidth;
let height = document.documentElement.clientHeight; let height = document.documentElement.clientHeight;
...@@ -166,8 +196,8 @@ export default { ...@@ -166,8 +196,8 @@ export default {
async getData(){ async getData(){
var res=await this.request("getTiipSalesinfo",{ var res=await this.request("getTiipSalesinfo",{
data:{ data:{
dStartDate:this.search.dBeginDate, dStartDate:this.searchValue.dBeginDate,
dEndDate:this.search.dEndDate, dEndDate:this.searchValue.dEndDate,
} }
},"加载中",{}) },"加载中",{})
if(res.set1.length>0){ if(res.set1.length>0){
......
src/view/tiip/IntReportForms/revenue.vue
View file @ af328873
...@@ -53,7 +53,7 @@ ...@@ -53,7 +53,7 @@
<tab-item :selected="tabIndex=='getTiipReceiveinfo'" @on-item-click="tabIndex='getTiipReceiveinfo'">收入</tab-item> <tab-item :selected="tabIndex=='getTiipReceiveinfo'" @on-item-click="tabIndex='getTiipReceiveinfo'">收入</tab-item>
<tab-item :selected="tabIndex=='getTiipPayinfo'" @on-item-click="tabIndex='getTiipPayinfo'">支出</tab-item> <tab-item :selected="tabIndex=='getTiipPayinfo'" @on-item-click="tabIndex='getTiipPayinfo'">支出</tab-item>
</tab> </tab>
<searchComponent :search='search' /> <dateMonth @month="searchData"/>
<div class="iCard" style="margin-bottom:8px;"> <div class="iCard" style="margin-bottom:8px;">
<div ref='chart' style="width:100%;height:150px;"/> <div ref='chart' style="width:100%;height:150px;"/>
<table class="DATA"> <table class="DATA">
...@@ -76,20 +76,19 @@ ...@@ -76,20 +76,19 @@
<script> <script>
import Util from '@/libs/util.js' import Util from '@/libs/util.js'
import { Confirm } from 'vux' import { Confirm } from 'vux'
import searchComponent from '@/components/search' import dateMonth from '@/components/dateMonth'
import { Tab, TabItem } from 'vux' import { Tab, TabItem } from 'vux'
export default { export default {
name:"revenue", name:"revenue",
components:{searchComponent,Tab,TabItem}, components:{dateMonth,Tab,TabItem},
data(){ data(){
return{ return{
tabIndex:"getTiipReceiveinfo", tabIndex:"getTiipReceiveinfo",
search:{ dateValue:{
dBeginDate:Util.dateFormat(new Date(),'yyyy-MM-01'), start:"",
dEndDate:Util.dateFormat(new Date(),'yyyy-MM-dd'), end:""
}, },
chart:null, chart:null,
list:[], list:[],
colorList:[], colorList:[],
...@@ -100,12 +99,6 @@ export default { ...@@ -100,12 +99,6 @@ export default {
mounted(){ mounted(){
this.$nextTick(()=>{ this.$nextTick(()=>{
this.init() this.init()
this.searchData()
})
this.global.$off('searchData');
this.global.$on('searchData',()=>{
this.searchData()
}) })
}, },
methods:{ methods:{
...@@ -119,11 +112,16 @@ export default { ...@@ -119,11 +112,16 @@ export default {
} }
}) })
}, },
async searchData(){ async searchData(start,end){
this.dateValue={
start:start,
end:end
}
var value=await this.request(this.tabIndex,{ var value=await this.request(this.tabIndex,{
data:{ data:{
dStartDate:this.search.dBeginDate, dStartDate:start,
dEndDate:this.search.dEndDate dEndDate:end
} }
},"加载中",{}) },"加载中",{})
if(this.tabIndex=="getTiipReceiveinfo"){ if(this.tabIndex=="getTiipReceiveinfo"){
...@@ -211,7 +209,7 @@ export default { ...@@ -211,7 +209,7 @@ export default {
}, },
watch:{ watch:{
tabIndex(){ tabIndex(){
this.searchData() this.searchData(this.dateValue.start,this.dateValue.end)
}, },
}, },
} }
......
src/view/tiip/IntReportForms/salesStatistics.vue
View file @ af328873
...@@ -61,7 +61,7 @@ ...@@ -61,7 +61,7 @@
</style> </style>
<template> <template>
<div id="statistics"> <div id="statistics">
<searchComponent :search='search' /> <dateMonth @month="searchData" />
<div class="Content"> <div class="Content">
<div class='double'> <div class='double'>
<div class="card"> <div class="card">
...@@ -105,7 +105,7 @@ ...@@ -105,7 +105,7 @@
</template> </template>
<script> <script>
import Util from '@/libs/util.js' import Util from '@/libs/util.js'
import searchComponent from '@/components/search' import dateMonth from '@/components/dateMonth'
import { Confirm } from 'vux' import { Confirm } from 'vux'
import { clearTimeout, setTimeout } from 'timers'; import { clearTimeout, setTimeout } from 'timers';
import { toUnicode } from 'punycode'; import { toUnicode } from 'punycode';
...@@ -113,13 +113,13 @@ import echarts from 'echarts'; ...@@ -113,13 +113,13 @@ import echarts from 'echarts';
export default { export default {
name:"salesStatistics", name:"salesStatistics",
components:{searchComponent}, components:{dateMonth},
data(){ data(){
return{ return{
search:{ // search:{
dBeginDate:Util.dateFormat(new Date(),'yyyy-MM-01'), // dBeginDate:Util.dateFormat(new Date(),'yyyy-MM-01'),
dEndDate:Util.dateFormat(new Date(),'yyyy-MM-dd'), // dEndDate:Util.dateFormat(new Date(),'yyyy-MM-dd'),
}, // },
chartData:{ chartData:{
nOrderSameRatio:0, nOrderSameRatio:0,
nOrderRingRatio:0, nOrderRingRatio:0,
...@@ -167,14 +167,14 @@ export default { ...@@ -167,14 +167,14 @@ export default {
this.resize(this.chart6,1.35) this.resize(this.chart6,1.35)
}) })
}) })
this.$nextTick(()=>{ // this.$nextTick(()=>{
this.searchData(); // this.searchData();
}) // })
this.global.$off('searchData'); // this.global.$off('searchData');
this.global.$on('searchData',()=>{ // this.global.$on('searchData',()=>{
this.searchData() // this.searchData()
}) // })
}, },
methods:{ methods:{
createChart(name,kield,isLinstener){ createChart(name,kield,isLinstener){
...@@ -225,15 +225,15 @@ export default { ...@@ -225,15 +225,15 @@ export default {
chart.resize() chart.resize()
}, },
async searchData(){//搜索数据 async searchData(start,end){//搜索数据
await this.getChartData() await this.getChartData(start,end)
this.showValue() this.showValue()
}, },
async getChartData(){ async getChartData(start,end){
var value =await this.request('getTiipSellinfo',{ var value =await this.request('getTiipSellinfo',{
params:{ params:{
dStartDate:this.search.dBeginDate, dStartDate:start,
dEndDate:this.search.dEndDate dEndDate:end
} }
},"加载中",{iProjectId:this.iProjectId}) },"加载中",{iProjectId:this.iProjectId})
Object.assign(this.chartData,{ Object.assign(this.chartData,{
......
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