98 lines
2.0 KiB
Vue
98 lines
2.0 KiB
Vue
<template>
|
|
<view class="content">
|
|
<view class="u-page">
|
|
<u-subsection :list="list1" :current="curNow" @change="sectionChange"></u-subsection>
|
|
<view class="list">
|
|
<text>司机姓名</text>
|
|
<text>危化物名称</text>
|
|
<text>提交时间</text>
|
|
<text>审核状态</text>
|
|
</view>
|
|
|
|
<u-list @scrolltolower="scrolltolower">
|
|
<u-list-item v-for="(item, index) in indexList" :key="index">
|
|
|
|
|
|
<view class="list">
|
|
<u-avatar slot="icon" shape="square" size="35" :src="item.url"
|
|
customStyle="margin: -3px 5px -3px 0"></u-avatar>
|
|
|
|
<text>{{item.name}}</text>
|
|
<text>{{item.huowu}}</text>
|
|
<text class="time">{{item.time}}</text>
|
|
|
|
<u-tag text="待审核" class="tag" size="mini" type="warning" v-if="item.status == 1"></u-tag>
|
|
<u-tag text="通过" class="tag" size="mini" type="success" v-if="item.status == 2"></u-tag>
|
|
<u-tag text="拒绝" class="tag" size="mini" type="error" v-if="item.status == 3"></u-tag>
|
|
</view>
|
|
</u-list-item>
|
|
</u-list>
|
|
</view>
|
|
</view>
|
|
</template>
|
|
|
|
<!--
|
|
|
|
登录注册
|
|
绑定车牌 -》 车辆码 -》违章信息
|
|
上传运单
|
|
|
|
-->
|
|
<script>
|
|
export default {
|
|
data() {
|
|
return {
|
|
indexList: [],
|
|
list1: ['全部', '待审核', '通过', '拒绝'],
|
|
curNow: 0
|
|
}
|
|
},
|
|
onLoad() {
|
|
this.loadmore();
|
|
},
|
|
methods: {
|
|
scrolltolower() {
|
|
this.loadmore();
|
|
},
|
|
loadmore() {
|
|
for (let i = 0; i < 30; i++) {
|
|
this.indexList.push({
|
|
name: '司机姓名' + (i + 1),
|
|
status: Math.floor(Math.random() * 3) + 1,
|
|
huowu: '危化物名称',
|
|
time: '2025-07-11 8:00'
|
|
});
|
|
}
|
|
},
|
|
sectionChange(index) {
|
|
this.curNow = index;
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style>
|
|
.list {
|
|
border-bottom: 1px solid #6666661a;
|
|
display: flex;
|
|
flex-direction: row;
|
|
align-items: center;
|
|
justify-content: space-between;
|
|
padding: 10px;
|
|
}
|
|
|
|
.time {
|
|
font-size: 12px;
|
|
}
|
|
|
|
.tag {
|
|
width: 50px;
|
|
}
|
|
|
|
.u-tabs__wrapper__nav {
|
|
display: flex;
|
|
flex-direction: row;
|
|
position: relative;
|
|
justify-content: space-between;
|
|
}
|
|
</style> |