123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141 |
- <template>
- <view class="u-page">
- <u--input placeholder="请输入手机号或订单" prefixIcon="search" prefixIconStyle="font-size: 22px;color: #909399"
- v-model="value"></u--input>
- <u-list @scrolltolower="scrolltolower">
- <u-cell label="待评价">
- <view slot="title" class="u-slot-title">
- <text class="u-cell-text">01-2000-210507-00370</text>
- <u-tag text="已审核" size="mini">
- </u-tag>
- </view>
- </u-cell>
- <u-cell value="物流轨迹" :isLink="true" label="待评价">
- <view slot="title" class="u-slot-title">
- <text class="u-cell-text">01-2000-210507-00371</text>
- <u-tag text="运输中" size="mini" type="warning">
- </u-tag>
- </view>
- </u-cell>
- <u-cell value="签收详情" :isLink="true" label="已评价">
- <view slot="title" class="u-slot-title">
- <text class="u-cell-text">01-2000-210507-00372</text>
- <u-tag text="已签收" size="mini" type="success">
- </u-tag>
- </view>
- </u-cell>
- <!-- <u-list-item v-for="(item, index) in indexList" :key="index"
- <u-cell :title="`列表长度-${index + 1}`">
- <u-avatar slot="icon" shape="square" size="35" :src="item.url"
- customStyle="margin: -3px 5px -3px 0"></u-avatar>
- </u-cell>
- </u-list-item> -->
- </u-list>
- </view>
- </template>
- <script>
- import { getOrderList } from '@/api/index.js';
- export default {
- data() {
- return {
- value: '',
- indexList: [],
- urls: [
- "https://xxx.com/album/1.jpg",
- "https://xxx.com/album/2.jpg",
- "https://xxx.com/album/3.jpg",
- "https://xxx.com/album/4.jpg",
- "https://xxx.com/album/5.jpg",
- "https://xxx.com/album/6.jpg",
- "https://xxx.com/album/7.jpg",
- "https://xxx.com/album/8.jpg",
- "https://xxx.com/album/9.jpg",
- "https://xxx.com/album/10.jpg",
- ],
- };
- },
- created() {
- },
- onLoad() {
- this.loadmore();
- },
- methods: {
- scrolltolower() {
- this.loadmore();
- },
- loadmore() {
- for (let i = 0; i < 30; i++) {
- this.indexList.push({
- url: this.urls[uni.$u.random(0, this.urls.length - 1)],
- });
- }
- },
- change(e) {
- console.log('change', e);
- }
- },
- };
- </script>
- <style lang="scss">
- .cell-page {
- padding-bottom: 20px;
- }
- .cell-box {
- &__title {
- font-size: 14px;
- color: rgb(143, 156, 162);
- margin: 20px 0px 0px 15px;
- }
- &__block {
- // background-color: #fff;
- margin-top: 20px;
- }
- }
- .u-page {
- padding: 0;
- &__item {
- &__title {
- color: $u-tips-color;
- background-color: $u-bg-color;
- padding: 15px;
- font-size: 15px;
- &__slot-title {
- color: $u-primary;
- font-size: 14px;
- }
- }
- }
- }
- .u-slot-title {
- @include flex;
- flex-direction: row;
- align-items: center;
- }
- .u-cell-text {
- font-size: 15px;
- line-height: 22px;
- color: #303133;
- margin-right: 5px;
- }
- .u-slot-value {
- line-height: 17px;
- text-align: center;
- font-size: 10px;
- padding: 0 5px;
- height: 17px;
- color: #FFFFFF;
- border-radius: 100px;
- background-color: #f56c6c;
- }
- </style>
|