订单样式
This commit is contained in:
parent
29bc0bdb6f
commit
c8bae06b80
|
|
@ -109,13 +109,13 @@ const time = ref([])
|
|||
<el-col :span="3">
|
||||
<span>订单流程</span>
|
||||
</el-col>
|
||||
<el-col :span="2" style="text-align:right;margin-right:20px;font-size: 20px;">
|
||||
<el-col :span="2" style="text-align:right;margin-right:80px;font-size: 20px;">
|
||||
<div style="color:green;">{{titleStaus}}</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-header>
|
||||
|
||||
<el-steps class="step" :space="400" :active="orderStatusTemp===7 ? 1 : orderStatusTemp-1" finish-status="success">
|
||||
<el-steps class="step" :space="600" :active="orderStatusTemp===7 ? 1 : orderStatusTemp-1" finish-status="success">
|
||||
<el-step :title="getStepTitle(1)" :description="getDescription(1)"></el-step>
|
||||
<el-step :title="getStepTitle(2)" :description="getDescription(2)"></el-step>
|
||||
<el-step :title="getStepTitle(3)" :description="getDescription(3)"></el-step>
|
||||
|
|
|
|||
|
|
@ -407,7 +407,7 @@ const tableData4: any = ref([
|
|||
<el-col :span="6">
|
||||
<div
|
||||
class="item"
|
||||
style="flex-shrink: 0; margin-bottom: 5px; font-size: 12px"
|
||||
style="flex-shrink: 0; margin-bottom: 5px; font-size: 15px; margin-top: 5px;"
|
||||
>
|
||||
<span>订单编号:</span>
|
||||
{{ item.code }}
|
||||
|
|
@ -416,7 +416,7 @@ const tableData4: any = ref([
|
|||
<el-col :span="7">
|
||||
<div
|
||||
class="item"
|
||||
style="flex-shrink: 0; margin-bottom: 5px; font-size: 12px"
|
||||
style="flex-shrink: 0; margin-bottom: 5px; font-size: 15px; margin-top: 5px;"
|
||||
>
|
||||
<span>下单时间:</span>
|
||||
{{ item.orderTime }}
|
||||
|
|
@ -425,19 +425,19 @@ const tableData4: any = ref([
|
|||
<el-col :span="7">
|
||||
<div
|
||||
class="item"
|
||||
style="flex-shrink: 0; margin-bottom: 5px; font-size: 12px"
|
||||
style="flex-shrink: 0; margin-bottom: 5px; font-size: 15px; margin-top: 5px;"
|
||||
>
|
||||
<span>装备所属公司:</span>
|
||||
{{ item.czcompanyName }}
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="4">
|
||||
<div style="flex-shrink: 0; margin-bottom: 1px; font-size: 7px">
|
||||
<div style="flex-shrink: 0; margin-bottom: 1px; font-size: 7px; display: flex;justify-content: center; margin-top: 5px;">
|
||||
<el-button
|
||||
v-if="item.czOrderStatus == '3'"
|
||||
class="item"
|
||||
type="primary"
|
||||
size="small"
|
||||
type="success"
|
||||
size="mimi"
|
||||
@click="confirmReceipt(index)"
|
||||
>确认收货</el-button
|
||||
>
|
||||
|
|
@ -449,7 +449,7 @@ const tableData4: any = ref([
|
|||
<el-col :span="6">
|
||||
<div
|
||||
class="item"
|
||||
style="flex-shrink: 0; margin-bottom: 5px; font-size: 12px"
|
||||
style="flex-shrink: 0; margin-bottom: 5px; font-size: 15px; margin-top: 5px;"
|
||||
>
|
||||
<span>出租方电话:</span>
|
||||
{{ item.personPhone }}
|
||||
|
|
@ -458,7 +458,7 @@ const tableData4: any = ref([
|
|||
<el-col :span="7">
|
||||
<div
|
||||
class="item"
|
||||
style="flex-shrink: 0; margin-bottom: 5px; font-size: 12px"
|
||||
style="flex-shrink: 0; margin-bottom: 5px; font-size: 15px; margin-top: 5px;"
|
||||
>
|
||||
<span>承租方电话:</span>
|
||||
{{ item.phoneNumber }}
|
||||
|
|
@ -467,7 +467,7 @@ const tableData4: any = ref([
|
|||
<el-col :span="7">
|
||||
<div
|
||||
class="item"
|
||||
style="flex-shrink: 0; margin-bottom: 5px; font-size: 12px"
|
||||
style="flex-shrink: 0; margin-bottom: 5px; font-size: 15px; margin-top: 5px;"
|
||||
>
|
||||
<span>承租方地址:</span>
|
||||
{{ item.companyName }}
|
||||
|
|
@ -484,8 +484,8 @@ const tableData4: any = ref([
|
|||
</el-checkbox>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="9" class="goods-info">
|
||||
<el-col :span="7">
|
||||
<el-col :span="6" class="goods-info">
|
||||
<el-col :span="6">
|
||||
<img :src="goods.url" alt="" />
|
||||
</el-col>
|
||||
<div class="goods-code">
|
||||
|
|
@ -495,13 +495,13 @@ const tableData4: any = ref([
|
|||
<div>数量：{{ goods.num }}{{ ' ' + '台' }}</div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="2">
|
||||
<el-col :span="3">
|
||||
<div style="font-size: 14px; font-weight: bold; margin-bottom: 10px">
|
||||
总费用
|
||||
</div>
|
||||
<div class="red-font">{{ goods.costs }}</div>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-col :span="5">
|
||||
<div style="font-size: 14px; font-weight: bold; margin-bottom: 10px">租期</div>
|
||||
<div style="color: black; font-weight: bold">
|
||||
{{ goods.rentBeginTime }}
|
||||
|
|
@ -509,7 +509,7 @@ const tableData4: any = ref([
|
|||
<div style="margin-top: 3px; margin-bottom: 3px">{{ '至' }}</div>
|
||||
<div style="color: black; font-weight: bold">{{ goods.rentEndTime }}</div>
|
||||
</el-col>
|
||||
<el-col :span="2">
|
||||
<el-col :span="4">
|
||||
<div
|
||||
v-if="goods.orderStatus == '2'"
|
||||
style="font-size: 14px; font-weight: bold; margin-bottom: 10px; color: blue"
|
||||
|
|
@ -554,20 +554,20 @@ const tableData4: any = ref([
|
|||
{{ '已驳回' }}
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="3">
|
||||
<el-col :span="5">
|
||||
<div>
|
||||
<el-button
|
||||
@click="handleViewOrder(j, item.detailsList[j])"
|
||||
type="text"
|
||||
size="mini"
|
||||
type="primary"
|
||||
size="small"
|
||||
style="color: #blue; font-weight: bold"
|
||||
>
|
||||
订单详情
|
||||
</el-button>
|
||||
<el-button
|
||||
@click="handleViewOrder(j)"
|
||||
type="text"
|
||||
size="mini"
|
||||
type="primary"
|
||||
size="small"
|
||||
style="color: #blue; font-weight: bold"
|
||||
>
|
||||
租赁协议
|
||||
|
|
@ -575,8 +575,8 @@ const tableData4: any = ref([
|
|||
<el-button
|
||||
v-if="goods.orderStatus=='4'"
|
||||
@click="handleViewBack(j,item.detailsList[j])"
|
||||
type="text"
|
||||
size="mini"
|
||||
type="primary"
|
||||
size="small"
|
||||
style="color: #blue; font-weight: bold"
|
||||
>
|
||||
发起退租
|
||||
|
|
@ -584,8 +584,8 @@ const tableData4: any = ref([
|
|||
<el-button
|
||||
v-if="goods.orderStatus=='6'"
|
||||
@click="handleViewList(j)"
|
||||
type="text"
|
||||
size="mini"
|
||||
type="primary"
|
||||
size="small"
|
||||
style="color: #blue; font-weight: bold"
|
||||
>
|
||||
费用清单
|
||||
|
|
@ -606,7 +606,7 @@ const tableData4: any = ref([
|
|||
<el-dialog
|
||||
v-model="dialogFormVisibleSettleList"
|
||||
:title="settleListTitle"
|
||||
width="60%"
|
||||
width="65%"
|
||||
align-center
|
||||
:close-on-click-modal="false">
|
||||
<div style="height: 80px">
|
||||
|
|
@ -904,12 +904,12 @@ const tableData4: any = ref([
|
|||
align-content: center;
|
||||
|
||||
img {
|
||||
width: 140px;
|
||||
width: 180px;
|
||||
height: 80px;
|
||||
}
|
||||
|
||||
.goods-code {
|
||||
margin-left: 70px;
|
||||
margin-left: 110px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-around;
|
||||
|
|
|
|||
|
|
@ -117,13 +117,13 @@ const time = ref([])
|
|||
<el-col :span="3">
|
||||
<span>订单流程</span>
|
||||
</el-col>
|
||||
<el-col :span="2" style="text-align:right;margin-right:20px;font-size: 20px;">
|
||||
<el-col :span="2" style="text-align:right;margin-right:80px;font-size: 20px;">
|
||||
<div style="color:green;">{{titleStaus}}</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-header>
|
||||
|
||||
<el-steps class="step" :space="400" :active="orderStatusTemp===7 ? 1 : orderStatusTemp-1" finish-status="success">
|
||||
<el-steps class="step" :space="600" :active="orderStatusTemp===7 ? 1 : orderStatusTemp-1" finish-status="success">
|
||||
<el-step :title="getStepTitle(1)" :description="getDescription(1)"></el-step>
|
||||
<el-step :title="getStepTitle(2)" :description="getDescription(2)"></el-step>
|
||||
<el-step :title="getStepTitle(3)" :description="getDescription(3)"></el-step>
|
||||
|
|
|
|||
|
|
@ -728,16 +728,16 @@ const dialogFormVisibleSettleRepair: any = ref(false)
|
|||
<el-col :span="6">
|
||||
<div
|
||||
class="item"
|
||||
style="flex-shrink: 0; margin-bottom: 5px; font-size: 12px"
|
||||
style="flex-shrink: 0; margin-bottom: 5px; font-size: 15px; margin-top: 5px;"
|
||||
>
|
||||
<span>订单编号:</span>
|
||||
{{ item.code }}
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-col :span="6">
|
||||
<div
|
||||
class="item"
|
||||
style="flex-shrink: 0; margin-bottom: 5px; font-size: 12px"
|
||||
style="flex-shrink: 0; margin-bottom: 5px; font-size: 15px; margin-top: 5px;"
|
||||
>
|
||||
<span>下单时间:</span>
|
||||
{{ item.orderTime }}
|
||||
|
|
@ -746,27 +746,27 @@ const dialogFormVisibleSettleRepair: any = ref(false)
|
|||
<el-col :span="7">
|
||||
<div
|
||||
class="item"
|
||||
style="flex-shrink: 0; margin-bottom: 5px; font-size: 12px"
|
||||
style="flex-shrink: 0; margin-bottom: 5px; font-size: 15px; margin-top: 5px;"
|
||||
>
|
||||
<span>装备所属公司:</span>
|
||||
{{ item.czcompanyName }}
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="4">
|
||||
<div style="flex-shrink: 0; margin-bottom: 1px; font-size: 7px">
|
||||
<el-col :span="5">
|
||||
<div style="flex-shrink: 0; margin-bottom: 1px; font-size: 7px; display: flex;justify-content: center; margin-top: 5px;">
|
||||
<el-button
|
||||
v-if="item.orderStatus == '2'"
|
||||
class="item"
|
||||
type="primary"
|
||||
size="small"
|
||||
type="success"
|
||||
size="mimi"
|
||||
@click="confirmPass(index)"
|
||||
>出库</el-button
|
||||
>
|
||||
<el-button
|
||||
v-if="item.orderStatus == '2'"
|
||||
class="item"
|
||||
type="primary"
|
||||
size="small"
|
||||
type="danger"
|
||||
size="mimi"
|
||||
@click="confirmFail(index)"
|
||||
>驳回</el-button
|
||||
>
|
||||
|
|
@ -778,16 +778,16 @@ const dialogFormVisibleSettleRepair: any = ref(false)
|
|||
<el-col :span="6">
|
||||
<div
|
||||
class="item"
|
||||
style="flex-shrink: 0; margin-bottom: 5px; font-size: 12px"
|
||||
style="flex-shrink: 0; margin-bottom: 5px; font-size: 15px"
|
||||
>
|
||||
<span>出租方电话:</span>
|
||||
{{ item.personPhone }}
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="7">
|
||||
<el-col :span="6">
|
||||
<div
|
||||
class="item"
|
||||
style="flex-shrink: 0; margin-bottom: 5px; font-size: 12px"
|
||||
style="flex-shrink: 0; margin-bottom: 5px; font-size: 15px"
|
||||
>
|
||||
<span>承租方电话:</span>
|
||||
{{ item.phoneNumber }}
|
||||
|
|
@ -796,7 +796,7 @@ const dialogFormVisibleSettleRepair: any = ref(false)
|
|||
<el-col :span="7">
|
||||
<div
|
||||
class="item"
|
||||
style="flex-shrink: 0; margin-bottom: 5px; font-size: 12px"
|
||||
style="flex-shrink: 0; margin-bottom: 5px; font-size: 15px"
|
||||
>
|
||||
<span>承租方地址:</span>
|
||||
{{ item.companyName }}
|
||||
|
|
@ -813,8 +813,8 @@ const dialogFormVisibleSettleRepair: any = ref(false)
|
|||
</el-checkbox>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="9" class="goods-info">
|
||||
<el-col :span="7">
|
||||
<el-col :span="6" class="goods-info">
|
||||
<el-col :span="6">
|
||||
<img :src="goods.url" alt="" />
|
||||
</el-col>
|
||||
<div class="goods-code">
|
||||
|
|
@ -824,13 +824,13 @@ const dialogFormVisibleSettleRepair: any = ref(false)
|
|||
<div>数量：{{ goods.num }}{{ ' ' + '台' }}</div>
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="2">
|
||||
<el-col :span="3">
|
||||
<div style="font-size: 14px; font-weight: bold; margin-bottom: 10px">
|
||||
总费用
|
||||
</div>
|
||||
<div class="red-font">{{ goods.costs }}</div>
|
||||
</el-col>
|
||||
<el-col :span="6">
|
||||
<el-col :span="4">
|
||||
<div style="font-size: 14px; font-weight: bold; margin-bottom: 10px">租期</div>
|
||||
<div style="color: black; font-weight: bold">
|
||||
{{ goods.rentBeginTime }}
|
||||
|
|
@ -838,7 +838,7 @@ const dialogFormVisibleSettleRepair: any = ref(false)
|
|||
<div style="margin-top: 3px; margin-bottom: 3px">{{ '至' }}</div>
|
||||
<div style="color: black; font-weight: bold">{{ goods.rentEndTime }}</div>
|
||||
</el-col>
|
||||
<el-col :span="2">
|
||||
<el-col :span="4">
|
||||
<div
|
||||
v-if="goods.orderStatus == '2'"
|
||||
style="font-size: 14px; font-weight: bold; margin-bottom: 10px; color: blue"
|
||||
|
|
@ -883,20 +883,20 @@ const dialogFormVisibleSettleRepair: any = ref(false)
|
|||
{{ '已驳回' }}
|
||||
</div>
|
||||
</el-col>
|
||||
<el-col :span="3">
|
||||
<el-col :span="5">
|
||||
<div>
|
||||
<el-button
|
||||
@click="handleViewOrder(j, item.detailsList[j])"
|
||||
type="text"
|
||||
size="mini"
|
||||
type="primary"
|
||||
size="small"
|
||||
style="color: #blue; font-weight: bold"
|
||||
>
|
||||
订单详情
|
||||
</el-button>
|
||||
<el-button
|
||||
@click="handleViewOrder(j)"
|
||||
type="text"
|
||||
size="mini"
|
||||
type="primary"
|
||||
size="small"
|
||||
style="color: #blue; font-weight: bold"
|
||||
>
|
||||
租赁协议
|
||||
|
|
@ -904,8 +904,8 @@ const dialogFormVisibleSettleRepair: any = ref(false)
|
|||
<el-button
|
||||
v-if="goods.orderStatus=='5'"
|
||||
@click="handleViewBack(j)"
|
||||
type="text"
|
||||
size="mini"
|
||||
type="primary"
|
||||
size="small"
|
||||
style="color: #blue; font-weight: bold"
|
||||
>
|
||||
退租检修
|
||||
|
|
@ -913,8 +913,8 @@ const dialogFormVisibleSettleRepair: any = ref(false)
|
|||
<el-button
|
||||
v-if="goods.orderStatus=='5'"
|
||||
@click="handleViewMoney(j)"
|
||||
type="text"
|
||||
size="mini"
|
||||
type="primary"
|
||||
size="small"
|
||||
style="color: #blue; font-weight: bold"
|
||||
>
|
||||
费用结算
|
||||
|
|
@ -922,8 +922,8 @@ const dialogFormVisibleSettleRepair: any = ref(false)
|
|||
<el-button
|
||||
v-if="goods.orderStatus=='6'"
|
||||
@click="handleViewRepair(j)"
|
||||
type="text"
|
||||
size="mini"
|
||||
type="primary"
|
||||
size="small"
|
||||
style="color: #blue; font-weight: bold"
|
||||
>
|
||||
检修详情
|
||||
|
|
@ -931,8 +931,8 @@ const dialogFormVisibleSettleRepair: any = ref(false)
|
|||
<el-button
|
||||
v-if="goods.orderStatus=='6'"
|
||||
@click="handleViewList(j)"
|
||||
type="text"
|
||||
size="mini"
|
||||
type="primary"
|
||||
size="small"
|
||||
style="color: #blue; font-weight: bold"
|
||||
>
|
||||
费用清单
|
||||
|
|
@ -943,8 +943,8 @@ const dialogFormVisibleSettleRepair: any = ref(false)
|
|||
</div>
|
||||
<PagingComponent
|
||||
@getList="getList"
|
||||
:pageSize="pageSize"
|
||||
:pageNumber="pageNumber"
|
||||
v-model:pageSize="queryParams.pageSize"
|
||||
v-model:currentPage="queryParams.pageNumber"
|
||||
:total="total"
|
||||
/>
|
||||
|
||||
|
|
@ -1216,7 +1216,7 @@ const dialogFormVisibleSettleRepair: any = ref(false)
|
|||
<el-dialog
|
||||
v-model="dialogFormVisibleSettlemoney"
|
||||
:title="settlemoneyTitle"
|
||||
width="60%"
|
||||
width="65%"
|
||||
align-center
|
||||
:close-on-click-modal="false"
|
||||
>
|
||||
|
|
@ -1536,7 +1536,7 @@ const dialogFormVisibleSettleRepair: any = ref(false)
|
|||
<el-dialog
|
||||
v-model="dialogFormVisibleSettleList"
|
||||
:title="settleListTitle"
|
||||
width="60%"
|
||||
width="65%"
|
||||
align-center
|
||||
:close-on-click-modal="false">
|
||||
<div style="height: 80px">
|
||||
|
|
@ -1689,7 +1689,7 @@ const dialogFormVisibleSettleRepair: any = ref(false)
|
|||
<el-dialog
|
||||
v-model="dialogFormVisibleSettleRepair"
|
||||
:title="settleRepairTitle"
|
||||
width="60%"
|
||||
width="65%"
|
||||
:close-on-click-modal="false">
|
||||
<div style="height: 80px">
|
||||
<div
|
||||
|
|
@ -1906,12 +1906,12 @@ const dialogFormVisibleSettleRepair: any = ref(false)
|
|||
align-content: center;
|
||||
|
||||
img {
|
||||
width: 140px;
|
||||
width: 180px;
|
||||
height: 80px;
|
||||
}
|
||||
|
||||
.goods-code {
|
||||
margin-left: 70px;
|
||||
margin-left: 110px;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-around;
|
||||
|
|
|
|||
Loading…
Reference in New Issue