|
|
|
@ -18,16 +18,16 @@ |
|
|
|
|
<span slot="title" class="submenu-title-wrapper">发票管理<a-icon type="down" /></span> |
|
|
|
|
|
|
|
|
|
<a-menu-item key="invoice1"> |
|
|
|
|
Option 1 |
|
|
|
|
全部发票 |
|
|
|
|
</a-menu-item> |
|
|
|
|
<a-menu-item key="invoice2"> |
|
|
|
|
Option 2 |
|
|
|
|
已开发票 |
|
|
|
|
</a-menu-item> |
|
|
|
|
<a-menu-item key="invoice3"> |
|
|
|
|
Option 3 |
|
|
|
|
待开发票 |
|
|
|
|
</a-menu-item> |
|
|
|
|
<a-menu-item key="invoice4"> |
|
|
|
|
Option 4 |
|
|
|
|
抬头管理 |
|
|
|
|
</a-menu-item> |
|
|
|
|
</a-sub-menu> |
|
|
|
|
<a-sub-menu> |
|
|
|
@ -124,6 +124,35 @@ |
|
|
|
|
</div> |
|
|
|
|
<Collection v-if="current[0] == 'collect'"></Collection> |
|
|
|
|
<AddrView v-if="current[0] == 'addr'"></AddrView> |
|
|
|
|
<div class="invoiceList"> |
|
|
|
|
<!-- 发票管理--> |
|
|
|
|
<div class="invoice" v-for="(item,index) in invoiceList" :key="index"> |
|
|
|
|
<div class="d-flex title"> |
|
|
|
|
<span class="c_333 f_16">{{item.date}}</span> |
|
|
|
|
<span class="font_01" v-if="item.billing">已开票</span> |
|
|
|
|
<span class="font_01" v-if="!item.billing">待开票</span> |
|
|
|
|
</div> |
|
|
|
|
<div class="d-flex"> |
|
|
|
|
<div class="img"> |
|
|
|
|
<img :src="item.imgUrl"/> |
|
|
|
|
</div> |
|
|
|
|
<div class="invoiceInfo"> |
|
|
|
|
<div class="font_01">订单编号:{{item.orderNum}}</div> |
|
|
|
|
<div class="font_02">发票类型:{{item.type}}</div> |
|
|
|
|
<div class="font_02">发票内容:{{item.content}}</div> |
|
|
|
|
<div class="font_02">发票抬头:{{item.title}}</div> |
|
|
|
|
<div class="font_02">开票金额:{{item.price}}</div> |
|
|
|
|
</div> |
|
|
|
|
<div class="btnDiv d-flex"> |
|
|
|
|
<div class="dialogButton primary">申请换开</div> |
|
|
|
|
<div class="dialogButton default">查看详情</div> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
</div> |
|
|
|
|
<!-- 发票抬头管理--> |
|
|
|
|
<div class="invoice"></div> |
|
|
|
|
|
|
|
|
|
</div> |
|
|
|
|
<div class="orderList" > |
|
|
|
|
<div class="item" v-for="(item,index) in allOrders" :key="index"> |
|
|
|
|
<div class="top d-flex"> |
|
|
|
@ -180,8 +209,7 @@ |
|
|
|
|
model:{ |
|
|
|
|
username1: "" |
|
|
|
|
}, |
|
|
|
|
|
|
|
|
|
current: ['allorders'],//目前打开的菜单 |
|
|
|
|
current: ['invoice1'],//目前打开的菜单 |
|
|
|
|
key:'',//当前选择的订单状态(待支付、待收货等) |
|
|
|
|
allOrders2:[], |
|
|
|
|
allOrders1:[ |
|
|
|
@ -229,7 +257,42 @@ |
|
|
|
|
} |
|
|
|
|
],//所有订单,包括未支付、未收获等 |
|
|
|
|
allOrders:[],//目前展示的订单 |
|
|
|
|
|
|
|
|
|
invoiceList:[],//目前展示的发票列表 |
|
|
|
|
invoiceList1:[ |
|
|
|
|
{ |
|
|
|
|
id:1, |
|
|
|
|
date:'2022-08-19 14:09:13', |
|
|
|
|
billing:true,//是否已开票 |
|
|
|
|
imgUrl:require("../assets/cloth001.png"), |
|
|
|
|
orderNum:1237943879,//订单编号 |
|
|
|
|
type:"1",//为1为普通发票 |
|
|
|
|
content:"商品明细",//发票内容 |
|
|
|
|
title:"易创网络科技有限公司",//抬头 |
|
|
|
|
price:2456,//价格 |
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
id:2, |
|
|
|
|
date:'2022-08-20 14:09:13', |
|
|
|
|
billing:false,//是否已开票 |
|
|
|
|
imgUrl:require("../assets/cloth002.png"), |
|
|
|
|
orderNum:1237943880,//订单编号 |
|
|
|
|
type:"1",//为1为普通发票 |
|
|
|
|
content:"商品明细",//发票内容 |
|
|
|
|
title:"易创网络科技有限公司",//抬头 |
|
|
|
|
price:2456,//价格 |
|
|
|
|
}, |
|
|
|
|
{ |
|
|
|
|
id:3, |
|
|
|
|
date:'2022-08-30 14:09:13', |
|
|
|
|
billing:true,//是否已开票 |
|
|
|
|
imgUrl:require("../assets/cloth003.png"), |
|
|
|
|
orderNum:1237943881,//订单编号 |
|
|
|
|
type:"1",//为1为普通发票 |
|
|
|
|
content:"商品明细",//发票内容 |
|
|
|
|
title:"易创网络科技有限公司",//抬头 |
|
|
|
|
price:2456,//价格 |
|
|
|
|
}, |
|
|
|
|
],//全部发票数据 |
|
|
|
|
|
|
|
|
|
url: { |
|
|
|
|
list: "/starehouse/starehouse/list", |
|
|
|
@ -420,9 +483,18 @@ |
|
|
|
|
else if(key.key == 'yiwancheng'){ |
|
|
|
|
/*this.allOrders = this.allOrders1.filter(item=>item.receipt == true)*/ |
|
|
|
|
this.allOrders = this.allOrders2.filter(item=>item.receipt == true) |
|
|
|
|
}else{ |
|
|
|
|
this.allOrders=[] |
|
|
|
|
}else if(key.key == 'invoice1'){//选择全部发票选项 |
|
|
|
|
this.invoiceList = this.invoiceList1 |
|
|
|
|
} |
|
|
|
|
else if(key.key == 'invoice2'){//选择已开发票选项 |
|
|
|
|
this.invoiceList = this.invoiceList1.filter(item=>item.billing == true) |
|
|
|
|
} |
|
|
|
|
else if(key.key == 'invoice3'){//选择未开发票选项 |
|
|
|
|
this.invoiceList = this.invoiceList1.filter(item=>item.billing == false) |
|
|
|
|
} |
|
|
|
|
// else{ |
|
|
|
|
// this.allOrders=[] |
|
|
|
|
// } |
|
|
|
|
} |
|
|
|
|
}, |
|
|
|
|
}; |
|
|
|
@ -438,6 +510,18 @@ |
|
|
|
|
line-height: 40px; |
|
|
|
|
transition: all 0.2s; |
|
|
|
|
} |
|
|
|
|
.default { |
|
|
|
|
border: 2px solid #1b1b1b; |
|
|
|
|
color: #1b1b1b; |
|
|
|
|
margin-right: 20px; |
|
|
|
|
|
|
|
|
|
&:hover { |
|
|
|
|
border: 2px solid #1b1b1b; |
|
|
|
|
color: #fff; |
|
|
|
|
opacity: 0.8; |
|
|
|
|
background-color: #1b1b1b; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.primary { |
|
|
|
|
background: #1b1b1b; |
|
|
|
|
border: 2px solid #1b1b1b; |
|
|
|
@ -447,6 +531,15 @@ |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.font_01{ |
|
|
|
|
color: #333; |
|
|
|
|
font-size: 16px; |
|
|
|
|
font-weight: 500; |
|
|
|
|
} |
|
|
|
|
.font_02{ |
|
|
|
|
color: #333; |
|
|
|
|
font-size: 16px; |
|
|
|
|
} |
|
|
|
|
.bg{ |
|
|
|
|
width: 100%; |
|
|
|
|
height: 250px; |
|
|
|
@ -474,6 +567,52 @@ |
|
|
|
|
/deep/ .ant-menu{ |
|
|
|
|
display: flex; |
|
|
|
|
justify-content: space-between; |
|
|
|
|
} |
|
|
|
|
.invoiceList{ |
|
|
|
|
padding-left: 20px; |
|
|
|
|
padding-right: 20px; |
|
|
|
|
width: 1114px;margin:0 auto; |
|
|
|
|
.d-flex{ |
|
|
|
|
justify-content: space-between; |
|
|
|
|
} |
|
|
|
|
.invoice{ |
|
|
|
|
padding-top: 40px; |
|
|
|
|
padding-bottom: 20px; |
|
|
|
|
border-bottom: 1px solid #DADADA; |
|
|
|
|
.title{ |
|
|
|
|
margin-bottom: 25px; |
|
|
|
|
} |
|
|
|
|
.img{ |
|
|
|
|
width: 232px; |
|
|
|
|
height: 232px; |
|
|
|
|
img{ |
|
|
|
|
width: 232px; |
|
|
|
|
height: 232px; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.invoiceInfo{ |
|
|
|
|
width: 483px; |
|
|
|
|
.font_01{ |
|
|
|
|
margin-bottom: 26px; |
|
|
|
|
} |
|
|
|
|
.font_02{ |
|
|
|
|
margin-bottom: 12px; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
.btnDiv{ |
|
|
|
|
width: 145px; |
|
|
|
|
flex-direction: column; |
|
|
|
|
justify-content: flex-end; |
|
|
|
|
padding-bottom: 26px; |
|
|
|
|
.dialogButton{ |
|
|
|
|
width: 100%; |
|
|
|
|
margin-bottom: 17px; |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
.orderList{ |
|
|
|
|
/*margin-top: 60px;*/ |
|
|
|
|