Commit 6757bebd authored by 张锡奇's avatar 张锡奇
parents 1412962b 564d0795
...@@ -109,7 +109,7 @@ let routes = [ ...@@ -109,7 +109,7 @@ let routes = [
{ {
path:"/kanban/:userId", path:"/kanban/:userId",
name:"kanban", name:"kanban",
component:()=>import("@/view/kanban/index.vue"), component:()=>import("@/view/tiip/kanban/index.vue"),
meta:{ meta:{
title:"老板看板" title:"老板看板"
} }
......
...@@ -23,6 +23,7 @@ ...@@ -23,6 +23,7 @@
>div.num{ >div.num{
flex-grow:1; flex-grow:1;
>div{ >div{
font-size:15px;
&:not(:last-child){padding-bottom:4px;} &:not(:last-child){padding-bottom:4px;}
>span:first-child{ >span:first-child{
color:#777; color:#777;
...@@ -48,7 +49,7 @@ ...@@ -48,7 +49,7 @@
<div><span>余额</span><span style="color:#FF6633;">{{v.nCloseAmount||0}}</span></div> <div><span>余额</span><span style="color:#FF6633;">{{v.nCloseAmount||0}}</span></div>
</div> </div>
<XCircle <XCircle
style="width: 60px;height: 60px;" style="width: 70px;height: 70px;"
:percent="Number(v.nPercent)||0" :percent="Number(v.nPercent)||0"
:stroke-width="7" :stroke-width="7"
:stroke-color="color[k%4]" :stroke-color="color[k%4]"
...@@ -94,12 +95,12 @@ export default { ...@@ -94,12 +95,12 @@ export default {
methods:{ methods:{
async search(){ async search(){
var value=await this.request("getBoss",{ var value=await this.request("getBoss",{
data:[{key:"url",value:"Financial Summary"}], data:[
params:{ {key:"url",value:"Financial Summary"},
begin_date:util.dateFormat(this.start,"yyyy-MM-dd"), {key:"begin_date",value: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', {key:"end_date",value:(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){ if(typeof value=='object'&&value.length>0){
this.list=value this.list=value
}else{ }else{
......
...@@ -10,8 +10,12 @@ ...@@ -10,8 +10,12 @@
>td{ >td{
padding:10px 0; padding:10px 0;
>div{ >div{
height:45px;
display:flex;
justify-content: center;
align-items: center;
background:#fff; background:#fff;
padding:5px 0; padding:5px 2px;
} }
&:first-child>div{ &:first-child>div{
border-left:2px solid #8D90FF; border-left:2px solid #8D90FF;
...@@ -35,13 +39,13 @@ ...@@ -35,13 +39,13 @@
<div>销售退货</div> <div>销售退货</div>
</td> </td>
<td> <td>
<div>{{value['销售退货']||0}}</div> <div>{{Number(value['销售退货']||0).toLocaleString()}}</div>
</td> </td>
<td style="width:100px;"> <td style="width:100px;">
<div>采购退货</div> <div>采购退货</div>
</td> </td>
<td> <td>
<div>{{value['采购退货']||0}}</div> <div>{{Number(value['采购退货']||0).toLocaleString()}}</div>
</td> </td>
</tr> </tr>
<tr> <tr>
...@@ -49,13 +53,13 @@ ...@@ -49,13 +53,13 @@
<div>加工回修</div> <div>加工回修</div>
</td> </td>
<td> <td>
<div>{{value['加工回修']||0}}</div> <div>{{Number(value['加工回修']||0).toLocaleString()}}</div>
</td> </td>
<td> <td>
<div>疵品数量</div> <div>疵品数量</div>
</td> </td>
<td> <td>
<div>{{value['疵品汇总']||0}}</div> <div>{{Number(value['疵品汇总']||0).toLocaleString()}}</div>
</td> </td>
</tr> </tr>
<tr> <tr>
...@@ -66,13 +70,13 @@ ...@@ -66,13 +70,13 @@
<div>数量</div> <div>数量</div>
</td> </td>
<td> <td>
<div>{{value['拖期订单总数量']||0}}</div> <div>{{Number(value['拖期订单总数量']||0).toLocaleString()}}</div>
</td> </td>
<td> <td>
<div>金额</div> <div>金额</div>
</td> </td>
<td> <td>
<div>{{value['拖期订单总金额']||0}}</div> <div>{{Number(value['拖期订单总金额']||0).toLocaleString()}}</div>
</td> </td>
</tr> </tr>
<tr> <tr>
...@@ -80,13 +84,13 @@ ...@@ -80,13 +84,13 @@
<div>供应商赔款</div> <div>供应商赔款</div>
</td> </td>
<td> <td>
<div>{{value['供应商索赔']||0}}</div> <div>{{Number(value['供应商索赔']||0).toLocaleString()}}</div>
</td> </td>
<td> <td>
<div>客户赔款</div> <div>客户赔款</div>
</td> </td>
<td> <td>
<div>{{value['客户索赔']||0}}</div> <div>{{Number(value['客户索赔']||0).toLocaleString()}}</div>
</td> </td>
</tr> </tr>
<tr> <tr>
...@@ -94,13 +98,13 @@ ...@@ -94,13 +98,13 @@
<div>超期应收额</div> <div>超期应收额</div>
</td> </td>
<td> <td>
<div>{{value['超期应收']||0}}</div> <div>{{Number(value['超期应收']||0).toLocaleString()}}</div>
</td> </td>
<td> <td>
<div>超期应付额</div> <div>超期应付额</div>
</td> </td>
<td> <td>
<div>{{value['超期应付']||0}}</div> <div>{{Number(value['超期应付']||0).toLocaleString()}}</div>
</td> </td>
</tr> </tr>
</table> </table>
...@@ -135,12 +139,12 @@ export default { ...@@ -135,12 +139,12 @@ export default {
methods:{ methods:{
async search(){ async search(){
var value= await this.request('getBoss',{ var value= await this.request('getBoss',{
data:[{key:"url",value:"Abnormal early warning"}], data:[
params:{ {key:"url",value:"Abnormal early warning"},
begin_date:util.dateFormat(this.start,"yyyy-MM-dd"), {key:"begin_date",value: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', {key:"end_date",value:(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){ if(typeof value=="object"&&value.length>0){
this.value=value[0] this.value=value[0]
}else{ }else{
......
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
.capital{ .capital{
>div.card{ >div.card{
margin: 15px; margin: 15px;
background: rgb(94,154,254); background: linear-gradient(25deg, var(--color,#5180D4,#5180D4));
padding:15px; padding:15px;
border-radius: 5px; border-radius: 5px;
box-shadow: 2px 2px 3px rgba(94,154,254,0.5); box-shadow: 2px 2px 3px rgba(94,154,254,0.5);
...@@ -17,12 +17,12 @@ ...@@ -17,12 +17,12 @@
</style> </style>
<template> <template>
<div class="capital" :style="list.length==0&&'background:#fff;height:100%;'"> <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>
<div style="font-size:13px;margin-bottom:14px;">{{v.sName}}</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> <div style="font-size: 28px;font-weight: 600;">{{Number(v.sValue)||0}}</div>
</div> </div>
<div style="align-self: flex-end;" v-if="v.rate=0"> <div style="align-self: flex-end;" v-if="v.rate!=0">
<div>{{v.rate>0?'↑':'↓'}}{{v.rate}}%</div> <div>{{v.rate>0?'↑':'↓'}}{{v.rate}}%</div>
<div>{{dateModeName}}{{v.rate>0?'上':'下'}}</div> <div>{{dateModeName}}{{v.rate>0?'上':'下'}}</div>
</div> </div>
...@@ -42,6 +42,14 @@ export default{ ...@@ -42,6 +42,14 @@ export default{
data(){ data(){
return{ return{
list:[], list:[],
color:[
"#ff9700, #fe777c",
"#0081ff, #1cbbb4",
"#fe5a9f,#ff5c40",
"#ca2af4,#8850ff",
"#ffd65b,#ff9833",
"#3b83f6, #24c2dd",
],
} }
}, },
watch:{ watch:{
...@@ -61,16 +69,16 @@ export default{ ...@@ -61,16 +69,16 @@ export default{
methods:{ methods:{
async search(){ async search(){
var value=await this.request("getBoss",{ var value=await this.request("getBoss",{
data:[{key:"url",value:"Summary of funds"}], data:[
params:{ {key:"url",value:"Summary of funds"},
begin_date:util.dateFormat(this.start,"yyyy-MM-dd"), {key:"begin_date",value: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', {key:"end_date",value:(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){ if(typeof value=='object'&&value.length>0){
this.list=value.map(v=>{ this.list=value.map(v=>{
if(v.sValued==0){ if(v.sValued==0&&v.sValue!=0){
v.rate=100 v.rate=v.sValue>0?100:-100
}else if(v.sValue==0){ }else if(v.sValue==0){
v.rate=0 v.rate=0
}else{ }else{
......
...@@ -11,8 +11,9 @@ ...@@ -11,8 +11,9 @@
>span{ >span{
width:calc(100%/5); width:calc(100%/5);
text-align: center; text-align: center;
padding: 10px 0;
position:relative; position:relative;
height: 35px;
line-height: 35px;
&:after{ &:after{
content:" "; content:" ";
left:50%; left:50%;
...@@ -23,39 +24,62 @@ ...@@ -23,39 +24,62 @@
border-radius: 20px; border-radius: 20px;
transition: all 0.3s; transition: all 0.3s;
} }
&.active:after{ &.active{
width:100%; font-size:15px;
left:0; &:after{
width:100%;
left:0;
}
} }
} }
} }
>.date{ >.date{
flex-shrink: 0; flex-shrink: 0;
display: flex; display: flex;
padding:7px 0; height: 30px;
>div{ >div{
flex-grow:1; flex-grow:1;
display:flex; display:flex;
justify-content: space-around; justify-content: center;
align-items: center; align-items: center;
font-size: 10px; font-size: 14px;
>.line{ >.line{
width: 20px; width: 15px;
background: #43B884; background: #815EFF;
height: 3px; height: 3px;
border-radius: 50px; border-radius: 50px;
margin: 0 -20px; margin: 0 5px;
} }
} }
>span{ >button{
flex-shrink: 0; flex-shrink: 0;
padding: 0 10px; 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{ >.list{
flex-shrink: 0; flex-shrink: 0;
display:flex; display:flex;
background: #f2f2f2; background: #f2f2f2;
color:#679FFE;
>span{ >span{
width: calc(100%/5); width: calc(100%/5);
text-align: center; text-align: center;
...@@ -73,6 +97,7 @@ ...@@ -73,6 +97,7 @@
flex-grow:1; flex-grow:1;
overflow:auto; overflow:auto;
height:1px; height:1px;
-webkit-overflow-scrolling: touch;
} }
} }
</style> </style>
...@@ -86,13 +111,13 @@ ...@@ -86,13 +111,13 @@
<span :class="{active:dateMode==5}" @click="dateSelect(5)">自定义</span> <span :class="{active:dateMode==5}" @click="dateSelect(5)">自定义</span>
</div> </div>
<div class="date"> <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> <div>
<span>{{startDate}}</span> <span>{{startDate}}</span>
<span v-show="dateMode>1" class="line" /> <span v-show="dateMode>1" class="line" />
<span v-show="dateMode>1">{{endDate}}</span> <span v-show="dateMode>1">{{endDate}}</span>
</div> </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>
<div class="list"> <div class="list">
<span :class="{active:situation=='operate'}" @click="situation='operate'">运营概况</span> <span :class="{active:situation=='operate'}" @click="situation='operate'">运营概况</span>
...@@ -207,10 +232,10 @@ export default { ...@@ -207,10 +232,10 @@ export default {
}, },
computed:{ computed:{
startDate(val){ startDate(val){
return util.dateFormat(this.DateValue[0],"yyyy-MM-dd") return util.dateFormat(this.DateValue[0],"yyyy年MM月dd日")
}, },
endDate(val){ endDate(val){
return util.dateFormat(this.DateValue[1],"yyyy-MM-dd"); return util.dateFormat(this.DateValue[1],"yyyy年MM月dd日");
} }
}, },
watch:{ watch:{
......
...@@ -8,14 +8,20 @@ ...@@ -8,14 +8,20 @@
text-align: center; text-align: center;
tr:first-child{ tr:first-child{
font-size: 13px; font-size: 13px;
font-weight: bold; >td{
height:30px;
}
} }
tr:not(:first-child){ tr:not(:first-child){
>td{ >td{
padding:5px 0; padding-bottom:18px;
>div{ >div{
background:#fff; height: 45px;
padding:6px 0; background: #fff;
padding: 6px 0;
display: flex;
justify-content: center;
align-items: center;
} }
&:first-child{ &:first-child{
>div{ >div{
...@@ -30,6 +36,7 @@ ...@@ -30,6 +36,7 @@
} }
} }
} }
tr:last-child>td{ padding-bottom:30px; }
} }
} }
</style> </style>
......
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