|
|
@@ -3,13 +3,17 @@
|
|
|
<view class="top-box">
|
|
|
<view class="search-box">
|
|
|
<view class="search-left">
|
|
|
- <u-search placeholder="请输入搜索内容" :showAction="false" v-model="sellerListParams.keyword" />
|
|
|
+ <u-search
|
|
|
+ placeholder="请输入搜索内容"
|
|
|
+ :showAction="false"
|
|
|
+ v-model="sellerListParams.keyword"
|
|
|
+ />
|
|
|
</view>
|
|
|
- <view class="search-right" @click='handlerSearch'>搜索</view>
|
|
|
+ <view class="search-right" @click="handlerSearch">搜索</view>
|
|
|
</view>
|
|
|
<view class="filter-box">
|
|
|
<view class="filter-item">
|
|
|
- <!-- <view class="fiter1">
|
|
|
+ <!-- <view class="fiter1">
|
|
|
<u-icon name="map"></u-icon>
|
|
|
<span class="filter-l">贵阳市青少年人才社区</span>
|
|
|
<u-icon name="arrow-down-fill"></u-icon>
|
|
|
@@ -26,15 +30,32 @@
|
|
|
<view class="filter-drapdown" v-show="filterShow">
|
|
|
<view class="filter1" v-show="filterType == 1">
|
|
|
<view class="scroll-box">
|
|
|
- <scroll-view :scroll-top="scrollTop" scroll-y="true" class="filter-menu-left scroll-Y"
|
|
|
- @scrolltoupper="upper" @scrolltolower="lower" @scroll="scroll">
|
|
|
- <view id="demo1" class="scroll-view-item uni-bg-red menu-item"
|
|
|
- :class="current == index ? 'act-left-menu' : ''" v-for="(item, index) of menuList" :key="index"
|
|
|
- @click.stop="handlerSelectLMenu(item, index)">{{ item.name }}
|
|
|
+ <scroll-view
|
|
|
+ :scroll-top="scrollTop"
|
|
|
+ scroll-y="true"
|
|
|
+ class="filter-menu-left scroll-Y"
|
|
|
+ @scrolltoupper="upper"
|
|
|
+ @scrolltolower="lower"
|
|
|
+ @scroll="scroll"
|
|
|
+ >
|
|
|
+ <view
|
|
|
+ id="demo1"
|
|
|
+ class="scroll-view-item uni-bg-red menu-item"
|
|
|
+ :class="current == index ? 'act-left-menu' : ''"
|
|
|
+ v-for="(item, index) of menuList"
|
|
|
+ :key="index"
|
|
|
+ @click.stop="handlerSelectLMenu(item, index)"
|
|
|
+ >{{ item.name }}
|
|
|
</view>
|
|
|
</scroll-view>
|
|
|
- <scroll-view :scroll-top="scrollTop" scroll-y="true" class="filter-menu-right scroll-Y"
|
|
|
- @scrolltoupper="upper" @scrolltolower="lower" @scroll="scroll">
|
|
|
+ <scroll-view
|
|
|
+ :scroll-top="scrollTop"
|
|
|
+ scroll-y="true"
|
|
|
+ class="filter-menu-right scroll-Y"
|
|
|
+ @scrolltoupper="upper"
|
|
|
+ @scrolltolower="lower"
|
|
|
+ @scroll="scroll"
|
|
|
+ >
|
|
|
<view id="demo1" class="scroll-view-item uni-bg-red" v-for="item of 15" :key="item">
|
|
|
<view class="menu-right-title">洗车</view>
|
|
|
<view class="menu-right-contentbox">
|
|
|
@@ -54,7 +75,12 @@
|
|
|
</view>
|
|
|
|
|
|
<view class="content-box">
|
|
|
- <view class="content-item" v-for="(item, index) in sellerList" :key="index" @tap="goSellerDetail(item.id)">
|
|
|
+ <view
|
|
|
+ class="content-item"
|
|
|
+ v-for="(item, index) in sellerList"
|
|
|
+ :key="index"
|
|
|
+ @tap="goSellerDetail(item.id)"
|
|
|
+ >
|
|
|
<view class="item-left">
|
|
|
<image class="img" :src="item.logo" mode="aspectFit"></image>
|
|
|
<!-- <image class="img" :src="error || !loaded ? 'https://cdn.uviewui.com/uview/album/10.jpg' : item.logo"
|
|
|
@@ -83,352 +109,360 @@
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
- <u-empty v-if="sellerList.length == 0" mode="data" icon="http://cdn.uviewui.com/uview/empty/data.png"></u-empty>
|
|
|
+ <u-empty
|
|
|
+ v-if="sellerList.length == 0"
|
|
|
+ mode="data"
|
|
|
+ icon="http://cdn.uviewui.com/uview/empty/data.png"
|
|
|
+ ></u-empty>
|
|
|
</view>
|
|
|
</view>
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
- import { getSellerList } from '@/api/client/business.js';
|
|
|
- import { getCurrentLocation } from '@/api/client/home.js';
|
|
|
- import { mapGetters } from 'vuex';
|
|
|
- export default {
|
|
|
- data() {
|
|
|
- return {
|
|
|
- filterShow: false,
|
|
|
- filterType: 0,
|
|
|
- sortCondition: '综合排序',
|
|
|
- current: 0,
|
|
|
- menuList: [{
|
|
|
- name: '汽车',
|
|
|
- },
|
|
|
- {
|
|
|
- name: '汽车2',
|
|
|
- },
|
|
|
- {
|
|
|
- name: '汽车3',
|
|
|
- },
|
|
|
- {
|
|
|
- name: '汽车4',
|
|
|
- },
|
|
|
- ],
|
|
|
- sellerList: [],
|
|
|
- sellerListParams: {
|
|
|
- longitude: '',
|
|
|
- latitude: '',
|
|
|
- sort: 'SYNTHESE',
|
|
|
- size: 10,
|
|
|
- region: '', //地区编码
|
|
|
- keyword: '', //关键字
|
|
|
- categoryId: '', //分类ID
|
|
|
+import { getSellerList } from '@/api/client/business.js';
|
|
|
+import { getCurrentLocation } from '@/api/client/home.js';
|
|
|
+import { mapGetters } from 'vuex';
|
|
|
+export default {
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ filterShow: false,
|
|
|
+ filterType: 0,
|
|
|
+ sortCondition: '综合排序',
|
|
|
+ current: 0,
|
|
|
+ menuList: [
|
|
|
+ {
|
|
|
+ name: '汽车',
|
|
|
},
|
|
|
- };
|
|
|
+ {
|
|
|
+ name: '汽车2',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '汽车3',
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: '汽车4',
|
|
|
+ },
|
|
|
+ ],
|
|
|
+ sellerList: [],
|
|
|
+ sellerListParams: {
|
|
|
+ longitude: '',
|
|
|
+ latitude: '',
|
|
|
+ sort: 'SYNTHESE',
|
|
|
+ size: 10,
|
|
|
+ region: '', //地区编码
|
|
|
+ keyword: '', //关键字
|
|
|
+ categoryId: '', //分类ID
|
|
|
+ },
|
|
|
+ };
|
|
|
+ },
|
|
|
+ onLoad(option) {
|
|
|
+ console.log(option);
|
|
|
+ if (option.id) {
|
|
|
+ this.sellerListParams.categoryId = option.id;
|
|
|
+ }
|
|
|
+ if (option.name) {
|
|
|
+ this.sellerListParams.keyword = option.name;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ mounted() {
|
|
|
+ let { latitude, longitude, region } = this.location;
|
|
|
+ this.sellerListParams.latitude = latitude;
|
|
|
+ this.sellerListParams.longitude = longitude;
|
|
|
+ this.sellerListParams.region = region;
|
|
|
+ this.getData();
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ ...mapGetters(['location']),
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ // 点击综合排序
|
|
|
+ handlerSelectAllFilter(e) {
|
|
|
+ this.filterShow = true;
|
|
|
+ this.filterType = 2;
|
|
|
},
|
|
|
- onLoad(option) {
|
|
|
- if(option.id){
|
|
|
- this.sellerListParams.categoryId = option.id;
|
|
|
+ // 排序条件
|
|
|
+ sellerListFillter(e) {
|
|
|
+ switch (e) {
|
|
|
+ case 1:
|
|
|
+ this.sortCondition = '离我最近';
|
|
|
+ this.sellerListParams.sort = 'NEAREST';
|
|
|
+ break;
|
|
|
+ case 2:
|
|
|
+ this.sortCondition = '好评优先';
|
|
|
+ this.sellerListParams.sort = 'FAVORITE';
|
|
|
+ break;
|
|
|
+ case 3:
|
|
|
+ this.sortCondition = '销量优先';
|
|
|
+ this.sellerListParams.sort = 'BESTSELLING';
|
|
|
+ break;
|
|
|
+ default:
|
|
|
+ break;
|
|
|
}
|
|
|
- if(option.keyword){
|
|
|
- this.sellerListParams.keyword = option.keyword;
|
|
|
- }
|
|
|
+ this.getData();
|
|
|
},
|
|
|
- mounted() {
|
|
|
- let { latitude , longitude , region } = this.location
|
|
|
- this.sellerListParams.latitude = latitude
|
|
|
- this.sellerListParams.longitude = longitude
|
|
|
- this.sellerListParams.region = region
|
|
|
- this.getData();
|
|
|
- },
|
|
|
- computed:{
|
|
|
- ...mapGetters(['location'])
|
|
|
- },
|
|
|
- methods: {
|
|
|
- // 点击综合排序
|
|
|
- handlerSelectAllFilter(e) {
|
|
|
- this.filterShow = true;
|
|
|
- this.filterType = 2;
|
|
|
- },
|
|
|
- // 排序条件
|
|
|
- sellerListFillter(e) {
|
|
|
- switch (e) {
|
|
|
- case 1:
|
|
|
- this.sortCondition = '离我最近';
|
|
|
- this.sellerListParams.sort = 'NEAREST';
|
|
|
- break;
|
|
|
- case 2:
|
|
|
- this.sortCondition = '好评优先';
|
|
|
- this.sellerListParams.sort = 'FAVORITE';
|
|
|
- break;
|
|
|
- case 3:
|
|
|
- this.sortCondition = '销量优先';
|
|
|
- this.sellerListParams.sort = 'BESTSELLING';
|
|
|
- break;
|
|
|
- default:
|
|
|
- break;
|
|
|
- }
|
|
|
- this.getData();
|
|
|
- },
|
|
|
- // 获取初始化列表
|
|
|
- getData() {
|
|
|
- getSellerList(this.sellerListParams)
|
|
|
- .then(res => {
|
|
|
- this.sellerList = res.data;
|
|
|
- })
|
|
|
- .catch(err => {});
|
|
|
- },
|
|
|
- // 点击进入详情
|
|
|
- goSellerDetail(id) {
|
|
|
- uni.navigateTo({
|
|
|
- url: `/pagesHome/category/categoryStoreList?id=${id}`,
|
|
|
- });
|
|
|
- },
|
|
|
- //
|
|
|
- handlerSelectMenu(e) {
|
|
|
- // uni.navigateTo({
|
|
|
- // url:'/pages/client/clientPackage/category'
|
|
|
- // })
|
|
|
- // this.filterShow = true;
|
|
|
- // this.filterType = 1;
|
|
|
- },
|
|
|
- // 选择左侧菜单
|
|
|
- handlerSelectLMenu(item, index) {
|
|
|
- this.current = index;
|
|
|
- },
|
|
|
- scroll() {},
|
|
|
- lower() {},
|
|
|
- upper() {},
|
|
|
- // 搜索
|
|
|
- handlerSearch(){
|
|
|
- this.getData()
|
|
|
- }
|
|
|
+ // 获取初始化列表
|
|
|
+ getData() {
|
|
|
+ getSellerList(this.sellerListParams)
|
|
|
+ .then(res => {
|
|
|
+ this.sellerList = res.data;
|
|
|
+ })
|
|
|
+ .catch(err => {});
|
|
|
+ },
|
|
|
+ // 点击进入详情
|
|
|
+ goSellerDetail(id) {
|
|
|
+ uni.navigateTo({
|
|
|
+ url: `/pagesHome/category/categoryStoreList?id=${id}`,
|
|
|
+ });
|
|
|
+ },
|
|
|
+ //
|
|
|
+ handlerSelectMenu(e) {
|
|
|
+ // uni.navigateTo({
|
|
|
+ // url:'/pages/client/clientPackage/category'
|
|
|
+ // })
|
|
|
+ // this.filterShow = true;
|
|
|
+ // this.filterType = 1;
|
|
|
+ },
|
|
|
+ // 选择左侧菜单
|
|
|
+ handlerSelectLMenu(item, index) {
|
|
|
+ this.current = index;
|
|
|
+ },
|
|
|
+ scroll() {},
|
|
|
+ lower() {},
|
|
|
+ upper() {},
|
|
|
+ // 搜索
|
|
|
+ handlerSearch() {
|
|
|
+ this.getData();
|
|
|
},
|
|
|
- };
|
|
|
+ },
|
|
|
+};
|
|
|
</script>
|
|
|
|
|
|
<style lang="scss" scoped>
|
|
|
- .container {
|
|
|
- min-height: 100vh;
|
|
|
- background-color: #efefef;
|
|
|
+.container {
|
|
|
+ min-height: 100vh;
|
|
|
+ background-color: #efefef;
|
|
|
+
|
|
|
+ .top-box {
|
|
|
+ width: 100%;
|
|
|
+ background-color: #fff;
|
|
|
+ padding: 10rpx 20rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+
|
|
|
+ .search-box {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-around;
|
|
|
+ align-items: center;
|
|
|
+
|
|
|
+ .search-left {
|
|
|
+ width: 80%;
|
|
|
+ }
|
|
|
|
|
|
- .top-box {
|
|
|
- width: 100%;
|
|
|
- background-color: #fff;
|
|
|
- padding: 10rpx 20rpx;
|
|
|
- box-sizing: border-box;
|
|
|
+ .search-right {
|
|
|
+ text-align: center;
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
- .search-box {
|
|
|
+ .filter-box {
|
|
|
+ margin-top: 20rpx;
|
|
|
+
|
|
|
+ .filter-item {
|
|
|
display: flex;
|
|
|
- justify-content: space-around;
|
|
|
- align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
|
|
|
- .search-left {
|
|
|
- width: 80%;
|
|
|
+ .fiter1,
|
|
|
+ .fiter2 {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
}
|
|
|
|
|
|
- .search-right {
|
|
|
- text-align: center;
|
|
|
+ .filter-l {
|
|
|
+ width: 200rpx;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ white-space: nowrap;
|
|
|
}
|
|
|
- }
|
|
|
-
|
|
|
- .filter-box {
|
|
|
- margin-top: 20rpx;
|
|
|
-
|
|
|
- .filter-item {
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
-
|
|
|
- .fiter1,
|
|
|
- .fiter2 {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
- }
|
|
|
-
|
|
|
- .filter-l {
|
|
|
- width: 200rpx;
|
|
|
- overflow: hidden;
|
|
|
- text-overflow: ellipsis;
|
|
|
- white-space: nowrap;
|
|
|
- }
|
|
|
|
|
|
- .fiter1 {
|
|
|
- color: #808080;
|
|
|
- font-size: 24rpx;
|
|
|
- }
|
|
|
+ .fiter1 {
|
|
|
+ color: #808080;
|
|
|
+ font-size: 24rpx;
|
|
|
+ }
|
|
|
|
|
|
- .fiter2 {}
|
|
|
+ .fiter2 {
|
|
|
}
|
|
|
+ }
|
|
|
+
|
|
|
+ .filter-drapdown {
|
|
|
+ position: fixed;
|
|
|
+ left: 0;
|
|
|
+ width: 100%;
|
|
|
+ background-color: #fff;
|
|
|
+ // height: 300rpx;
|
|
|
+ z-index: 999;
|
|
|
+ box-shadow: 0 10rpx 20rpx -5rpx rgba(0, 0, 0, 0.2);
|
|
|
|
|
|
- .filter-drapdown {
|
|
|
- position: fixed;
|
|
|
- left: 0;
|
|
|
- width: 100%;
|
|
|
- background-color: #fff;
|
|
|
- // height: 300rpx;
|
|
|
- z-index: 999;
|
|
|
- box-shadow: 0 10rpx 20rpx -5rpx rgba(0, 0, 0, 0.2);
|
|
|
-
|
|
|
- .filter1 {
|
|
|
- .scroll-box {
|
|
|
- display: flex;
|
|
|
- max-height: 1200rpx;
|
|
|
-
|
|
|
- .filter-menu-left {
|
|
|
- width: 30%;
|
|
|
+ .filter1 {
|
|
|
+ .scroll-box {
|
|
|
+ display: flex;
|
|
|
+ max-height: 1200rpx;
|
|
|
+
|
|
|
+ .filter-menu-left {
|
|
|
+ width: 30%;
|
|
|
+ background-color: #ebebeb;
|
|
|
+ overflow-y: scroll;
|
|
|
+
|
|
|
+ .menu-item {
|
|
|
+ width: 100%;
|
|
|
+ height: 100rpx;
|
|
|
+ text-align: center;
|
|
|
+ line-height: 100rpx;
|
|
|
+ font-size: 30rpx;
|
|
|
background-color: #ebebeb;
|
|
|
- overflow-y: scroll;
|
|
|
+ color: #5a5a5a;
|
|
|
+ }
|
|
|
|
|
|
- .menu-item {
|
|
|
- width: 100%;
|
|
|
- height: 100rpx;
|
|
|
- text-align: center;
|
|
|
- line-height: 100rpx;
|
|
|
- font-size: 30rpx;
|
|
|
- background-color: #ebebeb;
|
|
|
- color: #5a5a5a;
|
|
|
- }
|
|
|
+ .act-left-menu {
|
|
|
+ background-color: #fff;
|
|
|
+ color: #5992bb;
|
|
|
+ border-right: 8rpx solid #5992bb !important;
|
|
|
+ }
|
|
|
+ }
|
|
|
|
|
|
- .act-left-menu {
|
|
|
- background-color: #fff;
|
|
|
- color: #5992bb;
|
|
|
- border-right: 8rpx solid #5992bb !important;
|
|
|
- }
|
|
|
+ .filter-menu-right {
|
|
|
+ background-color: #fff;
|
|
|
+ padding: 10rpx 20rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ width: 70%;
|
|
|
+ overflow-y: scroll;
|
|
|
+
|
|
|
+ .menu-right-title {
|
|
|
+ font-size: 30rpx;
|
|
|
+ color: #000;
|
|
|
+ margin-bottom: 10rpx;
|
|
|
}
|
|
|
|
|
|
- .filter-menu-right {
|
|
|
- background-color: #fff;
|
|
|
- padding: 10rpx 20rpx;
|
|
|
- box-sizing: border-box;
|
|
|
- width: 70%;
|
|
|
- overflow-y: scroll;
|
|
|
+ .menu-right-contentbox {
|
|
|
+ padding: 0 0 0 30rpx;
|
|
|
+ display: flex;
|
|
|
+ justify-content: left;
|
|
|
+ flex-wrap: wrap;
|
|
|
|
|
|
- .menu-right-title {
|
|
|
- font-size: 30rpx;
|
|
|
+ .menu-item {
|
|
|
+ // width: 100rpx;
|
|
|
+ padding: 0 20rpx;
|
|
|
+ height: 40rpx;
|
|
|
+ background-color: #cccccc;
|
|
|
color: #000;
|
|
|
- margin-bottom: 10rpx;
|
|
|
- }
|
|
|
-
|
|
|
- .menu-right-contentbox {
|
|
|
- padding: 0 0 0 30rpx;
|
|
|
- display: flex;
|
|
|
- justify-content: left;
|
|
|
- flex-wrap: wrap;
|
|
|
-
|
|
|
- .menu-item {
|
|
|
- // width: 100rpx;
|
|
|
- padding: 0 20rpx;
|
|
|
- height: 40rpx;
|
|
|
- background-color: #cccccc;
|
|
|
- color: #000;
|
|
|
- text-align: center;
|
|
|
- line-height: 40rpx;
|
|
|
- margin: 10rpx 20rpx;
|
|
|
- }
|
|
|
+ text-align: center;
|
|
|
+ line-height: 40rpx;
|
|
|
+ margin: 10rpx 20rpx;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
+ }
|
|
|
|
|
|
- .filter2 {
|
|
|
- padding: 20rpx 50rpx;
|
|
|
- box-sizing: border-box;
|
|
|
+ .filter2 {
|
|
|
+ padding: 20rpx 50rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
|
|
|
- view {
|
|
|
- margin: 30rpx 0;
|
|
|
- }
|
|
|
+ view {
|
|
|
+ margin: 30rpx 0;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
+ }
|
|
|
|
|
|
- .content-box {
|
|
|
- width: 100%;
|
|
|
+ .content-box {
|
|
|
+ width: 100%;
|
|
|
|
|
|
- .content-item {
|
|
|
- background-color: #fff;
|
|
|
- padding: 10rpx 20rpx;
|
|
|
- box-sizing: border-box;
|
|
|
- margin: 10rpx 0;
|
|
|
- display: flex;
|
|
|
+ .content-item {
|
|
|
+ background-color: #fff;
|
|
|
+ padding: 10rpx 20rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ margin: 10rpx 0;
|
|
|
+ display: flex;
|
|
|
|
|
|
- .item-left {
|
|
|
- margin-right: 10rpx;
|
|
|
+ .item-left {
|
|
|
+ margin-right: 10rpx;
|
|
|
|
|
|
- .img {
|
|
|
- width: 200rpx;
|
|
|
- height: 200rpx;
|
|
|
- border-radius: 10rpx;
|
|
|
- }
|
|
|
+ .img {
|
|
|
+ width: 200rpx;
|
|
|
+ height: 200rpx;
|
|
|
+ border-radius: 10rpx;
|
|
|
}
|
|
|
+ }
|
|
|
|
|
|
- .item-right {
|
|
|
- height: 200rpx;
|
|
|
- align-content: space-between;
|
|
|
+ .item-right {
|
|
|
+ height: 200rpx;
|
|
|
+ align-content: space-between;
|
|
|
|
|
|
- .item-title {
|
|
|
- display: flex;
|
|
|
- align-items: center;
|
|
|
-
|
|
|
- .tag {
|
|
|
- width: 80rpx;
|
|
|
- height: 46rpx;
|
|
|
- line-height: 35rpx;
|
|
|
- padding: 4rpx;
|
|
|
- font-size: 22rpx;
|
|
|
- box-sizing: border-box;
|
|
|
- background-color: #f6e7d4;
|
|
|
- color: #f99a47;
|
|
|
- border: 2rpx solid #f99a47;
|
|
|
- text-align: center;
|
|
|
- // align-items: center;
|
|
|
- margin-right: 10rpx;
|
|
|
- }
|
|
|
+ .item-title {
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+
|
|
|
+ .tag {
|
|
|
+ width: 80rpx;
|
|
|
+ height: 46rpx;
|
|
|
+ line-height: 35rpx;
|
|
|
+ padding: 4rpx;
|
|
|
+ font-size: 22rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ background-color: #f6e7d4;
|
|
|
+ color: #f99a47;
|
|
|
+ border: 2rpx solid #f99a47;
|
|
|
+ text-align: center;
|
|
|
+ // align-items: center;
|
|
|
+ margin-right: 10rpx;
|
|
|
+ }
|
|
|
|
|
|
- .title {
|
|
|
- width: 85%;
|
|
|
- font-size: 30rpx;
|
|
|
- color: #000;
|
|
|
- font-weight: bold;
|
|
|
- overflow: hidden;
|
|
|
- text-overflow: ellipsis;
|
|
|
- display: -webkit-box;
|
|
|
- -webkit-line-clamp: 2;
|
|
|
- -webkit-box-orient: vertical;
|
|
|
- }
|
|
|
+ .title {
|
|
|
+ width: 85%;
|
|
|
+ font-size: 30rpx;
|
|
|
+ color: #000;
|
|
|
+ font-weight: bold;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ display: -webkit-box;
|
|
|
+ -webkit-line-clamp: 2;
|
|
|
+ -webkit-box-orient: vertical;
|
|
|
}
|
|
|
+ }
|
|
|
|
|
|
- .str-box {
|
|
|
- display: flex;
|
|
|
- margin-top: 10rpx;
|
|
|
+ .str-box {
|
|
|
+ display: flex;
|
|
|
+ margin-top: 10rpx;
|
|
|
|
|
|
- .srt-left {
|
|
|
- display: flex;
|
|
|
- color: #fc8400;
|
|
|
- }
|
|
|
+ .srt-left {
|
|
|
+ display: flex;
|
|
|
+ color: #fc8400;
|
|
|
+ }
|
|
|
|
|
|
- .border {
|
|
|
- border-left: 2rpx solid #cfcfcf;
|
|
|
- margin: 0 20rpx;
|
|
|
- }
|
|
|
+ .border {
|
|
|
+ border-left: 2rpx solid #cfcfcf;
|
|
|
+ margin: 0 20rpx;
|
|
|
+ }
|
|
|
|
|
|
- .srt-right {}
|
|
|
+ .srt-right {
|
|
|
}
|
|
|
+ }
|
|
|
|
|
|
- .bottom-textbox {
|
|
|
- display: flex;
|
|
|
- justify-content: space-between;
|
|
|
- font-size: 26rpx;
|
|
|
- margin-top: 40rpx;
|
|
|
+ .bottom-textbox {
|
|
|
+ display: flex;
|
|
|
+ justify-content: space-between;
|
|
|
+ font-size: 26rpx;
|
|
|
+ margin-top: 40rpx;
|
|
|
|
|
|
- .bottom-left {
|
|
|
- color: #c7c7c7;
|
|
|
- }
|
|
|
+ .bottom-left {
|
|
|
+ color: #c7c7c7;
|
|
|
+ }
|
|
|
|
|
|
- .bottom-right {
|
|
|
- color: #000;
|
|
|
- }
|
|
|
+ .bottom-right {
|
|
|
+ color: #000;
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
}
|
|
|
+}
|
|
|
</style>
|
