48 lines
2.0 KiB
Vue
48 lines
2.0 KiB
Vue
<template>
|
|
<view class="page-container">
|
|
<scroll-view class="page-body" scroll-y>
|
|
<view class="tabs">
|
|
<view class="tab" :class="{ active: currentTab === 0 }" @click="currentTab = 0">待提交</view>
|
|
<view class="tab" :class="{ active: currentTab === 1 }" @click="currentTab = 1">已提交</view>
|
|
<view class="tab" :class="{ active: currentTab === 2 }" @click="currentTab = 2">已完成</view>
|
|
</view>
|
|
<view class="data-list">
|
|
<view class="data-card" v-for="(item, index) in filteredList" :key="index">
|
|
<view class="data-card-header">
|
|
<text class="data-card-title">{{ item.code }}</text>
|
|
<text class="data-card-tag" :class="item.statusClass">{{ item.status }}</text>
|
|
</view>
|
|
<view class="data-card-row"><text>危废名称</text><text class="val">{{ item.name }}</text></view>
|
|
<view class="data-card-row"><text>转移重量</text><text class="val">{{ item.weight }}</text></view>
|
|
<view class="data-card-row" v-if="item.receiver"><text>接收单位</text><text class="val">{{ item.receiver }}</text></view>
|
|
<view class="data-card-row"><text>{{ item.timeLabel }}</text><text class="val">{{ item.time }}</text></view>
|
|
</view>
|
|
</view>
|
|
</scroll-view>
|
|
</view>
|
|
</template>
|
|
|
|
<script>
|
|
import { api } from '@/api/index'
|
|
export default {
|
|
data() {
|
|
return {
|
|
currentTab: 0,
|
|
dataList: [
|
|
{ code: 'LD20260514001', name: '感染性废物', weight: '5.60 KG', receiver: '上海XX环保处置公司', status: '待提交', statusClass: 'orange', timeLabel: '创建时间', time: '05-14 14:30' },
|
|
{ code: 'LD20260513001', name: '损伤性废物', weight: '3.10 KG', receiver: '', status: '已提交', statusClass: 'blue', timeLabel: '提交时间', time: '05-13 16:50' }
|
|
]
|
|
}
|
|
},
|
|
computed: {
|
|
filteredList() {
|
|
const statusMap = ['待提交', '已提交', '已完成']
|
|
return this.dataList.filter(item => item.status === statusMap[this.currentTab])
|
|
}
|
|
},
|
|
methods: {
|
|
|
|
}
|
|
}
|
|
</script>
|