<template>
	<view class="safe-area-inset-bottom">
		<view class="white">
			<u-tabs :list="tabs" inactive-color="#6C7380" :is-scroll="false" :current="current" @change="current=$event"></u-tabs>
		</view>
		<view class="p-2">
			<view class="flex-col b-r-8 white p-32 m-b-16" v-for="(item,index) in setList" :key="index">
				<view class="flex-row flex-jus-sp flex-ali-center">
					<d-text text="图文问诊" className="fs-32 content-c" v-if="item.type==0"></d-text>
					<d-text text="视频问诊" className="fs-32 content-c" v-if="item.type==1"></d-text>
					<d-text :text="'+'+item.money" className="fs-32" color="#F44336"></d-text>
				</view>
				<view class="flex-row flex-jus-sp flex-ali-center m-t-2">
					<view class="flex-row flex-ali-center">
						<d-text :text="'订单编号：'+item.number" className="content-c m-r08"></d-text>
						<image src="../../../static/image/fz.png" style="width: 32rpx;height: 32rpx;"></image>
					</view>
					<u-tag :text="status[item.status].text" :color="status[item.status].color"
						:bgColor="status[item.status].bg" mode="dark" />
				</view>
				<view class="flex-row m-t-2">
					<d-text :text="'支付时间：'+$u.timeFormat(item.time, 'yyyy-mm-dd hh:MM')" className="fs-24 content-c">
					</d-text>
				</view>
			</view>
		</view>
		<d-loading-page :loading="loading"></d-loading-page>
		<view class="flex-row flex-jus-center box" v-if="!loading&&list.length==0">
			<d-empty text="暂无记录" mode="search"></d-empty>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				current: 0,
				tabs: [{
					name: '全部'
				}, {
					name: '待结算'
				}, {
					name: '已结算'
				}, {
					name: '已取消'
				}],
				status: {
					1: {
						text: '待结算',
						color: '#2979FF',
						bg: '#EAF2FF'
					},
					2: {
						text: '已结算',
						color: '#00C853',
						bg: '#E6FAEE'
					},
					3: {
						text: '已取消',
						color: '#A7ABB0',
						bg: '#F3F4F5'
					}
				},
				loading: true,
				list: [{
					money: 100,
					status: 1,
					time: '1670551688',
					number: '95656565265656566',
					type: 1
				}, {
					money: 2100,
					status: 3,
					time: '1670581688',
					number: '95656565265656566',
					type: 0
				}, {
					money: 1100,
					status: 2,
					time: '1670531688',
					number: '95656565265656566',
					type: 0
				}]
			};
		},
		computed: {
			setList() {
				return this.current == 0 ? this.list : this.list.filter(item => item['status'] == this.current)
			}
		},
		created() {
			this.loading = false
		},
		onShow() {},
		onHide() {},
		methods: {

		}
	};
</script>
<style>
	page {
		background-color: #F9FAFB;
	}
</style>
<style lang="scss" scoped>
</style>
