jinjian1.1/pages/mine/history.vue

163 lines
4.4 KiB
Vue
Raw Permalink Normal View History

2024-11-05 16:29:09 +08:00
<template>
<view class="">
<u-subsection :list="list" fontSize='30' :current="current" @change="sectionChange"></u-subsection>
<scroll-view :scroll-y="true" upper-threshold='100'>
<view class="main">
<block v-for="(item, index) in content" :key="index">
<view class="list u-padding-10">
<u-row gutter="16">
<u-col span="4">
<image class="img" :src="item.img"></image>
</u-col>
<u-col span="8">
<u-row align="center" class="center">
<u-col>
<view class="title">
{{ item.title }}
</view>
</u-col>
<u-col>
<view class="date">
进件日期 {{ item.date }}
</view>
</u-col>
<u-col>
<view class="status">
进件状态<span :style="'color:'+item.color+';'">{{item.status}}</span>
</view>
</u-col>
</u-row>
</u-col>
</u-row>
</view>
</block>
</view>
</scroll-view>
</view>
</template>
<script>
export default {
data() {
return { //审核中包含 1进件中我们平台审核、2审核中银盛审核、3待签约银盛审核
list: ['审核中', '已审核', '已驳回'],
current: 0,
content: [{
img: 'https://yuledui.oss-cn-qingdao.aliyuncs.com/oss/uploads/2023-12-18/af4d4fff602033f59678d149faafcafe_20231218123312.jpg',
date: '2021年12月20日',
color: '#01BEFF',
title: '兔喜喜便利店',
status: "进件中",
channel: "邮储"
},
{
img: 'https://yuledui.oss-cn-qingdao.aliyuncs.com/oss/uploads/2023-07-04/b7919f8c7136c847f915eaf8140b182b_20230704090103.jpg',
date: '2021年12月20日',
color: '#01BEFF',
title: '李沧区孙鹏海产品店',
status: "进件中",
channel: "邮储"
},
{
img: 'https://yuledui.oss-cn-qingdao.aliyuncs.com/oss/uploads/2023-07-04/9c7e5cdd3ec31191817a082365dcd786_20230704081852.jpg',
date: '2021年12月20日',
color: 'blue',
title: '李沧区润香斋食品店',
status: "审核中",
channel: "邮储"
},
{
img: 'https://yuledui.oss-cn-qingdao.aliyuncs.com/oss/uploads/2023-06-05/4ca1fa6d68de8d807b827a7e25fe7be6_20230605163954.jpg',
date: '2021年12月20日',
color: 'green',
title: '小微商户王子健',
status: "已完成",
channel: "邮储"
},
{
img: 'https://yuledui.oss-cn-qingdao.aliyuncs.com/oss/uploads/2023-05-30/9f82f990684d3e7f22ab4fe4f13a0123_20230530162735.jpg',
date: '2021年12月20日',
color: 'orange',
title: '李沧区背包熊餐饮店',
status: "审核中",
channel: "微信"
},
{
img: 'https://yuledui.oss-cn-qingdao.aliyuncs.com/oss/uploads/2023-05-23/01e15bfc4b896317dca7e419605a3fcb_20230523151303.jpg',
date: '2021年12月20日',
color: 'purplered',
title: '李沧区丽语胜面食店',
status: "已驳回",
channel: "微信"
},
{
img: 'https://yuledui.oss-cn-qingdao.aliyuncs.com/oss/uploads/2023-05-23/8774d84e2ad0528d97236633a93c1f01_20230523135332.jpg',
date: '2021年12月20日',
color: 'purple',
title: '小微商户鲍贵枝',
status: "待账户验证",
channel: "微信"
},
{
img: 'https://yuledui.oss-cn-qingdao.aliyuncs.com/oss/uploads/2023-05-17/b8c9c87ad06dc2392cd893f4637b783f_20230517114243.jpg',
date: '2021年12月20日',
color: 'brown',
title: '李沧区君乐唯蔬菜行',
status: "待签约",
channel: "微信"
}
],
}
},
methods: {
sectionChange(index) {
this.current = index;
}
}
}
</script>
<style scoped lang="scss">
.center {
align-items: center;
justify-content: flex-start;
display: flex !important;
flex-direction: column !important;
margin-left: 25rpx;
}
/deep/.u-subsection--button{
position: fixed;
z-index: 11;
}
.main {
background-color: #F4F4F4;
padding-top: 60rpx;
font-size: 26rpx;
}
.main .list {
margin-top: 10rpx;
background-color: #ffffff;
}
.main .list .img {
width: 230rpx;
height: 160rpx;
border-radius: 14rpx;
}
.u-padding-10 {
padding: 30rpx !important;
}
.main .list .title,
.main .list .date,
.main .list .status {
height: 55rpx;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
line-height: 55rpx !important;
}
</style>