122 lines
3.1 KiB
Vue
122 lines
3.1 KiB
Vue
<template>
|
||
<view class="carDetails">
|
||
<view class="container">
|
||
<view class="ul">
|
||
<view class="li">船名：运程10</view>
|
||
<view class="li">航次：HC97759809</view>
|
||
<view class="li">贸易类型：外贸</view>
|
||
<view class="li">进出口：进口</view>
|
||
<view class="li">港口：巴塞罗那</view>
|
||
<view class="li">提单号：TD6955975087</view>
|
||
<view class="li">报关状态：未报关</view>
|
||
<view class="li">报关单号：TD6955975087</view>
|
||
<view class="li">场位：c4区15道*2</view>
|
||
<view class="li">货代：上海海通国际汽车物流有限公司</view>
|
||
<view class="li">联系人：张星星</view>
|
||
<view class="li">联系方式：13266688888</view>
|
||
<view class="li">品牌：特斯拉</view>
|
||
<view class="li">车型：轿车</view>
|
||
<view class="li">车型明细：轿车</view>
|
||
<view class="li">型号：STAY-CONNECTB</view>
|
||
<view class="li">源类型：新能源</view>
|
||
<view class="li">数量：199</view>
|
||
<view class="li">车长：199</view>
|
||
<view class="li">车宽：199</view>
|
||
<view class="li">车高：100</view>
|
||
<view class="li">重量：1978</view>
|
||
<view class="li">体积：979</view>
|
||
<view class="li">单票数量：100</view>
|
||
<view class="li">单票重量：1978</view>
|
||
<view class="li">单票体积：979</view>
|
||
</view>
|
||
<view class="tableInfo">
|
||
<view class="title">车架号明细</view>
|
||
<uni-table ref="table" :loading="loading" border emptyText="暂无更多数据">
|
||
<uni-tr>
|
||
<uni-th width="150" align="center">序号</uni-th>
|
||
<uni-th align="center">车架号/条形码</uni-th>
|
||
<uni-th align="center">场位</uni-th>
|
||
</uni-tr>
|
||
<uni-tr v-for="(item, index) in tableData" :key="index">
|
||
<uni-td align="center">{{ item.id }}</uni-td>
|
||
<uni-td align="center">{{item.vinCod}}</uni-td>
|
||
<uni-td align="center">{{ item.field }}</uni-td>
|
||
</uni-tr>
|
||
</uni-table>
|
||
<view class="pagination">
|
||
<uni-pagination :total="total" :pageSize="pageSize" v-model="pageCurrent" title="标题文字" />
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</view>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
data() {
|
||
return {
|
||
tableData: [{
|
||
id: "01",
|
||
vinCod: "CJH67892734895917",
|
||
field: "A1-09-03"
|
||
}, {
|
||
id: "02",
|
||
vinCod: "CJH67892734895917",
|
||
field: "A1-09-03"
|
||
}, {
|
||
id: "03",
|
||
vinCod: "CJH67892734895917",
|
||
field: "A1-09-03"
|
||
}],
|
||
loading: false,
|
||
// 每页数据量
|
||
pageSize: 20,
|
||
// 当前页
|
||
pageCurrent: 1,
|
||
// 数据总量
|
||
total: 50,
|
||
}
|
||
},
|
||
methods: {},
|
||
}
|
||
</script>
|
||
|
||
<style lang="less" scoped>
|
||
.carDetails {
|
||
.container {
|
||
padding: 30px 20px;
|
||
background-color: #fff;
|
||
|
||
.ul {
|
||
display: flex;
|
||
flex-wrap: wrap;
|
||
padding: 20px;
|
||
border-bottom: 1px solid #ccc;
|
||
|
||
.li {
|
||
width: 32%;
|
||
font-weight: bold;
|
||
margin-bottom: 10px;
|
||
}
|
||
}
|
||
|
||
.tableInfo {
|
||
padding: 20px;
|
||
|
||
.title {
|
||
font-size: 16px;
|
||
font-weight: bold;
|
||
margin-bottom: 20px;
|
||
}
|
||
|
||
/deep/.uni-table-th {
|
||
background-color: #fafafa;
|
||
}
|
||
|
||
.pagination {
|
||
margin-top: 10px;
|
||
}
|
||
}
|
||
}
|
||
}
|
||
</style> |