797 lines
19 KiB
Vue
797 lines
19 KiB
Vue
<template>
|
|
<view class="page">
|
|
<view class="m-tab">
|
|
<scroll-view class="m-navbar scroll-view_H" scroll-x style="width: 100%">
|
|
<view
|
|
:class="'m-navbar-item ' + (tapindex == 0 ? 'm-navbar-item-on' : '')"
|
|
@click="allcouponed"
|
|
>
|
|
{{ __("全部") }}({{ numAllCouponed }})
|
|
</view>
|
|
<view
|
|
:class="'m-navbar-item ' + (tapindex == 1 ? 'm-navbar-item-on' : '')"
|
|
@click="offlined"
|
|
>
|
|
{{ __("线下券") }}({{ numOfflined }})
|
|
</view>
|
|
<view
|
|
:class="'m-navbar-item ' + (tapindex == 2 ? 'm-navbar-item-on' : '')"
|
|
@click="onlined"
|
|
>
|
|
{{ __("线上券") }}({{ numOnlined }})
|
|
</view>
|
|
<view
|
|
v-if="false"
|
|
:class="'m-navbar-item ' + (tapindex == 3 ? 'm-navbar-item-on' : '')"
|
|
@click="carcouponed"
|
|
>
|
|
{{ __("车享券") }}
|
|
</view>
|
|
<view
|
|
:class="{ 'm-navbar-item': 1, 'm-navbar-item-on': is_filter }"
|
|
@click="onOpenFilter"
|
|
>
|
|
{{ __("筛选") }}
|
|
<i></i>
|
|
</view>
|
|
</scroll-view>
|
|
|
|
<uni-drawer
|
|
:visible="rightDrawerVisible"
|
|
mode="right"
|
|
@close="onCloseFilter"
|
|
>
|
|
<view style="padding: 30rpx">
|
|
<view class="uni-padding-wrap uni-common-mt">
|
|
<block v-if="true">
|
|
<!-- #ifndef MP-BAIDU -->
|
|
<view class="uni-title uni-common-mt">{{
|
|
__("优惠券状态")
|
|
}}</view>
|
|
<view class="p-lists">
|
|
<view class="tag-view">
|
|
<uni-tag
|
|
:text="__('未使用')"
|
|
type="ss"
|
|
size="small"
|
|
:inverted="inverted.neverused"
|
|
data-type="neverused"
|
|
@click="setType('neverused')"
|
|
></uni-tag>
|
|
</view>
|
|
<view class="tag-view">
|
|
<uni-tag
|
|
:text="__('已使用')"
|
|
type="ss"
|
|
size="small"
|
|
:inverted="inverted.alreadyused"
|
|
data-type="alreadyused"
|
|
@click="setType('alreadyused')"
|
|
></uni-tag>
|
|
</view>
|
|
<view class="tag-view">
|
|
<uni-tag
|
|
:text="__('已过期')"
|
|
type="ss"
|
|
size="small"
|
|
:inverted="inverted.outdated"
|
|
data-type="outdated"
|
|
@click="setType('outdated')"
|
|
></uni-tag>
|
|
</view>
|
|
</view>
|
|
<!-- #endif -->
|
|
</block>
|
|
<view style="height: 100rpx; line-height: 100rpx"></view>
|
|
<view
|
|
class="uni-common-mt"
|
|
style="position: fixed; bottom: 30rpx; width: 80%"
|
|
>
|
|
<button
|
|
class="button"
|
|
type="warn"
|
|
size="medium"
|
|
@tap="onFilter"
|
|
style=""
|
|
>
|
|
{{ __("筛选") }}
|
|
</button>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
</uni-drawer>
|
|
</view>
|
|
|
|
<block v-if="UserCoupon.length > 0">
|
|
<view class="coupon-box">
|
|
<lxCoupon
|
|
:preferential="10"
|
|
:lists="UserCoupon"
|
|
:content="2"
|
|
@onClick="click"
|
|
/>
|
|
<view class="u-cleanbox"></view>
|
|
</view>
|
|
</block>
|
|
<view class="m-nullcontent" v-else>
|
|
<view class="m-nullpage-middle"
|
|
><label class="iconfont icon-meiyougengduo"></label>
|
|
<view class="m-null-tip">
|
|
<text>{{ __("亲~什么都没有") }}</text>
|
|
<text>{{ __("赶快去领券中心吧") }}</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="u-top-default" v-if="false">
|
|
<navigator url="/pages/index/index" open-type="switchTab" class="u-back2">
|
|
<image
|
|
src="https://media-mall-prod-1259811287.cos.ap-guangzhou.myqcloud.com/static/xcxfile/appicon/img/gohome.png"
|
|
></image>
|
|
</navigator>
|
|
</view>
|
|
<view class="my_coupon">
|
|
<view class="my_coubut" @tap="listCoupon"
|
|
>{{ __("领取更多优惠券") }}
|
|
</view>
|
|
</view>
|
|
|
|
<scroll-view
|
|
class="m-scrollBox"
|
|
scroll-y="true"
|
|
@scrolltolower="scrollbottom"
|
|
v-if="false"
|
|
>
|
|
<block v-if="UserCoupon.length > 0">
|
|
<view class="m-coupon-item" v-for="(item, i) in UserCoupon" :key="i">
|
|
<image
|
|
lazy-load
|
|
:src="
|
|
item.voucher_state_id == 1501
|
|
? 'https://media-mall-prod-1259811287.cos.ap-guangzhou.myqcloud.com/static/xcxfile/appicon/images/coupon_red.png'
|
|
: 'https://media-mall-prod-1259811287.cos.ap-guangzhou.myqcloud.com/static/xcxfile/appicon/images/coupon_gray.png'
|
|
"
|
|
class="item-bg"
|
|
></image>
|
|
<view class="coupon-item-left">
|
|
<view class="item-left-top"
|
|
>{{ __("￥") }}<label>{{ item.voucher_price }}</label></view
|
|
>
|
|
<view class="item-left-bottom">{{
|
|
sprintf(__("满￥%s可用"), item.voucher_subtotal)
|
|
}}</view>
|
|
</view>
|
|
<view class="coupon-item-right">
|
|
<view
|
|
:class="
|
|
'item-title ' +
|
|
(item.voucher_state_id == 1501 ? 'item-title-black' : '')
|
|
"
|
|
>{{ item.Name }}</view
|
|
>
|
|
<view class="item-middle">
|
|
<label class="item-time">{{
|
|
sprintf(__("有效日期至：%s"), item.voucher_end_date)
|
|
}}</label>
|
|
<label
|
|
class="item-usenow"
|
|
v-if="item.voucher_state_id == 1501"
|
|
@click="useVoucher"
|
|
:data-item_id="item.item_id"
|
|
:data-store_id="item.store_id"
|
|
>{{ __("立即使用") }}</label
|
|
>
|
|
</view>
|
|
|
|
<view class="item-desc">{{ item.CouponUserDesc }}</view>
|
|
</view>
|
|
<label
|
|
:class="
|
|
'iconfont ' +
|
|
(item.voucher_state_id == 1503
|
|
? 'icon-yiguoqi'
|
|
: 'icon-yishiyong')
|
|
"
|
|
v-if="
|
|
item.voucher_state_id == 1502 || item.voucher_state_id == 1503
|
|
"
|
|
></label>
|
|
</view>
|
|
</block>
|
|
<view class="m-nullcontent" v-else>
|
|
<view class="m-nullpage-middle">
|
|
<label class="iconfont icon-meiyougengduo"></label>
|
|
<view class="m-null-tip">
|
|
<text>{{ __("亲~什么都没有") }}</text>
|
|
<text>{{ __("赶快去领券中心吧") }}</text>
|
|
</view>
|
|
</view>
|
|
</view>
|
|
<view class="m-loading-box">
|
|
<block v-if="ispage">
|
|
<view class="u-loadmore">
|
|
<label class="u-loading"></label>
|
|
<text class="u-loadmore-tips">{{ __("正在加载") }}</text>
|
|
</view>
|
|
</block>
|
|
<block v-else>
|
|
<view class="u-loadmore u-loadmore-line">
|
|
<text class="u-loadmore-tips">{{ __("没有更多数据啦！") }}</text>
|
|
</view>
|
|
</block>
|
|
</view>
|
|
</scroll-view>
|
|
<!-- 东华车享券 -->
|
|
<!-- <couponCar v-show="true"></couponCar> -->
|
|
</view>
|
|
</template>
|
|
|
|
|
|
<script>
|
|
import { mapState, mapMutations } from "vuex";
|
|
import uniDrawer from "@/components/uni-drawer.vue";
|
|
import uniTag from "@/components/uni-tag/uni-tag.vue";
|
|
|
|
import lxCoupon from "./lx-coupon/lx-coupon.vue";
|
|
export default {
|
|
name: "asset",
|
|
data: function () {
|
|
return {
|
|
page: 1,
|
|
rows: 10,
|
|
tapindex: 0,
|
|
offison: 0,
|
|
voucher_state_id: 1501,
|
|
ispage: true,
|
|
flag: true,
|
|
is_filter: false,
|
|
rightDrawerVisible: false,
|
|
inverted: {
|
|
neverused: true,
|
|
alreadyused: true,
|
|
outdated: true,
|
|
},
|
|
UserCoupon: [],
|
|
numAllCouponed: 0,
|
|
numOfflined: 0,
|
|
numOnlined: 0,
|
|
numCarCouponed: 0,
|
|
numNeverUsed: 0,
|
|
numAlreadyused: 0,
|
|
numOutdated: 0,
|
|
};
|
|
},
|
|
computed: mapState([
|
|
"Config",
|
|
"StateCode",
|
|
"notice",
|
|
"plantformInfo",
|
|
"shopInfo",
|
|
"userInfo",
|
|
"hasLogin",
|
|
]),
|
|
components: {
|
|
uniDrawer,
|
|
uniTag,
|
|
lxCoupon,
|
|
},
|
|
onLoad: function (options) {
|
|
uni.setNavigationBarTitle({
|
|
title: this.__("优惠券"),
|
|
});
|
|
|
|
this.setData({
|
|
UserCoupon: [],
|
|
}),
|
|
this.getCouponlist();
|
|
},
|
|
onReachBottom: function () {
|
|
this.scrollbottom();
|
|
},
|
|
methods: {
|
|
...mapMutations([
|
|
"login",
|
|
"logout",
|
|
"getPlantformInfo",
|
|
"forceUserInfo",
|
|
"getUserInfo",
|
|
]),
|
|
|
|
allcouponed: function () {
|
|
this.setType("");
|
|
this.is_filter = false;
|
|
this.setData({
|
|
tapindex: 0,
|
|
offison: 1,
|
|
voucher_state_id: 0,
|
|
UserCoupon: [],
|
|
page: 1,
|
|
}),
|
|
this.getCouponlist();
|
|
},
|
|
offlined: function () {
|
|
this.setType("");
|
|
this.is_filter = false;
|
|
this.setData({
|
|
tapindex: 1,
|
|
offison: 2,
|
|
voucher_state_id: 0,
|
|
UserCoupon: [],
|
|
page: 1,
|
|
}),
|
|
this.getCouponlist();
|
|
},
|
|
onlined: function () {
|
|
this.setType("");
|
|
this.is_filter = false;
|
|
this.setData({
|
|
tapindex: 2,
|
|
offison: 3,
|
|
voucher_state_id: 0,
|
|
UserCoupon: [],
|
|
page: 1,
|
|
}),
|
|
this.getCouponlist();
|
|
},
|
|
carcouponed: function () {
|
|
// 车享券由东华单独处理
|
|
},
|
|
useVoucher: function (e) {
|
|
let that = this;
|
|
var t = e.currentTarget.dataset.store_id;
|
|
var item_id = e.currentTarget.dataset.item_id;
|
|
that.$.redirectTo({
|
|
url:
|
|
"/member/product/coupon?store_id=" +
|
|
t +
|
|
"&voucher_item_id=" +
|
|
item_id,
|
|
});
|
|
},
|
|
listCoupon: function (e) {
|
|
let that = this;
|
|
that.$.redirectTo({
|
|
url: "/activity/coupon/list",
|
|
});
|
|
},
|
|
onCloseFilter() {
|
|
this.rightDrawerVisible = false;
|
|
},
|
|
onOpenFilter() {
|
|
this.rightDrawerVisible = true;
|
|
let that = this;
|
|
},
|
|
onFilter: function () {
|
|
let isSelected = false;
|
|
this.rightDrawerVisible = false;
|
|
if (!this.inverted.neverused) {
|
|
isSelected = true;
|
|
this.is_filter = true;
|
|
this.setData({
|
|
tapindex: this.tapindex,
|
|
offison: this.offison,
|
|
voucher_state_id: 1501,
|
|
UserCoupon: [],
|
|
page: 1,
|
|
}),
|
|
this.getCouponlist();
|
|
}
|
|
|
|
if (!this.inverted.alreadyused) {
|
|
isSelected = true;
|
|
this.is_filter = true;
|
|
this.setData({
|
|
tapindex: this.tapindex,
|
|
offison: this.offison,
|
|
voucher_state_id: 1502,
|
|
UserCoupon: [],
|
|
page: 1,
|
|
}),
|
|
this.getCouponlist();
|
|
}
|
|
|
|
if (!this.inverted.outdated) {
|
|
isSelected = true;
|
|
this.is_filter = true;
|
|
this.setData({
|
|
tapindex: this.tapindex,
|
|
offison: this.offison,
|
|
voucher_state_id: 1503,
|
|
UserCoupon: [],
|
|
page: 1,
|
|
}),
|
|
this.getCouponlist();
|
|
}
|
|
|
|
if (!isSelected) {
|
|
this.$.alert("您未选中任何查询条件！");
|
|
this.is_filter = false;
|
|
this.rightDrawerVisible = true;
|
|
}
|
|
},
|
|
setType(type) {
|
|
var types = ["neverused", "alreadyused", "outdated"];
|
|
for (let i = 0; i < types.length; i++) {
|
|
if (types[i] == type) {
|
|
this.inverted[type] = !this.inverted[type];
|
|
} else {
|
|
this.inverted[types[i]] = true;
|
|
}
|
|
}
|
|
},
|
|
getCouponlist: function () {
|
|
var params = {
|
|
page: this.page,
|
|
rows: this.rows,
|
|
offison: this.offison,
|
|
voucher_state_id: this.voucher_state_id,
|
|
},
|
|
that = this;
|
|
that.$.request({
|
|
url: this.Config.URL.user.eachVoucherNum,
|
|
data: params,
|
|
success: function (data, status, msg, code) {
|
|
if (status == 200) {
|
|
that.setData({
|
|
numAllCouponed: data.voucher_all_num,
|
|
numOfflined: data.voucher_offlined_num,
|
|
numOnlined: data.voucher_onlined_num,
|
|
numCarCouponed: data.voucher_carcoupon_num,
|
|
numNeverUsed: data.voucher_unused_num,
|
|
numAlreadyused: data.voucher_used_num,
|
|
numOutdated: data.voucher_timeout_num,
|
|
});
|
|
} else {
|
|
that.setData({
|
|
numNeverUsed: -1,
|
|
numAlreadyused: -1,
|
|
numOutdated: -1,
|
|
});
|
|
}
|
|
},
|
|
});
|
|
that.$.request({
|
|
url: this.Config.URL.user.voucherList,
|
|
data: params,
|
|
success: function (data, status, msg, code) {
|
|
if (status == 200) {
|
|
if (data.items.length > 0) {
|
|
for (let i = 0; i < data.items.length; i++) {
|
|
data.items[i]["voucher_start_date"] = that.$.dateFormat(
|
|
data.items[i]["voucher_start_date"],
|
|
"yyyy-MM-dd"
|
|
);
|
|
data.items[i]["voucher_end_date"] = that.$.dateFormat(
|
|
data.items[i]["voucher_end_date"],
|
|
"yyyy-MM-dd"
|
|
);
|
|
}
|
|
if (data.page >= data.total) {
|
|
that.setData({
|
|
UserCoupon: that.UserCoupon.concat(data.items),
|
|
flag: false,
|
|
ispage: false,
|
|
});
|
|
} else {
|
|
that.setData({
|
|
UserCoupon: that.UserCoupon.concat(data.items),
|
|
flag: true,
|
|
ispage: true,
|
|
});
|
|
}
|
|
} else {
|
|
that.setData({
|
|
flag: false,
|
|
ispage: false,
|
|
});
|
|
}
|
|
}
|
|
},
|
|
});
|
|
},
|
|
scrollbottom: function () {
|
|
if (this.flag) {
|
|
var e = this;
|
|
e.setData({
|
|
flag: false,
|
|
}),
|
|
clearTimeout(t);
|
|
var t = setTimeout(function () {
|
|
e.setData({
|
|
page: parseInt(e.page) + 1,
|
|
}),
|
|
e.getCouponlist();
|
|
}, 500);
|
|
}
|
|
},
|
|
},
|
|
};
|
|
</script>
|
|
|
|
|
|
<style lang="scss">
|
|
@import "../../styles/_variables";
|
|
|
|
.m-tab {
|
|
position: fixed;
|
|
width: 100%;
|
|
top: var(--window-top);
|
|
z-index: 2;
|
|
}
|
|
|
|
.m-navbar-item {
|
|
padding: 20rpx 0;
|
|
font-size: 24rpx;
|
|
width: 144rpx;
|
|
|
|
i {
|
|
font-size: 0rpx;
|
|
line-height: 0;
|
|
vertical-align: middle;
|
|
display: inline-block;
|
|
width: 0rpx;
|
|
height: 0rpx;
|
|
margin-left: 9.375rpx;
|
|
border-width: 9.375rpx;
|
|
border-color: #aaa transparent transparent transparent;
|
|
border-style: solid dashed dashed dashed;
|
|
}
|
|
}
|
|
|
|
.m-navbar-item:after {
|
|
border: none;
|
|
}
|
|
|
|
.m-navbar-item.m-navbar-item-on {
|
|
background-color: #fff;
|
|
color: $default-skin-bg;
|
|
}
|
|
|
|
.m-navbar-item.m-navbar-item-on::before {
|
|
content: " ";
|
|
position: absolute;
|
|
left: 0;
|
|
bottom: 0;
|
|
right: 0;
|
|
height: 6rpx;
|
|
border-bottom: 6rpx solid $default-skin-bg;
|
|
color: #cccccc;
|
|
-webkit-transform-origin: 0 100%;
|
|
transform-origin: 0 100%;
|
|
-webkit-transform: scaleY(0.5);
|
|
transform: scaleY(0.5);
|
|
z-index: 3;
|
|
}
|
|
|
|
.m-scrollBox {
|
|
padding: 96rpx 10rpx 0rpx;
|
|
position: absolute;
|
|
top: 0;
|
|
left: 0;
|
|
box-sizing: border-box;
|
|
width: 100%;
|
|
margin-bottom: 58rpx;
|
|
}
|
|
|
|
.coupon-box {
|
|
padding-top: 100upx;
|
|
}
|
|
|
|
/* .coupon-box{padding:0 10rpx} */
|
|
.coupon-item {
|
|
display: flex;
|
|
background: url(https://media-mall-prod-1259811287.cos.ap-guangzhou.myqcloud.com/static/xcxfile/appicon/coupon/use-coupon.png)
|
|
no-repeat;
|
|
background-size: cover;
|
|
position: relative;
|
|
}
|
|
|
|
.cl {
|
|
width: auto;
|
|
flex-grow: 1;
|
|
box-sizing: border-box;
|
|
padding: 10rpx 20rpx 10rpx 30rpx;
|
|
}
|
|
|
|
.clt {
|
|
height: 53rpx;
|
|
font-size: 28rpx;
|
|
line-height: 53rpx;
|
|
color: #3a3a3a;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
width: 380rpx;
|
|
}
|
|
|
|
.clb {
|
|
align-items: center;
|
|
border-bottom: 1px dashed #d5d5d5;
|
|
flex-wrap: wrap;
|
|
width: 100%;
|
|
}
|
|
|
|
.clb-where {
|
|
font-size: 24rpx;
|
|
color: #db384c;
|
|
line-height: 40rpx;
|
|
}
|
|
|
|
.clb-time {
|
|
font-size: 24rpx;
|
|
color: #999;
|
|
line-height: 48rpx;
|
|
}
|
|
|
|
.cr {
|
|
flex-basis: 50%;
|
|
height: 200rpx;
|
|
display: flex;
|
|
justify-content: center;
|
|
align-items: center;
|
|
box-sizing: border-box;
|
|
padding: 0 0 20rpx 0;
|
|
color: #fff;
|
|
flex-direction: column;
|
|
}
|
|
|
|
.crt {
|
|
font-size: 70rpx;
|
|
}
|
|
|
|
.crt label {
|
|
font-size: 28rpx;
|
|
display: inline-block;
|
|
}
|
|
|
|
.crb {
|
|
border-radius: 8rpx;
|
|
border: 1px solid #edf0f1;
|
|
font-size: 24rpx;
|
|
padding: 0 20rpx;
|
|
line-height: 40rpx;
|
|
}
|
|
|
|
.is-user {
|
|
filter: grayscale(100%);
|
|
background: url(https://media-mall-prod-1259811287.cos.ap-guangzhou.myqcloud.com/static/xcxfile/appicon/coupon/un-coupon.png)
|
|
no-repeat;
|
|
background-size: cover;
|
|
}
|
|
|
|
.is-user::after {
|
|
content: "";
|
|
position: absolute;
|
|
width: 178rpx;
|
|
height: 142rpx;
|
|
right: 200rpx;
|
|
top: 50%;
|
|
margin-top: -71rpx;
|
|
background: url(https://media-mall-prod-1259811287.cos.ap-guangzhou.myqcloud.com/static/xcxfile/appicon/coupon/already.png)
|
|
no-repeat;
|
|
background-size: cover;
|
|
}
|
|
|
|
.is-overdue {
|
|
filter: grayscale(100%);
|
|
background: url(https://media-mall-prod-1259811287.cos.ap-guangzhou.myqcloud.com/static/xcxfile/appicon/coupon/un-coupon.png)
|
|
no-repeat;
|
|
background-size: cover;
|
|
}
|
|
|
|
.is-overdue::after {
|
|
content: "";
|
|
position: absolute;
|
|
width: 178rpx;
|
|
height: 142rpx;
|
|
right: 200rpx;
|
|
top: 50%;
|
|
margin-top: -71rpx;
|
|
background: url(https://media-mall-prod-1259811287.cos.ap-guangzhou.myqcloud.com/static/xcxfile/appicon/coupon/overdue.png)
|
|
no-repeat;
|
|
background-size: cover;
|
|
}
|
|
|
|
.u-back2 image {
|
|
border-radius: 100%;
|
|
width: 77rpx;
|
|
height: 77rpx;
|
|
border: 1px solid #eee;
|
|
font-size: 20rpx;
|
|
text-align: center;
|
|
background-color: #fff;
|
|
box-shadow: 0px 4rpx 8rpx rgba(0, 0, 0, 0.35);
|
|
z-index: 999;
|
|
opacity: 0.8;
|
|
line-height: 77rpx;
|
|
margin-bottom: 20rpx;
|
|
}
|
|
|
|
.m-coupon-more {
|
|
width: 411rpx;
|
|
line-height: 55rpx;
|
|
display: flex;
|
|
}
|
|
|
|
.my_coupon {
|
|
width: 100%;
|
|
height: 108rpx;
|
|
background: #fff;
|
|
position: fixed;
|
|
bottom: 0;
|
|
}
|
|
|
|
.my_coubut {
|
|
width: 93%;
|
|
margin: 16rpx auto;
|
|
height: 79rpx;
|
|
background: $default-skin-bg;
|
|
border-radius: 10px;
|
|
font-size: 28rpx;
|
|
color: #ffffff;
|
|
text-align: center;
|
|
line-height: 79rpx;
|
|
}
|
|
|
|
.scroll-view_H {
|
|
width: 100%;
|
|
white-space: nowrap;
|
|
|
|
height: 84rpx;
|
|
|
|
.m-navbar-item {
|
|
display: inline-block;
|
|
padding-left: 20rpx;
|
|
padding-right: 20rpx;
|
|
|
|
min-width: 110rpx;
|
|
}
|
|
}
|
|
|
|
.uni-padding-wrap {
|
|
overflow: hidden;
|
|
//max-width: 400rpx;
|
|
}
|
|
|
|
.uni-common-mt {
|
|
margin-top: 30rpx;
|
|
}
|
|
|
|
.tag-view {
|
|
margin: 10rpx 0rpx;
|
|
display: inline-block;
|
|
}
|
|
|
|
.p-lists {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
|
|
.uni-tag {
|
|
width: 110rpx;
|
|
height: 70rpx;
|
|
margin-right: 16rpx;
|
|
margin-bottom: 4rpx;
|
|
background: #f5f5f5;
|
|
border-radius: 18rpx;
|
|
border: 2rpx solid #f5f5f5;
|
|
font-size: 24rpx;
|
|
font-family: PingFangSC-Regular, PingFang SC;
|
|
font-weight: 400;
|
|
color: #222222 !important;
|
|
line-height: 70rpx;
|
|
text-align: center;
|
|
overflow: hidden;
|
|
text-overflow: ellipsis;
|
|
white-space: nowrap;
|
|
}
|
|
|
|
.uni-tag--ss {
|
|
border: 2rpx solid $default-skin-bg;
|
|
background-color: #f7e9e9;
|
|
}
|
|
|
|
.ss-uni-tag--inverted {
|
|
background-color: #f5f5f5;
|
|
border: 2rpx solid #f5f5f5;
|
|
}
|
|
}
|
|
</style> |