|
@@ -1,666 +0,0 @@
|
|
|
-<template>
|
|
|
- <view class="content">
|
|
|
- <view class="info">
|
|
|
- <scroll-view scroll-y="true" class="scroll-view" @scrolltolower="toPage">
|
|
|
- <view class="list-scroll-view">
|
|
|
- <view class="top">
|
|
|
- <image class="image"
|
|
|
- :src="shop.logo&&shop.logo?.length>0?shop.logo[0].url:'https://cdn.uviewui.com/uview/album/1.jpg'" />
|
|
|
- </view>
|
|
|
- <view class="bottom">
|
|
|
- <view class="one">
|
|
|
- <view class="name">
|
|
|
- {{shop.name||'暂无'}}
|
|
|
- </view>
|
|
|
- <view class="other">
|
|
|
- <view class="left">
|
|
|
- <view class="left_1">
|
|
|
- <span>在售 {{shop.sale||'0'}} 辆</span>
|
|
|
- |
|
|
|
- <span>已售 {{shop.sold||'0'}} 辆</span>
|
|
|
- </view>
|
|
|
- <view class="left_2">
|
|
|
- <span>{{shop.status=='0'?'营业中':'休息中'}}</span>
|
|
|
- <span>{{shop.start_time||'8:00'}}-{{shop.end_time||'17:00'}}</span>
|
|
|
- </view>
|
|
|
- <view class="left_3" @tap="toImage">
|
|
|
- <u-icon name="file-text" size="16"></u-icon>
|
|
|
- <text>营业执照</text>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="center">
|
|
|
- <u-line direction="col"></u-line>
|
|
|
- </view>
|
|
|
- <view class="right">{{shop.address||'暂无'}}</view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="two">
|
|
|
- <view class="search">
|
|
|
- <view class="searchlist" v-for="(item, index) in searchList" :key="index"
|
|
|
- @tap="toSearch(item)">
|
|
|
- <view :class="[item.is_open==false?'title_1':'title_2']">{{item.title}}</view>
|
|
|
- <u-icon color="#000" size="10px" v-if="item.is_open==false"
|
|
|
- name="arrow-down-fill"></u-icon>
|
|
|
- <u-icon color="#2979ff" size="10px" v-else name="arrow-up-fill"></u-icon>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view v-show="is_show" @tap="toClose" class="popup-layer">
|
|
|
- <view class="popup-content">
|
|
|
- <view class="search_1" v-if="type=='0'">
|
|
|
- <view class="list" v-for="(item, index) in sortList" :key="index"
|
|
|
- @tap="toSelect(item,type)">
|
|
|
- <view :class="[item.is_open==false?'title_1':'title_2']">{{item.title}}
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="search_1" v-else-if="type=='2'">
|
|
|
- <view class="list" v-for="(item, index) in moneyList" :key="index"
|
|
|
- @tap="toSelect(item,type)">
|
|
|
- <view :class="[item.is_open==false?'title_1':'title_2']">{{item.title}}
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="search_1" v-else-if="type=='3'">
|
|
|
- <view class="list" v-for="(item, index) in yearList" :key="index"
|
|
|
- @tap="toSelect(item,type)">
|
|
|
- <view :class="[item.is_open==false?'title_1':'title_2']">{{item.title}}
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="search_1" v-else>
|
|
|
- <view class="list" v-for="(item, index) in yearList" :key="index"
|
|
|
- @tap="toSelect(item,type)">
|
|
|
- <view :class="[item.is_open==false?'title_1':'title_2']">{{item.title}}
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <view class="search_2" v-if="searchInfo.brand||searchInfo.money||moreList.length>0">
|
|
|
- <view class="left">
|
|
|
- <scroll-view scroll-x="true">
|
|
|
- <view class="scroll">
|
|
|
- <view v-if="searchInfo&&searchInfo.brand" class="title"
|
|
|
- @tap="toDelete({},'0')">
|
|
|
- <span>{{searchInfo.brand}}</span>
|
|
|
- <u-icon color="#000" size="14px" name="close"></u-icon>
|
|
|
- </view>
|
|
|
- <view v-if="searchInfo&&searchInfo.money" class="title"
|
|
|
- @tap="toDelete({},'1')">
|
|
|
- <span>{{searchInfo.money}}</span>
|
|
|
- <u-icon color="#000" size="14px" name="close"></u-icon>
|
|
|
- </view>
|
|
|
- <view v-if="searchInfo&&searchInfo.year" class="title"
|
|
|
- @tap="toDelete({},'2')">
|
|
|
- <span>{{searchInfo.year}}</span>
|
|
|
- <u-icon color="#000" size="14px" name="close"></u-icon>
|
|
|
- </view>
|
|
|
- <view v-if="moreList.length>0" class="title"
|
|
|
- v-for="(item, index) in moreList" :key="index"
|
|
|
- @tap="toDelete(item,'3')">
|
|
|
- <span>{{item.title}}</span>
|
|
|
- <u-icon color="#000" size="14px" name="close"></u-icon>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </scroll-view>
|
|
|
- </view>
|
|
|
- <view class="right">
|
|
|
- <view class="right_1" @tap="toReset">重置</view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- <!-- 瀑布流布局列表 -->
|
|
|
- <view class="pubuBox">
|
|
|
- <view class="pubuItem">
|
|
|
- <view class="list" v-for="(item, index) in list" :key="index" @tap="toView(item)">
|
|
|
- <view class="list_1">
|
|
|
- <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>
|
|
|
- </view>
|
|
|
- <view class="is_bottom" v-if="is_bottom">
|
|
|
- <text>{{config.bottom_title||'没有更多了!'}}</text>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
- </scroll-view>
|
|
|
- </view>
|
|
|
- <view class="foot">
|
|
|
- <u-button icon="phone" text="电话联系" size="normal" type="info" @click="toChat"></u-button>
|
|
|
- </view>
|
|
|
- </view>
|
|
|
-</template>
|
|
|
-
|
|
|
-<script setup lang="ts">
|
|
|
- import { getCurrentInstance, computed, ref } from 'vue';
|
|
|
- //该依赖已内置不需要单独安装
|
|
|
- import { onLoad, onShow } from "@dcloudio/uni-app";
|
|
|
- // 请求接口
|
|
|
- const $api = getCurrentInstance()?.appContext.config.globalProperties.$api;
|
|
|
- // openid
|
|
|
- const openid = computed(() => {
|
|
|
- return uni.getStorageSync('openid');
|
|
|
- })
|
|
|
- // 基本信息
|
|
|
- const config = ref({});
|
|
|
- const id = ref('');
|
|
|
- // 店铺
|
|
|
- const shop = ref({});
|
|
|
- const type = ref('0');
|
|
|
- const is_show = ref(false);
|
|
|
- //查询
|
|
|
- const searchList = ref([{ title: '默认排序', type: '0', is_open: false }, { title: '品牌', type: '1', is_open: false }, { title: '价格', type: '2', is_open: false }, { title: '车龄', type: '3', is_open: false }, { title: '更多筛选', type: '4', is_open: false }]);
|
|
|
- //排序
|
|
|
- const sortList = ref([{ title: '默认排序', type: '0', is_open: true }, { title: '最新上架', type: '1', is_open: false }, { title: '车龄最短', type: '2', is_open: false }, { title: '里程最少', type: '3', is_open: false }, { title: '价格最高', type: '4', is_open: false }, { title: '价格最低', type: '5', is_open: false }]);
|
|
|
- //价格
|
|
|
- const moneyList = ref([{ title: '不限价格', type: '0', is_open: true }, { title: '10万以下', type: '1', is_open: false }, { title: '10-15万', type: '2', is_open: false }, { title: '15-20万', type: '3', is_open: false }, { title: '20-25万', type: '4', is_open: false }, { title: '25-30万', type: '5', is_open: false }, { title: '30-50万', type: '6', is_open: false }, { title: '50万以上', type: '7', is_open: false }]);
|
|
|
- //车龄
|
|
|
- const yearList = ref([{ title: '不限车龄', type: '0', is_open: true }, { title: '2年以下', type: '1', is_open: false }, { title: '4年以下', type: '2', is_open: false }, { title: '6年以下', type: '3', is_open: false }]);
|
|
|
- // 选择的查询条件
|
|
|
- const searchInfo = ref({});
|
|
|
- const moreList = ref([]);
|
|
|
- // 列表
|
|
|
- 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);
|
|
|
- onLoad(async (options) => {
|
|
|
- id.value = options && options.id
|
|
|
- uni.setNavigationBarTitle({
|
|
|
- title: options && options.name || '车行详情'
|
|
|
- });
|
|
|
- await searchConfig();
|
|
|
- await search();
|
|
|
- })
|
|
|
- onShow(async () => {
|
|
|
- uni.$on('toRoute', function (data) {
|
|
|
- if (data && data.name) searchInfo.value.brand = data.name
|
|
|
- })
|
|
|
- await clearPage();
|
|
|
- await searchOther();
|
|
|
- })
|
|
|
- // config信息
|
|
|
- const searchConfig = async () => {
|
|
|
- config.value = uni.getStorageSync('config');
|
|
|
- };
|
|
|
- // 查询
|
|
|
- const search = async () => {
|
|
|
- if (id.value) {
|
|
|
- const res = await $api(`shop/${id.value}`, 'GET', {});
|
|
|
- if (res.errcode === 0) {
|
|
|
- shop.value = res.data
|
|
|
- } else {
|
|
|
- uni.showToast({
|
|
|
- title: res.errmsg || '',
|
|
|
- icon: 'error',
|
|
|
- });
|
|
|
- }
|
|
|
- }
|
|
|
- };
|
|
|
- // 查询其他信息
|
|
|
- const searchOther = async () => {
|
|
|
- let res;
|
|
|
- const info = {
|
|
|
- skip: skip.value,
|
|
|
- limit: limit.value,
|
|
|
- status: '0',
|
|
|
- shop: id.value
|
|
|
- }
|
|
|
- if (searchInfo.value.brand) info.brand = searchInfo.value.brand
|
|
|
- if (searchInfo.value.money) info.money = searchInfo.value.money
|
|
|
- if (searchInfo.value.year) info.year = searchInfo.value.year
|
|
|
- res = await $api('car', 'GET', {
|
|
|
- ...info,
|
|
|
- });
|
|
|
- if (res.errcode === 0) {
|
|
|
- list.value = list.value.concat(res.data)
|
|
|
- total.value = res.total
|
|
|
- shop.value.sale = res.total
|
|
|
- } else {
|
|
|
- uni.showToast({
|
|
|
- title: res.errmsg || '',
|
|
|
- icon: 'error',
|
|
|
- });
|
|
|
- }
|
|
|
- res = await $api('car', 'GET', {
|
|
|
- skip: 0,
|
|
|
- limit: 1,
|
|
|
- status: '0',
|
|
|
- shop: id.value
|
|
|
- });
|
|
|
- if (res.errcode === 0) shop.value.sold = res.total
|
|
|
- };
|
|
|
- // 查询
|
|
|
- const toSearch = (value) => {
|
|
|
- // 判断点击的是那个筛选
|
|
|
- searchList.value = searchList.value.map((item, index) => {
|
|
|
- if (item.type == value.type && !item.is_open) item.is_open = true
|
|
|
- else item.is_open = false
|
|
|
- return item
|
|
|
- })
|
|
|
- type.value = value.type
|
|
|
- if (value.type == '1') {
|
|
|
- toClose()
|
|
|
- uni.navigateTo({
|
|
|
- url: `/pagesHome/brand/index`,
|
|
|
- })
|
|
|
- }
|
|
|
- else if (value.type == '4') {
|
|
|
- toClose()
|
|
|
- uni.navigateTo({
|
|
|
- url: `/pagesHome/condition/index`,
|
|
|
- })
|
|
|
- } else is_show.value = searchList.value.some(item => item.is_open == true)
|
|
|
- };
|
|
|
- // 关闭筛选
|
|
|
- const toClose = () => {
|
|
|
- is_show.value = false
|
|
|
- searchList.value = searchList.value.map((item, index) => {
|
|
|
- item.is_open = false
|
|
|
- return item
|
|
|
- })
|
|
|
- };
|
|
|
- // 选择
|
|
|
- const toSelect = async (data, type) => {
|
|
|
- // 判断点击的是那个筛选
|
|
|
- if (type == '0') {
|
|
|
- sortList.value = sortList.value.map((item, index) => {
|
|
|
- if (item.type == data.type) item.is_open = true
|
|
|
- else item.is_open = false
|
|
|
- return item
|
|
|
- })
|
|
|
- searchList.value = searchList.value.map((i, index) => {
|
|
|
- if (i.type == '0') i.title = data.title
|
|
|
- return i
|
|
|
- })
|
|
|
- } else if (type == '2') {
|
|
|
- moneyList.value = moneyList.value.map((item, index) => {
|
|
|
- if (item.type == data.type) item.is_open = true
|
|
|
- else item.is_open = false
|
|
|
- return item
|
|
|
- })
|
|
|
- if (data.type != '0') searchInfo.value.money = data.title
|
|
|
- else searchInfo.value.money = ''
|
|
|
- } else {
|
|
|
- yearList.value = yearList.value.map((item, index) => {
|
|
|
- if (item.type == data.type) item.is_open = true
|
|
|
- else item.is_open = false
|
|
|
- return item
|
|
|
- })
|
|
|
- if (data.type != '0') searchInfo.value.year = data.title
|
|
|
- else searchInfo.value.year = ''
|
|
|
- }
|
|
|
- await clearPage();
|
|
|
- await searchOther();
|
|
|
- };
|
|
|
- // 删除筛选
|
|
|
- const toDelete = async (item, type) => {
|
|
|
- if (type == '0') searchInfo.value.brand = ''
|
|
|
- else if (type == '1') {
|
|
|
- moneyList.value = moneyList.value.map((item, index) => {
|
|
|
- if (item.type == '0') item.is_open = true
|
|
|
- else item.is_open = false
|
|
|
- return item
|
|
|
- })
|
|
|
- searchInfo.value.money = ''
|
|
|
- }
|
|
|
- else if (type == '2') {
|
|
|
- yearList.value = yearList.value.map((item, index) => {
|
|
|
- if (item.type == '0') item.is_open = true
|
|
|
- else item.is_open = false
|
|
|
- return item
|
|
|
- })
|
|
|
- searchInfo.value.year = ''
|
|
|
- }
|
|
|
- else moreList.value = moreList.value.filter((i, index) => i.type != item.type)
|
|
|
- await clearPage();
|
|
|
- await searchOther();
|
|
|
- };
|
|
|
- // 重置
|
|
|
- const toReset = async () => {
|
|
|
- await toDelete({}, '0')
|
|
|
- await toDelete({}, '1')
|
|
|
- await toDelete({}, '2')
|
|
|
- moreList.value = []
|
|
|
- await toClear();
|
|
|
- };
|
|
|
- // 清除
|
|
|
- const toClear = () => {
|
|
|
- searchList.value = searchList.value.map((i, index) => {
|
|
|
- if (i.type == '0') i.title = '默认排序'
|
|
|
- return i
|
|
|
- })
|
|
|
- sortList.value = sortList.value.map((item, index) => {
|
|
|
- if (item.type == '0') item.is_open = true;
|
|
|
- else item.is_open = false
|
|
|
- return item
|
|
|
- })
|
|
|
- };
|
|
|
- // 联系卖家
|
|
|
- const toChat = () => {
|
|
|
- uni.makePhoneCall({
|
|
|
- phoneNumber: shop.value?.tel,
|
|
|
- success: function () {
|
|
|
- console.log('拨打电话成功');
|
|
|
- },
|
|
|
- fail: function () {
|
|
|
- uni.showToast({
|
|
|
- title: '拨打电话失败',
|
|
|
- icon: 'error',
|
|
|
- });
|
|
|
- }
|
|
|
- });
|
|
|
- };
|
|
|
- // 查看详情
|
|
|
- const toView = (item) => {
|
|
|
- uni.navigateTo({
|
|
|
- url: `/pagesHome/car/index?id=${item.id || item._id}`
|
|
|
- })
|
|
|
- };
|
|
|
- // 预览营业执照
|
|
|
- const toImage = () => {
|
|
|
- if (shop.value?.file.length > 0) {
|
|
|
- // 预览图片
|
|
|
- uni.previewImage({
|
|
|
- urls: [shop.value.file[0].url],
|
|
|
- longPressActions: {
|
|
|
- itemList: ['发送给朋友', '保存图片', '收藏'],
|
|
|
- success: function (data) {
|
|
|
- console.log('选中了第' + (data.tapIndex + 1) + '个按钮,第' + (data.index + 1) + '张图片');
|
|
|
- },
|
|
|
- fail: function (err) {
|
|
|
- console.log(err.errMsg);
|
|
|
- }
|
|
|
- }
|
|
|
- });
|
|
|
- }
|
|
|
- };
|
|
|
- // 分页
|
|
|
- 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;
|
|
|
-
|
|
|
- .info {
|
|
|
- position: relative;
|
|
|
- flex-grow: 1;
|
|
|
- background-color: var(--f1Color);
|
|
|
-
|
|
|
- .top {
|
|
|
-
|
|
|
- .image {
|
|
|
- width: 100%;
|
|
|
- height: 55vw;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .bottom {
|
|
|
- margin: -8vw 2vw 0 2vw;
|
|
|
-
|
|
|
- .one {
|
|
|
- border-radius: 5px;
|
|
|
- padding: 2vw;
|
|
|
- background-color: var(--mainColor);
|
|
|
-
|
|
|
- .name {
|
|
|
- font-size: var(--font16Size);
|
|
|
- }
|
|
|
-
|
|
|
- .other {
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- font-size: var(--font12Size);
|
|
|
- padding: 2vw 0;
|
|
|
-
|
|
|
- .left {
|
|
|
- width: 45%;
|
|
|
-
|
|
|
- .left_2 {
|
|
|
- margin: 1vw 0;
|
|
|
- }
|
|
|
-
|
|
|
- .left_3 {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
-
|
|
|
- text {
|
|
|
- margin: 0 0 1vw 0;
|
|
|
- color: #606266;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .right {
|
|
|
- width: 45%;
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .two {
|
|
|
- .search {
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- align-items: center;
|
|
|
- padding: 2vw 2vw 0 2vw;
|
|
|
-
|
|
|
- .searchlist {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- padding: 1vw 0;
|
|
|
-
|
|
|
- .title_1 {
|
|
|
- margin: 0 1vw 0 0;
|
|
|
- font-size: var(--font14Size);
|
|
|
- }
|
|
|
-
|
|
|
- .title_2 {
|
|
|
- margin: 0 1vw 0 0;
|
|
|
- font-size: var(--font14Size);
|
|
|
- color: var(--fFFColor);
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .popup-layer {
|
|
|
- position: absolute;
|
|
|
- z-index: 999999;
|
|
|
- background: rgba(0, 0, 0, .3);
|
|
|
- height: calc(100% - 50px);
|
|
|
- width: 100%;
|
|
|
- left: 0px;
|
|
|
- overflow: hidden;
|
|
|
- height: 87.5vh;
|
|
|
- }
|
|
|
-
|
|
|
- .popup-content {
|
|
|
- position: absolute;
|
|
|
- width: 100%;
|
|
|
- z-index: 1000000;
|
|
|
- background: #FFFFFF;
|
|
|
- transition: all .3s ease;
|
|
|
-
|
|
|
- .search_1 {
|
|
|
- display: flex;
|
|
|
- flex-wrap: wrap;
|
|
|
- padding: 2vw;
|
|
|
-
|
|
|
- .list {
|
|
|
- font-size: var(--font14Size);
|
|
|
- width: 24vw;
|
|
|
- text-align: center;
|
|
|
-
|
|
|
- .title_1 {
|
|
|
- padding: 2vw;
|
|
|
- margin: 1vw;
|
|
|
- background-color: var(--f5Color);
|
|
|
- }
|
|
|
-
|
|
|
- .title_2 {
|
|
|
- padding: 2vw;
|
|
|
- margin: 1vw;
|
|
|
- background: rgba(255, 222, 173, 0.35);
|
|
|
- border: 1px solid var(--fFFColor);
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .search_2 {
|
|
|
- padding: 2vw;
|
|
|
- background-color: var(--f5Color);
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- align-items: center;
|
|
|
-
|
|
|
- .left {
|
|
|
- width: 80vw;
|
|
|
-
|
|
|
- .scroll {
|
|
|
- display: flex;
|
|
|
- white-space: nowrap;
|
|
|
-
|
|
|
- .title {
|
|
|
- font-size: var(--font14Size);
|
|
|
- display: flex;
|
|
|
- padding: 2vw;
|
|
|
- margin: 1vw;
|
|
|
- background-color: var(--mainColor);
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .pubuBox {
|
|
|
- padding: 2vw 0;
|
|
|
- }
|
|
|
-
|
|
|
- .pubuItem {
|
|
|
- column-count: 2;
|
|
|
- column-gap: 2vw;
|
|
|
- }
|
|
|
-
|
|
|
- .list {
|
|
|
- box-sizing: border-box;
|
|
|
- border-radius: 2vw;
|
|
|
- overflow: hidden;
|
|
|
- background-color: var(--mainColor);
|
|
|
- break-inside: avoid;
|
|
|
- /*避免在元素内部插入分页符*/
|
|
|
- box-sizing: border-box;
|
|
|
- margin-bottom: 2vw;
|
|
|
-
|
|
|
- .list_1 {
|
|
|
- .left {
|
|
|
- .image {
|
|
|
- width: 100%;
|
|
|
- height: 120px;
|
|
|
- border-radius: 5px 5px 0 0;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .right {
|
|
|
- display: flex;
|
|
|
- flex-direction: column;
|
|
|
- justify-content: space-between;
|
|
|
- padding: 0 2vw;
|
|
|
-
|
|
|
- .name {
|
|
|
- font-size: var(--font14Size);
|
|
|
- }
|
|
|
-
|
|
|
- .other {
|
|
|
- color: var(--f85Color);
|
|
|
- font-size: var(--font12Size);
|
|
|
- }
|
|
|
-
|
|
|
- .money {
|
|
|
- color: var(--fF0Color);
|
|
|
- font-size: var(--font12Size);
|
|
|
- margin: 0 0 1vw 0;
|
|
|
-
|
|
|
- text:first-child {
|
|
|
- font-size: var(--font18Size);
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .foot {
|
|
|
- padding: 2vw 1vw;
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
- .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>
|