|
|
@@ -0,0 +1,695 @@
|
|
|
+<template>
|
|
|
+ <view class="container product clearfix">
|
|
|
+ <view class="superv-header" v-if="!isEmpty">
|
|
|
+ <view class="superv-header-click">
|
|
|
+ <view class="oltext">共<text class="red">3</text>件商品</view>
|
|
|
+ <view class="ortext" @click="supervClickFn" v-if="!isSuperv">编辑</view>
|
|
|
+ <view class="ortext" @click="closeSupervFn" v-else>完成</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="product-content">
|
|
|
+ <view :class="{'tui-order-list':scrollTop >= 0}" class="clearfix">
|
|
|
+ <!-- 空白页 -->
|
|
|
+ <view class="empty-container" v-if="isEmpty">
|
|
|
+ <image class="empty-container-image" :src="StaticUrl+'/icon/icon-collection-empty@2x.png'"></image>
|
|
|
+ <text class="error-text">暂无收藏商品~</text>
|
|
|
+ </view>
|
|
|
+ <!-- 列表 -->
|
|
|
+ <view class="tui-cart-cell tui-mtop" v-for="(item,index) in dataList" :key="index">
|
|
|
+ <view class="tui-goods-item">
|
|
|
+ <view class="tui-goods-checkBox" v-if="isSuperv">
|
|
|
+ <view class="checkbox iconfont"
|
|
|
+ :class="[item.isChecked ?'icon-yixuanze':'icon-weixuanze']"
|
|
|
+ @click="checkedSoperv(item)">
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="tui-goods-image">
|
|
|
+ <image :src="item.image" class="tui-goods-img"/>
|
|
|
+ </view>
|
|
|
+ <view class="tui-goods-info" :style="{width:isSuperv ? '360rpx' : '420rpx'}">
|
|
|
+ <view class="tui-goods-title">{{ item.name }}</view>
|
|
|
+ <view class="tui-price-box">
|
|
|
+ <view class="tui-goods-price">￥{{item.price | NumFormat}}</view>
|
|
|
+ </view>
|
|
|
+ <view class="tui-goods-pip">市场价:￥{{item.normalPrice | NumFormat}}</view>
|
|
|
+ <view class="tui-goods-pip">分类:{{ item.typeName ? item.typeName : '无' }}</view>
|
|
|
+ </view>
|
|
|
+ <view class="tui-goods-status">
|
|
|
+ <view class="status-text" :style="{ color: verifyColorFilter(item.validFlag)}">
|
|
|
+ {{ item.validFlag | verifyStatusFilter }}
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <!--加载loadding-->
|
|
|
+ <tui-loadmore :visible="loadding" :index="3" type="black"></tui-loadmore>
|
|
|
+ <tui-nomore :visible="!pullUpOn" :backgroundColor="'#ffffff'" :text='nomoreText'></tui-nomore>
|
|
|
+ <!--加载loadding-->
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <!-- 批量操作 -->
|
|
|
+ <tui-bottom-popup :radius="false" :mask="false" :show="isSuperv">
|
|
|
+ <view class="tui-popup-box clearfix">
|
|
|
+ <view class="tui-right-flex tui-popup-btn" :style="{ paddingBottom :isIphoneX ? '68rpx' : '0rpx' }">
|
|
|
+ <view class="tui-flex-1">
|
|
|
+ <view class="superv-header-checked">
|
|
|
+ <view class="oltext" @click="isCheckedAll">
|
|
|
+ <view class="checkbox iconfont" :class="[isAllChecked ? 'icon-yixuanze':'icon-weixuanze']"></view>
|
|
|
+ <view class="text">全选</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ <view class="tui-button" :class="isProductChecked ? 'active' : ''" @click="handleAllUnder()">取消收藏</view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </view>
|
|
|
+ </tui-bottom-popup>
|
|
|
+ <!-- 弹窗提示 -->
|
|
|
+ <tui-modal :show="modal"
|
|
|
+ @click="handleClick"
|
|
|
+ @cancel="hideMobel"
|
|
|
+ :content="contentModalText"
|
|
|
+ color="#333"
|
|
|
+ :size="32"
|
|
|
+ shape="circle"
|
|
|
+ :maskClosable="false">
|
|
|
+ </tui-modal>
|
|
|
+ <!-- 可拖动悬浮按钮 -->
|
|
|
+ <cm-drag :cartNum="cartQuantity"
|
|
|
+ :isDock="true"
|
|
|
+ :existTabBar="true"
|
|
|
+ @btnClick="btnClick"
|
|
|
+ @btnTouchstart="btnTouchstart"
|
|
|
+ @btnTouchend="btnTouchend">
|
|
|
+ </cm-drag>
|
|
|
+ </view>
|
|
|
+</template>
|
|
|
+<script>
|
|
|
+ import tuiLoadmore from "@/components/tui-components/loadmore/loadmore"
|
|
|
+ import tuiNomore from "@/components/tui-components/nomore/nomore"
|
|
|
+ import cmDrag from '@/components/cm-custom/cm-drag.vue'
|
|
|
+
|
|
|
+ import { mapState,mapMutations } from 'vuex'
|
|
|
+ const defaultListQuery = {
|
|
|
+ userId:0,
|
|
|
+ pageNum:1,
|
|
|
+ pageSize:10
|
|
|
+ };
|
|
|
+ export default{
|
|
|
+ components: {
|
|
|
+ tuiLoadmore,
|
|
|
+ tuiNomore,
|
|
|
+ cmDrag
|
|
|
+ },
|
|
|
+ data() {
|
|
|
+ return{
|
|
|
+ StaticUrl:this.$Static,
|
|
|
+ cartQuantity:0,
|
|
|
+ isSuperv:false,
|
|
|
+ isProductChecked:false,
|
|
|
+ listQuery:Object.assign({}, defaultListQuery),
|
|
|
+ dataList: [],
|
|
|
+ scrollTop: 0,
|
|
|
+ isEmpty: true,
|
|
|
+ isAllChecked:false,
|
|
|
+ loadding: false,
|
|
|
+ pullUpOn: true,
|
|
|
+ pullFlag: true,
|
|
|
+ hasNextPage: false,
|
|
|
+ navbarHeight:'',
|
|
|
+ nomoreText: '上拉显示更多',
|
|
|
+ contentModalText:'',//操作文字提示语句
|
|
|
+ modal:false,
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onLoad(option){
|
|
|
+ this.initGetStotage()
|
|
|
+ // this.GetProductListInfo()
|
|
|
+ },
|
|
|
+ filters: {
|
|
|
+ NumFormat:function(text) {//处理金额
|
|
|
+ return Number(text).toFixed(2);
|
|
|
+ }
|
|
|
+ },
|
|
|
+ computed: {
|
|
|
+ ...mapState(['hasLogin','userInfo'])
|
|
|
+ },
|
|
|
+ methods:{
|
|
|
+ ...mapMutations(['login','logout']),
|
|
|
+ async initGetStotage(){
|
|
|
+ const userInfo = await this.$api.getStorage()
|
|
|
+ this.listQuery.userId = userInfo.userId ? userInfo.userId : 0
|
|
|
+ },
|
|
|
+ GetProductListInfo(){
|
|
|
+ this.coupinList = []
|
|
|
+ this.listQuery.pageNum = 1
|
|
|
+ this.ProductService.QueryCouponCenter(this.listQuery).then(response =>{
|
|
|
+ let data = response.data
|
|
|
+ if(data.list&&data.list.length > 0){
|
|
|
+ this.isEmpty = false
|
|
|
+ this.hasNextPage = data.hasNextPage
|
|
|
+ this.coupinList = data.list
|
|
|
+ this.pullFlag = false;
|
|
|
+ setTimeout(()=>{this.pullFlag = true;},500)
|
|
|
+ if(this.hasNextPage){
|
|
|
+ this.pullUpOn = false
|
|
|
+ this.nomoreText = '上拉显示更多'
|
|
|
+ }else{
|
|
|
+ if(this.coupinList.length < 8){
|
|
|
+ this.pullUpOn = true
|
|
|
+ }else{
|
|
|
+ this.pullUpOn = false
|
|
|
+ this.loadding = false
|
|
|
+ this.nomoreText = '已至底部'
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }else{
|
|
|
+ this.isEmpty = true
|
|
|
+ }
|
|
|
+ this.isRequest = true;
|
|
|
+ }).catch(error =>{
|
|
|
+ this.$util.msg(error.msg,2000);
|
|
|
+ })
|
|
|
+ },
|
|
|
+ GetOnReachBottomData(index){//上拉加载
|
|
|
+ this.listQuery.pageNum+=1
|
|
|
+ this.ProductService.QueryCouponCenter(this.listQuery).then(response =>{
|
|
|
+ let data = response.data
|
|
|
+ if(data.list&&data.list.length > 0){
|
|
|
+ this.hasNextPage = data.hasNextPage
|
|
|
+ this.coupinList = this.coupinList.concat(data.list)
|
|
|
+ this.pullFlag = false;// 防上拉暴滑
|
|
|
+ setTimeout(()=>{this.pullFlag = true;},500)
|
|
|
+ if(this.hasNextPage){
|
|
|
+ this.pullUpOn = false
|
|
|
+ this.nomoreText = '上拉显示更多'
|
|
|
+ }else{
|
|
|
+ this.pullUpOn = false
|
|
|
+ this.loadding = false
|
|
|
+ this.nomoreText = '已至底部'
|
|
|
+ }
|
|
|
+ }
|
|
|
+ })
|
|
|
+ .catch(error =>{
|
|
|
+ this.$util.msg(error.msg,2000)
|
|
|
+ })
|
|
|
+ },
|
|
|
+ handlerButton(e,item){//监听侧滑按钮点击事件
|
|
|
+ if(item.validFlag === 0 || item.validFlag === 3 || item.validFlag === 8 || item.validFlag === 9){
|
|
|
+ if(e.index == 0){
|
|
|
+ return
|
|
|
+ }
|
|
|
+ }else if(item.validFlag === 1 || item.validFlag === 10){
|
|
|
+ if(e.index == 0){
|
|
|
+ this.$api.navigateTo(`/pages/goods/product?id=${item.productId}`)
|
|
|
+ }
|
|
|
+ }else if(item.validFlag === 2){
|
|
|
+ switch(e.index){
|
|
|
+ case 0:
|
|
|
+ this.$api.navigateTo(`/pages/goods/product?id=${item.productId}`)
|
|
|
+ break;
|
|
|
+ case 1:
|
|
|
+ if(item.featuredFlag === 1){
|
|
|
+ this.handleDeleteShopRemb(item)
|
|
|
+ }else{
|
|
|
+ this.handleAddShopRemb(item)
|
|
|
+ }
|
|
|
+ break;
|
|
|
+ case 2:
|
|
|
+ this.handleUnder(item)
|
|
|
+ }
|
|
|
+ }
|
|
|
+ },
|
|
|
+ handleAddShopRemb(item){//添加主页推荐
|
|
|
+ let num = 4- this.featuredNum;
|
|
|
+ this.OperationType = 'add'
|
|
|
+ this.handlerProduct = item
|
|
|
+ this.modal = true;
|
|
|
+ this.contentModalText = `总共能添加4个主推商品，您还能添加${num}个确定将该商品添加为主推商品吗？`;
|
|
|
+ },
|
|
|
+ handleDeleteShopRemb(item){//删除主页推荐
|
|
|
+ this.OperationType = 'delete'
|
|
|
+ this.handlerProduct = item
|
|
|
+ this.modal = true;
|
|
|
+ this.contentModalText = '是否把该商品从主推商品中删除？';
|
|
|
+ },
|
|
|
+ handleUnder(item){//下架操作
|
|
|
+ this.OperationType = 'under'
|
|
|
+ this.handlerProduct = item
|
|
|
+ this.modal = true;
|
|
|
+ this.contentModalText = '确定下架该商品吗？';
|
|
|
+ },
|
|
|
+ handleAllUnder(){//批量下架操作
|
|
|
+ let checkedArray = [];
|
|
|
+ let isValidFlag = false;
|
|
|
+ this.productIds = '';
|
|
|
+ if(this.isProductChecked){
|
|
|
+ this.dataList.forEach(el => {
|
|
|
+ if(el.isChecked) {
|
|
|
+ checkedArray.push(el)
|
|
|
+ }
|
|
|
+ })
|
|
|
+ checkedArray.forEach(el =>{
|
|
|
+ if(el.validFlag == 2){
|
|
|
+ this.productIds += el.productId+','
|
|
|
+ }
|
|
|
+ if(el.validFlag != 2){
|
|
|
+ isValidFlag = true;
|
|
|
+ }
|
|
|
+ })
|
|
|
+ if(isValidFlag){
|
|
|
+ this.$util.modal('','部分选中的商品暂未上架，不能进行下架操作','确定','',false,() =>{})
|
|
|
+ return;
|
|
|
+ }
|
|
|
+ this.OperationType = 'allunder'
|
|
|
+ this.modal = true;
|
|
|
+ this.contentModalText = '确定下架选中的商品吗？';
|
|
|
+ }
|
|
|
+ },
|
|
|
+ handleClick(e) {//弹窗提示用户操作
|
|
|
+ if(e.index == 1){
|
|
|
+ switch(this.OperationType){
|
|
|
+ case 'delete'://删除主页推荐
|
|
|
+ this.SupplierDeleteSwitchFeatured(this.handlerProduct)
|
|
|
+ break;
|
|
|
+ case 'add'://添加主页推荐
|
|
|
+ this.SupplierAddSwitchFeatured(this.handlerProduct)
|
|
|
+ break;
|
|
|
+ case 'under'://下架商品
|
|
|
+ this.SupplierSoldOutProduct(this.handlerProduct)
|
|
|
+ break;
|
|
|
+ case 'allunder'://批量下架
|
|
|
+ this.SupplierAllSoldOutProduct(this.productIds)
|
|
|
+ break;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ this.modal = false;
|
|
|
+ },
|
|
|
+ SupplierDeleteSwitchFeatured(item){//操作删除主页推荐
|
|
|
+ this.ShopService.SupplierSwitchFeaturedyProduct({productId:item.productId,featuredFlag:0}).then(response =>{
|
|
|
+ this.$util.msg('删除成功',2000,true,'success');
|
|
|
+ setTimeout(() => {
|
|
|
+ this.GetProductListInfo()
|
|
|
+ },2000)
|
|
|
+ }).catch(error =>{
|
|
|
+ this.$util.msg(error.msg,2000)
|
|
|
+ })
|
|
|
+ },
|
|
|
+ SupplierAddSwitchFeatured(item){//操作添加主页推荐
|
|
|
+ this.ShopService.SupplierSwitchFeaturedyProduct({productId:item.productId,featuredFlag:1}).then(response =>{
|
|
|
+ this.$util.msg('添加成功',2000,true,'success');
|
|
|
+ setTimeout(() => {
|
|
|
+ this.GetProductListInfo()
|
|
|
+ },2000)
|
|
|
+ }).catch(error =>{
|
|
|
+ this.$util.msg(error.msg,2000)
|
|
|
+ })
|
|
|
+ },
|
|
|
+ SupplierSoldOutProduct(item){//操作下架商品
|
|
|
+ this.ShopService.SupplierSoldOutProduct({productIds:item.productId}).then(response =>{
|
|
|
+ this.$util.msg('下架成功',2000,true,'success');
|
|
|
+ setTimeout(() => {
|
|
|
+ this.GetProductListInfo()
|
|
|
+ },2000)
|
|
|
+ }).catch(error =>{
|
|
|
+ this.$util.msg(error.msg,2000)
|
|
|
+ })
|
|
|
+ },
|
|
|
+ SupplierAllSoldOutProduct(ids){//操作批量下架商品
|
|
|
+ this.ShopService.SupplierSoldOutProduct({productIds:ids}).then(response =>{
|
|
|
+ this.$util.msg('下架成功',2000,true,'success');
|
|
|
+ this.productIds = '';
|
|
|
+ setTimeout(() => {
|
|
|
+ this.GetProductListInfo()
|
|
|
+ },2000)
|
|
|
+ }).catch(error =>{
|
|
|
+ this.$util.msg(error.msg,2000)
|
|
|
+ })
|
|
|
+ },
|
|
|
+ hideMobel(){
|
|
|
+ this.modal = false;
|
|
|
+ },
|
|
|
+ updateCheckAllBtn() {//勾选单个判断全选
|
|
|
+ let goodsCheckedLength = 0
|
|
|
+ this.dataList.forEach(item => {
|
|
|
+ if(item.isChecked) { goodsCheckedLength++; }
|
|
|
+ })
|
|
|
+ this.isAllChecked = goodsCheckedLength === this.dataList.length;
|
|
|
+ if(goodsCheckedLength>0){
|
|
|
+ this.isProductChecked = true
|
|
|
+ }else{
|
|
|
+ this.isProductChecked = false
|
|
|
+ }
|
|
|
+ },
|
|
|
+ updateBothCheckBtn() {//全选勾选判断
|
|
|
+ this.dataList.forEach((item)=>{
|
|
|
+ item.isChecked = this.isAllChecked
|
|
|
+ })
|
|
|
+ },
|
|
|
+ isCheckedAll(){//全选
|
|
|
+ this.isAllChecked = !this.isAllChecked
|
|
|
+ if(this.isAllChecked){
|
|
|
+ this.isProductChecked = true
|
|
|
+ }else{
|
|
|
+ this.isProductChecked = false
|
|
|
+ }
|
|
|
+ this.updateBothCheckBtn()
|
|
|
+ },
|
|
|
+ checkedSoperv(item){//选择
|
|
|
+ item.isChecked = !item.isChecked
|
|
|
+ console.log(item)
|
|
|
+ this.updateCheckAllBtn()
|
|
|
+ },
|
|
|
+ supervClickFn(){//管理全选
|
|
|
+ this.isSuperv = true
|
|
|
+ },
|
|
|
+ closeSupervFn(){
|
|
|
+ this.isSuperv = false
|
|
|
+ },
|
|
|
+ btnClick() {
|
|
|
+ this.$emit('goCartPage')
|
|
|
+ },
|
|
|
+ btnTouchstart() {
|
|
|
+ // console.log('btnTouchstart');
|
|
|
+ },
|
|
|
+ btnTouchend() {
|
|
|
+ // console.log('btnTouchend');
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onPageScroll(e){//实时获取到滚动的值
|
|
|
+
|
|
|
+ },
|
|
|
+ onReachBottom() {
|
|
|
+ if(this.hasNextPage){
|
|
|
+ this.loadding = true
|
|
|
+ this.pullUpOn = true
|
|
|
+ this.GetOnReachBottomData()
|
|
|
+ }
|
|
|
+ },
|
|
|
+ onPullDownRefresh() {
|
|
|
+ setTimeout(() => {
|
|
|
+ this.listQuery.pageNum = 1
|
|
|
+ uni.stopPullDownRefresh()
|
|
|
+ }, 200)
|
|
|
+ },
|
|
|
+ onShow(){
|
|
|
+
|
|
|
+ }
|
|
|
+ }
|
|
|
+</script>
|
|
|
+
|
|
|
+<style lang="scss">
|
|
|
+ @import "@/uni.scss";
|
|
|
+ page{
|
|
|
+ background:#FFF;
|
|
|
+ }
|
|
|
+ .empty-container{
|
|
|
+ z-index: 9999;
|
|
|
+ }
|
|
|
+ .superv-header{
|
|
|
+ width: 100%;
|
|
|
+ height: 80rpx;
|
|
|
+ background-color: #F7F7F7;
|
|
|
+ line-height: 80rpx;
|
|
|
+ position: fixed;
|
|
|
+ top: 0;
|
|
|
+ left: 0;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding: 0 24rpx;
|
|
|
+ z-index: 999;
|
|
|
+ .superv-header-click{
|
|
|
+ width: 100%;
|
|
|
+ height: 80rpx;
|
|
|
+ font-size: $font-size-30;
|
|
|
+ .oltext{
|
|
|
+ float: left;
|
|
|
+ color: #666666;
|
|
|
+ .red{
|
|
|
+ color: $color-system;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .ortext{
|
|
|
+ float: right;
|
|
|
+ color: #333333;
|
|
|
+ text-align: right;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .tui-header {
|
|
|
+ width: 100%;
|
|
|
+ font-size: 16px;
|
|
|
+ font-weight: 500;
|
|
|
+ height: 32px;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ position: relative;
|
|
|
+ padding: 0 40rpx;
|
|
|
+ }
|
|
|
+ .header-sit{
|
|
|
+ width:100%;
|
|
|
+ box-sizing: border-box;
|
|
|
+ height: 80rpx;
|
|
|
+ line-height: 80rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ padding:0 40rpx;
|
|
|
+ text-align: left;
|
|
|
+ font-size: $font-size-40;
|
|
|
+ color: #FFFFFF;
|
|
|
+ font-weight: 600;
|
|
|
+ font-family: '正楷';
|
|
|
+ margin-top: 30rpx;
|
|
|
+ .iconfont{
|
|
|
+ font-size: 42rpx;
|
|
|
+ margin-left: 30rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .mine{
|
|
|
+ width: 100%;
|
|
|
+ height: 100%;
|
|
|
+ position:relative;
|
|
|
+ }
|
|
|
+ .product-content{
|
|
|
+ width: 100%;
|
|
|
+ height: auto;
|
|
|
+ position: relative;
|
|
|
+ padding:0;
|
|
|
+ padding-top: 80rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ .empty-container-image {
|
|
|
+ width: 260rpx;
|
|
|
+ height: 260rpx;
|
|
|
+ margin-top: -300rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .tui-goods-item {
|
|
|
+ display: flex;
|
|
|
+ padding: 30rpx 20rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ border-bottom: 1px solid #EBEBEB;
|
|
|
+ position: relative;
|
|
|
+ }
|
|
|
+ .tui-goods-checkBox{
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ margin: 0 15rpx;
|
|
|
+ .checkbox{
|
|
|
+ display: flex;
|
|
|
+ margin: 0;
|
|
|
+ padding: 0;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ align-items: center;
|
|
|
+ box-sizing: border-box;
|
|
|
+ text-align: center;
|
|
|
+ text-decoration: none;
|
|
|
+ border-radius: 0;
|
|
|
+ -webkit-tap-highlight-color: transparent;
|
|
|
+ overflow: hidden;
|
|
|
+ background-color:#FFFFFF;
|
|
|
+ font-size: 36rpx;
|
|
|
+ color:$color-system;
|
|
|
+ }
|
|
|
+ .text{
|
|
|
+ font-size: $font-size-24;
|
|
|
+ margin-left: 10rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .tui-goods-image{
|
|
|
+ width: 180rpx;
|
|
|
+ height: 180rpx !important;
|
|
|
+ border-radius: 12rpx;
|
|
|
+ .tui-goods-img {
|
|
|
+ width: 180rpx;
|
|
|
+ height: 180rpx !important;
|
|
|
+ border-radius: 12rpx;
|
|
|
+ flex-shrink: 0;
|
|
|
+ display: block;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .tui-goods-info {
|
|
|
+ padding-left: 20rpx;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ align-items: flex-start;
|
|
|
+ justify-content: space-between;
|
|
|
+ box-sizing: border-box;
|
|
|
+ overflow: hidden;
|
|
|
+ position: relative;
|
|
|
+ }
|
|
|
+ .tui-goods-status{
|
|
|
+ width: 160rpx;
|
|
|
+ position: absolute;
|
|
|
+ right: 0;
|
|
|
+ .status-text{
|
|
|
+ font-size: $font-size-24;
|
|
|
+ line-height: 44rpx;
|
|
|
+ text-align: center;
|
|
|
+ color: #666666;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .tui-goods-title {
|
|
|
+ white-space: normal;
|
|
|
+ word-break: break-all;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ display: -webkit-box;
|
|
|
+ -webkit-box-orient: vertical;
|
|
|
+ -webkit-line-clamp: 2;
|
|
|
+ font-size: 26rpx;
|
|
|
+ color: #333;
|
|
|
+ line-height: 44rpx;
|
|
|
+ }
|
|
|
+ .tui-goods-pip{
|
|
|
+ white-space: normal;
|
|
|
+ word-break: break-all;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ display: -webkit-box;
|
|
|
+ -webkit-box-orient: vertical;
|
|
|
+ -webkit-line-clamp: 2;
|
|
|
+ font-size: 24rpx;
|
|
|
+ color: #999;
|
|
|
+ line-height: 44rpx;
|
|
|
+ }
|
|
|
+ .tui-goods-ediet{
|
|
|
+ width: 60rpx;
|
|
|
+ height: 60rpx;
|
|
|
+ background: linear-gradient(90deg,rgba(122,165,250,1) 0%,rgba(87,110,250,1) 100%);
|
|
|
+ border-radius: 50%;
|
|
|
+ line-height: 60rpx;
|
|
|
+ text-align: center;
|
|
|
+ position: absolute;
|
|
|
+ right: 0;
|
|
|
+ top: 50%;
|
|
|
+ .icon-bianji1 {
|
|
|
+ flex-shrink: 0;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: center;
|
|
|
+ color: #FFFFFF;
|
|
|
+ font-size: 24rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .tui-goods-model {
|
|
|
+ max-width: 100%;
|
|
|
+ color: #FFFFFF;
|
|
|
+ background: #4688fa;
|
|
|
+ border-radius: 40rpx;
|
|
|
+ display: flex;
|
|
|
+ align-items: center;
|
|
|
+ justify-content: space-between;
|
|
|
+ padding: 0 20rpx;
|
|
|
+ box-sizing: border-box;
|
|
|
+ margin-top: 10rpx;
|
|
|
+ }
|
|
|
+
|
|
|
+ .tui-model-text {
|
|
|
+ max-width: 100%;
|
|
|
+ transform: scale(0.9);
|
|
|
+ transform-origin: 0 center;
|
|
|
+ font-size: 24rpx;
|
|
|
+ line-height: 40rpx;
|
|
|
+ white-space: nowrap;
|
|
|
+ overflow: hidden;
|
|
|
+ text-overflow: ellipsis;
|
|
|
+ }
|
|
|
+
|
|
|
+ .tui-price-box {
|
|
|
+ width: 100%;
|
|
|
+ display: flex;
|
|
|
+ align-items: flex-end;
|
|
|
+ justify-content: space-between;
|
|
|
+ }
|
|
|
+
|
|
|
+ .tui-goods-price {
|
|
|
+ font-size: $font-size-28;
|
|
|
+ font-weight: 500;
|
|
|
+ color: #FF201F;
|
|
|
+ }
|
|
|
+ .tui-popup-box {
|
|
|
+ position: relative;
|
|
|
+ box-sizing: border-box;
|
|
|
+ min-height: 200rpx;
|
|
|
+ padding:6rpx 24rpx;
|
|
|
+ }
|
|
|
+ .tui-popup-btn {
|
|
|
+ width: 100%;
|
|
|
+ height: auto;
|
|
|
+ float: left;
|
|
|
+ box-sizing: border-box;
|
|
|
+ margin-top: 30rpx;
|
|
|
+ .superv-header-checked{
|
|
|
+ float: left;
|
|
|
+ font-size: $font-size-30;
|
|
|
+ .oltext{
|
|
|
+ width: 120rpx;
|
|
|
+ float: left;
|
|
|
+ color: #666666;
|
|
|
+ display: flex;
|
|
|
+ margin-left: 10rpx;
|
|
|
+ .checkbox{
|
|
|
+ display: flex;
|
|
|
+ margin: 0;
|
|
|
+ padding: 0;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ align-items: center;
|
|
|
+ box-sizing: border-box;
|
|
|
+ text-align: center;
|
|
|
+ text-decoration: none;
|
|
|
+ border-radius: 0;
|
|
|
+ -webkit-tap-highlight-color: transparent;
|
|
|
+ overflow: hidden;
|
|
|
+ font-size: 34rpx;
|
|
|
+ color:$color-system;
|
|
|
+ line-height: 80rpx;
|
|
|
+ }
|
|
|
+ .text{
|
|
|
+ float: left;
|
|
|
+ line-height: 80rpx;
|
|
|
+ margin-left: 15rpx;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .ortext{
|
|
|
+ width: 120rpx;
|
|
|
+ float: right;
|
|
|
+ color: $color-system;
|
|
|
+ text-align: right;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ .tui-button{
|
|
|
+ width: 210rpx;
|
|
|
+ height: 88rpx;
|
|
|
+ float: right;
|
|
|
+ background: #e1e1e1;
|
|
|
+ line-height: 88rpx;
|
|
|
+ text-align: center;
|
|
|
+ color: #FFFFFF;
|
|
|
+ font-size: $font-size-28;
|
|
|
+ border-radius: 44rpx;
|
|
|
+ &.active{
|
|
|
+ background: $btn-confirm;
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+</style>
|
