<style lang="less"> .abnormal{ >table{ width: calc(100% - 20px); text-align: center; margin: 10px; background: #E6F0FE; border-radius: 5px; tr{ >td{ padding:10px 0; >div{ height:45px; display:flex; justify-content: center; align-items: center; background:#fff; padding:5px 2px; } &:first-child>div{ border-left:2px solid #8D90FF; } &:nth-child(2n-1)>div{ // color:#68A0FE; } &:nth-child(2n){ color:#68A0FE; text-align: left; text-decoration: underline; } } } } } </style> <template> <div class="abnormal"> <table cellspacing="0" > <tr> <td style="width:100px;" > <div>销售退货</div> </td> <td @click="routerPushOperateDetail('销售退货')"> <div>{{Number(value['销售退货']||0).toLocaleString()}}</div> </td> <td style="width:100px;"> <div>销售退货率</div> </td> <td style="text-decoration:none;"> <div>{{Number(value['销售退货率']||0).toLocaleString() * 100 + '%'}}</div> </td> </tr> <tr> <td style="width:100px;"> <div>采购退货</div> </td> <td @click="routerPushOperateDetail('采购退货')"> <div>{{Number(value['采购退货']||0).toLocaleString()}}</div> </td> <td style="width:100px;"> <div>采购退货率</div> </td> <td style="text-decoration:none;"> <div>{{Number(value['采购退货率']||0).toLocaleString() * 100 + '%'}}</div> </td> </tr> <tr> <td > <div>加工回修</div> </td> <td @click="routerPushOperateDetail('加工回修')"> <div>{{Number(value['加工回修']||0).toLocaleString()}}</div> </td> <td> <div>疵品数量</div> </td> <td @click="routerPushOperateDetail('疵品汇总')"> <div>{{Number(value['疵品汇总']||0).toLocaleString()}}</div> </td> </tr> <tr> <td colspan='4' style="text-align:left;padding:0 0 0 10px;color:#68A0FE;">拖期订单:{{value['拖期订单数量']||0}}</td> </tr> <tr> <td> <div>数量</div> </td> <td style="text-decoration:none;"> <div>{{Number(value['拖期订单总数量']||0).toLocaleString()}}</div> </td> <td> <div>金额</div> </td> <td style="text-decoration:none;"> <div>{{Number(value['拖期订单总金额']||0).toLocaleString()}}</div> </td> </tr> <tr> <td> <div>供应商赔款</div> </td> <td @click="routerPushOperateDetail('供应商索赔')"> <div>{{Number(value['供应商索赔']||0).toLocaleString()}}</div> </td> <td> <div>客户赔款</div> </td> <td @click="routerPushOperateDetail('客户索赔')"> <div>{{Number(value['客户索赔']||0).toLocaleString()}}</div> </td> </tr> <tr> <td> <div>超期应收额</div> </td> <td @click="routerPushOperateDetail('超期应收')"> <div>{{Number(value['超期应收']||0).toLocaleString()}}</div> </td> <td> <div>超期应付额</div> </td> <td @click="routerPushOperateDetail('超期应付')"> <div>{{Number(value['超期应付']||0).toLocaleString()}}</div> </td> </tr> </table> </div> </template> <script> import util from "@/libs/util.js" export default { name:"abnormal", props:{ start:Date, end:Date, }, data(){ return{ value:{}, } }, watch:{ start(n){ this.search() }, end(n){ this.search() }, }, created(){ this.$nextTick(()=>{ this.search() }) }, methods:{ async search(){ var value= await this.request('getBoss',{ data:[ {key:"url",value:"Abnormal early warning"}, {key:"begin_date",value:util.dateFormat(this.start,"yyyy-MM-dd")}, {key:"end_date",value:(this.end?util.dateFormat(this.end,"yyyy-MM-dd"):util.dateFormat(new Date,"yyyy-MM-dd"))+' 23:59'}, ] },"加载中",{}) if(typeof value=="object"&&value.length>0){ this.value=value[0] }else{ this.$vux.confirm.show({ title:"提示", content:"未获取到数据", showConfirmButton:false, }) } }, routerPushOperateDetail(type){ let data = {}; data.sType = type; data.begin_date = util.dateFormat(this.start,"yyyy-MM-dd"); data.end_date = (this.end?util.dateFormat(this.end,"yyyy-MM-dd"):util.dateFormat(new Date,"yyyy-MM-dd"))+' 23:59'; this.$store.dispatch('saveKanbanHdr',data); this.$store.dispatch('saveRefresh',true); this.$router.push({name:'tiipOperateDetail',type:type}) } }, } </script>