Commit 22ba1b64 authored by xiejb's avatar xiejb
parents 34e5223f e91b02e1
......@@ -241,7 +241,7 @@ export default {
// height: 250PX;
background-color: white;
margin-bottom: 10PX;
border-radius: 10PX;
border-radius: 6PX;
font-size: 14px;
color: #333333;
padding: 0PX 10PX 10PX 10PX;
......
......@@ -2,7 +2,7 @@
<div id="orderListItem">
<div class="itemInfo">
<div class="orderNum">
<van-image fit="contain" width="50" height="55" :src="sphImage"/>
<van-image fit="contain" width="28" height="28" :src="sphImage"/>
<div class="num">
<div class="numBer">订单号:{{item.orderNo}}</div>
<!-- <van-button color="#D9001B" class="numBtn" round plain size="mini" type="info">退</van-button> -->
......@@ -11,20 +11,24 @@
</div>
<!-- <div class="dian"></div> -->
<!-- <div class="numType"><span>{{item.orderStatus}}</span></div> -->
<div class="numType">
<van-button style="opacity: 1;" disabled :color="orderTypeColor(item)" plain size="mini" type="info">{{item.orderStatus}}</van-button>
<div class="numType" style="margin-top: -5px;">
<van-button style="opacity: 1;height:16px;" disabled :color="orderTypeColor(item)" plain size="mini" type="info">{{item.orderStatus}}</van-button>
</div>
</div>
<div class="divider"></div>
<div class="lineStyle">
<span class="pointOutL"></span>
<div class="divider"></div>
<span class="pointOutR"></span>
</div>
<div class="orderInfo">
<div class="company" @click="btnAction('details')">
<span style="width: 75%">{{item.supplierName}}</span>
<span style="width: 25%;margin-right: 5PX;text-align: right;">{{item.orderTotalQty}}</span>
<van-icon style="margin: auto 0;" color="#1989fa" name="arrow" />
<span style="width: 25%;" class="totalNum">{{item.orderTotalQty}}</span>
<van-icon style="margin: auto 0;" color="#999999" name="arrow" />
</div>
<div class="info" @click="btnAction('details')">
<div class="headImage">
<van-image width="55" height="55" :src="orderImage"/>
<van-image width="48" height="48" :src="orderImage"/>
</div>
<div class="details">
<div class="titleInfo">
......@@ -32,17 +36,17 @@
{{titleInitial(item.goodsInfos[0])}}
</div>
<div class="priceInfo">
<div class="price"><span style="color:red;">{{item.goodsInfos[0].taxPrice}}</span></div>
<div class="numBer">X {{item.goodsInfos[0].orderQty}}</div>
<div class="price"><span>{{item.goodsInfos[0].taxPrice}}</span></div>
<div class="numBer">x{{item.goodsInfos[0].orderQty}}</div>
</div>
</div>
</div>
<div class="orderTime" @click="btnAction('details')">
<van-icon size="20" style="margin: auto 0; width: 7%;" name="clock-o" />
<span style="width: 50%;">{{item.orderDate}}</span>
<div class="price">总计:¥<span style="color:red;">{{item.orderTotalAmount}}</span></div>
<van-icon size="15" style="margin: auto 0; width: 7%;" name="clock-o" />
<span class="timeShow">{{item.orderDate}}</span>
<div class="price">总计:¥<span >{{moneyFormat(item.orderTotalAmount)}}</span></div>
</div>
<van-divider :style="{ color: '#999999', borderColor: '#999999', margin: '10PX 0 10PX 0'}"/>
<!-- <van-divider :style="{ color: '#999999', borderColor: '#999999', margin: '10PX 0 10PX 0'}"/>-->
<!-- <div class="btnInfo" style="text-align: right;">
<van-button v-if="item.isInvoice === 'TRUE'" @click="btnAction('invoice')" style="border-radius: 5PX;height: 25PX; line-height: 25PX" plain size="small" type="info">查看发票</van-button>
<van-button v-if="item.isDelivered === 'TRUE'" @click="btnAction('logistics')" style="border-radius: 5PX;height: 25PX; line-height: 25PX" plain size="small" type="info">查看物流</van-button>
......@@ -54,6 +58,7 @@
</template>
<script>
import { AmountNumFormat } from '@/utils/common'
export default {
name: 'OrderListItem',
components: {
......@@ -93,6 +98,9 @@ export default {
let titleStr = '' + model.goodsCode + '' + model.goodsName + '/' + model.goodsSpec + '/' + model.manufacturer
return titleStr
},
moneyFormat(num) {
return AmountNumFormat(num)
},
// 根据订单类型返回颜色
orderTypeColor (model) {
if (model.orderStatusCode === '100') {
......@@ -123,17 +131,41 @@ export default {
<style lang="scss" scoped>
#orderListItem {
.itemInfo{
.divider{
width: 100%;
height: 1PX;
background: linear-gradient(to right, #ccc 0%, #ccc 50%, transparent 50%);
background-size: 10PX 1PX;
background-repeat: repeat-x;
.lineStyle {
display: flex;
align-items: center;
margin:0 -14px;
.divider{
flex: 1;
display: inline-block;
height: 2PX;
margin: 0 4px;
background: linear-gradient(to right, #ccc 0%, #ccc 50%, transparent 50%);
background-size: 10PX 2PX;
background-repeat: repeat-x;
}
.pointOutL{
display:inline-block;
background-color:#f5f5f5;
border-bottom-right-radius: 12px;
border-top-right-radius: 12px;
width:12px;
height:12px
}
.pointOutR{
display:inline-block;
background-color:#f5f5f5;
border-bottom-left-radius: 12px;
border-top-left-radius: 12px;
width:12px;
height:12px
}
}
.orderNum{
display: flex;
line-height: 50PX;
//line-height: 50PX;
height: 50PX;
align-items: center;
// margin: 0PX 10PX;
.num{
width: 77%;
......@@ -141,6 +173,7 @@ export default {
}
.numBer{
height: 16PX;
font-size: 13px;
// line-height: 15PX;
}
.numBtn{
......@@ -171,10 +204,18 @@ export default {
width: 100%;
display: flex;
font-weight: 600;
.totalNum {
margin-right: 5PX;
text-align: right;
font-weight:normal;
font-size:12PX;
}
}
.info{
height: 65PX;
display: flex;
align-items: center;
.headImage{
// width: 55PX;
padding-right: 10PX;
......@@ -199,6 +240,7 @@ export default {
.numBer {
width: 50%;
text-align: right;
font-size:12px;
}
}
}
......@@ -206,11 +248,20 @@ export default {
}
.orderTime{
display: flex;
i {
color: $txtGray9;
}
.timeShow {
width: 50%;
font-size:12px;
padding-top:2px;
color: $txtGray9;
}
.price {
width: 40%;
text-align: right;
font-weight: 600;
font-size: 15PX
//font-weight: 600;
font-size: 13PX
}
}
}
......
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