Skip to content

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

boss

parent 24d6b0b1
Hide whitespace changes
Inline Side-by-side
Showing with 70 additions and 26 deletions
src/view/tiip/kanban/Finance.vue
View file @ ff6834b6
......@@ -23,6 +23,7 @@
>div.num{
flex-grow:1;
>div{
font-size:15px;
&:not(:last-child){padding-bottom:4px;}
>span:first-child{
color:#777;
......@@ -48,7 +49,7 @@
<div><span>余额</span><span style="color:#FF6633;">{{v.nCloseAmount||0}}</span></div>
</div>
<XCircle
style="width: 60px;height: 60px;"
style="width: 70px;height: 70px;"
:percent="Number(v.nPercent)||0"
:stroke-width="7"
:stroke-color="color[k%4]"
......@@ -99,7 +100,7 @@ export default {
begin_date:util.dateFormat(this.start,"yyyy-MM-dd"),
end_date:(this.end?util.dateFormat(this.end,"yyyy-MM-dd"):util.dateFormat(new Date,"yyyy-MM-dd"))+' 23:59',
},
},true,{})
},"加载中",{})
if(typeof value=='object'&&value.length>0){
this.list=value
}else{
......
src/view/tiip/kanban/abnormal.vue
View file @ ff6834b6
......@@ -10,6 +10,10 @@
>td{
padding:10px 0;
>div{
height:45px;
display:flex;
justify-content: center;
align-items: center;
background:#fff;
padding:5px 0;
}
......@@ -140,7 +144,7 @@ export default {
begin_date:util.dateFormat(this.start,"yyyy-MM-dd"),
end_date:(this.end?util.dateFormat(this.end,"yyyy-MM-dd"):util.dateFormat(new Date,"yyyy-MM-dd"))+' 23:59',
},
},true,{})
},"加载中",{})
if(typeof value=="object"&&value.length>0){
this.value=value[0]
}else{
......
src/view/tiip/kanban/capital.vue
View file @ ff6834b6
......@@ -2,7 +2,7 @@
.capital{
>div.card{
margin: 15px;
background: rgb(94,154,254);
background: linear-gradient(25deg, var(--color,#5180D4,#5180D4));
padding:15px;
border-radius: 5px;
box-shadow: 2px 2px 3px rgba(94,154,254,0.5);
......@@ -17,7 +17,7 @@
</style>
<template>
<div class="capital" :style="list.length==0&&'background:#fff;height:100%;'">
<div class="card" v-if="list.length>0" v-for="(v,i) in list" :key="i">
<div class="card" v-if="list.length>0" v-for="(v,i) in list" :key="i" :style="{'--color':color[i%6]}">
<div>
<div style="font-size:13px;margin-bottom:14px;">{{v.sName}}</div>
<div style="font-size: 28px;font-weight: 600;">{{Number(v.sValue)||0}}</div>
......@@ -42,6 +42,14 @@ export default{
data(){
return{
list:[],
color:[
"#ff9700, #fe777c",
"#0081ff, #1cbbb4",
"#fe5a9f,#ff5c40",
"#ca2af4,#8850ff",
"#ffd65b,#ff9833",
"#3b83f6, #24c2dd",
],
}
},
watch:{
......@@ -66,7 +74,7 @@ export default{
begin_date:util.dateFormat(this.start,"yyyy-MM-dd"),
end_date:(this.end?util.dateFormat(this.end,"yyyy-MM-dd"):util.dateFormat(new Date,"yyyy-MM-dd"))+' 23:59',
}
},true,{})
},"加载中",{})
if(typeof value=='object'&&value.length>0){
this.list=value.map(v=>{
if(v.sValued==0){
......
src/view/tiip/kanban/index.vue
View file @ ff6834b6
......@@ -11,8 +11,9 @@
>span{
width:calc(100%/5);
text-align: center;
padding: 10px 0;
position:relative;
height: 35px;
line-height: 35px;
&:after{
content:" ";
left:50%;
......@@ -23,39 +24,62 @@
border-radius: 20px;
transition: all 0.3s;
}
&.active:after{
width:100%;
left:0;
&.active{
font-size:15px;
&:after{
width:100%;
left:0;
}
}
}
}
>.date{
flex-shrink: 0;
display: flex;
padding:7px 0;
height: 30px;
>div{
flex-grow:1;
display:flex;
justify-content: space-around;
justify-content: center;
align-items: center;
font-size: 10px;
font-size: 14px;
>.line{
width: 20px;
background: #43B884;
width: 15px;
background: #815EFF;
height: 3px;
border-radius: 50px;
margin: 0 -20px;
margin: 0 5px;
}
}
>span{
>button{
flex-shrink: 0;
padding: 0 10px;
position:relative;
overflow:hidden;
color:#815EFF;
&: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;
}
}
}
>.list{
flex-shrink: 0;
display:flex;
background: #f2f2f2;
color:#679FFE;
>span{
width: calc(100%/5);
text-align: center;
......@@ -87,13 +111,13 @@
<span :class="{active:dateMode==5}" @click="dateSelect(5)">自定义</span>
</div>
<div class="date">
<span v-if="dateMode<5" @click="preDate">前一{{dateMode==1&&'天'||dateMode==2&&'周'||dateMode==3&&'月'||dateMode==4&&'年'}}</span>
<button v-if="dateMode<5" @click="preDate">上一{{dateMode==1&&'天'||dateMode==2&&'周'||dateMode==3&&'月'||dateMode==4&&'年'}}</button>
<div>
<span>{{startDate}}</span>
<span v-show="dateMode>1" class="line" />
<span v-show="dateMode>1">{{endDate}}</span>
</div>
<span v-if="dateMode<5" @click="nextDate">后一{{dateMode==1&&'天'||dateMode==2&&'周'||dateMode==3&&'月'||dateMode==4&&'年'}}</span>
<button v-if="dateMode<5" @click="nextDate">下一{{dateMode==1&&'天'||dateMode==2&&'周'||dateMode==3&&'月'||dateMode==4&&'年'}}</button>
</div>
<div class="list">
<span :class="{active:situation=='operate'}" @click="situation='operate'">运营概况</span>
......@@ -208,10 +232,10 @@ export default {
},
computed:{
startDate(val){
return util.dateFormat(this.DateValue[0],"yyyy-MM-dd")
return util.dateFormat(this.DateValue[0],"yyyy年MM月dd日")
},
endDate(val){
return util.dateFormat(this.DateValue[1],"yyyy-MM-dd");
return util.dateFormat(this.DateValue[1],"yyyy年MM月dd日");
}
},
watch:{
......
src/view/tiip/kanban/operate.vue
View file @ ff6834b6
......@@ -8,14 +8,20 @@
text-align: center;
tr:first-child{
font-size: 13px;
font-weight: bold;
>td{
height:30px;
}
}
tr:not(:first-child){
>td{
padding:5px 0;
padding-bottom:18px;
>div{
background:#fff;
padding:6px 0;
height: 45px;
background: #fff;
padding: 6px 0;
display: flex;
justify-content: center;
align-items: center;
}
&:first-child{
>div{
......@@ -30,6 +36,7 @@
}
}
}
tr:last-child>td{ padding-bottom:30px; }
}
}
</style>
......@@ -94,7 +101,7 @@ export default {
begin_date:util.dateFormat(this.start,"yyyy-MM-dd"),
end_date:(this.end?util.dateFormat(this.end,"yyyy-MM-dd"):util.dateFormat(new Date,"yyyy-MM-dd"))+' 23:59',
},
},true,{})
},"加载中",{})
if(typeof value=='object'&&value.length>0){
this.list=value
}else{
......
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