界面优化
26
App.vue
|
@ -16,14 +16,14 @@
|
|||
checkLogin
|
||||
} from "./libs/login";
|
||||
import {
|
||||
|
||||
|
||||
getUserInfo
|
||||
|
||||
|
||||
} from '@/api/user.js';
|
||||
import {
|
||||
HTTP_REQUEST_URL
|
||||
} from './config/app';
|
||||
|
||||
|
||||
import {
|
||||
getconfig,
|
||||
history
|
||||
|
@ -79,17 +79,29 @@
|
|||
imgColor: '',
|
||||
...uni.getStorageSync('GLOBAL_DATA') || {}
|
||||
},
|
||||
onLaunch: function(option) {
|
||||
onLaunch(option) {
|
||||
// console.log(option,'1111111111')
|
||||
uni.sendHostEvent('log', option, (ret) => {
|
||||
//发送消息成功回调
|
||||
console.log('消息成功' + JSON.stringify(option));
|
||||
|
||||
});
|
||||
|
||||
this.globalData.statusBarHeight = uni.getSystemInfoSync().statusBarHeight + 'px';
|
||||
this.globalData.uid = this.$store.state.app.uid;
|
||||
let appkey = uni.getStorage({
|
||||
key: 'launchFlag'
|
||||
})
|
||||
|
||||
|
||||
|
||||
|
||||
if (option.referrerInfo?.extraData?.uniMP) {
|
||||
uni.setStorageSync('uniMP', option.referrerInfo?.extraData?.uniMP);
|
||||
uni.setStorageSync('APP_token', option.referrerInfo?.extraData?.token);
|
||||
|
||||
// uni.setStorageSync('APP_token', option.referrerInfo?.extraData?.token);
|
||||
this.$store.commit("LOGIN", {
|
||||
'token': option.referrerInfo?.extraData?.token,
|
||||
'time': 604800
|
||||
});
|
||||
}
|
||||
// #ifdef APP-PLUS
|
||||
|
||||
|
|
216
pages.json
|
@ -1280,75 +1280,6 @@
|
|||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"root": "pages/plantGrass",
|
||||
"name": "plant_grass",
|
||||
"pages": [{
|
||||
"path": "plant_detail/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "内容详情",
|
||||
"navigationStyle": "custom",
|
||||
"enablePullDownRefresh": false
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "plant_release/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "内容发布",
|
||||
"enablePullDownRefresh": false
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "plant_show/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "种草秀"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "plant_topic/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "话题筛选"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "plant_search/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "搜索"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "plant_search_list/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "搜索结果"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "plant_featured/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "为你精选"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "plant_user/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "个人主页"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "plant_user_attention/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "我的关注"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "plant_user_fans/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "我的粉丝"
|
||||
}
|
||||
}
|
||||
|
||||
]
|
||||
},
|
||||
{
|
||||
"root": "pages/columnGoods",
|
||||
"name": "columnGoods",
|
||||
|
@ -1423,153 +1354,6 @@
|
|||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"root": "pages/activity",
|
||||
"name": "activity",
|
||||
"pages": [{
|
||||
"path": "goods_seckill/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "限时秒杀",
|
||||
"navigationBarBackgroundColor": "#F2F2F2"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "goods_seckill_details/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "秒杀详情",
|
||||
"navigationStyle": "custom"
|
||||
// #ifdef MP || APP-PLUS
|
||||
,
|
||||
"navigationBarTextStyle": "#fff"
|
||||
// #endif
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "liveBroadcast/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "直播列表",
|
||||
"navigationBarBackgroundColor": "#F2F2F2"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "presell/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "预售列表"
|
||||
// #ifdef MP || APP-PLUS
|
||||
,
|
||||
"navigationBarBackgroundColor": "#F2F2F2"
|
||||
// #endif
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "presell_details/index",
|
||||
"style": {
|
||||
"navigationStyle": "custom"
|
||||
// #ifdef MP || APP-PLUS
|
||||
,
|
||||
"navigationBarTextStyle": "#fff"
|
||||
// #endif
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "combination/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "拼团"
|
||||
// #ifdef MP || APP-PLUS
|
||||
,
|
||||
"navigationBarBackgroundColor": "#F2F2F2"
|
||||
// #endif
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "combination_details/index",
|
||||
"style": {
|
||||
"navigationStyle": "custom",
|
||||
"navigationBarTitleText": "拼团详情",
|
||||
"navigationBarBackgroundColor": "#F2F2F2"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "combination_status/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "拼团状态"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "assist/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "助力列表",
|
||||
"navigationBarBackgroundColor": "#F2F2F2"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "assist_detail/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "发起助力"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "assist_record/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "助力记录"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "topic/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "活动专场"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "topic_detail/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "主题活动"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "lifeService/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "本地服务"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "collect_coupons/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "领劵中心"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "rank/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "热卖排行"
|
||||
}
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"root": "pages/short_video",
|
||||
"name": "shortVideo",
|
||||
"pages": [{
|
||||
"navigationBarTitleText": "短视频",
|
||||
"enablePullDownRefresh": false,
|
||||
//#ifdef APP
|
||||
"path": "appSwiper/index",
|
||||
//#endif
|
||||
//#ifndef APP
|
||||
"path": "nvueSwiper/index",
|
||||
//#endif
|
||||
"style": {
|
||||
"navigationBarTitleText": "社区视频",
|
||||
"navigationStyle": "custom",
|
||||
"app-plus": {
|
||||
"titleNView": false,
|
||||
|
||||
"bounce": "none"
|
||||
}
|
||||
}
|
||||
|
||||
}]
|
||||
},
|
||||
{
|
||||
"root": "pages/annex",
|
||||
"name": "annx",
|
||||
|
|
|
@ -1,305 +0,0 @@
|
|||
<template>
|
||||
<view :style="viewColor" class="page_container">
|
||||
<view class='bargain-list'>
|
||||
<!-- #ifdef H5 -->
|
||||
<view class="fixed-head">
|
||||
<view class="sys-head" :style="{height:statusBarHeight}"></view>
|
||||
<view class="tool-bar">
|
||||
<view class='iconfont icon-xiangzuo' @tap='goBack'></view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- #endif -->
|
||||
<view class='header'>
|
||||
<image mode="widthFix" class="assistBg" :src="domain+'assist_bg'+keyColor+'.png'" alt="">
|
||||
</view>
|
||||
<view class='list'>
|
||||
<block v-for="(item,index) in assistList" :key="index">
|
||||
<view class='item acea-row row-between-wrapper' @tap="openSubscribe(item.product_assist_id)">
|
||||
<view class='pictrue'>
|
||||
<image :src='item.product.image'></image>
|
||||
</view>
|
||||
<view class='text acea-row row-column-around'>
|
||||
<view class='name line1'>{{item.store_name}}</view>
|
||||
<view class='num'><text class='iconfont icon-pintuan'></text>{{item.user_count}}人正在参与</view>
|
||||
<view class='money'>助力价: ¥<text class='price'>{{item.assistSku ? item.assistSku[0].assist_price : ''}}</text></view>
|
||||
</view>
|
||||
<view class='cutBnt'></text>发起助力</view>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
<home></home>
|
||||
<authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize>
|
||||
<!-- #ifndef H5 -->
|
||||
<passwordPopup></passwordPopup>
|
||||
<!-- #endif -->
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// +----------------------------------------------------------------------
|
||||
// | CRMEB [ CRMEB赋能开发者,助力企业发展 ]
|
||||
// +----------------------------------------------------------------------
|
||||
// | Copyright (c) 2016~2021 https://www.crmeb.com All rights reserved.
|
||||
// +----------------------------------------------------------------------
|
||||
// | Licensed CRMEB并不是自由软件,未经许可不能去掉CRMEB相关版权
|
||||
// +----------------------------------------------------------------------
|
||||
// | Author: CRMEB Team <admin@crmeb.com>
|
||||
// +----------------------------------------------------------------------
|
||||
import {
|
||||
getAssistList,
|
||||
initiateAssistApi
|
||||
} from '../../../api/activity.js';
|
||||
import home from '@/components/home/index.vue';
|
||||
import { getUserInfo } from '@/api/user.js';
|
||||
import { mapGetters } from "vuex";
|
||||
import { configMap } from "@/utils";
|
||||
import { HTTP_REQUEST_URL } from '@/config/app';
|
||||
import authorize from '@/components/Authorize';
|
||||
// #ifndef H5
|
||||
import passwordPopup from '@/components/passwordPopup';
|
||||
// #endif
|
||||
export default {
|
||||
components: {
|
||||
home,
|
||||
// #ifndef H5
|
||||
passwordPopup,
|
||||
// #endif
|
||||
authorize
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
domain: HTTP_REQUEST_URL+'/static/diy/',
|
||||
topImage: '',
|
||||
assistList: [],
|
||||
active: 0,
|
||||
type: 0,
|
||||
scrollLeft: 0,
|
||||
interval: 0,
|
||||
status: 1,
|
||||
page: 1,
|
||||
limit: 8,
|
||||
loading: false,
|
||||
loadend: false,
|
||||
pageloading: false,
|
||||
userInfo: {},
|
||||
isAuto: false, //没有授权的不会自动授权
|
||||
isShowAuth: false, //是否隐藏授权
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 用户点击右上角分享
|
||||
*/
|
||||
// #ifdef MP
|
||||
onShareAppMessage: function() {
|
||||
wx.showShareMenu({
|
||||
withShareTicket: true,
|
||||
menus: ['shareAppMessage', 'shareTimeline']
|
||||
})
|
||||
return {
|
||||
title: '助力活动',
|
||||
path: 'pages/activity/assist/index',
|
||||
}
|
||||
},
|
||||
onShareTimeline: function() {
|
||||
return {
|
||||
title: '助力活动',
|
||||
query: {
|
||||
key: ''
|
||||
},
|
||||
imageUrl: ''
|
||||
}
|
||||
},
|
||||
// #endif
|
||||
computed: configMap({statusBarHeight:0},mapGetters(['isLogin','viewColor','keyColor'])),
|
||||
watch:{
|
||||
isLogin:{
|
||||
handler:function(newV,oldV){
|
||||
if(newV){
|
||||
this.getUserInfo();
|
||||
this.getAssistProductList();
|
||||
}
|
||||
},
|
||||
deep:true
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
this.getAssistProductList();
|
||||
if (this.isLogin) {
|
||||
this.getUserInfo();
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
goBack: function() {
|
||||
uni.navigateBack();
|
||||
},
|
||||
// 微信登录回调
|
||||
onLoadFun: function(e) {
|
||||
this.getUserInfo();
|
||||
this.isShowAuth = false
|
||||
},
|
||||
getAssistProductList: function() {
|
||||
var that = this;
|
||||
var data = {
|
||||
page: that.page,
|
||||
limit: that.limit,
|
||||
};
|
||||
if (that.loadend) return;
|
||||
if (that.pageloading) return;
|
||||
this.pageloading = true
|
||||
getAssistList(data).then(res => {
|
||||
// console.log(res);
|
||||
var assistList = res.data.list;
|
||||
var loadend = assistList.length < that.limit;
|
||||
that.page++;
|
||||
that.assistList = that.assistList.concat(assistList),
|
||||
that.pageloading = false;
|
||||
that.loadend = loadend;
|
||||
}).catch(err => {
|
||||
that.pageloading = false
|
||||
});
|
||||
},
|
||||
openSubscribe: function(id) {
|
||||
if(this.isLogin){
|
||||
initiateAssistApi(id).then(res => {
|
||||
let id = res.data.product_assist_set_id;
|
||||
uni.hideLoading();
|
||||
uni.navigateTo({
|
||||
url: '/pages/activity/assist_detail/index?id='+id
|
||||
});
|
||||
}).catch((err) => {
|
||||
uni.showToast({
|
||||
title:err,
|
||||
icon:'none'
|
||||
})
|
||||
});
|
||||
}else{
|
||||
this.isAuto = true;
|
||||
this.isShowAuth = true
|
||||
}
|
||||
},
|
||||
// 授权关闭
|
||||
authColse: function(e) {
|
||||
this.isShowAuth = e
|
||||
},
|
||||
/*
|
||||
* 获取用户信息
|
||||
*/
|
||||
getUserInfo: function() {
|
||||
let that = this;
|
||||
getUserInfo().then(res => {
|
||||
that.$set(that, 'userInfo', res.data);
|
||||
});
|
||||
},
|
||||
},
|
||||
/**
|
||||
* 页面上拉触底事件的处理函数
|
||||
*/
|
||||
onReachBottom: function() {
|
||||
this.getAssistProductList();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.page_container {
|
||||
min-height: 100vh;
|
||||
background-color: var(--view-theme);
|
||||
}
|
||||
.bargain-list .header {
|
||||
width: 100%;
|
||||
position: relative;
|
||||
}
|
||||
.bargain-list .header .assistBg {
|
||||
width: 750rpx;
|
||||
}
|
||||
.bargain-list .list {
|
||||
background-color: #fff;
|
||||
border: 6rpx solid #fc8b42;
|
||||
border-radius: 30rpx;
|
||||
margin: -90rpx 30rpx 66rpx 30rpx;
|
||||
padding: 0 24rpx;
|
||||
position: relative;
|
||||
top: -50rpx;
|
||||
}
|
||||
.bargain-list .list .item {
|
||||
border-bottom: 1px solid #eee;
|
||||
position: relative;
|
||||
height: 223rpx;
|
||||
}
|
||||
.bargain-list .list .item .pictrue {
|
||||
width: 160rpx;
|
||||
height: 160rpx;
|
||||
}
|
||||
.bargain-list .list .item .pictrue image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 6rpx;
|
||||
}
|
||||
.bargain-list .list .item .text {
|
||||
width: 450rpx;
|
||||
font-size: 30rpx;
|
||||
color: #282828;
|
||||
height: 160rpx;
|
||||
}
|
||||
.bargain-list .list .item .text .name {
|
||||
width: 100%;
|
||||
}
|
||||
.bargain-list .list .item .text .num {
|
||||
font-size: 26rpx;
|
||||
color: #999;
|
||||
}
|
||||
.bargain-list .list .item .text .num .iconfont {
|
||||
font-size: 35rpx;
|
||||
margin-right: 7rpx;
|
||||
}
|
||||
.bargain-list .list .item .text .money {
|
||||
font-size: 24rpx;
|
||||
font-weight: bold;
|
||||
color: var(--view-priceColor);
|
||||
}
|
||||
.bargain-list .list .item .text .money .price {
|
||||
font-size: 32rpx;
|
||||
}
|
||||
.bargain-list .list .item .cutBnt {
|
||||
position: absolute;
|
||||
width: 180rpx;
|
||||
border-radius: 50rpx;
|
||||
font-size: 26rpx;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
padding: 10rpx 0;
|
||||
right: 0;
|
||||
bottom: 44rpx;
|
||||
box-shadow: 0 7rpx 0 var(--view-theme);
|
||||
background-color: var(--view-theme);
|
||||
}
|
||||
.bargain-list .list .item .cutBnt .iconfont {
|
||||
margin-right: 8rpx;
|
||||
font-size: 30rpx;
|
||||
}
|
||||
.bargain-list .list .load {
|
||||
font-size: 24rpx;
|
||||
height: 85rpx;
|
||||
text-align: center;
|
||||
line-height: 85rpx;
|
||||
}
|
||||
.tool-bar{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 40px;
|
||||
}
|
||||
.fixed-head{
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 20px;
|
||||
width: 100%;
|
||||
z-index: 10;
|
||||
.icon-xiangzuo {
|
||||
margin-right: 40rpx;
|
||||
margin-left: 20rpx;
|
||||
font-size: 40rpx;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
</style>
|
|
@ -1,297 +0,0 @@
|
|||
<template>
|
||||
<view :style="viewColor">
|
||||
<block v-if="bargain.length>0">
|
||||
<div class="bargain-record" ref="container">
|
||||
<div class="item" v-for="(item, index) in bargain" :key="index">
|
||||
<div class="picTxt acea-row row-between-wrapper">
|
||||
<div v-if="item.product" class="pictrue">
|
||||
<image :src="item.product.image ? item.product.image : ''" />
|
||||
</div>
|
||||
<div class="text acea-row row-column-around">
|
||||
<div v-if="item.product" class="line1" style="width: 100%;">{{ item.product.store_name }}</div>
|
||||
<count-down :justify-left="'justify-content:left'" :is-day="true" :tip-text="'倒计时 '" :day-text="' 天 '" :hour-text="' 时 '" :minute-text="' 分 '"
|
||||
:second-text="' 秒'" :datatime="item.stop_time" v-if="item.status === 1" :id="item.product_assist_set_id"></count-down>
|
||||
<view class="acea-row price_count">
|
||||
<view class='money t-color'>
|
||||
助力价: ¥
|
||||
<text class='num' v-if="item.assistSku && item.assistSku[0]">{{item.assistSku[0].assist_price}}</text>
|
||||
</view>
|
||||
<view class='money money_lf' v-if="item.product">
|
||||
<text class="under_price">¥{{item.product.price}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</div>
|
||||
</div>
|
||||
<div class="bottom acea-row row-between-wrapper">
|
||||
<div class="purple" v-if="item.status === 1 || item.status === 0">活动进行中</div>
|
||||
<div class="success" v-if="item.status === 10 || item.status === 20">助力成功</div>
|
||||
<div class="end" v-if="item.status === -1">活动已结束</div>
|
||||
<div class="acea-row row-middle row-right">
|
||||
<div v-if="item.status === 1 || item.status === 0">
|
||||
<div class="bnt cancel" @click="getBargainUserCancel(item.product_assist_set_id)">
|
||||
取消活动
|
||||
</div>
|
||||
<div class="bnt b-color" @click="getInvitation(item.product_assist_set_id)">
|
||||
邀请助力
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="item.status === 10 || item.status === 20">
|
||||
<view v-if="(item.order.paid == 0 || item.order.paid == 1) && item.status === 20"class="bnt b-color" @click="goOrderDetail(item.order)">查看详情</view>
|
||||
<view v-else class="bnt b-color" @click="goPay(item)">立即付款</view>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<Loading :loaded="status" :loading="loadingList"></Loading>
|
||||
</div>
|
||||
</block>
|
||||
<block v-if="bargain.length == 0">
|
||||
<emptyPage title="暂无记录~"></emptyPage>
|
||||
</block>
|
||||
<home></home>
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
// +----------------------------------------------------------------------
|
||||
// | CRMEB [ CRMEB赋能开发者,助力企业发展 ]
|
||||
// +----------------------------------------------------------------------
|
||||
// | Copyright (c) 2016~2021 https://www.crmeb.com All rights reserved.
|
||||
// +----------------------------------------------------------------------
|
||||
// | Licensed CRMEB并不是自由软件,未经许可不能去掉CRMEB相关版权
|
||||
// +----------------------------------------------------------------------
|
||||
// | Author: CRMEB Team <admin@crmeb.com>
|
||||
// +----------------------------------------------------------------------
|
||||
import CountDown from "@/components/countDown";
|
||||
import emptyPage from '@/components/emptyPage.vue'
|
||||
import { getBargainUserList, getBargainUserCancel } from "@/api/activity";
|
||||
import { postCartAdd } from '../../../api/store.js';
|
||||
import Loading from "@/components/Loading";
|
||||
import home from '@/components/home';
|
||||
import { mapGetters } from "vuex";
|
||||
export default {
|
||||
name: "BargainRecord",
|
||||
components: {
|
||||
CountDown,
|
||||
Loading,
|
||||
emptyPage,
|
||||
home
|
||||
},
|
||||
computed: { ...mapGetters(['viewColor'])},
|
||||
props: {},
|
||||
data: function() {
|
||||
return {
|
||||
bargain: [],
|
||||
status: false, //助力列表是否获取完成 false 未完成 true 完成
|
||||
loadingList: false, //当前接口是否请求完成 false 完成 true 未完成
|
||||
page: 1, //页码
|
||||
limit: 20, //数量
|
||||
};
|
||||
},
|
||||
onLoad: function() {
|
||||
this.getBargainUserList();
|
||||
},
|
||||
onReady() {
|
||||
uni.$once('endTime',(data)=>{
|
||||
this.bargain.forEach((el,index)=>{
|
||||
if(el.product_assist_set_id == data){
|
||||
el.status = -1
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
goDetail: function(id) {
|
||||
uni.navigateTo({
|
||||
url: `/pages/activity/assist_detail/index?id=${id}`
|
||||
})
|
||||
},
|
||||
getBargainUserList: function() {
|
||||
var that = this;
|
||||
if (that.loadingList) return;
|
||||
if (that.status) return;
|
||||
getBargainUserList({
|
||||
page: that.page,
|
||||
limit: that.limit
|
||||
})
|
||||
.then(res => {
|
||||
that.status = res.data.list.length < that.limit;
|
||||
that.bargain.push.apply(that.bargain, res.data.list);
|
||||
that.page++;
|
||||
that.loadingList = false;
|
||||
})
|
||||
.catch(res => {
|
||||
that.$util.Tips({
|
||||
title: res
|
||||
})
|
||||
});
|
||||
},
|
||||
// 立即购买
|
||||
goPay: function(item) { //立即支付
|
||||
var that = this;
|
||||
var data = {
|
||||
product_id : item.product_assist_set_id,
|
||||
product_attr_unique: item.assistSku[0].unique,
|
||||
cart_num: 1,
|
||||
product_type: 3,
|
||||
is_new: 1
|
||||
};
|
||||
postCartAdd(data).then(res => {
|
||||
uni.navigateTo({
|
||||
url: '/pages/users/order_confirm/index?new=1&cartId=' + res.data.cart_id
|
||||
});
|
||||
}).catch(err => {
|
||||
return that.$util.Tips({title:err})
|
||||
});
|
||||
},
|
||||
// 邀请助力
|
||||
getInvitation: function(id){
|
||||
uni.navigateTo({
|
||||
url: '/pages/activity/assist_detail/index?id=' + id
|
||||
});
|
||||
},
|
||||
// 查看详情
|
||||
goOrderDetail: function(order) {
|
||||
if(order.paid == 1){
|
||||
uni.navigateTo({
|
||||
url: '/pages/order_details/index?order_id='+order.order_id,
|
||||
})
|
||||
}else{
|
||||
uni.navigateTo({
|
||||
url: '/pages/order_details/stay?order_id='+order.group_order_id,
|
||||
})
|
||||
}
|
||||
},
|
||||
// 取消
|
||||
getBargainUserCancel: function(id) {
|
||||
var that = this;
|
||||
getBargainUserCancel(id)
|
||||
.then(res => {
|
||||
that.status = false;
|
||||
that.loadingList = false;
|
||||
that.page = 1;
|
||||
that.$util.Tips({
|
||||
title: res.message
|
||||
})
|
||||
setTimeout(function(){
|
||||
that.bargain = [];
|
||||
that.getBargainUserList();
|
||||
},3000)
|
||||
})
|
||||
.catch(res => {
|
||||
that.$util.Tips({
|
||||
title: res
|
||||
})
|
||||
});
|
||||
},
|
||||
},
|
||||
onReachBottom() {
|
||||
this.getBargainUserList();
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
/*助力记录*/
|
||||
.bargain-record .item .picTxt .text .time .styleAll {
|
||||
color: #fc4141;
|
||||
font-size:24rpx;
|
||||
}
|
||||
.bargain-record .item .picTxt .text .time .red {
|
||||
color: #999;
|
||||
font-size:24rpx;
|
||||
}
|
||||
.bargain-record .item {
|
||||
background-color: #fff;
|
||||
margin-bottom: 12upx;
|
||||
}
|
||||
.bargain-record .item .price_count{
|
||||
align-items: center;
|
||||
.money_lf{
|
||||
margin-left: 10rpx;
|
||||
}
|
||||
.t-color {
|
||||
color: var(--view-priceColor);
|
||||
}
|
||||
.under_price{
|
||||
color: #999999;
|
||||
font-size: 26rpx;
|
||||
text-decoration: line-through;
|
||||
}
|
||||
}
|
||||
.bargain-record .item .picTxt {
|
||||
height: 210upx;
|
||||
border-bottom: 1px solid #f0f0f0;
|
||||
padding: 0 30upx;
|
||||
}
|
||||
.bargain-record .item .picTxt .pictrue {
|
||||
width: 150upx;
|
||||
height: 150upx;
|
||||
}
|
||||
.bargain-record .item .picTxt .pictrue image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 6upx;
|
||||
}
|
||||
.bargain-record .item .picTxt .text {
|
||||
width: 515upx;
|
||||
font-size: 30upx;
|
||||
color: #282828;
|
||||
height: 150upx;
|
||||
}
|
||||
.bargain-record .item .picTxt .text .time {
|
||||
font-size: 24upx;
|
||||
color: #868686;
|
||||
justify-content: left !important;
|
||||
}
|
||||
.bargain-record .item .picTxt .text .successTxt{
|
||||
font-size:24rpx;
|
||||
}
|
||||
.bargain-record .item .picTxt .text .endTxt{
|
||||
font-size:24rpx;
|
||||
color: #999;
|
||||
}
|
||||
.bargain-record .item .picTxt .text .money {
|
||||
font-size: 24upx;
|
||||
}
|
||||
.bargain-record .item .picTxt .text .money .num {
|
||||
font-size: 32upx;
|
||||
font-weight: bold;
|
||||
}
|
||||
.bargain-record .item .picTxt .text .money .symbol {
|
||||
font-weight: bold;
|
||||
}
|
||||
.bargain-record .item .bottom {
|
||||
height: 100upx;
|
||||
padding: 0 30upx;
|
||||
font-size: 27upx;
|
||||
}
|
||||
.bargain-record .item .bottom .purple {
|
||||
color: #f78513;
|
||||
}
|
||||
.bargain-record .item .bottom .end {
|
||||
color: #999;
|
||||
}
|
||||
.bargain-record .item .bottom .success {
|
||||
color: var(--view-theme);
|
||||
}
|
||||
.bargain-record .item .bottom .bnt {
|
||||
font-size: 27upx;
|
||||
color: #fff;
|
||||
width: 176upx;
|
||||
height: 60upx;
|
||||
border-radius: 32upx;
|
||||
text-align: center;
|
||||
line-height: 60upx;
|
||||
display: inline-block;
|
||||
&.b-color {
|
||||
background-color: var(--view-theme);
|
||||
}
|
||||
}
|
||||
.bargain-record .item .bottom .bnt.cancel {
|
||||
color: #aaa;
|
||||
border: 1px solid #ddd;
|
||||
}
|
||||
.bargain-record .item .bottom .bnt~.bnt {
|
||||
margin-left: 18upx;
|
||||
}
|
||||
</style>
|
|
@ -1,371 +0,0 @@
|
|||
<template>
|
||||
<view class='my-coupon' :style="viewColor">
|
||||
<view class='header'>
|
||||
<view class='nav acea-row row-around'>
|
||||
<view class='item' :class='type==-1 ? "on": ""' @click="statusClick(-1)">
|
||||
<view>全部</view>
|
||||
</view>
|
||||
<view class='item' :class='type==10 ? "on": ""' @click="statusClick(10)">
|
||||
<view>通用券</view>
|
||||
</view>
|
||||
<view class='item' :class='type==11 ? "on": ""' @click="statusClick(11)">
|
||||
<view>品类券</view>
|
||||
</view>
|
||||
<view class='item' :class='type==12 ? "on": ""' @click="statusClick(12)">
|
||||
<view>跨店券</view>
|
||||
</view>
|
||||
<view class='item' :class='type==0 ? "on": ""' @click="statusClick(0)">
|
||||
<view>店铺券</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="listBox">
|
||||
<block v-for="(item) in list" :key='item.coupon_id'>
|
||||
<view class="list acea-row row-around">
|
||||
<view class="left cross" v-if="item.ProductLst.length == 1 || item.ProductLst.length == 0">
|
||||
<view v-if="item.ProductLst.length == 1" class="cross-left" v-for="(items,index) in item.ProductLst" :key='index'>
|
||||
<easyLoadimage :image-src="items.image"></easyLoadimage>
|
||||
</view>
|
||||
<view v-if="item.ProductLst.length == 0" class="cross-left">
|
||||
<image src="../static/images/no_product.png"></image>
|
||||
</view>
|
||||
<view class="tips cross-right">
|
||||
<view class="title line2">{{item.title || ''}}</view>
|
||||
<view class="time">{{item.create_time}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="left" v-else>
|
||||
<view class="tips line1">{{item.title || ''}}</view>
|
||||
<view class="info">
|
||||
<view class="info-box" v-for="(items,index) in item.ProductLst" :key='index'>
|
||||
<easyLoadimage :image-src="items.image"></easyLoadimage>
|
||||
<view class="money">¥ {{items.price}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="right">
|
||||
<view class="couponlogo" v-if="item.type == 10">通用券</view>
|
||||
<view class="couponlogo" v-if="item.type == 11">品类券</view>
|
||||
<view class="couponlogo" v-if="item.type == 12">跨店券</view>
|
||||
<view class="couponlogo" v-if="item.type == 0">店铺券</view>
|
||||
<view class="title">
|
||||
<view>
|
||||
<p><text class='font1'>¥</text><text class='font2'>{{parsePrice(item.coupon_price)}}</text></p>
|
||||
<p>
|
||||
<text class='font3' v-if="item.use_min_price == 0">无使用门槛</text>
|
||||
<text class='font3' v-else>满{{parsePrice(item.use_min_price)}}元可用</text>
|
||||
</p>
|
||||
</view>
|
||||
<view class="btn" :class="item.ProductLst.length == 0 ? 'disabled' : ''" v-if="!item.issue" @click="receiveCoupon(item)">立即领取</view>
|
||||
<navigator :url="'/pages/columnGoods/goods_coupon_list/index?coupon_id='+item.coupon_id" class='btn shiyong' hover-class="none" v-if="item.issue && item.ProductLst.length > 0">
|
||||
去使用
|
||||
</navigator>
|
||||
<view v-if="item.issue && item.ProductLst.length == 0" class='btn shiyong disabled'>去使用</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
<view class="loadingicon acea-row row-center-wrapper">
|
||||
<text class="loading iconfont icon-jiazai" :hidden="loading == false" style="color:#33;"></text>
|
||||
</view>
|
||||
<view class='noCommodity' v-if="!list.length && loaded">
|
||||
<view class='pictrue'>
|
||||
<image src='/static/images/noCoupon.png'></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {getCouponLst} from '@/api/activity.js';
|
||||
import {setCouponReceive} from '@/api/api.js';
|
||||
import { mapGetters } from "vuex";
|
||||
import easyLoadimage from '@/components/easy-loadimage/easy-loadimage.vue';
|
||||
export default {
|
||||
computed: mapGetters(['viewColor']),
|
||||
components: {
|
||||
easyLoadimage
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
type: '',
|
||||
list:[],
|
||||
loading: false,
|
||||
loaded: false,
|
||||
page: 1,
|
||||
limit: 15,
|
||||
}
|
||||
},
|
||||
onLoad: function() {
|
||||
this.statusClick(-1)
|
||||
},
|
||||
methods: {
|
||||
parsePrice(price){
|
||||
if(price >= 100){
|
||||
return parseFloat(price)
|
||||
}else{
|
||||
return price
|
||||
}
|
||||
},
|
||||
// 领取优惠券
|
||||
receiveCoupon(item) {
|
||||
let that = this;
|
||||
setCouponReceive(item.coupon_id).then(res => {
|
||||
item.issue = 1
|
||||
uni.showToast({
|
||||
title: res.message,
|
||||
icon: 'none'
|
||||
})
|
||||
}).catch(err => {
|
||||
uni.showToast({
|
||||
title: err,
|
||||
icon: 'none'
|
||||
})
|
||||
})
|
||||
},
|
||||
getList(){
|
||||
if(this.loading || this.loaded) return ;
|
||||
this.loading = true;
|
||||
getCouponLst({
|
||||
product:1,
|
||||
type: this.type == -1 ? '' : this.type,
|
||||
page: this.page,
|
||||
limit: this.limit
|
||||
}).then(res=>{
|
||||
this.list = this.list.concat(res.data.list);
|
||||
this.loading = false;
|
||||
this.loaded = res.data.list.length != this.limit;
|
||||
this.page ++;
|
||||
})
|
||||
},
|
||||
//切换类型
|
||||
statusClick: function(status) {
|
||||
if (status == this.type) return;
|
||||
this.loaded = false;
|
||||
this.loading = false;
|
||||
this.page = 1;
|
||||
this.list = [];
|
||||
this.type = status;
|
||||
this.getList()
|
||||
},
|
||||
},
|
||||
// 滚动监听
|
||||
onPageScroll(e) {
|
||||
// 传入scrollTop值并触发所有easy-loadimage组件下的滚动监听事件
|
||||
uni.$emit('scroll');
|
||||
},
|
||||
onReachBottom: function() {
|
||||
this.getList();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.my-coupon .header {
|
||||
height: 200rpx;
|
||||
padding: 0 15rpx;
|
||||
background-color: var(--view-theme);
|
||||
border-bottom-left-radius: 10%;
|
||||
border-bottom-right-radius: 10%;
|
||||
.nav {
|
||||
border-radius: 6rpx;
|
||||
padding-top: 30rpx;
|
||||
.item {
|
||||
text-align: center;
|
||||
font-size: 26rpx;
|
||||
color: #FFFFFF;
|
||||
padding: 29rpx 0;
|
||||
opacity: 0.7;
|
||||
line-height: 2rpx;
|
||||
.num {
|
||||
margin-top: 18rpx;
|
||||
}
|
||||
}
|
||||
.item.on {
|
||||
opacity: 1;
|
||||
font-weight: bold;
|
||||
border-bottom: 5rpx solid #FFFFFF;
|
||||
}
|
||||
}
|
||||
}
|
||||
.my-coupon .listBox {
|
||||
margin: -73rpx auto 0 auto;
|
||||
padding: 0 30rpx;
|
||||
.list {
|
||||
width: 100%;
|
||||
height: 260rpx;
|
||||
overflow: hidden;
|
||||
background: #FFFFFF;
|
||||
border-radius: 12rpx;
|
||||
margin-bottom: 25rpx;
|
||||
text-align: center;
|
||||
.cross{
|
||||
display: flex;
|
||||
.cross-left{
|
||||
margin-top: 6rpx;
|
||||
.easy-loadimage,image{
|
||||
width: 200rpx;
|
||||
height: 200rpx;
|
||||
border-radius: 12rpx;
|
||||
}
|
||||
|
||||
}
|
||||
.cross-right{
|
||||
margin-left: 20rpx;
|
||||
margin-top: 6rpx;
|
||||
.title{
|
||||
overflow:hidden;
|
||||
text-overflow:ellipsis;
|
||||
display:-webkit-box;
|
||||
-webkit-box-orient:vertical;
|
||||
-webkit-line-clamp:2;
|
||||
}
|
||||
.time{
|
||||
margin-top: 40rpx;
|
||||
font-size: 22rpx;
|
||||
font-weight: 400;
|
||||
color: #666666;
|
||||
}
|
||||
}
|
||||
}
|
||||
.left{
|
||||
width: 75%;
|
||||
height: 210rpx;
|
||||
margin-top: 20rpx;
|
||||
border-right: 2rpx dashed #E5E5E5;
|
||||
text-align: left;
|
||||
padding-left: 30rpx;
|
||||
.tips{
|
||||
font-size: 26rpx;
|
||||
font-weight: 600;
|
||||
color: #282828;
|
||||
display: block;
|
||||
overflow: auto;
|
||||
}
|
||||
.info{
|
||||
margin-top: 18rpx;
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
.info-box{
|
||||
margin-right: 25rpx;
|
||||
.easy-loadimage{
|
||||
display: inline-block;
|
||||
width: 130rpx;
|
||||
height: 130rpx;
|
||||
border-radius: 8rpx;
|
||||
}
|
||||
.money{
|
||||
text-align: center;
|
||||
font-size: 24rpx;
|
||||
font-weight: 400;
|
||||
color: #666666;
|
||||
margin-top: 4rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.right{
|
||||
width: 25%;
|
||||
height: 100%;
|
||||
position: relative;
|
||||
&::before,&::after{
|
||||
content: "";
|
||||
display: inline-block;
|
||||
width: 24rpx;
|
||||
height: 24rpx;
|
||||
background: #f5f5f5;
|
||||
border-radius: 100%;
|
||||
position: absolute;
|
||||
bottom: -12rpx;
|
||||
}
|
||||
&::before{
|
||||
left: -12rpx;
|
||||
}
|
||||
&::after{
|
||||
top: -12rpx;
|
||||
left: -12rpx;
|
||||
}
|
||||
.couponlogo{
|
||||
width: 112rpx;
|
||||
height: 32rpx;
|
||||
margin: 0 auto;
|
||||
font-size: 20rpx;
|
||||
font-weight: 400;
|
||||
line-height: 38rpx;
|
||||
color: #9B5434;
|
||||
background-image: url(@/static/images/couponlogo.png);
|
||||
background-size: 112rpx 32rpx;
|
||||
}
|
||||
.title{
|
||||
width: 146rpx;
|
||||
height:169rpx;
|
||||
margin: 30rpx auto 0;
|
||||
color: var(--view-priceColor);
|
||||
font-weight: 600;
|
||||
.font1{
|
||||
font-size: 26rpx;
|
||||
}
|
||||
.font2{
|
||||
font-size: 32rpx;
|
||||
}
|
||||
.font3{
|
||||
font-size: 24rpx;
|
||||
font-weight: 400;
|
||||
color: var(--view-theme);
|
||||
}
|
||||
p{
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
.btn{
|
||||
width: 142rpx;
|
||||
background: linear-gradient(270deg, var(--view-bntColor21) 0%, var(--view-bntColor22) 100%);
|
||||
border-radius: 26rpx;
|
||||
font-size: 24rpx;
|
||||
font-weight: 400;
|
||||
color: #FFFFFF;
|
||||
line-height: 44rpx;
|
||||
text-align: center;
|
||||
margin-top: 20rpx;
|
||||
&.disabled{
|
||||
pointer-events: none;
|
||||
background: #ccc;
|
||||
color: #fff;
|
||||
border-color: #ccc;
|
||||
cursor: not-allowed;
|
||||
}
|
||||
}
|
||||
.shiyong{
|
||||
border: 2rpx solid var(--view-theme);
|
||||
background: none;
|
||||
color: var(--view-theme);
|
||||
border-radius: 26rpx;
|
||||
&.disabled{
|
||||
pointer-events: none;
|
||||
color: #ccc;
|
||||
border-color: #ccc;
|
||||
cursor: not-allowed;
|
||||
background: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
.list:nth-child(1){
|
||||
.right{
|
||||
&::after{
|
||||
background-color: var(--view-theme);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.noCommodity{
|
||||
width: 100%;
|
||||
margin-top: 4rpx;
|
||||
background-color: #f5f5f5;
|
||||
.pictrue{
|
||||
margin: 0 auto;
|
||||
}
|
||||
}
|
||||
</style>
|
|
@ -1,475 +0,0 @@
|
|||
<template>
|
||||
<view :style="viewColor" class="page-container">
|
||||
<view class='flash-sale'>
|
||||
<view class="fixed-head">
|
||||
<view class="sys-head" :style="{height:statusBarHeight}"></view>
|
||||
<view class="tool-bar">
|
||||
<!--#ifdef H5-->
|
||||
<view class='iconfont icon-xiangzuo' @tap='goBack'></view>
|
||||
<!--#endif-->
|
||||
<user-name-swiper class="name-swiper" :style="'top:'+ (navH/2) +'rpx'" :combinationUserList="combinationUserList"></user-name-swiper>
|
||||
</view>
|
||||
</view>
|
||||
<view class='head' :style="{ 'background-image': `url(${domain}/static/diy/combination${keyColor}.png)` }">
|
||||
<view class="sys-head" :style="{height:statusBarHeight}"></view>
|
||||
<view class="tool-bar"></view>
|
||||
<view class='header'>
|
||||
<view class="success_per">
|
||||
<view class="success_num">{{combinationUserCount}}人已参与拼团</view>
|
||||
<view class="activity_pic" v-if="combinationUserList.length > 0">
|
||||
<view v-for="(item,index) in combinationUserList.slice(0,10)" class="picture" :key="index">
|
||||
<image v-if="index != 9" class="avatar" :src='item.avatar ? item.avatar : "/static/images/f.png"'></image>
|
||||
<span v-else class="avatar" style="background:#fff;"><text class="iconfont icon-gengduo1"></text></span>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="main_count">
|
||||
<tabNav class="tabNav" :class="{'fixed':isFixed}" :tabTitle="navTop" @changeTab='changeTab'></tabNav>
|
||||
<view class='list'>
|
||||
<block v-for="(item,index) in combinationList" :key='index'>
|
||||
<view class='item acea-row row-between-wrapper' @tap='goDetails(item)'>
|
||||
<view class='pictrue'>
|
||||
<image :src='item.product.image'></image>
|
||||
</view>
|
||||
<view class='text acea-row row-column-around'>
|
||||
<view class='name line1'>{{item.product.store_name}}</view>
|
||||
<view class='booking'>
|
||||
<text class="count">
|
||||
<text class="iconfont icon-pintuan"></text>
|
||||
{{item.buying_count_num}}人团 <text class="line"></text>
|
||||
已拼{{item.sales ? item.sales : 0}}{{item.product.unit_name}}
|
||||
</text>
|
||||
</view>
|
||||
<view class="progress">
|
||||
<view class='combination_price'>
|
||||
<text class="combination_text">拼团价</text>
|
||||
<text class="price">¥ <text>{{ item.price }}</text></text>
|
||||
</view>
|
||||
<view class='order_btn' :style="{ 'background-image': `url(${domain}/static/diy/pink_btn${keyColor}.png)` }">去拼团</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<home></home>
|
||||
<!-- #ifndef H5 -->
|
||||
<passwordPopup></passwordPopup>
|
||||
<!-- #endif -->
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// +----------------------------------------------------------------------
|
||||
// | CRMEB [ CRMEB赋能开发者,助力企业发展 ]
|
||||
// +----------------------------------------------------------------------
|
||||
// | Copyright (c) 2016~2021 https://www.crmeb.com All rights reserved.
|
||||
// +----------------------------------------------------------------------
|
||||
// | Licensed CRMEB并不是自由软件,未经许可不能去掉CRMEB相关版权
|
||||
// +----------------------------------------------------------------------
|
||||
// | Author: CRMEB Team <admin@crmeb.com>
|
||||
// +----------------------------------------------------------------------
|
||||
import { getCombinationList, getCombinationUser, getActivitycategory } from '../../../api/activity.js';
|
||||
import home from '@/components/home/index.vue'
|
||||
import tabNav from '@/components/combinNav'
|
||||
import userNameSwiper from '@/components/userNameSwiper/userNameSwiper.vue'
|
||||
import { getIndexData } from '@/api/api.js';
|
||||
import { configMap } from "@/utils";
|
||||
import { HTTP_REQUEST_URL } from '@/config/app';
|
||||
// #ifndef H5
|
||||
import passwordPopup from '@/components/passwordPopup';
|
||||
// #endif
|
||||
import { mapGetters } from "vuex";
|
||||
let app = getApp();
|
||||
export default {
|
||||
components: {
|
||||
// #ifndef H5
|
||||
passwordPopup,
|
||||
// #endif
|
||||
home,
|
||||
tabNav,
|
||||
userNameSwiper
|
||||
},
|
||||
computed: configMap({statusBarHeight:0},mapGetters(['viewColor','keyColor'])),
|
||||
data() {
|
||||
return {
|
||||
domain: HTTP_REQUEST_URL,
|
||||
navH: '',
|
||||
topImage: '',
|
||||
combinationList: [],
|
||||
combinationUserList: [],
|
||||
combinationUserCount: 0,
|
||||
navTop: [{
|
||||
'cate_name': '精选',
|
||||
store_category_id: ''
|
||||
}],
|
||||
active: 1,
|
||||
type: 0,
|
||||
scrollLeft: 0,
|
||||
interval: 0,
|
||||
status: 1,
|
||||
page: 1,
|
||||
limit: 8,
|
||||
loading: false,
|
||||
loadend: false,
|
||||
pageloading: false,
|
||||
isFixed: false,
|
||||
navIndex: 0,
|
||||
avatar: '../../../static/images/f.png',
|
||||
headBg: '../static/images/comHead'
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 用户点击右上角分享
|
||||
*/
|
||||
// #ifdef MP
|
||||
onShareAppMessage: function() {
|
||||
wx.showShareMenu({
|
||||
withShareTicket: true,
|
||||
menus: ['shareAppMessage', 'shareTimeline']
|
||||
})
|
||||
return {
|
||||
title: '拼团',
|
||||
path: 'pages/activity/combination/index',
|
||||
}
|
||||
},
|
||||
onShareTimeline: function() {
|
||||
return {
|
||||
title: '拼团活动',
|
||||
query: {
|
||||
key: ''
|
||||
},
|
||||
imageUrl: ''
|
||||
}
|
||||
},
|
||||
// #endif
|
||||
onLoad() {
|
||||
var pages = getCurrentPages();
|
||||
uni.setNavigationBarTitle({
|
||||
title: "拼团列表"
|
||||
})
|
||||
this.navH = app.globalData.navHeight;
|
||||
this.getCombinationProductList('');
|
||||
this.getIndexConfig();
|
||||
this.getCombinationUser();
|
||||
},
|
||||
methods: {
|
||||
goBack: function() {
|
||||
uni.navigateBack();
|
||||
},
|
||||
getCombinationProductList: function(store_category_id) {
|
||||
var that = this;
|
||||
var data = {
|
||||
page: that.page,
|
||||
limit: that.limit,
|
||||
store_category_id: store_category_id
|
||||
};
|
||||
if (that.pageloading) return;
|
||||
this.pageloading = true
|
||||
getCombinationList(data).then(res => {
|
||||
var combinationList = res.data.list;
|
||||
that.page++;
|
||||
that.combinationList = that.combinationList.concat(combinationList),
|
||||
that.page = that.page;
|
||||
that.pageloading = false;
|
||||
}).catch(err => {
|
||||
that.pageloading = false
|
||||
});
|
||||
},
|
||||
// 首页数据
|
||||
getIndexConfig: function() {
|
||||
let that = this;
|
||||
getActivitycategory(4).then(res => {
|
||||
that.navTop = that.navTop.concat(res.data)
|
||||
})
|
||||
},
|
||||
//获取参与拼团用户
|
||||
getCombinationUser: function() {
|
||||
let that = this;
|
||||
getCombinationUser({
|
||||
limit: 30
|
||||
}).then(res => {
|
||||
that.$set(that, "combinationUserCount", res.data.count);
|
||||
that.$set(that, "combinationUserList", res.data.list);
|
||||
})
|
||||
},
|
||||
// 导航分类切换
|
||||
changeTab(e) {
|
||||
let that = this
|
||||
if (that.navIndex == e.index) return
|
||||
that.navIndex = e.index;
|
||||
that.page = 1;
|
||||
that.limit = 8;
|
||||
that.combinationList = [];
|
||||
that.getCombinationProductList(e.pid)
|
||||
|
||||
},
|
||||
goDetails(item) {
|
||||
uni.navigateTo({
|
||||
url: '/pages/activity/combination_details/index?id=' + item.product_group_id
|
||||
})
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 页面上拉触底事件的处理函数
|
||||
*/
|
||||
onReachBottom: function() {
|
||||
this.getCombinationProductList('');
|
||||
},
|
||||
// 滚动监听
|
||||
onPageScroll(e) {
|
||||
// #ifdef H5
|
||||
let self = this
|
||||
if (e.scrollTop >= self.searchH) {
|
||||
self.isFixed = true
|
||||
} else {
|
||||
self.isFixed = false
|
||||
}
|
||||
// #endif
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.page-container{
|
||||
min-height: 100vh;
|
||||
background-color: var(--view-theme);
|
||||
}
|
||||
.icon-xiangzuo {
|
||||
margin-left: 20rpx;
|
||||
font-size: 40rpx;
|
||||
color: #fff;
|
||||
}
|
||||
.head {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
/* #ifdef MP || APP-PLUS */
|
||||
height: 576rpx;
|
||||
/* #endif */
|
||||
/* #ifdef H5 */
|
||||
height: 490rpx;
|
||||
/* #endif */
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
width: 100%;
|
||||
}
|
||||
.name-swiper{
|
||||
margin-left: 40rpx;
|
||||
}
|
||||
.header {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
.success_per {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
left: 0;
|
||||
.success_num {
|
||||
color: #FFF1BF;
|
||||
font-size: 26rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
.activity_pic {
|
||||
margin-left: 20rpx;
|
||||
padding-left: 20rpx;
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
margin-top: 17rpx;
|
||||
background: rgba(0, 0, 0, .15);
|
||||
padding: 13rpx 24rpx 13rpx 14rpx;
|
||||
border-radius: 33rpx;
|
||||
.picture {
|
||||
display: inline-block;
|
||||
}
|
||||
.avatar {
|
||||
width: 42rpx;
|
||||
height: 42rpx;
|
||||
line-height: 20rem;
|
||||
display: inline-block;
|
||||
background-repeat: no-repeat;
|
||||
background-size: center/cover;
|
||||
position: relative;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
font-weight: 600;
|
||||
vertical-align: bottom;
|
||||
font-size: .875rem;
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
user-select: none;
|
||||
border-radius: 50%;
|
||||
background-repeat: no-repeat;
|
||||
background-size: cover;
|
||||
background-position: 0 0;
|
||||
margin-right: -10rpx;
|
||||
box-shadow: 0 0 0 1px #fff;
|
||||
position: relative;
|
||||
text {
|
||||
position: absolute;
|
||||
line-height: 42rpx;
|
||||
color: #8E8E8E;
|
||||
width: 42rpx;
|
||||
left: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
.noCommodity {
|
||||
border-top: none;
|
||||
}
|
||||
.flash-sale .header {
|
||||
width: 100%;
|
||||
position: relative;
|
||||
}
|
||||
.flash-sale .main_count {
|
||||
position: relative;
|
||||
top: 10rpx;
|
||||
}
|
||||
.flash-sale .timeList {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.flash-sale .timeList .item {
|
||||
font-size: 20rpx;
|
||||
color: #666;
|
||||
text-align: center;
|
||||
box-sizing: border-box;
|
||||
width: 224rpx;
|
||||
}
|
||||
.flash-sale .timeList .item .time {
|
||||
font-size: 26rpx;
|
||||
color: #AAAAAA;
|
||||
}
|
||||
.flash-sale .timeList .item.on .time {
|
||||
color: #FD6523;
|
||||
font-weight: 600;
|
||||
span {
|
||||
position: relative;
|
||||
&::after {
|
||||
content: '';
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
height: 4rpx;
|
||||
background: #FD6523;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: -4rpx;
|
||||
border-radius: 2rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
.flash-sale .list {
|
||||
margin-top: 24rpx;
|
||||
}
|
||||
.flash-sale .list .item {
|
||||
height: 278rpx;
|
||||
position: relative;
|
||||
width: 90%;
|
||||
margin: 0 auto 20rpx auto;
|
||||
background-color: #fff;
|
||||
border-radius: 20rpx;
|
||||
padding: 0 25rpx;
|
||||
}
|
||||
.flash-sale .list .item .pictrue {
|
||||
width: 240rpx;
|
||||
height: 240rpx;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
.flash-sale .list .item .pictrue image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
|
||||
.flash-sale .list .item .text {
|
||||
width: 370rpx;
|
||||
font-size: 30rpx;
|
||||
color: #333;
|
||||
}
|
||||
.flash-sale .list .item .text .name {
|
||||
width: 100%;
|
||||
color: #282828;
|
||||
font-weight: bold;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
.flash-sale .list .item .text .booking {
|
||||
margin-top: 17rpx;
|
||||
}
|
||||
.flash-sale .list .item .text .booking .count {
|
||||
font-size: 22rpx;
|
||||
color: var(--view-priceColor);
|
||||
border-radius: 18rpx;
|
||||
background-color: var(--view-bgColor);
|
||||
line-height: 36rpx;
|
||||
padding: 5rpx 12rpx;
|
||||
.iconfont {
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
.line {
|
||||
display: inline-block;
|
||||
width: 1rpx;
|
||||
height: 14rpx;
|
||||
background: #F49088;
|
||||
margin: 0 9rpx;
|
||||
position: relative;
|
||||
top: -3rpx;
|
||||
}
|
||||
}
|
||||
.flash-sale .list .item .text .limit {
|
||||
font-size: 22rpx;
|
||||
color: #999;
|
||||
margin-bottom: 5rpx;
|
||||
}
|
||||
.flash-sale .list .item .text .limit .limitPrice {
|
||||
margin-left: 10rpx;
|
||||
}
|
||||
.flash-sale .list .item .text .progress {
|
||||
margin-top: 20rpx;
|
||||
overflow: hidden;
|
||||
.combination_price {
|
||||
line-height: 15px;
|
||||
padding: 8rpx 0;
|
||||
color: #282828;
|
||||
float: left;
|
||||
position: relative;
|
||||
top: 10rpx;
|
||||
.combination_text {
|
||||
font-size: 22rpx;
|
||||
}
|
||||
.price {
|
||||
font-size: 24rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
.order_btn {
|
||||
float: right;
|
||||
width: 145rpx;
|
||||
height: 62rpx;
|
||||
text-align: center;
|
||||
color: #FFFFFF;
|
||||
font-size: 26rpx;
|
||||
line-height: 72rpx;
|
||||
background-size: 100%;
|
||||
}
|
||||
}
|
||||
.tool-bar{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 40px;
|
||||
}
|
||||
.fixed-head{
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 20px;
|
||||
width: 100%;
|
||||
z-index: 10;
|
||||
}
|
||||
</style>
|
|
@ -1,362 +0,0 @@
|
|||
<template>
|
||||
<view :style="viewColor">
|
||||
<view class='poster-poster' v-if="posterStatus">
|
||||
<view class='poster-pop'>
|
||||
<image src='../../../static/images/poster-close.png' class='close' @click="posterImageClose"></image>
|
||||
<view class="user-code">
|
||||
<image class="canvas" :style="{width:wd+'px', height:hg+'px'}" :src="posterImage" v-if="posterImage"></image>
|
||||
<canvas class="canvas" :style="{width:wd+'px',height:hg+'px'}" canvas-id="myCanvas" v-else></canvas>
|
||||
</view>
|
||||
<!-- #ifndef H5 -->
|
||||
<view v-if="posterImage" class='save-poster' @click="savePosterPath(posterImage)">保存到手机</view>
|
||||
<!-- #endif -->
|
||||
<!-- #ifdef H5 -->
|
||||
<view v-if="posterImage" class="keep">长按图片可以保存到手机</view>
|
||||
<!-- #endif -->
|
||||
</view>
|
||||
</view>
|
||||
<view class='mask' v-if="posterImage"></view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// +----------------------------------------------------------------------
|
||||
// | CRMEB [ CRMEB赋能开发者,助力企业发展 ]
|
||||
// +----------------------------------------------------------------------
|
||||
// | Copyright (c) 2016~2021 https://www.crmeb.com All rights reserved.
|
||||
// +----------------------------------------------------------------------
|
||||
// | Licensed CRMEB并不是自由软件,未经许可不能去掉CRMEB相关版权
|
||||
// +----------------------------------------------------------------------
|
||||
// | Author: CRMEB Team <admin@crmeb.com>
|
||||
// +----------------------------------------------------------------------
|
||||
import { imgToBase } from '@/api/user.js';
|
||||
import { mapGetters } from 'vuex';
|
||||
export default {
|
||||
computed: mapGetters(['viewColor']),
|
||||
data() {
|
||||
return {
|
||||
wd: 225,
|
||||
hg: 357,
|
||||
posterImage: "",
|
||||
posterBag: '../static/images/poster-bag.png',
|
||||
}
|
||||
},
|
||||
props: {
|
||||
picData: {
|
||||
type: Object
|
||||
},
|
||||
posterStatus: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
posterStatus(data) {
|
||||
if (data) {
|
||||
this.posterShow()
|
||||
}
|
||||
},
|
||||
},
|
||||
onLoad() {},
|
||||
methods: {
|
||||
async posterShow() {
|
||||
let that = this;
|
||||
uni.showLoading({
|
||||
title: '海报生成中',
|
||||
mask: true
|
||||
});
|
||||
let arr, bag_pic, goods_img, mp_code
|
||||
goods_img = await that.imgToBase(that.picData.goodsPic)
|
||||
mp_code = await that.imgToBase(that.picData.codePic)
|
||||
// #ifdef H5
|
||||
arr = [that.posterBag, goods_img, mp_code]
|
||||
// #endif
|
||||
// #ifdef MP || APP-PLUS
|
||||
arr = [that.posterBag, await that.downloadFilestoreImage(that.picData.goodsPic), await that.downloadFilestoreImage(
|
||||
that.picData.codePic)]
|
||||
// #endif
|
||||
that.bargainPosterCanvas(arr, that.picData.title, that.picData.label, that.picData.msg, that.picData.price,
|
||||
that.wd,
|
||||
that.hg,
|
||||
(tempFilePath) => {
|
||||
that.posterImage = tempFilePath
|
||||
});
|
||||
},
|
||||
async imgToBase(url) {
|
||||
let res = await imgToBase({
|
||||
image: url
|
||||
})
|
||||
return res.data.image
|
||||
},
|
||||
savePosterPath(url) {
|
||||
let that = this;
|
||||
// #ifdef MP
|
||||
uni.getSetting({
|
||||
success(res) {
|
||||
if (!res.authSetting['scope.writePhotosAlbum']) {
|
||||
uni.authorize({
|
||||
scope: 'scope.writePhotosAlbum',
|
||||
success() {
|
||||
uni.saveImageToPhotosAlbum({
|
||||
filePath: url,
|
||||
success: function(res) {
|
||||
that.$util.Tips({
|
||||
title: '保存成功',
|
||||
icon: 'success'
|
||||
});
|
||||
},
|
||||
fail: function(res) {
|
||||
that.$util.Tips({
|
||||
title: '保存失败'
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
} else {
|
||||
uni.saveImageToPhotosAlbum({
|
||||
filePath: url,
|
||||
success: function(res) {
|
||||
that.$util.Tips({
|
||||
title: '保存成功',
|
||||
icon: 'success'
|
||||
});
|
||||
},
|
||||
fail: function(res) {
|
||||
that.$util.Tips({
|
||||
title: '保存失败'
|
||||
});
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
// #endif
|
||||
// #ifdef APP-PLUS
|
||||
uni.saveImageToPhotosAlbum({
|
||||
filePath: that.posterImage,
|
||||
success: function(res) {
|
||||
that.posterImageClose();
|
||||
that.$util.Tips({
|
||||
title: '保存成功',
|
||||
icon: 'success'
|
||||
});
|
||||
},
|
||||
fail: function(res) {
|
||||
that.$util.Tips({
|
||||
title: '保存失败'
|
||||
});
|
||||
},
|
||||
})
|
||||
// #endif
|
||||
},
|
||||
posterImageClose() {
|
||||
this.$emit('update:posterStatus', false)
|
||||
this.posterImage = ""
|
||||
},
|
||||
//图片转符合安全域名路径
|
||||
downloadFilestoreImage(url) {
|
||||
// #ifdef MP
|
||||
let ishttps = url.split('//')[0] == 'https:'
|
||||
if (!ishttps) {
|
||||
url = 'https://'+url.split('//')[1]
|
||||
}
|
||||
// #endif
|
||||
return new Promise((resolve, reject) => {
|
||||
let that = this;
|
||||
uni.downloadFile({
|
||||
url: url,
|
||||
success: function(res) {
|
||||
resolve(res.tempFilePath);
|
||||
},
|
||||
fail: function() {
|
||||
return that.$util.Tips({
|
||||
title: ''
|
||||
});
|
||||
}
|
||||
});
|
||||
})
|
||||
},
|
||||
bargainPosterCanvas(arr2, title, label, msg, price, wd, hg, successFn) {
|
||||
let that = this;
|
||||
const ctx = uni.createCanvasContext('myCanvas', this);
|
||||
ctx.clearRect(0, 0, 0, 0);
|
||||
/**
|
||||
* 只能获取合法域名下的图片信息,本地调试无法获取
|
||||
*
|
||||
*/
|
||||
ctx.fillStyle = '#ccc';
|
||||
ctx.fillRect(0, 0, wd, hg);
|
||||
uni.getImageInfo({
|
||||
src: arr2[0],
|
||||
success: (res) => {
|
||||
// console.log(arr2)
|
||||
const WIDTH = res.width;
|
||||
const HEIGHT = res.height;
|
||||
ctx.drawImage(arr2[0], 0, 0, wd, hg);
|
||||
// 保证在不同机型对应坐标准确
|
||||
let labelx = 0.6656 //标签x
|
||||
let labely = 0.167 //标签y
|
||||
let pricex = 0.1847 //价格x
|
||||
let pricey = 0.175 //价格y
|
||||
let codex = 0.385 //二维码
|
||||
let codey = 0.77
|
||||
let picturex = 0.1571 //商品图左上点
|
||||
let picturey = 0.2916
|
||||
let picturebx = 0.6857 //商品图右下点
|
||||
let pictureby = 0.3916
|
||||
let msgx = 0.1036 //msg
|
||||
let msgy = 0.2306
|
||||
ctx.drawImage(arr2[1], wd * picturex, hg * picturey, wd * picturebx, hg * pictureby);
|
||||
ctx.save();
|
||||
ctx.drawImage(arr2[2], wd * codex, hg * codey, 55, 55);
|
||||
ctx.save();
|
||||
//标题
|
||||
const CONTENT_ROW_LENGTH = 25;
|
||||
let [contentLeng, contentArray, contentRows] = that.textByteLength(title, CONTENT_ROW_LENGTH);
|
||||
if (contentRows > 2) {
|
||||
contentRows = 2;
|
||||
let textArray = contentArray.slice(0, 2);
|
||||
textArray[textArray.length - 1] += '…';
|
||||
contentArray = textArray;
|
||||
}
|
||||
ctx.setTextAlign('left');
|
||||
ctx.setFillStyle('#000');
|
||||
if (contentArray.length < 2) {
|
||||
ctx.setFontSize(16);
|
||||
} else {
|
||||
ctx.setFontSize(14);
|
||||
}
|
||||
let contentHh = 3;
|
||||
for (let m = 0; m < contentArray.length; m++) {
|
||||
if (m) {
|
||||
ctx.fillText(contentArray[m], 20, 25 + contentHh * m + 13, 1100);
|
||||
} else {
|
||||
ctx.fillText(contentArray[m], 20, 25, 1100);
|
||||
}
|
||||
}
|
||||
// 标签内容
|
||||
ctx.setTextAlign('left')
|
||||
ctx.setFontSize(10);
|
||||
ctx.setFillStyle('#FFF');
|
||||
ctx.fillText(label, wd * labelx, hg * labely);
|
||||
ctx.save();
|
||||
// 价格
|
||||
ctx.setFillStyle('red');
|
||||
// ctx.setFontSize(16);
|
||||
ctx.font = "bold 18px Arial";
|
||||
ctx.fillText(price, wd * pricex, hg * pricey);
|
||||
ctx.save();
|
||||
// msg
|
||||
ctx.setFontSize(8);
|
||||
ctx.setFillStyle('#3F3F3F');
|
||||
ctx.fillText(msg, wd * msgx, hg * msgy);
|
||||
ctx.save();
|
||||
ctx.draw(true, () => {
|
||||
uni.canvasToTempFilePath({
|
||||
canvasId: 'myCanvas',
|
||||
fileType: 'png',
|
||||
quality: 1,
|
||||
success: (res) => {
|
||||
// console.log(res)
|
||||
successFn && successFn(res.tempFilePath);
|
||||
uni.hideLoading();
|
||||
}
|
||||
}, this)
|
||||
});
|
||||
},
|
||||
fail: function(err) {
|
||||
uni.hideLoading();
|
||||
that.Tips({
|
||||
title: '无法获取图片信息'
|
||||
});
|
||||
}
|
||||
})
|
||||
},
|
||||
textByteLength(text, num) {
|
||||
let strLength = 0;
|
||||
let rows = 1;
|
||||
let str = 0;
|
||||
let arr = [];
|
||||
for (let j = 0; j < text.length; j++) {
|
||||
if (text.charCodeAt(j) > 255) {
|
||||
strLength += 2;
|
||||
if (strLength > rows * num) {
|
||||
strLength++;
|
||||
arr.push(text.slice(str, j));
|
||||
str = j;
|
||||
rows++;
|
||||
}
|
||||
} else {
|
||||
strLength++;
|
||||
if (strLength > rows * num) {
|
||||
arr.push(text.slice(str, j));
|
||||
str = j;
|
||||
rows++;
|
||||
}
|
||||
}
|
||||
}
|
||||
arr.push(text.slice(str, text.length));
|
||||
return [strLength, arr, rows] // [处理文字的总字节长度,每行显示内容的数组,行数]
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.poster-poster {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
width: 450rpx;
|
||||
height: 714rpx;
|
||||
}
|
||||
.poster-pop {
|
||||
position: fixed;
|
||||
left: 50%;
|
||||
transform: translateX(-50%);
|
||||
top: 50%;
|
||||
margin: 0 auto;
|
||||
margin-top: -357rpx;
|
||||
z-index: 999;
|
||||
}
|
||||
.poster-pop image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
display: block;
|
||||
}
|
||||
.poster-pop .close {
|
||||
width: 46rpx;
|
||||
height: 75rpx;
|
||||
position: fixed;
|
||||
right: 0;
|
||||
top: -73rpx;
|
||||
display: block;
|
||||
z-index: 3999;
|
||||
}
|
||||
.poster-pop .save-poster {
|
||||
background-color: var(--view-theme);
|
||||
font-size: :22rpx;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
height: 76rpx;
|
||||
line-height: 76rpx;
|
||||
width: 100%;
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
.poster-pop .keep {
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
font-size: 25rpx;
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
.mask {
|
||||
z-index: 300 !important;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
background-color: rgba(0, 0, 0, 0.6);
|
||||
z-index: 9;
|
||||
}
|
||||
</style>
|
|
@ -1,949 +0,0 @@
|
|||
<template>
|
||||
<div class="group-con" :style="viewColor">
|
||||
<div class="header acea-row row-between-wrapper">
|
||||
<div class="pictrue"><image :src="storeCombination.image" /></div>
|
||||
<div class="text">
|
||||
<div class="line1" v-text="storeCombination.store_name"></div>
|
||||
<div class="money">
|
||||
¥
|
||||
<span class="num" v-text="storeCombination.price"></span>
|
||||
<span class="team sColor" v-text="(combinationData.buying_count_num ? combinationData.buying_count_num : '') + '人拼'"></span>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="pinkBool === -1" class="iconfont icon-pintuanshibai"></div>
|
||||
<div v-else-if="pinkBool === 10" class="iconfont icon-pintuanchenggong t-color"></div>
|
||||
</div>
|
||||
<div class="wrapper">
|
||||
<div class="title acea-row row-center-wrapper" v-if="pinkBool === 0">
|
||||
<div class="line"></div>
|
||||
<div class="name acea-row row-center-wrapper">
|
||||
剩余
|
||||
<CountDown :justifyLeft="justifyLeft" :is-day="false" :tip-text="' '" :day-text="' '" :hour-text="' : '" :minute-text="' : '" :second-text="' '"
|
||||
:datatime="combinationData.end_time"></CountDown>
|
||||
结束
|
||||
</div>
|
||||
<div class="line"></div>
|
||||
</div>
|
||||
<div class="tips t-color" v-if="pinkBool === 10">恭喜您拼团成功</div>
|
||||
<div class="tips t-color" v-else-if="pinkBool === -1">还差{{ count }}人,拼团失败</div>
|
||||
<div class="tips t-color" v-else-if="pinkBool === 0">拼团中,还差{{ count }}人拼团成功</div>
|
||||
<div class="list acea-row row-middle" :class="iShidden ? 'on' : 'result'">
|
||||
<div class="acea-row row-middle" v-if="pinkAll.length > 0">
|
||||
<div class="pictrue" v-for="(item, index) in pinkAll" :key="index"><image :src="item.avatar ? item.avatar : '/static/images/f.png'" /></div>
|
||||
</div>
|
||||
<div v-if="(pinkBool === 0 || pinkBool === -1)" class="pictrue" v-for="index in count" :key="index"><image class="img-none" src="../static/images/vacancy.png" /></div>
|
||||
</div>
|
||||
<div v-if="count > 9" class="lookAll acea-row row-center-wrapper" @click="lookAll">
|
||||
{{ iShidden ? '收起' : '查看全部' }}
|
||||
<span class="iconfont" :class="iShidden ? 'icon-xiangshang' : 'icon-xiangxia'"></span>
|
||||
</div>
|
||||
<div v-if="userBool !== 0 && pinkBool === 0">
|
||||
<div class="teamBnt" @click="listenerActionSheet">邀请好友参团</div>
|
||||
</div>
|
||||
<div class="teamBnt" v-else-if="userBool === 0 && pinkBool === 0 && count > 0" @click="pay">我要参团</div>
|
||||
<div class="teamBnt" v-if="pinkBool === 10 || pinkBool === -1" @click="goDetail(combinationData.product_group_id)">再次开团</div>
|
||||
<div class="cancel" @click="getCombinationRemove" v-if="pinkBool === 0 && userBool !== 0">
|
||||
<span class="iconfont icon-guanbi3"></span>
|
||||
取消开团
|
||||
</div>
|
||||
<div class="lookOrder" v-if="pinkBool === 10" @click="goOrder">
|
||||
查看订单信息
|
||||
<span class="iconfont icon-xiangyou"></span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="group-recommend">
|
||||
<div class="title acea-row row-between-wrapper">
|
||||
<div>大家都在拼</div>
|
||||
<div class="more" @click="goList">
|
||||
更多拼团
|
||||
<span class="iconfont icon-jiantou"></span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="list acea-row row-middle">
|
||||
<div class="item" v-for="(item, index) in storeCombinationHost" :key="index" @click="goDetail(item.product_group_id)">
|
||||
<div class="pictrue">
|
||||
<image :src="item.product.image" />
|
||||
<div class="team" v-text="item.buying_count_num + '人团'"></div>
|
||||
</div>
|
||||
<div class="name line1" v-text="item.product.store_name"></div>
|
||||
<div class="money" v-text="'¥' + item.price"></div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<product-window :attr="attr" :limitNum="1" :iSbnt="1" @myevent="onMyEvent" @ChangeAttr="ChangeAttr" @ChangeCartNum="ChangeCartNum"
|
||||
@iptCartNum="iptCartNum" @attrVal="attrVal" @goCat="goPay"></product-window>
|
||||
<!-- 分享按钮 -->
|
||||
<view class="generate-posters acea-row row-middle" :class="posters ? 'on' : ''">
|
||||
<!-- #ifndef MP -->
|
||||
<button class="item" :class="weixinStatus ? 'item3' : ''" hover-class='none' v-if="weixinStatus === true" @click="H5ShareBox = true">
|
||||
<!-- <button class="item" hover-class='none' v-if="weixinStatus === true" @click="setShareInfoStatus"> -->
|
||||
<view class="iconfont icon-weixin3"></view>
|
||||
<view class="">发送给朋友</view>
|
||||
</button>
|
||||
<!-- #endif -->
|
||||
<!-- #ifdef MP -->
|
||||
<button class="item" :class="weixinStatus ? 'item3' : ''" open-type="share" hover-class='none' @click="goFriend">
|
||||
<view class="iconfont icon-weixin3"></view>
|
||||
<view class="">发送给朋友</view>
|
||||
</button>
|
||||
<!-- #endif -->
|
||||
<button class="item" :class="weixinStatus ? 'item3' : ''" hover-class='none' @tap="goPoster">
|
||||
<view class="iconfont icon-haibao"></view>
|
||||
<view class="">生成海报</view>
|
||||
</button>
|
||||
<button class="item" :class="weixinStatus ? 'item3' : ''" hover-class='none' @click="copyPwd">
|
||||
<view class="iconfont icon-fuzhikouling1"></view>
|
||||
<view>生成口令</view>
|
||||
</button>
|
||||
</view>
|
||||
<view class="mask" v-if="posters" @click="listenerActionClose"></view>
|
||||
<!--口令复制结果-->
|
||||
<copyPassword :isCopy='isCopy' :copyUrl='copyUrl' @close="closeCopy"></copyPassword>
|
||||
<!-- 发送给朋友图片 -->
|
||||
<view class="share-box" v-if="H5ShareBox">
|
||||
<image src="/static/images/share-info.png" @click="H5ShareBox = false"></image>
|
||||
</view>
|
||||
<authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize>
|
||||
<!-- <Product-window v-on:changeFun="changeFun" :attr="attr" :limitNum='1' :iSbnt='1'></Product-window> -->
|
||||
<home></home>
|
||||
<canvasPoster v-if="posterCompenents" :posterStatus.sync="posterStatus" :picData="picData"></canvasPoster>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
// +----------------------------------------------------------------------
|
||||
// | CRMEB [ CRMEB赋能开发者,助力企业发展 ]
|
||||
// +----------------------------------------------------------------------
|
||||
// | Copyright (c) 2016~2021 https://www.crmeb.com All rights reserved.
|
||||
// +----------------------------------------------------------------------
|
||||
// | Licensed CRMEB并不是自由软件,未经许可不能去掉CRMEB相关版权
|
||||
// +----------------------------------------------------------------------
|
||||
// | Author: CRMEB Team <admin@crmeb.com>
|
||||
// +----------------------------------------------------------------------
|
||||
import CountDown from '@/components/countDown';
|
||||
import ProductWindow from '@/components/productWindow';
|
||||
import copyPassword from '@/components/copyPassword';
|
||||
import canvasPoster from '../combination_poster/index.vue'
|
||||
import { mapGetters } from 'vuex';
|
||||
import {
|
||||
getCombinationPink,
|
||||
postCombinationRemove,
|
||||
getCombinationList
|
||||
} from '@/api/activity';
|
||||
import {
|
||||
postCartAdd,
|
||||
getProductCode,
|
||||
copyPasswordApi
|
||||
} from '@/api/store';
|
||||
import authorize from '@/components/Authorize';
|
||||
import home from '@/components/home';
|
||||
const NAME = 'GroupRule';
|
||||
const app = getApp();
|
||||
export default {
|
||||
name: NAME,
|
||||
components: {
|
||||
CountDown,
|
||||
ProductWindow,
|
||||
home,
|
||||
canvasPoster,
|
||||
copyPassword,
|
||||
authorize,
|
||||
},
|
||||
props: {},
|
||||
data: function() {
|
||||
return {
|
||||
currentPinkOrder: '', //当前拼团订单
|
||||
isOk: 0, //判断拼团是否完成
|
||||
pinkBool: 0, //判断拼团是否成功|0=失败,1=成功
|
||||
userBool: 0, //判断当前用户是否在团内|0=未在,1=在
|
||||
pinkAll: [], //团员
|
||||
storeCombination: [], //拼团产品
|
||||
storeCombinationHost: [], //拼团推荐
|
||||
pinkId: 0,
|
||||
count: 0, //拼团剩余人数
|
||||
iShidden: false,
|
||||
isOpen: false, //是否打开属性组件
|
||||
attr: {
|
||||
cartAttr: false,
|
||||
productSelect: {
|
||||
image: '',
|
||||
store_name: '',
|
||||
price: '',
|
||||
quota: 0,
|
||||
unique: '',
|
||||
cart_num: 1,
|
||||
quota_show: 0,
|
||||
product_stock: 0,
|
||||
num: 0
|
||||
},
|
||||
productAttr: []
|
||||
},
|
||||
cart_num: '',
|
||||
userInfo: {},
|
||||
combinationData: {},
|
||||
posters: false,
|
||||
weixinStatus: false,
|
||||
H5ShareBox: false, //公众号分享图片
|
||||
isAuto: false, //没有授权的不会自动授权
|
||||
isShowAuth: false, //是否隐藏授权
|
||||
attrTxt: '请选择', //属性页面提示
|
||||
attrValue: '', //已选属性
|
||||
posterStatus: false,
|
||||
posterCompenents: false,
|
||||
currSpid: "",
|
||||
picData: {
|
||||
bagPic: '',
|
||||
goodsPic: '',
|
||||
codePic: "",
|
||||
title: "",
|
||||
label: "",
|
||||
msg: "",
|
||||
price: '',
|
||||
},
|
||||
isCopy: false,
|
||||
copyUrl: '',
|
||||
justifyLeft: ''
|
||||
};
|
||||
},
|
||||
computed: mapGetters(['isLogin', 'uid', 'viewColor']),
|
||||
|
||||
watch: {
|
||||
isLogin: {
|
||||
handler: function(newV, oldV) {
|
||||
if (newV) {
|
||||
this.getCombinationPink();
|
||||
}
|
||||
},
|
||||
deep: true
|
||||
},
|
||||
},
|
||||
onLoad(options) {
|
||||
var that = this;
|
||||
that.justifyLeft = that.viewColor;
|
||||
if(options.id)that.pinkId = options.id;
|
||||
//扫码携带参数处理
|
||||
// #ifdef MP
|
||||
if (options.scene) {
|
||||
let value = this.$util.getUrlParams(decodeURIComponent(options.scene));
|
||||
if (value.id) this.pinkId = value.id;
|
||||
//记录推广人uid
|
||||
if (value.spid) {
|
||||
app.globalData.spid = value.spid;
|
||||
that.currSpid = value.spid
|
||||
}
|
||||
}
|
||||
// #endif
|
||||
if (that.isLogin == false) {
|
||||
this.isAuto = true;
|
||||
this.isShowAuth = true
|
||||
} else {
|
||||
this.getCombinationPink();
|
||||
}
|
||||
|
||||
},
|
||||
mounted: function() {
|
||||
this.getCombinationProductList();
|
||||
this.getPosterCode()
|
||||
},
|
||||
//#ifdef MP
|
||||
/**
|
||||
* 用户点击右上角分享
|
||||
*/
|
||||
onShareAppMessage: function() {
|
||||
let that = this;
|
||||
let pathUrl = '/pages/activity/combination_status/index?id=' + this.pinkId;
|
||||
return {
|
||||
title: '您的好友' + that.pinkAll[0].nickname + '邀请您参团' + that.storeCombination.store_name,
|
||||
path: pathUrl,
|
||||
imageUrl: that.storeCombination.image || ''
|
||||
};
|
||||
},
|
||||
onShareTimeline: function() {
|
||||
let that = this;
|
||||
// console.log(app.globalData.openPages)
|
||||
return {
|
||||
title: '您的好友' + that.pinkAll[0].nickname + '邀请您参团' + that.storeCombination.store_name,
|
||||
query: {
|
||||
id: that.pinkId,
|
||||
spid: that.uid
|
||||
},
|
||||
imageUrl: that.storeCombination.image || ''
|
||||
}
|
||||
},
|
||||
//#endif
|
||||
methods: {
|
||||
// 授权关闭
|
||||
authColse: function(e) {
|
||||
this.isShowAuth = e;
|
||||
},
|
||||
// 授权后回调
|
||||
onLoadFun: function(e) {
|
||||
app.globalData.openPages = '/pages/activity/combination_status/index?id=' + this.pinkId;
|
||||
this.getCombinationPink();
|
||||
this.isShowAuth = false;
|
||||
},
|
||||
/**
|
||||
* 分享打开
|
||||
*
|
||||
*/
|
||||
listenerActionSheet: function() {
|
||||
if (this.isLogin == false) {
|
||||
this.isAuto = true;
|
||||
this.isShowAuth = true
|
||||
} else {
|
||||
// #ifdef H5
|
||||
if (this.$wechat.isWeixin() === true) {
|
||||
this.weixinStatus = true;
|
||||
}
|
||||
// #endif
|
||||
this.posters = !this.posters;
|
||||
}
|
||||
},
|
||||
// 分享关闭
|
||||
listenerActionClose: function() {
|
||||
this.posters = false;
|
||||
},
|
||||
// 小程序关闭分享弹窗;
|
||||
goFriend: function() {
|
||||
this.posters = false;
|
||||
// this.H5ShareBox = true
|
||||
},
|
||||
/**
|
||||
* 购物车手动填写
|
||||
*
|
||||
*/
|
||||
iptCartNum: function(e) {
|
||||
this.$set(this.attr.productSelect, 'cart_num', e);
|
||||
this.$set(this, 'cart_num', e);
|
||||
},
|
||||
attrVal(val) {
|
||||
this.attr.productAttr[val.indexw].index = this.attr.productAttr[val.indexw].attr_values[val.indexn];
|
||||
},
|
||||
onMyEvent: function() {
|
||||
this.$set(this.attr, 'cartAttr', false);
|
||||
this.$set(this, 'isOpen', false);
|
||||
},
|
||||
//选择属性;
|
||||
ChangeAttr: function(res) {
|
||||
this.$set(this, 'cart_num', 1);
|
||||
let productSelect = this.productValue[res];
|
||||
if (productSelect) {
|
||||
this.$set(this.attr.productSelect, 'image', productSelect.image);
|
||||
this.$set(this.attr.productSelect, 'price', productSelect.price);
|
||||
this.$set(this.attr.productSelect, 'stock', productSelect.stock);
|
||||
this.$set(this.attr.productSelect, 'quota', productSelect.quota);
|
||||
this.$set(this.attr.productSelect, 'unique', productSelect.unique);
|
||||
this.$set(this.attr.productSelect, 'cart_num', 1);
|
||||
this.$set(this.attr.productSelect, 'product_stock', productSelect.stock);
|
||||
this.$set(this.attr.productSelect, 'quota_show', productSelect.stock);
|
||||
this.$set(this, 'attrValue', res);
|
||||
this.$set(this, 'attrTxt', '已选择');
|
||||
} else {
|
||||
this.$set(this.attr.productSelect, 'image', this.storeCombination.image);
|
||||
this.$set(this.attr.productSelect, 'price', this.storeCombination.price);
|
||||
this.$set(this.attr.productSelect, 'quota', 0);
|
||||
this.$set(this.attr.productSelect, 'unique', '');
|
||||
this.$set(this.attr.productSelect, 'cart_num', 0);
|
||||
this.$set(this.attr.productSelect, 'quota_show', 0);
|
||||
this.$set(this.attr.productSelect, 'stock', 0);
|
||||
this.$set(this.attr.productSelect, 'product_stock', 0);
|
||||
this.$set(this, 'attrValue', '');
|
||||
this.$set(this, 'attrTxt', '请选择');
|
||||
}
|
||||
},
|
||||
ChangeCartNum: function(changeValue) {
|
||||
//changeValue:是否 加|减
|
||||
//获取当前变动属性
|
||||
let productSelect = this.productValue[this.attrValue];
|
||||
//如果没有属性,赋值给商品默认库存
|
||||
if (productSelect === undefined && !this.attr.productAttr.length)
|
||||
productSelect = this.attr.productSelect;
|
||||
//无属性值即库存为0;不存在加减;
|
||||
if (productSelect === undefined) return;
|
||||
let stock = productSelect.stock || 0;
|
||||
let num = this.attr.productSelect;
|
||||
if (changeValue) {
|
||||
num.cart_num++;
|
||||
if (num.cart_num > stock) {
|
||||
this.$set(this.attr.productSelect, "cart_num", stock);
|
||||
this.$set(this, "cart_num", stock);
|
||||
}
|
||||
} else {
|
||||
num.cart_num--;
|
||||
if (num.cart_num < 1) {
|
||||
this.$set(this.attr.productSelect, "cart_num", 1);
|
||||
this.$set(this, "cart_num", 1);
|
||||
}
|
||||
}
|
||||
},
|
||||
//默认选中属性;
|
||||
DefaultSelect() {
|
||||
let productAttr = this.attr.productAttr,
|
||||
value = [];
|
||||
for (var key in this.productValue) {
|
||||
if (this.productValue[key].stock > 0) {
|
||||
value = this.attr.productAttr.length ? key.split(',') : [];
|
||||
break;
|
||||
}
|
||||
}
|
||||
for (let i = 0; i < productAttr.length; i++) {
|
||||
this.$set(productAttr[i], 'index', value[i]);
|
||||
}
|
||||
//sort();排序函数:数字-英文-汉字;
|
||||
let productSelect = this.productValue[value.join(',')];
|
||||
if (productSelect && productAttr.length) {
|
||||
this.$set(this.attr.productSelect, 'store_name', this.storeCombination.store_name);
|
||||
this.$set(this.attr.productSelect, 'image', productSelect.image);
|
||||
this.$set(this.attr.productSelect, 'price', productSelect.price);
|
||||
this.$set(this.attr.productSelect, 'stock', productSelect.stock);
|
||||
this.$set(this.attr.productSelect, 'unique', productSelect.unique);
|
||||
this.$set(this.attr.productSelect, 'cart_num', 1);
|
||||
this.$set(this.attr.productSelect, 'product_stock', productSelect.stock);
|
||||
this.$set(this.attr.productSelect, 'quota_show', productSelect.stock);
|
||||
this.$set(this, 'attrValue', value.join(','));
|
||||
this.attrValue = value.join(',');
|
||||
this.$set(this, 'attrTxt', '已选择');
|
||||
} else if (!productSelect && productAttr.length) {
|
||||
this.$set(this.attr.productSelect, 'store_name', this.storeCombination.store_name);
|
||||
this.$set(this.attr.productSelect, 'image', this.storeCombination.image);
|
||||
this.$set(this.attr.productSelect, 'price', this.storeCombination.price);
|
||||
this.$set(this.attr.productSelect, 'stock', 0);
|
||||
this.$set(this.attr.productSelect, 'unique', '');
|
||||
this.$set(this.attr.productSelect, 'cart_num', 0);
|
||||
this.$set(this.attr.productSelect, 'product_stock', 0);
|
||||
this.$set(this.attr.productSelect, 'quota_show', 0);
|
||||
this.$set(this, 'attrValue', '');
|
||||
this.$set(this, 'attrTxt', '请选择');
|
||||
} else if (!productSelect && !productAttr.length) {
|
||||
this.$set(this.attr.productSelect, 'store_name', this.storeCombination.store_name);
|
||||
this.$set(this.attr.productSelect, 'image', this.storeCombination.image);
|
||||
this.$set(this.attr.productSelect, 'price', this.storeCombination.price);
|
||||
this.$set(this.attr.productSelect, 'stock', 0);
|
||||
this.$set(this.attr.productSelect, 'unique', this.storeCombination.unique || '');
|
||||
this.$set(this.attr.productSelect, 'cart_num', 1);
|
||||
this.$set(this.attr.productSelect, 'quota_show', 0);
|
||||
this.$set(this.attr.productSelect, 'product_stock', 0);
|
||||
this.$set(this, 'attrValue', '');
|
||||
this.$set(this, 'attrTxt', '请选择');
|
||||
} else if (productSelect && !productAttr.length) {
|
||||
this.$set(
|
||||
this.attr.productSelect,
|
||||
"store_name",
|
||||
this.storeCombination.store_name
|
||||
);
|
||||
this.$set(this.attr.productSelect, "image", productSelect.image);
|
||||
this.$set(this.attr.productSelect, "price", productSelect.price);
|
||||
this.$set(this.attr.productSelect, "stock", productSelect.stock);
|
||||
this.$set(this.attr.productSelect, "unique", productSelect.unique);
|
||||
this.$set(this.attr.productSelect, 'quota_show', productSelect.stock);
|
||||
this.$set(this, "attrValue", value.join(","));
|
||||
this.$set(this, "attrTxt", "已选择");
|
||||
if (productSelect.stock == 0) {
|
||||
this.$set(this.attr.productSelect, "cart_num", 0);
|
||||
} else {
|
||||
this.$set(this.attr.productSelect, "cart_num", 1);
|
||||
}
|
||||
}
|
||||
},
|
||||
setProductSelect: function() {
|
||||
var that = this;
|
||||
var attr = that.attr;
|
||||
attr.productSelect.image = that.storeCombination.image;
|
||||
attr.productSelect.store_name = that.storeCombination.store_name;
|
||||
attr.productSelect.price = that.storeCombination.price;
|
||||
attr.productSelect.quota = 0;
|
||||
attr.productSelect.quota_show = that.storeCombination.stock;
|
||||
attr.productSelect.stock = that.storeCombination.stock;
|
||||
attr.productSelect.product_stock = that.storeCombination.stock;
|
||||
attr.cartAttr = false;
|
||||
that.$set(that, 'attr', attr);
|
||||
},
|
||||
pay: function() {
|
||||
var that = this;
|
||||
that.attr.cartAttr = true;
|
||||
that.isOpen = true;
|
||||
},
|
||||
goPay() {
|
||||
var that = this;
|
||||
var data = {
|
||||
product_id: that.combinationData.product_group_id,
|
||||
product_attr_unique: that.attr.productSelect !== undefined ? that.attr.productSelect.unique : "",
|
||||
cart_num: that.attr.productSelect.cart_num,
|
||||
product_type: 4,
|
||||
is_new: 1,
|
||||
group_buying_id: that.combinationData.group_buying_id
|
||||
};
|
||||
postCartAdd(data)
|
||||
.then(res => {
|
||||
uni.navigateTo({
|
||||
url: '/pages/users/order_confirm/index?new=1&cartId=' + res.data.cart_id
|
||||
});
|
||||
})
|
||||
.catch(res => {
|
||||
that.$util.Tips({
|
||||
title: res
|
||||
});
|
||||
});
|
||||
},
|
||||
goPoster: function() {
|
||||
var that = this;
|
||||
that.posters = false;
|
||||
this.posterStatus = true
|
||||
},
|
||||
goOrder: function() {
|
||||
var that = this;
|
||||
uni.navigateTo({
|
||||
url: '/pages/order_details/index?order_id=' + that.currentPinkOrder
|
||||
});
|
||||
},
|
||||
//拼团列表
|
||||
goList: function() {
|
||||
uni.navigateTo({
|
||||
url: '/pages/activity/combination/index'
|
||||
});
|
||||
},
|
||||
//拼团详情
|
||||
goDetail: function(id) {
|
||||
this.pinkId = id;
|
||||
uni.navigateTo({
|
||||
url: '/pages/activity/combination_details/index?id=' + id
|
||||
});
|
||||
},
|
||||
getPosterCode() {
|
||||
let type
|
||||
// #ifndef MP
|
||||
type = 'wechat'
|
||||
// #endif
|
||||
// #ifdef MP
|
||||
type = 'routine'
|
||||
// #endif
|
||||
getProductCode(this.pinkId, {
|
||||
type,
|
||||
product_type: 40
|
||||
}).then(res => {
|
||||
this.picData.codePic = res.data.url
|
||||
}).catch(err => {
|
||||
this.$util.Tips({
|
||||
title: err
|
||||
});
|
||||
})
|
||||
},
|
||||
//复制口令
|
||||
copyPwd(){
|
||||
let that = this;
|
||||
copyPasswordApi({
|
||||
id: that.pinkId,
|
||||
product_type: 40
|
||||
}).then(async res => {
|
||||
that.copyUrl = res.data.str;
|
||||
that.posters = false
|
||||
that.isCopy = true;
|
||||
})
|
||||
},
|
||||
closeCopy(){
|
||||
this.isCopy = false
|
||||
},
|
||||
//拼团信息
|
||||
getCombinationPink: function() {
|
||||
var that = this;
|
||||
uni.showLoading({
|
||||
title: '加载中',
|
||||
mask: true
|
||||
});
|
||||
|
||||
getCombinationPink(that.pinkId)
|
||||
.then(res => {
|
||||
uni.hideLoading();
|
||||
that.$set(that, 'combinationData', res.data);
|
||||
that.$set(that, 'storeCombination', res.data.product);
|
||||
that.$set(that, 'pinkAll', res.data.groupUser);
|
||||
that.$set(that, 'count', res.data.buying_count_num - res.data.yet_buying_num);
|
||||
that.$set(that, 'userBool', res.data.create_status);
|
||||
that.$set(that, 'pinkBool', res.data.status);
|
||||
that.$set(that, 'currentPinkOrder', res.data.self ? res.data.self.order_id : '');
|
||||
that.attr.productAttr = res.data.product.attr;
|
||||
that.productValue = res.data.product.sku;
|
||||
that.$set(that.picData, 'goodsPic', res.data.product.image);
|
||||
that.$set(that.picData, 'title', res.data.product.store_name.length > 28 ? res.data.product.store_name.slice(0,
|
||||
28) + '...' : res.data.product.store_name);
|
||||
that.$set(that.picData, 'label', res.data.buying_count_num + "人团");
|
||||
that.$set(that.picData, 'price', res.data.product.price);
|
||||
that.$set(that.picData, 'msg', '市场价:¥ ' + res.data.product.ot_price + " 还差 " +
|
||||
that.count + " 人 拼团成功");
|
||||
this.posterCompenents = true
|
||||
//#ifdef H5
|
||||
that.setOpenShare();
|
||||
//#endif
|
||||
that.setProductSelect();
|
||||
that.DefaultSelect();
|
||||
})
|
||||
.catch(err => {
|
||||
this.$util.Tips({
|
||||
title: err
|
||||
});
|
||||
uni.redirectTo({
|
||||
success() {},
|
||||
fail() {
|
||||
uni.navigateTo({
|
||||
url: '/pages/index/index',
|
||||
})
|
||||
}
|
||||
})
|
||||
});
|
||||
},
|
||||
//拼团列表
|
||||
getCombinationProductList: function() {
|
||||
var that = this;
|
||||
var data = {
|
||||
page: 1,
|
||||
};
|
||||
getCombinationList(data)
|
||||
.then(res => {
|
||||
var storeCombinationHost = res.data.list;
|
||||
that.storeCombinationHost = that.storeCombinationHost.concat(storeCombinationHost)
|
||||
})
|
||||
.catch(res => {
|
||||
that.$util.Tips({
|
||||
title: res
|
||||
});
|
||||
});
|
||||
},
|
||||
//#ifdef H5
|
||||
setOpenShare() {
|
||||
let that = this;
|
||||
let configTimeline = {
|
||||
title: '您的好友' + that.pinkAll[0].nickname + '邀请您参团' + that.storeCombination.store_name,
|
||||
desc: that.storeCombination.store_name,
|
||||
link: window.location.protocol + '//' + window.location.host +
|
||||
'/pages/activity/combination_status/index?id=' + that.pinkId,
|
||||
imgUrl: that.storeCombination.image
|
||||
};
|
||||
if (this.$wechat.isWeixin()) {
|
||||
this.$wechat
|
||||
.wechatEvevt(['updateAppMessageShareData', 'updateTimelineShareData', 'onMenuShareAppMessage',
|
||||
'onMenuShareTimeline'
|
||||
], configTimeline)
|
||||
.then(res => {
|
||||
// console.log(res);
|
||||
})
|
||||
.catch(res => {
|
||||
if (res.is_ready) {
|
||||
res.wx.updateAppMessageShareData(configTimeline);
|
||||
res.wx.updateTimelineShareData(configTimeline);
|
||||
res.wx.onMenuShareAppMessage(configTimeline);
|
||||
res.wx.onMenuShareTimeline(configTimeline);
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
//#endif
|
||||
//拼团取消
|
||||
getCombinationRemove: function() {
|
||||
var that = this;
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '确定取消拼团?',
|
||||
success: function (res) {
|
||||
if (res.confirm) {
|
||||
postCombinationRemove({
|
||||
group_buying_id: that.pinkId
|
||||
})
|
||||
.then(res => {
|
||||
that.$util.Tips({
|
||||
title: res.message
|
||||
}, {
|
||||
tab: 3
|
||||
});
|
||||
})
|
||||
.catch(res => {
|
||||
that.$util.Tips({
|
||||
title: res.message
|
||||
});
|
||||
});
|
||||
}else if (res.cancel) {
|
||||
return that.$util.Tips({
|
||||
title: '已取消'
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
lookAll: function() {
|
||||
this.iShidden = !this.iShidden;
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
.generate-posters {
|
||||
width: 100%;
|
||||
height: 170rpx;
|
||||
background-color: #fff;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
z-index: 301;
|
||||
transform: translate3d(0, 100%, 0);
|
||||
transition: all 0.3s cubic-bezier(0.25, 0.5, 0.5, 0.9);
|
||||
border-top: 1rpx solid #eee;
|
||||
}
|
||||
.generate-posters.on {
|
||||
transform: translate3d(0, 0, 0);
|
||||
}
|
||||
.generate-posters .item {
|
||||
/* #ifdef H5 */
|
||||
flex: 50%;
|
||||
/* #endif */
|
||||
/* #ifndef H5 */
|
||||
flex: 33.33%;
|
||||
/* #endif */
|
||||
text-align: center;
|
||||
font-size: 30rpx;
|
||||
&.item3{
|
||||
flex: 33.33%;
|
||||
}
|
||||
}
|
||||
.generate-posters .item .iconfont {
|
||||
font-size: 80rpx;
|
||||
color: #5eae72;
|
||||
}
|
||||
.generate-posters .item .iconfont.icon-haibao {
|
||||
color: #5391f1;
|
||||
}
|
||||
.generate-posters .item .iconfont.icon-fuzhikouling1 {
|
||||
color: #FBB324;
|
||||
}
|
||||
/* #ifdef MP */
|
||||
.group-con{
|
||||
padding-top: 30rpx;
|
||||
}
|
||||
/* #endif */
|
||||
.sColor{
|
||||
color: var(--view-theme);
|
||||
border: 1rpx solid var(--view-theme);
|
||||
}
|
||||
/*开团*/
|
||||
.group-con .header {
|
||||
width: 100%;
|
||||
height: 186rpx;
|
||||
background-color: #fff;
|
||||
border-top: 1px solid #f5f5f5;
|
||||
padding: 0 30rpx;
|
||||
position: relative;
|
||||
}
|
||||
.group-con .header .iconfont {
|
||||
font-size: 100rpx;
|
||||
position: absolute;
|
||||
color: #ccc;
|
||||
right: 33rpx;
|
||||
bottom: 20rpx;
|
||||
}
|
||||
.group-con .header .pictrue {
|
||||
width: 140rpx;
|
||||
height: 140rpx;
|
||||
}
|
||||
.group-con .header .pictrue uni-image,.group-con .header .pictrue image {
|
||||
width: 140rpx;
|
||||
height: 140rpx;
|
||||
border-radius: 6rpx;
|
||||
}
|
||||
.group-con .header .text {
|
||||
width: 540rpx;
|
||||
font-size: 30rpx;
|
||||
color: #222;
|
||||
}
|
||||
.group-con .header .text .money {
|
||||
font-size: 24rpx;
|
||||
font-weight: bold;
|
||||
margin-top: 15rpx;
|
||||
}
|
||||
.group-con .header .text .money .num {
|
||||
font-size: 32rpx;
|
||||
}
|
||||
.group-con .header .text .money .team {
|
||||
padding: 1rpx 10rpx;
|
||||
font-weight: normal;
|
||||
border-radius: 50rpx;
|
||||
font-size: 20rpx;
|
||||
vertical-align: 4rpx;
|
||||
margin-left: 15rpx;
|
||||
}
|
||||
.group-con .wrapper {
|
||||
background-color: #fff;
|
||||
margin-top: 20rpx;
|
||||
padding: 2rpx 0 35rpx 0;
|
||||
}
|
||||
.group-con .wrapper .title {
|
||||
margin-top: 30rpx;
|
||||
}
|
||||
.group-con .wrapper .title .line {
|
||||
width: 136rpx;
|
||||
height: 1px;
|
||||
background-color: #ddd;
|
||||
}
|
||||
.group-con .wrapper .title .name {
|
||||
margin: 0 45rpx;
|
||||
font-size: 28rpx;
|
||||
color: #282828;
|
||||
}
|
||||
.group-con .wrapper .title .name .time {
|
||||
margin: 0 14rpx;
|
||||
}
|
||||
/deep/.group-con .wrapper .styleAll {
|
||||
background-color: #ffcfcb;
|
||||
text-align: center;
|
||||
border-radius: 3rpx;
|
||||
font-size: 28rpx;
|
||||
font-weight: bold;
|
||||
display: inline-block;
|
||||
vertical-align: middle;
|
||||
background-color: var(--view-minorColor);
|
||||
padding: 2rpx 5rpx;
|
||||
}
|
||||
.gColor{
|
||||
background-color: var(--view-theme)!important;
|
||||
}
|
||||
.t-color{
|
||||
color: var(--view-theme)!important;
|
||||
}
|
||||
.group-con .wrapper .tips {
|
||||
font-size: 30rpx;
|
||||
font-weight: bold;
|
||||
text-align: center;
|
||||
margin-top: 30rpx;
|
||||
}
|
||||
.group-con .wrapper .list {
|
||||
padding: 0 30rpx;
|
||||
margin-top: 45rpx;
|
||||
}
|
||||
.group-con .wrapper .list.result {
|
||||
max-height: 240rpx;
|
||||
overflow: hidden;
|
||||
}
|
||||
.group-con .wrapper .list.result.on {
|
||||
max-height: 2000rpx;
|
||||
}
|
||||
.group-con .wrapper .list .pictrue {
|
||||
width: 94rpx;
|
||||
height: 94rpx;
|
||||
margin: 0 0 29rpx 35rpx;
|
||||
}
|
||||
.group-con .wrapper .list .pictrue uni-image,.group-con .wrapper .list .pictrue image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 50%;
|
||||
}
|
||||
.group-con .wrapper .list .img-none {
|
||||
border: none;
|
||||
width: 140rpx;
|
||||
height: 140rpx;
|
||||
}
|
||||
.group-con .wrapper .lookAll {
|
||||
font-size: 24rpx;
|
||||
color: #282828;
|
||||
padding-top: 10rpx;
|
||||
}
|
||||
.group-con .wrapper .lookAll .iconfont {
|
||||
font-size: 25rpx;
|
||||
margin: 2rpx 0 0 10rpx;
|
||||
}
|
||||
.group-con .wrapper .teamBnt {
|
||||
font-size: 30rpx;
|
||||
width: 620rpx;
|
||||
height: 86rpx;
|
||||
border-radius: 50rpx;
|
||||
text-align: center;
|
||||
line-height: 86rpx;
|
||||
color: #fff;
|
||||
margin: 21rpx auto 0 auto;
|
||||
background-color: var(--view-theme);
|
||||
}
|
||||
.group-con .wrapper .cancel,
|
||||
.group-con .wrapper .lookOrder {
|
||||
text-align: center;
|
||||
font-size: 24rpx;
|
||||
color: #282828;
|
||||
padding-top: 30rpx;
|
||||
}
|
||||
.group-con .wrapper .cancel .iconfont {
|
||||
font-size: 35rpx;
|
||||
color: #2c2c2c;
|
||||
vertical-align: -4rpx;
|
||||
margin-right: 9rpx;
|
||||
}
|
||||
.group-con .wrapper .lookOrder .iconfont {
|
||||
font-size: 25rpx;
|
||||
color: #2c2c2c;
|
||||
margin-left: 10rpx;
|
||||
}
|
||||
.group-con .group-recommend {
|
||||
background-color: #fff;
|
||||
margin-top: 25rpx;
|
||||
}
|
||||
.group-con .group-recommend .title {
|
||||
padding-right: 30rpx;
|
||||
margin-left: 30rpx;
|
||||
height: 85rpx;
|
||||
border-bottom: 1px solid #eee;
|
||||
font-size: 28rpx;
|
||||
color: #282828;
|
||||
}
|
||||
.group-con .group-recommend .title .more {
|
||||
color: #808080;
|
||||
}
|
||||
.group-con .group-recommend .title .more .iconfont {
|
||||
margin-left: 13rpx;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
.group-con .group-recommend .list {
|
||||
margin-top: 30rpx;
|
||||
}
|
||||
.group-con .group-recommend .list .item {
|
||||
width: 210rpx;
|
||||
margin: 0 0 25rpx 30rpx;
|
||||
}
|
||||
.group-con .group-recommend .list .item .pictrue {
|
||||
width: 100%;
|
||||
height: 210rpx;
|
||||
position: relative;
|
||||
}
|
||||
.group-con .group-recommend .list .item .pictrue uni-image,.group-con .group-recommend .list .item .pictrue image {
|
||||
width: 210rpx;
|
||||
height: 210rpx;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
.group-con .group-recommend .list .item .pictrue .team {
|
||||
position: absolute;
|
||||
top: 28rpx;
|
||||
left: -5rpx;
|
||||
min-width: 100rpx;
|
||||
height: 36rpx;
|
||||
line-height: 36rpx;
|
||||
text-align: center;
|
||||
border-radius: 0 18rpx 18rpx 0;
|
||||
font-size: 20rpx;
|
||||
color: #fff;
|
||||
background-image: linear-gradient(to right, var(--view-bntColor21) 0%, var(--view-bntColor22) 100%);
|
||||
}
|
||||
.group-con .group-recommend .list .item .name {
|
||||
font-size: 28rpx;
|
||||
color: #333;
|
||||
margin-top: 0.18rem;
|
||||
}
|
||||
.group-con .group-recommend .list .item .money {
|
||||
font-weight: bold;
|
||||
font-size: 28rpx;
|
||||
color: var(--view-priceColor);
|
||||
}
|
||||
.share-box {
|
||||
z-index: 1000;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
</style>
|
|
@ -1,429 +0,0 @@
|
|||
<template>
|
||||
<view :style="viewColor">
|
||||
<view class='flash-sale'>
|
||||
<!-- #ifdef H5 -->
|
||||
<view class="fixed-head">
|
||||
<view class="sys-head" :style="{height:statusBarHeight}"></view>
|
||||
<view class="tool-bar">
|
||||
<view class='iconfont icon-xiangzuo' @tap='goBack'></view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- #endif -->
|
||||
<view class="saleBox"></view>
|
||||
<view class='header' v-if="timeList.length>0">
|
||||
<image :src='timeList[active].pic'></image>
|
||||
</view>
|
||||
<view class="seckillList acea-row row-between-wrapper">
|
||||
<view class="priceTag">
|
||||
<image :src="`${domain}/static/diy/priceTag${keyColor}.png`"></image>
|
||||
</view>
|
||||
<view class='timeLsit'>
|
||||
<scroll-view class="scroll-view_x" scroll-x scroll-with-animation style="width:auto;overflow:hidden;height:106rpx;" :scroll-into-view="intoindex">
|
||||
<block v-for="(item,index) in timeList" :key='index'>
|
||||
<view @tap='settimeList(item,index)' class='item' :class="active == index?'on':''" :id='"sort"+index'>
|
||||
<view class='time'>{{item.time}}</view>
|
||||
<view class="state">{{item.state}}</view>
|
||||
</view>
|
||||
</block>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</view>
|
||||
<view class='list'>
|
||||
<block v-for="(item,index) in seckillList" :key='index'>
|
||||
<view class='item acea-row row-between-wrapper' @tap='goDetails(item)'>
|
||||
<view class='pictrue'>
|
||||
<image :src='item.image'></image>
|
||||
</view>
|
||||
<view class='text acea-row row-column-around'>
|
||||
<view class='name line1'>{{item.store_name}}</view>
|
||||
<view class='money'>¥
|
||||
<text class='num'>{{item.price}}</text>
|
||||
<text class="y_money">¥{{item.ot_price}}</text>
|
||||
</view>
|
||||
<view class="limit">限量 <text class="limitPrice">{{item.stock}}{{item.unit_name || ''}}</text></view>
|
||||
<view class="progress">
|
||||
<view class='bg-reds' :style="'width:'+item.percent+';'"></view>
|
||||
<view class='piece'>已抢{{item.percent}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class='grab b-color' v-if="status == 1">马上抢</view>
|
||||
<view class='grab b-color' v-else-if="status == 2">未开始</view>
|
||||
<view class='grab bg-color-hui' v-else>已结束</view>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
<view class='noCommodity' v-if="seckillList.length == 0 && (page != 1 || active== 0)">
|
||||
<view class='pictrue'>
|
||||
<image src='/static/images/noCart.png'></image>
|
||||
<view>暂无商品,去看点什么吧</view>
|
||||
</view>
|
||||
</view>
|
||||
<home></home>
|
||||
<!-- #ifndef H5 -->
|
||||
<passwordPopup></passwordPopup>
|
||||
<!-- #endif -->
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// +----------------------------------------------------------------------
|
||||
// | CRMEB [ CRMEB赋能开发者,助力企业发展 ]
|
||||
// +----------------------------------------------------------------------
|
||||
// | Copyright (c) 2016~2021 https://www.crmeb.com All rights reserved.
|
||||
// +----------------------------------------------------------------------
|
||||
// | Licensed CRMEB并不是自由软件,未经许可不能去掉CRMEB相关版权
|
||||
// +----------------------------------------------------------------------
|
||||
// | Author: CRMEB Team <admin@crmeb.com>
|
||||
// +----------------------------------------------------------------------
|
||||
import {
|
||||
getSeckillIndexTime,
|
||||
getSeckillList
|
||||
} from '../../../api/activity.js';
|
||||
import home from '@/components/home/index.vue'
|
||||
// #ifndef H5
|
||||
import passwordPopup from '@/components/passwordPopup';
|
||||
// #endif
|
||||
import { mapGetters } from "vuex";
|
||||
import { configMap } from "@/utils";
|
||||
import { HTTP_REQUEST_URL } from '@/config/app';
|
||||
export default {
|
||||
components: {
|
||||
// #ifndef H5
|
||||
passwordPopup,
|
||||
// #endif
|
||||
home
|
||||
},
|
||||
computed: configMap({statusBarHeight:0},mapGetters(['viewColor','keyColor'])),
|
||||
data() {
|
||||
return {
|
||||
domain: HTTP_REQUEST_URL,
|
||||
seckillList: [],
|
||||
timeList: [],
|
||||
active: 5,
|
||||
scrollLeft: 0,
|
||||
interval: 0,
|
||||
status: 1,
|
||||
countDownHour: "00",
|
||||
countDownMinute: "00",
|
||||
countDownSecond: "00",
|
||||
page: 1,
|
||||
limit: 8,
|
||||
loading: false,
|
||||
loadend: false,
|
||||
pageloading: false,
|
||||
intoindex:''
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 用户点击右上角分享
|
||||
*/
|
||||
// #ifdef MP
|
||||
onShareAppMessage: function() {
|
||||
wx.showShareMenu({
|
||||
withShareTicket: true,
|
||||
menus: ['shareAppMessage', 'shareTimeline']
|
||||
})
|
||||
return {
|
||||
title: '秒杀活动',
|
||||
path: 'pages/activity/goods_seckill/index',
|
||||
}
|
||||
},
|
||||
onShareTimeline: function() {
|
||||
return {
|
||||
title: '秒杀活动',
|
||||
query: {
|
||||
key: ''
|
||||
},
|
||||
imageUrl: ''
|
||||
}
|
||||
},
|
||||
// #endif
|
||||
onLoad() {
|
||||
this.getSeckillConfig();
|
||||
},
|
||||
methods: {
|
||||
goBack: function() {
|
||||
uni.navigateBack();
|
||||
},
|
||||
getSeckillConfig: function() {
|
||||
let that = this;
|
||||
getSeckillIndexTime().then(res => {
|
||||
that.timeList = res.data.seckillTime;
|
||||
that.active = res.data.seckillTimeIndex;
|
||||
that.$nextTick(()=>{
|
||||
that.intoindex = 'sort'+res.data.seckillTimeIndex
|
||||
})
|
||||
let time;
|
||||
that.timeList.map((item) => {
|
||||
time = item.start_time > 9 ? item.start_time + ':00' : '0' + item.start_time + ':00';
|
||||
item.time = time;
|
||||
})
|
||||
if (that.timeList.length) {
|
||||
// wxh.time(that.data.timeList[that.data.active].stop, that);
|
||||
setTimeout(function() {
|
||||
that.loading = true
|
||||
}, 2000);
|
||||
that.seckillList = [],
|
||||
that.page = 1
|
||||
that.status = that.timeList[that.active].status
|
||||
that.getSeckillList();
|
||||
// 不用延时 app不会自动滚动到当前时间
|
||||
setTimeout(()=>{
|
||||
// that.scrollLeft = (that.active - 1.37) * 100
|
||||
},500)
|
||||
}
|
||||
});
|
||||
},
|
||||
getSeckillList: function() {
|
||||
var that = this;
|
||||
var data = {
|
||||
page: that.page,
|
||||
limit: that.limit,
|
||||
start_time: that.timeList[that.active].start_time,
|
||||
end_time: that.timeList[that.active].end_time
|
||||
};
|
||||
if (that.loadend) return;
|
||||
if (that.pageloading) return;
|
||||
this.pageloading = true
|
||||
getSeckillList(data).then(res => {
|
||||
// console.log(res);
|
||||
var seckillList = res.data.list;
|
||||
seckillList.map((item) => {
|
||||
item.percent = item.stock === 0 ? '0%' : (item.sales*100 / item.stock).toFixed(2) + '%';
|
||||
})
|
||||
var loadend = seckillList.length < that.limit;
|
||||
that.page++;
|
||||
that.seckillList = that.seckillList.concat(seckillList);
|
||||
that.pageloading = false;
|
||||
that.loadend = loadend;
|
||||
}).catch(err => {
|
||||
that.pageloading = false
|
||||
});
|
||||
},
|
||||
settimeList: function(item, index) {
|
||||
var that = this;
|
||||
this.active = index
|
||||
if (that.interval) {
|
||||
clearInterval(that.interval);
|
||||
that.interval = null
|
||||
}
|
||||
that.interval = 0;
|
||||
that.countDownHour = "00";
|
||||
that.countDownMinute = "00";
|
||||
that.countDownSecond = "00";
|
||||
that.status = that.timeList[that.active].status;
|
||||
that.loadend = false;
|
||||
that.page = 1;
|
||||
that.seckillList = [];
|
||||
that.getSeckillList();
|
||||
},
|
||||
goDetails(item) {
|
||||
uni.navigateTo({
|
||||
url: '/pages/activity/goods_seckill_details/index?id=' + item.product_id
|
||||
})
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 页面上拉触底事件的处理函数
|
||||
*/
|
||||
onReachBottom: function() {
|
||||
this.getSeckillList();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background-color: #F5F5F5 !important;
|
||||
}
|
||||
.flash-sale .header {
|
||||
width: 710rpx;
|
||||
height: 300rpx;
|
||||
margin: -215rpx auto 0 auto;
|
||||
border-radius: 20rpx;
|
||||
}
|
||||
.flash-sale .header image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 20rpx;
|
||||
}
|
||||
.flash-sale .seckillList {
|
||||
padding: 0 20rpx;
|
||||
}
|
||||
.flash-sale .seckillList .priceTag {
|
||||
width: 76rpx;
|
||||
height: 70rpx;
|
||||
}
|
||||
.flash-sale .seckillList .priceTag image {
|
||||
opacity: 1;
|
||||
}
|
||||
.flash-sale .seckillList .priceTag image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.flash-sale .timeLsit {
|
||||
width: 610rpx;
|
||||
white-space: nowrap;
|
||||
margin: 10rpx 0;
|
||||
}
|
||||
.flash-sale .timeLsit .item {
|
||||
display: inline-block;
|
||||
font-size: 20rpx;
|
||||
color: #666;
|
||||
text-align: center;
|
||||
padding: 11rpx 0;
|
||||
box-sizing: border-box;
|
||||
height: 96rpx;
|
||||
margin-right: 35rpx;
|
||||
}
|
||||
.flash-sale .timeLsit .item .time {
|
||||
font-size: 36rpx;
|
||||
font-weight: 600;
|
||||
color: #333;
|
||||
}
|
||||
.flash-sale .timeLsit .item.on .time {
|
||||
color: var(--view-theme);
|
||||
}
|
||||
.flash-sale .timeLsit .item.on .state {
|
||||
width: 90rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 30rpx;
|
||||
border-radius: 15rpx;
|
||||
background-image: linear-gradient(90deg, var(--view-bntColor11) 0%, var(--view-bntColor12) 100%);
|
||||
color: #fff;
|
||||
}
|
||||
.flash-sale .countDown {
|
||||
height: 92rpx;
|
||||
border-bottom: 1px solid #f0f0f0;
|
||||
margin-top: -14rpx;
|
||||
font-size: 28rpx;
|
||||
color: #282828;
|
||||
}
|
||||
.flash-sale .countDown .num {
|
||||
font-size: 28rpx;
|
||||
font-weight: bold;
|
||||
background-color: #ffcfcb;
|
||||
padding: 4rpx 7rpx;
|
||||
border-radius: 3rpx;
|
||||
}
|
||||
.flash-sale .countDown .text {
|
||||
font-size: 28rpx;
|
||||
color: #282828;
|
||||
margin-right: 13rpx;
|
||||
}
|
||||
.flash-sale .list .item {
|
||||
height: 230rpx;
|
||||
position: relative;
|
||||
width: 710rpx;
|
||||
margin: 0 auto 20rpx auto;
|
||||
background-color: #fff;
|
||||
border-radius: 20rpx;
|
||||
padding: 0 25rpx;
|
||||
}
|
||||
.flash-sale .list .item .pictrue {
|
||||
width: 180rpx;
|
||||
height: 180rpx;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
.flash-sale .list .item .pictrue image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
.flash-sale .list .item .text {
|
||||
width: 460rpx;
|
||||
font-size: 30rpx;
|
||||
color: #333;
|
||||
height: 166rpx;
|
||||
}
|
||||
.flash-sale .list .item .text .name {
|
||||
width: 100%;
|
||||
}
|
||||
.flash-sale .list .item .text .money {
|
||||
font-size: 30rpx;
|
||||
color: var(--view-priceColor);
|
||||
}
|
||||
.flash-sale .list .item .text .money .num {
|
||||
font-size: 40rpx;
|
||||
font-weight: 500;
|
||||
}
|
||||
.flash-sale .list .item .text .money .y_money {
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
text-decoration-line: line-through;
|
||||
margin-left: 15rpx;
|
||||
}
|
||||
.flash-sale .list .item .text .limit {
|
||||
font-size: 22rpx;
|
||||
color: #999;
|
||||
margin-bottom: 5rpx;
|
||||
}
|
||||
.flash-sale .list .item .text .limit .limitPrice {
|
||||
margin-left: 10rpx;
|
||||
}
|
||||
.flash-sale .list .item .text .progress {
|
||||
overflow: hidden;
|
||||
background-color: var(--view-bgColor);
|
||||
width: 260rpx;
|
||||
border-radius: 18rpx;
|
||||
height: 18rpx;
|
||||
position: relative;
|
||||
}
|
||||
.flash-sale .list .item .text .progress .bg-reds {
|
||||
width: 0;
|
||||
height: 100%;
|
||||
transition: width 0.6s ease;
|
||||
background: linear-gradient(90deg, var(--view-bntColor11) 0%, var(--view-bntColor12) 100%);
|
||||
}
|
||||
.flash-sale .list .item .text .progress .piece {
|
||||
position: absolute;
|
||||
left: 8%;
|
||||
transform: translate(0%, -50%);
|
||||
top: 49%;
|
||||
font-size: 16rpx;
|
||||
color: var(--view-theme);
|
||||
}
|
||||
.flash-sale .list .item .grab {
|
||||
font-size: 28rpx;
|
||||
color: #fff;
|
||||
width: 150rpx;
|
||||
height: 54rpx;
|
||||
border-radius: 27rpx;
|
||||
text-align: center;
|
||||
line-height: 54rpx;
|
||||
position: absolute;
|
||||
right: 30rpx;
|
||||
bottom: 30rpx;
|
||||
background: #bbbbbb;
|
||||
&.b-color {
|
||||
background: var(--view-theme);
|
||||
}
|
||||
}
|
||||
.flash-sale .saleBox {
|
||||
width: 100%;
|
||||
height: 230rpx;
|
||||
background: var(--view-theme);
|
||||
border-radius: 0 0 50rpx 50rpx;
|
||||
}
|
||||
.tool-bar{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 40px;
|
||||
}
|
||||
.fixed-head{
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 20px;
|
||||
width: 100%;
|
||||
z-index: 10;
|
||||
.icon-xiangzuo {
|
||||
margin-right: 40rpx;
|
||||
margin-left: 20rpx;
|
||||
font-size: 40rpx;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
</style>
|
|
@ -1,668 +0,0 @@
|
|||
<template>
|
||||
<view :style="viewColor">
|
||||
<view class='productList'>
|
||||
<view class='search acea-row row-between-wrapper'>
|
||||
<view class="back" @click='backjJump()'>
|
||||
<view class="iconfont icon-xiangzuo"></view>
|
||||
</view>
|
||||
<view class='input acea-row row-between-wrapper'><text class='iconfont icon-sousuo'></text>
|
||||
<input placeholder='搜索店铺名称' placeholder-class='placeholder' confirm-type='search' name="search" :value='sotreParam.keyword'
|
||||
@confirm="searchSubmit"></input>
|
||||
</view>
|
||||
<view v-if="mer_location == 1" style="text-align: right;" class='iconfont search-right' @click='showMaoLocation(latitude,longitude)'>
|
||||
<view class="iconfont icon-dingwei"></view>
|
||||
<view class="right-text" v-if="recommend_address">
|
||||
{{recommend_address}}
|
||||
</view>
|
||||
<view class="iconfont icon-xiangyou" v-if="recommend_address"></view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="nav-wrapper">
|
||||
<view class='nav acea-row row-middle'>
|
||||
<view v-for="item in downMenus" :key="item.key" class='item' :class="{'font-colors':firstKey == item.key}" @click='set_where(item.key)'>
|
||||
<view>
|
||||
{{item.title}}
|
||||
</view>
|
||||
<view class="line" :class="{'font-line':firstKey == item.key}">
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 店铺 -->
|
||||
<block>
|
||||
<view class="mer-box"v-if="storeList.length > 0">
|
||||
<view class="mer-item" v-for="(item,index) in storeList" :key='index'>
|
||||
<view class="mer-hd" @click="goStore(item.mer_id)">
|
||||
<image :src="item.mini_banner?item.mini_banner:item.mer_banner"></image>
|
||||
<view class="mer-name">
|
||||
<image :src="item.mer_avatar"></image>
|
||||
<view class="">
|
||||
<view class="mer-top">
|
||||
<view class="txt line1">{{item.mer_name}}</view>
|
||||
<text v-if="item.type_name" class="font-bg-red ml8">{{item.type_name}}</text>
|
||||
<text v-else-if="item.is_trader" class="font-bg-red ml8">自营</text>
|
||||
</view>
|
||||
<view class="mer-btn">
|
||||
<view class="">
|
||||
{{item.care_count<10000 ? item.care_count : (item.care_count/10000).toFixed(2)+'万'}}人关注
|
||||
</view>
|
||||
<view class="line" v-if="item.distance"></view>
|
||||
<view class="distance" v-if="item.distance" @click.stop="showStoreLocation(item)">
|
||||
<view class="">
|
||||
{{item.distance}}
|
||||
</view>
|
||||
<view class="iconfont icon-xiangyou"></view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="pro-box">
|
||||
<navigator :url="`/pages/goods_details/index?id=${itemn.product_id}`" hover-class="none" class="pro-item" v-for="(itemn,indexn) in item.recommend"
|
||||
:key='indexn' v-if="item.recommend.length<=3">
|
||||
<image :src="itemn.image" mode=""></image>
|
||||
<view class="price">
|
||||
<text>¥</text>{{itemn.price}}
|
||||
</view>
|
||||
</navigator>
|
||||
</view>
|
||||
</view>
|
||||
<view class='loadingicon acea-row row-center-wrapper' v-if="loading">
|
||||
<text class='loading iconfont icon-jiazai' :hidden='loading==false'></text>{{loadTitle}}
|
||||
</view>
|
||||
</view>
|
||||
<view class='no-shop' v-if="!storeList.length && !loading && !loadingIcon" v-cloak>
|
||||
<view class='pictrue' style="margin: 0 auto;">
|
||||
<image src='../../../static/images/noCart.png'></image>
|
||||
<text>暂无店铺,快去搜索其他店铺吧</text>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// +----------------------------------------------------------------------
|
||||
// | CRMEB [ CRMEB赋能开发者,助力企业发展 ]
|
||||
// +----------------------------------------------------------------------
|
||||
// | Copyright (c) 2016~2021 https://www.crmeb.com All rights reserved.
|
||||
// +----------------------------------------------------------------------
|
||||
// | Licensed CRMEB并不是自由软件,未经许可不能去掉CRMEB相关版权
|
||||
// +----------------------------------------------------------------------
|
||||
// | Author: CRMEB Team <admin@crmeb.com>
|
||||
// +----------------------------------------------------------------------
|
||||
import {
|
||||
getGeocoder
|
||||
} from '@/api/store.js';
|
||||
import {
|
||||
getMerchantServiceLst,
|
||||
} from '@/api/activity.js';
|
||||
import {
|
||||
mapGetters
|
||||
} from "vuex";
|
||||
import {
|
||||
goShopDetail
|
||||
} from '@/libs/order.js'
|
||||
const app = getApp();
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
price: 0,
|
||||
stock: 0,
|
||||
nows: false,
|
||||
loading: false,
|
||||
loadingIcon: true,
|
||||
loadTitle: '加载更多',
|
||||
title: '',
|
||||
hotPage: 1,
|
||||
hotLimit: 10,
|
||||
hotScroll: false,
|
||||
// 筛选框
|
||||
rightBox: false,
|
||||
//品牌列表
|
||||
brandList: [],
|
||||
downKey: 0,
|
||||
downStatus: false,
|
||||
// 下拉菜单
|
||||
downMenu: [{
|
||||
title: '默认',
|
||||
key: 0,
|
||||
order: ""
|
||||
},
|
||||
{
|
||||
title: '销量',
|
||||
key: 1,
|
||||
order: 'sales'
|
||||
},
|
||||
{
|
||||
title: '好评',
|
||||
key: 2,
|
||||
order: 'rate'
|
||||
},
|
||||
{
|
||||
title: '距离',
|
||||
key: 3,
|
||||
order: 'location'
|
||||
}
|
||||
],
|
||||
// 是否第一个
|
||||
firstKey: 0,
|
||||
// 商铺列表
|
||||
storeList: [],
|
||||
sotreParam: {
|
||||
keyword: '',
|
||||
page: 1,
|
||||
limit: 10,
|
||||
order: '',
|
||||
},
|
||||
storeKey: 0,
|
||||
storeScroll: true,
|
||||
mer_id: '',
|
||||
sortId: '',
|
||||
hide_mer_status: "",
|
||||
price_on: '',
|
||||
price_off: '',
|
||||
detaile_address: "",
|
||||
recommend_address: "",
|
||||
latitude: "",
|
||||
longitude: "",
|
||||
count: 0,
|
||||
mer_location: "",
|
||||
};
|
||||
},
|
||||
created() {
|
||||
uni.getStorage({
|
||||
key: 'GLOBAL_DATA',
|
||||
success: (res) => {
|
||||
// console.log(res);
|
||||
this.hide_mer_status = res.data.hide_mer_status
|
||||
this.storeList = []
|
||||
if (res.data.mer_location == 1) {
|
||||
this.mer_location = res.data.mer_location
|
||||
this.selfLocation()
|
||||
} else {
|
||||
this.getServiceList();
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
},
|
||||
computed: {
|
||||
downMenus: function() {
|
||||
return this.downMenu.filter((item) => {
|
||||
if (this.mer_location) {
|
||||
return item
|
||||
} else {
|
||||
return item.key < 3
|
||||
}
|
||||
})
|
||||
},
|
||||
...mapGetters(['viewColor']),
|
||||
},
|
||||
onLoad: function(options) {
|
||||
this.mer_id = options.mer_id;
|
||||
},
|
||||
methods: {
|
||||
// 打开地图
|
||||
showMaoLocation(lat, long) {
|
||||
// console.log(lat, long)
|
||||
if (!lat || !long) return this.$util.Tips({
|
||||
title: '请设置允许商城访问您的位置!'
|
||||
});
|
||||
//#ifdef H5
|
||||
if (this.$wechat.isWeixin() === true) {
|
||||
this.$wechat.seeLocation({
|
||||
latitude: Number(lat),
|
||||
longitude: Number(long)
|
||||
}).then(res=>{
|
||||
// console.log('success');
|
||||
})
|
||||
}else{
|
||||
//#endif
|
||||
uni.openLocation({
|
||||
latitude: parseFloat(lat),
|
||||
longitude: parseFloat(long),
|
||||
scale: 8,
|
||||
success: function(res) {
|
||||
// console.log(res)
|
||||
},
|
||||
});
|
||||
// #ifdef H5
|
||||
}
|
||||
//#endif
|
||||
},
|
||||
showStoreLocation(item) {
|
||||
// console.log(lat, long)
|
||||
if (!item.lat || !item.long) return this.$util.Tips({
|
||||
title: '请设置允许商城访问您的位置!'
|
||||
});
|
||||
//#ifdef H5
|
||||
if (this.$wechat.isWeixin() === true) {
|
||||
this.$wechat.seeLocation({
|
||||
latitude: Number(item.lat),
|
||||
longitude: Number(item.long),
|
||||
name: item.mer_name,
|
||||
address: item.mer_address ? item.mer_address: '',
|
||||
}).then(res=>{
|
||||
// console.log('success');
|
||||
})
|
||||
}else{
|
||||
//#endif
|
||||
uni.openLocation({
|
||||
latitude: parseFloat(item.lat),
|
||||
longitude: parseFloat(item.long),
|
||||
scale: 8,
|
||||
name: item.mer_name,
|
||||
address: item.mer_address ? item.mer_address: '',
|
||||
success: function(res) {
|
||||
// console.log(res)
|
||||
},
|
||||
});
|
||||
// #ifdef H5
|
||||
}
|
||||
//#endif
|
||||
},
|
||||
selfLocation() {
|
||||
let self = this
|
||||
uni.getLocation({
|
||||
type: 'gcj02',
|
||||
success: (res) => {
|
||||
let latitude, longitude;
|
||||
latitude = res.latitude.toString();
|
||||
longitude = res.longitude.toString();
|
||||
this.latitude = res.latitude
|
||||
this.longitude = res.longitude
|
||||
getGeocoder({
|
||||
lat: latitude,
|
||||
long: longitude
|
||||
}).then(res => {
|
||||
// console.log(res)
|
||||
this.detaile_address = res.data.address;
|
||||
this.recommend_address = res.data.address.length > 4 ? res.data.address.slice(0,4) + '...' : res.data.address
|
||||
uni.setStorageSync('adress_location',res.data.address)
|
||||
})
|
||||
},
|
||||
fail: (res) => {
|
||||
uni.showToast({
|
||||
title: res,
|
||||
icon: 'none',
|
||||
duration: 1000
|
||||
});
|
||||
},
|
||||
complete: (res) => {
|
||||
this.getServiceList();
|
||||
}
|
||||
});
|
||||
},
|
||||
// 查找店铺
|
||||
getServiceList() {
|
||||
if (this.loading) return
|
||||
this.loading = true
|
||||
let rqData = {
|
||||
keyword: this.sotreParam.keyword,
|
||||
page: this.sotreParam.page,
|
||||
limit: 10,
|
||||
order: this.sotreParam.order,
|
||||
}
|
||||
if (this.latitude) {
|
||||
rqData.location = this.latitude + ',' + this.longitude
|
||||
}
|
||||
getMerchantServiceLst(rqData).then(res => {
|
||||
this.count = res.data.count
|
||||
this.storeList = this.storeList.concat(res.data.list)
|
||||
this.loading = false
|
||||
this.loadingIcon = false
|
||||
})
|
||||
},
|
||||
// 进店
|
||||
goStore(id) {
|
||||
if (this.hide_mer_status != 1) {
|
||||
uni.navigateTo({
|
||||
url: `/pages/store/home/index?id=${id}`
|
||||
})
|
||||
}
|
||||
},
|
||||
searchSubmit: function(e) {
|
||||
let that = this;
|
||||
that.$set(that.sotreParam, 'keyword', e.detail.value);
|
||||
this.set_where(this.firstKey)
|
||||
},
|
||||
//点击事件处理
|
||||
set_where: function(e) {
|
||||
if (this.loading) return
|
||||
// console.log(this.downMenu, e)
|
||||
this.storeList = []
|
||||
this.firstKey = e
|
||||
this.sotreParam.page = 1
|
||||
this.sotreParam.order = this.downMenu[e].order
|
||||
this.getServiceList();
|
||||
},
|
||||
backjJump() {
|
||||
uni.navigateBack({
|
||||
delta: 1
|
||||
})
|
||||
},
|
||||
},
|
||||
//刷新
|
||||
onPullDownRefresh() {
|
||||
|
||||
},
|
||||
//上划加载更多
|
||||
onReachBottom() {
|
||||
if (this.count === this.storeList.length) {
|
||||
if (this.count === 0) {
|
||||
return
|
||||
}
|
||||
uni.showToast({
|
||||
title: '已加载全部',
|
||||
icon: 'none',
|
||||
duration: 1000
|
||||
});
|
||||
} else {
|
||||
this.sotreParam.page += 1
|
||||
this.getServiceList()
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style lang="scss">
|
||||
.productList .search {
|
||||
width: 100%;
|
||||
height: 86rpx;
|
||||
padding: 0 20rpx;
|
||||
box-sizing: border-box;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: 0;
|
||||
z-index: 9;
|
||||
display: flex;
|
||||
flex-wrap: nowrap;
|
||||
background: var(--view-theme);
|
||||
.search-right {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
max-width: max-content;
|
||||
flex: 1;
|
||||
padding-left: 20rpx;
|
||||
}
|
||||
.right-text {
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
font-size: 28rpx;
|
||||
width: max-content;
|
||||
// max-width: 4.4rem;
|
||||
color: #fff;
|
||||
padding: 0 10rpx;
|
||||
}
|
||||
.icon-xiangyou,
|
||||
.icon-dingwei {
|
||||
font-size: 30rpx;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
.productList .search .back {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
width: 40rpx;
|
||||
height: 60rpx;
|
||||
|
||||
.iconfont {
|
||||
color: #fff;
|
||||
font-size: 36rpx;
|
||||
}
|
||||
}
|
||||
.productList .search .input {
|
||||
flex: 1;
|
||||
// width: 540rpx;
|
||||
height: 60rpx;
|
||||
background-color: #fff;
|
||||
border-radius: 50rpx;
|
||||
padding: 0 20rpx;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
.productList .search .input input {
|
||||
flex: 1;
|
||||
height: 100%;
|
||||
font-size: 26rpx;
|
||||
margin-left: 10rpx;
|
||||
}
|
||||
.productList .search .input .placeholder {
|
||||
color: #999;
|
||||
}
|
||||
.productList .search .input .iconfont {
|
||||
font-size: 35rpx;
|
||||
color: #555;
|
||||
}
|
||||
.productList .search .icon-pailie,
|
||||
.productList .search .icon-tupianpailie {
|
||||
color: #fff;
|
||||
width: 62rpx;
|
||||
font-size: 40rpx;
|
||||
height: 86rpx;
|
||||
line-height: 86rpx;
|
||||
}
|
||||
.productList .nav-wrapper {
|
||||
z-index: 9;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
margin-top: 86rpx;
|
||||
background-color: $theme-color;
|
||||
.tab-bar {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.tab-item {
|
||||
position: relative;
|
||||
flex: 1;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
padding: 8rpx 0 20rpx;
|
||||
color: #fff;
|
||||
font-size: 28rpx;
|
||||
font-weight: bold;
|
||||
&::after {
|
||||
content: ' ';
|
||||
position: absolute;
|
||||
left: 50%;
|
||||
bottom: 18rpx;
|
||||
width: 30rpx;
|
||||
height: 3rpx;
|
||||
background: transparent;
|
||||
transform: translateX(-50%);
|
||||
}
|
||||
&.on {
|
||||
&::after {
|
||||
background: #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.productList .nav {
|
||||
height: 86rpx;
|
||||
color: #454545;
|
||||
font-size: 28rpx;
|
||||
background-color: var(--view-theme);
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 0 28rpx;
|
||||
}
|
||||
.productList .nav .item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
flex-direction: column;
|
||||
color: #FFFFFF;
|
||||
flex: 1;
|
||||
}
|
||||
.productList .nav .item.font-colors {
|
||||
font-weight: 500;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
.productList .nav .item .font-line {
|
||||
height: 4rpx;
|
||||
background-color: #fff;
|
||||
margin-top: 3rpx;
|
||||
width: 28rpx;
|
||||
animation: line 0.3s;
|
||||
-moz-animation: line 0.3s;
|
||||
/* Firefox */
|
||||
-webkit-animation: line 0.3s;
|
||||
/* Safari 和 Chrome */
|
||||
-o-animation: line 0.3s;
|
||||
/* Opera */
|
||||
}
|
||||
@keyframes line {
|
||||
from {
|
||||
width: 0rpx;
|
||||
}
|
||||
to {
|
||||
width: 28rpx;
|
||||
}
|
||||
}
|
||||
.productList .nav .item image {
|
||||
width: 15rpx;
|
||||
height: 19rpx;
|
||||
margin-left: 10rpx;
|
||||
}
|
||||
.mer-box {
|
||||
padding: 20rpx 20rpx;
|
||||
margin-top: 168rpx;
|
||||
.mer-item {
|
||||
margin-bottom: 20rpx;
|
||||
background-color: #fff;
|
||||
border-radius: 16rpx;
|
||||
.mer-hd {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 134rpx;
|
||||
border-radius: 16rpx 16rpx 0 0;
|
||||
overflow: hidden;
|
||||
display: flex;
|
||||
image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.mer-name {
|
||||
position: absolute;
|
||||
left: 20rpx;
|
||||
top: 30rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 0 10rpx;
|
||||
image {
|
||||
width: 79rpx;
|
||||
height: 79rpx;
|
||||
border: 1px solid #fff;
|
||||
border-radius: 50%;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
.mer-top {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
color: #FFFFFF;
|
||||
font-size: 28rpx;
|
||||
font-weight: bold;
|
||||
margin-bottom: 6rpx;
|
||||
.font-bg-red {
|
||||
margin-left: 20rpx;
|
||||
font-size: 18rpx;
|
||||
padding: 2rpx 10rpx;
|
||||
border-color: var(--view-theme);
|
||||
background: #FFFFFF;
|
||||
border-radius: 30rpx;
|
||||
width: auto;
|
||||
}
|
||||
}
|
||||
.mer-btn {
|
||||
color: rgba($color: #fff, $alpha: 0.7);
|
||||
font-size: 24rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.line {
|
||||
width: 2rpx;
|
||||
height: 18rpx;
|
||||
color: rgba($color: #fff, $alpha: 0.7);
|
||||
margin: 0 12rpx;
|
||||
}
|
||||
.distance {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 24rpx;
|
||||
color: rgba($color: #fff, $alpha: 0.7);
|
||||
.iconfont {
|
||||
font-size: 24rpx;
|
||||
line-height: 24rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
.txt {
|
||||
flex: 1;
|
||||
}
|
||||
}
|
||||
}
|
||||
.pro-box {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding: 20rpx 20rpx 30rpx;
|
||||
.pro-item {
|
||||
width: 218rpx;
|
||||
margin-right: 14rpx;
|
||||
image {
|
||||
width: 100%;
|
||||
height: 214rpx;
|
||||
border-radius: 8rpx;
|
||||
}
|
||||
.price {
|
||||
margin-top: 5rpx;
|
||||
font-size: 28rpx;
|
||||
color: var(--view-priceColor);
|
||||
font-weight: bold;
|
||||
text {
|
||||
font-size: 28rpx;
|
||||
}
|
||||
}
|
||||
&:last-child {
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.more-shop {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background-color: #FFFFFF;
|
||||
padding: 27rpx 0;
|
||||
color: #999999;
|
||||
font-size: 26rpx;
|
||||
|
||||
.icon-xiangyou {
|
||||
font-size: 22rpx;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.no-shop {
|
||||
background-color: #fff;
|
||||
padding-bottom: calc(100% - 40rpx);
|
||||
padding-top: 200rpx;
|
||||
.pictrue {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
color: $uni-nothing-text;
|
||||
|
||||
image {
|
||||
width: 414rpx;
|
||||
height: 380rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
|
@ -1,295 +0,0 @@
|
|||
<template>
|
||||
<div class="main">
|
||||
<view class='flash-sale'>
|
||||
<view class='list'>
|
||||
<view v-for="(item,index) in broadcastList" :key='index' >
|
||||
<navigator hover-class="none" :url="((item.live_status == 103 && item.replay_status) || item.live_status === 101 || item.live_status === 102) ? 'plugin-private://wx2b03c6e691cd7370/pages/live-player-plugin?room_id=' + item.room_id : ''">
|
||||
<view class='item acea-row row-between-wrapper'>
|
||||
<view class="live-image">
|
||||
<img class="image" :src="item.share_img">
|
||||
<view class="live-top" :class="item.live_status == 102 ? 'playRadius' : 'notPlayRadius'" :style="'background:' + (item.live_status == 101 ? playBg : (item.live_status != 101 && item.live_status != 102) ? endBg : notBg) + ';'">
|
||||
<block v-if="item.live_status == 101">
|
||||
<image src="/static/images/live-01.png" mode=""></image>
|
||||
<text>直播中</text>
|
||||
</block>
|
||||
<block v-if="item.live_status == 103 && item.replay_status === 1">
|
||||
<image src="/static/images/live-02.png" mode=""></image>
|
||||
<text>回放</text>
|
||||
</block>
|
||||
<block v-if="(item.live_status != 101 && item.live_status != 102 && item.live_status != 103) || (item.live_status == 103 && item.replay_status == 0)">
|
||||
<image src="/static/images/live-02.png" mode=""></image>
|
||||
<text>已结束</text>
|
||||
</block>
|
||||
<block v-if="item.live_status == 102">
|
||||
<image src="/static/images/live-03.png" mode=""></image>
|
||||
<text>预告</text>
|
||||
</block>
|
||||
</view>
|
||||
<view v-if="item.live_status == 101 || item.live_status == 102" class="broadcast-time">{{ item.show_time }}</view>
|
||||
</view>
|
||||
<view class="live-wrapper">
|
||||
<view class="live-title">{{ item.name }}</view>
|
||||
<view class="live-store">{{ item.anchor_name }}</view>
|
||||
<view class="pro-count" style="white-space: nowrap; display: flex" v-if="item.broadcast.length > 0">
|
||||
<navigator hover-class="none" class="item" v-for="(itm, idx) in item.broadcast" :key="idx">
|
||||
<view class="pro-img" v-if="idx < 3">
|
||||
<image :src="itm.goods.cover_img"></image>
|
||||
<view class="price" v-if="idx < 2">¥{{itm.goods.price}}</view>
|
||||
<view v-else class="more">+{{ item.broadcast.length - 2 }}</view>
|
||||
</view>
|
||||
</navigator>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</navigator>
|
||||
</view>
|
||||
<view class='loadingicon acea-row row-center-wrapper'>
|
||||
<text class='loading iconfont icon-jiazai' :hidden='loading==false'></text>{{loadTitle}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<home></home>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// +----------------------------------------------------------------------
|
||||
// | CRMEB [ CRMEB赋能开发者,助力企业发展 ]
|
||||
// +----------------------------------------------------------------------
|
||||
// | Copyright (c) 2016~2021 https://www.crmeb.com All rights reserved.
|
||||
// +----------------------------------------------------------------------
|
||||
// | Licensed CRMEB并不是自由软件,未经许可不能去掉CRMEB相关版权
|
||||
// +----------------------------------------------------------------------
|
||||
// | Author: CRMEB Team <admin@crmeb.com>
|
||||
// +----------------------------------------------------------------------
|
||||
import {
|
||||
getBroadcastListApi
|
||||
} from '../../../api/store.js';
|
||||
import home from '@/components/home/index.vue'
|
||||
export default {
|
||||
components: {
|
||||
home
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
topImage: '',
|
||||
broadcastList: [],
|
||||
loadTitle: '加载更多',
|
||||
scrollLeft: 0,
|
||||
interval: 0,
|
||||
status: 1,
|
||||
page: 1,
|
||||
limit: 5,
|
||||
loading: false,
|
||||
loadend: false,
|
||||
pageloading: false,
|
||||
endBg: 'linear-gradient(#666666, #999999)',
|
||||
notBg: 'rgb(26, 163, 246)',
|
||||
playBg: 'linear-gradient(#FF0000, #FF5400)',
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 用户点击右上角分享
|
||||
*/
|
||||
// #ifdef MP
|
||||
onShareAppMessage: function() {
|
||||
wx.showShareMenu({
|
||||
withShareTicket: true,
|
||||
menus: ['shareAppMessage', 'shareTimeline']
|
||||
})
|
||||
return {
|
||||
title: '直播',
|
||||
path: 'pages/activity/liveBroadcast/index',
|
||||
}
|
||||
},
|
||||
onShareTimeline: function() {
|
||||
return {
|
||||
title: '直播',
|
||||
query: {
|
||||
key: ''
|
||||
},
|
||||
imageUrl: ''
|
||||
}
|
||||
},
|
||||
// #endif
|
||||
onLoad() {
|
||||
this.getBroadcastList();
|
||||
},
|
||||
methods: {
|
||||
getBroadcastList() {
|
||||
var that = this;
|
||||
var data = {
|
||||
page: that.page,
|
||||
limit: that.limit,
|
||||
};
|
||||
if (that.loadend) return;
|
||||
if (that.pageloading) return;
|
||||
this.pageloading = true
|
||||
getBroadcastListApi(data).then(res => {
|
||||
var list = res.data.list;
|
||||
var loadend = list.length < that.limit;
|
||||
that.page++;
|
||||
that.broadcastList = that.broadcastList.concat(list),
|
||||
that.page = that.page;
|
||||
that.pageloading = false;
|
||||
that.loadend = loadend;
|
||||
that.loadTitle = loadend ? '我也是有底线的' : '加载更多';
|
||||
}).catch(err => {
|
||||
that.pageloading = false
|
||||
that.loadTitle = '我也是有底线的'
|
||||
});
|
||||
},
|
||||
},
|
||||
/**
|
||||
* 页面上拉触底事件的处理函数
|
||||
*/
|
||||
onReachBottom: function() {
|
||||
this.getBroadcastList();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.main {
|
||||
padding: 0 20rpx;
|
||||
margin-top: 20rpx;
|
||||
.row-between-wrapper {
|
||||
margin-bottom: 20rpx;
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
border-radius: 18rpx;
|
||||
.live-image {
|
||||
position: relative;
|
||||
width: 355rpx;
|
||||
height: 272rpx;
|
||||
border-radius: 18rpx 0 0 18rpx;
|
||||
|
||||
.image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 18rpx 0 0 18rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.live-wrapper {
|
||||
width: 50%;
|
||||
height: 272rpx;
|
||||
padding: 20rpx;
|
||||
background: #fff;
|
||||
border-radius: 0 18rpx 18rpx 0;
|
||||
position: relative;
|
||||
|
||||
.live-title {
|
||||
font-size: 30rpx;
|
||||
color: #282828;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.live-store {
|
||||
font-size: 24rpx;
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
.pro-count {
|
||||
width: 330rpx;
|
||||
height: 100rpx;
|
||||
white-space: nowrap;
|
||||
position: absolute;
|
||||
bottom: 20rpx;
|
||||
}
|
||||
|
||||
.item {
|
||||
width: 100rpx;
|
||||
height: 100rpx;
|
||||
margin-right: 15rpx;
|
||||
border-radius: 8rpx;
|
||||
position: relative;
|
||||
.pro-img{
|
||||
width: 100rpx;
|
||||
height: 100rpx;
|
||||
}
|
||||
image {
|
||||
width: 100rpx;
|
||||
height: 100rpx;
|
||||
max-width: 100%;
|
||||
border-radius: 8rpx;
|
||||
}
|
||||
|
||||
.price {
|
||||
text-align: center;
|
||||
color: #FEFEFE;
|
||||
position: absolute;
|
||||
bottom: 4rpx;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
font-size: 22rpx;
|
||||
background: rgba(0,0,0,.5);
|
||||
border-radius: 0 0 8rpx 8rpx;
|
||||
}
|
||||
|
||||
.more {
|
||||
width: 100rpx;
|
||||
height: 100rpx;
|
||||
line-height: 100rpx;
|
||||
text-align: center;
|
||||
font-size: 28rpx;
|
||||
color: #FEFEFE;
|
||||
font-weight: bold;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
background-color: rgba(0, 0, 0, .2);
|
||||
border-radius: 8rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.live-top {
|
||||
z-index: 20;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: #fff;
|
||||
min-width: 130rpx;
|
||||
max-width: 140rpx;
|
||||
height: 50rpx;
|
||||
font-size: 22rpx;
|
||||
&.playRadius {
|
||||
border-radius: 18rpx 0px 0 0px;
|
||||
}
|
||||
|
||||
&.notPlayRadius {
|
||||
border-radius: 18rpx 0px 18rpx 0px;
|
||||
}
|
||||
image {
|
||||
width: 30rpx;
|
||||
height: 30rpx;
|
||||
margin-right: 10rpx;
|
||||
/* #ifdef H5 */
|
||||
display: block;
|
||||
/* #endif */
|
||||
}
|
||||
}
|
||||
.broadcast-time {
|
||||
z-index: 20;
|
||||
position: absolute;
|
||||
left: 120rpx;
|
||||
top: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
color: #fff;
|
||||
width: 160rpx;
|
||||
height: 50rpx;
|
||||
background: rgba(0,0,0,.4);
|
||||
font-size: 22rpx;
|
||||
border-radius: 0 0 18rpx 0;
|
||||
}
|
||||
</style>
|
|
@ -1,421 +0,0 @@
|
|||
<template>
|
||||
<view class="container" :style="viewColor">
|
||||
<view class='flash-sale'>
|
||||
<!-- #ifdef H5 -->
|
||||
<view class="fixed-head">
|
||||
<view class="sys-head" :style="{height:statusBarHeight}"></view>
|
||||
<view class="tool-bar">
|
||||
<view class='iconfont icon-xiangzuo' @tap='goBack'></view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- #endif -->
|
||||
<view class='header'>
|
||||
<image mode="widthFix" class="presellBg" :src="domain+'/static/diy/presell_title'+keyColor+'.png'" alt="">
|
||||
</view>
|
||||
<view class="main_count">
|
||||
<view class="presellList acea-row row-between-wrapper">
|
||||
<view class='timeList'>
|
||||
<block v-for="(item,index) in timeList" :key='index'>
|
||||
<view @tap='settimeList(item,index)' class='item' :class="active == index?'on':''">
|
||||
<view class='time'><text>{{item}}</text></view>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
<view class='list'>
|
||||
<block v-for="(item,index) in presellList" :key='index'>
|
||||
<view class='item acea-row row-between-wrapper' @tap='goDetails(item)'>
|
||||
<view class='pictrue'>
|
||||
<image :src='item.product.image'></image>
|
||||
</view>
|
||||
<view class='text acea-row row-column-around'>
|
||||
<view class='name line1'>{{item.store_name}}</view>
|
||||
<view class='booking'>
|
||||
<text v-if="item.presell_type != 0 && active != 0" class="count" style="color: #BFBFBF;">已预定{{item.seles ? item.seles : 0}}{{item.product.unit_name}}</text>
|
||||
<text v-else style="color: #999; font-size: 24rpx;">暂未开始</text>
|
||||
</view>
|
||||
<view v-if="item.coupon" class='coupon acea-row row-between-wrapper' style="margin-top: 14rpx;">
|
||||
<view class='hide line1 acea-row'>
|
||||
<view class='activity'>满{{item.coupon.use_min_price}}减{{item.coupon.coupon_price}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="progress" :style="'background-image:url('+domain+'/static/diy/priceBg'+keyColor+'.png'">
|
||||
<view class='presell_price'>
|
||||
<text class="presell_text">预售价</text>
|
||||
<text class="price">¥ <text>{{ item.price }}</text></text>
|
||||
</view>
|
||||
<view v-if="active != 0" class='order_btn'>{{ active === 1 ? '立即预定' : '已结束' }}</view>
|
||||
<view v-else class="unStartBtn">
|
||||
<text>开售时间</text>
|
||||
<view>{{ new Date(item.start_time.replace(/-/g,"/")).getMonth()+1 }}月
|
||||
{{ new Date(item.start_time.replace(/-/g,"/")).getDate() }}日
|
||||
{{ new Date(item.start_time.replace(/-/g,"/")).getHours()<10?'0'+
|
||||
new Date(item.start_time.replace(/-/g,"/")).getHours():new Date(item.start_time.replace(/-/g,"/")).getHours() || '00'}}:
|
||||
{{ new Date(item.start_time.replace(/-/g,"/")).getMinutes()<10?"0" + new Date(item.start_time.replace(/-/g,"/")).getMinutes():
|
||||
new Date(item.start_time.replace(/-/g,"/")).getMinutes() || '00'}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<home></home>
|
||||
<!-- #ifndef H5 -->
|
||||
<passwordPopup></passwordPopup>
|
||||
<!-- #endif -->
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// +----------------------------------------------------------------------
|
||||
// | CRMEB [ CRMEB赋能开发者,助力企业发展 ]
|
||||
// +----------------------------------------------------------------------
|
||||
// | Copyright (c) 2016~2021 https://www.crmeb.com All rights reserved.
|
||||
// +----------------------------------------------------------------------
|
||||
// | Licensed CRMEB并不是自由软件,未经许可不能去掉CRMEB相关版权
|
||||
// +----------------------------------------------------------------------
|
||||
// | Author: CRMEB Team <admin@crmeb.com>
|
||||
// +----------------------------------------------------------------------
|
||||
import {
|
||||
getSeckillIndexTime,
|
||||
getPresellList
|
||||
} from '../../../api/activity.js';
|
||||
import home from '@/components/home/index.vue'
|
||||
// #ifndef H5
|
||||
import passwordPopup from '@/components/passwordPopup';
|
||||
// #endif
|
||||
import { configMap } from "@/utils";
|
||||
import { mapGetters } from "vuex";
|
||||
import { HTTP_REQUEST_URL } from '@/config/app';
|
||||
export default {
|
||||
computed: configMap({statusBarHeight:0},mapGetters(['viewColor','keyColor'])),
|
||||
components: {
|
||||
// #ifndef H5
|
||||
passwordPopup,
|
||||
// #endif
|
||||
home
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
domain: HTTP_REQUEST_URL,
|
||||
topImage: '',
|
||||
presellList: [],
|
||||
timeList: [
|
||||
'未开始',
|
||||
'正在进行',
|
||||
'已结束'
|
||||
],
|
||||
active: 1,
|
||||
type: 0,
|
||||
scrollLeft: 0,
|
||||
interval: 0,
|
||||
status: 1,
|
||||
page: 1,
|
||||
limit: 8,
|
||||
loading: false,
|
||||
loadend: false,
|
||||
pageloading: false,
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 用户点击右上角分享
|
||||
*/
|
||||
// #ifdef MP
|
||||
onShareAppMessage: function() {
|
||||
wx.showShareMenu({
|
||||
withShareTicket: true,
|
||||
menus: ['shareAppMessage', 'shareTimeline']
|
||||
})
|
||||
return {
|
||||
title: '预售活动',
|
||||
path: 'pages/activity/presell/index',
|
||||
}
|
||||
},
|
||||
onShareTimeline: function() {
|
||||
return {
|
||||
title: '预售活动',
|
||||
query: {
|
||||
key: ''
|
||||
},
|
||||
imageUrl: ''
|
||||
}
|
||||
},
|
||||
// #endif
|
||||
onLoad() {
|
||||
this.getPresellProductList();
|
||||
},
|
||||
methods: {
|
||||
goBack: function() {
|
||||
uni.navigateBack();
|
||||
},
|
||||
getPresellProductList: function() {
|
||||
var that = this;
|
||||
var data = {
|
||||
page: that.page,
|
||||
limit: that.limit,
|
||||
type: that.active
|
||||
};
|
||||
if (that.loadend) return;
|
||||
if (that.pageloading) return;
|
||||
this.pageloading = true
|
||||
getPresellList(data).then(res => {
|
||||
// console.log(res);
|
||||
var presellList = res.data.list;
|
||||
var loadend = presellList.length < that.limit;
|
||||
that.page++;
|
||||
that.presellList = that.presellList.concat(presellList),
|
||||
that.page = that.page;
|
||||
that.pageloading = false;
|
||||
that.loadend = loadend;
|
||||
}).catch(err => {
|
||||
that.pageloading = false
|
||||
});
|
||||
},
|
||||
settimeList: function(item, index) {
|
||||
var that = this;
|
||||
that.active = index
|
||||
that.type = that.active;
|
||||
that.loadend = false;
|
||||
that.page = 1;
|
||||
that.presellList = [];
|
||||
// wxh.time(e.currentTarget.dataset.stop, that);
|
||||
that.getPresellProductList();
|
||||
},
|
||||
goDetails(item) {
|
||||
uni.navigateTo({
|
||||
url: '/pages/activity/presell_details/index?id=' + item.product_presell_id
|
||||
})
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 页面上拉触底事件的处理函数
|
||||
*/
|
||||
onReachBottom: function() {
|
||||
this.getPresellProductList();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.container {
|
||||
min-height: 100vh;
|
||||
background-color: var(--view-theme);
|
||||
}
|
||||
.noCommodity{
|
||||
border-top: none;
|
||||
}
|
||||
.flash-sale .header {
|
||||
width: 100%;
|
||||
position: relative;
|
||||
}
|
||||
.flash-sale .main_count{
|
||||
position: relative;
|
||||
top: -150rpx;
|
||||
}
|
||||
.flash-sale .header .presellBg {
|
||||
width: 750rpx;
|
||||
}
|
||||
.flash-sale .presellList {
|
||||
padding: 0 20rpx;
|
||||
bottom: 0;
|
||||
margin: 0 30rpx;
|
||||
width: 690rpx;
|
||||
background: #fff;
|
||||
border-radius: 16rpx;
|
||||
line-height: 80rpx;
|
||||
height: 80rpx;
|
||||
}
|
||||
.flash-sale .presellList .priceTag {
|
||||
width: 75rpx;
|
||||
height: 70rpx;
|
||||
}
|
||||
.flash-sale .presellList .priceTag image {
|
||||
opacity: 1;
|
||||
}
|
||||
.flash-sale .presellList .priceTag image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.flash-sale .timeList {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin: 0 auto;
|
||||
}
|
||||
.flash-sale .timeList .item {
|
||||
font-size: 20rpx;
|
||||
color: #666;
|
||||
text-align: center;
|
||||
box-sizing: border-box;
|
||||
width: 224rpx;
|
||||
}
|
||||
.flash-sale .timeList .item .time {
|
||||
font-size: 26rpx;
|
||||
color: #AAAAAA;
|
||||
}
|
||||
.flash-sale .timeList .item.on .time {
|
||||
color: var(--view-theme);
|
||||
font-weight: 700;
|
||||
span{
|
||||
position: relative;
|
||||
&::after{
|
||||
content: '';
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
height: 5rpx;
|
||||
background: var(--view-theme);
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: -8rpx;
|
||||
border-radius: 2rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
.activity {
|
||||
padding: 0 20rpx;
|
||||
border: 1px solid var(--view-theme);
|
||||
color: var(--view-theme);
|
||||
font-size: 24rpx;
|
||||
line-height: 40rpx;
|
||||
position: relative;
|
||||
}
|
||||
.activity:before {
|
||||
content: ' ';
|
||||
position: absolute;
|
||||
width: 7rpx;
|
||||
height: 10rpx;
|
||||
border-radius: 0 7rpx 7rpx 0;
|
||||
border: 1px solid var(--view-theme);
|
||||
background-color: #fff;
|
||||
bottom: 50%;
|
||||
left: -3rpx;
|
||||
margin-bottom: -6rpx;
|
||||
border-left-color: #fff;
|
||||
}
|
||||
.activity:after {
|
||||
content: ' ';
|
||||
position: absolute;
|
||||
width: 7rpx;
|
||||
height: 10rpx;
|
||||
border-radius: 7rpx 0 0 7rpx;
|
||||
border: 1px solid var(--view-theme);
|
||||
background-color: #fff;
|
||||
right: -3rpx;
|
||||
bottom: 50%;
|
||||
margin-bottom: -6rpx;
|
||||
border-right-color: #fff;
|
||||
}
|
||||
.flash-sale .list{
|
||||
margin-top: 24rpx;
|
||||
}
|
||||
.flash-sale .list .item {
|
||||
height: 278rpx;
|
||||
position: relative;
|
||||
width: 690rpx;
|
||||
margin: 0 auto 20rpx auto;
|
||||
background-color: #fff;
|
||||
border-radius: 20rpx;
|
||||
padding: 0 25rpx;
|
||||
}
|
||||
.flash-sale .list .item .pictrue {
|
||||
width: 240rpx;
|
||||
height: 240rpx;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
.flash-sale .list .item .pictrue image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
.flash-sale .list .item .text {
|
||||
width: 380rpx;
|
||||
font-size: 30rpx;
|
||||
color: #333;
|
||||
}
|
||||
.flash-sale .list .item .text .name {
|
||||
width: 100%;
|
||||
color: #282828;
|
||||
font-weight: bold;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
.flash-sale .list .item .text .booking {
|
||||
font-size: 30rpx;
|
||||
color: #E93323;
|
||||
}
|
||||
.flash-sale .list .item .text .booking .count {
|
||||
font-size: 24rpx;
|
||||
color: #E93323;
|
||||
}
|
||||
.flash-sale .list .item .text .limit {
|
||||
font-size: 22rpx;
|
||||
color: #999;
|
||||
margin-bottom: 5rpx;
|
||||
}
|
||||
.flash-sale .list .item .text .limit .limitPrice {
|
||||
margin-left: 10rpx;
|
||||
}
|
||||
.flash-sale .list .item .text .progress {
|
||||
width: 392rpx;
|
||||
height: 74rpx;
|
||||
background-size: 100%;
|
||||
margin-top: 16rpx;
|
||||
.presell_price{
|
||||
float: left;
|
||||
width: 50%;
|
||||
text-align: center;
|
||||
line-height: 15px;
|
||||
padding: 8rpx 0;
|
||||
.presell_text{
|
||||
display: block;
|
||||
color: #FF4F00;
|
||||
font-size: 20rpx;
|
||||
}
|
||||
.price{
|
||||
font-size: 26rpx;
|
||||
color: #FF4F00;
|
||||
text{
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
}
|
||||
.order_btn{
|
||||
float: left;
|
||||
width: 50%;
|
||||
text-align: center;
|
||||
color: #FFFFFF;
|
||||
font-size: 26rpx;
|
||||
line-height: 76rpx;
|
||||
}
|
||||
.unStartBtn{
|
||||
float: left;
|
||||
width: 50%;
|
||||
text-align: center;
|
||||
color: #FFFFFF;
|
||||
font-size: 20rpx;
|
||||
padding: 8rpx 0;
|
||||
text{
|
||||
font-size: 22rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
.tool-bar{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 40px;
|
||||
}
|
||||
.fixed-head{
|
||||
position: absolute;
|
||||
left: 0;
|
||||
top: 20px;
|
||||
width: 100%;
|
||||
z-index: 10;
|
||||
.icon-xiangzuo {
|
||||
margin-right: 40rpx;
|
||||
margin-left: 20rpx;
|
||||
font-size: 40rpx;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
</style>
|
|
@ -1,322 +0,0 @@
|
|||
<template>
|
||||
<view class="content">
|
||||
<view class="rank_header" :style="{ 'background-image': `url(${domain}/static/images/rank_header.png)`}">
|
||||
<view class="cate_name">
|
||||
<text class="name line1">
|
||||
<text class="title_icon icon_left" :style="{ 'background-image': `url(${domain}/static/images/rank-title.png)`}"></text>
|
||||
{{(active == 0 || !cate_name) ? '热销TOP总榜单' : `${cate_name}热卖榜`}}
|
||||
<text class="title_icon icon_right" :style="{ 'background-image': `url(${domain}/static/images/rank-title.png)`}"></text>
|
||||
</text>
|
||||
</view>
|
||||
<view class="scroll_box">
|
||||
<scroll-view scroll-x="true" style="white-space: nowrap; vertical-align: middle;" show-scrollbar="false" :scroll-into-view="scrollInto">
|
||||
<view class="scroll_item" v-for="(item,index) in categoryList" :key="item.store_category_id" :id="`cate${item.store_category_id}`"
|
||||
@click="checkActive(index,item)"
|
||||
:class="active == item.store_category_id ? 'scroll_item_active' : ''">{{item.cate_name}}
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="rank_list pad30">
|
||||
<view class='item acea-row' v-for="(item,index) in spuTopList" :key="item.spu_id" @click="godDetail(item)">
|
||||
<view class="rank" :class="'rank'+index"
|
||||
:style="{'color': index<3 ? '#CE8F21' : '#986561'}">
|
||||
{{index < 9 ? '0'+(index+1) : index+1}}
|
||||
</view>
|
||||
<view class='pictrue on'>
|
||||
<image :src='item.image' class="on"></image>
|
||||
</view>
|
||||
<view class='goods-msg pad16 acea-row row-column row-between'>
|
||||
<text class="name line2">{{item.store_name}}</text>
|
||||
<view v-if="item.sales>0" class="list"><text class="iconfont icon-goumai"></text>{{item.sales>10000 ? (item.sales/10000)+'万' : item.sales}}人买过</view>
|
||||
<view class="mt-18 acea-row row-bottom">
|
||||
<BaseMoney :money="item.price" symbolSize="26" integerSize="36" decimalSize="28"
|
||||
incolor="E93323" weight />
|
||||
<BaseMoney :money="item.ot_price" symbolSize="22" integerSize="22" decimalSize="22"
|
||||
incolor="999999" class="ml-16" line />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- -->
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { spuTop,spuTopList } from '@/api/activity.js';
|
||||
import { HTTP_REQUEST_URL } from '@/config/app';
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
categoryList: [{
|
||||
store_category_id: 0,
|
||||
cate_name: '总榜'
|
||||
}],
|
||||
cate_name: "",
|
||||
spuTopList: [],
|
||||
active: 0,
|
||||
pro_top_banner: 'https://zhongbang-1257983696.cos.ap-beijing.myqcloud.com/uploads/def/20220801/383c0026840f70a9b4e33a43c6bd3341.png',
|
||||
scrollInto: '',
|
||||
domain: HTTP_REQUEST_URL,
|
||||
}
|
||||
},
|
||||
onLoad(option) {
|
||||
this.spuTop(option.cate_id || 0)
|
||||
},
|
||||
methods: {
|
||||
spuTop(cate_id) {
|
||||
spuTop().then(res => {
|
||||
this.categoryList = [...this.categoryList, ...res.data]
|
||||
this.cate_name = this.getCate(cate_id,this.categoryList) || ''
|
||||
this.$nextTick(() => {
|
||||
this.getSpuTopList(cate_id)
|
||||
this.active = cate_id && this.cate_name ? cate_id : 0
|
||||
this.scrollInto = `cate${cate_id}`;
|
||||
});
|
||||
})
|
||||
},
|
||||
getSpuTopList(cate_id) {
|
||||
cate_id = this.cate_name ? cate_id : 0
|
||||
spuTopList({
|
||||
cate_pid: cate_id
|
||||
}).then(res => {
|
||||
this.spuTopList = res.data[0]['list']
|
||||
})
|
||||
},
|
||||
checkActive(index, item) {
|
||||
this.active = item.store_category_id;
|
||||
this.cate_name = item.cate_name
|
||||
this.spuTopList = [];
|
||||
this.getSpuTopList(item.store_category_id)
|
||||
},
|
||||
// 去商品详情页
|
||||
godDetail(item) {
|
||||
uni.navigateTo({
|
||||
url: "/pages/goods_details/index?id=" + item.product_id
|
||||
})
|
||||
},
|
||||
// 获取第一次进来的默认分类名称
|
||||
getCate(id,arr){
|
||||
for (let i = 0; i < arr.length; i++) {
|
||||
if (arr[i].store_category_id == id) {
|
||||
return arr[i]['cate_name']
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.content{
|
||||
background: #171717;
|
||||
min-height: 100vh;
|
||||
}
|
||||
.rank_header {
|
||||
background-size: cover;
|
||||
height: 270rpx;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
display: block;
|
||||
z-index: 9999;
|
||||
background-color: #171717;
|
||||
.cate_name{
|
||||
text-align: center;
|
||||
position: relative;
|
||||
top: 80rpx;
|
||||
.name{
|
||||
color: #FFE9BE;
|
||||
font-weight: bold;
|
||||
font-size: 44rpx;
|
||||
padding: 0 64rpx;
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
.title_icon{
|
||||
content: "";
|
||||
display: inline-block;
|
||||
width: 38rpx;
|
||||
height: 58rpx;
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
&.icon_left{
|
||||
left: 0;
|
||||
}
|
||||
&.icon_right{
|
||||
right: 0;
|
||||
transform: rotateY(180deg);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.header {
|
||||
position: relative;
|
||||
z-index: 6;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-right: 34rpx;
|
||||
height: 43px;
|
||||
padding-left: 33rpx;
|
||||
.head-menu {
|
||||
display: -webkit-box;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
-webkit-box-align: center;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
height: 27px;
|
||||
width: 70px;
|
||||
border-radius: 13px;
|
||||
.icon-xiangzuo {
|
||||
font-size: 32rpx;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
.iconfont {
|
||||
-webkit-box-flex: 1;
|
||||
-webkit-flex: 1;
|
||||
flex: 1;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
box-sizing: border-box;
|
||||
&.icon-xiangzuo {
|
||||
border-right: 1px solid #fff;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.head-menu {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 54rpx;
|
||||
width: 140rpx;
|
||||
background: transparent;
|
||||
border: 1px solid rgba(151, 151, 151, 0.2);
|
||||
border-radius: 27rpx;
|
||||
position: relative;
|
||||
z-index: 9999;
|
||||
&:after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
width: 1px;
|
||||
height: 26rpx;
|
||||
background-color: #EAEAEA;
|
||||
left: 50%;
|
||||
top: 50%;
|
||||
transform: translate(-50%, -50%);
|
||||
}
|
||||
.iconfont {
|
||||
flex: 1;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
}
|
||||
.scroll_box {
|
||||
width: 750rpx;
|
||||
line-height: 50rpx;
|
||||
padding-left: 32rpx;
|
||||
margin-top: 140rpx;
|
||||
}
|
||||
.scroll_item {
|
||||
display: inline-block;
|
||||
font-size: 28rpx;
|
||||
color: #6D6D6D;
|
||||
&:last-child {
|
||||
margin-right: 40rpx;
|
||||
}
|
||||
}
|
||||
.scroll_item_active {
|
||||
font-weight: 500;
|
||||
position: relative;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
&::after{
|
||||
content: "";
|
||||
display: block;
|
||||
margin: 10rpx auto 0;
|
||||
width: 80%;
|
||||
height:4rpx;
|
||||
border-radius: 2rpx;
|
||||
background: #fff;
|
||||
}
|
||||
}
|
||||
.scroll_item~.scroll_item {
|
||||
margin-left: 40rpx;
|
||||
}
|
||||
.rank_list {
|
||||
padding-top: 270rpx;
|
||||
padding-bottom: 32rpx;
|
||||
.item {
|
||||
border-radius: 16rpx;
|
||||
background: #fff;
|
||||
margin-top: 30rpx;
|
||||
padding: 28rpx 30rpx 32rpx;
|
||||
position: relative;
|
||||
.rank {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 20rpx;
|
||||
width: 50rpx;
|
||||
height: 61rpx;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
line-height: 61rpx;
|
||||
font-size: 30rpx;
|
||||
z-index: 10;
|
||||
background-size: 100% 100%;
|
||||
background-image: url('@/pages/activity/static/images/rank_num.png');
|
||||
font-family: '黑体';
|
||||
font-weight: bold;
|
||||
&.rank0,&.rank1,&.rank2{
|
||||
background-image: url('@/pages/activity/static/images/rank.png');
|
||||
}
|
||||
}
|
||||
.name {
|
||||
width: 382rpx;
|
||||
height: 76rpx;
|
||||
line-height: 38rpx;
|
||||
color: #282828;
|
||||
font-weight: 500;
|
||||
font-size: 32rpx;
|
||||
}
|
||||
}
|
||||
.mt-18 {
|
||||
margin-top: 18rpx;
|
||||
}
|
||||
.ot_price {
|
||||
font-weight: 300;
|
||||
color: #6D6D6D;
|
||||
padding-left: 16rpx;
|
||||
}
|
||||
.goods-msg {
|
||||
flex: 1;
|
||||
margin-left: 20rpx;
|
||||
.list{
|
||||
background: #FDF8EE;
|
||||
border-radius: 6rpx;
|
||||
line-height: 57rpx;
|
||||
color: #666666;
|
||||
font-size: 26rpx;
|
||||
padding: 0 12rpx;
|
||||
.iconfont{
|
||||
color: #FFB31C;
|
||||
margin-right: 12rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
.pictrue {
|
||||
width: 240rpx;
|
||||
height: 240rpx;
|
||||
position: relative;
|
||||
flex: 1;
|
||||
image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 12rpx 0 0 12rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
Before Width: | Height: | Size: 3.3 KiB |
Before Width: | Height: | Size: 7.5 KiB |
Before Width: | Height: | Size: 395 B |
Before Width: | Height: | Size: 257 B |
Before Width: | Height: | Size: 523 B |
Before Width: | Height: | Size: 257 B |
Before Width: | Height: | Size: 1.5 KiB |
|
@ -1,153 +0,0 @@
|
|||
<template>
|
||||
<view :style="viewColor" class="page-container">
|
||||
<view class='flash-sale'>
|
||||
<view class='header'>
|
||||
<image mode="widthFix" class="presellBg" :src="`${domain}/static/images/topic_bg.jpg`" alt="">
|
||||
</view>
|
||||
<view class="main_count">
|
||||
<block v-if="topicList.length>0">
|
||||
<navigator v-for="(item,index) in topicList" :key='index' :url="`/pages/activity/topic_detail/index?id=${item.group_data_id}`" hover-class="none">
|
||||
<view class='list'>
|
||||
<image :src="item.pic" class="picture"></image>
|
||||
</view>
|
||||
</navigator>
|
||||
</block>
|
||||
<block v-else>
|
||||
<view class='empty-box' v-cloak>
|
||||
<image src='../../store/static/images/no-topic.png'></image>
|
||||
<view class="txt">暂无活动专场哦~</view>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
<home></home>
|
||||
<!-- #ifndef H5 -->
|
||||
<passwordPopup></passwordPopup>
|
||||
<!-- #endif -->
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// +----------------------------------------------------------------------
|
||||
// | CRMEB [ CRMEB赋能开发者,助力企业发展 ]
|
||||
// +----------------------------------------------------------------------
|
||||
// | Copyright (c) 2016~2021 https://www.crmeb.com All rights reserved.
|
||||
// +----------------------------------------------------------------------
|
||||
// | Licensed CRMEB并不是自由软件,未经许可不能去掉CRMEB相关版权
|
||||
// +----------------------------------------------------------------------
|
||||
// | Author: CRMEB Team <admin@crmeb.com>
|
||||
// +----------------------------------------------------------------------
|
||||
import { getTopicList } from '../../../api/activity.js';
|
||||
import home from '@/components/home/index.vue'
|
||||
import emptyPage from '@/components/emptyPage.vue'
|
||||
import { mapGetters } from "vuex";
|
||||
import { HTTP_REQUEST_URL } from '@/config/app';
|
||||
// #ifndef H5
|
||||
import passwordPopup from '@/components/passwordPopup';
|
||||
// #endif
|
||||
export default {
|
||||
components: {
|
||||
// #ifndef H5
|
||||
passwordPopup,
|
||||
// #endif
|
||||
home,
|
||||
emptyPage
|
||||
},
|
||||
computed: mapGetters(['viewColor']),
|
||||
data() {
|
||||
return {
|
||||
domain: HTTP_REQUEST_URL,
|
||||
topicList: [],
|
||||
page: 1,
|
||||
limit: 30,
|
||||
loading: false,
|
||||
loadend: false,
|
||||
pageloading: false,
|
||||
}
|
||||
},
|
||||
|
||||
onLoad() {
|
||||
this.getTopicList();
|
||||
},
|
||||
methods: {
|
||||
getTopicList: function() {
|
||||
var that = this;
|
||||
var data = {
|
||||
page: that.page,
|
||||
limit: that.limit,
|
||||
};
|
||||
if (that.loadend) return;
|
||||
if (that.pageloading) return;
|
||||
this.pageloading = true
|
||||
getTopicList(0,data).then(res => {
|
||||
var topicList = res.data;
|
||||
var loadend = topicList.length < that.limit;
|
||||
that.page++;
|
||||
that.topicList = that.topicList.concat(topicList),
|
||||
that.page = that.page;
|
||||
that.pageloading = false;
|
||||
that.loadend = loadend;
|
||||
}).catch(err => {
|
||||
that.pageloading = false
|
||||
});
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 页面上拉触底事件的处理函数
|
||||
*/
|
||||
onReachBottom: function() {
|
||||
this.getTopicList();
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.page-container{
|
||||
min-height: 100vh;
|
||||
background-color: #ff5348;
|
||||
}
|
||||
.flash-sale{
|
||||
.header{
|
||||
width: 100%;
|
||||
position: relative;
|
||||
.presellBg{
|
||||
width: 750rpx;
|
||||
}
|
||||
}
|
||||
.main_count{
|
||||
position: relative;
|
||||
top: -90rpx;
|
||||
background-color: #fff;
|
||||
margin: 0 20rpx;
|
||||
border-radius: 16rpx;
|
||||
padding: 20rpx;
|
||||
.list{
|
||||
width: 100%;
|
||||
height: 280rpx;
|
||||
margin-bottom: 30rpx;
|
||||
position: relative;
|
||||
.picture{
|
||||
width: 100%;
|
||||
height: 280rpx;
|
||||
border-radius: 16rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
.empty-box{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin: 80rpx 0 120rpx 0;
|
||||
image{
|
||||
width: 414rpx;
|
||||
height: 240rpx;
|
||||
}
|
||||
.txt{
|
||||
font-size: 26rpx;
|
||||
color: #999;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
</style>
|
|
@ -1,455 +0,0 @@
|
|||
<template>
|
||||
<view :style="viewColor" class="page-container">
|
||||
<view class='topic-home' :style="'background-color: '+bgColor+''">
|
||||
<!-- #ifdef H5 -->
|
||||
<view class="header">
|
||||
<view class="head-menu">
|
||||
<view class="iconfont icon-xiangzuo" @click="goback"></view>
|
||||
<view v-if="merchant" class="iconfont merchant" @click="goStore(topicData.group_mer_id)">
|
||||
<image class="icon_merchant" :src="merchant.mer_avatar"></image>
|
||||
</view>
|
||||
<view v-else class="iconfont icon-shouye4" @click="goHome"></view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- #endif -->
|
||||
<view class="main_count">
|
||||
<view class="topic_image">
|
||||
<image :src="topicData.image" class="picture" mode="widthFix"></image>
|
||||
</view>
|
||||
<view class="main">
|
||||
<!-- 轮播 -->
|
||||
<view class="slider-wrapper" v-if="imgUrls.length>0">
|
||||
<swiper indicator-dots="true" :autoplay="autoplay" :circular="circular" :interval="interval" :duration="duration"
|
||||
indicator-color="rgba(255,255,255,0.6)" indicator-active-color="#fff">
|
||||
<block v-for="(item,index) in imgUrls" :key="index">
|
||||
<swiper-item>
|
||||
<view class='slide-navigator acea-row row-between-wrapper'>
|
||||
<image :src="item" class="slide-image"></image>
|
||||
</view>
|
||||
</swiper-item>
|
||||
</block>
|
||||
</swiper>
|
||||
</view>
|
||||
<!--商品-->
|
||||
<view class="product_list" :class="['theme'+theme, {'acea-row row-between-wrapper': (theme == 2 || theme == '')}]">
|
||||
<view class='item' v-for="(item,index) in activety_goods" :key="index" hover-class='none' @tap="goDetail(item)">
|
||||
<view class='pictrue'>
|
||||
<!-- <image class="image" :src='item.image'></image> -->
|
||||
<easy-loadimage mode="widthFix" :image-src="item.image"></easy-loadimage>
|
||||
</view>
|
||||
<view class="text">
|
||||
<view class='name line2'>
|
||||
{{item.store_name}}
|
||||
</view>
|
||||
<view class="acea-row row-middle">
|
||||
<view class='money'>¥<text class='num'>{{item.price}}</text></view>
|
||||
</view>
|
||||
<view v-if="theme != 1" class="score">{{item.rate}}评分 {{item.reply_count}}条评论</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<home></home>
|
||||
<!-- #ifndef H5 -->
|
||||
<passwordPopup></passwordPopup>
|
||||
<!-- #endif -->
|
||||
<authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// +----------------------------------------------------------------------
|
||||
// | CRMEB [ CRMEB赋能开发者,助力企业发展 ]
|
||||
// +----------------------------------------------------------------------
|
||||
// | Copyright (c) 2016~2021 https://www.crmeb.com All rights reserved.
|
||||
// +----------------------------------------------------------------------
|
||||
// | Licensed CRMEB并不是自由软件,未经许可不能去掉CRMEB相关版权
|
||||
// +----------------------------------------------------------------------
|
||||
// | Author: CRMEB Team <admin@crmeb.com>
|
||||
// +----------------------------------------------------------------------
|
||||
import {mapGetters} from "vuex";
|
||||
import {getTopicDetail,getTopicProLst,initiateAssistApi } from '../../../api/activity.js';
|
||||
import { goShopDetail } from '@/libs/order.js'
|
||||
import home from '@/components/home/index.vue'
|
||||
// #ifndef H5
|
||||
import passwordPopup from '@/components/passwordPopup';
|
||||
// #endif
|
||||
import easyLoadimage from '@/components/easy-loadimage/easy-loadimage.vue';
|
||||
import authorize from '@/components/Authorize';
|
||||
const app = getApp();
|
||||
export default {
|
||||
computed: mapGetters(['isLogin','uid','viewColor']),
|
||||
components: {
|
||||
// #ifndef H5
|
||||
passwordPopup,
|
||||
// #endif
|
||||
home,
|
||||
easyLoadimage,
|
||||
authorize
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
group_id: '',
|
||||
systemInfo: app.globalData.statusBarHeight,
|
||||
bgColor: '',
|
||||
activety_goods: [],
|
||||
page: 1,
|
||||
limit: 30,
|
||||
loading: false,
|
||||
loadend: false,
|
||||
pageloading: false,
|
||||
autoplay: true,
|
||||
circular: true,
|
||||
interval: 3000,
|
||||
duration: 500,
|
||||
theme: 1,
|
||||
topicData: {},
|
||||
imgUrls: [],
|
||||
label_id: '',
|
||||
isAuto: false, //没有授权的不会自动授权
|
||||
isShowAuth: false ,//是否隐藏授权
|
||||
merchant: {}
|
||||
}
|
||||
},
|
||||
|
||||
onLoad(options) {
|
||||
this.group_id = options.id
|
||||
this.getTopicDetail();
|
||||
|
||||
},
|
||||
methods: {
|
||||
/**
|
||||
* 授权回调
|
||||
*/
|
||||
onLoadFun: function() {
|
||||
this.isShowAuth = false;
|
||||
this.getTopicDetail();
|
||||
},
|
||||
// 授权关闭
|
||||
authColse: function(e) {
|
||||
this.isShowAuth = e
|
||||
},
|
||||
goback: function() {
|
||||
uni.navigateBack();
|
||||
},
|
||||
// 首页
|
||||
goHome() {
|
||||
uni.switchTab({
|
||||
url: '/pages/index/index'
|
||||
});
|
||||
},
|
||||
// 进入商户首页
|
||||
goStore(id){
|
||||
uni.navigateTo({
|
||||
url: `/pages/store/home/index?id=${id}`
|
||||
})
|
||||
},
|
||||
getTopicDetail(){
|
||||
let that = this;
|
||||
getTopicDetail(that.group_id).then(res => {
|
||||
that.$set(that, 'topicData', res.data)
|
||||
that.$set(that, 'theme', res.data.type)
|
||||
that.$set(that, 'bgColor', res.data.color)
|
||||
that.$set(that, 'imgUrls', res.data.banner)
|
||||
that.$set(that, 'label_id', res.data.label_id)
|
||||
that.$set(that, 'merchant', res.data.merchant)
|
||||
that.getProList()
|
||||
})
|
||||
.catch(err => {});
|
||||
},
|
||||
getProList: function() {
|
||||
var that = this;
|
||||
var data = {
|
||||
page: that.page,
|
||||
limit: that.limit,
|
||||
labels: that.label_id,
|
||||
mer_id: that.topicData.group_mer_id
|
||||
};
|
||||
if (that.loadend) return;
|
||||
if (that.pageloading) return;
|
||||
this.pageloading = true
|
||||
getTopicProLst(data).then(res => {
|
||||
// console.log(res);
|
||||
var activety_goods = res.data.list;
|
||||
var loadend = activety_goods.length < that.limit;
|
||||
that.page++;
|
||||
that.activety_goods = that.activety_goods.concat(activety_goods),
|
||||
that.page = that.page;
|
||||
that.pageloading = false;
|
||||
that.loadend = loadend;
|
||||
}).catch(err => {
|
||||
that.pageloading = false
|
||||
});
|
||||
},
|
||||
goDetail(item) {
|
||||
goShopDetail(item, this.uid).then(res => {
|
||||
if (this.isLogin) {
|
||||
initiateAssistApi(item.activity_id).then(res => {
|
||||
let id = res.data.product_assist_set_id;
|
||||
uni.hideLoading();
|
||||
uni.navigateTo({
|
||||
url: '/pages/activity/assist_detail/index?id=' + id
|
||||
});
|
||||
}).catch((err) => {
|
||||
uni.showToast({
|
||||
title: err,
|
||||
icon: 'none'
|
||||
})
|
||||
});
|
||||
} else {
|
||||
this.isAuto = true;
|
||||
this.isShowAuth = true
|
||||
}
|
||||
})
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 页面上拉触底事件的处理函数
|
||||
*/
|
||||
onReachBottom: function() {
|
||||
this.getProList()
|
||||
},
|
||||
// 滚动监听
|
||||
onPageScroll(e) {
|
||||
// 传入scrollTop值并触发所有easy-loadimage组件下的滚动监听事件
|
||||
uni.$emit('scroll');
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.header {
|
||||
position: absolute;
|
||||
z-index: 6;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-right: 34rpx;
|
||||
height: 43px;
|
||||
padding-left: 33rpx;
|
||||
.head-menu {
|
||||
display: -webkit-box;
|
||||
display: -webkit-flex;
|
||||
display: flex;
|
||||
-webkit-box-align: center;
|
||||
-webkit-align-items: center;
|
||||
align-items: center;
|
||||
height: 27px;
|
||||
width: 70px;
|
||||
background: rgba(0, 0, 0, 0.3);
|
||||
border-radius: 13px;
|
||||
.icon-xiangzuo {
|
||||
font-size: 32rpx;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
.iconfont {
|
||||
-webkit-box-flex: 1;
|
||||
-webkit-flex: 1;
|
||||
flex: 1;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
box-sizing: border-box;
|
||||
&.icon-xiangzuo {
|
||||
border-right: 1px solid #fff;
|
||||
}
|
||||
}
|
||||
.merchant{
|
||||
width: 36rpx;
|
||||
height: 36rpx;
|
||||
.icon_merchant{
|
||||
width: 36rpx;
|
||||
height: 36rpx;
|
||||
border-radius: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
.topic-home{
|
||||
position: relative;
|
||||
min-height: 100vh;
|
||||
padding-bottom: 30rpx;
|
||||
.topic_image{
|
||||
line-height: 0;
|
||||
.picture{
|
||||
width: 750rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
.main_count{
|
||||
.main{
|
||||
padding: 0 20rpx;
|
||||
}
|
||||
.slider-wrapper{
|
||||
width: 710rpx;
|
||||
height: 250rpx;
|
||||
margin: 40rpx 0;
|
||||
uni-swiper{
|
||||
height: 250rpx;
|
||||
}
|
||||
.slide-image{
|
||||
width: 710rpx;
|
||||
height: 250rpx;
|
||||
border-radius: 16rpx;
|
||||
}
|
||||
}
|
||||
.product_list{
|
||||
.item{
|
||||
background-color: #fff;
|
||||
}
|
||||
.image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 20rpx 20rpx 0 0;
|
||||
}
|
||||
.text{
|
||||
color: #222222;
|
||||
}
|
||||
.money {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
font-size: 26rpx;
|
||||
font-weight: bold;
|
||||
margin-top: 8rpx;
|
||||
color: var(--view-priceColor);
|
||||
}
|
||||
.score {
|
||||
margin-top: 10rpx;
|
||||
color: #737373;
|
||||
font-size: 20rpx;
|
||||
}
|
||||
&.theme2,&.theme{
|
||||
.item{
|
||||
position: relative;
|
||||
width: 345rpx;
|
||||
margin-bottom: 20rpx;
|
||||
border-radius: 20rpx;
|
||||
.pictrue {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 345rpx;
|
||||
}
|
||||
/deep/image,/deep/.easy-loadimage,uni-image{
|
||||
height: 345rpx;
|
||||
}
|
||||
.text {
|
||||
padding: 20rpx 17rpx 26rpx 17rpx;
|
||||
}
|
||||
.name{
|
||||
font-size: 13px;
|
||||
color: #282828;
|
||||
margin: 11px 0 5px 0;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
&.theme1{
|
||||
.item{
|
||||
display: inline-block;
|
||||
width: 225rpx;
|
||||
margin: 0 19rpx 16rpx 0;
|
||||
border-radius: 10rpx;
|
||||
&:nth-child(3n){
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
.pictrue {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 226rpx;
|
||||
.image{
|
||||
border-radius: 10rpx 10rpx 0 0;
|
||||
}
|
||||
}
|
||||
/deep/image,/deep/.easy-loadimage,uni-image{
|
||||
width: 100%;
|
||||
height: 226rpx;
|
||||
border-radius: 10rpx 10rpx 0 0;
|
||||
}
|
||||
.text{
|
||||
padding: 12rpx 14rpx 16rpx;
|
||||
.name{
|
||||
font-size: 13px;
|
||||
color: #282828;
|
||||
margin: 11px 0 5px 0;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
}
|
||||
.money {
|
||||
font-size: 22rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
&.theme2{
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
flex-wrap: wrap;
|
||||
.pictrue,/deep/image,/deep/.easy-loadimage,uni-image{
|
||||
border-radius: 20rpx 20rpx 0 0;
|
||||
}
|
||||
}
|
||||
&.theme3{
|
||||
.item{
|
||||
width: 710rpx;
|
||||
border-radius: 20rpx;
|
||||
margin-bottom: 30rpx;
|
||||
}
|
||||
.num{
|
||||
font-family: 'PingFangSC-Semibold';
|
||||
font-size: 32rpx;
|
||||
}
|
||||
.pictrue {
|
||||
position: relative;
|
||||
width: 710rpx;
|
||||
height: 710rpx;
|
||||
.image{
|
||||
border-radius: 20rpx 20rpx 0 0;
|
||||
}
|
||||
|
||||
}
|
||||
/deep/image,/deep/.easy-loadimage,uni-image{
|
||||
width: 710rpx;
|
||||
height: 710rpx;
|
||||
max-height: 710rpx;
|
||||
border-radius: 20rpx 20rpx 0 0;
|
||||
}
|
||||
.text{
|
||||
padding: 24rpx 30rpx 34rpx;
|
||||
position: relative;
|
||||
.name{
|
||||
color: #222222;
|
||||
font-size: 34rpx;
|
||||
margin-bottom: 16rpx;
|
||||
overflow:hidden;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
}
|
||||
.money{
|
||||
font-size: 22rpx;
|
||||
font-family: 'PingFangSC-Semibold';
|
||||
font-weight: bold;
|
||||
}
|
||||
.score{
|
||||
color: #737373;
|
||||
display: inline-block;
|
||||
float: right;
|
||||
position: relative;
|
||||
top: -34rpx;
|
||||
margin-top: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
|
@ -761,7 +761,7 @@
|
|||
display: inline-block;
|
||||
width: 90rpx;
|
||||
height: 30rpx;
|
||||
background: url(~pages/activity/static/images/presell_text.png);
|
||||
background: url('@/static/images/presell_text.png');
|
||||
background-size: 100%;
|
||||
color: #FD6523;
|
||||
font-size: 22rpx;
|
||||
|
|
|
@ -291,6 +291,7 @@
|
|||
this.where.status = option.types
|
||||
this.current = "";
|
||||
this.merId = option.merId;
|
||||
|
||||
this.getIndex();
|
||||
},
|
||||
methods: {
|
||||
|
@ -329,7 +330,9 @@
|
|||
// 获取数据
|
||||
getIndex() {
|
||||
|
||||
|
||||
let that = this;
|
||||
console.log(that.merId)
|
||||
if (that.loading || that.loaded) return;
|
||||
that.loading = true;
|
||||
if (that.where.status == 6) {
|
||||
|
|
|
@ -214,7 +214,7 @@
|
|||
display: inline-block;
|
||||
width: 22rpx;
|
||||
height: 30rpx;
|
||||
background-image: url('../../activity/static/images/rank_cate.png');
|
||||
background-image: url('@/static/images/rank_cate.png');
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100% 100%;
|
||||
position: absolute;
|
||||
|
@ -263,7 +263,7 @@
|
|||
font-weight: bold;
|
||||
font-size: 32rpx;
|
||||
color: #CE8F21;;
|
||||
background-image: url('../../activity/static/images/rank.png');
|
||||
background-image: url('@/static/images/rank.png');
|
||||
background-size: cover;
|
||||
font-family: '黑体';
|
||||
}
|
||||
|
@ -290,7 +290,7 @@
|
|||
font-size: 16rpx;
|
||||
font-weight: bold;
|
||||
color: #CE8F21;;
|
||||
background-image: url('../../activity/static/images/rank.png');
|
||||
background-image: url('@/static/images/rank.png');
|
||||
background-size: cover;
|
||||
font-family: '黑体';
|
||||
}
|
||||
|
|
|
@ -527,33 +527,33 @@
|
|||
switch (item.type) {
|
||||
case 1:
|
||||
uni.navigateTo({
|
||||
url: '/pages/admin/orderList/index?mer_id=' + this.userInfoData.service.mer_id +
|
||||
url: '/pages/admin/orderList/index?merId=' + this.userInfoData.service.mer_id +
|
||||
'&types=' + item.type
|
||||
})
|
||||
break;
|
||||
case 2:
|
||||
|
||||
uni.navigateTo({
|
||||
url: '/pages/admin/orderList/index?mer_id=' + this.userInfoData.service.mer_id +
|
||||
url: '/pages/admin/orderList/index?merId=' + this.userInfoData.service.mer_id +
|
||||
'&types=' + item.type
|
||||
})
|
||||
break;
|
||||
case 3:
|
||||
uni.navigateTo({
|
||||
url: '/pages/admin/orderList/index?mer_id=' + this.userInfoData.service.mer_id +
|
||||
url: '/pages/admin/orderList/index?merId=' + this.userInfoData.service.mer_id +
|
||||
'&types=' + item.type
|
||||
})
|
||||
break;
|
||||
case 4:
|
||||
uni.navigateTo({
|
||||
url: '/pages/admin/orderList/index?mer_id=' + this.userInfoData.service.mer_id +
|
||||
url: '/pages/admin/orderList/index?merId=' + this.userInfoData.service.mer_id +
|
||||
'&types=' + item.type
|
||||
|
||||
})
|
||||
break;
|
||||
case 6:
|
||||
uni.navigateTo({
|
||||
url: '/pages/admin/orderList/index?mer_id=' + this.userInfoData.service.mer_id +
|
||||
url: '/pages/admin/orderList/index?merId=' + this.userInfoData.service.mer_id +
|
||||
'&types=' + item.type
|
||||
|
||||
})
|
||||
|
|
|
@ -1,6 +1,6 @@
|
|||
<template>
|
||||
<view class="gather">
|
||||
<!-- #ifdef MP || APP-PLUS -->
|
||||
<!-- #ifdef MP || APP-PLUS -->
|
||||
|
||||
<view class="conten-top">
|
||||
<view class="" style="position: absolute;left: 30rpx;" @click="logout"><i class="iconfont icon-xiangzuo"
|
||||
|
@ -85,7 +85,7 @@
|
|||
<text class="text">保证缴纳金</text>
|
||||
</view>
|
||||
|
||||
<!-- <view class="examine"
|
||||
<view class="examine"
|
||||
@click="navigator(`/pages/commissionedSales/index/index?mer_id=${mer_id}`)">
|
||||
<image class="icon_img" src="@/static/images/index13.png" mode="aspectFit">
|
||||
</image>
|
||||
|
@ -93,10 +93,10 @@
|
|||
</view>
|
||||
<view class="examine"
|
||||
@click="navigator(`/pages/users/order_list/relase?mer_id=${mer_id}&status=-1`)">
|
||||
<image class="icon_img" src="@/static/images/index17png" mode="aspectFit">
|
||||
<image class="icon_img" src="@/static/images/index17.png" mode="aspectFit">
|
||||
</image>
|
||||
<text class="text">委托订单</text>
|
||||
</view> -->
|
||||
</view>
|
||||
<!-- <view class="examine" @click="navigator(`/pages/nongKe/teach_video/teach_video`)">
|
||||
<image class="icon_img"
|
||||
src="https://lihai001.oss-cn-chengdu.aliyuncs.com/public/kk/spjs.png" mode="aspectFit">
|
||||
|
@ -136,8 +136,7 @@
|
|||
<view class="special_work-titleb" v-if='codenote[0].status==0'>交易申请状态:待审核</view>
|
||||
</view>
|
||||
<view class="content ">
|
||||
<!-- <view class="examine"
|
||||
|
||||
<view class="examine"
|
||||
|
||||
@click="navigator(`/pages/users/supply_procurement/index?type_id=12&isDetail=1&product_type=98&cate_id=${userInfoData.mer_info.category_id}`)">
|
||||
|
||||
|
@ -148,7 +147,7 @@
|
|||
@click="navigator('/pages/users/order_list/indexCopy?status=-1&product_type=98')">
|
||||
<image class="icon_img" src="@/static/images/index5.png" mode="aspectFit"></image>
|
||||
<text class="text">进货管理</text>
|
||||
</view> -->
|
||||
</view>
|
||||
<view class="examine"
|
||||
@click="navigator(`/pages/admin/stockOut/index?mer_id=${mer_id}`)">
|
||||
<image class="icon_img" src="@/static/images/index10.png" mode="aspectFit">
|
||||
|
@ -203,9 +202,9 @@
|
|||
<text class="text">保证缴纳金</text>
|
||||
</view>
|
||||
|
||||
<!-- <view class="examine"
|
||||
<view class="examine"
|
||||
@click="navigator(`/pages/users/trading_hall/index?mer_id=${mer_id}`)">
|
||||
<image class="icon_img" src="@/static/images/diaohuo.png" mode="aspectFit">
|
||||
<image class="icon_img" src="@/static/images/index16.png" mode="aspectFit">
|
||||
</image>
|
||||
<text class="text">交易大厅</text>
|
||||
</view>
|
||||
|
@ -217,16 +216,16 @@
|
|||
</view>
|
||||
<view class="examine"
|
||||
@click="navigator(`/pages/users/order_list/relase?mer_id=${mer_id}&status=-1`)">
|
||||
<image class="icon_img" src="@/static/images/index17png" mode="aspectFit">
|
||||
<image class="icon_img" src="@/static/images/index17.png" mode="aspectFit">
|
||||
</image>
|
||||
<text class="text">委托订单</text>
|
||||
</view>
|
||||
<view class="examine"
|
||||
@click="navigator(`/pages/releaseManagement/index?mer_id=${mer_id}`)">
|
||||
<image class="icon_img" src="@/static/images/fabu.png" mode="aspectFit">
|
||||
<image class="icon_img" src="@/static/images/index15.png" mode="aspectFit">
|
||||
</image>
|
||||
<text class="text">发布管理</text>
|
||||
</view> -->
|
||||
</view>
|
||||
|
||||
<!-- <view class="examine" @click="navigator(`/pages/users/user_invoice_Finance/index?mer_id=${mer_id}`)">
|
||||
<image class="icon_img" src="@/static/images/cwgk.png" mode="aspectFit">
|
||||
|
@ -315,7 +314,7 @@
|
|||
</image>
|
||||
<text class="text">商户设置</text>
|
||||
</view>
|
||||
|
||||
|
||||
|
||||
<!-- <view class="examine" @click="navigator(`/pages/users/user_invoice_Finance/index?mer_id=${mer_id}`)">
|
||||
<image class="icon_img" src="@/static/images/cwgk.png" mode="aspectFit">
|
||||
|
@ -412,7 +411,7 @@
|
|||
<text class="text">商户设置</text>
|
||||
</view>
|
||||
|
||||
|
||||
|
||||
|
||||
</view>
|
||||
</view>
|
||||
|
@ -436,29 +435,29 @@
|
|||
<view style="margin: 20rpx 0;">机构代码:{{organization_code?organization_code:"暂无公司信息"}}</view>
|
||||
<view class="contenta">
|
||||
<jyf-parser :html="detail.mer_settlement_agree" ref="article" :tag-style="tagStyle"></jyf-parser>
|
||||
|
||||
|
||||
</view>
|
||||
<view class="setAgCountbtn">
|
||||
<button class="setAgCountbtna" @click="refuse">
|
||||
拒绝
|
||||
</button>
|
||||
|
||||
|
||||
<button :class="num>0?'setAgCountbtnb':'setAgCountbtnc'" :disabled="num!=0" @click="agree">
|
||||
<text v-if="num>0">请仔细阅读协议{{num}}S</text>
|
||||
<text v-else>同意</text>
|
||||
|
||||
|
||||
</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<uni-popup ref="popup" type="bottom">
|
||||
|
||||
|
||||
<view class="userpage">
|
||||
<view class="userpage-icon" @click="close">
|
||||
<image src="@/static/images/close.png" mode=""></image>
|
||||
</view>
|
||||
|
||||
|
||||
<form report-submit='true' style="height: 100%;">
|
||||
<view class='merchantsSettled' :style="{'height':Fheight}">
|
||||
<view class="title">填写信息</view>
|
||||
|
@ -471,8 +470,8 @@
|
|||
placeholder-class='placeholder' />
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
|
||||
|
||||
<view class="item">
|
||||
<view class="acea-row row-middle">
|
||||
<text class="item-name">联系电话:</text>
|
||||
|
@ -480,7 +479,7 @@
|
|||
@input="validateBtn" placeholder-class='placeholder' />
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
<view class="item">
|
||||
<view class="acea-row row-middle">
|
||||
<text class="item-name">开户行:</text>
|
||||
|
@ -493,7 +492,7 @@
|
|||
<text class="item-name">身份证正面:</text>
|
||||
</view>
|
||||
<view class="item-card">
|
||||
|
||||
|
||||
<view class="item-carda" @click='uploadpic({type:1})'
|
||||
v-if='merchantData.cardno_front.length==0'>
|
||||
<image src="@/static/images/SFZZ.png" mode="aspectFit"></image>
|
||||
|
@ -509,7 +508,7 @@
|
|||
<image :src="merchantData.cardno_back" mode="aspectFit"></image>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
</view>
|
||||
<view class="item">
|
||||
<view class="acea-row row-middle">
|
||||
|
@ -527,14 +526,14 @@
|
|||
v-if='merchantData.bank_back.length==0'>
|
||||
<image src="@/static/images/YHKF.png" mode="aspectFit"></image>
|
||||
</view>
|
||||
|
||||
|
||||
<view class="item-cardb" @click='DelPic({type:4})' v-else>
|
||||
<image :src="merchantData.bank_back" mode="aspectFit"></image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
|
||||
|
||||
<button class='submitBtn' :class="validate === true? 'on':''" @click="formSubmit">
|
||||
提交申请
|
||||
</button>
|
||||
|
@ -631,7 +630,7 @@
|
|||
created() {},
|
||||
onLoad() {
|
||||
this.Fheight = uni.getSystemInfoSync().windowHeight + 'px';
|
||||
console.log(this.Fheight )
|
||||
console.log(this.Fheight)
|
||||
},
|
||||
onShow() {
|
||||
if (this.isLogin) {
|
||||
|
@ -721,6 +720,11 @@
|
|||
this.isFshow = false
|
||||
}
|
||||
},
|
||||
logout(){
|
||||
uni.switchTab({
|
||||
url: '/pages/index/index'
|
||||
})
|
||||
},
|
||||
|
||||
countDown() {
|
||||
let {
|
||||
|
@ -763,6 +767,7 @@
|
|||
that.validate = false;
|
||||
}
|
||||
},
|
||||
|
||||
validateForm: function() {
|
||||
let that = this,
|
||||
value = that.merchantData;
|
||||
|
@ -845,8 +850,8 @@
|
|||
}
|
||||
|
||||
},
|
||||
|
||||
|
||||
|
||||
|
||||
//保证金缴纳
|
||||
paydecimal() {
|
||||
if (this.userInfoData.mer_info.mer_settlement_agree_status == 0) {
|
||||
|
@ -881,7 +886,7 @@
|
|||
navigator(url, t) {
|
||||
|
||||
if (this.userInfoData.mer_info.mer_settlement_agree_status == 0) {
|
||||
|
||||
|
||||
|
||||
if (this.codenote.length == 0) {
|
||||
this.isFshow = true
|
||||
|
@ -897,16 +902,16 @@
|
|||
}
|
||||
}
|
||||
} else {
|
||||
if(t=='商品管理'){
|
||||
uni.switchTab({
|
||||
url: url
|
||||
})
|
||||
}else{
|
||||
uni.navigateTo({
|
||||
url: url
|
||||
})
|
||||
}
|
||||
|
||||
if (t == '商品管理') {
|
||||
uni.switchTab({
|
||||
url: url
|
||||
})
|
||||
} else {
|
||||
uni.navigateTo({
|
||||
url: url
|
||||
})
|
||||
}
|
||||
|
||||
}
|
||||
},
|
||||
getUserInfo: function() {
|
||||
|
@ -971,6 +976,7 @@
|
|||
position: fixed;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.userpage {
|
||||
width: 100%;
|
||||
|
||||
|
|
|
@ -1,460 +0,0 @@
|
|||
<template>
|
||||
<view class="containers" :style="viewColor">
|
||||
<view class="header">
|
||||
<view class="title">
|
||||
<text :class="isActive == 0 ? 'on' : ''" @click="tabs(0)">已购</text>
|
||||
<text :class="isActive == 1 ? 'on' : ''" @click="tabs(1)">收藏</text>
|
||||
<text :class="isActive == 2 ? 'on' : ''" @click="tabs(2)">浏览</text>
|
||||
</view>
|
||||
<view class="search">
|
||||
<text class="iconfont icon-xiazai5"></text>
|
||||
<input type="text" placeholder="请输入商品名称" v-model="searchVal" @input="setValue" confirm-type="search" @confirm="searchBut()" placeholder-class='placeholder'>
|
||||
</view>
|
||||
<view class="sub_title">{{isActive == 0 ? '已购宝贝' : isActive == 1 ?'收藏宝贝' : '浏览记录'}}</view>
|
||||
<text class="iconfont icon-guanbi5" @click="close"></text>
|
||||
</view>
|
||||
<view class="main">
|
||||
<scroll-view scroll-y="true">
|
||||
<block v-if="isActive == 0">
|
||||
<view v-if="bought.length" @touchmove="onTouchmove" id="goods">
|
||||
<view class="picTxt acea-row" v-for="(item, index) in bought" :key="index">
|
||||
<view class="checkbox">
|
||||
<text v-if="item.check" @click.stop="goodsCheck(item,index)" class="iconfont icon-xuanzhong1"></text>
|
||||
<text v-else @click.stop="goodsCheck(item,index)" :class="{'disabled':disabled}" class="iconfont icon-weixuanzhong"></text>
|
||||
</view>
|
||||
<view class='pictrue'>
|
||||
<image :src='item.image'></image>
|
||||
</view>
|
||||
<view class='text'>
|
||||
<view class='line2 name'>{{item.store_name}}</view>
|
||||
<view class='money'>¥<text>{{item.price}}</text></view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-else class="empty">
|
||||
<image src="/static/images/no_thing.png"></image>
|
||||
<text>暂无内容哦~</text>
|
||||
</view>
|
||||
</block>
|
||||
<block v-if="isActive == 1">
|
||||
<view v-if="collect.length" id="collect" @touchmove="onTouchmove1">
|
||||
<view class="picTxt acea-row" v-for="(item, index) in collect" :key="index">
|
||||
<view class="checkbox">
|
||||
<text v-if="item.check" @click.stop="goodsCheck(item,index)" class="iconfont icon-xuanzhong1"></text>
|
||||
<text v-else @click.stop="goodsCheck(item,index)" :class="{'disabled':disabled}" class="iconfont icon-weixuanzhong"></text>
|
||||
</view>
|
||||
<view class='pictrue'>
|
||||
<image :src='item.image'></image>
|
||||
</view>
|
||||
<view class='text'>
|
||||
<view class='line2 name'>{{item.store_name}}</view>
|
||||
<view class='money'>¥<text>{{item.price}}</text></view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-else class="empty">
|
||||
<image src="/static/images/no_thing.png"></image>
|
||||
<text>暂无内容哦~</text>
|
||||
</view>
|
||||
</block>
|
||||
<block v-if="isActive == 2">
|
||||
<view v-if="browse.length" id="browse" @touchmove="onTouchmove2">
|
||||
<view class="picTxt acea-row" v-for="(item, index) in browse" :key="index">
|
||||
<view class="checkbox">
|
||||
<text v-if="item.check" @click.stop="goodsCheck(item,index)" class="iconfont icon-xuanzhong1"></text>
|
||||
<text v-else @click.stop="goodsCheck(item,index)" :class="{'disabled':disabled}" class="iconfont icon-weixuanzhong"></text>
|
||||
</view>
|
||||
<view class='pictrue'>
|
||||
<image :src='item.image'></image>
|
||||
</view>
|
||||
<view class='text'>
|
||||
<view class='line2 name'>{{item.store_name}}</view>
|
||||
<view class='money'>¥<text>{{item.price}}</text></view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-else class="empty">
|
||||
<image src="/static/images/no_thing.png"></image>
|
||||
<text>暂无内容哦~</text>
|
||||
</view>
|
||||
</block>
|
||||
</scroll-view>
|
||||
<view class="foot_bar">
|
||||
<button class="confirm_btn" @click="submit">确定({{checkedArr.length}})</button>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Loading from '@/components/Loading/index.vue';
|
||||
import { boughtLstApi, collectLstApi, browseLstApi } from "@/api/community";
|
||||
import { mapGetters } from "vuex";
|
||||
export default {
|
||||
props:{
|
||||
checkedObj: {
|
||||
type: Array,
|
||||
default: []
|
||||
}
|
||||
},
|
||||
computed: mapGetters(['viewColor']),
|
||||
components: { Loading },
|
||||
data() {
|
||||
return {
|
||||
isActive: 0,
|
||||
loadedb: false,
|
||||
loadingb: false,
|
||||
loadedc: false,
|
||||
loadingc: false,
|
||||
loadeds: false,
|
||||
loadings: false,
|
||||
whereb:{
|
||||
page: 1,
|
||||
limit: 10,
|
||||
keyword: '',
|
||||
},
|
||||
wherec:{
|
||||
page: 1,
|
||||
limit: 10,
|
||||
keyword: '',
|
||||
},
|
||||
wheres:{
|
||||
page: 1,
|
||||
limit: 10,
|
||||
keyword: '',
|
||||
},
|
||||
searchVal: "",
|
||||
checked: [],
|
||||
list: [],
|
||||
collect: [],
|
||||
bought: [],
|
||||
browse: [],
|
||||
checkedArr: this.checkedObj,
|
||||
disabled: false
|
||||
};
|
||||
},
|
||||
watch: {
|
||||
checkedObj:{
|
||||
handler(n){
|
||||
this.checkedArr = n
|
||||
},
|
||||
deep: true
|
||||
}
|
||||
},
|
||||
mounted(){
|
||||
this.checkedArr = this.checkedObj
|
||||
this.getBounht();
|
||||
this.getCollect();
|
||||
this.getBrowse();
|
||||
},
|
||||
methods: {
|
||||
// 点击关闭按钮
|
||||
close() {
|
||||
this.$emit('close');
|
||||
},
|
||||
tabs(index){
|
||||
this.isActive = index
|
||||
this.$set(this.whereb, 'keyword', '');
|
||||
this.$set(this.wherec, 'keyword', '');
|
||||
this.$set(this.wheres, 'keyword', '');
|
||||
this.searchVal = ''
|
||||
this.searchBut()
|
||||
},
|
||||
onTouchmove(e){
|
||||
if (this.loadendb) return;
|
||||
if (this.loadingb) return;
|
||||
const query = uni.createSelectorQuery().in(this);
|
||||
query.select('#goods').boundingClientRect(data => {
|
||||
if(data.bottom < 1500 && data.top < 0) {
|
||||
this.getBounht();
|
||||
}
|
||||
}).exec();
|
||||
// 模拟触底刷新
|
||||
},
|
||||
onTouchmove1(e){
|
||||
if (this.loadendc) return;
|
||||
if (this.loadingc) return;
|
||||
const query = uni.createSelectorQuery().in(this);
|
||||
query.select('#collect').boundingClientRect(data => {
|
||||
if(data.bottom < 1500 && data.top < 0) {
|
||||
this.getCollect();
|
||||
}
|
||||
}).exec();
|
||||
// 模拟触底刷新
|
||||
},
|
||||
onTouchmove2(e){
|
||||
if (this.loadends) return;
|
||||
if (this.loadings) return;
|
||||
const query = uni.createSelectorQuery().in(this);
|
||||
query.select('#browse').boundingClientRect(data => {
|
||||
if(data.bottom < 1500 && data.top < 0) {
|
||||
this.getBrowse();
|
||||
}
|
||||
}).exec();
|
||||
// 模拟触底刷新
|
||||
},
|
||||
setValue: function(event) {
|
||||
this.$set(this.whereb, 'keyword', event.detail.value);
|
||||
this.$set(this.wherec, 'keyword', event.detail.value);
|
||||
this.$set(this.wheres, 'keyword', event.detail.value);
|
||||
},
|
||||
searchBut(){
|
||||
this.loadingb=this.loadingc=this.loadings=this.loadedb=this.loadedc=this.loadeds = false
|
||||
this.whereb.page = this.wherec.page = this.wheres.page = 1
|
||||
this.bought = this.collect = this.browse = []
|
||||
this.isActive == 0 ? this.getBounht() : this.isActive == 1 ? this.getCollect() : this.getBrowse()
|
||||
},
|
||||
getBounht(){
|
||||
var that = this;
|
||||
if(that.loadingb || that.loadedb) return;
|
||||
that.loadingb = true;
|
||||
boughtLstApi(that.whereb).then(
|
||||
res => {
|
||||
that.loadingb = false;
|
||||
that.loadedb = res.data.list.length < that.whereb.limit;
|
||||
that.bought.push.apply(that.bought, res.data.list);
|
||||
that.whereb.page = that.whereb.page + 1;
|
||||
that.getInitchecked(that.bought);
|
||||
},
|
||||
error => {
|
||||
that.$util.Tips({
|
||||
title: error.msg
|
||||
})
|
||||
}
|
||||
);
|
||||
},
|
||||
getCollect(){
|
||||
var that = this;
|
||||
if(that.loadingc || that.loadedc) return;
|
||||
that.loadingc = true;
|
||||
collectLstApi(that.wherec).then(
|
||||
res => {
|
||||
that.loadingc = false;
|
||||
that.loadedc = res.data.list.length < that.wherec.limit;
|
||||
that.collect.push.apply(that.collect, res.data.list);
|
||||
that.wherec.page = that.wherec.page + 1;
|
||||
that.getInitchecked(that.collect);
|
||||
},
|
||||
error => {
|
||||
that.$util.Tips({
|
||||
title: error.msg
|
||||
})
|
||||
}
|
||||
);
|
||||
},
|
||||
getBrowse(){
|
||||
var that = this;
|
||||
if(that.loadings || that.loadeds) return;
|
||||
that.loadings = true;
|
||||
browseLstApi(that.wheres).then(
|
||||
res => {
|
||||
that.loadings = false;
|
||||
that.loadeds = res.data.list.length < that.wheres.limit;
|
||||
that.browse.push.apply(that.browse, res.data.list);
|
||||
that.wheres.page = that.wheres.page + 1;
|
||||
that.getInitchecked(that.browse);
|
||||
},
|
||||
error => {
|
||||
that.$util.Tips({
|
||||
title: error.msg
|
||||
})
|
||||
}
|
||||
);
|
||||
},
|
||||
/*获取初始化选中的数据*/
|
||||
getInitchecked(arr){
|
||||
let that = this;
|
||||
arr.forEach((item, index) => {
|
||||
that.$set(item, 'check', false);
|
||||
that.checkedArr.forEach((val, i) =>{
|
||||
if((item.spu_id == (val.spu&&val.spu.spu_id)) || (item.spu_id == val.spu_id)){
|
||||
that.$set(item, 'check', true);
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
/*点击选中与否*/
|
||||
goodsCheck(item,index){
|
||||
if(this.checkedArr.length > 4 && !item.check){
|
||||
return ;
|
||||
}
|
||||
this.$set(item, 'check', !item.check);
|
||||
if(item.check){
|
||||
this.checkedArr.push(item)
|
||||
}else{
|
||||
this.checkedArr.splice(this.checkedArr.findIndex(itemn => ((itemn.spu_id == item.spu_id) || (item.spu_id == (itemn.spu&&itemn.spu.spu_id)))), 1)
|
||||
}
|
||||
this.disabled = this.checkedArr.length > 4
|
||||
},
|
||||
/*确定提交*/
|
||||
submit(){
|
||||
this.$emit('getProduct',this.checkedArr);
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.containers{
|
||||
background: #ffffff;
|
||||
border-radius: 16rpx 16rpx 0 0;
|
||||
padding: 40rpx 0;
|
||||
position: relative;
|
||||
.header{
|
||||
position: relative;
|
||||
padding: 0 30rpx;
|
||||
.title{
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
text{
|
||||
position: relative;
|
||||
margin: 0 50rpx;
|
||||
color: #999999;
|
||||
font-size: 30rpx;
|
||||
&.on{
|
||||
color: #333333;
|
||||
font-weight: bold;
|
||||
font-size: 34rpx;
|
||||
&::after{
|
||||
content: "";
|
||||
display: inline-block;
|
||||
width: 40rpx;
|
||||
height: 5rpx;
|
||||
background: var(--view-theme);
|
||||
position: absolute;
|
||||
bottom: -10rpx;
|
||||
left: 10rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.search{
|
||||
margin-top: 44rpx;
|
||||
background: #F5F5F5;
|
||||
border-radius: 30rpx;
|
||||
padding: 12rpx 30rpx 12rpx 66rpx;
|
||||
position: relative;
|
||||
.iconfont{
|
||||
font-size: 24rpx;
|
||||
color: #939393;
|
||||
position: absolute;
|
||||
top: 20rpx;
|
||||
left: 30rpx;
|
||||
}
|
||||
.placeholder{
|
||||
color: #999999;
|
||||
font-size: 26rpx;
|
||||
}
|
||||
}
|
||||
.sub_title{
|
||||
color: #282828;
|
||||
font-size: 26rpx;
|
||||
margin-top: 30rpx;
|
||||
}
|
||||
.iconfont{
|
||||
color: #8A8A8A;
|
||||
font-size: 28rpx;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 30rpx;
|
||||
}
|
||||
}
|
||||
scroll-view{
|
||||
height: 650rpx;
|
||||
}
|
||||
.main{
|
||||
height: 650rpx;
|
||||
margin: 40rpx 0 80rpx;
|
||||
padding: 0 30rpx;
|
||||
}
|
||||
}
|
||||
.picTxt {
|
||||
width: 100%;
|
||||
padding: 25rpx 0;
|
||||
position: relative;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
margin-bottom: 10rpx;
|
||||
.checkbox {
|
||||
margin-right: 30rpx;
|
||||
.iconfont {
|
||||
font-size: 38rpx;
|
||||
color: #CCCCCC;
|
||||
}
|
||||
.icon-xuanzhong1 {
|
||||
color: var(--view-theme);
|
||||
}
|
||||
.disabled{
|
||||
pointer-events: none;
|
||||
cursor: default;
|
||||
opacity: 0.3;
|
||||
}
|
||||
}
|
||||
.pictrue {
|
||||
width: 160rpx;
|
||||
height: 160rpx;
|
||||
image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 8rpx;
|
||||
}
|
||||
}
|
||||
.text {
|
||||
width: 430rpx;
|
||||
margin-left: 30rpx;
|
||||
font-size: 28rpx;
|
||||
color: #282828;
|
||||
position: relative;
|
||||
height: 160rpx;
|
||||
.name{
|
||||
color: #282828;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
.money{
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
color: var(--view-priceColor);
|
||||
font-size: 22rpx;
|
||||
font-weight: bold;
|
||||
text{
|
||||
font-size: 26rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.foot_bar{
|
||||
width: 100%;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
background: #ffffff;
|
||||
padding: 20rpx 0;
|
||||
z-index: 5;
|
||||
.confirm_btn{
|
||||
width: 710rpx;
|
||||
height: 86rpx;
|
||||
line-height: 86rpx;
|
||||
color: #ffffff;
|
||||
text-align: center;
|
||||
font-size: 32rpx;
|
||||
background: var(--view-theme);
|
||||
border-radius: 43rpx;
|
||||
margin: 0 auto;
|
||||
}
|
||||
}
|
||||
.empty{
|
||||
margin: 130rpx 0 150rpx;
|
||||
text-align: center;
|
||||
image,uni-image{
|
||||
display: inline-block;
|
||||
width: 414rpx;
|
||||
height: 305rpx;
|
||||
}
|
||||
text{
|
||||
display: block;
|
||||
color: #999999;
|
||||
font-size: 26rpx;
|
||||
}
|
||||
}
|
||||
</style>
|
|
@ -1,204 +0,0 @@
|
|||
<template>
|
||||
<view class='productSort'>
|
||||
<view class="title">
|
||||
参与话题
|
||||
<text class="iconfont icon-guanbi5" @click="close"></text>
|
||||
</view>
|
||||
<view class="con-box">
|
||||
<view class='aside'>
|
||||
<scroll-view scroll-y="true" style="height: 100%; overflow: hidden;">
|
||||
<view v-for="(item,index) in productList" :key="item.category_id">
|
||||
<view v-show="item.children && item.children.length > 0" class='item acea-row row-center-wrapper' :class='index==navActive?"on":""' @click='tap(index,"b"+index)'><text class="item_text">{{item.cate_name}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
<view class='conter'>
|
||||
<scroll-view scroll-y="true" style="height: 100%; overflow: hidden;">
|
||||
<view v-for="(item,index) in childList" :key="item.topic_id">
|
||||
<view class='list' @click.stop="confirmTopic(item)">
|
||||
<view class='item acea-row'>
|
||||
<view class='picture'>
|
||||
<image :src='item.pic'></image>
|
||||
</view>
|
||||
<view class="name line1">{{item.topic_name}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// +----------------------------------------------------------------------
|
||||
// | CRMEB [ CRMEB赋能开发者,助力企业发展 ]
|
||||
// +----------------------------------------------------------------------
|
||||
// | Copyright (c) 2016~2021 https://www.crmeb.com All rights reserved.
|
||||
// +----------------------------------------------------------------------
|
||||
// | Licensed CRMEB并不是自由软件,未经许可不能去掉CRMEB相关版权
|
||||
// +----------------------------------------------------------------------
|
||||
// | Author: CRMEB Team <admin@crmeb.com>
|
||||
// +----------------------------------------------------------------------
|
||||
let app = getApp();
|
||||
import { getTopicList } from '@/api/community.js';
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
navlist: [],
|
||||
productList: [],
|
||||
navActive: 0,
|
||||
childList: []
|
||||
}
|
||||
},
|
||||
watch:{},
|
||||
mounted() {
|
||||
if (!this.productList.length) {
|
||||
this.getAllCategory();
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 点击关闭按钮
|
||||
close() {
|
||||
this.$emit('close');
|
||||
},
|
||||
tap: function(index, id) {
|
||||
this.navActive = index;
|
||||
this.childList = this.productList[index].children
|
||||
},
|
||||
getAllCategory: function() {
|
||||
let that = this;
|
||||
let value = ""
|
||||
getTopicList().then(res => {
|
||||
let arr = [
|
||||
{category_id: "",count_use: 0,count_view: 0,pic: null,topic_id: '',topic_name: "不添加任何话题"}
|
||||
]
|
||||
that.productList = res.data;
|
||||
if(that.productList[0].children && that.productList[0].children.length > 0){
|
||||
that.productList[0].children=[...arr,...that.productList[0].children]
|
||||
}else{
|
||||
that.productList[0].children = arr
|
||||
}
|
||||
that.childList = that.productList[0].children;
|
||||
})
|
||||
},
|
||||
confirmTopic(item){
|
||||
this.$emit('getTopic',item);
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped lang="scss">
|
||||
.productSort {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
height: 70vh;
|
||||
background: #ffffff;
|
||||
border-radius: 16rpx 16rpx 0 0;
|
||||
.title{
|
||||
text-align: center;
|
||||
padding: 40rpx 0;
|
||||
position: relative;
|
||||
color: #333333;
|
||||
font-size: 34rpx;
|
||||
font-weight: bold;
|
||||
.iconfont{
|
||||
color: #8A8A8A;
|
||||
font-size: 28rpx;
|
||||
position: absolute;
|
||||
right: 30rpx;
|
||||
top: 42rpx;
|
||||
font-weight: normal;
|
||||
}
|
||||
}
|
||||
.con-box {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
overflow: hidden;
|
||||
}
|
||||
}
|
||||
.productSort .aside {
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden;
|
||||
border-right: 1px solid #EEEEEE;
|
||||
width: 202rpx;
|
||||
height: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
.productSort .aside .item {
|
||||
line-height: 100rpx;
|
||||
width: 100%;
|
||||
font-size: 26rpx;
|
||||
color: #666666;
|
||||
}
|
||||
.productSort .aside .item_text {
|
||||
padding-left: 20rpx;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
}
|
||||
.productSort .aside .item.on {
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
font-weight: bold;
|
||||
color: #333333;
|
||||
}
|
||||
.productSort .conter {
|
||||
flex: 1;
|
||||
height: 100%;
|
||||
padding: 0 30rpx;
|
||||
background-color: #ffffff;
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
.productSort .conter .list {
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.productSort .conter .list .item {
|
||||
margin-top: 26rpx;
|
||||
margin-bottom: 40rpx;
|
||||
align-items: center;
|
||||
}
|
||||
.productSort .conter .list .item .picture {
|
||||
width: 88rpx;
|
||||
height: 88rpx;
|
||||
border-radius: 100%;
|
||||
position: relative;
|
||||
&::before{
|
||||
content: "#";
|
||||
display: block;
|
||||
width: 88rpx;
|
||||
height: 88rpx;
|
||||
line-height: 88rpx;
|
||||
border-radius: 100%;
|
||||
color: #ffffff;
|
||||
font-size: 40rpx;
|
||||
text-align: center;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
background: rgba(0,0,0,.3);
|
||||
}
|
||||
}
|
||||
.productSort .conter .listw:first-child .picture{
|
||||
&::before{
|
||||
content: "\\";
|
||||
background: #D8D8D8;
|
||||
}
|
||||
}
|
||||
.productSort .conter .list .item .picture image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 100%;
|
||||
}
|
||||
.productSort .conter .list .name {
|
||||
margin-left: 30rpx;
|
||||
font-size: 28rpx;
|
||||
color: #282828;
|
||||
font-weight: bold;
|
||||
max-width: 300rpx;
|
||||
}
|
||||
</style>
|
|
@ -1,381 +0,0 @@
|
|||
<template>
|
||||
<view>
|
||||
<view class="main">
|
||||
<view class="tab-cont">
|
||||
<view v-if="featuredList.length" class="follow_count">
|
||||
<block v-for="(item, index) in featuredList" :key="index">
|
||||
<view class="list_count">
|
||||
<view v-if="item.author" class="title">
|
||||
<view class="author">
|
||||
<image class="picture" :src="item.author.avatar || '/static/images/f.png'"></image>
|
||||
<text class="name">{{item.author.nickname}}</text>
|
||||
</view>
|
||||
<view @click="followAuthor(item)">
|
||||
<view v-if="!item.relevance_id" class="follow focus">
|
||||
<text class="iconfont icon-jiahao2"></text>关注
|
||||
</view>
|
||||
<view v-else class="follow focused">已关注</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="product">
|
||||
<productConSwiper :imgUrls="item.image"></productConSwiper>
|
||||
</view>
|
||||
<view class="pro_describle">
|
||||
<view class="mentioned" v-if="item.relevance.length>0" @click="openMore(item)">
|
||||
<text class="title">查看TA提到的宝贝({{item.relevance.length}})</text>
|
||||
<view class="product_more">
|
||||
<view class="item">
|
||||
<image v-for="(itemn, indexn) in item.relevance" :key="indexn" :src="(itemn.spu&&itemn.spu.image)||itemn.image" class="more_image"></image>
|
||||
</view>
|
||||
<text class="iconfont icon-gengduo3"></text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="product_info">
|
||||
<text class="text">
|
||||
{{item.content}}
|
||||
</text>
|
||||
<text class="unfold_btn">展开</text>
|
||||
</view>
|
||||
<navigator v-if="item.topic" hover-class="none" class="product_cate" :url="'/pages/plantGrass/plant_search_list/index?id='+item.topic.topic_id">
|
||||
<view>
|
||||
<text class="icon">#</text><text class="text">{{item.topic.topic_name}}</text>
|
||||
</view>
|
||||
</navigator>
|
||||
<view class="foot_bar">
|
||||
<view class="item iconfont icon-fenxiang2"></view>
|
||||
<view class="item">
|
||||
<view class="item_count" @click.stop="likeToggle(item)">
|
||||
<text class="iconfont" :class="item.relevance_id ? 'icon-shoucang1' : 'icon-dianzan'"></text>
|
||||
<text>{{item.count_start > 0 ? item.count_start : '点赞'}}</text>
|
||||
</view>
|
||||
|
||||
<view class="item_count" @click="openCommon(item,index)">
|
||||
<text class="iconfont icon-pinglun"></text>
|
||||
<text>{{item.count_reply ? item.count_reply : '评论'}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 他提到的宝贝弹窗 -->
|
||||
<uni-popup ref="mentioned" type="bottom">
|
||||
<mentioned @close="close" :list="moreList"></mentioned>
|
||||
</uni-popup>
|
||||
<!-- 评论弹窗 -->
|
||||
<comment ref="comment" :isShow="showComment" @close="close" @successFul="commentSucces"></comment>
|
||||
<authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize>
|
||||
</view>
|
||||
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// +----------------------------------------------------------------------
|
||||
// | CRMEB [ CRMEB赋能开发者,助力企业发展 ]
|
||||
// +----------------------------------------------------------------------
|
||||
// | Copyright (c) 2016~2021 https://www.crmeb.com All rights reserved.
|
||||
// +----------------------------------------------------------------------
|
||||
// | Licensed CRMEB并不是自由软件,未经许可不能去掉CRMEB相关版权
|
||||
// +----------------------------------------------------------------------
|
||||
// | Author: CRMEB Team <admin@crmeb.com>
|
||||
// +----------------------------------------------------------------------
|
||||
import WaterfallsFlow from '@/components/plantWaterfallsFlow/WaterfallsFlow.vue'
|
||||
import mentioned from '@/components/mentioned.vue';
|
||||
import comment from '@/components/comment.vue';
|
||||
import {graphicLstApi, graphicStartApi, followAuthorApi} from '@/api/community.js';
|
||||
import { getUserInfo } from '@/api/user.js';
|
||||
import { mapGetters } from "vuex";
|
||||
import authorize from '@/components/Authorize';
|
||||
import productConSwiper from '@/components/productConSwiper';
|
||||
const app = getApp();
|
||||
export default {
|
||||
components: {
|
||||
authorize,
|
||||
WaterfallsFlow,
|
||||
productConSwiper,
|
||||
mentioned,
|
||||
comment
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
featuredList: [], // 商铺商品
|
||||
moreList: [],
|
||||
commList: [], //评论列表
|
||||
loading: false,
|
||||
loaded: false,
|
||||
loadTitle: '加载更多',
|
||||
isShowAuth: false, //是否隐藏授权
|
||||
isAuto: false, //没有授权的不会自动授权
|
||||
where: {
|
||||
topic_id: '',
|
||||
page: 1,
|
||||
limit: 30
|
||||
},
|
||||
showComment: false,
|
||||
}
|
||||
},
|
||||
created() {
|
||||
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['isLogin']),
|
||||
},
|
||||
watch: {
|
||||
|
||||
},
|
||||
onLoad: function(options) {
|
||||
this.where.topic_id = options.id
|
||||
this.getList();
|
||||
},
|
||||
onShow() {
|
||||
|
||||
},
|
||||
mounted: function() {
|
||||
},
|
||||
methods: {
|
||||
// 授权回调
|
||||
onLoadFun() {
|
||||
this.isShowAuth = false
|
||||
},
|
||||
// 授权关闭
|
||||
authColse: function(e) {
|
||||
this.isShowAuth = e
|
||||
},
|
||||
// 打开授权
|
||||
authOpen: function() {
|
||||
let that = this;
|
||||
if (that.isLogin === false) {
|
||||
this.isAuto = true;
|
||||
this.isShowAuth = true;
|
||||
}
|
||||
},
|
||||
// 获取关注商品
|
||||
getList: function() {
|
||||
let that = this;
|
||||
if (that.loaded || that.loading) return;
|
||||
that.loading = true;
|
||||
that.loadTitle = '';
|
||||
graphicLstApi(that.where).then(res => {
|
||||
that.loading = false;
|
||||
let list = res.data.list;
|
||||
let featuredList = that.$util.SplitArray(list, that.featuredList);
|
||||
that.loaded = list.length < that.where.limit;
|
||||
that.loadTitle = loaded ? '已全部加载' : '加载更多';
|
||||
that.$set(that, 'featuredList', featuredList);
|
||||
that.$set(that.where, 'page', that.where.page + 1);
|
||||
}).catch(err => {
|
||||
that.loading = false;
|
||||
uni.showToast({
|
||||
title: err,
|
||||
icon: 'none'
|
||||
})
|
||||
});
|
||||
},
|
||||
likeToggle(item){
|
||||
let status = item.relevance_id ? 0 : 1
|
||||
graphicStartApi(item.community_id,{status: status}).then(res => {
|
||||
if(item.relevance_id){
|
||||
item.count_start--;
|
||||
item.count_start = item.count_start == 0 ? 0 : item.count_start
|
||||
item.relevance_id = false
|
||||
}else{
|
||||
item.count_start++;
|
||||
item.relevance_id = true
|
||||
}
|
||||
});
|
||||
},
|
||||
// 关注作者
|
||||
followAuthor: function(item) {
|
||||
let status = item.relevance_id ? 0 : 1
|
||||
followAuthorApi(item.uid,{status: status}).then(res => {
|
||||
if (res.status === 200) {
|
||||
item.relevance_id = item.relevance_id ? false : true
|
||||
}
|
||||
this.$util.Tips({
|
||||
title: res.message
|
||||
});
|
||||
});
|
||||
},
|
||||
/*查看提到的宝贝*/
|
||||
openMore(item){
|
||||
this.$refs.mentioned.open();
|
||||
this.moreList = item.relevance;
|
||||
},
|
||||
openCommon(item,index){
|
||||
this.showComment = true
|
||||
this.$refs.comment.getData(item,index);
|
||||
},
|
||||
commentSucces(index){
|
||||
this.featuredList[index]['count_reply']++
|
||||
},
|
||||
close(){
|
||||
this.$refs.mentioned.close();
|
||||
this.showComment = false;
|
||||
}
|
||||
},
|
||||
onReachBottom() {
|
||||
this.getList();
|
||||
},
|
||||
onPullDownRefresh(){
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.main{
|
||||
background: #ffffff;
|
||||
min-height: 100vh;
|
||||
}
|
||||
.tab-cont{
|
||||
background: #fff;
|
||||
border-radius: 16rpx 16rpx 0 0;
|
||||
}
|
||||
.follow_count{
|
||||
padding: 20rpx;
|
||||
.list_count{
|
||||
margin-bottom: 70rpx;
|
||||
}
|
||||
.title{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.author{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.picture, uni-image{
|
||||
width: 78rpx;
|
||||
height: 78rpx;
|
||||
border-radius: 100%;
|
||||
}
|
||||
.name{
|
||||
margin-left: 20rpx;
|
||||
color: #333333;
|
||||
font-size: 32rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
.follow{
|
||||
margin-right: 10rpx;
|
||||
width: 112rpx;
|
||||
text-align: center;
|
||||
line-height: 42rpx;
|
||||
font-size: 22rpx;
|
||||
border-radius: 33rpx;
|
||||
&.focus{
|
||||
color: #E93323;
|
||||
border: 1px solid #E93323;
|
||||
.iconfont{
|
||||
font-size: 15rpx;
|
||||
margin-right: 5rpx;
|
||||
}
|
||||
}
|
||||
&.focused{
|
||||
background: #EEEEEE;
|
||||
border: 1px solid #EEEEEE;
|
||||
color: #999999;
|
||||
}
|
||||
}
|
||||
.product{
|
||||
margin-top: 20rpx;
|
||||
border-radius: 16rpx;
|
||||
}
|
||||
}
|
||||
.pro_describle{
|
||||
.mentioned{
|
||||
padding: 20rpx 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
border-bottom: 1px solid #F5F5F5;
|
||||
.title{
|
||||
color: #666666;
|
||||
font-size: 26rpx;
|
||||
}
|
||||
}
|
||||
.product_more{
|
||||
max-width: 360rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.more_image{
|
||||
width: 58rpx;
|
||||
height: 58rpx;
|
||||
border-radius: 5rpx;
|
||||
border: 1px solid #BBBBBB;
|
||||
margin-right: 12rpx;
|
||||
}
|
||||
.iconfont{
|
||||
color: #CCCCCC;
|
||||
margin-left: 10rpx;
|
||||
}
|
||||
}
|
||||
.product_info{
|
||||
line-height: 45rpx;
|
||||
margin: 20rpx 0;
|
||||
.text{
|
||||
font-size: 28rpx;
|
||||
color: #282828;
|
||||
}
|
||||
.unfold_btn{
|
||||
margin-left: 30rpx;
|
||||
font-size: 30rpx;
|
||||
color: #282828;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
.product_cate{
|
||||
margin: 20rpx 0;
|
||||
display: inline-block;
|
||||
>view{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
background: #FFF3F2;
|
||||
border-radius: 30rpx;
|
||||
padding: 0 25rpx;
|
||||
line-height: 56rpx;
|
||||
height: 56rpx;
|
||||
color: #E93323;
|
||||
.text{
|
||||
font-size: 28rpx;
|
||||
}
|
||||
.icon{
|
||||
font-size: 35rpx;
|
||||
font-weight: bold;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
.foot_bar{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
.item{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
color: #282828;
|
||||
&.icon-fenxiang2{
|
||||
font-size: 46rpx;
|
||||
}
|
||||
}
|
||||
.item_count{
|
||||
font-size: 26rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
&:first-child{
|
||||
margin-right: 30rpx;
|
||||
}
|
||||
.iconfont{
|
||||
font-size: 40rpx;
|
||||
margin-right: 5rpx;
|
||||
}
|
||||
.icon-shoucang1{
|
||||
color: #E93323;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
|
@ -1,818 +0,0 @@
|
|||
<template>
|
||||
<view :style="viewColor">
|
||||
<form @submit="formSubmit" report-submit='true'>
|
||||
<view class="release_content">
|
||||
<!-- v-if="community_app_switch.length == 1" -->
|
||||
<view class="release_tab acea-row">
|
||||
<view class="tab_item" v-for="(item, index) in tabList" :key="item.value" :class="{on:tabActive == index}" @click="changeTab(index)">
|
||||
<text class="iconfont" :class="item.icon"></text>{{item.name}}
|
||||
</view>
|
||||
</view>
|
||||
<view>
|
||||
<view class="release_item">
|
||||
<view class="photo_count">
|
||||
<view class="input_photo acea-row row-middle">
|
||||
<block v-if="tabActive == 1">
|
||||
<view class="pictrue" v-if="formData.video_link">
|
||||
<image class="video-bg" mode="widthFix" src="../static/images/video_bg.png"></image>
|
||||
<view class="videoHover" @click="videoshow">
|
||||
<view>
|
||||
<text class="iconfont icon-24gf-play"></text>
|
||||
</view>
|
||||
</view>
|
||||
<text class="video-text">点击可预览视频</text>
|
||||
<view class="close_btn" @click="formData.video_link = ''"><text class="iconfont icon-guanbi4"></text></view>
|
||||
</view>
|
||||
<view v-else class="pictrue acea-row row-center-wrapper row-column add" @click="uploadVideo">
|
||||
<view><text class='iconfont icon-tianjiashipin'></text></view>
|
||||
<view class="text">添加视频</view>
|
||||
</view>
|
||||
<view class="pictrue acea-row row-center-wrapper row-column add" @click.stop="clk">
|
||||
<view><text class='iconfont icon-fengmian'></text></view>
|
||||
<view class="text">添加封面</view>
|
||||
</view>
|
||||
</block>
|
||||
<view class="pictrue" v-for="(item, index) in formData.image" :key="index">
|
||||
<easy-loadimage mode="widthFix" :image-src="item"></easy-loadimage>
|
||||
<text class="cover_text" v-if="tabActive == 2">封面</text>
|
||||
<view class="close_btn" @click="DelPic(index)"><text class="iconfont icon-guanbi4"></text></view>
|
||||
</view>
|
||||
<block v-if="tabActive == 0">
|
||||
<view v-if="formData.image.length < 6" class="pictrue acea-row row-center-wrapper row-column add" @click.stop="clk">
|
||||
<view><text class='iconfont icon-icon25201'></text></view>
|
||||
<view class="text">添加图片</view>
|
||||
</view>
|
||||
</block>
|
||||
<view v-if="showCd" :ratio="16/9" class="container">
|
||||
<bt-cropper ref="cropper" :imageSrc="imageSrc" @cropEnd="loadImage" :dWidth="800">
|
||||
<!-- 你想插入的内容 -->
|
||||
<button class="crop_btn" @click="crop">裁切</button>
|
||||
</bt-cropper>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="textarea">
|
||||
<textarea placeholder='分享使用体验和心得,获得更多点赞和关注哦~(600字以内)' name="comment" placeholder-class='placeholder'v-model="formData.content" maxlength="600"></textarea>
|
||||
</view>
|
||||
</view>
|
||||
<view class="release_item">
|
||||
<view class='item acea-row row-between-wrapper'>
|
||||
<view class='name'><text class="iconfont icon-baobeilianjie"></text>添加宝贝({{productList.length}})</view>
|
||||
<view class="select">
|
||||
<view class="select_count" @click.stop="addProduct">
|
||||
<text v-if="productList.length == 0" class="text">选择商品</text>
|
||||
<view v-else class="text">
|
||||
<image class="image" v-for="(item,index) in productList" :key="index" :src="item.image || (item.spu && item.spu.image)"></image>
|
||||
</view>
|
||||
<text class="iconfont icon-xiangyou"></text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class='item acea-row row-between-wrapper'>
|
||||
<view class='name'><text class="iconfont icon-canyuhuati"></text>参与话题</view>
|
||||
<view class="select">
|
||||
<view class="select_count" @click="addTopic">
|
||||
<text v-if="!topicName.topic_name"class="text">选择话题</text>
|
||||
<text v-else class="text_name" @click.stop="deleteTopic">
|
||||
<text class="icon">#</text>
|
||||
<text class="title">{{topicName.topic_name}}</text>
|
||||
<text class="iconfont icon-guanbi5"></text>
|
||||
</text>
|
||||
<text class="iconfont icon-xiangyou"></text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<button class="release_btn button" form-type="submit">发布</button>
|
||||
</view>
|
||||
</form>
|
||||
<!--视频预览弹窗-->
|
||||
<view v-if="showVideo" class="video-count">
|
||||
<!--#ifndef APP-PLUS-->
|
||||
<video id="myVideo" class="videoLink" autoplay loop muted :src="formData.video_link"></video>
|
||||
<!--#endif-->
|
||||
<!--#ifdef APP-PLUS-->
|
||||
|
||||
<video id="myVideo" class="videoLink" autoplay loop
|
||||
:src='formData.video_link && (formData.video_link.substring(0,4) == "http" || formData.video_link.substring(0,5) == "https") ? formData.video_link : "http:" + formData.video_link'
|
||||
></video>
|
||||
<!--#endif-->
|
||||
</view>
|
||||
<view class='mask' catchtouchmove="true" :hidden='showVideo==false' @tap="showVideo=false"></view>
|
||||
<avatar @upload="doUpload" @getName="getImgName" quality="1" ref="avatar" selWidth="250upx" selHeight="250upx"></avatar>
|
||||
<!-- 提到的宝贝弹窗 -->
|
||||
<uni-popup ref="associated" type="bottom">
|
||||
<associated @close="close" @getProduct="getProduct" :checkedObj="productList"></associated>
|
||||
</uni-popup>
|
||||
<!-- 话题弹窗 -->
|
||||
<uni-popup ref="participateTopic" type="bottom">
|
||||
<participate-topic @close="close" @getTopic="getTopic"></participate-topic>
|
||||
</uni-popup>
|
||||
<authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// +----------------------------------------------------------------------
|
||||
// | CRMEB [ CRMEB赋能开发者,助力企业发展 ]
|
||||
// +----------------------------------------------------------------------
|
||||
// | Copyright (c) 2016~2021 https://www.crmeb.com All rights reserved.
|
||||
// +----------------------------------------------------------------------
|
||||
// | Licensed CRMEB并不是自由软件,未经许可不能去掉CRMEB相关版权
|
||||
// +----------------------------------------------------------------------
|
||||
// | Author: CRMEB Team <admin@crmeb.com>
|
||||
// +----------------------------------------------------------------------
|
||||
import { mapGetters } from "vuex";
|
||||
import authorize from '@/components/Authorize';
|
||||
import avatar from "@/components/yq-avatar/yq-avatar.vue";
|
||||
import associated from '../components/associated.vue';
|
||||
import participateTopic from '../components/participateTopic.vue';
|
||||
import {TOKENNAME, HTTP_REQUEST_URL} from '@/config/app.js';
|
||||
import {createPlantApi, updatePlantApi, plantDetailApi, orderAssociatePlantApi} from "@/api/community";
|
||||
import { setStorage, getStorage } from '../../../libs/uniApi.js';
|
||||
import easyLoadimage from '@/components/easy-loadimage/easy-loadimage.vue';
|
||||
import { configMap } from '@/utils';
|
||||
import store from '@/store';
|
||||
export default {
|
||||
components: {
|
||||
avatar,
|
||||
associated,
|
||||
participateTopic,
|
||||
authorize,
|
||||
easyLoadimage
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
formData: {
|
||||
image: [],
|
||||
content: "",
|
||||
topic_id: "",
|
||||
spu_id: [],
|
||||
video_link: ''
|
||||
},
|
||||
imageSrc: '',
|
||||
productList: [],
|
||||
topicName: {},
|
||||
isUpload: true,
|
||||
isAuto: false, //没有授权的不会自动授权
|
||||
isShowAuth: false, //是否隐藏授权
|
||||
showCd: false,
|
||||
id: "",
|
||||
order_id: "",
|
||||
imgName: "",
|
||||
upload_max: 50,
|
||||
uploadUrl: `${HTTP_REQUEST_URL}/api/upload/video`,
|
||||
tabList: [
|
||||
{name: '图文', value: 1, icon: 'icon-tuwen'},
|
||||
{name: '视频', value: 2, icon: 'icon-shipin'},
|
||||
],
|
||||
tabActive: 1,
|
||||
isPlay: false,
|
||||
videoContext: "",
|
||||
video_link: "",
|
||||
showVideo: false,
|
||||
videoplay: false,
|
||||
videoContext: ''
|
||||
};
|
||||
},
|
||||
computed: {
|
||||
...mapGetters(['isLogin', 'viewColor', 'uid']),
|
||||
...configMap({community_app_switch: []})
|
||||
},
|
||||
watch:{},
|
||||
mounted() {
|
||||
// #ifndef APP-PLUS
|
||||
this.videoContext = uni.createVideoContext('myVideo', this);
|
||||
// #endif
|
||||
},
|
||||
onLoad(options) {
|
||||
|
||||
this.id = options.id;
|
||||
this.order_id = options.order_id;
|
||||
this.tabActive = options.type || 1;
|
||||
if(this.community_app_switch.length == 1){
|
||||
this.tabActive = this.community_app_switch[0]
|
||||
}
|
||||
if (!this.isLogin) {
|
||||
this.isAuto = true;
|
||||
this.isShowAuth = true
|
||||
}else{
|
||||
if(this.id){
|
||||
this.getDetail()
|
||||
} else {
|
||||
const data = getStorage('addPlant');
|
||||
this.tabActive = getStorage('tabActive');
|
||||
if(data){
|
||||
this.formData.content = data.content || '';
|
||||
this.formData.image = data.image || [];
|
||||
this.formData.video_link = data.video_link || ''
|
||||
}
|
||||
}
|
||||
if(this.order_id)this.getOrderGoods()
|
||||
}
|
||||
this.videoContext = uni.createVideoContext("myvideo", this);
|
||||
},
|
||||
methods: {
|
||||
onLoadFun() {
|
||||
this.isShowAuth = false;
|
||||
},
|
||||
// 授权关闭
|
||||
authColse: function(e) {
|
||||
this.isShowAuth = e;
|
||||
},
|
||||
/*获取图文详情*/
|
||||
getDetail(){
|
||||
let that = this
|
||||
plantDetailApi(that.id).then(res => {
|
||||
that.formData = res.data
|
||||
that.productList = res.data.relevance || []
|
||||
that.topicName = res.data.topic || {}
|
||||
}).catch(err => {
|
||||
return that.$util.Tips({
|
||||
title: err
|
||||
});
|
||||
})
|
||||
},
|
||||
/*获取关联订单商品*/
|
||||
getOrderGoods(){
|
||||
let that = this
|
||||
orderAssociatePlantApi(that.order_id).then(res => {
|
||||
that.productList = res.data || []
|
||||
that.formData.spu_id = res.data.map(val => val.spu_id)
|
||||
}).catch(err => {
|
||||
return that.$util.Tips({
|
||||
title: err
|
||||
});
|
||||
})
|
||||
},
|
||||
/*切换tab*/
|
||||
changeTab(index) {
|
||||
|
||||
|
||||
this.tabActive =index
|
||||
this.formData.image = []
|
||||
},
|
||||
/*删除话题*/
|
||||
deleteTopic(){
|
||||
this.formData.topic = {}
|
||||
this.topicName = {}
|
||||
},
|
||||
clk() {
|
||||
let that = this
|
||||
uni.chooseImage({
|
||||
count: 1,
|
||||
sizeType: ['original'],
|
||||
success: (res) => {
|
||||
// console.log(res)
|
||||
let tempFilePaths = res.tempFilePaths[0]
|
||||
//#ifdef APP-PLUS
|
||||
if(uni.getSystemInfoSync().platform == 'ios'){
|
||||
that.doUpload(tempFilePaths)
|
||||
}else{
|
||||
let size = res.tempFiles[0].size/1024
|
||||
if(size >= 1){
|
||||
uni.compressImage({
|
||||
src: tempFilePaths,
|
||||
quality: 80, // 仅对jpg有效
|
||||
success: res => {
|
||||
that.imageSrc = res.tempFilePath;
|
||||
that.showCd = true;
|
||||
},
|
||||
fail: err => {
|
||||
// console.log('失败了compressImage', tempFilePaths);
|
||||
that.imageSrc = tempFilePaths
|
||||
that.showCd = true
|
||||
}
|
||||
})
|
||||
}else{
|
||||
that.imageSrc = tempFilePaths
|
||||
that.showCd = true
|
||||
}
|
||||
}
|
||||
//#endif
|
||||
//#ifndef APP-PLUS
|
||||
that.imageSrc = tempFilePaths
|
||||
that.showCd = true
|
||||
//#endif
|
||||
}
|
||||
})
|
||||
},
|
||||
crop(){
|
||||
uni.showLoading({
|
||||
title: '',
|
||||
mask: true
|
||||
})
|
||||
// 通过组件定义的ref调用cropper方法,返回一个promise对象
|
||||
this.$refs.cropper.crop().then(([err,res])=>{
|
||||
if(!err){
|
||||
uni.hideLoading()
|
||||
this.doUpload(res.tempFilePath)
|
||||
}else{
|
||||
uni.hideLoading()
|
||||
// console.log(err)
|
||||
}
|
||||
})
|
||||
},
|
||||
loadImage() {
|
||||
this.showCd = false
|
||||
},
|
||||
doUpload(rsp) {
|
||||
let that = this
|
||||
uni.showLoading({
|
||||
title: '上传中',
|
||||
mask: true
|
||||
})
|
||||
uni.uploadFile({
|
||||
url: HTTP_REQUEST_URL + '/api/upload/image/field',
|
||||
filePath: rsp,
|
||||
name: 'field',
|
||||
formData: {
|
||||
'filename': rsp,
|
||||
'name': that.imgName
|
||||
},
|
||||
header: {
|
||||
// #ifdef MP
|
||||
"Content-Type": "multipart/form-data",
|
||||
// #endif
|
||||
[TOKENNAME]: 'Bearer ' + store.state.app.token
|
||||
},
|
||||
success: (uploadFileRes) => {
|
||||
let imgData = JSON.parse(uploadFileRes.data)
|
||||
if(imgData.data.path){
|
||||
that.formData.image.push(imgData.data.path)
|
||||
uni.hideLoading()
|
||||
}
|
||||
},
|
||||
complete(res) {}
|
||||
});
|
||||
},
|
||||
// 上传视频
|
||||
uploadVideo() {
|
||||
let that = this
|
||||
uni.chooseVideo({
|
||||
sourceType: ['camera', 'album'],
|
||||
success: res => {
|
||||
uni.showLoading({
|
||||
title: '视频上传中',
|
||||
});
|
||||
if (Math.ceil(res.size / 1024) < that.upload_max * 1024) {
|
||||
uni.uploadFile({
|
||||
url: that.uploadUrl, //仅为示例,非真实的接口地址
|
||||
filePath: res.tempFilePath,
|
||||
name: 'file',
|
||||
//请求参数
|
||||
formData: {
|
||||
user: 'test'
|
||||
},
|
||||
header: {
|
||||
// #ifdef MP
|
||||
'Content-Type': 'multipart/form-data',
|
||||
// #endif
|
||||
[TOKENNAME]: 'Bearer ' + store.state.app.token
|
||||
},
|
||||
success: uploadFileRes => {
|
||||
uni.hideLoading();
|
||||
let data = JSON.parse(uploadFileRes.data);
|
||||
that.formData.video_link = (data.data.src);
|
||||
},
|
||||
complete: a => {
|
||||
uni.hideLoading();
|
||||
},
|
||||
fail: function(res) {
|
||||
uni.hideLoading();
|
||||
that.Tips({
|
||||
title: res.message
|
||||
});
|
||||
}
|
||||
|
||||
});
|
||||
} else {
|
||||
uni.hideLoading();
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: `视频超出限制${that.upload_max}MB`
|
||||
});
|
||||
}
|
||||
},
|
||||
fail: err => {
|
||||
that.$util.Tips({
|
||||
title: err
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
getImgName(name){
|
||||
this.imgName = name
|
||||
},
|
||||
/**删除图片*/
|
||||
DelPic: function(index) {
|
||||
let that = this
|
||||
that.formData.image.splice(index, 1);
|
||||
},
|
||||
/*添加宝贝*/
|
||||
addProduct(){
|
||||
this.$refs.associated.open();
|
||||
},
|
||||
/*添加话题*/
|
||||
addTopic(){
|
||||
this.$refs.participateTopic.open();
|
||||
},
|
||||
close(){
|
||||
this.$refs.associated.close();
|
||||
this.$refs.participateTopic.close();
|
||||
},
|
||||
/*查看视频*/
|
||||
videoshow() {
|
||||
this.showVideo = true
|
||||
this.videoContext = uni.createVideoContext('myVideo', this);
|
||||
this.$nextTick(()=>{
|
||||
this.videoContext.play();
|
||||
})
|
||||
},
|
||||
screenChange(e) {
|
||||
let fullScreen = e.detail.fullScreen; //值true为进入全屏,false为退出全屏
|
||||
if (!fullScreen) {
|
||||
this.videoplay = false
|
||||
//退出全屏 this.videoplay = false; // 隐藏播放盒子
|
||||
}
|
||||
},
|
||||
/*获取选中的宝贝*/
|
||||
getProduct(data){
|
||||
this.productList = data;
|
||||
this.formData.spu_id = data.map(val => val.spu_id)
|
||||
this.$refs.associated.close();
|
||||
},
|
||||
/*获取选中的话题*/
|
||||
getTopic(item){
|
||||
if(!item.topic_id){
|
||||
this.topicName = {}
|
||||
}else{
|
||||
this.topicName = item
|
||||
}
|
||||
this.formData.topic_id = item.topic_id;
|
||||
this.$refs.participateTopic.close();
|
||||
},
|
||||
/**
|
||||
* 提交数据
|
||||
*/
|
||||
formSubmit: function(e) {
|
||||
let that = this;
|
||||
let value = that.formData;
|
||||
if (!that.isLogin) {
|
||||
that.isAuto = true;
|
||||
that.isShowAuth = true;
|
||||
if(!that.id){
|
||||
setTimeout(()=>{
|
||||
setStorage('addPlant', value);
|
||||
setStorage('tabActive', that.tabActive);
|
||||
});
|
||||
}
|
||||
}else{
|
||||
|
||||
if (value.image.length == 0) return that.$util.Tips({
|
||||
title: '请添加话题图片'
|
||||
});
|
||||
if (!value.content) return that.$util.Tips({
|
||||
title: '请分享使用心得和体会'
|
||||
});
|
||||
if(that.tabActive == 2 && !value.video_link){
|
||||
return that.$util.Tips({
|
||||
title: '请添加话题视频'
|
||||
});
|
||||
}
|
||||
if(that.id){
|
||||
if (value.relevance.length){
|
||||
value.spu_id = value.relevance.map(val => (val.spu&&val.spu.spu_id) || val.spu_id)
|
||||
}
|
||||
}
|
||||
value.order_id = that.order_id
|
||||
value.is_type = that.tabActive
|
||||
uni.showLoading({
|
||||
title: '保存中',
|
||||
mask: true
|
||||
})
|
||||
that.id ? updatePlantApi(that.id, value).then(res => {
|
||||
uni.hideLoading()
|
||||
that.$util.Tips({
|
||||
title: res.messge,
|
||||
icon: 'success'
|
||||
});
|
||||
if(that.tabActive == 2){
|
||||
uni.navigateTo({
|
||||
//#ifdef APP
|
||||
url: '/pages/short_video/appSwiper/index?id='+res.data.community_id+'&user=1&uid='+that.uid
|
||||
//#endif
|
||||
//#ifndef APP
|
||||
url: '/pages/short_video/nvueSwiper/index?id='+res.data.community_id+'&user=1&uid='+that.uid
|
||||
//#endif
|
||||
});
|
||||
}else{
|
||||
uni.redirectTo({
|
||||
url:'/pages/plantGrass/plant_detail/index?id='+res.data.community_id+'&type='+that.tabActive
|
||||
})
|
||||
}
|
||||
}).catch(err => {
|
||||
return that.$util.Tips({
|
||||
title: err
|
||||
});
|
||||
}) : createPlantApi(value).then(res => {
|
||||
uni.hideLoading()
|
||||
that.$util.Tips({
|
||||
title: res.messge,
|
||||
icon: 'success'
|
||||
});
|
||||
setStorage('addPlant', '');
|
||||
setStorage('tabActive',1)
|
||||
|
||||
if(that.tabActive == 2){
|
||||
uni.navigateTo({
|
||||
//#ifdef APP
|
||||
url: '/pages/short_video/appSwiper/index?id='+res.data.community_id+'&user=1&uid='+that.uid
|
||||
//#endif
|
||||
//#ifndef APP
|
||||
url: '/pages/short_video/nvueSwiper/index?id='+res.data.community_id+'&user=1&uid='+that.uid
|
||||
//#endif
|
||||
});
|
||||
}else{
|
||||
uni.redirectTo({
|
||||
url:'/pages/plantGrass/plant_detail/index?id='+res.data.community_id+'&type='+that.tabActive
|
||||
})
|
||||
}
|
||||
}).catch(err => {
|
||||
return that.$util.Tips({
|
||||
title: err
|
||||
});
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
page{
|
||||
background: #F5F5F5;
|
||||
}
|
||||
.crop_btn{
|
||||
line-height: 90rpx;
|
||||
height: 90rpx;
|
||||
height: calc(90rpx+ constant(safe-area-inset-bottom)); ///兼容 IOS<11.2/
|
||||
height: calc(90rpx + env(safe-area-inset-bottom)); ///兼容 IOS>11.2/
|
||||
}
|
||||
.container{
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 20;
|
||||
width: 750rpx;
|
||||
height:100vh;
|
||||
}
|
||||
.release_content{
|
||||
margin-top: 30rpx;
|
||||
.release_tab{
|
||||
border-radius: 16rpx 16rpx 0 0;
|
||||
border-bottom: 1rpx solid #E4E4E4;
|
||||
background: #fff;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
height: 86rpx;
|
||||
.tab_item{
|
||||
margin: 0 40rpx;
|
||||
font-size: 32rpx;
|
||||
color: #999;
|
||||
position: relative;
|
||||
line-height: 86rpx;
|
||||
cursor: pointer;
|
||||
&.on{
|
||||
color: #E93323;
|
||||
&::after{
|
||||
content: "";
|
||||
display: inline-block;
|
||||
width: 100%;
|
||||
height: 3rpx;
|
||||
background: #E93323;
|
||||
position: absolute;
|
||||
bottom: 2rpx;
|
||||
left: 0;
|
||||
}
|
||||
}
|
||||
.iconfont{
|
||||
margin-right: 10rpx;
|
||||
font-size: 32rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
padding: 0 20rpx;
|
||||
.release_item{
|
||||
background: #ffffff;
|
||||
padding: 0 30rpx;
|
||||
border-radius: 10rpx;
|
||||
}
|
||||
.photo_count{
|
||||
padding: 30rpx 0;
|
||||
}
|
||||
}
|
||||
/deep/.input_photo .easy-loadimage,/deep/.input_photo uni-image,/deep/.input_photo image{
|
||||
width: 180rpx;
|
||||
height: 180rpx;
|
||||
border-radius: 12rpx!important;
|
||||
}
|
||||
.input_photo .pictrue{
|
||||
width: 180rpx;
|
||||
height: 180rpx;
|
||||
border-radius: 12rpx!important;
|
||||
margin-right: 11rpx;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
&:nth-child(3n){
|
||||
margin-right: 0;
|
||||
}
|
||||
.close_btn{
|
||||
width: 30rpx;
|
||||
height: 30rpx;
|
||||
background: rgba(0,0,0,.6);
|
||||
border-radius: 0 12rpx 0 12rpx;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
z-index: 10;
|
||||
.iconfont{
|
||||
color: #ffffff;
|
||||
font-size: 12rpx;
|
||||
}
|
||||
}
|
||||
.cover_text{
|
||||
display: flex;
|
||||
width: 58rpx;
|
||||
height: 29rpx;
|
||||
background: #E93323;
|
||||
border-radius: 0px 12rpx 0px 12rpx;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
z-index: 10;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 18rpx;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
/deep/.loading-img{
|
||||
width: 180rpx;
|
||||
height: 180rpx;
|
||||
border-radius: 12rpx;
|
||||
}
|
||||
.input_photo .pictrue{
|
||||
margin-bottom: 20rpx;
|
||||
.videoHover{
|
||||
width: 180rpx;
|
||||
height: 180rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 10;
|
||||
>view{
|
||||
width: 50rpx;
|
||||
height: 50rpx;
|
||||
background: #000000;
|
||||
border-radius: 50rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
.iconfont{
|
||||
color: #ffffff;
|
||||
font-size: 21rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
.video-text{
|
||||
display: block;
|
||||
width: 180rpx;
|
||||
text-align: center;
|
||||
color: #ffffff;
|
||||
font-size: 18rpx;
|
||||
z-index: 13;
|
||||
position: absolute;
|
||||
bottom: 20rpx;
|
||||
}
|
||||
video{
|
||||
width: 180rpx;
|
||||
height: 180rpx;
|
||||
border-radius: 12rpx;
|
||||
}
|
||||
}
|
||||
.input_photo .add{
|
||||
background: #f6f6f6;
|
||||
color: #666666;
|
||||
.iconfont{
|
||||
font-size: 50rpx;
|
||||
}
|
||||
.text{
|
||||
margin-top: 20rpx;
|
||||
font-size: 27rpx;
|
||||
}
|
||||
}
|
||||
.textarea textarea {
|
||||
font-size: 28rpx;
|
||||
padding-bottom: 38rpx;
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
height: 400rpx;
|
||||
overflow: hidden;
|
||||
}
|
||||
.textarea .placeholder {
|
||||
color: #BBBBBB;
|
||||
}
|
||||
.release_item .item{
|
||||
height: 106rpx;
|
||||
border-bottom: 1rpx solid #eee;
|
||||
position: relative;
|
||||
font-size: 30rpx;
|
||||
&:last-child{
|
||||
border-bottom: none;
|
||||
}
|
||||
.name{
|
||||
color: #333333;
|
||||
.iconfont {
|
||||
margin-right: 10rpx;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
}
|
||||
.select{
|
||||
color: #bbbbbb;
|
||||
.select_count{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.text{
|
||||
margin-right: 15rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.image,image,uni-image{
|
||||
width: 60rpx;
|
||||
height: 60rpx;
|
||||
margin-right: 5rpx;
|
||||
}
|
||||
}
|
||||
.iconfont{
|
||||
font-size: 24rpx;
|
||||
}
|
||||
.text_name{
|
||||
color: var(--view-theme);
|
||||
padding: 5rpx 12rpx;
|
||||
background: var(--view-minorColor);
|
||||
border-radius: 23rpx;
|
||||
font-size: 24rpx;
|
||||
margin-right: 10rpx;
|
||||
.icon{
|
||||
color: var(--view-theme);
|
||||
font-weight: bold;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
.title{
|
||||
margin: 0 10rpx;
|
||||
}
|
||||
.iconfont{
|
||||
font-size: 16rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.button{
|
||||
width: 710rpx;
|
||||
height: 86rpx;
|
||||
line-height: 86rpx;
|
||||
color: #ffffff;
|
||||
text-align: center;
|
||||
font-size: 32rpx;
|
||||
background: var(--view-theme);
|
||||
border-radius: 43rpx;
|
||||
}
|
||||
.release_btn{
|
||||
margin-top: 160rpx;
|
||||
}
|
||||
.video-count{
|
||||
position: fixed;
|
||||
width: 600rpx;
|
||||
height: 500rpx;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
margin-left: -300rpx;
|
||||
margin-top: -250rpx;
|
||||
z-index: 100;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
.videoLink{
|
||||
width: 600rpx;
|
||||
height: 500rpx;
|
||||
}
|
||||
}
|
||||
</style>
|
|
@ -1,243 +0,0 @@
|
|||
<template>
|
||||
<view>
|
||||
<view class='searchGood'>
|
||||
<view class='search acea-row row-between-wrapper'>
|
||||
<view class='input acea-row row-between-wrapper'>
|
||||
<text class='iconfont icon-sousuo2'></text>
|
||||
<input type='text' :value='searchValue' :focus="focus" placeholder='请输入关键字' placeholder-class='placeholder'
|
||||
@input="setValue" confirm-type="search" @confirm="searchBut()"></input>
|
||||
</view>
|
||||
<view class='bnt' @tap='searchCancle'>取消</view>
|
||||
</view>
|
||||
<view class='title'>历史记录 <text class="iconfont icon-shanchu" @click="remove"></text></view>
|
||||
<view class='list acea-row' :style="{'height':historyBox?'auto':'150rpx'}" v-if="historyList.length > 0">
|
||||
<block v-for="(item,index) in historyList" :key="index">
|
||||
<view class='item line1' @tap='setHotSearchValue(item,0)'>{{item}}</view>
|
||||
</block>
|
||||
</view>
|
||||
<view>
|
||||
<view class="more-btn" v-if="historyList.length>9 && !historyBox" @click="historyBox = true">
|
||||
展开全部<text class="iconfont icon-xiangxia"></text>
|
||||
</view>
|
||||
<view class="more-btn" v-if="historyList.length>9 && historyBox" @click="historyBox = false">
|
||||
收起<text class="iconfont icon-xiangshang"></text>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="historyList.length == 0" style="text-align: center; color: #999;">暂无搜索历史~</view>
|
||||
<view class='title'>热门搜索</view>
|
||||
<view class='list acea-row' :style="{'height': hotSearchBox?'auto':'150rpx'}">
|
||||
<block v-for="(item,index) in hotSearchList" :key="index">
|
||||
<view class='item line1' @tap='setHotSearchValue(item,1)'>{{item.keyword}}</view>
|
||||
</block>
|
||||
</view>
|
||||
<view>
|
||||
<view class="more-btn" v-if="hotSearchList.length>8 && !hotSearchBox" @click="hotSearchBox = true">
|
||||
展开全部<text class="iconfont icon-xiangxia"></text>
|
||||
</view>
|
||||
<view class="more-btn" v-if="hotSearchList.length>8 && hotSearchBox" @click="hotSearchBox = false">
|
||||
收起<text class="iconfont icon-xiangshang"></text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// +----------------------------------------------------------------------
|
||||
// | CRMEB [ CRMEB赋能开发者,助力企业发展 ]
|
||||
// +----------------------------------------------------------------------
|
||||
// | Copyright (c) 2016~2021 https://www.crmeb.com All rights reserved.
|
||||
// +----------------------------------------------------------------------
|
||||
// | Licensed CRMEB并不是自由软件,未经许可不能去掉CRMEB相关版权
|
||||
// +----------------------------------------------------------------------
|
||||
// | Author: CRMEB Team <admin@crmeb.com>
|
||||
// +----------------------------------------------------------------------
|
||||
import { hotSearchLst } from '@/api/community.js';
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
hostProduct: [],
|
||||
searchValue: '',
|
||||
focus: true,
|
||||
hotSearchList: [],
|
||||
page: 1,
|
||||
loading: false,
|
||||
loadend: false,
|
||||
loadTitle: '加载更多',
|
||||
isScroll: true,
|
||||
// 搜索历史
|
||||
historyList: [],
|
||||
// 临时搜索列表
|
||||
tempStorage: [],
|
||||
historyBox: false,
|
||||
hotSearchBox: false,
|
||||
isAuto: false, //没有授权的不会自动授权
|
||||
isShowAuth: false, //是否隐藏授权
|
||||
};
|
||||
},
|
||||
onLoad() {
|
||||
|
||||
},
|
||||
onShow: function() {
|
||||
try {
|
||||
this.historyList = []
|
||||
this.tempStorage = []
|
||||
let arr = uni.getStorageSync('historyPlant')
|
||||
if (arr.length > 0) {
|
||||
this.historyList = arr
|
||||
} else {
|
||||
this.historyList = []
|
||||
}
|
||||
this.tempStorage = this.historyList
|
||||
} catch (e) {}
|
||||
this.getRoutineHotSearch();
|
||||
},
|
||||
methods: {
|
||||
// 清空历史记录
|
||||
remove() {
|
||||
let self = this
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '确认删除全部历史搜索记录?',
|
||||
success: function(res) {
|
||||
if (res.confirm) {
|
||||
self.tempStorage = []
|
||||
try {
|
||||
uni.setStorageSync('historyPlant', self.tempStorage)
|
||||
self.historyList = []
|
||||
} catch (e) {}
|
||||
} else if (res.cancel) {
|
||||
// console.log('用户点击取消');
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
getRoutineHotSearch: function() {
|
||||
let that = this;
|
||||
hotSearchLst().then(res => {
|
||||
that.$set(that, 'hotSearchList', res.data);
|
||||
});
|
||||
},
|
||||
setHotSearchValue: function(event, key) {
|
||||
this.focus = false
|
||||
if (key) {
|
||||
this.$set(this, 'searchValue', event.keyword);
|
||||
} else {
|
||||
this.$set(this, 'searchValue', event);
|
||||
}
|
||||
this.$nextTick(() => {
|
||||
this.focus = true
|
||||
})
|
||||
this.searchBut()
|
||||
},
|
||||
setValue: function(event) {
|
||||
this.$set(this, 'searchValue', event.detail.value);
|
||||
},
|
||||
searchBut: function() {
|
||||
let status = false
|
||||
this.tempStorage.forEach((el, index) => {
|
||||
if (el == this.searchValue) {
|
||||
status = true
|
||||
}
|
||||
})
|
||||
if (!status && this.searchValue) {
|
||||
this.tempStorage.unshift(this.searchValue)
|
||||
}
|
||||
try {
|
||||
uni.setStorageSync('historyPlant', this.tempStorage);
|
||||
} catch (e) {}
|
||||
|
||||
uni.navigateTo({
|
||||
url: '/pages/plantGrass/plant_search_list/index?searchValue=' + this.searchValue
|
||||
})
|
||||
},
|
||||
searchCancle(){
|
||||
uni.navigateBack();
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style>
|
||||
page {
|
||||
background-color: #fff;
|
||||
}
|
||||
</style>
|
||||
<style lang="scss" scoped>
|
||||
.searchGood .search {
|
||||
padding-left: 30rpx;
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
.searchGood .search .input {
|
||||
width: 598rpx;
|
||||
background-color: #f7f7f7;
|
||||
border-radius: 33rpx;
|
||||
padding: 0 35rpx;
|
||||
box-sizing: border-box;
|
||||
height: 66rpx;
|
||||
}
|
||||
.searchGood .search .input input {
|
||||
width: 472rpx;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
.searchGood .search .input .placeholder {
|
||||
color: #bbb;
|
||||
}
|
||||
.searchGood .search .input .iconfont {
|
||||
color: #000;
|
||||
font-size: 35rpx;
|
||||
}
|
||||
.searchGood .search .bnt {
|
||||
width: 120rpx;
|
||||
text-align: center;
|
||||
height: 66rpx;
|
||||
line-height: 66rpx;
|
||||
font-size: 30rpx;
|
||||
color: #282828;
|
||||
}
|
||||
.searchGood .title {
|
||||
position: relative;
|
||||
font-size: 28rpx;
|
||||
color: #282828;
|
||||
margin: 50rpx 30rpx 25rpx 30rpx;
|
||||
.icon-shanchu {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 50%;
|
||||
transform: translateY(-50%);
|
||||
color: #999;
|
||||
}
|
||||
}
|
||||
.searchGood .list {
|
||||
padding: 0 10rpx;
|
||||
overflow: hidden;
|
||||
}
|
||||
.searchGood .list .item {
|
||||
font-size: 26rpx;
|
||||
color: #666;
|
||||
padding: 0 21rpx;
|
||||
height: 60rpx;
|
||||
background: rgba(242, 242, 242, 1);
|
||||
border-radius: 22rpx;
|
||||
line-height: 60rpx;
|
||||
margin: 0 0 20rpx 20rpx;
|
||||
max-width: 150rpx;
|
||||
}
|
||||
.searchGood .line {
|
||||
border-bottom: 1rpx solid #eee;
|
||||
margin: 20rpx 30rpx 0 30rpx;
|
||||
}
|
||||
.more-btn {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin: 0 0 20rpx 20rpx;
|
||||
height: 60rpx;
|
||||
font-size: 24rpx;
|
||||
color: #999;
|
||||
.iconfont {
|
||||
font-size: 22rpx;
|
||||
margin-left: 10rpx;
|
||||
}
|
||||
}
|
||||
</style>
|
|
@ -1,202 +0,0 @@
|
|||
<template>
|
||||
<view>
|
||||
<view class="main">
|
||||
<view class='search acea-row row-between-wrapper'>
|
||||
<view class='input acea-row row-between-wrapper'>
|
||||
<text class='iconfont icon-sousuo2'></text>
|
||||
<input type='text' :value='searchValue' :focus="focus" placeholder='请输入关键字' placeholder-class='placeholder' @input="setValue" confirm-type="search" @confirm="searchBut()"></input>
|
||||
</view>
|
||||
<view class='bnt' @tap='searchBut'>搜索</view>
|
||||
</view>
|
||||
<view class="tab-cont">
|
||||
<view v-if="goods.length" class="goods-wrap">
|
||||
<view class="goods">
|
||||
<WaterfallsFlow :wfList='goods' :isFind="false" :isAuth="false"/>
|
||||
</view>
|
||||
</view>
|
||||
<view :hidden="!loading" class="acea-row row-center-wrapper loadingicon">
|
||||
<text class="iconfont icon-jiazai loading"></text>
|
||||
</view>
|
||||
<emptyPage v-if="goods.length == 0 && !loading" title="暂无文章~"></emptyPage>
|
||||
</view>
|
||||
</view>
|
||||
<authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize>
|
||||
</view>
|
||||
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// +----------------------------------------------------------------------
|
||||
// | CRMEB [ CRMEB赋能开发者,助力企业发展 ]
|
||||
// +----------------------------------------------------------------------
|
||||
// | Copyright (c) 2016~2021 https://www.crmeb.com All rights reserved.
|
||||
// +----------------------------------------------------------------------
|
||||
// | Licensed CRMEB并不是自由软件,未经许可不能去掉CRMEB相关版权
|
||||
// +----------------------------------------------------------------------
|
||||
// | Author: CRMEB Team <admin@crmeb.com>
|
||||
// +----------------------------------------------------------------------
|
||||
import WaterfallsFlow from '@/components/plantWaterfallsFlow/WaterfallsFlow.vue'
|
||||
import { graphicLstApi } from '@/api/community.js';
|
||||
import { mapGetters } from "vuex";
|
||||
import authorize from '@/components/Authorize';
|
||||
import emptyPage from '@/components/emptyPage.vue'
|
||||
const app = getApp();
|
||||
export default {
|
||||
components: {
|
||||
authorize,
|
||||
emptyPage,
|
||||
WaterfallsFlow,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
focus: false,
|
||||
goods: [], // 商铺商品
|
||||
keyword: '',
|
||||
loaded: false,
|
||||
loading: false,
|
||||
loadTitle: '加载更多',
|
||||
isShowAuth: false, //是否隐藏授权
|
||||
isAuto: false, //没有授权的不会自动授权
|
||||
where: {
|
||||
keyword: '',
|
||||
page: 1,
|
||||
limit: 10,
|
||||
topic_id: ''
|
||||
},
|
||||
searchValue: ""
|
||||
}
|
||||
},
|
||||
created() {},
|
||||
computed: {
|
||||
...mapGetters(['isLogin', 'uid']),
|
||||
},
|
||||
watch: {},
|
||||
onLoad: function(options) {
|
||||
this.where.keyword = this.searchValue = options.searchValue ? options.searchValue : ''
|
||||
this.where.topic_id = options.id ? options.id : ''
|
||||
this.getGoods();
|
||||
},
|
||||
onShow() {},
|
||||
mounted: function() {},
|
||||
methods: {
|
||||
// 授权回调
|
||||
onLoadFun() {
|
||||
this.isShowAuth = false
|
||||
},
|
||||
// 授权关闭
|
||||
authColse: function(e) {
|
||||
this.isShowAuth = e
|
||||
},
|
||||
// 打开授权
|
||||
authOpen: function() {
|
||||
let that = this;
|
||||
if (that.isLogin === false) {
|
||||
this.isAuto = true;
|
||||
this.isShowAuth = true
|
||||
}
|
||||
},
|
||||
setValue: function(event) {
|
||||
this.$set(this.where, 'keyword', event.detail.value);
|
||||
},
|
||||
searchBut(){
|
||||
this.loadend = this.loading = false
|
||||
this.where.page = 1
|
||||
this.goods = []
|
||||
this.getGoods()
|
||||
},
|
||||
// 获取关注商品
|
||||
getGoods: function() {
|
||||
let that = this;
|
||||
if (that.loadend) return;
|
||||
if (that.loading) return;
|
||||
that.loading = true;
|
||||
that.loadTitle = '';
|
||||
graphicLstApi(that.where).then(res => {
|
||||
that.loading = false;
|
||||
let list = res.data.list;
|
||||
let goodsList = that.$util.SplitArray(list, that.goods);
|
||||
let loadend = list.length < that.where.limit;
|
||||
that.loadend = loadend;
|
||||
that.loading = false;
|
||||
that.loadTitle = loadend ? '已全部加载' : '加载更多';
|
||||
that.$set(that, 'goods', goodsList);
|
||||
that.$set(that.where, 'page', that.where.page + 1);
|
||||
}).catch(err => {
|
||||
that.loading = false;
|
||||
that.goodsLoading = false;
|
||||
uni.showToast({
|
||||
title: err,
|
||||
icon: 'none'
|
||||
})
|
||||
});
|
||||
},
|
||||
},
|
||||
onReachBottom() {
|
||||
this.getGoods();
|
||||
},
|
||||
onPullDownRefresh(){}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.main .search {
|
||||
padding: 20rpx 0 0 10rpx;
|
||||
}
|
||||
.main .search .input {
|
||||
width: 580rpx;
|
||||
background-color: #f7f7f7;
|
||||
border-radius: 33rpx;
|
||||
padding: 0 30rpx;
|
||||
box-sizing: border-box;
|
||||
height: 66rpx;
|
||||
}
|
||||
.main .search .input input {
|
||||
width: 460rpx;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
.main .search .input .placeholder {
|
||||
color: #bbb;
|
||||
}
|
||||
.main .search .input .iconfont {
|
||||
color: #000;
|
||||
font-size: 35rpx;
|
||||
}
|
||||
.main .search .bnt {
|
||||
width: 120rpx;
|
||||
text-align: center;
|
||||
height: 66rpx;
|
||||
line-height: 66rpx;
|
||||
font-size: 28rpx;
|
||||
color: #282828;
|
||||
}
|
||||
.main {
|
||||
background: #ffffff;
|
||||
padding: 0 20rpx;
|
||||
min-height: 100vh;
|
||||
.goods-wrap{
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
}
|
||||
.goods {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
width: 750rpx;
|
||||
}
|
||||
.empty-box{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin-top: 0;
|
||||
padding-top: 200rpx;
|
||||
image{
|
||||
width: 414rpx;
|
||||
height: 240rpx;
|
||||
}
|
||||
.txt{
|
||||
font-size: 26rpx;
|
||||
color: #999;
|
||||
}
|
||||
}
|
||||
</style>
|
|
@ -1,217 +0,0 @@
|
|||
<template>
|
||||
<view :style="viewColor">
|
||||
<view class="main">
|
||||
<view class="show_main area-row">
|
||||
<view class="picture">
|
||||
<image :src="proInfo.image"></image>
|
||||
</view>
|
||||
<view class="show_info">
|
||||
<view class="show_name line1">{{proInfo.store_name}}</view>
|
||||
<view class="show_count"><text class="num">{{count}}</text>条买家秀</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="tab-cont">
|
||||
<view v-if="goods.length" class="goods-wrap">
|
||||
<view class="goods">
|
||||
<WaterfallsFlow :wfList='goods' :isFind="false" :isShow="true" :isAuth="false"/>
|
||||
</view>
|
||||
</view>
|
||||
<view :hidden="!loading" class="acea-row row-center-wrapper loadingicon">
|
||||
<text class="iconfont icon-jiazai loading"></text>
|
||||
</view>
|
||||
<emptyPage v-if="goods.length == 0 && !loading" title="暂无文章~"></emptyPage>
|
||||
</view>
|
||||
</view>
|
||||
<authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize>
|
||||
</view>
|
||||
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// +----------------------------------------------------------------------
|
||||
// | CRMEB [ CRMEB赋能开发者,助力企业发展 ]
|
||||
// +----------------------------------------------------------------------
|
||||
// | Copyright (c) 2016~2021 https://www.crmeb.com All rights reserved.
|
||||
// +----------------------------------------------------------------------
|
||||
// | Licensed CRMEB并不是自由软件,未经许可不能去掉CRMEB相关版权
|
||||
// +----------------------------------------------------------------------
|
||||
// | Author: CRMEB Team <admin@crmeb.com>
|
||||
// +----------------------------------------------------------------------
|
||||
import WaterfallsFlow from '@/components/plantWaterfallsFlow/WaterfallsFlow.vue'
|
||||
import { graphicLstApi, graphicProApi} from '@/api/community.js';
|
||||
import { mapGetters } from "vuex";
|
||||
import authorize from '@/components/Authorize';
|
||||
import emptyPage from '@/components/emptyPage.vue'
|
||||
const app = getApp();
|
||||
export default {
|
||||
components: {
|
||||
authorize,
|
||||
emptyPage,
|
||||
WaterfallsFlow,
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
focus: false,
|
||||
goods: [], // 商铺商品
|
||||
count: 0, //买家秀条数
|
||||
keyword: '',
|
||||
loaded: false,
|
||||
loading: false,
|
||||
loadTitle: '加载更多',
|
||||
isShowAuth: false, //是否隐藏授权
|
||||
isAuto: false, //没有授权的不会自动授权
|
||||
proInfo: {},
|
||||
where: {
|
||||
keyword: '',
|
||||
page: 1,
|
||||
limit: 30,
|
||||
topic_id: '',
|
||||
spu_id: ''
|
||||
},
|
||||
}
|
||||
},
|
||||
created() {},
|
||||
computed: {
|
||||
...mapGetters(['isLogin','uid','scrollTop','viewColor']),
|
||||
},
|
||||
watch: {},
|
||||
onLoad: function(options) {
|
||||
this.where.spu_id = options.spu_id
|
||||
this.getGoods();
|
||||
this.getProDetail();
|
||||
},
|
||||
onShow() {},
|
||||
mounted: function() {},
|
||||
methods: {
|
||||
// 授权回调
|
||||
onLoadFun() {
|
||||
this.isShowAuth = false
|
||||
},
|
||||
// 授权关闭
|
||||
authColse: function(e) {
|
||||
this.isShowAuth = e
|
||||
},
|
||||
// 打开授权
|
||||
authOpen: function() {
|
||||
let that = this;
|
||||
if (that.isLogin === false) {
|
||||
this.isAuto = true;
|
||||
this.isShowAuth = true
|
||||
}
|
||||
},
|
||||
// 获取关注商品
|
||||
getGoods: function() {
|
||||
let that = this;
|
||||
if (that.loadend) return;
|
||||
if (that.loading) return;
|
||||
that.loading = true;
|
||||
that.loadTitle = '';
|
||||
graphicLstApi(that.where).then(res => {
|
||||
that.loading = false;
|
||||
let list = res.data.list;
|
||||
let goodsList = that.$util.SplitArray(list, that.goods);
|
||||
let loadend = list.length < that.where.limit;
|
||||
that.loadend = loadend;
|
||||
that.loading = false;
|
||||
that.count = res.data.count;
|
||||
that.loadTitle = loadend ? '已全部加载' : '加载更多';
|
||||
that.$set(that, 'goods', goodsList);
|
||||
that.$set(that.where, 'page', that.where.page + 1);
|
||||
}).catch(err => {
|
||||
that.loading = false;
|
||||
that.goodsLoading = false;
|
||||
uni.showToast({
|
||||
title: err,
|
||||
icon: 'none'
|
||||
})
|
||||
});
|
||||
},
|
||||
getProDetail(){
|
||||
let that = this
|
||||
graphicProApi(that.where.spu_id).then(res => {
|
||||
that.proInfo = res.data
|
||||
}).catch(err => {
|
||||
uni.showToast({
|
||||
title: err,
|
||||
icon: 'none'
|
||||
})
|
||||
});
|
||||
}
|
||||
},
|
||||
onReachBottom() {
|
||||
this.getGoods();
|
||||
},
|
||||
// 滚动监听
|
||||
onPageScroll(e) {
|
||||
// 传入scrollTop值并触发所有easy-loadimage组件下的滚动监听事件
|
||||
uni.$emit('scroll');
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.main {
|
||||
padding: 20rpx 20rpx 0;
|
||||
min-height: 100vh;
|
||||
.goods-wrap{
|
||||
margin-top: 20rpx;
|
||||
}
|
||||
}
|
||||
.show_main{
|
||||
padding: 20rpx 30rpx;
|
||||
background: #fff;
|
||||
border-radius: 16rpx;
|
||||
justify-content: space-between;
|
||||
display: flex;
|
||||
.picture{
|
||||
width: 108rpx;
|
||||
height: 108rpx;
|
||||
}
|
||||
.show_info{
|
||||
width: 510rpx;
|
||||
position: relative;
|
||||
}
|
||||
.show_name{
|
||||
color: #282828;
|
||||
font-size: 28rpx;
|
||||
font-weight: bold;
|
||||
font-family: 'PingFang SC';
|
||||
}
|
||||
.show_count{
|
||||
position: absolute;
|
||||
bottom: 4rpx;
|
||||
color: #282828;
|
||||
font-size: 24rpx;
|
||||
.num{
|
||||
font-size: 30rpx;
|
||||
font-weight: bold;
|
||||
color: var(--view-theme);
|
||||
}
|
||||
}
|
||||
}
|
||||
.show_main .picture image{
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.goods {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
}
|
||||
.empty-box{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
margin-top: 0;
|
||||
padding-top: 200rpx;
|
||||
image{
|
||||
width: 414rpx;
|
||||
height: 240rpx;
|
||||
}
|
||||
.txt{
|
||||
font-size: 26rpx;
|
||||
color: #999;
|
||||
}
|
||||
}
|
||||
</style>
|
|
@ -1,178 +0,0 @@
|
|||
<template>
|
||||
<view class='productSort' :style="'height:'+winHeight+'px'">
|
||||
<view class="con-box" :style="viewColor">
|
||||
<view class='aside'>
|
||||
<scroll-view scroll-y="true" style="height: 100%; overflow: hidden;" scroll-with-animation='true'>
|
||||
<view v-for="(item,index) in productList" :key="item.category_id">
|
||||
<view class='item acea-row row-center-wrapper' :class='index==navActive?"on":""' v-show='item.children && item.children.length > 0'
|
||||
@click='tap(index,"b"+index)'><text class="item_text">{{item.cate_name}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
<view class='conter'>
|
||||
<scroll-view scroll-y="true">
|
||||
<view class='listw' v-for="(item,index) in childList" :key="item.topic_id">
|
||||
<view class='list'>
|
||||
<navigator hover-class='none' :url="'/pages/plantGrass/plant_search_list/index?id='+item.topic_id" class='item acea-row'>
|
||||
<view class='picture'>
|
||||
<image :src='item.pic'></image>
|
||||
</view>
|
||||
<view class='text'>
|
||||
<view class="name line1">{{item.topic_name}}</view>
|
||||
<view class="info">{{item.count_use || 0}}篇内容 </view>
|
||||
</view>
|
||||
</navigator>
|
||||
</view>
|
||||
</view>
|
||||
<view :style='"height:"+(height-300)+"rpx;"'></view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// +----------------------------------------------------------------------
|
||||
// | CRMEB [ CRMEB赋能开发者,助力企业发展 ]
|
||||
// +----------------------------------------------------------------------
|
||||
// | Copyright (c) 2016~2021 https://www.crmeb.com All rights reserved.
|
||||
// +----------------------------------------------------------------------
|
||||
// | Licensed CRMEB并不是自由软件,未经许可不能去掉CRMEB相关版权
|
||||
// +----------------------------------------------------------------------
|
||||
// | Author: CRMEB Team <admin@crmeb.com>
|
||||
// +----------------------------------------------------------------------
|
||||
let app = getApp();
|
||||
import { getTopicList } from '@/api/community.js';
|
||||
import { mapGetters } from "vuex";
|
||||
export default {
|
||||
computed: mapGetters(['viewColor']),
|
||||
data() {
|
||||
return {
|
||||
productList: [],
|
||||
navActive: 0,
|
||||
number: "",
|
||||
height: 0,
|
||||
winHeight: 0,
|
||||
childList: []
|
||||
}
|
||||
},
|
||||
watch:{
|
||||
|
||||
},
|
||||
onLoad(options) {
|
||||
let that = this
|
||||
uni.getSystemInfo({
|
||||
success: function(res) {
|
||||
// console.log(res,'res')
|
||||
that.winHeight = res.windowHeight
|
||||
},
|
||||
});
|
||||
},
|
||||
onShow() {
|
||||
if (!this.productList.length) {
|
||||
this.getAllCategory();
|
||||
}
|
||||
},
|
||||
onReady() {},
|
||||
methods: {
|
||||
tap: function(index, id) {
|
||||
this.navActive = index;
|
||||
this.childList = this.productList[index].children
|
||||
},
|
||||
getAllCategory: function() {
|
||||
let that = this;
|
||||
getTopicList().then(res => {
|
||||
that.productList = res.data;
|
||||
for(let i=0; i < that.productList.length; i++){
|
||||
if(that.productList[i].children && that.productList[i].children.length > 0){
|
||||
that.childList = that.productList[i].children;
|
||||
return
|
||||
}
|
||||
}
|
||||
})
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
<style scoped lang="scss">
|
||||
.productSort {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
width: 100%;
|
||||
.con-box {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
overflow: hidden;
|
||||
}
|
||||
}
|
||||
.productSort .aside {
|
||||
background-color: #f5f5f5;
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden;
|
||||
width: 202rpx;
|
||||
height: 100%;
|
||||
overflow-y: scroll;
|
||||
}
|
||||
.productSort .aside .item {
|
||||
height: 100rpx;
|
||||
width: 100%;
|
||||
font-size: 28rpx;
|
||||
color: #666666;
|
||||
}
|
||||
.productSort .aside .item_text {
|
||||
padding-left: 20rpx;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
display: -webkit-box;
|
||||
-webkit-line-clamp: 2;
|
||||
-webkit-box-orient: vertical;
|
||||
}
|
||||
.productSort .aside .item.on {
|
||||
background-color: #ffffff;
|
||||
border-left: 4rpx solid var(--view-theme);
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
color: var(--view-theme);
|
||||
font-weight: bold;
|
||||
}
|
||||
.productSort .conter {
|
||||
flex: 1;
|
||||
height: 100%;
|
||||
padding: 0 30rpx;
|
||||
background-color: #ffffff;
|
||||
overflow-y: scroll;
|
||||
}
|
||||
.productSort .conter .list {
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
.productSort .conter .list .item {
|
||||
margin-top: 26rpx;
|
||||
margin-bottom: 40rpx;
|
||||
align-items: center;
|
||||
}
|
||||
.productSort .conter .list .item .picture {
|
||||
width: 110rpx;
|
||||
height: 110rpx;
|
||||
border-radius: 8rpx;
|
||||
}
|
||||
.productSort .conter .list .item .picture image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
border-radius: 8rpx;
|
||||
}
|
||||
.productSort .conter .list .item .text{
|
||||
margin-left: 30rpx;
|
||||
}
|
||||
.productSort .conter .list .text .name {
|
||||
font-size: 28rpx;
|
||||
color: #282828;
|
||||
font-weight: bold;
|
||||
max-width: 300rpx;
|
||||
}
|
||||
.productSort .list .item .info {
|
||||
font-size: 24rpx;
|
||||
color: #999999;
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
</style>
|
|
@ -1,394 +0,0 @@
|
|||
<template>
|
||||
<view class="container" :style="viewColor">
|
||||
<view class="header" :style="{ 'background-image': `url(${domain}/static/images/plant-header.png)`}">
|
||||
<view class="user_wrapper acea-row">
|
||||
<image :src="userInfo.avatar || '/static/images/f.png'" class="picture"></image>
|
||||
<view class="user_text">
|
||||
<view class="name acea-row">
|
||||
<text>{{userInfo.nickname || ''}}</text>
|
||||
<image v-if="userInfo.member_icon" class="level_icon" :src="userInfo.member_icon" alt="">
|
||||
</view>
|
||||
<view class="user_id">ID: {{userInfo.uid || ''}}</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="plant_info acea-row">
|
||||
<view class="count_wrapper acea-row">
|
||||
<navigator :url="userInfo.is_self ? '/pages/plantGrass/plant_user_attention/index' : ''" class="item" hover-class="none">
|
||||
<text>{{userInfo.focus}}</text>关注
|
||||
</navigator>
|
||||
<navigator :url="userInfo.is_self ? '/pages/plantGrass/plant_user_fans/index' : ''" class="item" hover-class="none">
|
||||
<text>{{userInfo.fans==null?0:userInfo.fans}}</text>粉丝
|
||||
</navigator>
|
||||
<view class="item">
|
||||
<text>{{userInfo.start}}</text>获赞
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="!userInfo.is_self" @click.stop="followAuthor">
|
||||
<button v-if="!userInfo.is_start" class="follow_btn focus">
|
||||
<text class="iconfont icon-jiahao2"></text>关注
|
||||
</button>
|
||||
<button v-else class="follow_btn focused">已关注</button>
|
||||
</view>
|
||||
<view v-else>
|
||||
<navigator hover-class="none" url="/pages/plantGrass/plant_release/index" class="follow_btn focus">
|
||||
<text class="iconfont icon-fabu"></text>发布
|
||||
</navigator>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="main">
|
||||
|
||||
<view v-if="userInfo.is_self" class="tab_count">
|
||||
<text @click.stop="changeTab(0)" :class="tab==0 ? 'on' : ''">作品</text>
|
||||
<text @click.stop="changeTab(1)" :class="tab==1 ? 'on' : ''">赞过</text>
|
||||
</view>
|
||||
<view class="tab-cont">
|
||||
<view v-if="goods.length > 0" class="goods-wrap">
|
||||
<view class="goods">
|
||||
<WaterfallsFlow :wfList='goods' :isAuth="1" :uid="parseInt(uid)" :tab="tab"/>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="goods.length == 0 && !loading" class="empty">
|
||||
<image src="/static/images/no_thing.png"></image>
|
||||
<text>暂无内容哦~</text>
|
||||
</view>
|
||||
<view class='loadingicon acea-row row-center-wrapper'>
|
||||
<text class='loading iconfont icon-jiazai' :hidden='loading==false'></text>
|
||||
<view class="end" :hidden="loading || goods.length == 0"><text :class="loaded ? 'loaded' : ''">{{loadTitle}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// +----------------------------------------------------------------------
|
||||
// | CRMEB [ CRMEB赋能开发者,助力企业发展 ]
|
||||
// +----------------------------------------------------------------------
|
||||
// | Copyright (c) 2016~2021 https://www.crmeb.com All rights reserved.
|
||||
// +----------------------------------------------------------------------
|
||||
// | Licensed CRMEB并不是自由软件,未经许可不能去掉CRMEB相关版权
|
||||
// +----------------------------------------------------------------------
|
||||
// | Author: CRMEB Team <admin@crmeb.com>
|
||||
// +----------------------------------------------------------------------
|
||||
import WaterfallsFlow from '@/components/plantWaterfallsFlow/WaterfallsFlow.vue'
|
||||
import { userInfoApi, followAuthorApi, userArticleLst, starArticleLst } from '@/api/community.js';
|
||||
import { mapGetters } from "vuex";
|
||||
import authorize from '@/components/Authorize';
|
||||
import { HTTP_REQUEST_URL } from '@/config/app';
|
||||
const app = getApp();
|
||||
export default {
|
||||
components: {
|
||||
authorize,
|
||||
WaterfallsFlow
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
domain: HTTP_REQUEST_URL,
|
||||
goods: [], // 商铺商品
|
||||
loadTitle: '加载更多',
|
||||
loading: false,
|
||||
loaded: false,
|
||||
isShowAuth: false, //是否隐藏授权
|
||||
isAuto: false, //没有授权的不会自动授权
|
||||
userInfo: {},
|
||||
where: {
|
||||
page: 1,
|
||||
limit: 30
|
||||
},
|
||||
tab: 0,
|
||||
uid: ''
|
||||
}
|
||||
},
|
||||
created() {},
|
||||
computed: {
|
||||
...mapGetters(['isLogin','viewColor']),
|
||||
},
|
||||
watch: {},
|
||||
onLoad: function(options) {
|
||||
let that = this;
|
||||
that.uid = options.id
|
||||
if (that.isLogin) {
|
||||
that.getAuthorInfo(that.uid);
|
||||
that.getList(that.uid);
|
||||
} else {
|
||||
this.isAuto = true;
|
||||
this.isShowAuth = true
|
||||
}
|
||||
},
|
||||
onShow() {},
|
||||
onReady() {},
|
||||
mounted: function() {},
|
||||
methods: {
|
||||
// 授权回调
|
||||
onLoadFun() {
|
||||
this.isShowAuth = false
|
||||
this.getAuthorInfo(this.uid);
|
||||
this.getList(this.uid);
|
||||
},
|
||||
// 授权关闭
|
||||
authColse: function(e) {
|
||||
this.isShowAuth = e
|
||||
},
|
||||
// 打开授权
|
||||
authOpen: function() {
|
||||
let that = this;
|
||||
if (that.isLogin === false) {
|
||||
this.isAuto = true;
|
||||
this.isShowAuth = true
|
||||
}
|
||||
},
|
||||
/*获取用户信息*/
|
||||
getAuthorInfo(id){
|
||||
let that = this;
|
||||
userInfoApi(id).then(res => {
|
||||
that.userInfo = res.data
|
||||
});
|
||||
},
|
||||
// 关注作者
|
||||
followAuthor: function() {
|
||||
if (this.isLogin === false) {
|
||||
this.isAuto = true;
|
||||
this.isShowAuth = true
|
||||
} else {
|
||||
let status = this.userInfo.is_start ? false : true
|
||||
followAuthorApi(this.userInfo.uid,{status: status}).then(res => {
|
||||
if (res.status === 200) {
|
||||
this.userInfo.is_start = this.userInfo.is_start ? false : true
|
||||
}
|
||||
this.$util.Tips({
|
||||
title: res.message
|
||||
});
|
||||
});
|
||||
}
|
||||
},
|
||||
changeTab(tab){
|
||||
this.tab = tab
|
||||
this.where.page = 1
|
||||
this.loaded = this.loading = false
|
||||
this.goods = []
|
||||
let uid = this.userInfo.is_self ? this.uid : this.userInfo.uid
|
||||
this.getList(uid)
|
||||
},
|
||||
// 获取用户的作品
|
||||
getList: function(uid) {
|
||||
let that = this;
|
||||
if (that.loaded || that.loading) return;
|
||||
that.loading = true;
|
||||
that.loadTitle = '';
|
||||
that.tab == 1 ? this.where.is_type = 1 : this.where.is_type = ''
|
||||
that.tab == 0 ?
|
||||
userArticleLst(uid,that.where).then(res => {
|
||||
let list = res.data.list;
|
||||
let goods = that.$util.SplitArray(list, that.goods);
|
||||
that.loaded = list.length < that.where.limit;
|
||||
that.loading = false;
|
||||
that.loadTitle = that.loaded ? '到底了' : '加载更多';
|
||||
that.$set(that, 'goods', goods);
|
||||
that.$set(that.where, 'page', that.where.page + 1);
|
||||
}).catch(err => {
|
||||
that.loading = false;
|
||||
uni.showToast({
|
||||
title: err,
|
||||
icon: 'none'
|
||||
})
|
||||
}) :
|
||||
starArticleLst(that.where).then(res => {
|
||||
that.loading = false;
|
||||
let list = res.data.list;
|
||||
let goods = that.$util.SplitArray(list, that.goods);
|
||||
that.loaded = list.length < that.where.limit;
|
||||
that.loading = false;
|
||||
that.loadTitle = that.loaded ? '到底了' : '加载更多';
|
||||
that.$set(that, 'goods', goods);
|
||||
that.$set(that.where, 'page', that.where.page + 1);
|
||||
}).catch(err => {
|
||||
that.loading = false;
|
||||
uni.showToast({
|
||||
title: err,
|
||||
icon: 'none'
|
||||
})
|
||||
})
|
||||
}
|
||||
},
|
||||
onReachBottom() {
|
||||
let uid = this.userInfo.is_self ? this.uid : this.userInfo.uid
|
||||
this.getList(uid);
|
||||
},
|
||||
onPullDownRefresh(){},
|
||||
// 滚动监听
|
||||
onPageScroll(e) {
|
||||
// 传入scrollTop值并触发所有easy-loadimage组件下的滚动监听事件
|
||||
uni.$emit('scroll');
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.container{
|
||||
background: #ffffff;
|
||||
min-height: 100vh;
|
||||
}
|
||||
.header{
|
||||
width: 750rpx;
|
||||
height: 400rpx;
|
||||
padding: 56rpx 30rpx 0;
|
||||
background-repeat: no-repeat;
|
||||
background-size: 100%;
|
||||
.user_wrapper{
|
||||
align-items: center;
|
||||
.image,uni-image,image{
|
||||
width: 140rpx;
|
||||
height: 140rpx;
|
||||
border-radius: 100%;
|
||||
border: 4rpx solid #ffffff;
|
||||
}
|
||||
.user_text{
|
||||
margin-left: 22rpx;
|
||||
color: #FFFFFF;
|
||||
.name{
|
||||
font-size: 34rpx;
|
||||
font-weight: bold;
|
||||
align-items: center;
|
||||
}
|
||||
.user_id{
|
||||
margin-top: 16rpx;
|
||||
font-size: 24rpx;
|
||||
}
|
||||
.level_icon{
|
||||
width: 34rpx;
|
||||
height: 32rpx;
|
||||
margin: 4rpx 0 0 6rpx;
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
.plant_info{
|
||||
margin-top: 60rpx;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
.count_wrapper{
|
||||
color: #FFFFFF;
|
||||
font-size: 24rpx;
|
||||
.item{
|
||||
text-align: center;
|
||||
margin-right: 60rpx;
|
||||
&:last-child{
|
||||
margin-right: 0;
|
||||
}
|
||||
text{
|
||||
display: block;
|
||||
font-size: 30rpx;
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.follow_btn{
|
||||
color: #ffffff;
|
||||
font-size: 26rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
width: 146rpx;
|
||||
height: 62rpx;
|
||||
background-color: transparent;
|
||||
background-image: linear-gradient(270deg, var(--view-bntColor21) 0%, var(--view-bntColor22) 100%);
|
||||
border-radius: 33rpx;
|
||||
.iconfont{
|
||||
font-size: 16rpx;
|
||||
margin-right: 12rpx;
|
||||
}
|
||||
.icon-fabu{
|
||||
font-size: 24rpx;
|
||||
}
|
||||
&.focused{
|
||||
background: transparent;
|
||||
color: #FFFFFF;
|
||||
border: 1px solid #FFFFFF;
|
||||
}
|
||||
}
|
||||
}
|
||||
.main {
|
||||
background: #ffffff;
|
||||
padding: 30rpx 0;
|
||||
border-radius: 24rpx 24rpx 0 0;
|
||||
position: relative;
|
||||
top: -20rpx;
|
||||
.tab_count{
|
||||
margin-bottom: 40rpx;
|
||||
text-align: center;
|
||||
text{
|
||||
font-size: 28rpx;
|
||||
color: #999999;
|
||||
margin: 0 30rpx;
|
||||
position: relative;
|
||||
padding-bottom: 10rpx;
|
||||
&.on{
|
||||
font-size: 32rpx;
|
||||
color: #282828;
|
||||
font-weight: bold;
|
||||
&::after{
|
||||
content: "";
|
||||
width: 40rpx;
|
||||
height: 5rpx;
|
||||
background: var(--view-theme);
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 10rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.goods {
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-between;
|
||||
width: 750rpx;
|
||||
padding: 0 20rpx;
|
||||
}
|
||||
.empty{
|
||||
margin: 130rpx 0 150rpx;
|
||||
text-align: center;
|
||||
image,uni-image{
|
||||
display: inline-block;
|
||||
width: 414rpx;
|
||||
height: 305rpx;
|
||||
}
|
||||
text{
|
||||
display: block;
|
||||
color: #999999;
|
||||
font-size: 26rpx;
|
||||
}
|
||||
}
|
||||
.end{
|
||||
margin-top: 50rpx 0;
|
||||
text-align: center;
|
||||
text{
|
||||
color: #999999;
|
||||
font-size: 22rpx;
|
||||
position: relative;
|
||||
&.loaded{
|
||||
&::before,&::after{
|
||||
content: "";
|
||||
display: inline-block;
|
||||
width: 22rpx;
|
||||
height: 1rpx;
|
||||
background: #999999;
|
||||
position: absolute;
|
||||
top: 18rpx;
|
||||
opacity: .5;
|
||||
}
|
||||
&::before{
|
||||
left: -30rpx;
|
||||
}
|
||||
&::after{
|
||||
right: -30rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
|
@ -1,185 +0,0 @@
|
|||
<template>
|
||||
<view class="user_store_attention">
|
||||
<block v-if="list.length > 0">
|
||||
<view class="item" v-for="(item,index) in list" :key="index" @click="goHomepage(item)">
|
||||
<image :src="(item.focus&&item.focus.avatar) || '/static/images/f.png'" mode=""></image>
|
||||
<view v-if="item.focus" class="info">
|
||||
<view class="line1">
|
||||
<text class="name line1">{{(item.focus && item.focus.nickname) || '用户已注销'}}</text>
|
||||
</view>
|
||||
<view v-if="item.focus.count_fans" class="des">
|
||||
粉丝{{item.focus.count_fans<10000 ? item.focus.count_fans : (item.focus.count_fans/10000).toFixed(2)+'万'}}
|
||||
</view>
|
||||
<view v-else class="des">粉丝0</view>
|
||||
<view class="btn" :class="item.is_fans ? 'focusBtn' : ''" @click.stop="focusToggle(item)">
|
||||
<text v-if="item.is_fans" class="iconfont icon-jiahao2"></text>
|
||||
{{item.is_fans ? '关注' : '已关注'}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
<view :hidden="!loading" class="acea-row row-center-wrapper loadingicon">
|
||||
<text class="iconfont icon-jiazai loading"></text>
|
||||
</view>
|
||||
<view class="no_content" v-if="list.length == 0 && !loading">
|
||||
<view class="count">
|
||||
<image src="../static/images/no_attention.png"></image>
|
||||
<text>暂未关注任何人哦~</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// +----------------------------------------------------------------------
|
||||
// | CRMEB [ CRMEB赋能开发者,助力企业发展 ]
|
||||
// +----------------------------------------------------------------------
|
||||
// | Copyright (c) 2016~2021 https://www.crmeb.com All rights reserved.
|
||||
// +----------------------------------------------------------------------
|
||||
// | Licensed CRMEB并不是自由软件,未经许可不能去掉CRMEB相关版权
|
||||
// +----------------------------------------------------------------------
|
||||
// | Author: CRMEB Team <admin@crmeb.com>
|
||||
// +----------------------------------------------------------------------
|
||||
let app = getApp();
|
||||
import { myFocusLst, followAuthorApi } from '@/api/community.js'
|
||||
export default{
|
||||
data(){
|
||||
return {
|
||||
list:[],
|
||||
isScroll:true,
|
||||
loading: false,
|
||||
page:1,
|
||||
limit:20,
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
this.getList()
|
||||
},
|
||||
mounted: function() {},
|
||||
methods:{
|
||||
getList(){
|
||||
if(!this.isScroll || this.loading) return
|
||||
this.loading = true;
|
||||
myFocusLst({
|
||||
page:this.page,
|
||||
limit:this.limit
|
||||
}).then(res=>{
|
||||
this.loading = false
|
||||
this.isScroll = res.data.list.length>=this.limit
|
||||
this.list = this.list.concat(res.data.list)
|
||||
this.page+=1
|
||||
})
|
||||
},
|
||||
/*关注*/
|
||||
focusToggle(item){
|
||||
let status = item.is_fans ? 1 : 0
|
||||
followAuthorApi(item.right_id,{status: status}).then(res => {
|
||||
if (res.status === 200) {
|
||||
item.is_fans = item.is_fans ? false : true
|
||||
}
|
||||
this.$util.Tips({
|
||||
title: res.message
|
||||
});
|
||||
this.getList()
|
||||
});
|
||||
},
|
||||
goHomepage(item){
|
||||
|
||||
uni.navigateTo({
|
||||
url: '/pages/plantGrass/plant_user/index?id='+item.focus.uid
|
||||
})
|
||||
}
|
||||
},
|
||||
onReachBottom() {
|
||||
this.getList()
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.user_store_attention{
|
||||
.item{
|
||||
position: relative;
|
||||
display: flex;
|
||||
padding: 30rpx 20rpx;
|
||||
background-color: #fff;
|
||||
align-items: center;
|
||||
&::after{
|
||||
content: ' ';
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 30rpx;
|
||||
right: 0;
|
||||
height: 1px;
|
||||
background: #f0f0f0;
|
||||
}
|
||||
image{
|
||||
width: 120rpx;
|
||||
height: 120rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
.info{
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
margin-left: 20rpx;
|
||||
position: relative;
|
||||
.name{
|
||||
width: 410rpx;
|
||||
font-size: 30rpx;
|
||||
color: #282828;
|
||||
}
|
||||
.des{
|
||||
color: #999999;
|
||||
font-size: 24rpx;
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
.btn{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 50%;
|
||||
width: 126rpx;
|
||||
height: 50rpx;
|
||||
transform: translateY(-50%);
|
||||
border:1px solid #999999;
|
||||
color: #999999;
|
||||
border-radius: 33rpx;
|
||||
font-size: 26rpx;
|
||||
&.focusBtn{
|
||||
color: #E93323;
|
||||
border-color: #E93323;
|
||||
.iconfont{
|
||||
font-size: 20rpx;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.no_content,.main{
|
||||
min-height: 100vh;
|
||||
background: #fff;
|
||||
position: relative;
|
||||
.count{
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
top: 50%;
|
||||
margin-top: -300rpx;
|
||||
image,uni-image{
|
||||
width: 424rpx;
|
||||
height: 305rpx;
|
||||
}
|
||||
text{
|
||||
display: block;
|
||||
color: #999999;
|
||||
font-size: 26rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
|
@ -1,179 +0,0 @@
|
|||
<template>
|
||||
<view class="user_store_attention">
|
||||
<block v-if="list.length >0">
|
||||
<view class="item" v-for="(item,index) in list" :key="index" @click="goHomepage(item)">
|
||||
<image :src="(item.fans && item.fans.avatar) || '/static/images/f.png'" mode=""></image>
|
||||
<view class="info">
|
||||
<view class="line1">
|
||||
<text class="name line1">{{(item.fans && item.fans.nickname) || '用户已注销'}}</text>
|
||||
</view>
|
||||
<view v-if="item.fans && item.fans.count_fans" class="des">
|
||||
粉丝{{item.fans.count_fans<10000 ? item.fans.count_fans : (item.fans.count_fans/10000).toFixed(2)+'万'}}
|
||||
</view>
|
||||
<view v-else class="des">粉丝0</view>
|
||||
<view @click.stop="focusToggle(item)" class="btn" :class="item.is_start ? '' : 'focusBtn'">
|
||||
<text v-if="!item.is_start" class="iconfont icon-jiahao2"></text>
|
||||
{{item.is_start ? '已关注' : '关注'}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
<view :hidden="!loading" class="acea-row row-center-wrapper loadingicon">
|
||||
<text class="iconfont icon-jiazai loading"></text>
|
||||
</view>
|
||||
<view class="no_content" v-if="list.length == 0 && !loading">
|
||||
<view class="count">
|
||||
<image src="../static/images/no_fans.png"></image>
|
||||
<text>你还没有粉丝哦~</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// +----------------------------------------------------------------------
|
||||
// | CRMEB [ CRMEB赋能开发者,助力企业发展 ]
|
||||
// +----------------------------------------------------------------------
|
||||
// | Copyright (c) 2016~2021 https://www.crmeb.com All rights reserved.
|
||||
// +----------------------------------------------------------------------
|
||||
// | Licensed CRMEB并不是自由软件,未经许可不能去掉CRMEB相关版权
|
||||
// +----------------------------------------------------------------------
|
||||
// | Author: CRMEB Team <admin@crmeb.com>
|
||||
// +----------------------------------------------------------------------
|
||||
let app = getApp();
|
||||
import { myFansLst, followAuthorApi } from '@/api/community.js'
|
||||
export default{
|
||||
data(){
|
||||
return {
|
||||
list:[],
|
||||
isScroll:true,
|
||||
page:1,
|
||||
limit:20,
|
||||
loading: false,
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
this.getList()
|
||||
},
|
||||
onReady(){},
|
||||
mounted: function() {},
|
||||
methods:{
|
||||
getList(){
|
||||
if(!this.isScroll || this.loading) return
|
||||
this.loading = true;
|
||||
myFansLst({
|
||||
page:this.page,
|
||||
limit:this.limit
|
||||
}).then(res=>{
|
||||
this.loading = false
|
||||
this.isScroll = res.data.list.length>=this.limit
|
||||
this.list = this.list.concat(res.data.list)
|
||||
this.page+=1
|
||||
})
|
||||
},
|
||||
/*关注*/
|
||||
focusToggle(item){
|
||||
let status = item.is_start ? 0 : 1
|
||||
followAuthorApi(item.left_id,{status: status}).then(res => {
|
||||
if (res.status === 200) {
|
||||
item.is_start = item.is_start ? false : true
|
||||
}
|
||||
this.$util.Tips({
|
||||
title: res.message
|
||||
});
|
||||
});
|
||||
}
|
||||
},
|
||||
onReachBottom() {
|
||||
this.getList()
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" acoped>
|
||||
.user_store_attention{
|
||||
.item{
|
||||
position: relative;
|
||||
display: flex;
|
||||
padding: 30rpx 20rpx;
|
||||
background-color: #fff;
|
||||
align-items: center;
|
||||
&::after{
|
||||
content: ' ';
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
left: 30rpx;
|
||||
right: 0;
|
||||
height: 1px;
|
||||
background: #f0f0f0;
|
||||
}
|
||||
image{
|
||||
width: 120rpx;
|
||||
height: 120rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
.info{
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
margin-left: 20rpx;
|
||||
position: relative;
|
||||
.name{
|
||||
width: 410rpx;
|
||||
font-size: 30rpx;
|
||||
color: #282828;
|
||||
}
|
||||
.des{
|
||||
color: #999999;
|
||||
font-size: 24rpx;
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
.btn{
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: 50%;
|
||||
width: 126rpx;
|
||||
height: 50rpx;
|
||||
transform: translateY(-50%);
|
||||
border:1px solid #999999;
|
||||
color: #999999;
|
||||
border-radius: 33rpx;
|
||||
font-size: 26rpx;
|
||||
&.focusBtn{
|
||||
color: #E93323;
|
||||
border-color: #E93323;
|
||||
.iconfont{
|
||||
font-size: 20rpx;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.no_content,.main{
|
||||
min-height: 100vh;
|
||||
background: #fff;
|
||||
position: relative;
|
||||
.count{
|
||||
position: absolute;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
top: 50%;
|
||||
margin-top: -300rpx;
|
||||
image,uni-image{
|
||||
width: 424rpx;
|
||||
height: 305rpx;
|
||||
}
|
||||
text{
|
||||
display: block;
|
||||
color: #999999;
|
||||
font-size: 26rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
Before Width: | Height: | Size: 7.8 KiB |
Before Width: | Height: | Size: 28 KiB |
Before Width: | Height: | Size: 20 KiB |
Before Width: | Height: | Size: 21 KiB |
Before Width: | Height: | Size: 28 KiB |
Before Width: | Height: | Size: 1.8 KiB |
|
@ -7,8 +7,10 @@
|
|||
<view class="store_bg">
|
||||
<view class="text flex_a_c"><i class="iconfont icon-xinghao"></i>上传店铺背景图</view>
|
||||
<block v-if="images[0].img">
|
||||
<!-- <u--image :showLoading="true" :src="images[0].img" width="388px" height="210.53rpx" radius="4px"
|
||||
@click="delImg(0)" mode="aspectFit"></u--image> -->
|
||||
<u--image :showLoading="true" :src="images[0].img" width="360px" height="210.53rpx" radius="4px"
|
||||
@click="delImg(0)"></u--image>
|
||||
@click="delImg(2)"></u--image>
|
||||
</block>
|
||||
<view v-else class="upload" @click="seleckImage(0)">
|
||||
<view class="iconfont icon-tupian1"></view>
|
||||
|
@ -72,9 +74,11 @@
|
|||
<view class="flex_a_c">
|
||||
<text class="sub_title">配送方式:</text>
|
||||
<view class="flex">
|
||||
<checkbox-group name="" @change="checkboxChange" >
|
||||
<checkbox disabled='true' :checked="isZiti" :value="check.ziti" /><text class="text ziti">到店自提(加入供应链)</text>
|
||||
<checkbox disabled='true' :checked="isKuaidi" :value="check.kuaidi" /><text class="text">快递配送</text>
|
||||
<checkbox-group name="" @change="checkboxChange">
|
||||
<checkbox disabled='true' :checked="isZiti" :value="check.ziti" /><text
|
||||
class="text ziti">到店自提(加入供应链)</text>
|
||||
<checkbox disabled='true' :checked="isKuaidi" :value="check.kuaidi" /><text
|
||||
class="text">快递配送</text>
|
||||
</checkbox-group>
|
||||
</view>
|
||||
</view>
|
||||
|
@ -108,10 +112,12 @@
|
|||
<view class="sub_title flex_a_c"><i class="iconfont icon-xinghao"></i>店铺营业时间:</view>
|
||||
<view class="bus_time flex_a_c">
|
||||
<view class="select" @click="beginTimeShow = true">
|
||||
{{ mer_take_time[0] ? mer_take_time[0] : '选择开始时间' }}</view>
|
||||
{{ mer_take_time[0] ? mer_take_time[0] : '选择开始时间' }}
|
||||
</view>
|
||||
至
|
||||
<view class="select" @click="overTimeShow = true">
|
||||
{{ mer_take_time[1] ? mer_take_time[1] : '选择结束时间' }}</view>
|
||||
{{ mer_take_time[1] ? mer_take_time[1] : '选择结束时间' }}
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
|
@ -132,8 +138,8 @@
|
|||
<view class="sub_title flex_a_c"><i class="iconfont icon-xinghao"></i>客服电话:</view>
|
||||
<input class="com_input" type="number" v-model="servicePhone" placeholder="输入客服电话">
|
||||
</view>
|
||||
|
||||
<!-- <view class="item_cell flex_a_c" v-if="type_code!='TypeFamousSpecialties'||type_code!='TypeLocalCuisine'||type_code!='TypeFeaturedCultural'" >
|
||||
|
||||
<view class="item_cell flex_a_c" v-if="type_code!='TypeFamousSpecialties'||type_code!='TypeLocalCuisine'||type_code!='TypeFeaturedCultural'" >
|
||||
<view class="sub_title flex_a_c"><i class="iconfont icon-xinghao" v-if="credit_buy"></i>开启先货后款:</view>
|
||||
<u-switch v-model="credit_buy" @change="change"></u-switch>
|
||||
</view>
|
||||
|
@ -147,7 +153,7 @@
|
|||
<view class="sub_title flex_a_c"><i class="iconfont icon-xinghao"></i>先货后款结算利率:</view>
|
||||
<input type="number" maxlength="5" v-model="interest_rate" placeholder="请输入 /利率单位为: %">
|
||||
</view>
|
||||
<view class="remarks">*利率结算范围为:0.01 ~ 0.1 利率单位为:%</view> -->
|
||||
<view class="remarks">*利率结算范围为:0.01 ~ 0.1 利率单位为:%</view>
|
||||
<!-- <view class="item_cell">
|
||||
<view class="if_btn flex_a_c_j_sb">
|
||||
<text class="sub_title">是否开启商户:</text>
|
||||
|
@ -219,7 +225,7 @@
|
|||
},
|
||||
isZiti: false,
|
||||
isKuaidi: false,
|
||||
delivery_way: [1,2],
|
||||
delivery_way: [1, 2],
|
||||
takeName: '',
|
||||
takePhone: '',
|
||||
servicePhone: '',
|
||||
|
@ -269,16 +275,16 @@
|
|||
credit_buy: false, //开启信用购
|
||||
interest_rate: '', //利率
|
||||
settle_cycle: '', //周期
|
||||
mer_name:'',
|
||||
type_code:''
|
||||
mer_name: '',
|
||||
type_code: ''
|
||||
}
|
||||
},
|
||||
onLoad(e) {
|
||||
this.id = e.mer_id
|
||||
this.getMerchantInfo(e.mer_id)
|
||||
|
||||
this.isZiti = true
|
||||
this.isKuaidi = true
|
||||
|
||||
this.isZiti = true
|
||||
this.isKuaidi = true
|
||||
},
|
||||
onShow() {},
|
||||
methods: {
|
||||
|
@ -286,7 +292,7 @@
|
|||
merchantInfoAPI({
|
||||
id
|
||||
}).then(res => {
|
||||
this.mer_name= res.data.mer_name
|
||||
this.mer_name = res.data.mer_name
|
||||
this.images[0].img = res.data.mer_banner
|
||||
this.images[1].img = res.data.mer_avatar
|
||||
this.images[2].img = res.data.mini_banner
|
||||
|
@ -303,11 +309,11 @@
|
|||
res.data.mer_take_day.forEach((item, i) => {
|
||||
this.dateWeek[Number(item) - 1].isCheck = true
|
||||
})
|
||||
this.type_code= res.data.type_code
|
||||
this.type_code = res.data.type_code
|
||||
this.mer_take_time = res.data.mer_take_time
|
||||
this.intro = res.data.mer_info
|
||||
this.cruxText = res.data.mer_keyword
|
||||
|
||||
|
||||
this.servicePhone = res.data.service_phone
|
||||
this.mer_address = res.data.mer_address
|
||||
this.merState = res.data.mer_state === 1 ? true : false
|
||||
|
@ -372,7 +378,7 @@
|
|||
mer_avatar: this.images[1].img,
|
||||
mini_banner: this.images[2].img,
|
||||
mer_certificate: this.images[3].img,
|
||||
delivery_way: [1,2],
|
||||
delivery_way: [1, 2],
|
||||
mer_take_name: this.takeName,
|
||||
mer_take_phone: this.takePhone,
|
||||
mer_take_address: this.detailSite,
|
||||
|
@ -406,9 +412,9 @@
|
|||
// url:'/pages/moreProject/moreProject'
|
||||
// })
|
||||
uni.redirectTo({
|
||||
url:'/pages/moreProject/moreProject'
|
||||
url: '/pages/moreProject/moreProject'
|
||||
})
|
||||
|
||||
|
||||
}, 1000)
|
||||
}).catch(err => {
|
||||
Toast(err)
|
||||
|
@ -441,7 +447,7 @@
|
|||
// sizeType: ['original', 'compressed'],
|
||||
// sourceType: ['album', 'camera'],
|
||||
// success: function(res) {
|
||||
|
||||
|
||||
// uni.showLoading({
|
||||
// title: '上传中...'
|
||||
// })
|
||||
|
@ -459,7 +465,7 @@
|
|||
// Toast('添加失败')
|
||||
// }
|
||||
// });
|
||||
|
||||
|
||||
},
|
||||
delImg(i) {
|
||||
let that = this
|
||||
|
|
|
@ -47,13 +47,13 @@
|
|||
<swiper-item :class="{ active: 1 == swiperCur }">
|
||||
<view class="slide-navigator">
|
||||
<!-- 隐藏暂时不需要 -->
|
||||
<!-- <navigator class="item"
|
||||
<navigator class="item"
|
||||
:url="`/pages/product/addGoods/freightTemplate?mer_id=${mer_id}`"
|
||||
hover-class='none'>
|
||||
<image mode='widthFix' class="image" src="../static/images/product_freight.png">
|
||||
</image>
|
||||
<text class="text">运费模板</text>
|
||||
</navigator> -->
|
||||
</navigator>
|
||||
<navigator class="item"
|
||||
:url="`/pages/product/addGoods/mulSpecification?mer_id=${mer_id}`"
|
||||
hover-class='none'>
|
||||
|
@ -61,12 +61,12 @@
|
|||
src="../static/images/product_specification.png"></image>
|
||||
<text class="text">规格模板</text>
|
||||
</navigator>
|
||||
<!-- <navigator class="item"
|
||||
<navigator class="item"
|
||||
:url="`/pages/users/online_warehousing/index?mer_id=${mer_id}&product_id=${data.product_id}&unique=${data.unique}`"
|
||||
hover-class='none'>
|
||||
<image mode='widthFix' class="image" src="@/static/images/daoru.png"></image>
|
||||
<text class="text">商品导入</text>
|
||||
</navigator> -->
|
||||
</navigator>
|
||||
</view>
|
||||
</swiper-item>
|
||||
</block>
|
||||
|
@ -125,9 +125,9 @@
|
|||
</view>
|
||||
<view class="operation acea-row row-between-wrapper">
|
||||
<view class="acea-row row-middle">
|
||||
<!-- <view class="" class="bnt" @click="Fonline(item)" style="width:150rpx">
|
||||
<view class="" class="bnt" @click="Fonline(item)" style="width:150rpx">
|
||||
线上入库
|
||||
</view> -->
|
||||
</view>
|
||||
<view class="" class="bnt" @click="Fline(item)" style="width:150rpx">
|
||||
线下入库
|
||||
</view>
|
||||
|
@ -201,6 +201,10 @@
|
|||
postImport
|
||||
} from "@/api/product";
|
||||
import Loading from '@/components/Loading/index.vue';
|
||||
import {
|
||||
merstreet,
|
||||
getUserInfo
|
||||
} from '@/api/user.js';
|
||||
import {
|
||||
navigateTo,
|
||||
navigateBack,
|
||||
|
@ -251,8 +255,9 @@
|
|||
}
|
||||
},
|
||||
onLoad(options) {
|
||||
this.mer_id = options.mer_id;
|
||||
this.getList(this.mer_id, true);
|
||||
// this.mer_id = options.mer_id;
|
||||
this.getUserInfo()
|
||||
|
||||
},
|
||||
onPullDownRefresh() {
|
||||
this.where.page = 1
|
||||
|
@ -264,13 +269,30 @@
|
|||
},
|
||||
onReachBottom() {
|
||||
// console.log(this.status, '222222222')
|
||||
if (this.status == 'nomore') return;
|
||||
if (this.status == 'nomore') return;
|
||||
this.status = 'loading';
|
||||
this.where.page = ++this.where.page;
|
||||
this.getList(this.mer_id, false);
|
||||
},
|
||||
|
||||
methods: {
|
||||
/**
|
||||
* 获取个人用户信息
|
||||
*/
|
||||
getUserInfo() {
|
||||
getUserInfo().then(res => {
|
||||
|
||||
|
||||
this.mer_id = res.data.service.mer_id;
|
||||
|
||||
this.getList(res.data.service.mer_id, true);
|
||||
|
||||
|
||||
}).catch(res => {
|
||||
console.log(res)
|
||||
})
|
||||
|
||||
},
|
||||
menuActiona(item, index) {
|
||||
if (item.is_good) {
|
||||
this.options = [{
|
||||
|
@ -282,6 +304,7 @@
|
|||
value: '2',
|
||||
text: '预览'
|
||||
},
|
||||
|
||||
]
|
||||
} else {
|
||||
this.options = [{
|
||||
|
@ -301,9 +324,6 @@
|
|||
text: '删除'
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
|
||||
this.ll++
|
||||
// console.log(this.ll)
|
||||
if (this.ll % 2 == 0) {
|
||||
|
@ -492,7 +512,6 @@
|
|||
that.loading = false;
|
||||
that.loaded = res.data.list.length < that.where.limit;
|
||||
that.productList.push.apply(that.productList, res.data.list);
|
||||
|
||||
that.where.page = that.where.page + 1;
|
||||
|
||||
},
|
||||
|
@ -558,6 +577,7 @@
|
|||
title: '下架成功',
|
||||
icon: 'none'
|
||||
})
|
||||
that.getList(this.mer_id,false)
|
||||
} else if (res.cancel) {
|
||||
// console.log('用户点击取消');
|
||||
}
|
||||
|
@ -578,6 +598,7 @@
|
|||
icon: 'success'
|
||||
}, () => {
|
||||
that.$set(item, 'is_show', item.is_show == 0 ? 1 : 0);
|
||||
that.getList(this.mer_id,false)
|
||||
});
|
||||
}).catch(err => {
|
||||
return that.$util.Tips({
|
||||
|
|
|
@ -1,498 +0,0 @@
|
|||
<template>
|
||||
<view :style="viewColor">
|
||||
<view class="container">
|
||||
<view class="main_content">
|
||||
<text class="title">评论 {{all}}</text>
|
||||
<image @click="close" class="closeBnt" src="../static/img/index/close.png" mode=""></image>
|
||||
<view class="main">
|
||||
<scroll-view :scroll-y="true" class="scroll-view">
|
||||
<view v-if="list.length > 0" @touchmove="onTouchmove" id="reply">
|
||||
<view class="common_list" v-for="(item, index) in list" :key="index">
|
||||
<view class="commen_one">
|
||||
<image :src="(item.author&&item.author.avatar) || '/static/images/f.png'" class="image"></image>
|
||||
</view>
|
||||
<view class="info_count">
|
||||
<view class="info">
|
||||
<view class="message" @click="toReply(item,index)">
|
||||
<text v-if="item.author" class="name">{{item.author.nickname}}</text>
|
||||
<text class="desc">{{item.content}}</text>
|
||||
<text class="time">{{item.create_time}}</text>
|
||||
</view>
|
||||
<view class="like" @click="starComment(item)">
|
||||
<image v-if="item.relevance_id" class="dianzan" src="../static/img/index/zan02.png"></image>
|
||||
<image v-else class="dianzan" src="../static/img/index/zan01.png"></image>
|
||||
|
||||
<text class="like-text">{{item.count_start}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view v-if="item.children && item.children.length > 0" class="reply_count">
|
||||
<view v-for="(itemn,indexn) in item.children" :key="indexn" class="reply_list">
|
||||
<view class="item">
|
||||
<view class="item_count" @click.stop="toReply(itemn,index)">
|
||||
<image class="image" :src="itemn.author && itemn.author.avatar || '/static/images/f.png'"></image>
|
||||
<text v-if="itemn.author" class="name_two">{{itemn.author.nickname}}</text>
|
||||
<view class="desc_two">
|
||||
<text class="reply_user" v-if="itemn.reply">回复 @{{itemn.reply.nickname}} </text>
|
||||
<text class="reply_text">{{itemn.content}}</text>
|
||||
</view>
|
||||
<text class="time_two">{{itemn.create_time}}</text>
|
||||
</view>
|
||||
<text class="like_two" @click.stop="starComment(itemn)">
|
||||
<text class="iconfont":class="itemn.relevance_id ? 'icon-yidianzan' : 'icon-dianzan1'"></text>
|
||||
{{itemn.count_start}}
|
||||
</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="end"><text class="before"></text><text class="text">到底了</text><text class="after"></text></view>
|
||||
</view>
|
||||
<Loading :loaded="loaded" :loading="loading"></Loading>
|
||||
<view v-if="list.length == 0 && !loading" class="empty">
|
||||
<image class="image" src="/static/images/no_commen.png"></image>
|
||||
<text class="text">暂无评论,快去抢沙发吧~</text>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
<view class="release_bar" :style="'bottom:'+bottom+'px;'">
|
||||
<image class="image" :src="userInfo.avatar || '/static/images/f.png'"></image>
|
||||
<view class="input_count">
|
||||
<textarea style="height: 20px; font-size: 15px; color: #000000;" type="text"
|
||||
:placeholder="placeholder"
|
||||
placeholder-style="color: #999999; font-size: 15px;"
|
||||
v-model="content" :auto-focus="autoFocus" :focus="focus" confirm-type="search"></textarea>
|
||||
</view>
|
||||
<text class="send" @click.stop="submitComment">发送</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { replyLstApi, starCommentApi, replyCreateApi } from '@/api/community.js';
|
||||
import Loading from '@/components/Loading/index.vue';
|
||||
import { getUserInfo } from '@/api/user.js';
|
||||
import authorize from '@/components/Authorize';
|
||||
import { mapGetters } from "vuex";
|
||||
import { configMap } from '@/utils';
|
||||
export default {
|
||||
props:{
|
||||
bottom: {
|
||||
type: Number,
|
||||
default: 0
|
||||
},
|
||||
userInfo: {
|
||||
type: Object,
|
||||
default: {}
|
||||
}
|
||||
},
|
||||
components: {
|
||||
Loading, authorize
|
||||
},
|
||||
computed: configMap({community_reply_auth:0},mapGetters(['isLogin', 'viewColor'])),
|
||||
data() {
|
||||
return {
|
||||
content: '',
|
||||
id: "",
|
||||
list: [],
|
||||
loaded: false,
|
||||
loading: false,
|
||||
where: {
|
||||
page: 1,
|
||||
limit: 10
|
||||
},
|
||||
reply_id: "",
|
||||
placeholder: "快来说点儿什么吧...",
|
||||
isChild: false,
|
||||
index: 0,
|
||||
listIndex: 0,
|
||||
focus: false,
|
||||
autoFocus: false,
|
||||
all: 0,
|
||||
isShowAuth: false, //是否隐藏授权
|
||||
isAuto: false, //没有授权的不会自动授权
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
let that=this;
|
||||
uni.$on('onReachBottom',function(data){
|
||||
that.getList()
|
||||
});
|
||||
},
|
||||
created() {
|
||||
let item = uni.getStorageSync("videoList");
|
||||
let index = uni.getStorageSync("videoIndex");
|
||||
this.getData(item,index)
|
||||
},
|
||||
// 滚动监听
|
||||
onPageScroll() {
|
||||
uni.$emit('scroll');
|
||||
},
|
||||
|
||||
methods: {
|
||||
// 授权回调
|
||||
onLoadFun() {
|
||||
this.isShowAuth = false
|
||||
},
|
||||
// 授权关闭
|
||||
authColse: function(e) {
|
||||
this.isShowAuth = e
|
||||
},
|
||||
// 点击关闭按钮
|
||||
close() {
|
||||
this.$emit('closeScrollview');
|
||||
},
|
||||
onTouchmove(e){
|
||||
if (this.loadend || this.loading) return;
|
||||
const query = uni.createSelectorQuery().in(this);
|
||||
query.select('#reply').boundingClientRect(data => {
|
||||
if(data.bottom < 1500) {
|
||||
this.getList();
|
||||
}
|
||||
}).exec();
|
||||
// 模拟触底刷新
|
||||
},
|
||||
getData(item,index){
|
||||
this.id = item.community_id
|
||||
this.loading = this.loaded = false
|
||||
this.where.page = 1
|
||||
this.list = []
|
||||
this.getList()
|
||||
this.listIndex = index
|
||||
},
|
||||
getList(){
|
||||
let that = this;
|
||||
if(that.loading || that.loaded) return;
|
||||
that.loading = true;
|
||||
replyLstApi(that.id,that.where).then(res => {
|
||||
that.loading = false;
|
||||
that.all = res.data.all;
|
||||
that.loaded = res.data.list.length < that.where.limit;
|
||||
that.list.push.apply(that.list, res.data.list);
|
||||
that.where.page = that.where.page + 1;
|
||||
},
|
||||
error => {
|
||||
that.$util.Tips({
|
||||
title: error.msg
|
||||
})
|
||||
}
|
||||
);
|
||||
},
|
||||
/*发表评论*/
|
||||
submitComment(){
|
||||
let that = this;
|
||||
if (that.isLogin === false) {
|
||||
that.isAuto = true;
|
||||
that.isShowAuth = true;
|
||||
uni.hideKeyboard();
|
||||
}else{
|
||||
that.getUserInfo();
|
||||
}
|
||||
},
|
||||
/**
|
||||
* 获取个人用户信息
|
||||
*/
|
||||
getUserInfo: function() {
|
||||
let that = this;
|
||||
getUserInfo().then(res => {
|
||||
that.userInfo = res.data;
|
||||
/*判断是否绑定手机号*/
|
||||
if(res.data.phone || that.community_reply_auth == 0){
|
||||
that.createReply()
|
||||
}else{
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '请先绑定手机号',
|
||||
success: function (res) {
|
||||
if (res.confirm) {
|
||||
uni.navigateTo({
|
||||
url: '/pages/users/user_phone/index?type=1'
|
||||
})
|
||||
}else if (res.cancel) {
|
||||
uni.showToast({
|
||||
title: '已取消',
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
},
|
||||
createReply() {
|
||||
let that = this;
|
||||
let reply_id = that.reply_id ? that.reply_id : 0
|
||||
replyCreateApi(that.id,{content: that.content,reply_id: reply_id}).then(res => {
|
||||
// console.log(res.message)
|
||||
if(res.status == 1){
|
||||
if(that.isChild){
|
||||
if(that.list[that.index]['children']){
|
||||
that.list[that.index]['children'].push(res.data)
|
||||
}else{
|
||||
that.list[that.index]['children'] = [res.data]
|
||||
}
|
||||
}else{
|
||||
that.list.unshift(res.data)
|
||||
}
|
||||
that.all++
|
||||
}
|
||||
that.content = ""
|
||||
that.$util.Tips({
|
||||
title: res.message
|
||||
});
|
||||
that.loseFocus()
|
||||
}).catch(err => {
|
||||
uni.showToast({
|
||||
title: err,
|
||||
icon: 'none'
|
||||
})
|
||||
});
|
||||
},
|
||||
toReply(item,index){
|
||||
this.content = ""
|
||||
this.placeholder = '回复:'+item.author.nickname
|
||||
// console.log(this.placeholder)
|
||||
this.reply_id = item.reply_id
|
||||
this.isChild = true
|
||||
this.index = index;
|
||||
this.focus = true;
|
||||
this.autoFocus = true;
|
||||
},
|
||||
loseFocus(){
|
||||
this.focus = false;
|
||||
this.autoFocus = false;
|
||||
this.reply_id = 0;
|
||||
this.placeholder = "快来说点儿什么吧..."
|
||||
this.isChild = false
|
||||
// this.content = ""
|
||||
},
|
||||
/*点赞评论*/
|
||||
starComment(item){
|
||||
let that = this;
|
||||
let status = item.relevance_id ? 0 : 1
|
||||
starCommentApi(item.reply_id,{status: status}).then(res => {
|
||||
if (res.status === 200) {
|
||||
if(item.relevance_id){
|
||||
item.count_start--;
|
||||
item.count_start = item.count_start == 0 ? 0 : item.count_start
|
||||
item.relevance_id = false
|
||||
}else{
|
||||
item.count_start++;
|
||||
item.relevance_id = true
|
||||
}
|
||||
}
|
||||
that.$util.Tips({
|
||||
title: res.message
|
||||
});
|
||||
}).catch(err => {
|
||||
uni.showToast({
|
||||
title: err,
|
||||
icon: 'none'
|
||||
})
|
||||
});
|
||||
},
|
||||
closepoup(){
|
||||
this.$refs.bindmobile.close()
|
||||
},
|
||||
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.main_content{
|
||||
padding: 12px 15rpx;
|
||||
border-bottom: 2px solid #F5F5F5;
|
||||
position: relative;
|
||||
}
|
||||
.header{
|
||||
width: 750rpx;
|
||||
position: relative;
|
||||
text-align: center;
|
||||
}
|
||||
.title{
|
||||
text-align: center;
|
||||
flex-direction: row;
|
||||
color: #282828;
|
||||
font-size: 36rpx;
|
||||
font-weight: bold;
|
||||
}
|
||||
.closeBnt{
|
||||
position: absolute;
|
||||
right: 30rpx;
|
||||
top: 30rpx;
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
}
|
||||
.scroll-view{
|
||||
height: 600px;
|
||||
padding-bottom: 240px;
|
||||
}
|
||||
.main{
|
||||
margin-top: 30px;
|
||||
padding-bottom: 10px;
|
||||
// position: sticky;
|
||||
.common_list{
|
||||
position: relative;
|
||||
padding-left: 50px;
|
||||
margin-bottom: 15px;
|
||||
.commen_one{
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
.image{
|
||||
width: 74rpx;
|
||||
height: 74rpx;
|
||||
border-radius: 100%;
|
||||
}
|
||||
|
||||
}
|
||||
.info{
|
||||
position: relative;
|
||||
padding-right: 90rpx;
|
||||
width: 630rpx;
|
||||
}
|
||||
.name,.name_two{
|
||||
color: #999999;
|
||||
font-size: 26rpx;
|
||||
}
|
||||
.desc,.desc_two{
|
||||
color: #282828;
|
||||
font-size: 28rpx;
|
||||
margin-top: 10rpx;
|
||||
}
|
||||
.desc_two{
|
||||
.reply_user{
|
||||
font-size: 24rpx;
|
||||
color: #4A8AC9;
|
||||
margin: 0 6rpx;
|
||||
}
|
||||
.reply_text{
|
||||
font-size: 26rpx;
|
||||
color: #282828;
|
||||
}
|
||||
}
|
||||
.time,.time_two{
|
||||
color: #BBBBBB;
|
||||
font-size: 22rpx;
|
||||
margin-top: 15rpx;
|
||||
}
|
||||
.like,.like_two{
|
||||
text-align: center;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
width: 75rpx;
|
||||
|
||||
.like-text{
|
||||
color: #999999;
|
||||
font-size: 13px;
|
||||
margin-top: 2px;
|
||||
}
|
||||
.dianzan{
|
||||
width: 13px;
|
||||
height: 13px;
|
||||
}
|
||||
}
|
||||
.reply_list{
|
||||
margin-top: 20rpx;
|
||||
.item{
|
||||
padding-right: 140rpx;
|
||||
position: relative;
|
||||
}
|
||||
.item_count{
|
||||
position: relative;
|
||||
padding-left: 56rpx;
|
||||
.image{
|
||||
width: 36rpx;
|
||||
height: 36rpx;
|
||||
border-radius: 100%;
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.end{
|
||||
margin: 50rpx 0;
|
||||
text-align: center;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
.text{
|
||||
color: #999999;
|
||||
font-size: 22rpx;
|
||||
position: relative;
|
||||
.before,.after{
|
||||
display: flex;
|
||||
width: 22rpx;
|
||||
height: 1rpx;
|
||||
background: #999999;
|
||||
position: absolute;
|
||||
top: 18rpx;
|
||||
opacity: .5;
|
||||
}
|
||||
.before{
|
||||
left: -30rpx;
|
||||
}
|
||||
.after{
|
||||
right: -30rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.release_bar{
|
||||
position: fixed;
|
||||
width: 100%;
|
||||
left: 0;
|
||||
background: #ffffff;
|
||||
display: flex;
|
||||
// align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 30rpx 60rpx;
|
||||
padding-bottom: 100rpx;
|
||||
border-top: 1rpx solid #F5F5F5;
|
||||
flex-direction: row;
|
||||
width:750rpx;
|
||||
.image{
|
||||
width: 54rpx;
|
||||
height: 54rpx;
|
||||
border-radius: 100%;
|
||||
}
|
||||
.input_count{
|
||||
width: 480rpx;
|
||||
background: #F7F7F7;
|
||||
border-radius: 31rpx;
|
||||
padding: 15rpx 30rpx;
|
||||
}
|
||||
.send{
|
||||
font-size: 26rpx;
|
||||
color: #ffffff;
|
||||
padding: 12rpx 30rpx;
|
||||
background: #E93323;
|
||||
border-radius: 30rpx;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
.empty{
|
||||
display: flex;
|
||||
margin: 130rpx 0 150rpx;
|
||||
text-align: center;
|
||||
align-items: center;
|
||||
// flex-direction: row;
|
||||
.image{
|
||||
display: flex;
|
||||
width: 414rpx;
|
||||
height: 305rpx;
|
||||
}
|
||||
.text{
|
||||
display: flex;
|
||||
color: #999999;
|
||||
font-size: 26rpx;
|
||||
}
|
||||
}
|
||||
</style>
|
Before Width: | Height: | Size: 130 KiB |
Before Width: | Height: | Size: 673 B |
Before Width: | Height: | Size: 1.1 KiB |
Before Width: | Height: | Size: 551 B |
Before Width: | Height: | Size: 421 B |
Before Width: | Height: | Size: 43 KiB |
Before Width: | Height: | Size: 2.4 KiB |
Before Width: | Height: | Size: 2.9 KiB |
Before Width: | Height: | Size: 471 B |
Before Width: | Height: | Size: 642 B |
Before Width: | Height: | Size: 691 B |
Before Width: | Height: | Size: 591 B |
Before Width: | Height: | Size: 654 B |
Before Width: | Height: | Size: 2.4 KiB |
Before Width: | Height: | Size: 542 B |
Before Width: | Height: | Size: 521 B |
Before Width: | Height: | Size: 944 B |
Before Width: | Height: | Size: 747 B |
|
@ -1,185 +0,0 @@
|
|||
<template>
|
||||
<view :style="viewColor">
|
||||
<view class="container">
|
||||
<view class="header">
|
||||
<text class="title">TA提到的宝贝</text>
|
||||
<image @click="closePopup" class="closeBnt" src="../static/img/index/close.png" mode=""></image>
|
||||
</view>
|
||||
<view class="main_count" :class="isHome ? 'mb90' : ''">
|
||||
<scroll-view scroll-y="true" class="scroll-view">
|
||||
<view v-for="(item, index) in list" :key="index" @click="goDetail(item.spu)" class="list">
|
||||
<view class="pro_list">
|
||||
<view class="picture">
|
||||
<image :src="item.spu && item.spu.image" class="image"></image>
|
||||
</view>
|
||||
<view class="info">
|
||||
<text class="name line2" v-if="item.spu && item.spu.store_name.length>=32">{{item.spu.store_name.slice(0,32)}}...</text>
|
||||
<text class="name line2" v-else>{{item.spu && item.spu.store_name}}</text>
|
||||
<view class="bottom">
|
||||
<view v-if="item.spu" class="price"><text class="sm">¥</text><text class="text">{{item.spu.price}}</text></view>
|
||||
<text class="buy-btn">立即购买</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</scroll-view>
|
||||
</view>
|
||||
</view>
|
||||
<view class='mask' catchtouchmove="true" :hidden='popup.show==false' @tap="closePopup"></view>
|
||||
</view>
|
||||
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { goShopDetail } from '@/libs/order.js'
|
||||
import { mapGetters } from "vuex";
|
||||
export default {
|
||||
computed:{
|
||||
...mapGetters(['viewColor']),
|
||||
},
|
||||
props:{
|
||||
list: {
|
||||
type: Array,
|
||||
default: []
|
||||
},
|
||||
uid: {
|
||||
type: Number,
|
||||
},
|
||||
isHome: {
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
data() {
|
||||
|
||||
return {
|
||||
popup: {
|
||||
show: false
|
||||
},
|
||||
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
// 点击关闭按钮
|
||||
closePopup() {
|
||||
this.$emit('close');
|
||||
},
|
||||
goDetail(item){
|
||||
if (item.product_type === 1) {
|
||||
uni.navigateTo({
|
||||
url: `/pages/activity/goods_seckill_details/index?id=${item.product_id}&time=${item.stop_time}&spid=${this.uid}`
|
||||
})
|
||||
} else if (item.product_type === 2) {
|
||||
uni.navigateTo({
|
||||
url: `/pages/activity/presell_details/index?id=${item.activity_id}&spid=${this.uid}`
|
||||
})
|
||||
} else if (item.product_type === 0) {
|
||||
uni.navigateTo({
|
||||
url: `/pages/goods_details/index?id=${item.product_id}&spid=${this.uid}`
|
||||
})
|
||||
}else if (item.product_type === 4) {
|
||||
uni.navigateTo({
|
||||
url: `/pages/activity/combination_details/index?id=${item.activity_id}&spid=${this.uid}`
|
||||
})
|
||||
}else if (item.product_type === 40) {
|
||||
uni.navigateTo({
|
||||
url: `/pages/activity/combination_status/index?id=${item.activity_id}&spid=${this.uid}`
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.container{
|
||||
width: 750rpx;
|
||||
background-color: #ffffff;
|
||||
border-radius: 16rpx 16rpx 0 0;
|
||||
|
||||
.header{
|
||||
position: relative;
|
||||
padding: 40rpx 30rpx;
|
||||
.title{
|
||||
// color: #282828;
|
||||
font-size: 30rpx;
|
||||
}
|
||||
.closeBnt{
|
||||
position: absolute;
|
||||
right: 30rpx;
|
||||
top: 30rpx;
|
||||
width: 30rpx;
|
||||
height: 30rpx;
|
||||
}
|
||||
}
|
||||
.scroll-view{
|
||||
max-height: 800rpx;
|
||||
}
|
||||
.main_count{
|
||||
padding: 0 30rpx 30rpx;
|
||||
max-height: 800rpx;
|
||||
overflow-y: scroll;
|
||||
.list{
|
||||
margin-bottom: 40rpx;
|
||||
flex-direction: row;
|
||||
&:last-child{
|
||||
margin-bottom: 0;
|
||||
}
|
||||
}
|
||||
.pro_list{
|
||||
display: flex;
|
||||
flex-direction: row;
|
||||
.picture,.image{
|
||||
width: 200rpx;
|
||||
height: 200rpx;
|
||||
border-radius: 16rpx;
|
||||
}
|
||||
.info{
|
||||
margin-left: 30rpx;
|
||||
position: relative;
|
||||
.name{
|
||||
color: #282828;
|
||||
font-size: 30rpx;
|
||||
line-height: 44rpx;
|
||||
display: flex;
|
||||
width: 460rpx;
|
||||
}
|
||||
.bottom{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
width: 460rpx;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: 10rpx;
|
||||
flex-direction: row;
|
||||
}
|
||||
.price{
|
||||
flex-direction: row;
|
||||
align-items: flex-end;
|
||||
.sm{
|
||||
font-weight: bold;
|
||||
color: #FF6D20;
|
||||
font-size: 26rpx;
|
||||
}
|
||||
.text{
|
||||
font-weight: bold;
|
||||
color: #FF6D20;
|
||||
font-size: 34rpx;
|
||||
}
|
||||
}
|
||||
.buy-btn{
|
||||
border-radius: 26rpx;
|
||||
padding: 10rpx 20rpx;
|
||||
text-align: center;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
font-size: 24rpx;
|
||||
color: #fff;
|
||||
background: #FF6D20;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
Before Width: | Height: | Size: 673 B |
Before Width: | Height: | Size: 1.1 KiB |
Before Width: | Height: | Size: 551 B |
Before Width: | Height: | Size: 421 B |
Before Width: | Height: | Size: 43 KiB |
Before Width: | Height: | Size: 2.4 KiB |
Before Width: | Height: | Size: 2.9 KiB |
Before Width: | Height: | Size: 10 KiB |
Before Width: | Height: | Size: 471 B |
Before Width: | Height: | Size: 642 B |
Before Width: | Height: | Size: 691 B |
Before Width: | Height: | Size: 591 B |
Before Width: | Height: | Size: 654 B |
Before Width: | Height: | Size: 2.4 KiB |
Before Width: | Height: | Size: 542 B |
Before Width: | Height: | Size: 521 B |
Before Width: | Height: | Size: 2.1 KiB |
|
@ -1,54 +1,62 @@
|
|||
const mp = uni.requireNativePlugin('uniMP');
|
||||
import {
|
||||
uniMPgetLocation,
|
||||
test
|
||||
uniMPgetLocation,
|
||||
test
|
||||
} from "@/utils/uniMPfunction.js"
|
||||
|
||||
export const initEvent = () => {
|
||||
mp.onUniMPEventReceive(async (ret) => {
|
||||
console.log('小程序事件: ', ret);
|
||||
if (ret.event == 'closeApp') {
|
||||
mp.closeUniMP(ret.fromAppid, (ret) => {
|
||||
console.log('closeUniMP: ' + JSON.stringify(ret));
|
||||
});
|
||||
}
|
||||
if (ret.event == 'getLocation') {
|
||||
try {
|
||||
console.log('获取定位');
|
||||
let res = await uniMPgetLocation();
|
||||
console.log(res);
|
||||
// plus.geolocation.getCurrentPosition(function(position) {
|
||||
// console.log('经度:' + position.coords.longitude);
|
||||
// console.log('纬度:' + position.coords.latitude);
|
||||
// // that.markers[1].latitude = position.coords.longitude;
|
||||
// // that.markers[1].longitude = position.coords.longitude;
|
||||
// mp.sendUniMPEvent(
|
||||
// ret.fromAppid,
|
||||
// 'getLocation', {...position.coords},
|
||||
// (ret) => {
|
||||
// console.log('Host sendEvent: ' + JSON.stringify(ret));
|
||||
// });
|
||||
// }, function(error) {
|
||||
// console.error('获取位置失败:', error.message);
|
||||
// }, {provider:'gps'});
|
||||
mp.sendUniMPEvent(
|
||||
ret.fromAppid,
|
||||
'getLocation', {...res},
|
||||
(ret) => {
|
||||
console.log('Host sendEvent: ' + JSON.stringify(ret));
|
||||
});
|
||||
} catch (e) {
|
||||
console.log(e);
|
||||
}
|
||||
}
|
||||
if (ret.event == 'test') {
|
||||
console.log('测试');
|
||||
mp.sendUniMPEvent(
|
||||
ret.fromAppid,
|
||||
'test', { 'key': 'value', 'name': 'data' },
|
||||
(ret) => {
|
||||
console.log('Host sendEvent: ' + JSON.stringify(ret));
|
||||
});
|
||||
}
|
||||
});
|
||||
mp.onUniMPEventReceive(async (ret) => {
|
||||
console.log('小程序事件: ', ret);
|
||||
if (ret.event == 'closeApp') {
|
||||
mp.closeUniMP(ret.fromAppid, (ret) => {
|
||||
console.log('closeUniMP: ' + JSON.stringify(ret));
|
||||
});
|
||||
}
|
||||
if (ret.event == 'getLocation') {
|
||||
try {
|
||||
console.log('获取定位');
|
||||
let res = await uniMPgetLocation();
|
||||
console.log(res);
|
||||
// plus.geolocation.getCurrentPosition(function(position) {
|
||||
// console.log('经度:' + position.coords.longitude);
|
||||
// console.log('纬度:' + position.coords.latitude);
|
||||
// // that.markers[1].latitude = position.coords.longitude;
|
||||
// // that.markers[1].longitude = position.coords.longitude;
|
||||
// mp.sendUniMPEvent(
|
||||
// ret.fromAppid,
|
||||
// 'getLocation', {...position.coords},
|
||||
// (ret) => {
|
||||
// console.log('Host sendEvent: ' + JSON.stringify(ret));
|
||||
// });
|
||||
// }, function(error) {
|
||||
// console.error('获取位置失败:', error.message);
|
||||
// }, {provider:'gps'});
|
||||
mp.sendUniMPEvent(
|
||||
ret.fromAppid,
|
||||
'getLocation', {
|
||||
...res
|
||||
},
|
||||
(ret) => {
|
||||
console.log('Host sendEvent: ' + JSON.stringify(ret));
|
||||
});
|
||||
} catch (e) {
|
||||
console.log(e);
|
||||
}
|
||||
}
|
||||
if (ret.event == 'test') {
|
||||
console.log('测试');
|
||||
mp.sendUniMPEvent(
|
||||
ret.fromAppid,
|
||||
'test', {
|
||||
'key': 'value',
|
||||
'name': 'data'
|
||||
},
|
||||
(ret) => {
|
||||
console.log('Host sendEvent: ' + JSON.stringify(ret));
|
||||
});
|
||||
}
|
||||
if (ret.event == 'log') {
|
||||
console.log('收到小程序事件: ' + JSON.stringify(ret));
|
||||
}
|
||||
});
|
||||
}
|