|
@@ -1,336 +0,0 @@
|
|
|
-<template>
|
|
|
- <view class="content">
|
|
|
- <view class="top">
|
|
|
- <u-search shape="square" :show-action="false" placeholder="品牌/车系" @focus="toChange"></u-search>
|
|
|
- </view>
|
|
|
- <view class="bottom">
|
|
|
- <scroll-view scroll-y="true" class="scroll-view" @scrolltolower="toPage">
|
|
|
- <view class="list-scroll-view">
|
|
|
- <view class="one">
|
|
|
- <view class="one_1">
|
|
|
- <view class="list" v-for="(item, index) in $config.searchList" :key="index"
|
|
|
- @tap="toRoute(item)">
|
|
|
- <view class="icon">
|
|
|
- <text class="t-icon" :class="item.icon"></text>
|
|
|
- </view>
|
|
|
- <view class="title">{{item.title||'暂无'}}</view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="one_1 one_2">
|
|
|
- <view class="list" v-for="(item, index) in carList" :key="index" @tap="toCommon(item,'0')">
|
|
|
- <view class="icon">
|
|
|
- <image class="image"
|
|
|
- :src="item.logo&&item.logo.length>0?item.logo[0].url:'/static/logo.png'">
|
|
|
- </image>
|
|
|
- </view>
|
|
|
- <view class="title">{{item.name}}</view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="one_1 one_3">
|
|
|
- <view class="list" v-for="(item, index) in typeList" :key="index" @tap="toCommon(item,'1')">
|
|
|
- <view class="name">{{item.title||'暂无'}}</view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="two">
|
|
|
- <view class="list" v-for="(item, index) in list" :key="index" @tap="toView(item)">
|
|
|
- <view class="left">
|
|
|
- <image class="image" :src="item.file&&item.file.length>0?item.file[0].url:''">
|
|
|
- </image>
|
|
|
- </view>
|
|
|
- <view class="right">
|
|
|
- <view class="name textOver">{{item.series||'暂无'}} {{item.year||'暂无'}}款
|
|
|
- {{item.style||'暂无'}}
|
|
|
- </view>
|
|
|
- <view class="other">
|
|
|
- <text v-if="item.year">{{item.year||'暂无'}}年 | </text>
|
|
|
- <text v-if="item.mileage">{{item.mileage||'暂无'}}万公里 | </text>
|
|
|
- <text v-if="item.place">{{item.place||'暂无'}}</text>
|
|
|
- </view>
|
|
|
- <view class="money">
|
|
|
- <text>{{item.total_money||'0'}}</text>
|
|
|
- <text>万</text>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="is_bottom" v-if="is_bottom">
|
|
|
- <text>{{config.bottom_title||'没有更多了!'}}</text>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </scroll-view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
-</template>
|
|
|
-
|
|
|
-<script setup lang="ts">
|
|
|
- import { getCurrentInstance, ref } from 'vue';
|
|
|
- //该依赖已内置不需要单独安装
|
|
|
- import { onShow, onPullDownRefresh } from "@dcloudio/uni-app";
|
|
|
- // 请求接口
|
|
|
- const $api = getCurrentInstance()?.appContext.config.globalProperties.$api;
|
|
|
- const $config = getCurrentInstance()?.appContext.config.globalProperties.$config;
|
|
|
- // 基本信息
|
|
|
- const config = ref({ logoUrl: [] });
|
|
|
- // 列表
|
|
|
- const list = ref([]);
|
|
|
- const total = ref(0);
|
|
|
- const skip = ref(0);
|
|
|
- const limit = ref(6);
|
|
|
- const page = ref(0);
|
|
|
- // 数据是否触底
|
|
|
- const is_bottom = ref(false);
|
|
|
- const scrollTop = ref(0);
|
|
|
- // 字典表
|
|
|
- const typeList = ref([
|
|
|
- {
|
|
|
- title: '5万以下',
|
|
|
- type: '0',
|
|
|
- },
|
|
|
- {
|
|
|
- title: '5-10万',
|
|
|
- type: '1',
|
|
|
- },
|
|
|
- {
|
|
|
- title: '10-15万',
|
|
|
- type: '2',
|
|
|
- },
|
|
|
- {
|
|
|
- title: '更多条件',
|
|
|
- type: '3',
|
|
|
- }
|
|
|
- ])
|
|
|
- const carList = ref([])
|
|
|
- onShow(async () => {
|
|
|
- await searchOther();
|
|
|
- await searchConfig();
|
|
|
- await clearPage();
|
|
|
- await search();
|
|
|
- })
|
|
|
- onPullDownRefresh(async () => {
|
|
|
- await clearPage();
|
|
|
- await searchOther();
|
|
|
- await search();
|
|
|
- uni.stopPullDownRefresh();
|
|
|
- })
|
|
|
- const searchOther = async () => {
|
|
|
- let res;
|
|
|
- // 品牌
|
|
|
- res = await $api(`brand`, 'GET', { skip: 0, limit: 4, is_use: '0' });
|
|
|
- if (res.errcode === 0) carList.value = res.data;
|
|
|
- carList.value.push({
|
|
|
- name: '更多品牌',
|
|
|
- type: '4',
|
|
|
- })
|
|
|
- };
|
|
|
- // config信息
|
|
|
- const searchConfig = async () => {
|
|
|
- config.value = uni.getStorageSync('config');
|
|
|
- };
|
|
|
- // 查询
|
|
|
- const search = async () => {
|
|
|
- const info = {
|
|
|
- skip: skip.value,
|
|
|
- limit: limit.value,
|
|
|
- status: '0'
|
|
|
- }
|
|
|
- const res = await $api('car', 'GET', info);
|
|
|
- if (res.errcode === 0) {
|
|
|
- list.value = list.value.concat(res.data)
|
|
|
- total.value = res.total
|
|
|
- } else {
|
|
|
- uni.showToast({
|
|
|
- title: res.errmsg || '',
|
|
|
- icon: 'error',
|
|
|
- });
|
|
|
- }
|
|
|
- };
|
|
|
- // 搜索
|
|
|
- const toChange = () => {
|
|
|
- uni.navigateTo({
|
|
|
- url: `/pagesHome/type/index`
|
|
|
- })
|
|
|
- };
|
|
|
- const toRoute = (item) => {
|
|
|
- uni.navigateTo({
|
|
|
- url: `/${item.route}`,
|
|
|
- })
|
|
|
- };
|
|
|
- const toCommon = (item, type) => {
|
|
|
- if (type == '0') {
|
|
|
- if (item.type == '4') {
|
|
|
- uni.navigateTo({
|
|
|
- url: `/pagesHome/brand/index?type=${item.type}`,
|
|
|
- })
|
|
|
- } else {
|
|
|
- uni.navigateTo({
|
|
|
- url: `/pagesHome/search/index?brand=${item.name}`,
|
|
|
- })
|
|
|
- }
|
|
|
- } else {
|
|
|
- if (item.type == '3') {
|
|
|
- uni.navigateTo({
|
|
|
- url: `/pagesHome/search/index?type=${item.type}`,
|
|
|
- })
|
|
|
- } else {
|
|
|
- uni.navigateTo({
|
|
|
- url: `/pagesHome/search/index?money=${item.title}`,
|
|
|
- })
|
|
|
- }
|
|
|
- }
|
|
|
- };
|
|
|
- // 查看详情
|
|
|
- const toView = (item) => {
|
|
|
- uni.navigateTo({
|
|
|
- url: `/pagesHome/car/index?id=${item.id || item._id}`
|
|
|
- })
|
|
|
- };
|
|
|
- // 分页
|
|
|
- const toPage = () => {
|
|
|
- if (total.value > list.value.length) {
|
|
|
- uni.showLoading({
|
|
|
- title: '加载中',
|
|
|
- mask: true
|
|
|
- })
|
|
|
- page.value = page.value + 1;
|
|
|
- skip.value = page.value * limit.value;
|
|
|
- search();
|
|
|
- uni.hideLoading();
|
|
|
- } else is_bottom.value = true
|
|
|
- };
|
|
|
- // 清空列表
|
|
|
- const clearPage = () => {
|
|
|
- list.value = []
|
|
|
- skip.value = 0
|
|
|
- limit.value = 6
|
|
|
- page.value = 0
|
|
|
- };
|
|
|
-</script>
|
|
|
-<style lang="scss" scoped>
|
|
|
- .content {
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- width: 100vw;
|
|
|
- height: 100vh;
|
|
|
-
|
|
|
- .top {
|
|
|
- margin: 2vw;
|
|
|
- }
|
|
|
-
|
|
|
- .bottom {
|
|
|
- position: relative;
|
|
|
- flex-grow: 1;
|
|
|
-
|
|
|
- .one {
|
|
|
-
|
|
|
- .one_1 {
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- align-items: center;
|
|
|
- padding: 2vw 4vw;
|
|
|
-
|
|
|
- .list {
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- align-items: center;
|
|
|
-
|
|
|
- .title {
|
|
|
- margin: 1vw 0 0 0;
|
|
|
- font-size: var(--font14Size);
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .one_2 {
|
|
|
- .image {
|
|
|
- width: 35px;
|
|
|
- height: 35px;
|
|
|
- border-radius: 35px;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .one_3 {
|
|
|
- padding: 2vw;
|
|
|
-
|
|
|
- .list {
|
|
|
- background-color: var(--f9Color);
|
|
|
-
|
|
|
- .name {
|
|
|
- padding: 2vw 4vw;
|
|
|
- font-size: var(--font14Size);
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .two {
|
|
|
- margin: 2vw;
|
|
|
-
|
|
|
- .list {
|
|
|
- display: flex;
|
|
|
- margin: 1vw 0 0 0;
|
|
|
- padding: 1vw;
|
|
|
-
|
|
|
- .left {
|
|
|
- .image {
|
|
|
- width: 130px;
|
|
|
- height: 100px;
|
|
|
- border-radius: 2px;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .right {
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- justify-content: space-between;
|
|
|
- margin: 0 0 0 2vw;
|
|
|
- width: 100%;
|
|
|
-
|
|
|
- .name {
|
|
|
- font-size: var(--font14Size);
|
|
|
- }
|
|
|
-
|
|
|
- .other {
|
|
|
- color: var(--f85Color);
|
|
|
- font-size: var(--font12Size);
|
|
|
- }
|
|
|
-
|
|
|
- .money {
|
|
|
- color: var(--fF0Color);
|
|
|
- font-size: var(--font12Size);
|
|
|
-
|
|
|
- text:first-child {
|
|
|
- font-size: var(--font18Size);
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .scroll-view {
|
|
|
- position: absolute;
|
|
|
- top: 0;
|
|
|
- left: 0;
|
|
|
- right: 0;
|
|
|
- bottom: 0;
|
|
|
-
|
|
|
- .list-scroll-view {
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .is_bottom {
|
|
|
- width: 100%;
|
|
|
- text-align: center;
|
|
|
-
|
|
|
- text {
|
|
|
- padding: 2vw 0;
|
|
|
- display: inline-block;
|
|
|
- color: var(--f85Color);
|
|
|
- font-size: var(--font12Size);
|
|
|
- }
|
|
|
- }
|
|
|
-</style>
|