代码更新
This commit is contained in:
jia
parent
48e28824c0
commit
cec9c9720e
62
App.vue
62
App.vue
@ -148,7 +148,7 @@
|
|||||||
that.getConfigData()
|
that.getConfigData()
|
||||||
|
|
||||||
//#ifdef APP-PLUS
|
//#ifdef APP-PLUS
|
||||||
this.checknetwork()
|
|
||||||
|
|
||||||
jpushModule.setLoggerEnable(true);
|
jpushModule.setLoggerEnable(true);
|
||||||
jpushModule.initJPushService()
|
jpushModule.initJPushService()
|
||||||
@ -247,66 +247,6 @@
|
|||||||
},
|
},
|
||||||
|
|
||||||
methods: {
|
methods: {
|
||||||
//网络检测
|
|
||||||
checknetwork() {
|
|
||||||
|
|
||||||
uni.onNetworkStatusChange(function(res) {
|
|
||||||
|
|
||||||
if (res.isConnected) {
|
|
||||||
|
|
||||||
uni.reLaunch({
|
|
||||||
url: '/pages/index/index'
|
|
||||||
})
|
|
||||||
|
|
||||||
} else {
|
|
||||||
|
|
||||||
uni.showModal({
|
|
||||||
|
|
||||||
title: '系统提示',
|
|
||||||
|
|
||||||
content: '当前设备无网络或网络较差',
|
|
||||||
|
|
||||||
cancelText: '取消',
|
|
||||||
|
|
||||||
confirmText: '确定',
|
|
||||||
|
|
||||||
success: (res) => {
|
|
||||||
|
|
||||||
if (res.confirm) {
|
|
||||||
|
|
||||||
uni.reLaunch({
|
|
||||||
|
|
||||||
url: '/pages/index/index'
|
|
||||||
|
|
||||||
})
|
|
||||||
|
|
||||||
} else {
|
|
||||||
|
|
||||||
// #ifdef H5
|
|
||||||
|
|
||||||
uni.navigateTo({
|
|
||||||
url: '/pages/users/login/login_copy'
|
|
||||||
})
|
|
||||||
|
|
||||||
// #endif
|
|
||||||
|
|
||||||
// #ifdef APP-PLUS
|
|
||||||
|
|
||||||
plus.runtime.quit()
|
|
||||||
|
|
||||||
// #endif
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
})
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
})
|
|
||||||
|
|
||||||
},
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|||||||
@ -10,6 +10,8 @@ let httpApiThree
|
|||||||
// let httpApi = 'http://192.168.31.110:8324' // 测试
|
// let httpApi = 'http://192.168.31.110:8324' // 测试
|
||||||
if (process.env.NODE_ENV === "development") {
|
if (process.env.NODE_ENV === "development") {
|
||||||
// httpApi = 'https://shop.lihaink.cn' // 生产
|
// httpApi = 'https://shop.lihaink.cn' // 生产
|
||||||
|
// httpApi = 'https://test.shop.lihaink.cn' //预发布环境
|
||||||
|
|
||||||
httpApi = "https://crmeb-test.shop.lihaink.cn"
|
httpApi = "https://crmeb-test.shop.lihaink.cn"
|
||||||
// httpApi = "http://192.168.0.222"
|
// httpApi = "http://192.168.0.222"
|
||||||
// httpApi = "http://192.168.0.108:8325"
|
// httpApi = "http://192.168.0.108:8325"
|
||||||
@ -25,7 +27,9 @@ if (process.env.NODE_ENV === "development") {
|
|||||||
|
|
||||||
// #endif
|
// #endif
|
||||||
} else if (process.env.NODE_ENV === 'production') {
|
} else if (process.env.NODE_ENV === 'production') {
|
||||||
httpApi = 'https://shop.lihaink.cn' // 生产
|
// httpApi = 'https://shop.lihaink.cn' // 生产
|
||||||
|
|
||||||
|
httpApi ='https://test.shop.lihaink.cn' //预发布环境
|
||||||
|
|
||||||
// httpApi = "https://crmeb-test.shop.lihaink.cn"
|
// httpApi = "https://crmeb-test.shop.lihaink.cn"
|
||||||
httpApiTwo = 'https://nk.lihaink.cn' // 生产
|
httpApiTwo = 'https://nk.lihaink.cn' // 生产
|
||||||
|
|||||||
@ -2,8 +2,8 @@
|
|||||||
"name" : "惠农生活",
|
"name" : "惠农生活",
|
||||||
"appid" : "__UNI__3A527D1",
|
"appid" : "__UNI__3A527D1",
|
||||||
"description" : "",
|
"description" : "",
|
||||||
"versionName" : "1.4.1",
|
"versionName" : "1.3.9",
|
||||||
"versionCode" : 141,
|
"versionCode" : 139,
|
||||||
"transformPx" : false,
|
"transformPx" : false,
|
||||||
/* 5+App特有相关 */
|
/* 5+App特有相关 */
|
||||||
"app-plus" : {
|
"app-plus" : {
|
||||||
|
|||||||
11
pages.json
11
pages.json
@ -28,6 +28,14 @@
|
|||||||
// },
|
// },
|
||||||
// // #endif
|
// // #endif
|
||||||
//pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages
|
//pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages
|
||||||
|
{
|
||||||
|
"path": "pages/moreProject/moreProject",
|
||||||
|
"style": {
|
||||||
|
"navigationBarTitleText": "更多功能",
|
||||||
|
"enablePullDownRefresh": false
|
||||||
|
}
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
{
|
{
|
||||||
"path": "pages/index/index",
|
"path": "pages/index/index",
|
||||||
@ -148,7 +156,8 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
"subPackages": [{
|
"subPackages": [
|
||||||
|
{
|
||||||
"root": "pages/goods_cate",
|
"root": "pages/goods_cate",
|
||||||
"name": "goods_cate",
|
"name": "goods_cate",
|
||||||
"pages": [{
|
"pages": [{
|
||||||
|
|||||||
1040
pages/annex/vip_center/index.vue
Normal file
1040
pages/annex/vip_center/index.vue
Normal file
File diff suppressed because one or more lines are too long
61
pages/annex/vip_clause/index.vue
Normal file
61
pages/annex/vip_clause/index.vue
Normal file
@ -0,0 +1,61 @@
|
|||||||
|
<template>
|
||||||
|
<view class="cont">
|
||||||
|
<!-- <view v-html="agreement"></view> -->
|
||||||
|
<jyf-parser :html="agreement" ref="article" :tag-style="tagStyle"></jyf-parser>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import {
|
||||||
|
getAgreementApi
|
||||||
|
} from '@/api/user.js';
|
||||||
|
import parser from "@/components/jyf-parser/jyf-parser";
|
||||||
|
export default {
|
||||||
|
components: {
|
||||||
|
"jyf-parser": parser,
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
agreement: '',
|
||||||
|
tagStyle: {
|
||||||
|
img: 'width:100%;display:block;'
|
||||||
|
},
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onLoad() {
|
||||||
|
this.memberCard();
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
memberCard() {
|
||||||
|
uni.showLoading({
|
||||||
|
title: '加载中'
|
||||||
|
});
|
||||||
|
let that = this
|
||||||
|
getAgreementApi('sys_svip').then(res => {
|
||||||
|
that.agreement = res.data.sys_svip
|
||||||
|
uni.hideLoading();
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
page {
|
||||||
|
background-color: #FFFFFF;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
||||||
|
<style scoped>
|
||||||
|
.title {
|
||||||
|
padding-top: 60rpx;
|
||||||
|
font-size: 30rpx;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
.cont {
|
||||||
|
padding: 50rpx 30rpx;
|
||||||
|
}
|
||||||
|
/deep/img{
|
||||||
|
max-width: 100%!important;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
338
pages/annex/vip_grade/index.vue
Normal file
338
pages/annex/vip_grade/index.vue
Normal file
@ -0,0 +1,338 @@
|
|||||||
|
<template>
|
||||||
|
<view class="vipGrade">
|
||||||
|
<view class="headerBg">
|
||||||
|
<view class="header" v-if="info.user">
|
||||||
|
<view class="top acea-row row-middle">
|
||||||
|
<view class="pictrue">
|
||||||
|
<image :src="info.user.avatar"></image>
|
||||||
|
</view>
|
||||||
|
<view class="text">
|
||||||
|
<view class="name acea-row row-middle">
|
||||||
|
<view class="nameCon line1">{{info.user.nickname}}</view>
|
||||||
|
<view v-if="info.level_info.grade" class="num">lv.{{info.level_info.grade}}</view>
|
||||||
|
</view>
|
||||||
|
<view class="idNum">ID：{{info.user.uid}}</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="list acea-row row-around row-middle">
|
||||||
|
<view class="item">
|
||||||
|
<view class="num">{{info.user.now_money}}</view>
|
||||||
|
<view>余额</view>
|
||||||
|
</view>
|
||||||
|
<view class="item">
|
||||||
|
<view class="num">{{info.user.integral}}</view>
|
||||||
|
<view>积分</view>
|
||||||
|
</view>
|
||||||
|
<view class="item">
|
||||||
|
<view class="num">{{ info.level_info.discount ? parseFloat(info.level_info.discount)/10 : '0'}}</view>
|
||||||
|
<view>折扣</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="qrCode">
|
||||||
|
<view class="header acea-row row-between-wrapper">
|
||||||
|
<view class="title" :class="{'on': codeIndex == index,'onLeft':codeIndex == 1}"
|
||||||
|
v-for="(item, index) in codeList" :key="index" @click="tapCode(index)">{{item.name}}</view>
|
||||||
|
</view>
|
||||||
|
<view class="acea-row row-center-wrapper" style="margin-top: 35rpx;">
|
||||||
|
<w-qrcode :options="config.qrc" @generate="hello"></w-qrcode>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="store acea-row row-between-wrapper" v-if="storeList.length">
|
||||||
|
<view class="title">
|
||||||
|
<text class="iconfont icon-mendian1"></text>
|
||||||
|
附近门店
|
||||||
|
</view>
|
||||||
|
<view class="acea-row" @click="goMap">
|
||||||
|
距 <view class="storeName line1">{{storeList[0].name}}</view> {{storeList[0].range}}km<text class="iconfont icon-gengduo3"></text></view>
|
||||||
|
</view>
|
||||||
|
<home v-if="navigation"></home>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
import home from '@/components/home/index.vue'
|
||||||
|
|
||||||
|
import {
|
||||||
|
getlevelInfo,
|
||||||
|
getRandCode
|
||||||
|
} from '@/api/user.js';
|
||||||
|
import {
|
||||||
|
storeListApi
|
||||||
|
} from "@/api/store";
|
||||||
|
export default {
|
||||||
|
components: {
|
||||||
|
home
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
info:{},
|
||||||
|
codeList: [{
|
||||||
|
name: '付款码'
|
||||||
|
}, {
|
||||||
|
name: '核销码'
|
||||||
|
}],
|
||||||
|
codeIndex:0,
|
||||||
|
config: {
|
||||||
|
qrc: {
|
||||||
|
code: '',
|
||||||
|
size: 380, // 二维码大小
|
||||||
|
level: 3, //等级 0～4
|
||||||
|
bgColor: '#FFFFFF', //二维码背景色 默认白色
|
||||||
|
border: {
|
||||||
|
color: ['#eee', '#eee'], //边框颜色支持渐变色
|
||||||
|
lineWidth: 1, //边框宽度
|
||||||
|
},
|
||||||
|
color: ['#333', '#333'], //边框颜色支持渐变色
|
||||||
|
}
|
||||||
|
},
|
||||||
|
user_latitude: 0,
|
||||||
|
user_longitude: 0,
|
||||||
|
storeList: []
|
||||||
|
};
|
||||||
|
},
|
||||||
|
onLoad() {
|
||||||
|
this.levelInfo();
|
||||||
|
this.getCode();
|
||||||
|
try {
|
||||||
|
this.user_latitude = uni.getStorageSync('user_latitude');
|
||||||
|
this.user_longitude = uni.getStorageSync('user_longitude');
|
||||||
|
} catch (e) {}
|
||||||
|
},
|
||||||
|
onReady() {},
|
||||||
|
onShow() {
|
||||||
|
uni.removeStorageSync('form_type_cart');
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
if (this.user_latitude && this.user_longitude) {
|
||||||
|
this.getList();
|
||||||
|
} else {
|
||||||
|
this.selfLocation();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
goMap(){
|
||||||
|
uni.navigateTo({
|
||||||
|
url: '/pages/store/map/index'
|
||||||
|
})
|
||||||
|
},
|
||||||
|
selfLocation() {
|
||||||
|
let self = this
|
||||||
|
// #ifdef H5
|
||||||
|
if (self.$wechat.isWeixin()) {
|
||||||
|
self.$wechat.location().then(res => {
|
||||||
|
this.user_latitude = res.latitude;
|
||||||
|
this.user_longitude = res.longitude;
|
||||||
|
uni.setStorageSync('user_latitude', res.latitude);
|
||||||
|
uni.setStorageSync('user_longitude', res.longitude);
|
||||||
|
self.getList();
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
// #endif
|
||||||
|
uni.getLocation({
|
||||||
|
type: 'wgs84',
|
||||||
|
success: (res) => {
|
||||||
|
try {
|
||||||
|
this.user_latitude = res.latitude;
|
||||||
|
this.user_longitude = res.longitude;
|
||||||
|
uni.setStorageSync('user_latitude', res.latitude);
|
||||||
|
uni.setStorageSync('user_longitude', res.longitude);
|
||||||
|
} catch {}
|
||||||
|
self.getList();
|
||||||
|
},
|
||||||
|
complete: function() {
|
||||||
|
self.getList();
|
||||||
|
}
|
||||||
|
});
|
||||||
|
// #ifdef H5
|
||||||
|
}
|
||||||
|
// #endif
|
||||||
|
},
|
||||||
|
// 获取门店列表数据
|
||||||
|
getList: function() {
|
||||||
|
let data = {
|
||||||
|
latitude: this.user_latitude || "", //纬度
|
||||||
|
longitude: this.user_longitude || "", //经度
|
||||||
|
page: 1,
|
||||||
|
limit: 1
|
||||||
|
};
|
||||||
|
storeListApi(data)
|
||||||
|
.then(res => {
|
||||||
|
this.storeList = res.data.list.list;
|
||||||
|
})
|
||||||
|
.catch(err => {
|
||||||
|
this.$util.Tips({
|
||||||
|
title: err
|
||||||
|
})
|
||||||
|
});
|
||||||
|
},
|
||||||
|
getCode() {
|
||||||
|
getRandCode().then(res => {
|
||||||
|
let code = res.data.code;
|
||||||
|
this.config.qrc.code = code;
|
||||||
|
}).catch(err => {
|
||||||
|
return this.$util.Tips(err);
|
||||||
|
})
|
||||||
|
},
|
||||||
|
levelInfo(){
|
||||||
|
getlevelInfo().then(res=>{
|
||||||
|
this.info = res.data;
|
||||||
|
}).catch(err=>{
|
||||||
|
return this.$util.Tips({
|
||||||
|
title: err
|
||||||
|
});
|
||||||
|
})
|
||||||
|
},
|
||||||
|
tapCode(index) {
|
||||||
|
this.codeIndex = index;
|
||||||
|
if (index == 0) {
|
||||||
|
this.getCode();
|
||||||
|
} else {
|
||||||
|
let code = this.info.user.bar_code;
|
||||||
|
this.config.qrc.code = code;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
hello(res) {
|
||||||
|
},
|
||||||
|
},
|
||||||
|
onReachBottom() {
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
page{
|
||||||
|
background: linear-gradient(121deg, #F5EBE1 0%, #FFDFBE 100%);
|
||||||
|
}
|
||||||
|
.vipGrade{
|
||||||
|
.headerBg{
|
||||||
|
background: url('../static/big-bg.png') no-repeat;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
width: 100%;
|
||||||
|
height: 476rpx;
|
||||||
|
padding-top: 1rpx;
|
||||||
|
.header{
|
||||||
|
background: url('../static/grade-bg.png') no-repeat;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
width: 690rpx;
|
||||||
|
height: 286rpx;
|
||||||
|
margin: 26rpx auto;
|
||||||
|
padding: 28rpx 28rpx 0 28rpx;
|
||||||
|
.top{
|
||||||
|
.pictrue{
|
||||||
|
width: 92rpx;
|
||||||
|
height: 92rpx;
|
||||||
|
border: 1px solid #FFFFFF;
|
||||||
|
margin-right: 20rpx;
|
||||||
|
border-radius: 50%;
|
||||||
|
image{
|
||||||
|
border-radius: 50%;
|
||||||
|
width:100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.text{
|
||||||
|
width: 400rpx;
|
||||||
|
.name{
|
||||||
|
.nameCon{
|
||||||
|
color: #EDCAAC;
|
||||||
|
font-size: 28rpx;
|
||||||
|
max-width: 332rpx;
|
||||||
|
margin-right: 10rpx;
|
||||||
|
}
|
||||||
|
.num{
|
||||||
|
border-radius: 4px;
|
||||||
|
border: 1px solid #EDCAAC;
|
||||||
|
background: rgba(215,177,144,0.2);
|
||||||
|
font-size: 20rpx;
|
||||||
|
font-weight: 400;
|
||||||
|
color: #EDCAAC;
|
||||||
|
padding: 0 4rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.idNum{
|
||||||
|
font-weight: 400;
|
||||||
|
color: #EDCAAC;
|
||||||
|
font-size: 24rpx;
|
||||||
|
margin-top: 5rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.list{
|
||||||
|
margin-top: 46rpx;
|
||||||
|
.item{
|
||||||
|
color: #EDCAAC;
|
||||||
|
font-size: 22rpx;
|
||||||
|
text-align: center;
|
||||||
|
.num{
|
||||||
|
font-size: 40rpx;
|
||||||
|
margin-bottom: 15rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.qrCode{
|
||||||
|
width: 690rpx;
|
||||||
|
height: 700rpx;
|
||||||
|
background: #FFFFFF;
|
||||||
|
border-radius: 18rpx;
|
||||||
|
margin: -134rpx auto 0 auto;
|
||||||
|
padding-top: 60rpx;
|
||||||
|
.header{
|
||||||
|
width: 330rpx;
|
||||||
|
height: 60rpx;
|
||||||
|
border-radius: 30rpx;
|
||||||
|
background: #EEEEEE;
|
||||||
|
color: #333333;
|
||||||
|
font-size: 30rpx;
|
||||||
|
margin: 0 auto;
|
||||||
|
.title {
|
||||||
|
width: 146rpx;
|
||||||
|
height: 100%;
|
||||||
|
line-height: 60rpx;
|
||||||
|
border-radius: 30rpx;
|
||||||
|
text-align: center;
|
||||||
|
padding-right: 20rpx;
|
||||||
|
|
||||||
|
&.onLeft {
|
||||||
|
padding-left: 34rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.on {
|
||||||
|
width: 170rpx;
|
||||||
|
background-color: #333 !important;
|
||||||
|
color: #fff;
|
||||||
|
padding: 0 !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.store{
|
||||||
|
width: 690rpx;
|
||||||
|
height: 100rpx;
|
||||||
|
background: linear-gradient(90deg, #FFAE49 0%, #FCC887 100%);
|
||||||
|
border-radius: 18rpx;
|
||||||
|
margin: 26rpx auto;
|
||||||
|
padding: 0 30rpx;
|
||||||
|
color: #fff;
|
||||||
|
font-weight: 500;
|
||||||
|
font-size: 28rpx;
|
||||||
|
.iconfont{
|
||||||
|
margin-right: 20rpx;
|
||||||
|
font-size: 38rpx;
|
||||||
|
}
|
||||||
|
.icon-gengduo3{
|
||||||
|
font-size: 24rpx;
|
||||||
|
margin-left: 5rpx;
|
||||||
|
margin-right: 0;
|
||||||
|
margin-top: 6rpx;
|
||||||
|
}
|
||||||
|
.storeName{
|
||||||
|
display: inline-block;
|
||||||
|
max-width: 284rpx;
|
||||||
|
vertical-align: middle;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
817
pages/annex/vip_paid/index.vue
Normal file
817
pages/annex/vip_paid/index.vue
Normal file
File diff suppressed because one or more lines are too long
30
pages/annex/web_view/index.vue
Normal file
30
pages/annex/web_view/index.vue
Normal file
@ -0,0 +1,30 @@
|
|||||||
|
<template>
|
||||||
|
<web-view class="web-view" :webview-styles="webviewStyles" :src="url" :style="{width: windowW + 'px', height: windowH + 'px'}"></web-view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
windowH: 0,
|
||||||
|
windowW: 0,
|
||||||
|
webviewStyles: {
|
||||||
|
progress: {
|
||||||
|
color: 'transparent'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
url: ''
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onLoad(option) {
|
||||||
|
this.url = decodeURIComponent(option.url);
|
||||||
|
try {
|
||||||
|
const res = uni.getSystemInfoSync();
|
||||||
|
this.windowW = res.windowWidth;
|
||||||
|
this.windowH = res.windowHeight;
|
||||||
|
} catch (e) {
|
||||||
|
// error
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
78
pages/auth/index.vue
Normal file
78
pages/auth/index.vue
Normal file
@ -0,0 +1,78 @@
|
|||||||
|
<template>
|
||||||
|
<view class="lottie-bg">
|
||||||
|
<view id="lottie">
|
||||||
|
</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 dayjs from "@/plugin/dayjs/dayjs.min.js";
|
||||||
|
import wechat from "@/libs/wechat";
|
||||||
|
import {
|
||||||
|
getUserInfo
|
||||||
|
} from "@/api/user";
|
||||||
|
export default {
|
||||||
|
name: "Auth",
|
||||||
|
mounted() {
|
||||||
|
|
||||||
|
},
|
||||||
|
onLoad(option) {
|
||||||
|
let that = this
|
||||||
|
const {
|
||||||
|
code,
|
||||||
|
state
|
||||||
|
} = option;
|
||||||
|
wechat.auth(code, state)
|
||||||
|
.then(() => {
|
||||||
|
// console.log(decodeURIComponent(decodeURIComponent(option.back_url)),'back_url')
|
||||||
|
const href = decodeURIComponent(decodeURIComponent(option.back_url))
|
||||||
|
location.replace(href)
|
||||||
|
})
|
||||||
|
.catch((err) => {
|
||||||
|
location.replace("/");
|
||||||
|
});
|
||||||
|
}
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
.lottie-bg {
|
||||||
|
position: fixed;
|
||||||
|
left: 0;
|
||||||
|
top: 0;
|
||||||
|
background-color: #fff;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
z-index: 999;
|
||||||
|
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
#lottie {
|
||||||
|
display: block;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
overflow: hidden;
|
||||||
|
transform: translate3d(0, 0, 0);
|
||||||
|
margin: auto;
|
||||||
|
|
||||||
|
image {
|
||||||
|
width: 200rpx;
|
||||||
|
height: 200rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
184
pages/chat/customer_info/index.vue
Normal file
184
pages/chat/customer_info/index.vue
Normal file
@ -0,0 +1,184 @@
|
|||||||
|
<template>
|
||||||
|
<view :style="viewColor">
|
||||||
|
<form report-submit='true'>
|
||||||
|
<view v-if="userInfo">
|
||||||
|
<view class="user-info">
|
||||||
|
<image class="image" :src="userInfo.user.avatar || '/static/images/f.png'"></image>
|
||||||
|
<text>{{userInfo.user.nickname}}</text>
|
||||||
|
</view>
|
||||||
|
<view class="customerInfo">
|
||||||
|
<view class="list">
|
||||||
|
<view class="item">
|
||||||
|
<view class="text">备注昵称</view>
|
||||||
|
<view class="input">
|
||||||
|
<input type='text' v-model="userInfo.mark" placeholder="请输入"></input>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="item" v-if="userInfo.user.phone">
|
||||||
|
<view class="text">手机号</view>
|
||||||
|
<view class="input">
|
||||||
|
{{userInfo.user.phone}}
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="item">
|
||||||
|
<view class="text">推广员</view>
|
||||||
|
<view class="input">
|
||||||
|
{{userInfo.user.is_promoter ? '是' : '否'}}
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<button form-type="submit" @click="saveMark" class="confirmBnt">确认</button>
|
||||||
|
</view>
|
||||||
|
</form>
|
||||||
|
</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 { serviceUser, serviceSaveMark } from '@/api/user.js';
|
||||||
|
import {
|
||||||
|
mapGetters
|
||||||
|
} from "vuex";
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
userInfo: null,
|
||||||
|
merId: '',
|
||||||
|
uid: '',
|
||||||
|
loading: false,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
computed: mapGetters(['isLogin', 'viewColor']),
|
||||||
|
onLoad(options) {
|
||||||
|
this.mer_id = options.mer_id;
|
||||||
|
this.uid = options.uid;
|
||||||
|
this.serviceUser()
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
saveMark() {
|
||||||
|
if(this.loading) return ;
|
||||||
|
this.loading = true;
|
||||||
|
serviceSaveMark(this.mer_id, this.uid, this.userInfo.mark).then(res=>{
|
||||||
|
uni.showToast({
|
||||||
|
icon: 'success',
|
||||||
|
title: '保存成功'
|
||||||
|
})
|
||||||
|
setTimeout(v=>{
|
||||||
|
uni.navigateBack()
|
||||||
|
}, 1000)
|
||||||
|
}).catch(err=>{
|
||||||
|
uni.showToast({
|
||||||
|
title: err,
|
||||||
|
icon: 'none'
|
||||||
|
})
|
||||||
|
}).finally(e=>{
|
||||||
|
setTimeout(e=>{
|
||||||
|
this.loading = false
|
||||||
|
}, 2000)
|
||||||
|
})
|
||||||
|
},
|
||||||
|
serviceUser() {
|
||||||
|
uni.showLoading({
|
||||||
|
title: '加载中',
|
||||||
|
mask: true
|
||||||
|
})
|
||||||
|
serviceUser(this.mer_id, this.uid).then(res => {
|
||||||
|
this.userInfo = res.data
|
||||||
|
}).catch(err=>{
|
||||||
|
uni.showToast({
|
||||||
|
title: err,
|
||||||
|
icon: 'none'
|
||||||
|
})
|
||||||
|
setTimeout(v=>{
|
||||||
|
uni.navigateBack()
|
||||||
|
}, 1000)
|
||||||
|
}).finally(e=>{
|
||||||
|
uni.hideLoading()
|
||||||
|
})
|
||||||
|
|
||||||
|
},
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
.customerInfo{
|
||||||
|
background: #ffffff;
|
||||||
|
margin-top: 20rpx;
|
||||||
|
}
|
||||||
|
.customerInfo .phone {
|
||||||
|
font-size: 32rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.customerInfo .list {
|
||||||
|
width: 650rpx;
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.customerInfo .list .item {
|
||||||
|
width: 100%;
|
||||||
|
height: 110rpx;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
border-bottom: 2rpx solid #f0f0f0;
|
||||||
|
}
|
||||||
|
.customerInfo .list .item .title {
|
||||||
|
color: #333333;
|
||||||
|
font-size: 30rpx;
|
||||||
|
|
||||||
|
}
|
||||||
|
.customerInfo .list .item .text{
|
||||||
|
width: 160rpx;
|
||||||
|
}
|
||||||
|
.customerInfo .list .item .input {
|
||||||
|
width: 100%;
|
||||||
|
margin-left: 60rpx;
|
||||||
|
color: #666666;
|
||||||
|
font-size: 30rpx;
|
||||||
|
}
|
||||||
|
.customerInfo .list .item input {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
font-size: 30rpx;
|
||||||
|
color: #666666;
|
||||||
|
}
|
||||||
|
|
||||||
|
.confirmBnt {
|
||||||
|
font-size: 32rpx;
|
||||||
|
width: 650rpx;
|
||||||
|
height: 90rpx;
|
||||||
|
border-radius: 45rpx;
|
||||||
|
color: #fff;
|
||||||
|
margin: 70rpx auto 0 auto;
|
||||||
|
text-align: center;
|
||||||
|
line-height: 90rpx;
|
||||||
|
background-color: var(--view-theme);
|
||||||
|
}
|
||||||
|
.user-info{
|
||||||
|
padding: 50rpx 30rpx 30rpx;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
background-color: #fff;
|
||||||
|
.image{
|
||||||
|
width: 111rpx;
|
||||||
|
height: 111rpx;
|
||||||
|
border-radius: 100%;
|
||||||
|
}
|
||||||
|
text{
|
||||||
|
margin-left: 24rpx;
|
||||||
|
color: #333333;
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
</style>
|
||||||
2141
pages/chat/customer_list/chat.vue
Normal file
2141
pages/chat/customer_list/chat.vue
Normal file
File diff suppressed because it is too large
Load Diff
307
pages/chat/customer_list/index.vue
Normal file
307
pages/chat/customer_list/index.vue
Normal file
@ -0,0 +1,307 @@
|
|||||||
|
<template>
|
||||||
|
<div class="CustomerList" :style="viewColor">
|
||||||
|
<view>
|
||||||
|
<block v-if="type == 0 && list.length>0" v-for="(item,index) in list" :key="index">
|
||||||
|
<div v-if="item.merchant" class="item acea-row" @click="goPage(item)">
|
||||||
|
<view class="logo">
|
||||||
|
<image :src="item.merchant && item.merchant.mer_avatar" mode=""></image>
|
||||||
|
</view>
|
||||||
|
<view class="info">
|
||||||
|
<view class="name">{{item.merchant ? item.merchant.mer_name : ''}}</view>
|
||||||
|
<view class="con line1" v-if="item.last && item.last.msn_type == 1">{{item.last.msn}}</view>
|
||||||
|
<view class="con line1" v-if="item.last && item.last.msn_type == 2">[表情]</view>
|
||||||
|
<view class="con line1" v-if="item.last && item.last.msn_type == 3">[图片]</view>
|
||||||
|
<view class="con line1" v-if="item.last && item.last.msn_type == 4">[商品]</view>
|
||||||
|
<view class="con line1" v-if="item.last && (item.last.msn_type == 5 || item.last.msn_type == 6)">[订单]</view>
|
||||||
|
</view>
|
||||||
|
<view class="right-box">
|
||||||
|
<view class="time">{{item.last && item.last.create_time.split(' ')[1] || ''}}</view>
|
||||||
|
<view class="num" v-if="item.num>0">{{item.num}}</view>
|
||||||
|
</view>
|
||||||
|
</div>
|
||||||
|
</block>
|
||||||
|
<block v-if="type == 1 && list.length>0" v-for="(item,index) in list" :key="index">
|
||||||
|
<div class="item acea-row" @click="goPage(item)">
|
||||||
|
<view class="logo">
|
||||||
|
<image :src="(item.user && item.user.avatar) ? item.user.avatar : '/static/images/f.png'" mode=""></image>
|
||||||
|
</view>
|
||||||
|
<view class="info">
|
||||||
|
<view class="name">{{item.user && item.user.nickname}}</view>
|
||||||
|
<view class="con line1" v-if="item.last && item.last.msn_type == 1">{{item.last.msn}}</view>
|
||||||
|
<view class="con line1" v-if="item.last && item.last.msn_type == 2">[表情]</view>
|
||||||
|
<view class="con line1" v-if="item.last && item.last.msn_type == 3">[图片]</view>
|
||||||
|
<view class="con line1" v-if="item.last && (item.last.msn_type == 4 || item.last.msn_type == 7)">[商品]</view>
|
||||||
|
<view class="con line1" v-if="item.last && (item.last.msn_type == 5 || item.last.msn_type == 6)">[订单]</view>
|
||||||
|
</view>
|
||||||
|
<view class="right-box">
|
||||||
|
<view class="time">{{item.last && item.last.create_time.split(' ')[1]}}</view>
|
||||||
|
<view class="num" v-if="item.num>0">{{item.num}}</view>
|
||||||
|
</view>
|
||||||
|
</div>
|
||||||
|
</block>
|
||||||
|
<block v-if="list.length == 0">
|
||||||
|
<emptyPage title="暂无数据~"></emptyPage>
|
||||||
|
</block>
|
||||||
|
</view>
|
||||||
|
<authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize>
|
||||||
|
</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 emptyPage from '@/components/emptyPage.vue'
|
||||||
|
import authorize from '@/components/Authorize';
|
||||||
|
import {
|
||||||
|
serviceList,
|
||||||
|
serviceUserList
|
||||||
|
} from "@/api/user";
|
||||||
|
import { mapGetters } from "vuex";
|
||||||
|
export default {
|
||||||
|
name: "CustomerList",
|
||||||
|
components:{
|
||||||
|
emptyPage,
|
||||||
|
authorize
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
list: [],
|
||||||
|
productId: 0,
|
||||||
|
orderId: "",
|
||||||
|
type: 0 ,// 0 用户 1客服
|
||||||
|
timer: null,
|
||||||
|
page:1,
|
||||||
|
limit:9999,
|
||||||
|
mer_id: '',
|
||||||
|
loading: false,
|
||||||
|
clear: false,
|
||||||
|
isAuto: false, //没有授权的不会自动授权
|
||||||
|
isShowAuth: false, //是否隐藏授权
|
||||||
|
};
|
||||||
|
},
|
||||||
|
computed: mapGetters(['isLogin','viewColor']),
|
||||||
|
onLoad(optios) {
|
||||||
|
this.type = optios.type;
|
||||||
|
this.mer_id = optios.mer_id;
|
||||||
|
if(this.isLogin){
|
||||||
|
this.getList(this.mer_id)
|
||||||
|
} else {
|
||||||
|
this.isAuto = true;
|
||||||
|
this.isShowAuth = true
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onShow(option) {
|
||||||
|
if(this.isLogin){
|
||||||
|
this.liveUpdate();
|
||||||
|
} else {
|
||||||
|
this.isAuto = true;
|
||||||
|
this.isShowAuth = true
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onHide(){
|
||||||
|
if(this.timer) {
|
||||||
|
clearInterval(this.timer);
|
||||||
|
this.timer = null;
|
||||||
|
}
|
||||||
|
this.clear = true;
|
||||||
|
},
|
||||||
|
onUnload() {
|
||||||
|
if(this.timer) {
|
||||||
|
clearInterval(this.timer);
|
||||||
|
this.timer = null;
|
||||||
|
}
|
||||||
|
this.clear = true;
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
onLoadFun() {
|
||||||
|
this.isShowAuth = false;
|
||||||
|
this.getList(this.mer_id);
|
||||||
|
this.liveUpdate();
|
||||||
|
},
|
||||||
|
// 授权关闭
|
||||||
|
authColse: function(e) {
|
||||||
|
this.isShowAuth = e
|
||||||
|
},
|
||||||
|
getList(mer_id) {
|
||||||
|
this.loading = true;
|
||||||
|
if(this.type == 0){
|
||||||
|
serviceList({
|
||||||
|
page:this.page,
|
||||||
|
limit:this.limit
|
||||||
|
}).then(res => {
|
||||||
|
this.list = res.data.list;
|
||||||
|
if(res.status == 400){
|
||||||
|
clearInterval(this.timer);
|
||||||
|
this.timer = null;
|
||||||
|
return this.$util.Tips({
|
||||||
|
title: res.message
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}).finally(v=>{
|
||||||
|
this.loading = false;
|
||||||
|
return this.$util.Tips({
|
||||||
|
title: v
|
||||||
|
})
|
||||||
|
}).catch(err => {
|
||||||
|
return this.$util.Tips({
|
||||||
|
title: err
|
||||||
|
})
|
||||||
|
});
|
||||||
|
}else{
|
||||||
|
serviceUserList(mer_id,{
|
||||||
|
page:this.page,
|
||||||
|
limit:this.limit
|
||||||
|
}).then(res =>{
|
||||||
|
this.list = res.data.list;
|
||||||
|
if(res.status == 400){
|
||||||
|
clearInterval(this.timer);
|
||||||
|
this.timer = null;
|
||||||
|
return this.$util.Tips({
|
||||||
|
title: res.message
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}).finally(v=>{
|
||||||
|
this.loading = false;
|
||||||
|
clearInterval(this.timer);
|
||||||
|
this.timer = null;
|
||||||
|
return this.$util.Tips({
|
||||||
|
title: v
|
||||||
|
})
|
||||||
|
}).catch(err => {
|
||||||
|
clearInterval(this.timer);
|
||||||
|
this.timer = null;
|
||||||
|
return this.$util.Tips({
|
||||||
|
title: err
|
||||||
|
})
|
||||||
|
});
|
||||||
|
}
|
||||||
|
},
|
||||||
|
//实时刷新列表
|
||||||
|
liveUpdate(){
|
||||||
|
let that = this;
|
||||||
|
this.clear = false;
|
||||||
|
if(that.timer) {
|
||||||
|
clearInterval(that.timer);
|
||||||
|
that.timer = null;
|
||||||
|
}
|
||||||
|
that.timer = setInterval(function(){
|
||||||
|
if(that.clear){
|
||||||
|
clearInterval(that.timer);
|
||||||
|
return ;
|
||||||
|
}
|
||||||
|
// 用户
|
||||||
|
(!that.loading) && that.getList(that.mer_id);
|
||||||
|
},5000);
|
||||||
|
},
|
||||||
|
goPage(item) {
|
||||||
|
item.num = 0;
|
||||||
|
if(this.type == 0){
|
||||||
|
uni.navigateTo({
|
||||||
|
url: `/pages/chat/customer_list/chat?mer_id=${item.mer_id}`
|
||||||
|
})
|
||||||
|
}else{
|
||||||
|
uni.navigateTo({
|
||||||
|
url: `/pages/chat/customer_list/chat?userId=${item.user.uid}&mer_id=${item.mer_id}`
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
changeTitle(e) {
|
||||||
|
this.mer_id = e.detail.value.toString();
|
||||||
|
},
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
<style lang="scss">
|
||||||
|
.CustomerList {
|
||||||
|
.spin {
|
||||||
|
display: block;
|
||||||
|
transform: rotate(180deg);
|
||||||
|
font-size: 36rpx;
|
||||||
|
}
|
||||||
|
.popupn{
|
||||||
|
position: fixed;
|
||||||
|
width: 100%;
|
||||||
|
text-align: center;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
background: #ffffff;
|
||||||
|
height: 90rpx;
|
||||||
|
line-height: 90rpx;
|
||||||
|
z-index: 100;
|
||||||
|
.title{
|
||||||
|
max-width: 560rpx;
|
||||||
|
margin: 0 auto;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.iconfont{
|
||||||
|
display: inline-block;
|
||||||
|
position: relative;
|
||||||
|
top: 4rpx;
|
||||||
|
right: 0;
|
||||||
|
}
|
||||||
|
.mer_logo{
|
||||||
|
width: 34rpx;
|
||||||
|
height: 34rpx;
|
||||||
|
position: relative;
|
||||||
|
top: 6rpx;
|
||||||
|
right: 10px;
|
||||||
|
}
|
||||||
|
.mer_name{
|
||||||
|
display: inline-block;
|
||||||
|
max-width: 650rpx;
|
||||||
|
}
|
||||||
|
.invoice-content{
|
||||||
|
background-color: #ffffff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.list_count{
|
||||||
|
margin-top: 104rpx;
|
||||||
|
}
|
||||||
|
.item {
|
||||||
|
align-items: center;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
padding: 20rpx 30rpx;
|
||||||
|
background-color: #fff;
|
||||||
|
.logo image{
|
||||||
|
width: 88rpx;
|
||||||
|
height: 88rpx;
|
||||||
|
border-radius: 50%;
|
||||||
|
}
|
||||||
|
.info{
|
||||||
|
width: 334rpx;
|
||||||
|
margin-left: 20rpx;
|
||||||
|
.con{
|
||||||
|
margin-top: 10rpx;
|
||||||
|
color: #999999;
|
||||||
|
font-size: 24rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.right-box{
|
||||||
|
flex: 1;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: flex-end;
|
||||||
|
font-size: 20rpx;
|
||||||
|
color: #BBBBBB;
|
||||||
|
.time{
|
||||||
|
margin-bottom: 10rpx;
|
||||||
|
}
|
||||||
|
.num{
|
||||||
|
min-width: 6px;
|
||||||
|
background-color: var(--view-theme);
|
||||||
|
border-radius: 15px;
|
||||||
|
font-size: 10px;
|
||||||
|
padding: 0 4px;
|
||||||
|
font-size: 20rpx;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
283
pages/chat/customer_login/index.vue
Normal file
283
pages/chat/customer_login/index.vue
Normal file
File diff suppressed because one or more lines are too long
BIN
pages/chat/static/images/noPermission.png
Normal file
BIN
pages/chat/static/images/noPermission.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 26 KiB |
330
pages/columnGoods/HotNewGoods/index.vue
Normal file
330
pages/columnGoods/HotNewGoods/index.vue
Normal file
File diff suppressed because one or more lines are too long
927
pages/columnGoods/goods_coupon_list/index.vue
Normal file
927
pages/columnGoods/goods_coupon_list/index.vue
Normal file
@ -0,0 +1,927 @@
|
|||||||
|
<template>
|
||||||
|
<view :style="viewColor">
|
||||||
|
<view class='productList'>
|
||||||
|
<view class='search acea-row row-between-wrapper'>
|
||||||
|
<!--#ifdef H5-->
|
||||||
|
<view class="back" @click='set_where(1)'>
|
||||||
|
<view class="iconfont icon-xiangzuo"></view>
|
||||||
|
</view>
|
||||||
|
<!--#endif-->
|
||||||
|
<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='where.keyword'
|
||||||
|
@confirm="searchSubmit"></input>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="nav-wrapper">
|
||||||
|
<view class='nav acea-row row-middle'>
|
||||||
|
<view class='item' @click="downStatus = !downStatus" :class="{'t-color':downKey>0 && firstKey == 0}">
|
||||||
|
{{downMenu[downKey].title}}
|
||||||
|
<text v-if="!downStatus" class="iconfont icon-xiala1 spin"></text>
|
||||||
|
<text v-else class="iconfont icon-xiala1"></text>
|
||||||
|
</view>
|
||||||
|
<view class='item' :class="{'t-color':firstKey == 3}" @click='set_where(3)'>
|
||||||
|
销量
|
||||||
|
</view>
|
||||||
|
<view class='item' :class="{'t-color':firstKey == 2}" @click='set_where(2)'>
|
||||||
|
价格
|
||||||
|
<image v-if="price==1" :src="domain+'/static/diy/up'+keyColor+'.png'"></image>
|
||||||
|
<image v-else-if="price==2" :src="domain+'/static/diy/down'+keyColor+'.png'"></image>
|
||||||
|
<image v-else src='/static/images/horn.png'></image>
|
||||||
|
</view>
|
||||||
|
<!-- down -->
|
||||||
|
<view class='item' :class="{'t-color':firstKey == 4}" @click='bindRight'>
|
||||||
|
筛选
|
||||||
|
<text class="iconfont icon-shaixuan"></text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<block>
|
||||||
|
<view class="container">
|
||||||
|
<view v-if="productList.length>0" class="coupon_count acea-row">
|
||||||
|
<text class="text">以下商品适用于</text>
|
||||||
|
<text class="coupon_used" :style="{ 'background-image': `url(${domain}/static/diy/coupon${keyColor}.png)` }">满{{couponData.use_min_price}}减{{couponData.coupon_price}}</text>
|
||||||
|
</view>
|
||||||
|
<!-- 商品 -->
|
||||||
|
<view class='list acea-row row-between-wrapper on'>
|
||||||
|
<view class='item on' hover-class='none' v-for="(item,index) in productList" :key="index"
|
||||||
|
@click="godDetail(item)">
|
||||||
|
<view class='pictrue on'>
|
||||||
|
<image :src='item.image' class="on"></image>
|
||||||
|
</view>
|
||||||
|
<view class='text on acea-row row-between-wrapper'>
|
||||||
|
<view class='name line1'>
|
||||||
|
<text class="text_name line1">{{item.store_name}}</text>
|
||||||
|
</view>
|
||||||
|
<view class="item_bot">
|
||||||
|
<view class="acea-row">
|
||||||
|
<view class='money t-color on'>
|
||||||
|
￥<text class='num'>{{item.price}}</text>
|
||||||
|
</view>
|
||||||
|
<view v-if="item.show_svip_info.show_svip_price && item.svip_price" class="acea-row row-middle svip-count">
|
||||||
|
<text class='vip-money'>￥{{item.svip_price}}</text>
|
||||||
|
<view class="vipImg">
|
||||||
|
<image src="/static/images/svip.png"></image>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="item_tags acea-row">
|
||||||
|
<text v-if="item.merchant.type_name && item.product_type == 0" class="font-bg-red">{{item.merchant.type_name}}</text>
|
||||||
|
<text v-else-if="item.merchant.is_trader && item.product_type == 0" class="font-bg-red">自营</text>
|
||||||
|
<text v-if="item.product_type != 0" :class="'font_bg-red type'+item.product_type">{{item.product_type == 1 ? "秒杀" : item.product_type == 2 ? "预售" : item.product_type == 3 ? "助力" : item.product_type == 4 ? "拼团" : ""}}</text>
|
||||||
|
<text class="tags_item ticket" v-if="item.issetCoupon">领券</text>
|
||||||
|
<text class="tags_item delivery" v-if="item.delivery_free == 1">包邮</text>
|
||||||
|
</view>
|
||||||
|
<view class="score">{{item.rate}}评分 {{item.reply_count}}条评论</view>
|
||||||
|
<view class="company" v-if="item.merchant" @click.stop="goShop(item.mer_id)">
|
||||||
|
<text class="line1">{{item.merchant.mer_name}}</text>
|
||||||
|
<view class="flex">
|
||||||
|
进店
|
||||||
|
<text class="iconfont icon-xiangyou"></text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class='noCommodity' v-if="productList.length==0 && where.page > 1">
|
||||||
|
<view class='pictrue' style="margin: 60rpx auto;">
|
||||||
|
<image src='/static/images/noCart.png'></image>
|
||||||
|
<view>暂无商品，去看点什么吧</view>
|
||||||
|
</view>
|
||||||
|
<recommend v-if="recommend_switch == 1" :hostProduct="hostProduct" :isLogin="isLogin"></recommend>
|
||||||
|
</view>
|
||||||
|
</block>
|
||||||
|
<rightSlider v-if="rightBox" :status="rightBox" :brandList="brandList" @confirm="confirm" @close="close"></rightSlider>
|
||||||
|
</view>
|
||||||
|
<view class="down-wrapper" v-if="downStatus">
|
||||||
|
<view class="bg"></view>
|
||||||
|
<view class="down-box">
|
||||||
|
<view class="down-item" v-for="(item,index) in downMenu" :key="item.key" :class="{'on':index == downKey}" @click="bindDown(item,index)">
|
||||||
|
{{item.title}}
|
||||||
|
<text v-if="index == downKey" class="iconfont icon-gou"></text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<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 { getCouponProductlist, getProductHot, getBrandlist } from '@/api/store.js';
|
||||||
|
import recommend from '@/components/recommend';
|
||||||
|
import rightSlider from '@/components/rightSlider.vue'
|
||||||
|
import WaterfallsFlow from '@/components/WaterfallsFlow/WaterfallsFlow.vue'
|
||||||
|
import {initiateAssistApi} from '@/api/activity.js';
|
||||||
|
import { mapGetters } from "vuex";
|
||||||
|
import { configMap } from "@/utils";
|
||||||
|
import { HTTP_REQUEST_URL } from '@/config/app';
|
||||||
|
// #ifndef H5
|
||||||
|
import passwordPopup from '@/components/passwordPopup';
|
||||||
|
// #endif
|
||||||
|
import authorize from '@/components/Authorize';
|
||||||
|
import {
|
||||||
|
goShopDetail
|
||||||
|
} from '@/libs/order.js'
|
||||||
|
const app = getApp();
|
||||||
|
export default {
|
||||||
|
computed: configMap({hide_mer_status: 1,recommend_switch:0},mapGetters(['uid','isLogin','scrollTop','viewColor','keyColor'])),
|
||||||
|
components: {
|
||||||
|
// #ifndef H5
|
||||||
|
passwordPopup,
|
||||||
|
// #endif
|
||||||
|
recommend,
|
||||||
|
rightSlider,
|
||||||
|
WaterfallsFlow,
|
||||||
|
authorize,
|
||||||
|
},
|
||||||
|
watch:{
|
||||||
|
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
domain: HTTP_REQUEST_URL,
|
||||||
|
productList: [],
|
||||||
|
couponData: {},
|
||||||
|
list: [],
|
||||||
|
where: {
|
||||||
|
coupon_id: '',
|
||||||
|
cate_id: '',
|
||||||
|
order: '',
|
||||||
|
price_on: '',
|
||||||
|
price_off: '',
|
||||||
|
brand_id: '',
|
||||||
|
keyword:'',
|
||||||
|
page:1,
|
||||||
|
limit:30
|
||||||
|
},
|
||||||
|
price: 0,
|
||||||
|
stock: 0,
|
||||||
|
nows: false,
|
||||||
|
loadend: false,
|
||||||
|
loading: false,
|
||||||
|
loadTitle: '加载更多',
|
||||||
|
title: '',
|
||||||
|
hostProduct: [],
|
||||||
|
hotPage: 1,
|
||||||
|
hotLimit: 10,
|
||||||
|
hotScroll: false,
|
||||||
|
// 筛选框
|
||||||
|
rightBox: false,
|
||||||
|
//品牌列表
|
||||||
|
brandList: [],
|
||||||
|
downKey: 0,
|
||||||
|
downStatus: false,
|
||||||
|
// 下拉菜单
|
||||||
|
downMenu: [{
|
||||||
|
title: '综合排序',
|
||||||
|
key: 1,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '评分',
|
||||||
|
key: 2,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '新品',
|
||||||
|
key: 3,
|
||||||
|
}
|
||||||
|
],
|
||||||
|
// 是否第一个
|
||||||
|
firstKey:0,
|
||||||
|
// tab切换
|
||||||
|
tabIndex: 1,
|
||||||
|
// 商铺列表
|
||||||
|
storeList: [],
|
||||||
|
sotreParam:{
|
||||||
|
keyword:'',
|
||||||
|
page:1,
|
||||||
|
limit:30,
|
||||||
|
order:''
|
||||||
|
},
|
||||||
|
storeKey:0,
|
||||||
|
storeScroll:true,
|
||||||
|
isShowAuth: false, //是否隐藏授权
|
||||||
|
isAuto: false, //没有授权的不会自动授权
|
||||||
|
};
|
||||||
|
},
|
||||||
|
// 滚动监听
|
||||||
|
onPageScroll() {
|
||||||
|
uni.$emit('scroll');
|
||||||
|
},
|
||||||
|
onLoad: function(options) {
|
||||||
|
this.$set(this.where, 'cate_id', options.id || '');
|
||||||
|
this.$set(this.where, 'coupon_id', options.coupon_id || '');
|
||||||
|
this.title = options.title || '';
|
||||||
|
this.$set(this.where, 'keyword', options.searchValue || '');
|
||||||
|
this.get_product_list(true);
|
||||||
|
this.get_host_product();
|
||||||
|
},
|
||||||
|
onReady(){},
|
||||||
|
mounted: function() {
|
||||||
|
this.get_product_list(true);
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
// 授权回调
|
||||||
|
onLoadFun() {
|
||||||
|
this.isShowAuth = false
|
||||||
|
},
|
||||||
|
// 授权关闭
|
||||||
|
authColse: function(e) {
|
||||||
|
this.isShowAuth = e
|
||||||
|
},
|
||||||
|
// 去店铺
|
||||||
|
goShop(id){
|
||||||
|
if(this.hide_mer_status != 1){
|
||||||
|
uni.navigateTo({
|
||||||
|
url:`/pages/store/home/index?id=${id}`
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 店铺排序
|
||||||
|
storeTab(key){
|
||||||
|
this.storeKey = key
|
||||||
|
if(key == 0){
|
||||||
|
this.sotreParam.order = ''
|
||||||
|
}else if(key == 1){
|
||||||
|
this.sotreParam.order = 'sales'
|
||||||
|
}else{
|
||||||
|
this.sotreParam.order = 'rate'
|
||||||
|
}
|
||||||
|
this.sotreParam.page = 1
|
||||||
|
this.storeScroll = true
|
||||||
|
this.storeList = []
|
||||||
|
},
|
||||||
|
// 右侧切换
|
||||||
|
bindRight(){
|
||||||
|
this.price = 0;
|
||||||
|
this.firstKey = 4
|
||||||
|
this.getBrandlist()
|
||||||
|
},
|
||||||
|
// 品牌列表
|
||||||
|
getBrandlist(){
|
||||||
|
let temp = []
|
||||||
|
getBrandlist({
|
||||||
|
cate_id:this.where.cate_id,
|
||||||
|
keyword:this.where.keyword
|
||||||
|
}).then(res=>{
|
||||||
|
temp = res.data.list.map(item=>{
|
||||||
|
return {
|
||||||
|
...item,
|
||||||
|
check:false
|
||||||
|
}
|
||||||
|
})
|
||||||
|
if(this.where.brand_id.length>0){
|
||||||
|
this.where.brand_id.forEach((ids,index)=>{
|
||||||
|
temp.forEach(el=>{
|
||||||
|
if(ids == el.brand_id){
|
||||||
|
el.check = true
|
||||||
|
}
|
||||||
|
})
|
||||||
|
})
|
||||||
|
}
|
||||||
|
this.brandList = temp
|
||||||
|
this.rightBox = true
|
||||||
|
})
|
||||||
|
},
|
||||||
|
// 去详情页
|
||||||
|
godDetail(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.navigateTo({
|
||||||
|
url: '/pages/activity/assist_detail/index?id=' + id
|
||||||
|
});
|
||||||
|
}).catch((err) => {
|
||||||
|
uni.showToast({
|
||||||
|
title: err,
|
||||||
|
icon: 'none'
|
||||||
|
})
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
this.isAuto = true;
|
||||||
|
this.isShowAuth = true
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
// 组件确定
|
||||||
|
confirm(data) {
|
||||||
|
let arr = []
|
||||||
|
if(data.brandList.length == 0){
|
||||||
|
this.where.brand_id = ''
|
||||||
|
}else{
|
||||||
|
data.brandList.forEach(item =>{
|
||||||
|
arr.push(item.brand_id)
|
||||||
|
})
|
||||||
|
this.where.brand_id =arr
|
||||||
|
}
|
||||||
|
this.rightBox = data.status
|
||||||
|
this.where.price_on = data.price_on
|
||||||
|
this.where.price_off = data.price_off
|
||||||
|
this.loadend = false;
|
||||||
|
this.$set(this.where, 'page', 1)
|
||||||
|
this.get_product_list(true);
|
||||||
|
|
||||||
|
},
|
||||||
|
// 组件关闭
|
||||||
|
close() {
|
||||||
|
this.rightBox = false
|
||||||
|
},
|
||||||
|
// 下拉选项
|
||||||
|
bindDown(item, index) {
|
||||||
|
this.firstKey = 0
|
||||||
|
if(index == 0){
|
||||||
|
this.where.order = ''
|
||||||
|
}else if(index == 1){
|
||||||
|
this.where.order = 'rate'
|
||||||
|
}else if(index == 2){
|
||||||
|
this.where.order = 'is_new'
|
||||||
|
}
|
||||||
|
this.downKey = index
|
||||||
|
this.downStatus = false
|
||||||
|
this.loadend = false;
|
||||||
|
this.$set(this.where, 'page', 1)
|
||||||
|
this.get_product_list(true);
|
||||||
|
},
|
||||||
|
searchSubmit: function(e) {
|
||||||
|
let that = this;
|
||||||
|
that.$set(that.where, 'keyword', e.detail.value);
|
||||||
|
that.loadend = false;
|
||||||
|
that.$set(that.where, 'page', 1)
|
||||||
|
this.get_product_list(true);
|
||||||
|
},
|
||||||
|
/**
|
||||||
|
* 获取我的推荐
|
||||||
|
*/
|
||||||
|
get_host_product: function() {
|
||||||
|
let that = this;
|
||||||
|
if (that.hotScroll) return
|
||||||
|
getProductHot(
|
||||||
|
that.hotPage,
|
||||||
|
that.hotLimit,
|
||||||
|
).then(res => {
|
||||||
|
that.hotPage++
|
||||||
|
that.hotScroll = res.data.length < that.hotLimit
|
||||||
|
that.hostProduct = that.hostProduct.concat(res.data.list)
|
||||||
|
// that.$set(that, 'hostProduct', res.data)
|
||||||
|
});
|
||||||
|
},
|
||||||
|
//点击事件处理
|
||||||
|
set_where: function(e) {
|
||||||
|
switch (e) {
|
||||||
|
case 1:
|
||||||
|
uni.setStorageSync('storeIndex', this.where.cate_id);
|
||||||
|
uni.navigateBack()
|
||||||
|
break
|
||||||
|
case 2:
|
||||||
|
this.firstKey = e
|
||||||
|
if (this.price == 0){
|
||||||
|
this.price = 1;
|
||||||
|
this.where.order = 'price_asc'
|
||||||
|
}else if (this.price == 1){
|
||||||
|
this.price = 2;
|
||||||
|
this.where.order = 'price_desc'
|
||||||
|
}else if (this.price == 2){
|
||||||
|
this.price = 0;
|
||||||
|
this.where.order = ''
|
||||||
|
}
|
||||||
|
this.$set(this.where, 'page', 1)
|
||||||
|
this.get_product_list(true);
|
||||||
|
break;
|
||||||
|
case 3:
|
||||||
|
this.price = 0;
|
||||||
|
this.loadend = false;
|
||||||
|
this.$set(this.where, 'order', 'sales')
|
||||||
|
this.$set(this.where, 'page', 1)
|
||||||
|
this.get_product_list(true);
|
||||||
|
this.firstKey = e
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
this.loadend = false;
|
||||||
|
this.$set(this.where, 'page', 1);
|
||||||
|
this.get_product_list(true);
|
||||||
|
},
|
||||||
|
//查找产品
|
||||||
|
get_product_list: function(isPage) {
|
||||||
|
let that = this;
|
||||||
|
if (that.loadend) return;
|
||||||
|
if (that.loading) return;
|
||||||
|
if (isPage === true) that.$set(that, 'productList', []);
|
||||||
|
that.loading = true;
|
||||||
|
that.loadTitle = '';
|
||||||
|
getCouponProductlist(that.where).then(res => {
|
||||||
|
this.couponData = res.data.coupon;
|
||||||
|
let list = res.data.list;
|
||||||
|
let productList = that.$util.SplitArray(list, that.productList);
|
||||||
|
let loadend = list.length < that.where.limit;
|
||||||
|
that.loadend = loadend;
|
||||||
|
that.loading = false;
|
||||||
|
that.loadTitle = loadend ? '已全部加载' : '加载更多';
|
||||||
|
that.$set(that, 'productList', productList);
|
||||||
|
that.$set(that.where, 'page', that.where.page + 1);
|
||||||
|
}).catch(err => {
|
||||||
|
that.loading = false;
|
||||||
|
that.loadTitle = '加载更多';
|
||||||
|
});
|
||||||
|
},
|
||||||
|
},
|
||||||
|
onPullDownRefresh() {
|
||||||
|
|
||||||
|
},
|
||||||
|
onReachBottom() {
|
||||||
|
if (this.productList.length > 0) {
|
||||||
|
this.get_product_list('');
|
||||||
|
} else {
|
||||||
|
this.get_host_product();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onPullDownRefresh(){
|
||||||
|
// 模拟上拉刷新
|
||||||
|
setTimeout(()=>{
|
||||||
|
const newList = this.productList.reverse();
|
||||||
|
this.productList = newList;
|
||||||
|
uni.stopPullDownRefresh();
|
||||||
|
},500)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</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;
|
||||||
|
background-color: var(--view-theme);
|
||||||
|
}
|
||||||
|
|
||||||
|
.productList .search .back {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
width: 40rpx;
|
||||||
|
height: 60rpx;
|
||||||
|
|
||||||
|
.iconfont {
|
||||||
|
color: #fff;
|
||||||
|
font-size: 36rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.font-bg-red {
|
||||||
|
background-color: var(--view-theme);
|
||||||
|
border: 1px solid var(--view-theme);
|
||||||
|
&.type2{
|
||||||
|
background-color: #FD6523;
|
||||||
|
border: 1rpx solid #FD6523;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.productList .search .input {
|
||||||
|
/*#ifdef H5*/
|
||||||
|
width: 650rpx;
|
||||||
|
/*#endif*/
|
||||||
|
/*#ifndef H5*/
|
||||||
|
width: 100%;
|
||||||
|
/*#endif*/
|
||||||
|
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: var(--view-theme);
|
||||||
|
|
||||||
|
.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: #fff;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
padding: 0 28rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.productList .nav .item {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.productList .nav .item.t-color {
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
.productList .nav .item image {
|
||||||
|
width: 15rpx;
|
||||||
|
height: 19rpx;
|
||||||
|
margin-left: 10rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.productList .list {
|
||||||
|
padding: 0 20rpx;
|
||||||
|
}
|
||||||
|
.productList .list.on {
|
||||||
|
background-color: #fff;
|
||||||
|
border-top: 1px solid #f6f6f6;
|
||||||
|
}
|
||||||
|
.item_tags{
|
||||||
|
margin-top: 8rpx;
|
||||||
|
}
|
||||||
|
.item_tags .tags_item {
|
||||||
|
display: inline-block;
|
||||||
|
font-size: 20rpx;
|
||||||
|
text-align: center;
|
||||||
|
border-radius: 5rpx;
|
||||||
|
padding: 0 4rpx;
|
||||||
|
line-height: 28rpx;
|
||||||
|
margin-right: 8rpx;
|
||||||
|
|
||||||
|
}
|
||||||
|
.item_tags .tags_item.ticket{
|
||||||
|
color: #E93323;
|
||||||
|
border: 1rpx solid #E93323;
|
||||||
|
}
|
||||||
|
.item_tags .tags_item.delivery{
|
||||||
|
color: #FF9000;
|
||||||
|
border: 1rpx solid #FF9000;
|
||||||
|
}
|
||||||
|
.container{
|
||||||
|
margin-top: 168rpx;
|
||||||
|
}
|
||||||
|
.coupon_count{
|
||||||
|
background: var(--view-minorColor);
|
||||||
|
padding: 15rpx 30rpx 12rpx;
|
||||||
|
|
||||||
|
color: var(--view-theme);
|
||||||
|
font-size: 26rpx;
|
||||||
|
line-height: 36rpx;
|
||||||
|
.text{
|
||||||
|
padding: 4rpx 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.coupon_used{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
max-width: 300rpx;
|
||||||
|
padding: 3rpx 16rpx;
|
||||||
|
margin-left: 10rpx;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
font-size: 24rpx;
|
||||||
|
font-weight: normal;
|
||||||
|
color: var(--view-priceColor);
|
||||||
|
|
||||||
|
}
|
||||||
|
.svip-count{
|
||||||
|
position: relative;
|
||||||
|
top: 4rpx;
|
||||||
|
}
|
||||||
|
.vip-money {
|
||||||
|
color: #282828;
|
||||||
|
font-size: 22rpx;
|
||||||
|
margin-left: 6rpx;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
.vipImg {
|
||||||
|
width: 65rpx;
|
||||||
|
height: 28rpx;
|
||||||
|
margin-left: 4rpx;
|
||||||
|
image {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.noCommodity {
|
||||||
|
background-color: #fff;
|
||||||
|
padding-bottom: 30rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.spin {
|
||||||
|
display: block;
|
||||||
|
transform: rotate(180deg);
|
||||||
|
font-size: 36rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-xiala1 {
|
||||||
|
margin-top: 6rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-shaixuan {
|
||||||
|
font-size: 30rpx;
|
||||||
|
margin-left: 10rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.down-wrapper {
|
||||||
|
.bg {
|
||||||
|
z-index: 8;
|
||||||
|
position: fixed;
|
||||||
|
left: 0;
|
||||||
|
top: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
background: rgba(0, 0, 0, .5);
|
||||||
|
}
|
||||||
|
.down-box {
|
||||||
|
z-index: 8;
|
||||||
|
position: fixed;
|
||||||
|
left: 0;
|
||||||
|
top: 170rpx;
|
||||||
|
width: 100%;
|
||||||
|
padding: 0 40rpx 28rpx 74rpx;
|
||||||
|
background-color: #F8F8F8;
|
||||||
|
border-radius: 0 0 24rpx 24rpx;
|
||||||
|
.down-item {
|
||||||
|
margin-top: 28rpx;
|
||||||
|
font-size: 24rpx;
|
||||||
|
color: #454545;
|
||||||
|
&.on {
|
||||||
|
color: var(--view-theme);
|
||||||
|
}
|
||||||
|
.iconfont{
|
||||||
|
float: right;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.store-wrapper {
|
||||||
|
margin-top: 240rpx;
|
||||||
|
border-top: 1px solid #F6F6F6;
|
||||||
|
|
||||||
|
.star-box {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.star {
|
||||||
|
position: relative;
|
||||||
|
width: 111rpx;
|
||||||
|
height: 19rpx;
|
||||||
|
background: url(~pages/columnGoods/images/star.png);
|
||||||
|
background-size: 111rpx 19rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.star-active {
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
top: 0;
|
||||||
|
width: 111rpx;
|
||||||
|
height: 19rpx;
|
||||||
|
overflow: hidden;
|
||||||
|
background: url(~pages/columnGoods/images/star_active.png);
|
||||||
|
background-size: 111rpx 19rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.num {
|
||||||
|
color: $theme-color;
|
||||||
|
font-size: 24rpx;
|
||||||
|
margin-left: 10rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.store-item {
|
||||||
|
margin-bottom: 12rpx;
|
||||||
|
padding: 40rpx 20rpx;
|
||||||
|
background-color: #fff;
|
||||||
|
|
||||||
|
.head {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
|
||||||
|
.left-wrapper {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.logo {
|
||||||
|
width: 80rpx;
|
||||||
|
height: 80rpx;
|
||||||
|
|
||||||
|
image {
|
||||||
|
width: 80rpx;
|
||||||
|
height: 80rpx;
|
||||||
|
border-radius: 6rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.con-box {
|
||||||
|
margin-left: 20rpx;
|
||||||
|
|
||||||
|
.name {
|
||||||
|
font-size: 30rpx;
|
||||||
|
color: #333;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.link {
|
||||||
|
width: 114rpx;
|
||||||
|
height: 50rpx;
|
||||||
|
line-height: 50rpx;
|
||||||
|
background: linear-gradient(-90deg, rgba(246, 122, 56, 1) 0%, rgba(241, 27, 9, 1) 100%);
|
||||||
|
border-radius: 25rpx;
|
||||||
|
text-align: center;
|
||||||
|
color: #fff;
|
||||||
|
font-size: 24rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.pic-wrapper {
|
||||||
|
display: flex;
|
||||||
|
margin-top: 30rpx;
|
||||||
|
.pic-item {
|
||||||
|
position: relative;
|
||||||
|
width: 226rpx;
|
||||||
|
height: 226rpx;
|
||||||
|
margin-right: 16rpx;
|
||||||
|
image {
|
||||||
|
width: 226rpx;
|
||||||
|
height: 226rpx;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
}
|
||||||
|
.price {
|
||||||
|
position: absolute;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
height: 36rpx;
|
||||||
|
padding: 0 10rpx;
|
||||||
|
line-height: 36rpx;
|
||||||
|
text-align: center;
|
||||||
|
background: rgba(0, 0, 0, .5);
|
||||||
|
border-radius: 16rpx 2rpx 16rpx 2rpx;
|
||||||
|
color: #fff;
|
||||||
|
font-size: 24rpx;
|
||||||
|
|
||||||
|
text {
|
||||||
|
font-size: 18rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&:nth-child(3n) {
|
||||||
|
margin-right: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.productList .list .item.on {
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
border-bottom: 1rpx solid #f6f6f6;
|
||||||
|
padding: 30rpx 0;
|
||||||
|
margin: 0;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.productList .list .item .pictrue.on {
|
||||||
|
width: 260rpx;
|
||||||
|
height: 260rpx;
|
||||||
|
}
|
||||||
|
.productList .list .item .pictrue image {
|
||||||
|
width: 260rpx;
|
||||||
|
height: 260rpx;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
}
|
||||||
|
.productList .list .item .text {
|
||||||
|
font-size: 30rpx;
|
||||||
|
color: #222;
|
||||||
|
width: 460rpx;
|
||||||
|
padding: 0 0 0 22rpx;
|
||||||
|
justify-content: space-between;
|
||||||
|
.name,.item_bot{
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.productList .list .item .text .money {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
font-size: 26rpx;
|
||||||
|
font-weight: bold;
|
||||||
|
color: var(--view-priceColor);
|
||||||
|
}
|
||||||
|
.productList .list .item .text .money .num {
|
||||||
|
font-size: 34rpx;
|
||||||
|
}
|
||||||
|
.productList .distance {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
font-size: 24rpx;
|
||||||
|
color: #999999;
|
||||||
|
|
||||||
|
.icon-xiangyou {
|
||||||
|
font-size: 24rpx;
|
||||||
|
line-height: 24rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.productList .list .item .text .score {
|
||||||
|
margin-top: 10rpx;
|
||||||
|
color: #737373;
|
||||||
|
font-size: 20rpx;
|
||||||
|
}
|
||||||
|
.productList .list .item .text .company {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
color: #737373;
|
||||||
|
font-size: 20rpx;
|
||||||
|
margin-top: 10rpx;
|
||||||
|
.name {
|
||||||
|
display: inline-block;
|
||||||
|
width: 200rpx;
|
||||||
|
overflow: hidden;
|
||||||
|
white-space: nowrap;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
}
|
||||||
|
.flex {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
margin-left: 10rpx;
|
||||||
|
color: #282828;
|
||||||
|
.iconfont {
|
||||||
|
font-size: 16rpx;
|
||||||
|
margin-top: 4rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
974
pages/columnGoods/goods_list/index.vue
Normal file
974
pages/columnGoods/goods_list/index.vue
Normal file
@ -0,0 +1,974 @@
|
|||||||
|
<template>
|
||||||
|
<view :style="viewColor">
|
||||||
|
<view class='productList'>
|
||||||
|
<view class='search acea-row row-between-wrapper'>
|
||||||
|
<!--#ifdef H5-->
|
||||||
|
<view class="back" @click='set_where(1)'>
|
||||||
|
<view class="iconfont icon-xiangzuo"></view>
|
||||||
|
</view>
|
||||||
|
<!--#endif-->
|
||||||
|
<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='where.keyword'
|
||||||
|
@confirm="searchSubmit"></input>
|
||||||
|
</view>
|
||||||
|
<view style="text-align: right;" class='iconfont' :class='is_switch==true?"icon-pailie":"icon-tupianpailie"' @click='Changswitch'></view>
|
||||||
|
</view>
|
||||||
|
<view class="nav-wrapper">
|
||||||
|
<view class='nav acea-row row-middle'>
|
||||||
|
<view class='item' @click="downStatus = !downStatus" :class="{'t-color':downKey>0 && firstKey == 0}">
|
||||||
|
{{downMenu[downKey].title}}
|
||||||
|
<text v-if="!downStatus" class="iconfont icon-xiala1 spin"></text>
|
||||||
|
<text v-else class="iconfont icon-xiala1"></text>
|
||||||
|
</view>
|
||||||
|
<view class='item' :class="{'t-color':firstKey == 3}" @click='set_where(3)'>
|
||||||
|
销量
|
||||||
|
</view>
|
||||||
|
<view class='item' :class="{'t-color':firstKey == 2}" @click='set_where(2)'>
|
||||||
|
价格
|
||||||
|
<image v-if="price==1" :src="domain+'/static/diy/up'+keyColor+'.png'"></image>
|
||||||
|
<image v-else-if="price==2" :src="domain+'/static/diy/down'+keyColor+'.png'"></image>
|
||||||
|
<image v-else src='/static/images/horn.png'></image>
|
||||||
|
</view>
|
||||||
|
<!-- down -->
|
||||||
|
<view class='item' :class="{'t-color':firstKey == 4}" @click='bindRight'>
|
||||||
|
筛选
|
||||||
|
<text class="iconfont icon-shaixuan"></text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<!-- 商品 -->
|
||||||
|
<block v-if="tabIndex == 1">
|
||||||
|
<view v-if="!is_switch" class='list acea-row row-between-wrapper on'>
|
||||||
|
<view class='item on' hover-class='none' v-for="(item,index) in productList" :key="index"
|
||||||
|
@click="godDetail(item)">
|
||||||
|
<view class='pictrue on'>
|
||||||
|
<image :src='item.image' class="on"></image>
|
||||||
|
<view v-if="item.border_pic" :style="{ backgroundImage: `url(${item.border_pic})` }" class="border-picture"></view>
|
||||||
|
</view>
|
||||||
|
<view class='text on'>
|
||||||
|
<view class='name line1'>
|
||||||
|
<text class="text_name line2">{{item.store_name}}</text>
|
||||||
|
</view>
|
||||||
|
<view class='money on'>￥<text class='num'>{{item.price}}</text></view>
|
||||||
|
<view class="item_tags">
|
||||||
|
<text v-if="item.merchant.type_name && item.product_type == 0" class="font-bg-red bt-color">{{item.merchant.type_name}}</text>
|
||||||
|
<text v-else-if="item.merchant.is_trader && item.product_type == 0" class="font-bg-red bt-color">自营</text>
|
||||||
|
<text v-if="item.product_type != 0" :class="'font_bg-red bt-color type'+item.product_type">{{item.product_type == 1 ? "秒杀" : item.product_type == 2 ? "预售" : item.product_type == 3 ? "助力" : item.product_type == 4 ? "拼团" : ""}}</text>
|
||||||
|
<text class="tags_item ticket" v-if="item.issetCoupon">领券</text>
|
||||||
|
<text class="tags_item delivery" v-if="item.delivery_free == 1">包邮</text>
|
||||||
|
</view>
|
||||||
|
<view class="score">{{item.rate}}评分 {{item.reply_count}}条评论</view>
|
||||||
|
<view class="company" v-if="item.merchant" @click.stop="goShop(item.mer_id)">
|
||||||
|
<text class="line1">{{item.merchant.mer_name}}</text>
|
||||||
|
<view class="flex">
|
||||||
|
进店
|
||||||
|
<text class="iconfont icon-xiangyou"></text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<!-- 返佣 -->
|
||||||
|
<block v-if="item.max_extension>0 && (item.product_type == 0 || item.product_type == 2)">
|
||||||
|
<view class="foot-bar on">
|
||||||
|
最高赚 ¥{{item.max_extension}}
|
||||||
|
</view>
|
||||||
|
</block>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view v-else class='list'>
|
||||||
|
<WaterfallsFlow :wfList='productList' @itemTap="godDetail" :type="1" @goShop="goShop"/>
|
||||||
|
</view>
|
||||||
|
<view class='noCommodity' v-if="productList.length==0 && where.page > 1">
|
||||||
|
<view class='pictrue' style="margin: 60rpx auto;">
|
||||||
|
<image src='/static/images/noCart.png'></image>
|
||||||
|
<view>暂无商品，去看点什么吧</view>
|
||||||
|
</view>
|
||||||
|
<recommend v-if="recommend_switch == 1" :hostProduct="hostProduct" :isLogin="isLogin"></recommend>
|
||||||
|
</view>
|
||||||
|
</block>
|
||||||
|
<rightSlider v-if="rightBox" :status="rightBox" :brandList="brandList" @confirm="confirm" @close="close"></rightSlider>
|
||||||
|
</view>
|
||||||
|
<view class="down-wrapper" v-if="downStatus">
|
||||||
|
<view class="bg"></view>
|
||||||
|
<view class="down-box">
|
||||||
|
<view class="down-item" v-for="(item,index) in downMenu" :key="item.key" :class="{'on':index == downKey}" @click="bindDown(item,index)">
|
||||||
|
{{item.title}}
|
||||||
|
<text v-if="index == downKey" class="iconfont icon-gou"></text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<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 {
|
||||||
|
getProductslist,
|
||||||
|
getProductHot,
|
||||||
|
getBrandlist,
|
||||||
|
storeMerchantList
|
||||||
|
} from '@/api/store.js';
|
||||||
|
import recommend from '@/components/recommend';
|
||||||
|
import rightSlider from '@/components/rightSlider.vue'
|
||||||
|
import WaterfallsFlow from '@/components/WaterfallsFlow/WaterfallsFlow.vue'
|
||||||
|
import {initiateAssistApi} from '@/api/activity.js';
|
||||||
|
import { configMap } from "@/utils";
|
||||||
|
import { mapGetters } from "vuex";
|
||||||
|
// #ifndef H5
|
||||||
|
import passwordPopup from '@/components/passwordPopup';
|
||||||
|
// #endif
|
||||||
|
import authorize from '@/components/Authorize';
|
||||||
|
import {
|
||||||
|
goShopDetail
|
||||||
|
} from '@/libs/order.js'
|
||||||
|
import { HTTP_REQUEST_URL } from '@/config/app';
|
||||||
|
const app = getApp();
|
||||||
|
export default {
|
||||||
|
computed: configMap({hide_mer_status: 1,recommend_switch: 0}, mapGetters(['uid','isLogin','scrollTop','viewColor','keyColor'])),
|
||||||
|
components: {
|
||||||
|
// #ifndef H5
|
||||||
|
passwordPopup,
|
||||||
|
// #endif
|
||||||
|
recommend,
|
||||||
|
rightSlider,
|
||||||
|
WaterfallsFlow,
|
||||||
|
authorize,
|
||||||
|
},
|
||||||
|
watch:{
|
||||||
|
tabIndex(nVal,oVal){
|
||||||
|
if(nVal == 1){
|
||||||
|
this.loadend = false;
|
||||||
|
this.$set(this.where, 'page', 1)
|
||||||
|
this.get_product_list(true);
|
||||||
|
}else{
|
||||||
|
this.downStatus = false
|
||||||
|
this.storeMerchantList()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
domain: HTTP_REQUEST_URL,
|
||||||
|
productList: [],
|
||||||
|
list: [],
|
||||||
|
is_switch: true,
|
||||||
|
where: {
|
||||||
|
cate_pid: '',
|
||||||
|
order: '',
|
||||||
|
price_on: '',
|
||||||
|
price_off: '',
|
||||||
|
brand_id: '',
|
||||||
|
keyword:'',
|
||||||
|
page:1,
|
||||||
|
limit:30
|
||||||
|
},
|
||||||
|
price: 0,
|
||||||
|
stock: 0,
|
||||||
|
nows: false,
|
||||||
|
loadend: false,
|
||||||
|
loading: false,
|
||||||
|
loadTitle: '加载更多',
|
||||||
|
title: '',
|
||||||
|
hostProduct: [],
|
||||||
|
hotPage: 1,
|
||||||
|
hotLimit: 10,
|
||||||
|
hotScroll: false,
|
||||||
|
// 筛选框
|
||||||
|
rightBox: false,
|
||||||
|
//品牌列表
|
||||||
|
brandList: [],
|
||||||
|
downKey: 0,
|
||||||
|
downStatus: false,
|
||||||
|
// 下拉菜单
|
||||||
|
downMenu: [{
|
||||||
|
title: '综合',
|
||||||
|
key: 1,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '评分',
|
||||||
|
key: 2,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: '新品',
|
||||||
|
key: 3,
|
||||||
|
}
|
||||||
|
],
|
||||||
|
// 是否第一个
|
||||||
|
firstKey:0,
|
||||||
|
// tab切换
|
||||||
|
tabIndex: 1,
|
||||||
|
// 商铺列表
|
||||||
|
storeList: [],
|
||||||
|
sotreParam:{
|
||||||
|
keyword:'',
|
||||||
|
page:1,
|
||||||
|
limit:30,
|
||||||
|
order:''
|
||||||
|
},
|
||||||
|
storeKey:0,
|
||||||
|
storeScroll:true,
|
||||||
|
isShowAuth: false, //是否隐藏授权
|
||||||
|
isAuto: false, //没有授权的不会自动授权
|
||||||
|
};
|
||||||
|
},
|
||||||
|
// 滚动监听
|
||||||
|
onPageScroll() {
|
||||||
|
uni.$emit('scroll');
|
||||||
|
},
|
||||||
|
onLoad: function(options) {
|
||||||
|
this.$set(this.where, 'cate_pid', options.id || '');
|
||||||
|
this.title = options.title || '';
|
||||||
|
this.$set(this.where, 'keyword', options.searchValue || '');
|
||||||
|
this.get_product_list(true);
|
||||||
|
this.get_host_product();
|
||||||
|
},
|
||||||
|
onReady(){
|
||||||
|
|
||||||
|
},
|
||||||
|
mounted: function() {
|
||||||
|
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
// 授权回调
|
||||||
|
onLoadFun() {
|
||||||
|
this.isShowAuth = false
|
||||||
|
},
|
||||||
|
// 授权关闭
|
||||||
|
authColse: function(e) {
|
||||||
|
this.isShowAuth = e
|
||||||
|
},
|
||||||
|
// 去店铺
|
||||||
|
goShop(id){
|
||||||
|
if(this.hide_mer_status != 1){
|
||||||
|
uni.navigateTo({
|
||||||
|
url:`/pages/store/home/index?id=${id}`
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 查找店铺
|
||||||
|
storeMerchantList(){
|
||||||
|
if(!this.storeScroll) return
|
||||||
|
storeMerchantList({
|
||||||
|
keyword:this.where.keyword,
|
||||||
|
page:this.sotreParam.page,
|
||||||
|
limit:this.sotreParam.limit,
|
||||||
|
order:this.sotreParam.order
|
||||||
|
}).then(res=>{
|
||||||
|
this.storeScroll = res.data.list.length>=this.sotreParam.limit
|
||||||
|
this.sotreParam.page+=1
|
||||||
|
this.storeList =this.storeList.concat(res.data.list)
|
||||||
|
})
|
||||||
|
},
|
||||||
|
// 店铺排序
|
||||||
|
storeTab(key){
|
||||||
|
this.storeKey = key
|
||||||
|
if(key == 0){
|
||||||
|
this.sotreParam.order = ''
|
||||||
|
}else if(key == 1){
|
||||||
|
this.sotreParam.order = 'sales'
|
||||||
|
}else{
|
||||||
|
this.sotreParam.order = 'rate'
|
||||||
|
}
|
||||||
|
this.sotreParam.page = 1
|
||||||
|
this.storeScroll = true
|
||||||
|
this.storeList = []
|
||||||
|
this.storeMerchantList()
|
||||||
|
},
|
||||||
|
// 右侧切换
|
||||||
|
bindRight(){
|
||||||
|
this.price = 0;
|
||||||
|
this.firstKey = 4
|
||||||
|
this.getBrandlist()
|
||||||
|
|
||||||
|
},
|
||||||
|
// 品牌列表
|
||||||
|
getBrandlist(){
|
||||||
|
let temp = []
|
||||||
|
getBrandlist({
|
||||||
|
cate_pid:this.where.cate_pid,
|
||||||
|
keyword:this.where.keyword
|
||||||
|
}).then(res=>{
|
||||||
|
temp = res.data.list.map(item=>{
|
||||||
|
return {
|
||||||
|
...item,
|
||||||
|
check:false
|
||||||
|
}
|
||||||
|
})
|
||||||
|
if(this.where.brand_id.length>0){
|
||||||
|
this.where.brand_id.forEach((ids,index)=>{
|
||||||
|
temp.forEach(el=>{
|
||||||
|
if(ids == el.brand_id){
|
||||||
|
el.check = true
|
||||||
|
}
|
||||||
|
})
|
||||||
|
})
|
||||||
|
}
|
||||||
|
this.brandList = temp
|
||||||
|
this.rightBox = true
|
||||||
|
})
|
||||||
|
},
|
||||||
|
// 去详情页
|
||||||
|
godDetail(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
|
||||||
|
}
|
||||||
|
|
||||||
|
})
|
||||||
|
},
|
||||||
|
// 组件确定
|
||||||
|
confirm(data) {
|
||||||
|
let arr = []
|
||||||
|
if(data.brandList.length == 0){
|
||||||
|
this.where.brand_id = ''
|
||||||
|
}else{
|
||||||
|
data.brandList.forEach(item =>{
|
||||||
|
arr.push(item.brand_id)
|
||||||
|
})
|
||||||
|
this.where.brand_id =arr
|
||||||
|
}
|
||||||
|
this.rightBox = data.status
|
||||||
|
this.where.price_on = data.price_on
|
||||||
|
this.where.price_off = data.price_off
|
||||||
|
this.loadend = false;
|
||||||
|
this.$set(this.where, 'page', 1)
|
||||||
|
this.get_product_list(true);
|
||||||
|
|
||||||
|
},
|
||||||
|
// 组件关闭
|
||||||
|
close() {
|
||||||
|
this.rightBox = false
|
||||||
|
},
|
||||||
|
// 下拉选项
|
||||||
|
bindDown(item, index) {
|
||||||
|
this.firstKey = 0
|
||||||
|
if(index == 0){
|
||||||
|
this.where.order = ''
|
||||||
|
}else if(index == 1){
|
||||||
|
this.where.order = 'rate'
|
||||||
|
}else if(index == 2){
|
||||||
|
this.where.order = 'is_new'
|
||||||
|
}
|
||||||
|
this.downKey = index
|
||||||
|
this.downStatus = false
|
||||||
|
this.loadend = false;
|
||||||
|
this.$set(this.where, 'page', 1)
|
||||||
|
this.get_product_list(true);
|
||||||
|
},
|
||||||
|
Changswitch: function() {
|
||||||
|
let that = this;
|
||||||
|
that.is_switch = !that.is_switch
|
||||||
|
},
|
||||||
|
searchSubmit: function(e) {
|
||||||
|
let that = this;
|
||||||
|
that.$set(that.where, 'keyword', e.detail.value);
|
||||||
|
if(this.tabIndex == 1){
|
||||||
|
that.loadend = false;
|
||||||
|
that.$set(that.where, 'page', 1)
|
||||||
|
this.get_product_list(true);
|
||||||
|
}else{
|
||||||
|
this.sotreParam.page = 1
|
||||||
|
this.storeScroll = true
|
||||||
|
this.storeList = []
|
||||||
|
this.storeMerchantList()
|
||||||
|
}
|
||||||
|
|
||||||
|
},
|
||||||
|
/**
|
||||||
|
* 获取我的推荐
|
||||||
|
*/
|
||||||
|
get_host_product: function() {
|
||||||
|
let that = this;
|
||||||
|
if (that.hotScroll) return
|
||||||
|
getProductHot(
|
||||||
|
that.hotPage,
|
||||||
|
that.hotLimit,
|
||||||
|
).then(res => {
|
||||||
|
that.hotPage++
|
||||||
|
that.hotScroll = res.data.length < that.hotLimit
|
||||||
|
that.hostProduct = that.hostProduct.concat(res.data.list)
|
||||||
|
// that.$set(that, 'hostProduct', res.data)
|
||||||
|
});
|
||||||
|
},
|
||||||
|
//点击事件处理
|
||||||
|
set_where: function(e) {
|
||||||
|
switch (e) {
|
||||||
|
case 1:
|
||||||
|
uni.setStorageSync('storeIndex', this.where.cate_pid);
|
||||||
|
uni.navigateBack()
|
||||||
|
break
|
||||||
|
case 2:
|
||||||
|
this.firstKey = e
|
||||||
|
if (this.price == 0){
|
||||||
|
this.price = 1;
|
||||||
|
this.where.order = 'price_asc'
|
||||||
|
}else if (this.price == 1){
|
||||||
|
this.price = 2;
|
||||||
|
this.where.order = 'price_desc'
|
||||||
|
}else if (this.price == 2){
|
||||||
|
this.price = 0;
|
||||||
|
this.where.order = ''
|
||||||
|
}
|
||||||
|
this.$set(this.where, 'page', 1)
|
||||||
|
this.get_product_list(true);
|
||||||
|
break;
|
||||||
|
case 3:
|
||||||
|
this.price = 0;
|
||||||
|
this.loadend = false;
|
||||||
|
this.$set(this.where, 'order', 'sales')
|
||||||
|
this.$set(this.where, 'page', 1)
|
||||||
|
this.get_product_list(true);
|
||||||
|
this.firstKey = e
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
this.loadend = false;
|
||||||
|
this.$set(this.where, 'page', 1);
|
||||||
|
this.get_product_list(true);
|
||||||
|
},
|
||||||
|
//查找产品
|
||||||
|
get_product_list: function(isPage) {
|
||||||
|
let that = this;
|
||||||
|
if (that.loadend) return;
|
||||||
|
if (that.loading) return;
|
||||||
|
if (isPage === true) that.$set(that, 'productList', []);
|
||||||
|
that.loading = true;
|
||||||
|
that.loadTitle = '';
|
||||||
|
getProductslist(that.where).then(res => {
|
||||||
|
let list = res.data.list;
|
||||||
|
let productList = that.$util.SplitArray(list, that.productList);
|
||||||
|
let loadend = list.length < that.where.limit;
|
||||||
|
that.loadend = loadend;
|
||||||
|
that.loading = false;
|
||||||
|
that.loadTitle = loadend ? '已全部加载' : '加载更多';
|
||||||
|
that.$set(that, 'productList', productList);
|
||||||
|
that.$set(that.where, 'page', that.where.page + 1);
|
||||||
|
}).catch(err => {
|
||||||
|
that.loading = false;
|
||||||
|
that.loadTitle = '加载更多';
|
||||||
|
});
|
||||||
|
},
|
||||||
|
},
|
||||||
|
onPullDownRefresh() {
|
||||||
|
|
||||||
|
},
|
||||||
|
onReachBottom() {
|
||||||
|
if(this.tabIndex == 1){
|
||||||
|
if (this.productList.length > 0) {
|
||||||
|
this.get_product_list('');
|
||||||
|
} else {
|
||||||
|
this.get_host_product();
|
||||||
|
}
|
||||||
|
}else{
|
||||||
|
this.storeMerchantList()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onPullDownRefresh(){
|
||||||
|
// 模拟上拉刷新
|
||||||
|
setTimeout(()=>{
|
||||||
|
const newList = this.productList.reverse();
|
||||||
|
this.productList = newList;
|
||||||
|
uni.stopPullDownRefresh();
|
||||||
|
},500)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</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;
|
||||||
|
background-color: var(--view-theme);
|
||||||
|
}
|
||||||
|
.bt-color{
|
||||||
|
background-color: var(--view-theme);
|
||||||
|
border:1px solid var(--view-theme);
|
||||||
|
&.type2{
|
||||||
|
background-color: #FD6523;
|
||||||
|
border: 1px solid #FD6523;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.productList .search .back {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
width: 40rpx;
|
||||||
|
height: 60rpx;
|
||||||
|
|
||||||
|
.iconfont {
|
||||||
|
color: #fff;
|
||||||
|
font-size: 36rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.productList .search .input {
|
||||||
|
width: 570rpx;
|
||||||
|
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: #fff;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
padding: 0 28rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.productList .nav .item {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
flex: 1;
|
||||||
|
&.t-color{
|
||||||
|
// color: var(--view-theme);
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.productList .nav .item image {
|
||||||
|
width: 15rpx;
|
||||||
|
height: 19rpx;
|
||||||
|
margin-left: 10rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.productList .list {
|
||||||
|
padding: 0 20rpx;
|
||||||
|
margin-top: 168rpx;
|
||||||
|
// min-height: 100vh;
|
||||||
|
}
|
||||||
|
|
||||||
|
.productList .list.on {
|
||||||
|
background-color: #fff;
|
||||||
|
border-top: 1px solid #f6f6f6;
|
||||||
|
}
|
||||||
|
|
||||||
|
.noCommodity {
|
||||||
|
background-color: #fff;
|
||||||
|
padding-bottom: 30rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.spin {
|
||||||
|
display: block;
|
||||||
|
transform: rotate(180deg);
|
||||||
|
font-size: 36rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-xiala1 {
|
||||||
|
margin-top: 6rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-shaixuan {
|
||||||
|
font-size: 30rpx;
|
||||||
|
margin-left: 10rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.down-wrapper {
|
||||||
|
.bg {
|
||||||
|
z-index: 8;
|
||||||
|
position: fixed;
|
||||||
|
left: 0;
|
||||||
|
top: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
background: rgba(0, 0, 0, .5);
|
||||||
|
}
|
||||||
|
|
||||||
|
.down-box {
|
||||||
|
z-index: 8;
|
||||||
|
position: fixed;
|
||||||
|
left: 0;
|
||||||
|
top: 170rpx;
|
||||||
|
width: 100%;
|
||||||
|
padding: 0 40rpx 28rpx 74rpx;
|
||||||
|
background-color: #F8F8F8;
|
||||||
|
border-radius: 0 0 24rpx 24rpx;
|
||||||
|
.down-item {
|
||||||
|
margin-top: 28rpx;
|
||||||
|
font-size: 24rpx;
|
||||||
|
color: #454545;
|
||||||
|
&.on {
|
||||||
|
color: var(--view-theme);
|
||||||
|
}
|
||||||
|
.iconfont{
|
||||||
|
float: right;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.store-wrapper {
|
||||||
|
margin-top: 240rpx;
|
||||||
|
border-top: 1px solid #F6F6F6;
|
||||||
|
|
||||||
|
.star-box {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.star {
|
||||||
|
position: relative;
|
||||||
|
width: 111rpx;
|
||||||
|
height: 19rpx;
|
||||||
|
background: url(~pages/columnGoods/images/star.png);
|
||||||
|
background-size: 111rpx 19rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.star-active {
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
top: 0;
|
||||||
|
width: 111rpx;
|
||||||
|
height: 19rpx;
|
||||||
|
overflow: hidden;
|
||||||
|
background: url(~pages/columnGoods/images/star_active.png);
|
||||||
|
background-size: 111rpx 19rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.num {
|
||||||
|
color: $theme-color;
|
||||||
|
font-size: 24rpx;
|
||||||
|
margin-left: 10rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.store-item {
|
||||||
|
margin-bottom: 12rpx;
|
||||||
|
padding: 40rpx 20rpx;
|
||||||
|
background-color: #fff;
|
||||||
|
|
||||||
|
.head {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
|
||||||
|
.left-wrapper {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.logo {
|
||||||
|
width: 80rpx;
|
||||||
|
height: 80rpx;
|
||||||
|
|
||||||
|
image {
|
||||||
|
width: 80rpx;
|
||||||
|
height: 80rpx;
|
||||||
|
border-radius: 6rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.con-box {
|
||||||
|
margin-left: 20rpx;
|
||||||
|
|
||||||
|
.name {
|
||||||
|
font-size: 30rpx;
|
||||||
|
color: #333;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.link {
|
||||||
|
width: 114rpx;
|
||||||
|
height: 50rpx;
|
||||||
|
line-height: 50rpx;
|
||||||
|
background: linear-gradient(-90deg, rgba(246, 122, 56, 1) 0%, rgba(241, 27, 9, 1) 100%);
|
||||||
|
border-radius: 25rpx;
|
||||||
|
text-align: center;
|
||||||
|
color: #fff;
|
||||||
|
font-size: 24rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.pic-wrapper {
|
||||||
|
display: flex;
|
||||||
|
margin-top: 30rpx;
|
||||||
|
|
||||||
|
.pic-item {
|
||||||
|
position: relative;
|
||||||
|
width: 226rpx;
|
||||||
|
height: 226rpx;
|
||||||
|
margin-right: 16rpx;
|
||||||
|
|
||||||
|
image {
|
||||||
|
width: 226rpx;
|
||||||
|
height: 226rpx;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.price {
|
||||||
|
position: absolute;
|
||||||
|
right: 0;
|
||||||
|
bottom: 0;
|
||||||
|
height: 36rpx;
|
||||||
|
padding: 0 10rpx;
|
||||||
|
line-height: 36rpx;
|
||||||
|
text-align: center;
|
||||||
|
background: rgba(0, 0, 0, .5);
|
||||||
|
border-radius: 16rpx 2rpx 16rpx 2rpx;
|
||||||
|
color: #fff;
|
||||||
|
font-size: 24rpx;
|
||||||
|
|
||||||
|
text {
|
||||||
|
font-size: 18rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&:nth-child(3n) {
|
||||||
|
margin-right: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.productList .list .item.on {
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
border-bottom: 1px solid #f6f6f6;
|
||||||
|
padding: 30rpx 0;
|
||||||
|
margin: 0;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.productList .list .item .pictrue.on {
|
||||||
|
position: relative;
|
||||||
|
width: 260rpx;
|
||||||
|
height: 260rpx;
|
||||||
|
.border-picture {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
background: center/cover no-repeat;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.productList .list .item .pictrue image {
|
||||||
|
width: 260rpx;
|
||||||
|
height: 260rpx;
|
||||||
|
border-radius: 20rpx 20rpx 0 0;
|
||||||
|
}
|
||||||
|
.productList .list .item .pictrue image.on {
|
||||||
|
border-radius: 6rpx;
|
||||||
|
}
|
||||||
|
.productList .list .item .text {
|
||||||
|
font-size: 30rpx;
|
||||||
|
color: #222;
|
||||||
|
width: 460rpx;
|
||||||
|
padding: 0 0 0 22rpx;
|
||||||
|
.name{
|
||||||
|
height: 80rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.item_tags{
|
||||||
|
margin-top: 8rpx;
|
||||||
|
}
|
||||||
|
.item_tags .tags_item {
|
||||||
|
display: inline-block;
|
||||||
|
font-size: 20rpx;
|
||||||
|
text-align: center;
|
||||||
|
border-radius: 5rpx;
|
||||||
|
padding: 0 4rpx;
|
||||||
|
line-height: 28rpx;
|
||||||
|
margin-right: 8rpx;
|
||||||
|
}
|
||||||
|
.item_tags .tags_item.ticket{
|
||||||
|
color: #E93323;
|
||||||
|
border: 1px solid #E93323;
|
||||||
|
}
|
||||||
|
.item_tags .tags_item.delivery{
|
||||||
|
color: #FF9000;
|
||||||
|
border: 1px solid #FF9000;
|
||||||
|
}
|
||||||
|
.productList .list .item .text .money {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
font-size: 26rpx;
|
||||||
|
font-weight: bold;
|
||||||
|
margin-top: 10rpx;
|
||||||
|
color: var(--view-priceColor);
|
||||||
|
}
|
||||||
|
.productList .list .item .text .money .num {
|
||||||
|
font-size: 34rpx;
|
||||||
|
}
|
||||||
|
.productList .distance {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
font-size: 24rpx;
|
||||||
|
color: #999999;
|
||||||
|
|
||||||
|
.icon-xiangyou {
|
||||||
|
font-size: 24rpx;
|
||||||
|
line-height: 24rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.productList .list .item .text .money .ticket-big {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
min-width: 163rpx;
|
||||||
|
height: 28rpx;
|
||||||
|
margin-left: 10rpx;
|
||||||
|
background-image: url(~static/images/yh.png);
|
||||||
|
background-size: 100% 100%;
|
||||||
|
font-size: 20rpx;
|
||||||
|
font-weight: normal;
|
||||||
|
padding: 0 10rpx;
|
||||||
|
}
|
||||||
|
.productList .list .item .text .score {
|
||||||
|
margin-top: 10rpx;
|
||||||
|
color: #737373;
|
||||||
|
font-size: 20rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.productList .list .item .text .company {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
color: #737373;
|
||||||
|
font-size: 20rpx;
|
||||||
|
margin-top: 10rpx;
|
||||||
|
|
||||||
|
.name {
|
||||||
|
display: inline-block;
|
||||||
|
width: 200rpx;
|
||||||
|
overflow: hidden;
|
||||||
|
white-space: nowrap;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
}
|
||||||
|
.flex {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
margin-left: 10rpx;
|
||||||
|
color: #282828;
|
||||||
|
.iconfont {
|
||||||
|
font-size: 16rpx;
|
||||||
|
margin-top: 4rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.productList .list .item .foot-bar {
|
||||||
|
width: 100%;
|
||||||
|
height: 52rpx;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
background-image: linear-gradient(-90deg, var(--view-bntColor21) 0%, var(--view-bntColor22) 100%);
|
||||||
|
border-radius: 0px 0px 16rpx 16rpx;
|
||||||
|
color: #fff;
|
||||||
|
font-size: 24rpx;
|
||||||
|
.icon-fenxiang {
|
||||||
|
font-size: 24rpx;
|
||||||
|
margin-right: 10rpx;
|
||||||
|
}
|
||||||
|
&.on {
|
||||||
|
position: absolute;
|
||||||
|
right: 0;
|
||||||
|
bottom: 30rpx;
|
||||||
|
width: 180rpx;
|
||||||
|
height: 44rpx;
|
||||||
|
border-radius: 22rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
334
pages/columnGoods/goods_search/index.vue
Normal file
334
pages/columnGoods/goods_search/index.vue
Normal file
@ -0,0 +1,334 @@
|
|||||||
|
<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"></input>
|
||||||
|
</view>
|
||||||
|
<view class='bnt' @tap='searchBut'>搜索</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>
|
||||||
|
<authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse" :isGoIndex="false"></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 { getSearchKeyword,copyPasswordSearch } from '@/api/store.js';
|
||||||
|
import shareScence from '@/libs/spread';
|
||||||
|
import { silenceBindingSpread } from '@/utils';
|
||||||
|
import { goShopDetail } from '@/libs/order.js';
|
||||||
|
import { initiateAssistApi } from '@/api/activity.js';
|
||||||
|
import { mapGetters } from 'vuex';
|
||||||
|
// #ifndef H5
|
||||||
|
import passwordPopup from '@/components/passwordPopup';
|
||||||
|
// #endif
|
||||||
|
import authorize from '@/components/Authorize';
|
||||||
|
export default {
|
||||||
|
computed: mapGetters(['isLogin', 'uid']),
|
||||||
|
components: {
|
||||||
|
// #ifndef H5
|
||||||
|
passwordPopup,
|
||||||
|
// #endif
|
||||||
|
authorize,
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
hostProduct: [],
|
||||||
|
searchValue: '',
|
||||||
|
focus: true,
|
||||||
|
bastList: [],
|
||||||
|
hotSearchList: [],
|
||||||
|
first: 0,
|
||||||
|
limit: 8,
|
||||||
|
page: 1,
|
||||||
|
loading: false,
|
||||||
|
loadend: false,
|
||||||
|
loadTitle: '加载更多',
|
||||||
|
hotPage: 1,
|
||||||
|
isScroll: true,
|
||||||
|
// 搜索历史
|
||||||
|
historyList: [],
|
||||||
|
// 临时搜索列表
|
||||||
|
tempStorage: [],
|
||||||
|
historyBox: false,
|
||||||
|
hotSearchBox: false,
|
||||||
|
isAuto: false, //没有授权的不会自动授权
|
||||||
|
isShowAuth: false, //是否隐藏授权
|
||||||
|
};
|
||||||
|
},
|
||||||
|
onLoad(options) {
|
||||||
|
this.searchValue = options.searchVal || ''
|
||||||
|
},
|
||||||
|
onShow: function() {
|
||||||
|
try {
|
||||||
|
this.historyList = []
|
||||||
|
this.tempStorage = []
|
||||||
|
let arr = uni.getStorageSync('historyList')
|
||||||
|
if (arr.length > 0) {
|
||||||
|
this.historyList = arr
|
||||||
|
} else {
|
||||||
|
this.historyList = []
|
||||||
|
}
|
||||||
|
|
||||||
|
this.tempStorage = this.historyList
|
||||||
|
} catch (e) {}
|
||||||
|
this.getRoutineHotSearch();
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
// 微信登录回调
|
||||||
|
onLoadFun: function(e) {
|
||||||
|
this.isShowAuth = false;
|
||||||
|
},
|
||||||
|
// 授权关闭
|
||||||
|
authColse: function(e) {
|
||||||
|
this.isShowAuth = e;
|
||||||
|
},
|
||||||
|
// 清空历史记录
|
||||||
|
remove() {
|
||||||
|
let self = this
|
||||||
|
uni.showModal({
|
||||||
|
title: '提示',
|
||||||
|
content: '确认删除全部历史搜索记录？',
|
||||||
|
success: function(res) {
|
||||||
|
if (res.confirm) {
|
||||||
|
self.tempStorage = []
|
||||||
|
try {
|
||||||
|
uni.setStorageSync('historyList', self.tempStorage)
|
||||||
|
self.historyList = []
|
||||||
|
} catch (e) {}
|
||||||
|
} else if (res.cancel) {
|
||||||
|
console.log('用户点击取消');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
getRoutineHotSearch: function() {
|
||||||
|
let that = this;
|
||||||
|
getSearchKeyword().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() {
|
||||||
|
if(/^(\/@[1-9]{1}).*\*\//.test(this.searchValue)){
|
||||||
|
uni.showLoading({
|
||||||
|
title: '加载中',
|
||||||
|
mask: true
|
||||||
|
});
|
||||||
|
copyPasswordSearch({key: this.searchValue}).then(res => {
|
||||||
|
uni.hideLoading();
|
||||||
|
let item = res.data
|
||||||
|
shareScence(res.data.user.uid, this.isLogin);
|
||||||
|
//#ifdef H5
|
||||||
|
this.isLogin && silenceBindingSpread();
|
||||||
|
//#endif
|
||||||
|
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
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}).catch(err => {
|
||||||
|
uni.showToast({
|
||||||
|
title: err,
|
||||||
|
icon: 'none'
|
||||||
|
});
|
||||||
|
this.searchValue = ""
|
||||||
|
});
|
||||||
|
}else{
|
||||||
|
|
||||||
|
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('historyList', this.tempStorage);
|
||||||
|
} catch (e) {}
|
||||||
|
|
||||||
|
uni.navigateTo({
|
||||||
|
url: '/pages/columnGoods/goods_search_con/index?searchValue=' + this.searchValue
|
||||||
|
})
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
page {
|
||||||
|
background-color: #fff;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
<style lang="scss">
|
||||||
|
.searchGood .search {
|
||||||
|
padding-left: 30rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.searchGood .search {
|
||||||
|
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>
|
||||||
1659
pages/columnGoods/goods_search_con/index.vue
Normal file
1659
pages/columnGoods/goods_search_con/index.vue
Normal file
File diff suppressed because it is too large
Load Diff
BIN
pages/columnGoods/images/star.png
Normal file
BIN
pages/columnGoods/images/star.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 348 B |
BIN
pages/columnGoods/images/star_active.png
Normal file
BIN
pages/columnGoods/images/star_active.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 373 B |
BIN
pages/columnGoods/images/star_active_purple.png
Normal file
BIN
pages/columnGoods/images/star_active_purple.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 371 B |
530
pages/commissionedSales/addDelegation/index.vue
Normal file
530
pages/commissionedSales/addDelegation/index.vue
Normal file
@ -0,0 +1,530 @@
|
|||||||
|
<template>
|
||||||
|
|
||||||
|
<view class="content">
|
||||||
|
|
||||||
|
<form @submit="formSubmit" report-submit='true'>
|
||||||
|
<view class="release_content">
|
||||||
|
<view class="release_item">
|
||||||
|
<view class="release_item-one">
|
||||||
|
<view class="item-one">
|
||||||
|
被委托商家
|
||||||
|
</view>
|
||||||
|
<e-select v-model="formData.entrust_mer_id" :value='formData.entrust_mer_id' :options="options1" @change="change1"
|
||||||
|
placeholder="选择选项"></e-select>
|
||||||
|
</view>
|
||||||
|
<view class="release_item-one">
|
||||||
|
<view class="item-one">
|
||||||
|
委托周期
|
||||||
|
</view>
|
||||||
|
<view class="">
|
||||||
|
|
||||||
|
<input type="number" v-model="formData.entrust_day" />
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
<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"></image>
|
||||||
|
</view>
|
||||||
|
<text class="iconfont icon-xiangyou"></text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="content_center-one" v-for="(item,i) in productList" :key="i">
|
||||||
|
<view class="center-one">
|
||||||
|
<view class="center-one-img">
|
||||||
|
<image :src="item.image" mode="aspectFit"></image>
|
||||||
|
</view>
|
||||||
|
<view class="center-one-txt">
|
||||||
|
<view class="one-txta">
|
||||||
|
{{item.store_name}}
|
||||||
|
</view>
|
||||||
|
<view class="one-txtb">
|
||||||
|
<view class="">
|
||||||
|
委托价:¥<span>{{item.price}}</span>
|
||||||
|
</view>
|
||||||
|
<view class="">
|
||||||
|
数量:{{item.number}}
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<button class="release_btn button" form-type="submit">提交</button>
|
||||||
|
</view>
|
||||||
|
</form>
|
||||||
|
|
||||||
|
|
||||||
|
<!-- 提到的宝贝弹窗 -->
|
||||||
|
<uni-popup ref="associated" type="bottom">
|
||||||
|
<associated @close="close" @getProduct="getProduct" :checkedObj="productList"></associated>
|
||||||
|
</uni-popup>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import associated from '@/components/realselist/realselist.vue';
|
||||||
|
import eselect from '@/components/e-select/e-select.vue';
|
||||||
|
import {
|
||||||
|
supplychain,
|
||||||
|
entrustchain,
|
||||||
|
editentrust,
|
||||||
|
entrustdetail
|
||||||
|
} from '@/api/sale.js'
|
||||||
|
export default {
|
||||||
|
components: {
|
||||||
|
associated,
|
||||||
|
eselect
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
value1: 1,
|
||||||
|
value2: "",
|
||||||
|
options1: [],
|
||||||
|
|
||||||
|
productList: [],
|
||||||
|
info: {
|
||||||
|
startDate: '',
|
||||||
|
endDate: '',
|
||||||
|
lunar: false,
|
||||||
|
range: true,
|
||||||
|
insert: false,
|
||||||
|
selected: [],
|
||||||
|
showMonth: false
|
||||||
|
},
|
||||||
|
formData: {
|
||||||
|
entrust_mer_id: '',
|
||||||
|
entrust_day: 15,
|
||||||
|
is_type: "4",
|
||||||
|
product_info: [],
|
||||||
|
content: ''
|
||||||
|
},
|
||||||
|
type: ''
|
||||||
|
};
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
|
||||||
|
onLoad(e) {
|
||||||
|
this.id = e.id;
|
||||||
|
this.type = e.type
|
||||||
|
if (this.type) {
|
||||||
|
uni.setNavigationBarTitle({
|
||||||
|
title: '编辑打折'
|
||||||
|
})
|
||||||
|
this.editlist(e.id)
|
||||||
|
}
|
||||||
|
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.list()
|
||||||
|
},
|
||||||
|
|
||||||
|
methods: {
|
||||||
|
change1(item) {
|
||||||
|
console.log(item);
|
||||||
|
},
|
||||||
|
list() {
|
||||||
|
supplychain({
|
||||||
|
page: 1
|
||||||
|
}).then((res => {
|
||||||
|
|
||||||
|
for (let i in res.data.list) {
|
||||||
|
this.options1.push({
|
||||||
|
text: res.data.list[i].mer_name,
|
||||||
|
value: res.data.list[i].mer_id
|
||||||
|
})
|
||||||
|
}
|
||||||
|
// console.log(res)
|
||||||
|
}))
|
||||||
|
},
|
||||||
|
editlist(id) {
|
||||||
|
entrustdetail(id).then((res) => {
|
||||||
|
this.formData.entrust_mer_id = res.data.entrust_mer_id
|
||||||
|
this.formData.entrust_day = res.data.entrust_day
|
||||||
|
this.productList = res.data.product_list
|
||||||
|
this.getProduct(res.data.product_list)
|
||||||
|
})
|
||||||
|
},
|
||||||
|
|
||||||
|
|
||||||
|
calendar() {
|
||||||
|
this.$refs.calendar.open()
|
||||||
|
},
|
||||||
|
//关闭商品弹窗
|
||||||
|
close() {
|
||||||
|
this.$refs.associated.close()
|
||||||
|
},
|
||||||
|
//打开商品弹窗
|
||||||
|
addProduct() {
|
||||||
|
this.$refs.associated.open()
|
||||||
|
},
|
||||||
|
//获取商品信息
|
||||||
|
getProduct(data) {
|
||||||
|
this.formData.product_info=[]
|
||||||
|
if (data.length > 0) {
|
||||||
|
|
||||||
|
for (let i in data) {
|
||||||
|
this.formData.content += data[i].store_name + ','
|
||||||
|
this.formData.product_info.push({
|
||||||
|
product_attr_unique: data[i].product_attr_unique,
|
||||||
|
number: Number(data[i].number),
|
||||||
|
price: data[i].price
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
this.$refs.associated.close()
|
||||||
|
},
|
||||||
|
//提交
|
||||||
|
formSubmit(e) {
|
||||||
|
console.log(e)
|
||||||
|
let that = this,
|
||||||
|
value = that.formData;
|
||||||
|
|
||||||
|
if (value.entrust_day.length == 0 || value.entrust_day <= 0) return that.$util.Tips({
|
||||||
|
title: '请选择委托周期'
|
||||||
|
});
|
||||||
|
if (value.product_info.length == 0) return that.$util.Tips({
|
||||||
|
title: '请选择产品'
|
||||||
|
});
|
||||||
|
if (!value.entrust_mer_id) return that.$util.Tips({
|
||||||
|
title: '请添加商家'
|
||||||
|
});
|
||||||
|
this.type?
|
||||||
|
editentrust(this.id,value).then(res => {
|
||||||
|
if (res.status == '200') {
|
||||||
|
uni.hideLoading()
|
||||||
|
that.$util.Tips({
|
||||||
|
title: '编辑成功',
|
||||||
|
icon: 'success'
|
||||||
|
});
|
||||||
|
that.formData = {
|
||||||
|
entrust_mer_id: '',
|
||||||
|
entrust_day: 0,
|
||||||
|
is_type: "4",
|
||||||
|
product_info: []
|
||||||
|
}
|
||||||
|
uni.redirectTo({
|
||||||
|
url: '/pages/commissionedSales/initiateDelegation/index'
|
||||||
|
})
|
||||||
|
|
||||||
|
} else {
|
||||||
|
that.$util.Tips({
|
||||||
|
title: res.messge,
|
||||||
|
icon: 'success'
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}).catch(err => {
|
||||||
|
|
||||||
|
return that.$util.Tips({
|
||||||
|
title: err
|
||||||
|
});
|
||||||
|
})
|
||||||
|
|
||||||
|
:
|
||||||
|
entrustchain(value).then(res => {
|
||||||
|
if (res.status == '200') {
|
||||||
|
uni.hideLoading()
|
||||||
|
that.$util.Tips({
|
||||||
|
title: '提交成功',
|
||||||
|
icon: 'success'
|
||||||
|
});
|
||||||
|
that.formData = {
|
||||||
|
entrust_mer_id: '',
|
||||||
|
entrust_day: 0,
|
||||||
|
is_type: "4",
|
||||||
|
product_info: []
|
||||||
|
}
|
||||||
|
uni.redirectTo({
|
||||||
|
url: '/pages/commissionedSales/initiateDelegation/index'
|
||||||
|
})
|
||||||
|
|
||||||
|
} else {
|
||||||
|
that.$util.Tips({
|
||||||
|
title: res.messge,
|
||||||
|
icon: 'success'
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}).catch(err => {
|
||||||
|
|
||||||
|
return that.$util.Tips({
|
||||||
|
title: err
|
||||||
|
});
|
||||||
|
})
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
page {
|
||||||
|
background: #F5F5F5;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content {
|
||||||
|
height: 100vh;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.release_content {
|
||||||
|
|
||||||
|
padding: 0 28rpx;
|
||||||
|
margin-top: 28rpx;
|
||||||
|
|
||||||
|
.content_center-one {
|
||||||
|
display: flex;
|
||||||
|
|
||||||
|
|
||||||
|
.center-one {
|
||||||
|
margin-top: 32rpx;
|
||||||
|
margin-bottom: 32rpx;
|
||||||
|
display: flex;
|
||||||
|
|
||||||
|
.center-one-img {
|
||||||
|
width: 154rpx;
|
||||||
|
height: 154rpx;
|
||||||
|
margin-right: 21rpx;
|
||||||
|
|
||||||
|
image {
|
||||||
|
width: 154rpx;
|
||||||
|
height: 154rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.center-one-txt {
|
||||||
|
.one-txta {
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-family: PingFang SC;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #333333;
|
||||||
|
}
|
||||||
|
|
||||||
|
.one-txtb {
|
||||||
|
display: flex;
|
||||||
|
margin-top: 28rpx;
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-family: PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
color: #999999;
|
||||||
|
|
||||||
|
span {
|
||||||
|
color: #F84221;
|
||||||
|
margin-right: 30rpx;
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.release_item {
|
||||||
|
background: #ffffff;
|
||||||
|
padding: 0 30rpx;
|
||||||
|
border-radius: 10rpx;
|
||||||
|
padding-top: 20rpx;
|
||||||
|
|
||||||
|
.release_item-one {
|
||||||
|
.item-one {
|
||||||
|
margin-top: 32rpx;
|
||||||
|
margin-bottom: 20rpx;
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-family: PingFang SC-Regular, PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
color: #333333;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.photo_count {
|
||||||
|
padding: 30rpx 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
/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: 694rpx;
|
||||||
|
height: 84rpx;
|
||||||
|
line-height: 84rpx;
|
||||||
|
text-align: center;
|
||||||
|
background: linear-gradient(84deg, #F98649 0%, #F34E45 100%);
|
||||||
|
border-radius: 42px 42px 42px 42px;
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-family: PingFang SC;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #FFFFFF;
|
||||||
|
}
|
||||||
|
|
||||||
|
.release_btn {
|
||||||
|
|
||||||
|
position: absolute;
|
||||||
|
bottom: 150rpx;
|
||||||
|
left: 50%;
|
||||||
|
margin-left: -347rpx;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
386
pages/commissionedSales/delegation_details/index.vue
Normal file
386
pages/commissionedSales/delegation_details/index.vue
Normal file
@ -0,0 +1,386 @@
|
|||||||
|
<template>
|
||||||
|
<view class="content">
|
||||||
|
<view class="content_top">
|
||||||
|
<view class="content_top-one">
|
||||||
|
<image src="@/static/images/dong.gif" mode="aspectFill"></image>
|
||||||
|
</view>
|
||||||
|
<view class="content_top-two">
|
||||||
|
<view class="top-two-one">
|
||||||
|
|
||||||
|
{{objinfo.mer_status==0?"待处理":""||objinfo.mer_status==2?"已拒绝":""||objinfo.mer_status==1?"已接受":""}}
|
||||||
|
</view>
|
||||||
|
<view class="top-two-two">
|
||||||
|
<!-- 2020-07-07 14:14:14
|
||||||
|
-->
|
||||||
|
{{objinfo.entrust_start_date}}
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="content_center">
|
||||||
|
<view class="content_center-one" v-for="(item,index) in objinfo.product_list">
|
||||||
|
<view class="center-one">
|
||||||
|
<view class="center-one-img">
|
||||||
|
<image :src="item.image[0]" mode="aspectFit"></image>
|
||||||
|
</view>
|
||||||
|
<view class="center-one-txt">
|
||||||
|
<view class="one-txta">
|
||||||
|
{{item.store_name}}
|
||||||
|
</view>
|
||||||
|
<view class="one-txtb">
|
||||||
|
<view class="">
|
||||||
|
委托价:¥<span>{{item.price}}</span>
|
||||||
|
</view>
|
||||||
|
<view class="">
|
||||||
|
数量:{{item.number}}个
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="content_center-two" v-if="objinfo">
|
||||||
|
<view class="center-two">
|
||||||
|
<view class="center-twoa">
|
||||||
|
委托方:
|
||||||
|
</view>
|
||||||
|
<view class="center-twob">
|
||||||
|
{{objinfo.mer_info.mer_name}}
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="center-two">
|
||||||
|
<view class="center-twoa">
|
||||||
|
被委托方:
|
||||||
|
</view>
|
||||||
|
<view class="center-twob">
|
||||||
|
{{objinfo.entrust_mer_info.mer_name}}
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="center-two">
|
||||||
|
<view class="center-twoa">
|
||||||
|
委托周期:
|
||||||
|
</view>
|
||||||
|
<view class="center-twob">
|
||||||
|
{{objinfo.entrust_day}}
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="center-two">
|
||||||
|
<view class="center-twoa">
|
||||||
|
结算周期:
|
||||||
|
</view>
|
||||||
|
<view class="center-twob">
|
||||||
|
{{objinfo.mer_info.settle_cycle}}
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="center-two">
|
||||||
|
<view class="center-twoa">
|
||||||
|
结算利息:
|
||||||
|
</view>
|
||||||
|
<view class="center-twob">
|
||||||
|
{{objinfo.mer_info.interest_rate}}%
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="center-two">
|
||||||
|
<view class="center-twoa">
|
||||||
|
状态:
|
||||||
|
</view>
|
||||||
|
<view class="center-twob">
|
||||||
|
|
||||||
|
{{objinfo.mer_status==0?"待处理":""||objinfo.mer_status==2?"已拒绝":""||objinfo.mer_status==1?"已接受":""}}
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="center-two">
|
||||||
|
<view class="center-twoa">
|
||||||
|
是否结束委托:
|
||||||
|
</view>
|
||||||
|
<view class="center-twob">
|
||||||
|
{{objinfo.entrust_finish==0?'未结束':""||objinfo.entrust_finish==1?'已结束':""||objinfo.entrust_finish==2?'商家拒绝':""||objinfo.entrust_finish==3?'申请':""}}
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="center-two" v-if="objinfo.entrust_finish_refusal">
|
||||||
|
<view class="center-twoa">
|
||||||
|
拒绝原因:
|
||||||
|
</view>
|
||||||
|
<view class="center-twob" :style="{'text-align':objinfo.entrust_finish_refusal.length<15?'right':'left'}">
|
||||||
|
{{objinfo.entrust_finish_refusal}}
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
<view class="content_bootm">
|
||||||
|
<view class="content_bootm_txt">
|
||||||
|
查看TA提到的宝贝(2)
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
<view class="content_bootm_one" v-for="(item,i) in objinfo.product_list" @click="Merchbaby(item)">
|
||||||
|
<view class="bootm_oneimg">
|
||||||
|
<image :src="item.image[0]" mode="aspectFit"></image>
|
||||||
|
</view>
|
||||||
|
<view class="">
|
||||||
|
{{item.store_name}}
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
<button class="release_btn button" v-if="objinfo.mer_status==1&&type==1" @click="submit(objinfo)">发布</button>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import {
|
||||||
|
addEntrustCart,
|
||||||
|
entrustdetail
|
||||||
|
} from '@/api/sale.js'
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
objinfo: {},
|
||||||
|
goodsData: [{
|
||||||
|
name: '我发起的',
|
||||||
|
name1: '委托销售商品',
|
||||||
|
type: 1,
|
||||||
|
src: require('@/static/images/wtbg1.png'),
|
||||||
|
img: require('@/static/images/wtt1.png')
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '我收到的',
|
||||||
|
name1: '帮助销售商品',
|
||||||
|
type: 2,
|
||||||
|
src: require('@/static/images/wtbg2.png'),
|
||||||
|
img: require('@/static/images/wtt2.png')
|
||||||
|
}
|
||||||
|
],
|
||||||
|
type: 0,
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onLoad(e) {
|
||||||
|
this.list(e.id)
|
||||||
|
this.type = e.type
|
||||||
|
},
|
||||||
|
onShow() {
|
||||||
|
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
//商品详情
|
||||||
|
list(id) {
|
||||||
|
entrustdetail(id).then((res) => {
|
||||||
|
|
||||||
|
this.objinfo = res.data
|
||||||
|
})
|
||||||
|
},
|
||||||
|
//商品宝贝详情
|
||||||
|
Merchbaby(item) {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: `/pages/goods_details/index?id=${item.product_id}`
|
||||||
|
})
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
//提交购物车
|
||||||
|
submit(item) {
|
||||||
|
addEntrustCart({
|
||||||
|
community_id: item.community_id
|
||||||
|
}).then(res => {
|
||||||
|
|
||||||
|
if (res.status == 200) {
|
||||||
|
this.$util.Tips({
|
||||||
|
title: res.message,
|
||||||
|
icon: 'success'
|
||||||
|
})
|
||||||
|
uni.navigateTo({
|
||||||
|
url: '/pages/users/order_confirm/index?cartId=' + res.data.cart_id.toString()
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
.content {
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content_top {
|
||||||
|
height: 151rpx;
|
||||||
|
background: linear-gradient(84deg, #2352FA 0%, #6497FF 100%);
|
||||||
|
display: flex;
|
||||||
|
padding-top: 21rpx;
|
||||||
|
|
||||||
|
.content_top-one {
|
||||||
|
width: 107rpx;
|
||||||
|
height: 107rpx;
|
||||||
|
margin-left: 28rpx;
|
||||||
|
|
||||||
|
image {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.content_top-two {
|
||||||
|
margin-left: 25rpx;
|
||||||
|
|
||||||
|
.top-two-one {
|
||||||
|
font-size: 35rpx;
|
||||||
|
font-family: PingFang SC-Medium, PingFang SC;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #FFFFFF;
|
||||||
|
margin-top: 10rpx;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.top-two-two {
|
||||||
|
font-size: 28rpx;
|
||||||
|
font-family: SF Pro Display-Light, SF Pro Display;
|
||||||
|
font-weight: 300;
|
||||||
|
color: #FFFFFF;
|
||||||
|
margin-top: 10rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.content_center {
|
||||||
|
|
||||||
|
background: #FFFFFF;
|
||||||
|
border-radius: 14px 14px 14px 14px;
|
||||||
|
margin: 28rpx 28rpx;
|
||||||
|
|
||||||
|
.content_center-one {
|
||||||
|
display: flex;
|
||||||
|
padding: 0 28rpx;
|
||||||
|
|
||||||
|
.center-one {
|
||||||
|
margin-top: 32rpx;
|
||||||
|
margin-bottom: 32rpx;
|
||||||
|
display: flex;
|
||||||
|
|
||||||
|
.center-one-img {
|
||||||
|
width: 154rpx;
|
||||||
|
height: 154rpx;
|
||||||
|
margin-right: 21rpx;
|
||||||
|
|
||||||
|
image {
|
||||||
|
width: 154rpx;
|
||||||
|
height: 154rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.center-one-txt {
|
||||||
|
.one-txta {
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-family: PingFang SC;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #333333;
|
||||||
|
}
|
||||||
|
|
||||||
|
.one-txtb {
|
||||||
|
display: flex;
|
||||||
|
margin-top: 28rpx;
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-family: PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
color: #999999;
|
||||||
|
|
||||||
|
span {
|
||||||
|
color: #F84221;
|
||||||
|
margin-right: 30rpx;
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.content_center-two {
|
||||||
|
padding: 0 28rpx;
|
||||||
|
padding-bottom: 2rpx;
|
||||||
|
|
||||||
|
.center-two {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
margin-top: 32rpx;
|
||||||
|
margin-bottom: 32rpx;
|
||||||
|
|
||||||
|
.center-twoa {
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-family: PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
color: #333333;
|
||||||
|
}
|
||||||
|
|
||||||
|
.center-twob {
|
||||||
|
width: 360rpx;
|
||||||
|
text-align: right;
|
||||||
|
|
||||||
|
word-wrap: break-word;
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-family: PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
color: #999999;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.content_bootm {
|
||||||
|
|
||||||
|
margin-bottom: 150rpx;
|
||||||
|
|
||||||
|
.content_bootm_txt {
|
||||||
|
margin-top: 42rpx;
|
||||||
|
padding-left: 28rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content_bootm_one {
|
||||||
|
height: 112rpx;
|
||||||
|
line-height: 112rpx;
|
||||||
|
background: #FFFFFF;
|
||||||
|
display: flex;
|
||||||
|
margin-top: 21rpx;
|
||||||
|
|
||||||
|
.bootm_oneimg {
|
||||||
|
width: 80rpx;
|
||||||
|
height: 80rpx;
|
||||||
|
margin: auto 0;
|
||||||
|
margin-left: 28rpx;
|
||||||
|
margin-right: 21rpx;
|
||||||
|
|
||||||
|
image {
|
||||||
|
width: 80rpx;
|
||||||
|
height: 80rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.button {
|
||||||
|
width: 694rpx;
|
||||||
|
height: 84rpx;
|
||||||
|
line-height: 84rpx;
|
||||||
|
text-align: center;
|
||||||
|
background: linear-gradient(84deg, #F98649 0%, #F34E45 100%);
|
||||||
|
border-radius: 42px 42px 42px 42px;
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-family: PingFang SC;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #FFFFFF;
|
||||||
|
position: absolute;
|
||||||
|
left: 50%;
|
||||||
|
margin-left: -347rpx;
|
||||||
|
position: fixed;
|
||||||
|
bottom: 100rpx;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
164
pages/commissionedSales/index/index.vue
Normal file
164
pages/commissionedSales/index/index.vue
Normal file
@ -0,0 +1,164 @@
|
|||||||
|
<template>
|
||||||
|
<view class="select_warehouse">
|
||||||
|
<view class="wrapper flex_a_c_j_sb">
|
||||||
|
<block v-for="item in goodsData" :key="item.name">
|
||||||
|
<view class="select_item" @click="navigato(item.type)"
|
||||||
|
:style="{'background-image': `url(${item.src})`}">
|
||||||
|
<view class="select_itemimga" v-if='item.type==1'>
|
||||||
|
<image :src="item.img" mode=""></image>
|
||||||
|
</view>
|
||||||
|
<view class="select_itemimgb" v-else>
|
||||||
|
<image :src="item.img" mode=""></image>
|
||||||
|
</view>
|
||||||
|
<view class="title">
|
||||||
|
<view class="titlea">
|
||||||
|
{{ item.name }}
|
||||||
|
</view>
|
||||||
|
<view class="titleb">
|
||||||
|
{{ item.name1 }}
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
</block>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
goodsData: [{
|
||||||
|
name: '我发起的',
|
||||||
|
name1: '委托销售商品',
|
||||||
|
type: 1,
|
||||||
|
src: require('@/static/images/wtbg1.png'),
|
||||||
|
img: require('@/static/images/wtt1.png')
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '我收到的',
|
||||||
|
name1: '帮助销售商品',
|
||||||
|
type: 2,
|
||||||
|
src: require('@/static/images/wtbg2.png'),
|
||||||
|
img: require('@/static/images/wtt2.png')
|
||||||
|
}
|
||||||
|
],
|
||||||
|
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onLoad() {
|
||||||
|
|
||||||
|
},
|
||||||
|
onShow() {
|
||||||
|
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
|
||||||
|
navigato(type) {
|
||||||
|
if (type === 1) {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: `/pages/commissionedSales/initiateDelegation/index`
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: `/pages/commissionedSales/receivedCommission/index`
|
||||||
|
});
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
.select_warehouse {
|
||||||
|
padding-top: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.wrapper {
|
||||||
|
width: 694.74rpx;
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.goods-wrapper {
|
||||||
|
.item {
|
||||||
|
display: flex;
|
||||||
|
height: 175.44rpx;
|
||||||
|
width: 100%;
|
||||||
|
background-color: #fff;
|
||||||
|
margin-top: 21.05rpx;
|
||||||
|
border-radius: 8px;
|
||||||
|
padding: 12px;
|
||||||
|
|
||||||
|
.l_cont {
|
||||||
|
image {
|
||||||
|
width: 133.33rpx;
|
||||||
|
height: 133.33rpx;
|
||||||
|
border-radius: 8px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.r_cont {
|
||||||
|
margin-left: 17.54rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.select_item {
|
||||||
|
width: 336rpx;
|
||||||
|
height: 161rpx;
|
||||||
|
border-radius: 8px;
|
||||||
|
background-color: #eee;
|
||||||
|
|
||||||
|
display: flex;
|
||||||
|
color: #fff;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
|
||||||
|
.select_itemimga {
|
||||||
|
width: 59rpx;
|
||||||
|
height: 63rpx;
|
||||||
|
margin-top: 49rpx;
|
||||||
|
margin-left: 42rpx;
|
||||||
|
|
||||||
|
image {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.select_itemimgb {
|
||||||
|
width: 75rpx;
|
||||||
|
height: 65rpx;
|
||||||
|
margin-top: 49rpx;
|
||||||
|
margin-left: 42rpx;
|
||||||
|
|
||||||
|
image {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.title {
|
||||||
|
margin-left: 23rpx;
|
||||||
|
margin-top: 37rpx;
|
||||||
|
|
||||||
|
.titlea {
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-family: PingFang SC;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #FFFFFF;
|
||||||
|
}
|
||||||
|
|
||||||
|
.titleb {
|
||||||
|
margin-top: 5rpx;
|
||||||
|
font-size: 25rpx;
|
||||||
|
font-family: PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
color: rgba(255, 255, 255, 0.8);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
992
pages/commissionedSales/initiateDelegation/index.vue
Normal file
992
pages/commissionedSales/initiateDelegation/index.vue
Normal file
@ -0,0 +1,992 @@
|
|||||||
|
<template>
|
||||||
|
<view class="content">
|
||||||
|
|
||||||
|
<view class="content_top">
|
||||||
|
<!--选项卡滑动切换-->
|
||||||
|
<cxNavTitle :tabs="tabs" :activeItem="activeItem" @tabClick="tabClick" :show='false'></cxNavTitle>
|
||||||
|
</view>
|
||||||
|
<!-- 审核通过 打折的拒绝、同意功能 ，调货不需要功能 -->
|
||||||
|
<view class="content-content" v-for="(item,i) in orderList" :key="i">
|
||||||
|
|
||||||
|
<view class="content-one">
|
||||||
|
<view class="content-one-img">
|
||||||
|
<image src="@/static/images/bg2.png" mode="aspectFit"></image>
|
||||||
|
</view>
|
||||||
|
<view class="content-one-txt">
|
||||||
|
<view class="one-txt-a">
|
||||||
|
{{item.title}}
|
||||||
|
</view>
|
||||||
|
<view class="one-txt-b">
|
||||||
|
委托周期:{{item.entrust_day}}
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<view class="content-two_one" v-if="item.mer_status==0">
|
||||||
|
<view class="content-two-edita" @click="order">
|
||||||
|
待处理
|
||||||
|
</view>
|
||||||
|
<view class="contentgn">
|
||||||
|
<!-- <view class="contentgn_a" @click="soldEdit(item)">
|
||||||
|
处理
|
||||||
|
</view>
|
||||||
|
<span></span>-->
|
||||||
|
<view class="contentgn_a" style="margin-left: 10rpx;" @click="Edit(item)">
|
||||||
|
编辑
|
||||||
|
</view>
|
||||||
|
<span></span>
|
||||||
|
<view class="contentgn_a" style="margin-left: 10rpx;" @click="deleteOrder(item)">
|
||||||
|
删除
|
||||||
|
</view>
|
||||||
|
<span></span>
|
||||||
|
<view class="contentgn_b" @click="detail(item)">
|
||||||
|
详情
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="content-two_oneq" v-if="item.mer_status==1">
|
||||||
|
<view class="content-two-editb" @click="accepted">
|
||||||
|
已接受
|
||||||
|
</view>
|
||||||
|
<view class="contentgn">
|
||||||
|
<view class="contentgn_a" @click="closingorder(item)" v-if="item.entrust_finish==3">
|
||||||
|
结束委托
|
||||||
|
</view>
|
||||||
|
<span v-if="item.entrust_finish==3"></span>
|
||||||
|
<view class="contentgn_b" @click="detail(item)">
|
||||||
|
详情
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="content-two_one" v-if="item.mer_status==2">
|
||||||
|
<view class="content-two-editc" @click="declined">
|
||||||
|
已拒绝
|
||||||
|
</view>
|
||||||
|
<view class="contentgn">
|
||||||
|
<!--<view class="contentgn_a" @click="deleteOrder(item)">
|
||||||
|
删除
|
||||||
|
</view>
|
||||||
|
<span></span> -->
|
||||||
|
<view class="contentgn_b" @click="detail(item)">
|
||||||
|
详情
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="content-two_one" v-if="item.type==4">
|
||||||
|
<view class="content-two-editd" @click="soldEdit">
|
||||||
|
已完成
|
||||||
|
</view>
|
||||||
|
<view class="contentgn">
|
||||||
|
<view class="contentgn_a" @click="deleteOrder(item)">
|
||||||
|
删除
|
||||||
|
</view>
|
||||||
|
<span></span>
|
||||||
|
<view class="contentgn_b" @click="detail(item)">
|
||||||
|
详情
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="adddelegation" @click="addDelegation">
|
||||||
|
<view class="adddelegation-one">
|
||||||
|
<image src="@/static/images/delegation.png" mode=""></image>
|
||||||
|
</view>
|
||||||
|
<view class="adddelegation-two">
|
||||||
|
新增委托
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view v-if="orderList.length == 0">
|
||||||
|
<emptyPage title="暂无订单~"></emptyPage>
|
||||||
|
</view>
|
||||||
|
<u-loadmore :status="status" v-if="orderList.length >= where.limit" />
|
||||||
|
<uni-popup ref="bindmobile" type="center" @click="close">
|
||||||
|
<view class="" style="position: relative;">
|
||||||
|
<view class="entrust">
|
||||||
|
<view class="entrust_close" @click="close">
|
||||||
|
<image src="@/static/images/wt_close.png" mode=""></image>
|
||||||
|
</view>
|
||||||
|
<view class="entrust_bg">
|
||||||
|
<view class="entrust_bg-content">
|
||||||
|
<view class="bg-content-a">
|
||||||
|
委托申请处理
|
||||||
|
</view>
|
||||||
|
<view class="bg-content-b">
|
||||||
|
结算周期: <span>{{obj.settle_cycle}}天</span>
|
||||||
|
</view>
|
||||||
|
<view class="bg-content-c">
|
||||||
|
利息比例: <span>{{obj.interest_rate}}%</span>
|
||||||
|
</view>
|
||||||
|
<view class="entrust_bga_btn">
|
||||||
|
<view class="cancellation" @click="passDelete(obj)">
|
||||||
|
拒绝
|
||||||
|
</view>
|
||||||
|
<view class="determine" @click="passagree(obj)">
|
||||||
|
接受
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</uni-popup>
|
||||||
|
<uni-popup ref="bindmobile1" type="center" @click="close">
|
||||||
|
<view class="" style="position: relative;">
|
||||||
|
<view class="entrust">
|
||||||
|
<view class="entrust_close" @click="close">
|
||||||
|
<image src="@/static/images/wt_close.png" mode=""></image>
|
||||||
|
</view>
|
||||||
|
<view class="entrust_bga">
|
||||||
|
<view class="entrust_bg-content">
|
||||||
|
<view class="bg-content-a">
|
||||||
|
确定结束委托?
|
||||||
|
</view>
|
||||||
|
<view class="entrust_bga_btn">
|
||||||
|
<view class="cancellation">
|
||||||
|
取消
|
||||||
|
</view>
|
||||||
|
<view class="determine">
|
||||||
|
确定
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</uni-popup>
|
||||||
|
<uni-popup ref="bindmobile2" type="center" @click="close">
|
||||||
|
<view class="" style="position: relative;">
|
||||||
|
<view class="entrust">
|
||||||
|
<view class="entrust_close" @click="close">
|
||||||
|
<image src="@/static/images/wt_close.png" mode=""></image>
|
||||||
|
</view>
|
||||||
|
<view class="entrust_bg">
|
||||||
|
<view class="entrust_bg-content">
|
||||||
|
<view class="bg-content-a" style="margin-left: 207rpx;">
|
||||||
|
结束委托申请处理
|
||||||
|
</view>
|
||||||
|
<view class="bg-content-b" v-if="obj.mer_info">
|
||||||
|
结算周期: <span>{{obj.mer_info.settle_cycle}}天</span>
|
||||||
|
</view>
|
||||||
|
<view class="bg-content-c" v-if="obj.mer_info">
|
||||||
|
利息比例: <span>{{obj.mer_info.interest_rate}}%</span>
|
||||||
|
</view>
|
||||||
|
<view class="entrust_bga_btn">
|
||||||
|
<view class="cancellation" @click="refused">
|
||||||
|
拒绝
|
||||||
|
</view>
|
||||||
|
<view class="determine" @click="agree(obj)">
|
||||||
|
接受
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</uni-popup>
|
||||||
|
<uni-popup ref="bindmobile3" type="center" @click="close">
|
||||||
|
|
||||||
|
<view class="" style="position: relative;">
|
||||||
|
<view class="entrust">
|
||||||
|
<view class="entrust_close" @click="close">
|
||||||
|
<image src="@/static/images/wt_close.png" mode=""></image>
|
||||||
|
</view>
|
||||||
|
<view class="entrust_bgb">
|
||||||
|
<view class="entrust_bg-content">
|
||||||
|
<view class="bg-content-a" style="margin-left: 207rpx;">
|
||||||
|
结束委托申请处理
|
||||||
|
</view>
|
||||||
|
<view class="bg-content-b" v-if="obj.mer_info">
|
||||||
|
结算周期: <span>{{obj.mer_info.settle_cycle}}天</span>
|
||||||
|
</view>
|
||||||
|
<view class="bg-content-c" v-if="obj.mer_info">
|
||||||
|
利息比例: <span>{{obj.mer_info.interest_rate}}%</span>
|
||||||
|
</view>
|
||||||
|
<view class="bg-content-c">
|
||||||
|
拒绝原因：
|
||||||
|
<view class="" style="margin-top: 21rpx;">
|
||||||
|
<textarea v-model="refuseds" placeholder="输入拒绝原因" class="bg-content_textarea" />
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="entrust_bga_btn" @click="agree(obj)">
|
||||||
|
<view class="determine">
|
||||||
|
接受
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</uni-popup>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import cxNavTitle from '@/components/cx-navTitle.vue'
|
||||||
|
import emptyPage from '@/components/emptyPage.vue';
|
||||||
|
import {
|
||||||
|
entrustlist,
|
||||||
|
finishchain,
|
||||||
|
checkchain,
|
||||||
|
finishentrust
|
||||||
|
} from '@/api/sale.js'
|
||||||
|
export default {
|
||||||
|
components: {
|
||||||
|
cxNavTitle,
|
||||||
|
emptyPage,
|
||||||
|
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
activeItem: "tabOne",
|
||||||
|
status: 'loadmore',
|
||||||
|
tabTitle: "",
|
||||||
|
orderList: [],
|
||||||
|
where: {
|
||||||
|
page: 1,
|
||||||
|
limit: 10,
|
||||||
|
type: 1,
|
||||||
|
status: 0
|
||||||
|
},
|
||||||
|
tabs: [{
|
||||||
|
name: "tabOne",
|
||||||
|
label: '待处理',
|
||||||
|
type: 0
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "tabTwo",
|
||||||
|
label: '已接受',
|
||||||
|
type: 1
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "tabThree",
|
||||||
|
label: '已拒绝',
|
||||||
|
type: 2
|
||||||
|
},
|
||||||
|
|
||||||
|
],
|
||||||
|
list: [{
|
||||||
|
content: '张三生产资料供销供应链',
|
||||||
|
day: 10,
|
||||||
|
type: 1
|
||||||
|
|
||||||
|
},
|
||||||
|
{
|
||||||
|
content: '张三生产资料供销供应链',
|
||||||
|
day: 10,
|
||||||
|
type: 2
|
||||||
|
|
||||||
|
},
|
||||||
|
{
|
||||||
|
content: '张三生产资料供销供应链',
|
||||||
|
day: 10,
|
||||||
|
type: 3
|
||||||
|
|
||||||
|
},
|
||||||
|
{
|
||||||
|
content: '张三生产资料供销供应链',
|
||||||
|
day: 10,
|
||||||
|
type: 4
|
||||||
|
|
||||||
|
}
|
||||||
|
],
|
||||||
|
obj: {},
|
||||||
|
refuseds: ''
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onLoad() {
|
||||||
|
this.tabTitle = this.tabs[0].name
|
||||||
|
//有时进入页面需要获取默认的第一个标签做逻辑判断 -- 如下:
|
||||||
|
// console.log(this.tabs[0])
|
||||||
|
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.commislist()
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
onReachBottom() {
|
||||||
|
if (this.status == 'nomore') return;
|
||||||
|
this.status = 'loading';
|
||||||
|
this.where.page = ++this.where.page;
|
||||||
|
this.commislist()
|
||||||
|
},
|
||||||
|
nav(item) {
|
||||||
|
// uni.navigateTo({
|
||||||
|
// url: '/pages/commissionedSales/delegation_details/index'
|
||||||
|
// })
|
||||||
|
},
|
||||||
|
//获取分类数据
|
||||||
|
commislist() {
|
||||||
|
entrustlist(this.where).then((res) => {
|
||||||
|
this.orderList.push(...res.data.list)
|
||||||
|
if (res.data.list.length < this.where.limit) this.status = 'nomore'
|
||||||
|
|
||||||
|
if (this.where.page == 1 && res.data.list.length <= 0) this.emptyShow = true
|
||||||
|
|
||||||
|
})
|
||||||
|
},
|
||||||
|
|
||||||
|
//选择
|
||||||
|
tabClick(e) { //点击获取当前标签数据
|
||||||
|
this.activeItem = e.name; //当前class类名
|
||||||
|
this.tabTitle = e.name; //当前选的标签名
|
||||||
|
this.where.page = 1
|
||||||
|
this.orderList = []
|
||||||
|
this.where.status = e.type
|
||||||
|
this.commislist()
|
||||||
|
},
|
||||||
|
//编辑委托
|
||||||
|
Edit(item) {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: '/pages/commissionedSales/addDelegation/index?id=' + item.community_id + '&type=edit'
|
||||||
|
})
|
||||||
|
},
|
||||||
|
//新增委托
|
||||||
|
addDelegation() {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: '/pages/commissionedSales/addDelegation/index'
|
||||||
|
})
|
||||||
|
},
|
||||||
|
//管理弹窗
|
||||||
|
close() {
|
||||||
|
this.$refs.bindmobile.close()
|
||||||
|
this.$refs.bindmobile1.close()
|
||||||
|
this.$refs.bindmobile2.close()
|
||||||
|
this.$refs.bindmobile3.close()
|
||||||
|
},
|
||||||
|
//提交订单
|
||||||
|
|
||||||
|
order(item) {
|
||||||
|
if (item.mer_status == 0 && entrust_order_id != 0) {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: '/pages/commissionedSales/delegation_details/index?id=' + item.community_id
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
this.$util.Tips({
|
||||||
|
title: '商家还没同意该订单',
|
||||||
|
icon: 'err'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
//详情
|
||||||
|
|
||||||
|
detail(item) {
|
||||||
|
|
||||||
|
uni.navigateTo({
|
||||||
|
url: '/pages/commissionedSales/delegation_details/index?id=' + item.community_id
|
||||||
|
})
|
||||||
|
},
|
||||||
|
// 待处理
|
||||||
|
soldEdit(item) {
|
||||||
|
this.obj = item
|
||||||
|
console.log(item)
|
||||||
|
this.$refs.bindmobile.open()
|
||||||
|
},
|
||||||
|
//已接受
|
||||||
|
accepted() {
|
||||||
|
|
||||||
|
},
|
||||||
|
//结束委托
|
||||||
|
closingorder(item) {
|
||||||
|
console.log(item)
|
||||||
|
this.obj = item
|
||||||
|
this.$refs.bindmobile2.open()
|
||||||
|
// this.$refs.bindmobile3.open()
|
||||||
|
},
|
||||||
|
//拒绝申请委托
|
||||||
|
refused() {
|
||||||
|
this.$refs.bindmobile2.close()
|
||||||
|
setTimeout(() => {
|
||||||
|
this.$refs.bindmobile3.open()
|
||||||
|
}, 1000)
|
||||||
|
},
|
||||||
|
// 已拒绝
|
||||||
|
declined() {
|
||||||
|
// this.$refs.bindmobile2.open()
|
||||||
|
this.$refs.bindmobile3.open()
|
||||||
|
},
|
||||||
|
agree(item) {
|
||||||
|
finishentrust(item.community_id, {
|
||||||
|
status: 2,
|
||||||
|
refusal: this.refuseds
|
||||||
|
}).then(res => {
|
||||||
|
|
||||||
|
this.$util.Tips({
|
||||||
|
title: res.message,
|
||||||
|
icon: 'success'
|
||||||
|
})
|
||||||
|
this.orderList = []
|
||||||
|
this.tabTitle = "tabTwo"
|
||||||
|
this.$refs.bindmobile2.close()
|
||||||
|
this.$refs.bindmobile3.close()
|
||||||
|
this.commislist()
|
||||||
|
})
|
||||||
|
},
|
||||||
|
//删除订单
|
||||||
|
deleteOrder(item) {
|
||||||
|
|
||||||
|
checkchain(item.community_id, {
|
||||||
|
status: 3
|
||||||
|
}).then(res => {
|
||||||
|
this.$util.Tips({
|
||||||
|
title: res.message,
|
||||||
|
icon: 'success'
|
||||||
|
})
|
||||||
|
this.orderList = []
|
||||||
|
this.tabTitle = "tabOne"
|
||||||
|
this.commislist()
|
||||||
|
}).catch((err) => {
|
||||||
|
console.log(err)
|
||||||
|
this.$util.Tips({
|
||||||
|
title: err,
|
||||||
|
icon: 'error'
|
||||||
|
})
|
||||||
|
})
|
||||||
|
},
|
||||||
|
// 审核未通过 编辑
|
||||||
|
auditEdit() {
|
||||||
|
|
||||||
|
},
|
||||||
|
//审核通过 拒绝
|
||||||
|
passDelete(item) {
|
||||||
|
checkchain(item.community_id, {
|
||||||
|
status: 2
|
||||||
|
}).then((res) => {
|
||||||
|
this.$util.Tips({
|
||||||
|
title: res.message,
|
||||||
|
icon: 'success'
|
||||||
|
})
|
||||||
|
this.orderList = []
|
||||||
|
this.tabTitle = "tabOne"
|
||||||
|
this.commislist()
|
||||||
|
})
|
||||||
|
},
|
||||||
|
//审核通过 同意
|
||||||
|
passagree(item) {
|
||||||
|
checkchain(item.community_id, {
|
||||||
|
status: 1
|
||||||
|
}).then((res) => {
|
||||||
|
this.$util.Tips({
|
||||||
|
title: res.message,
|
||||||
|
icon: 'success'
|
||||||
|
})
|
||||||
|
this.orderList = []
|
||||||
|
this.tabTitle = "tabOne"
|
||||||
|
this.commislist()
|
||||||
|
this.$refs.bindmobile.close()
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.content {
|
||||||
|
height: 100vh;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.content_top {
|
||||||
|
background-color: #FFFFFF;
|
||||||
|
}
|
||||||
|
|
||||||
|
.adddelegation {
|
||||||
|
width: 694rpx;
|
||||||
|
height: 95rpx;
|
||||||
|
|
||||||
|
|
||||||
|
background: linear-gradient(276deg, #F98649 0%, #F34E45 100%);
|
||||||
|
box-shadow: 0 5rpx 11rpx 2rpx rgba(136, 20, 7, 0.3);
|
||||||
|
border-radius: 47rpx 47rpx 47rpx 47rpx;
|
||||||
|
opacity: 1;
|
||||||
|
display: flex;
|
||||||
|
position: fixed;
|
||||||
|
position: absolute;
|
||||||
|
bottom: 84rpx;
|
||||||
|
left: 50%;
|
||||||
|
margin-left: -347rpx;
|
||||||
|
|
||||||
|
.adddelegation-one {
|
||||||
|
width: 50rpx;
|
||||||
|
margin-right: 30rpx;
|
||||||
|
height: 50rpx;
|
||||||
|
margin-left: 242rpx;
|
||||||
|
|
||||||
|
margin-top: 21rpx;
|
||||||
|
|
||||||
|
image {
|
||||||
|
width: 50rpx;
|
||||||
|
height: 50rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.adddelegation-two {
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-family: PingFang SC-Medium, PingFang SC;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #FFFFFF;
|
||||||
|
margin-top: 25rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.content_top {
|
||||||
|
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-content {
|
||||||
|
|
||||||
|
margin-top: 21rpx;
|
||||||
|
background: #FFFFFF;
|
||||||
|
padding: 0 28rpx;
|
||||||
|
padding-top: 28rpx;
|
||||||
|
background: #FFFFFF;
|
||||||
|
position: relative;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
|
||||||
|
|
||||||
|
.content-one {
|
||||||
|
display: flex;
|
||||||
|
|
||||||
|
padding-bottom: 23rpx;
|
||||||
|
|
||||||
|
.content-one-img {
|
||||||
|
width: 148rpx;
|
||||||
|
height: 148rpx;
|
||||||
|
margin-right: 28rpx;
|
||||||
|
border: 1px solid;
|
||||||
|
|
||||||
|
image {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-one-txt {
|
||||||
|
|
||||||
|
|
||||||
|
.txt-b-a {
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-family: PingFang SC;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #333333;
|
||||||
|
}
|
||||||
|
|
||||||
|
.one-txt-b {
|
||||||
|
display: flex;
|
||||||
|
margin-top: 30rpx;
|
||||||
|
|
||||||
|
.txt-b-a {
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-family: SF Pro Display-Medium, SF Pro Display;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #F84221;
|
||||||
|
margin-right: 74rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.txt-b-b {
|
||||||
|
font-size: 28rpx;
|
||||||
|
font-family: PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
color: #333333
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-two_oneq {
|
||||||
|
position: absolute;
|
||||||
|
right: 20rpx;
|
||||||
|
text-align: right;
|
||||||
|
|
||||||
|
.content-two-edita {
|
||||||
|
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #F84221;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-two-editb {
|
||||||
|
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #FE9A10;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-two-editc {
|
||||||
|
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #20A162;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-two-editd {
|
||||||
|
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #999999;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.contentgn {
|
||||||
|
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
margin-top: 47rpx;
|
||||||
|
|
||||||
|
.contentgn_a {
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-family: PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
color: #F84221;
|
||||||
|
margin-right: 10rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
span {
|
||||||
|
width: 0px;
|
||||||
|
height: 30rpx;
|
||||||
|
opacity: 1;
|
||||||
|
|
||||||
|
margin-top: 10rpx;
|
||||||
|
border: 2rpx solid #CCCCCC;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.contentgn_b {
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-family: PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
color: #999999;
|
||||||
|
margin-left: 10rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-two_one {
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
text-align: right;
|
||||||
|
|
||||||
|
.content-two-edita {
|
||||||
|
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #F84221;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-two-editb {
|
||||||
|
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #FE9A10;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-two-editc {
|
||||||
|
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #20A162;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-two-editd {
|
||||||
|
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #999999;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.contentgn {
|
||||||
|
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
margin-top: 47rpx;
|
||||||
|
|
||||||
|
.contentgn_a {
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-family: PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
color: #F84221;
|
||||||
|
margin-right: 10rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
span {
|
||||||
|
width: 1px;
|
||||||
|
height: 30rpx;
|
||||||
|
opacity: 1;
|
||||||
|
margin-top: 8rpx;
|
||||||
|
background-color: #cccccc;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.contentgn_b {
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-family: PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
color: #999999;
|
||||||
|
margin-left: 10rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.entrust {
|
||||||
|
|
||||||
|
|
||||||
|
.entrust_close {
|
||||||
|
width: 44rpx;
|
||||||
|
height: 44rpx;
|
||||||
|
|
||||||
|
image {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
z-index: 99999;
|
||||||
|
position: absolute;
|
||||||
|
right: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.entrust_bg {
|
||||||
|
width: 694rpx;
|
||||||
|
height: 676rpx;
|
||||||
|
background: url('@/static/images/wtbg3.png') no-repeat;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
.entrust_bg-content {
|
||||||
|
position: absolute;
|
||||||
|
top: 284rpx;
|
||||||
|
|
||||||
|
.bg-content-a {
|
||||||
|
margin-left: 242rpx;
|
||||||
|
font-size: 35rpx;
|
||||||
|
font-family: PingFang SC;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #333333;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bg-content-b {
|
||||||
|
margin-left: 35rpx;
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-family: PingFang SC;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #333333;
|
||||||
|
margin-top: 32rpx;
|
||||||
|
|
||||||
|
span {
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-family: PingFang SC-Medium, PingFang SC;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #F84221;
|
||||||
|
margin-left: 18rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.bg-content-c {
|
||||||
|
margin-left: 35rpx;
|
||||||
|
font-size: 35rpx;
|
||||||
|
font-family: PingFang SC;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #333333;
|
||||||
|
margin-top: 32rpx;
|
||||||
|
|
||||||
|
span {
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-family: PingFang SC-Medium, PingFang SC;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #F84221;
|
||||||
|
margin-left: 18rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.entrust_bga_btn {
|
||||||
|
display: flex;
|
||||||
|
margin-top: 53rpx;
|
||||||
|
|
||||||
|
.cancellation {
|
||||||
|
height: 95rpx;
|
||||||
|
line-height: 95rpx;
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-family: PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
color: #999999;
|
||||||
|
margin-left: 121rpx;
|
||||||
|
margin-right: 49rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.determine {
|
||||||
|
width: 249rpx;
|
||||||
|
height: 95rpx;
|
||||||
|
line-height: 95rpx;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-family: PingFang SC-Medium, PingFang SC;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #FFFFFF;
|
||||||
|
background: linear-gradient(180deg, #F98649 0%, #F34E45 100%);
|
||||||
|
border-radius: 47rpx 47rpx 47rpx 47rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.entrust_bga {
|
||||||
|
width: 694rpx;
|
||||||
|
height: 520rpx;
|
||||||
|
background: url('@/static/images/wtbg4.png') no-repeat;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
.entrust_bg-content {
|
||||||
|
position: absolute;
|
||||||
|
top: 284rpx;
|
||||||
|
|
||||||
|
.bg-content-a {
|
||||||
|
margin-left: 242rpx;
|
||||||
|
font-size: 35rpx;
|
||||||
|
font-family: PingFang SC;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #333333;
|
||||||
|
}
|
||||||
|
|
||||||
|
.entrust_bga_btn {
|
||||||
|
display: flex;
|
||||||
|
margin-top: 53rpx;
|
||||||
|
|
||||||
|
.cancellation {
|
||||||
|
height: 95rpx;
|
||||||
|
line-height: 95rpx;
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-family: PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
color: #999999;
|
||||||
|
margin-left: 121rpx;
|
||||||
|
margin-right: 49rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.determine {
|
||||||
|
width: 249rpx;
|
||||||
|
height: 95rpx;
|
||||||
|
line-height: 95rpx;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-family: PingFang SC-Medium, PingFang SC;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #FFFFFF;
|
||||||
|
background: linear-gradient(180deg, #F98649 0%, #F34E45 100%);
|
||||||
|
border-radius: 47rpx 47rpx 47rpx 47rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.entrust_bgb {
|
||||||
|
width: 694rpx;
|
||||||
|
height: 994rpx;
|
||||||
|
background: url('@/static/images/wtbg5.png') no-repeat;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
|
||||||
|
.entrust_bg-content {
|
||||||
|
position: absolute;
|
||||||
|
top: 304rpx;
|
||||||
|
|
||||||
|
.bg-content-a {
|
||||||
|
margin-left: 242rpx;
|
||||||
|
font-size: 35rpx;
|
||||||
|
font-family: PingFang SC;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #333333;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bg-content-b {
|
||||||
|
margin-left: 35rpx;
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-family: PingFang SC;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #333333;
|
||||||
|
margin-top: 32rpx;
|
||||||
|
|
||||||
|
span {
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-family: PingFang SC-Medium, PingFang SC;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #F84221;
|
||||||
|
margin-left: 18rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.bg-content-c {
|
||||||
|
margin-left: 35rpx;
|
||||||
|
font-size: 35rpx;
|
||||||
|
font-family: PingFang SC;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #333333;
|
||||||
|
margin-top: 22rpx;
|
||||||
|
|
||||||
|
span {
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-family: PingFang SC-Medium, PingFang SC;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #F84221;
|
||||||
|
margin-left: 18rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.bg-content_textarea {
|
||||||
|
width: 624rpx;
|
||||||
|
height: 242rpx;
|
||||||
|
padding: 25rpx 18rpx;
|
||||||
|
|
||||||
|
background: #F5F5F5;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.entrust_bga_btn {
|
||||||
|
display: flex;
|
||||||
|
margin-top: 33rpx;
|
||||||
|
|
||||||
|
|
||||||
|
.determine {
|
||||||
|
margin-left: 188rpx;
|
||||||
|
width: 249rpx;
|
||||||
|
height: 95rpx;
|
||||||
|
line-height: 95rpx;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-family: PingFang SC-Medium, PingFang SC;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #FFFFFF;
|
||||||
|
background: linear-gradient(180deg, #F98649 0%, #F34E45 100%);
|
||||||
|
border-radius: 47rpx 47rpx 47rpx 47rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
</style>
|
||||||
910
pages/commissionedSales/receivedCommission/index.vue
Normal file
910
pages/commissionedSales/receivedCommission/index.vue
Normal file
@ -0,0 +1,910 @@
|
|||||||
|
<template>
|
||||||
|
<view class="content">
|
||||||
|
|
||||||
|
<view class="content_top">
|
||||||
|
<!--选项卡滑动切换-->
|
||||||
|
<cxNavTitle :tabs="tabs" :activeItem="activeItem" @tabClick="tabClick" :show='false'></cxNavTitle>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="content-content" v-for="(item,i) in orderList" :key="i" @click="nav(item)">
|
||||||
|
|
||||||
|
<view class="content-one">
|
||||||
|
<view class="content-one-img">
|
||||||
|
<image src="@/static/images/bg2.png" mode="aspectFit"></image>
|
||||||
|
</view>
|
||||||
|
<view class="content-one-txt">
|
||||||
|
<view class="one-txt-a">
|
||||||
|
{{item.title}}
|
||||||
|
</view>
|
||||||
|
<view class="one-txt-b">
|
||||||
|
委托周期:{{item.entrust_day}}
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="one-txt-b" v-if="item.mer_status==1" style="color: red;margin-top: 3rpx;">
|
||||||
|
{{item.entrust_finish==0?'未申请结束委托':""||item.entrust_finish==1?'委托已结束':""||item.entrust_finish==2?'商家拒绝结束委托':""||item.entrust_finish==3?'结束委托申请中':""}}
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="content-two_one" v-if="item.mer_status==0">
|
||||||
|
<view class="content-two-edita" @click="order">
|
||||||
|
待处理
|
||||||
|
</view>
|
||||||
|
<view class="contentgn">
|
||||||
|
<view class="contentgn_a" @click="soldEdit(item)">
|
||||||
|
处理
|
||||||
|
</view>
|
||||||
|
<span></span>
|
||||||
|
<!-- <view class="contentgn_a" style="margin-left: 10rpx;" @click="Edit(item)">
|
||||||
|
编辑
|
||||||
|
</view>
|
||||||
|
<span></span> -->
|
||||||
|
<!-- <view class="contentgn_a" style="margin-left: 10rpx;" @click="deleteOrder(item)">
|
||||||
|
删除
|
||||||
|
</view>
|
||||||
|
<span></span> -->
|
||||||
|
<view class="contentgn_b" @click="detail(item)">
|
||||||
|
详情
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="content-two_oneq" v-if="item.mer_status==1">
|
||||||
|
<view class="content-two-editb" @click="accepted">
|
||||||
|
已接受
|
||||||
|
</view>
|
||||||
|
<view class="contentgn">
|
||||||
|
<view class="contentgn_a" style="margin-left: 10rpx;"
|
||||||
|
v-if="item.entrust_order_id>0&&item.mer_status==1" @click="closingorder(item)">
|
||||||
|
申请结束委托
|
||||||
|
</view>
|
||||||
|
<span v-if="item.entrust_order_id>0&&item.mer_status==1"></span>
|
||||||
|
<view class="contentgn_a" v-if="item.entrust_order_id==0" style="margin-left: 10rpx;"
|
||||||
|
@click="order(item)">
|
||||||
|
去下单
|
||||||
|
</view>
|
||||||
|
<span v-if="item.entrust_order_id==0"></span>
|
||||||
|
|
||||||
|
<view class="contentgn_b" @click="detail(item)">
|
||||||
|
详情
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="content-two_one" v-if="item.mer_status==2">
|
||||||
|
<view class="content-two-editc" @click="declined">
|
||||||
|
已拒绝
|
||||||
|
</view>
|
||||||
|
<view class="contentgn">
|
||||||
|
<!--
|
||||||
|
-->
|
||||||
|
<view class="contentgn_b" @click="detail(item)">
|
||||||
|
详情
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="content-two_one" v-if="item.type==4">
|
||||||
|
<view class="content-two-editd" @click="soldEdit">
|
||||||
|
已完成
|
||||||
|
</view>
|
||||||
|
<view class="contentgn">
|
||||||
|
|
||||||
|
<view class="contentgn_b" @click="detail(item)">
|
||||||
|
详情
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view v-if="orderList.length == 0">
|
||||||
|
<emptyPage title="暂无订单~"></emptyPage>
|
||||||
|
</view>
|
||||||
|
<u-loadmore :status="status" v-if="orderList.length >= where.limit" />
|
||||||
|
<u-loadmore :status="status" v-if="orderList.length >= where.limit" />
|
||||||
|
<uni-popup ref="bindmobile" type="center" @click="close">
|
||||||
|
<view class="" style="position: relative;">
|
||||||
|
<view class="entrust">
|
||||||
|
<view class="entrust_close" @click="close">
|
||||||
|
<image src="@/static/images/wt_close.png" mode=""></image>
|
||||||
|
</view>
|
||||||
|
<view class="entrust_bg">
|
||||||
|
<view class="entrust_bg-content" v-if="obj.mer_info">
|
||||||
|
<view class="bg-content-a">
|
||||||
|
委托申请处理
|
||||||
|
</view>
|
||||||
|
<view class="bg-content-b" >
|
||||||
|
结算周期: <span>{{obj.mer_info.settle_cycle}}天</span>
|
||||||
|
</view>
|
||||||
|
<view class="bg-content-c" >
|
||||||
|
利息比例: <span>{{obj.mer_info.interest_rate}}%</span>
|
||||||
|
</view>
|
||||||
|
<view class="entrust_bga_btn">
|
||||||
|
<view class="cancellation" @click="passDelete(obj)">
|
||||||
|
拒绝
|
||||||
|
</view>
|
||||||
|
<view class="determine" @click="passagree(obj)">
|
||||||
|
接受
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</uni-popup>
|
||||||
|
<uni-popup ref="bindmobile1" type="center" @click="close">
|
||||||
|
<view class="" style="position: relative;">
|
||||||
|
<view class="entrust">
|
||||||
|
<view class="entrust_close" @click="close">
|
||||||
|
<image src="@/static/images/wt_close.png" mode=""></image>
|
||||||
|
</view>
|
||||||
|
<view class="entrust_bga">
|
||||||
|
<view class="entrust_bg-content">
|
||||||
|
<view class="bg-content-a">
|
||||||
|
<!-- 确定结束委托? -->
|
||||||
|
申请委托结束处理
|
||||||
|
</view>
|
||||||
|
<view class="entrust_bga_btn">
|
||||||
|
<view class="cancellation" @click="close">
|
||||||
|
取消
|
||||||
|
</view>
|
||||||
|
<view class="determine" @click="deteragrss(obj)">
|
||||||
|
确定
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</uni-popup>
|
||||||
|
<uni-popup ref="bindmobile2" type="center" @click="close">
|
||||||
|
<view class="" style="position: relative;">
|
||||||
|
<view class="entrust">
|
||||||
|
<view class="entrust_close" @click="close">
|
||||||
|
<image src="@/static/images/wt_close.png" mode=""></image>
|
||||||
|
</view>
|
||||||
|
<view class="entrust_bg">
|
||||||
|
<view class="entrust_bg-content">
|
||||||
|
<view class="bg-content-a" style="margin-left: 207rpx;">
|
||||||
|
结束委托申请处理
|
||||||
|
</view>
|
||||||
|
<view class="bg-content-b">
|
||||||
|
结算周期: <span>30天</span>
|
||||||
|
</view>
|
||||||
|
<view class="bg-content-c">
|
||||||
|
利息比例: <span>0.05%</span>
|
||||||
|
</view>
|
||||||
|
<view class="entrust_bga_btn">
|
||||||
|
<view class="cancellation">
|
||||||
|
拒绝
|
||||||
|
</view>
|
||||||
|
<view class="determine">
|
||||||
|
接受
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</uni-popup>
|
||||||
|
<uni-popup ref="bindmobile3" type="center" @click="close">
|
||||||
|
|
||||||
|
<view class="" style="position: relative;">
|
||||||
|
<view class="entrust">
|
||||||
|
<view class="entrust_close" @click="close">
|
||||||
|
<image src="@/static/images/wt_close.png" mode=""></image>
|
||||||
|
</view>
|
||||||
|
<view class="entrust_bgb">
|
||||||
|
<view class="entrust_bg-content">
|
||||||
|
<view class="bg-content-a" style="margin-left: 207rpx;">
|
||||||
|
结束委托申请处理
|
||||||
|
</view>
|
||||||
|
<view class="bg-content-b">
|
||||||
|
结算周期: <span>30天</span>
|
||||||
|
</view>
|
||||||
|
<view class="bg-content-c">
|
||||||
|
利息比例: <span>0.05%</span>
|
||||||
|
</view>
|
||||||
|
<view class="bg-content-c">
|
||||||
|
拒绝原因：
|
||||||
|
<view class="" style="margin-top: 21rpx;">
|
||||||
|
<textarea value="" placeholder="输入拒绝原因" class="bg-content_textarea" />
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="entrust_bga_btn">
|
||||||
|
<view class="determine">
|
||||||
|
接受
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</uni-popup>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import cxNavTitle from '@/components/cx-navTitle.vue'
|
||||||
|
import emptyPage from '@/components/emptyPage.vue';
|
||||||
|
import {
|
||||||
|
entrustlist,
|
||||||
|
finishchain,
|
||||||
|
checkchain
|
||||||
|
} from '@/api/sale.js'
|
||||||
|
export default {
|
||||||
|
components: {
|
||||||
|
cxNavTitle,
|
||||||
|
emptyPage
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
obj: {},
|
||||||
|
activeItem: "tabOne",
|
||||||
|
status: 'loadmore',
|
||||||
|
activeItem: "tabOne",
|
||||||
|
tabTitle: "",
|
||||||
|
orderList: [],
|
||||||
|
where: {
|
||||||
|
page: 1,
|
||||||
|
type: 2,
|
||||||
|
limit: 10,
|
||||||
|
status: 0
|
||||||
|
},
|
||||||
|
tabs: [{
|
||||||
|
name: "tabOne",
|
||||||
|
label: '待处理',
|
||||||
|
type: '0'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "tabTwo",
|
||||||
|
label: '已接受',
|
||||||
|
type: '1'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: "tabThree",
|
||||||
|
label: '已拒绝',
|
||||||
|
type: '2'
|
||||||
|
},
|
||||||
|
|
||||||
|
],
|
||||||
|
list: [{
|
||||||
|
content: '张三生产资料供销供应链',
|
||||||
|
day: 10,
|
||||||
|
type: 1
|
||||||
|
|
||||||
|
},
|
||||||
|
{
|
||||||
|
content: '张三生产资料供销供应链',
|
||||||
|
day: 10,
|
||||||
|
type: 2
|
||||||
|
|
||||||
|
},
|
||||||
|
{
|
||||||
|
content: '张三生产资料供销供应链',
|
||||||
|
day: 10,
|
||||||
|
type: 3
|
||||||
|
|
||||||
|
},
|
||||||
|
{
|
||||||
|
content: '张三生产资料供销供应链',
|
||||||
|
day: 10,
|
||||||
|
type: 4
|
||||||
|
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onLoad() {
|
||||||
|
this.tabTitle = this.tabs[0].name
|
||||||
|
//有时进入页面需要获取默认的第一个标签做逻辑判断 -- 如下:
|
||||||
|
console.log(this.tabs[0])
|
||||||
|
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.commislist()
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
onReachBottom() {
|
||||||
|
if (this.status == 'nomore') return;
|
||||||
|
this.status = 'loading';
|
||||||
|
this.where.page = ++this.where.page;
|
||||||
|
this.commislist()
|
||||||
|
},
|
||||||
|
nav(item) {
|
||||||
|
// uni.navigateTo({
|
||||||
|
// url: '/pages/commissionedSales/delegation_details/index'
|
||||||
|
// })
|
||||||
|
},
|
||||||
|
//获取分类数据
|
||||||
|
commislist() {
|
||||||
|
entrustlist(this.where).then((res) => {
|
||||||
|
this.orderList.push(...res.data.list)
|
||||||
|
if (res.data.list.length < this.where.limit) this.status = 'nomore'
|
||||||
|
|
||||||
|
if (this.where.page == 1 && res.data.list.length <= 0) this.emptyShow = true
|
||||||
|
|
||||||
|
})
|
||||||
|
},
|
||||||
|
|
||||||
|
//选择
|
||||||
|
tabClick(e) { //点击获取当前标签数据
|
||||||
|
this.activeItem = e.name; //当前class类名
|
||||||
|
this.tabTitle = e.name; //当前选的标签名
|
||||||
|
this.where.page = 1
|
||||||
|
this.orderList = []
|
||||||
|
this.where.status = e.type
|
||||||
|
this.commislist()
|
||||||
|
},
|
||||||
|
//管理弹窗
|
||||||
|
close() {
|
||||||
|
this.$refs.bindmobile.close()
|
||||||
|
this.$refs.bindmobile1.close()
|
||||||
|
this.$refs.bindmobile2.close()
|
||||||
|
this.$refs.bindmobile3.close()
|
||||||
|
},
|
||||||
|
//详情
|
||||||
|
detail(item) {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: '/pages/commissionedSales/delegation_details/index?id=' + item.community_id
|
||||||
|
})
|
||||||
|
},
|
||||||
|
// 待处理
|
||||||
|
soldEdit(item) {
|
||||||
|
this.obj = item
|
||||||
|
|
||||||
|
this.$refs.bindmobile.open()
|
||||||
|
},
|
||||||
|
//已接受
|
||||||
|
accepted() {
|
||||||
|
|
||||||
|
},
|
||||||
|
//结束委托
|
||||||
|
closingorder(item) {
|
||||||
|
this.obj = item
|
||||||
|
this.$refs.bindmobile1.open()
|
||||||
|
// this.$refs.bindmobile3.open()
|
||||||
|
},
|
||||||
|
//下单
|
||||||
|
order(item) {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: '/pages/commissionedSales/delegation_details/index?id=' + item.community_id + '&type=1'
|
||||||
|
})
|
||||||
|
},
|
||||||
|
//申请结束委托申请
|
||||||
|
deteragrss(item) {
|
||||||
|
|
||||||
|
finishchain(item.community_id, {
|
||||||
|
status: 1
|
||||||
|
}).then((res) => {
|
||||||
|
console.log(res)
|
||||||
|
this.$util.Tips({
|
||||||
|
title: res.message,
|
||||||
|
icon: 'success'
|
||||||
|
})
|
||||||
|
this.orderList = []
|
||||||
|
this.tabTitle = "tabTwo"
|
||||||
|
this.commislist()
|
||||||
|
this.$refs.bindmobile1.close()
|
||||||
|
}).catch((err) => {
|
||||||
|
this.$refs.bindmobile1.close()
|
||||||
|
this.$util.Tips({
|
||||||
|
title: err,
|
||||||
|
icon: 'error'
|
||||||
|
})
|
||||||
|
})
|
||||||
|
},
|
||||||
|
// 已拒绝
|
||||||
|
declined() {
|
||||||
|
// this.$refs.bindmobile2.open()
|
||||||
|
this.$refs.bindmobile3.open()
|
||||||
|
},
|
||||||
|
//删除订单
|
||||||
|
deleteOrder(item) {
|
||||||
|
checkchain(item.community_id, {
|
||||||
|
status: 3
|
||||||
|
}).then(res => {
|
||||||
|
this.$util.Tips({
|
||||||
|
title: res.message,
|
||||||
|
icon: 'success'
|
||||||
|
})
|
||||||
|
this.orderList = []
|
||||||
|
this.tabTitle = "tabOne"
|
||||||
|
this.commislist()
|
||||||
|
})
|
||||||
|
},
|
||||||
|
// 审核未通过 编辑
|
||||||
|
auditEdit() {
|
||||||
|
|
||||||
|
},
|
||||||
|
//审核通过 拒绝
|
||||||
|
passDelete(item) {
|
||||||
|
checkchain(item.community_id, {
|
||||||
|
status: 2
|
||||||
|
}).then((res) => {
|
||||||
|
this.$util.Tips({
|
||||||
|
title: res.message,
|
||||||
|
icon: 'success'
|
||||||
|
})
|
||||||
|
this.orderList = []
|
||||||
|
this.tabTitle = "tabOne"
|
||||||
|
this.commislist()
|
||||||
|
this.$refs.bindmobile.close()
|
||||||
|
})
|
||||||
|
},
|
||||||
|
//审核通过 同意
|
||||||
|
passagree(item) {
|
||||||
|
checkchain(item.community_id, {
|
||||||
|
status: 1
|
||||||
|
}).then((res) => {
|
||||||
|
this.$util.Tips({
|
||||||
|
title: res.message,
|
||||||
|
icon: 'success'
|
||||||
|
})
|
||||||
|
this.orderList = []
|
||||||
|
this.tabTitle = "tabOne"
|
||||||
|
this.commislist()
|
||||||
|
this.$refs.bindmobile.close()
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.content_top {
|
||||||
|
background-color: #FFFFFF;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content_top {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-content {
|
||||||
|
|
||||||
|
margin-top: 21rpx;
|
||||||
|
background: #FFFFFF;
|
||||||
|
padding: 0 28rpx;
|
||||||
|
padding-top: 28rpx;
|
||||||
|
background: #FFFFFF;
|
||||||
|
position: relative;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
|
||||||
|
|
||||||
|
.content-one {
|
||||||
|
display: flex;
|
||||||
|
|
||||||
|
padding-bottom: 23rpx;
|
||||||
|
|
||||||
|
.content-one-img {
|
||||||
|
width: 148rpx;
|
||||||
|
height: 148rpx;
|
||||||
|
margin-right: 28rpx;
|
||||||
|
border: 1px solid;
|
||||||
|
|
||||||
|
image {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-one-txt {
|
||||||
|
|
||||||
|
|
||||||
|
.txt-b-a {
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-family: PingFang SC;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #333333;
|
||||||
|
}
|
||||||
|
|
||||||
|
.one-txt-b {
|
||||||
|
display: flex;
|
||||||
|
margin-top: 30rpx;
|
||||||
|
|
||||||
|
.txt-b-a {
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-family: SF Pro Display-Medium, SF Pro Display;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #F84221;
|
||||||
|
margin-right: 74rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.txt-b-b {
|
||||||
|
font-size: 28rpx;
|
||||||
|
font-family: PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
color: #333333
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-two_oneq {
|
||||||
|
position: absolute;
|
||||||
|
right: 20rpx;
|
||||||
|
text-align: right;
|
||||||
|
|
||||||
|
.content-two-edita {
|
||||||
|
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #F84221;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-two-editb {
|
||||||
|
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #FE9A10;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-two-editc {
|
||||||
|
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #20A162;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-two-editd {
|
||||||
|
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #999999;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.contentgn {
|
||||||
|
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
margin-top: 47rpx;
|
||||||
|
|
||||||
|
.contentgn_a {
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-family: PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
color: #F84221;
|
||||||
|
margin-right: 10rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
span {
|
||||||
|
width: 0px;
|
||||||
|
height: 30rpx;
|
||||||
|
opacity: 1;
|
||||||
|
|
||||||
|
margin-top: 10rpx;
|
||||||
|
border: 2rpx solid #CCCCCC;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.contentgn_b {
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-family: PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
color: #999999;
|
||||||
|
margin-left: 10rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-two_one {
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
text-align: right;
|
||||||
|
|
||||||
|
.content-two-edita {
|
||||||
|
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #F84221;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-two-editb {
|
||||||
|
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #FE9A10;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-two-editc {
|
||||||
|
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #20A162;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.content-two-editd {
|
||||||
|
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #999999;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.contentgn {
|
||||||
|
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
margin-top: 47rpx;
|
||||||
|
|
||||||
|
.contentgn_a {
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-family: PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
color: #F84221;
|
||||||
|
margin-right: 10rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
span {
|
||||||
|
width: 0px;
|
||||||
|
height: 30rpx;
|
||||||
|
opacity: 1;
|
||||||
|
|
||||||
|
margin-top: 10rpx;
|
||||||
|
border: 2rpx solid #CCCCCC;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.contentgn_b {
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-family: PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
color: #999999;
|
||||||
|
margin-left: 10rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.entrust {
|
||||||
|
|
||||||
|
.entrust_close {
|
||||||
|
width: 44rpx;
|
||||||
|
height: 44rpx;
|
||||||
|
|
||||||
|
image {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
z-index: 99999;
|
||||||
|
position: absolute;
|
||||||
|
right: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.entrust_bg {
|
||||||
|
width: 694rpx;
|
||||||
|
height: 676rpx;
|
||||||
|
background: url('@/static/images/wtbg3.png') no-repeat;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
.entrust_bg-content {
|
||||||
|
position: absolute;
|
||||||
|
top: 284rpx;
|
||||||
|
|
||||||
|
.bg-content-a {
|
||||||
|
margin-left: 242rpx;
|
||||||
|
font-size: 35rpx;
|
||||||
|
font-family: PingFang SC;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #333333;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bg-content-b {
|
||||||
|
margin-left: 35rpx;
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-family: PingFang SC;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #333333;
|
||||||
|
margin-top: 32rpx;
|
||||||
|
|
||||||
|
span {
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-family: PingFang SC-Medium, PingFang SC;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #F84221;
|
||||||
|
margin-left: 18rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.bg-content-c {
|
||||||
|
margin-left: 35rpx;
|
||||||
|
font-size: 35rpx;
|
||||||
|
font-family: PingFang SC;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #333333;
|
||||||
|
margin-top: 32rpx;
|
||||||
|
|
||||||
|
span {
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-family: PingFang SC-Medium, PingFang SC;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #F84221;
|
||||||
|
margin-left: 18rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.entrust_bga_btn {
|
||||||
|
display: flex;
|
||||||
|
margin-top: 53rpx;
|
||||||
|
|
||||||
|
.cancellation {
|
||||||
|
height: 95rpx;
|
||||||
|
line-height: 95rpx;
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-family: PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
color: #999999;
|
||||||
|
margin-left: 121rpx;
|
||||||
|
margin-right: 49rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.determine {
|
||||||
|
width: 249rpx;
|
||||||
|
height: 95rpx;
|
||||||
|
line-height: 95rpx;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-family: PingFang SC-Medium, PingFang SC;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #FFFFFF;
|
||||||
|
background: linear-gradient(180deg, #F98649 0%, #F34E45 100%);
|
||||||
|
border-radius: 47rpx 47rpx 47rpx 47rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.entrust_bga {
|
||||||
|
width: 694rpx;
|
||||||
|
height: 520rpx;
|
||||||
|
background: url('@/static/images/wtbg4.png') no-repeat;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
.entrust_bg-content {
|
||||||
|
position: absolute;
|
||||||
|
top: 284rpx;
|
||||||
|
|
||||||
|
.bg-content-a {
|
||||||
|
margin-left: 242rpx;
|
||||||
|
font-size: 35rpx;
|
||||||
|
font-family: PingFang SC;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #333333;
|
||||||
|
}
|
||||||
|
|
||||||
|
.entrust_bga_btn {
|
||||||
|
display: flex;
|
||||||
|
margin-top: 53rpx;
|
||||||
|
|
||||||
|
.cancellation {
|
||||||
|
height: 95rpx;
|
||||||
|
line-height: 95rpx;
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-family: PingFang SC;
|
||||||
|
font-weight: 400;
|
||||||
|
color: #999999;
|
||||||
|
margin-left: 121rpx;
|
||||||
|
margin-right: 49rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.determine {
|
||||||
|
width: 249rpx;
|
||||||
|
height: 95rpx;
|
||||||
|
line-height: 95rpx;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-family: PingFang SC-Medium, PingFang SC;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #FFFFFF;
|
||||||
|
background: linear-gradient(180deg, #F98649 0%, #F34E45 100%);
|
||||||
|
border-radius: 47rpx 47rpx 47rpx 47rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.entrust_bgb {
|
||||||
|
width: 694rpx;
|
||||||
|
height: 994rpx;
|
||||||
|
background: url('@/static/images/wtbg5.png') no-repeat;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
|
||||||
|
.entrust_bg-content {
|
||||||
|
position: absolute;
|
||||||
|
top: 304rpx;
|
||||||
|
|
||||||
|
.bg-content-a {
|
||||||
|
margin-left: 242rpx;
|
||||||
|
font-size: 35rpx;
|
||||||
|
font-family: PingFang SC;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #333333;
|
||||||
|
}
|
||||||
|
|
||||||
|
.bg-content-b {
|
||||||
|
margin-left: 35rpx;
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-family: PingFang SC;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #333333;
|
||||||
|
margin-top: 32rpx;
|
||||||
|
|
||||||
|
span {
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-family: PingFang SC-Medium, PingFang SC;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #F84221;
|
||||||
|
margin-left: 18rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.bg-content-c {
|
||||||
|
margin-left: 35rpx;
|
||||||
|
font-size: 35rpx;
|
||||||
|
font-family: PingFang SC;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #333333;
|
||||||
|
margin-top: 22rpx;
|
||||||
|
|
||||||
|
span {
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-family: PingFang SC-Medium, PingFang SC;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #F84221;
|
||||||
|
margin-left: 18rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.bg-content_textarea {
|
||||||
|
width: 624rpx;
|
||||||
|
height: 242rpx;
|
||||||
|
padding: 25rpx 18rpx;
|
||||||
|
|
||||||
|
background: #F5F5F5;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.entrust_bga_btn {
|
||||||
|
display: flex;
|
||||||
|
margin-top: 33rpx;
|
||||||
|
|
||||||
|
|
||||||
|
.determine {
|
||||||
|
margin-left: 188rpx;
|
||||||
|
width: 249rpx;
|
||||||
|
height: 95rpx;
|
||||||
|
line-height: 95rpx;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-family: PingFang SC-Medium, PingFang SC;
|
||||||
|
font-weight: 500;
|
||||||
|
color: #FFFFFF;
|
||||||
|
background: linear-gradient(180deg, #F98649 0%, #F34E45 100%);
|
||||||
|
border-radius: 47rpx 47rpx 47rpx 47rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
30
pages/error/index.vue
Normal file
30
pages/error/index.vue
Normal file
@ -0,0 +1,30 @@
|
|||||||
|
<template>
|
||||||
|
<view class="box">
|
||||||
|
网站已关闭
|
||||||
|
</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>
|
||||||
|
// +----------------------------------------------------------------------
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
.box{
|
||||||
|
position: fixed;
|
||||||
|
left: 50%;
|
||||||
|
top: 50%;
|
||||||
|
transform: translate(-50%,-50%);
|
||||||
|
font-size: 40rpx;
|
||||||
|
font-weight: bold;
|
||||||
|
color: #666;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
653
pages/gather/gather.vue
Normal file
653
pages/gather/gather.vue
Normal file
@ -0,0 +1,653 @@
|
|||||||
|
<template>
|
||||||
|
<view class="gather">
|
||||||
|
|
||||||
|
|
||||||
|
<view v-if="isFshow">
|
||||||
|
<view class="site-box flex_a_c_j_sb" :style="{ 'opacity': backColor,}" @click="selectLocation">
|
||||||
|
<view :class="['place_wrapper', 'flex_a_c', isFshow ? 'sitebox' : '']" @click="selectLocation">
|
||||||
|
<view :class="['iconfont', 'icon-weizhi', isFshow ? 'sitebox' : '']" style=" margin-left: 20rpx">
|
||||||
|
</view>
|
||||||
|
<view class="town_name">{{ street }}</view>
|
||||||
|
</view>
|
||||||
|
<navigator url="/pages/chat/customer_list/index?type=0" hover-class="none">
|
||||||
|
<view :class="['iconfont', 'icon-xiaoxi', isFshow ? 'sitebox' : '']"></view>
|
||||||
|
</navigator>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
<view class="" v-if="!isFshow">
|
||||||
|
<view class="site-box1 flex_a_c_j_sb">
|
||||||
|
|
||||||
|
<view class="place_wrapper flex_a_c" @click="selectLocation">
|
||||||
|
<view class="iconfont icon-weizhi"></view>
|
||||||
|
<view class="town_name">{{street}}</view>
|
||||||
|
</view>
|
||||||
|
<navigator url="/pages/chat/customer_list/index?type=0" hover-class="none">
|
||||||
|
<view class="iconfont icon-xiaoxi" style="color:#fff;"> </view>
|
||||||
|
</navigator>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<zbpSwiper :isSelectPlace="true" :location_Arr="locationArr" :town="street" @kkchange="kkchange"></zbpSwiper>
|
||||||
|
<u-empty :show="jurisdiction" mode="permission" :text="emptyText"
|
||||||
|
icon="http://cdn.uviewui.com/uview/empty/permission.png"></u-empty>
|
||||||
|
<view class="business com special_work" v-if="jurisdiction == false">
|
||||||
|
<view class="title project">
|
||||||
|
<view>更多功能</view>
|
||||||
|
<view v-if="!editFlag" class="edit" @click="editFlag = true">编辑</view>
|
||||||
|
<view v-else class="edit" @click="editComfirm">完成</view>
|
||||||
|
</view>
|
||||||
|
<view class="content">
|
||||||
|
<block v-if="nowMenuList.length > 0">
|
||||||
|
<u-transition v-for="(item, index) in nowMenuList" :key="item.name" show>
|
||||||
|
<view class="examine" @click="
|
||||||
|
editFlag ? removeMenu(item) : clickMenu(item.type, item.data)
|
||||||
|
">
|
||||||
|
<image class="icon_img" :src="item.icon" mode="aspectFit">
|
||||||
|
</image>
|
||||||
|
<u-icon v-if="editFlag" class="icon" name="minus-circle-fill" color="red"></u-icon>
|
||||||
|
<text class="text">{{ item.name }}</text>
|
||||||
|
</view>
|
||||||
|
</u-transition>
|
||||||
|
</block>
|
||||||
|
<view v-else-if="!editFlag" @click="editFlag = true"
|
||||||
|
style="text-align: center; width: 100%; color: #aaa">还没有应用,点我添加应用</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view v-if="editFlag" class="business com special_work edit_card">
|
||||||
|
<view class="title project" style="padding: 0 28rpx">
|
||||||
|
<view>编辑功能</view>
|
||||||
|
<view class="edit2" @click="editComfirm">完成</view>
|
||||||
|
</view>
|
||||||
|
<view class="content">
|
||||||
|
<u-transition v-for="(item, index) in AllMenuList" :key="item.name" show>
|
||||||
|
<view class="examine" @click="pushMenu(item)">
|
||||||
|
<image class="icon_img" :src="item.icon" mode="aspectFit">
|
||||||
|
</image>
|
||||||
|
<u-icon class="icon" name="plus-circle-fill"></u-icon>
|
||||||
|
<text class="text">{{ item.name }}</text>
|
||||||
|
</view>
|
||||||
|
</u-transition>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
<u-picker :defaultIndex="[0,0]" :show="showPicker" ref="uPicker" :columns="columnData" @confirm="confirm"
|
||||||
|
@cancel="showPicker = false" @change="changeHandler" keyName="name"></u-picker>
|
||||||
|
<!-- <m-tabbar native>
|
||||||
|
<template v-slot:tabbar_index_2>
|
||||||
|
<view class="custom_style">
|
||||||
|
<view class="custom_style_icon"></view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
</m-tabbar> -->
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import Cache from '@/utils/cache';
|
||||||
|
import mTabbar from '@/components/m-tabbar/m-tabbar.vue'
|
||||||
|
|
||||||
|
import zbpSwiper from '@/components/zbpSwiper'
|
||||||
|
import {
|
||||||
|
getArea,
|
||||||
|
getStreet
|
||||||
|
} from '@/api/article.js';
|
||||||
|
import {
|
||||||
|
mapState,
|
||||||
|
mapGetters
|
||||||
|
} from 'vuex'
|
||||||
|
import {
|
||||||
|
getWorkArticleCount,
|
||||||
|
getSlideAPI
|
||||||
|
} from '@/api/article.js'
|
||||||
|
import {
|
||||||
|
getStoreList,
|
||||||
|
getUserInfo
|
||||||
|
} from '@/api/user.js'
|
||||||
|
import {
|
||||||
|
getGeocoder,
|
||||||
|
microSeachBarCode,
|
||||||
|
microEadtProduct
|
||||||
|
} from '@/api/store.js'
|
||||||
|
import {
|
||||||
|
Toast
|
||||||
|
} from '@/libs/uniApi';
|
||||||
|
import {
|
||||||
|
getDiy
|
||||||
|
} from '@/api/api.js';
|
||||||
|
// #ifdef APP-PLUS
|
||||||
|
import uniMP from '@/utils/uniMP.js';
|
||||||
|
// #endif
|
||||||
|
|
||||||
|
export default {
|
||||||
|
components: {
|
||||||
|
mTabbar,
|
||||||
|
zbpSwiper
|
||||||
|
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
locationArr: ({}),
|
||||||
|
emptyText: '暂无可用应用',
|
||||||
|
jurisdiction: false, // 是否有权限
|
||||||
|
mer_id: '',
|
||||||
|
userInfoData: {
|
||||||
|
mer_info: {
|
||||||
|
type_id: 0
|
||||||
|
}
|
||||||
|
},
|
||||||
|
prefix: 'https://lihai001.oss-cn-chengdu.aliyuncs.com/public/kk/luzhou/static4/11/',
|
||||||
|
isShow: false,
|
||||||
|
bgColor: '',
|
||||||
|
isFshow: false,
|
||||||
|
street: '',
|
||||||
|
// 编辑中标记
|
||||||
|
editFlag: false,
|
||||||
|
// 所有菜单的按钮
|
||||||
|
AllMenuList: [{
|
||||||
|
name: '商户平台',
|
||||||
|
icon: '/static/applet/shop_app.png',
|
||||||
|
data: '/pages/moreProject/moreProject',
|
||||||
|
type: 2,
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '供销平台',
|
||||||
|
icon: '/static/applet/gx_app.png',
|
||||||
|
data: '__UNI__B5B1EDD',
|
||||||
|
type: 1,
|
||||||
|
},
|
||||||
|
],
|
||||||
|
nowMenuList: [],
|
||||||
|
street: '',
|
||||||
|
showPicker: false,
|
||||||
|
columnData: [],
|
||||||
|
bgColor: '',
|
||||||
|
isFshow: false,
|
||||||
|
backColor: 'rgba(252, 252, 252, 0)'
|
||||||
|
};
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
...mapGetters(['userInfo', 'location', 'isLogin'])
|
||||||
|
},
|
||||||
|
created() {},
|
||||||
|
onLoad() {
|
||||||
|
this.Area()
|
||||||
|
this.initMenu();
|
||||||
|
},
|
||||||
|
|
||||||
|
onShow() {
|
||||||
|
if (this.isLogin) {
|
||||||
|
this.emptyText = '暂无可用应用'
|
||||||
|
this.jurisdiction = false
|
||||||
|
} else {
|
||||||
|
this.emptyText = '请登录'
|
||||||
|
this.jurisdiction = true
|
||||||
|
}
|
||||||
|
this.getUserInfo()
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
onPullDownRefresh() {
|
||||||
|
this.getUserInfo()
|
||||||
|
uni.stopPullDownRefresh()
|
||||||
|
},
|
||||||
|
beforeDestroy() {
|
||||||
|
// 销毁监听事件
|
||||||
|
this.$bus.$off('value-updated')
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
if (this.street.length <= 0) {
|
||||||
|
this.appLocation()
|
||||||
|
}
|
||||||
|
// #ifdef H5
|
||||||
|
// 监听页面滚动事件
|
||||||
|
window.addEventListener("scroll", this.scrolling);
|
||||||
|
// #endif
|
||||||
|
|
||||||
|
this.$bus.$on('value-updated', (newValue) => {
|
||||||
|
// 更新父组件的值
|
||||||
|
this.street = newValue.split(',')[0]
|
||||||
|
});
|
||||||
|
|
||||||
|
},
|
||||||
|
// #ifdef APP-PLUS
|
||||||
|
onPageScroll(e) {
|
||||||
|
const scrollTop = e.scrollTop;
|
||||||
|
if (scrollTop <= 20) {
|
||||||
|
this.backColor = 'rgba(252, 252, 252, 0)'
|
||||||
|
this.isFshow = false
|
||||||
|
} else if (20 < scrollTop && scrollTop <= 100) {
|
||||||
|
this.backColor = 'rgba(252, 252, 252, .5)'
|
||||||
|
this.isFshow = true
|
||||||
|
} else if (scrollTop > 100) {
|
||||||
|
this.backColor = 'rgba(252, 252, 252, 1)'
|
||||||
|
this.isFshow = true
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
},
|
||||||
|
// #endif
|
||||||
|
|
||||||
|
methods: {
|
||||||
|
scrolling() {
|
||||||
|
// 滚动条距文档顶部的距离
|
||||||
|
let scrollTop =
|
||||||
|
window.pageYOffset ||
|
||||||
|
document.documentElement.scrollTop ||
|
||||||
|
document.body.scrollTop;
|
||||||
|
// 滚动条滚动的距离
|
||||||
|
let scrollStep = scrollTop - this.oldScrollTop;
|
||||||
|
// console.log("header 滚动距离 ", scrollTop);
|
||||||
|
// 更新——滚动前，滚动条距文档顶部的距离
|
||||||
|
this.oldScrollTop = scrollTop;
|
||||||
|
|
||||||
|
//变量windowHeight是可视区的高度
|
||||||
|
let windowHeight =
|
||||||
|
document.documentElement.clientHeight || document.body.clientHeight;
|
||||||
|
//变量scrollHeight是滚动条的总高度
|
||||||
|
let scrollHeight =
|
||||||
|
document.documentElement.scrollHeight || document.body.scrollHeight;
|
||||||
|
|
||||||
|
//滚动条到底部的条件
|
||||||
|
if (scrollTop + windowHeight == scrollHeight) {
|
||||||
|
//你想做的事情
|
||||||
|
// console.log("header 你已经到底部了");
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
if (scrollTop <= 20) {
|
||||||
|
this.backColor = 'rgba(252, 252, 252, 0)'
|
||||||
|
this.isFshow = false
|
||||||
|
} else if (20 < scrollTop && scrollTop <= 100) {
|
||||||
|
this.backColor = 'rgba(252, 252, 252, .5)'
|
||||||
|
this.isFshow = true
|
||||||
|
} else if (scrollTop > 100) {
|
||||||
|
this.backColor = 'rgba(252, 252, 252, 1)'
|
||||||
|
this.isFshow = true
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
},
|
||||||
|
// 初始化菜单
|
||||||
|
initMenu() {
|
||||||
|
let now = uni.getStorageSync('gatherNowMenuList');
|
||||||
|
try {
|
||||||
|
this.nowMenuList = JSON.parse(now);
|
||||||
|
this.AllMenuList = this.AllMenuList.filter((item) => {
|
||||||
|
return this.nowMenuList.find(t => t.name == item.name)?.name != item.name;
|
||||||
|
})
|
||||||
|
} catch (e) {
|
||||||
|
this.nowMenuList = [];
|
||||||
|
}
|
||||||
|
},
|
||||||
|
clickMenu(e, data) {
|
||||||
|
switch (e) {
|
||||||
|
case 1:
|
||||||
|
this.getUniMp(data);
|
||||||
|
break;
|
||||||
|
case 2:
|
||||||
|
|
||||||
|
// this.getUniMp(data);
|
||||||
|
this.navigator(data);
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 添加菜单
|
||||||
|
pushMenu(data) {
|
||||||
|
this.nowMenuList.push(data);
|
||||||
|
this.AllMenuList = this.AllMenuList.filter((item) => {
|
||||||
|
return item.name != data.name;
|
||||||
|
})
|
||||||
|
},
|
||||||
|
// 移除菜单
|
||||||
|
removeMenu(data) {
|
||||||
|
this.AllMenuList.push(data);
|
||||||
|
this.nowMenuList = this.nowMenuList.filter((item) => {
|
||||||
|
return item.name != data.name;
|
||||||
|
})
|
||||||
|
},
|
||||||
|
// 编辑完成
|
||||||
|
editComfirm() {
|
||||||
|
this.editFlag = false;
|
||||||
|
uni.setStorageSync('gatherNowMenuList', JSON.stringify(this.nowMenuList));
|
||||||
|
},
|
||||||
|
getUniMp(appid) {
|
||||||
|
console.log('点击供销平台');
|
||||||
|
// #ifdef APP-PLUS
|
||||||
|
uniMP.loadMP(appid);
|
||||||
|
return;
|
||||||
|
// #endif
|
||||||
|
uni.showToast({
|
||||||
|
icon: 'none',
|
||||||
|
title: 'H5不支持打开小程序'
|
||||||
|
})
|
||||||
|
},
|
||||||
|
changeHandler(e) {
|
||||||
|
const {
|
||||||
|
columnIndex,
|
||||||
|
value,
|
||||||
|
values,
|
||||||
|
index,
|
||||||
|
picker = this.$refs.uPicker
|
||||||
|
} = e;
|
||||||
|
if (columnIndex === 0) {
|
||||||
|
getStreet({
|
||||||
|
area_code: value[0]['code']
|
||||||
|
}).then(res => {
|
||||||
|
this.$refs.uPicker.setColumnValues(1, res.data);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
Area() {
|
||||||
|
getArea({
|
||||||
|
city_code: 510500
|
||||||
|
}).then(res => {
|
||||||
|
this.$refs.uPicker.setColumnValues(0, res.data);
|
||||||
|
this.Street(res.data[0]['code']);
|
||||||
|
});
|
||||||
|
},
|
||||||
|
Street(code) {
|
||||||
|
getStreet({
|
||||||
|
area_code: code
|
||||||
|
}).then(res => {
|
||||||
|
this.$refs.uPicker.setColumnValues(1, res.data);
|
||||||
|
});
|
||||||
|
},
|
||||||
|
selectLocation() {
|
||||||
|
this.showPicker = true
|
||||||
|
},
|
||||||
|
confirm(e) {
|
||||||
|
this.street = e.value[1].name
|
||||||
|
|
||||||
|
this.$nextTick(() => {
|
||||||
|
this.$bus.$emit('value-updated', e.value[1].name + ',' + e.value[1].code);
|
||||||
|
|
||||||
|
})
|
||||||
|
this.showPicker = false
|
||||||
|
},
|
||||||
|
appLocation() {
|
||||||
|
uni.getLocation({
|
||||||
|
type: 'wgs84',
|
||||||
|
timeout: '10',
|
||||||
|
success: (res) => {
|
||||||
|
// console.log(res)
|
||||||
|
this.isshow = false
|
||||||
|
let latitude, longitude;
|
||||||
|
latitude = res.latitude.toString();
|
||||||
|
longitude = res.longitude.toString();
|
||||||
|
getGeocoder({
|
||||||
|
lat: latitude,
|
||||||
|
long: longitude
|
||||||
|
}).then(res => {
|
||||||
|
let town = res.data.address_reference.town.title
|
||||||
|
let street_id = res.data.address_reference.town.id
|
||||||
|
this.street = res.data.address_component.street
|
||||||
|
this.$nextTick(() => {
|
||||||
|
this.$bus.$emit('value-updated', this.street + ',' +
|
||||||
|
street_id);
|
||||||
|
|
||||||
|
})
|
||||||
|
|
||||||
|
}).catch(err => {
|
||||||
|
this.isshow = false
|
||||||
|
uni.showToast({
|
||||||
|
title: err,
|
||||||
|
icon: 'none'
|
||||||
|
})
|
||||||
|
})
|
||||||
|
},
|
||||||
|
fail: (err) => {
|
||||||
|
this.isshow = false
|
||||||
|
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
|
||||||
|
kkchange(e) {
|
||||||
|
this.bgColor = e
|
||||||
|
},
|
||||||
|
|
||||||
|
navigator(url, t) {
|
||||||
|
// if (this.userInfoData.is_wsxx === 0 && t != '商户设置') return Toast("请完善商户信息");
|
||||||
|
uni.navigateTo({
|
||||||
|
url: url
|
||||||
|
})
|
||||||
|
},
|
||||||
|
getUserInfo: function() {
|
||||||
|
let that = this;
|
||||||
|
getUserInfo().then(res => {
|
||||||
|
that.userInfoData = res.data;
|
||||||
|
// console.log(res.data.service);
|
||||||
|
if (res.data.service == null) {
|
||||||
|
// console.log('123');
|
||||||
|
this.isShow = false
|
||||||
|
} else {
|
||||||
|
this.isShow = true
|
||||||
|
this.mer_id = res.data.service.mer_id
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!res.data.mer_info) {
|
||||||
|
that.$set(this, 'jurisdiction', false);
|
||||||
|
}
|
||||||
|
// console.log(that.userInfoData);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.gather {
|
||||||
|
padding-bottom: 164.91rpx;
|
||||||
|
background: linear-gradient(180deg, #ffffff 0%, #f6f6f6 100%);
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sitebox {
|
||||||
|
animation-name: fadeIn;
|
||||||
|
animation-duration: 3s;
|
||||||
|
animation-fill-mode: forwards;
|
||||||
|
}
|
||||||
|
|
||||||
|
@keyframes fadeIn {
|
||||||
|
from {
|
||||||
|
opacity: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
to {
|
||||||
|
opacity: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.site-box1 {
|
||||||
|
width: 706rpx;
|
||||||
|
/* #ifdef MP || APP-PLUS */
|
||||||
|
height: 160rpx;
|
||||||
|
/* #endif */
|
||||||
|
/* #ifdef H5 */
|
||||||
|
height: 120rpx;
|
||||||
|
/* #endif */
|
||||||
|
margin-bottom: 26.32rpx;
|
||||||
|
position: absolute;
|
||||||
|
top: 45rpx;
|
||||||
|
left: 20rpx;
|
||||||
|
|
||||||
|
z-index: 999;
|
||||||
|
// 位置
|
||||||
|
.place_wrapper {
|
||||||
|
color: #fff;
|
||||||
|
margin-right: 0rpx;
|
||||||
|
|
||||||
|
font-size: 30rpx;
|
||||||
|
|
||||||
|
.town_name {
|
||||||
|
margin-left: 21rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.iconfont {
|
||||||
|
font-size: 35.09rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
.site-box {
|
||||||
|
width: 100%;
|
||||||
|
/* #ifdef MP || APP-PLUS */
|
||||||
|
height: 160rpx;
|
||||||
|
/* #endif */
|
||||||
|
/* #ifdef H5 */
|
||||||
|
height: 120rpx;
|
||||||
|
/* #endif */
|
||||||
|
margin-bottom: 26.32rpx;
|
||||||
|
position: absolute;
|
||||||
|
top: 0rpx;
|
||||||
|
position: fixed;
|
||||||
|
z-index: 999;
|
||||||
|
/* #ifdef MP || APP-PLUS */
|
||||||
|
padding-top: 75rpx;
|
||||||
|
/* #endif */
|
||||||
|
/* #ifdef H5 */
|
||||||
|
padding-top: 25rpx;
|
||||||
|
/* #endif */
|
||||||
|
// background-color: #e5e5e5;
|
||||||
|
background: url('@/static/images/bg2.png') no-repeat;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
padding-right: 20rpx;
|
||||||
|
|
||||||
|
// 位置
|
||||||
|
.place_wrapper {
|
||||||
|
color: #fff;
|
||||||
|
margin-right: 24.56rpx;
|
||||||
|
font-size: 30rpx;
|
||||||
|
|
||||||
|
opacity: 0;
|
||||||
|
|
||||||
|
.town_name {
|
||||||
|
margin-left: 21rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.iconfont {
|
||||||
|
opacity: 0;
|
||||||
|
font-size: 30rpx;
|
||||||
|
font-size: 35.09rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.top_box {
|
||||||
|
// padding-top: 180rpx;
|
||||||
|
background: linear-gradient(#36a2ff, #fff);
|
||||||
|
}
|
||||||
|
|
||||||
|
.com {
|
||||||
|
margin-left: 50%;
|
||||||
|
transform: translate(-50%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.business {
|
||||||
|
width: 694.74rpx;
|
||||||
|
// margin-bottom: 175rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.special_work {
|
||||||
|
// padding: 17.54rpx;
|
||||||
|
width: 694.74rpx;
|
||||||
|
margin-top: 52.63rpx;
|
||||||
|
border-radius: 17.54rpx;
|
||||||
|
// box-shadow: 0px 0px 6px 1px rgba(0, 0, 0, 0.16);
|
||||||
|
|
||||||
|
.title {
|
||||||
|
font-size: 31.58rpx;
|
||||||
|
font-weight: 700;
|
||||||
|
margin-bottom: 38.6rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.project {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: flex-end;
|
||||||
|
|
||||||
|
.edit {
|
||||||
|
font-size: 26rpx;
|
||||||
|
font-weight: 400;
|
||||||
|
|
||||||
|
&::after {
|
||||||
|
content: ">";
|
||||||
|
margin-left: 10rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.edit2 {
|
||||||
|
font-size: 26rpx;
|
||||||
|
font-weight: 400;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.content {
|
||||||
|
display: flex;
|
||||||
|
align-content: center;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
// justify-content: space-between;
|
||||||
|
|
||||||
|
.examine {
|
||||||
|
margin-bottom: 35rpx;
|
||||||
|
width: 173.68rpx;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
position: relative;
|
||||||
|
// margin: 0 0 33.33rpx 33.33rpx !important;
|
||||||
|
|
||||||
|
.icon_img {
|
||||||
|
width: 83.16rpx;
|
||||||
|
height: 83.16rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon {
|
||||||
|
position: absolute;
|
||||||
|
top: -5rpx;
|
||||||
|
right: 25rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.text {
|
||||||
|
font-size: 26.32rpx;
|
||||||
|
margin-top: 21.05rpx;
|
||||||
|
color: #000;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.text {
|
||||||
|
font-size: 29.82rpx;
|
||||||
|
color: #a4a4a4;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.cont_jus {
|
||||||
|
margin-top: 56.14rpx;
|
||||||
|
justify-content: flex-start;
|
||||||
|
|
||||||
|
&:first-child {
|
||||||
|
// margin-right: 33rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.examine {
|
||||||
|
margin-right: 48rpx;
|
||||||
|
|
||||||
|
&:first-child {
|
||||||
|
margin-right: 48rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.edit_card {
|
||||||
|
background-color: #fff;
|
||||||
|
padding-top: 28rpx;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
548
pages/goods_cate/goods_cate.vue
Normal file
548
pages/goods_cate/goods_cate.vue
Normal file
@ -0,0 +1,548 @@
|
|||||||
|
<template>
|
||||||
|
<view>
|
||||||
|
<skeleton :show="showSkeleton" :isNodes="isNodes" ref="skeleton" loading="chiaroscuro" selector="skeleton"
|
||||||
|
bgcolor="#FFF"></skeleton>
|
||||||
|
<view class='productSort' :style="{visibility: showSkeleton ? 'hidden' : 'visible', height: winHeight+ 'px' }">
|
||||||
|
<view class='header acea-row row-center-wrapper'>
|
||||||
|
<navigator url="/pages/columnGoods/goods_search/index" class='acea-row row-between-wrapper input skeleton-rect' hover-class="none">
|
||||||
|
<text class='iconfont icon-sousuo'></text>
|
||||||
|
<view class="input-box">点击搜索商品信息</view>
|
||||||
|
</navigator>
|
||||||
|
</view>
|
||||||
|
<view class="con-box" :style="viewColor">
|
||||||
|
<view class='aside'>
|
||||||
|
<scroll-view scroll-y="true" style="height: 100%; overflow: hidden;" scroll-with-animation='true' :scroll-into-view="intoindex">
|
||||||
|
<view v-for="(item,index) in productList">
|
||||||
|
<view class='item acea-row row-center-wrapper' :class='index==navActive?"on":""' v-if='item.children && item.children.length > 0'
|
||||||
|
:key="item.store_category_id" @click='tap(index,"b"+item.store_category_id)' :id='"sort"+index'><text class="item_text skeleton-rect">{{item.cate_name}}{{pid}}</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</scroll-view>
|
||||||
|
</view>
|
||||||
|
<view class='conter'>
|
||||||
|
<scroll-view scroll-y="true" :scroll-into-view="toView" style="height: 100%; overflow: hidden;" @scroll="scroll" scroll-with-animation='true'>
|
||||||
|
<view v-for="(p,i) in productList">
|
||||||
|
<view class='listw' :id="'b'+p.store_category_id+index" v-for="(item,index) in p.children" :key="item.store_category_id">
|
||||||
|
<view class='title acea-row'>
|
||||||
|
<view v-if="hotList.length > 0 && i === 0" class='name skeleton-rect'>
|
||||||
|
<image class="list_title" :src="domain+'/static/diy/recommend_cate'+keyColor+'.png'"></image>
|
||||||
|
</view>
|
||||||
|
<view v-else class='name skeleton-rect'>{{item.cate_name}}</view>
|
||||||
|
</view>
|
||||||
|
<view class='list acea-row'>
|
||||||
|
<block v-for="(itemn,indexn) in item.children" :key="itemn.store_category_id">
|
||||||
|
<navigator hover-class='none' :url="'/pages/columnGoods/goods_list/index?id='+itemn.store_category_id+'&title='+itemn.cate_name"
|
||||||
|
class='item acea-row row-column row-middle'>
|
||||||
|
<view class='picture skeleton-rect'>
|
||||||
|
<easy-loadimage mode="widthFix" :image-src="itemn.pic"></easy-loadimage>
|
||||||
|
</view>
|
||||||
|
<view class='name line1'>{{itemn.cate_name}}</view>
|
||||||
|
</navigator>
|
||||||
|
</block>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view :style='"height:"+(height-300)+"rpx;"'></view>
|
||||||
|
</scroll-view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<!-- #ifndef H5 -->
|
||||||
|
<passwordPopup></passwordPopup>
|
||||||
|
<!-- #endif -->
|
||||||
|
</view>
|
||||||
|
<view class="foot" v-if="newData.status && newData.status.status">
|
||||||
|
<view class="page-footer" id="target" :style="{'background-color':newData.bgColor.color[0].item}">
|
||||||
|
<view class="foot-item" v-for="(item,index) in newData.menuList" :key="index"
|
||||||
|
@click="goRouter(item)">
|
||||||
|
<block v-if="item.link == activeRouter">
|
||||||
|
<image :src="item.imgList[0]"></image>
|
||||||
|
<view class="txt" :style="{color:newData.activeTxtColor.color[0].item}">{{item.name}}
|
||||||
|
</view>
|
||||||
|
</block>
|
||||||
|
<block v-else>
|
||||||
|
<image :src="item.imgList[1]"></image>
|
||||||
|
<view class="txt" :style="{color:newData.txtColor.color[0].item}">{{item.name}}</view>
|
||||||
|
</block>
|
||||||
|
</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 { getCategoryList } from '@/api/store.js';
|
||||||
|
import { getNavigation } from '@/api/public.js'
|
||||||
|
import { configMap } from '@/utils/index';
|
||||||
|
// #ifndef H5
|
||||||
|
import passwordPopup from '@/components/passwordPopup';
|
||||||
|
// #endif
|
||||||
|
import easyLoadimage from '@/components/easy-loadimage/easy-loadimage.vue';
|
||||||
|
import { mapGetters } from "vuex";
|
||||||
|
import { HTTP_REQUEST_URL } from '@/config/app';
|
||||||
|
export default {
|
||||||
|
components: {
|
||||||
|
easyLoadimage,
|
||||||
|
// #ifndef H5
|
||||||
|
passwordPopup,
|
||||||
|
// #endif
|
||||||
|
},
|
||||||
|
computed: configMap({navigation: {}},mapGetters(['viewColor','keyColor'])),
|
||||||
|
data() {
|
||||||
|
let active = 0;
|
||||||
|
// #ifdef H5
|
||||||
|
active = location.hash.substr(1);
|
||||||
|
// #endif
|
||||||
|
return {
|
||||||
|
domain: HTTP_REQUEST_URL,
|
||||||
|
showSkeleton: true, //骨架屏显示隐藏
|
||||||
|
isNodes: 0, //控制什么时候开始抓取元素节点,只要数值改变就重新抓取
|
||||||
|
navlist: [],
|
||||||
|
hotList: [], //推荐分类
|
||||||
|
productList: [
|
||||||
|
{cate_name: 'skeleton',store_category_id: 0,
|
||||||
|
children:[
|
||||||
|
{cate_name: 'skeleton',store_category_id: 10,children:[
|
||||||
|
{cate_name: '',store_category_id: 101,},
|
||||||
|
{cate_name: '',store_category_id: 102,},
|
||||||
|
{cate_name: '',store_category_id: 103,},
|
||||||
|
{cate_name: '',store_category_id: 104,},
|
||||||
|
{cate_name: '',store_category_id: 105,},
|
||||||
|
{cate_name: '',store_category_id: 106,}
|
||||||
|
]},
|
||||||
|
{cate_name: 'skeleton',store_category_id: 1,
|
||||||
|
children:[
|
||||||
|
{cate_name: '',store_category_id: 101,},
|
||||||
|
{cate_name: '',store_category_id: 102,},
|
||||||
|
{cate_name: '',store_category_id: 103,},
|
||||||
|
{cate_name: '',store_category_id: 104,},
|
||||||
|
{cate_name: '',store_category_id: 105,},
|
||||||
|
{cate_name: '',store_category_id: 106,}
|
||||||
|
]},
|
||||||
|
{cate_name: '',store_category_id: 20}
|
||||||
|
]
|
||||||
|
},
|
||||||
|
{cate_name: 'skeleton',store_category_id: 2,
|
||||||
|
children:[{cate_name:'skeleton',store_category_id: 30}]},
|
||||||
|
{cate_name: 'skeleton',store_category_id: 3,
|
||||||
|
children:[{cate_name:'skeleton',store_category_id: 31}]},
|
||||||
|
{cate_name: 'skeleton',store_category_id: 4,
|
||||||
|
children:[{cate_name:'skeleton',store_category_id: 32}]},
|
||||||
|
{cate_name: 'skeleton',store_category_id: 5,
|
||||||
|
children:[{cate_name:'skeleton',store_category_id: 33}]},
|
||||||
|
{cate_name: 'skeleton',store_category_id: 6,
|
||||||
|
children:[{cate_name:'skeleton',store_category_id: 34}]},
|
||||||
|
{cate_name: 'skeleton',store_category_id: 7,
|
||||||
|
children:[{cate_name:'skeleton',store_category_id: 35}]},
|
||||||
|
{cate_name: 'skeleton',store_category_id: 8,
|
||||||
|
children:[{cate_name:'skeleton',store_category_id: 36}]},
|
||||||
|
{cate_name: 'skeleton',store_category_id: 9,
|
||||||
|
children:[{cate_name:'skeleton',store_category_id: 37}]},
|
||||||
|
{cate_name: 'skeleton',store_category_id: 10,
|
||||||
|
children:[{cate_name:'skeleton',store_category_id: 38}]},
|
||||||
|
{cate_name: 'skeleton',store_category_id: 11,
|
||||||
|
children:[{cate_name:'skeleton',store_category_id: 39}]},
|
||||||
|
],
|
||||||
|
navActive: 0,
|
||||||
|
activceCate: active,
|
||||||
|
number: "",
|
||||||
|
height: 0,
|
||||||
|
hightArr: [],
|
||||||
|
toView: "",
|
||||||
|
winHeight: 0,
|
||||||
|
pidIndex: 0,
|
||||||
|
intoindex: "",
|
||||||
|
pid: '',
|
||||||
|
newData: {},
|
||||||
|
activeRouter: '',
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onLoad(options) {
|
||||||
|
let that = this
|
||||||
|
const index = uni.getStorageSync('storeIndex');
|
||||||
|
if(options.activceCate){
|
||||||
|
this.activceCate = options.activceCate;
|
||||||
|
}else if(index){
|
||||||
|
this.activceCate = index;
|
||||||
|
uni.removeStorageSync('storeIndex');
|
||||||
|
}
|
||||||
|
uni.getSystemInfo({
|
||||||
|
success: function(res) {
|
||||||
|
that.winHeight = res.windowHeight
|
||||||
|
},
|
||||||
|
});
|
||||||
|
// #ifdef H5
|
||||||
|
document.body.addEventListener('touchmove', function(event) {
|
||||||
|
if (that.$route.path == '/pages/goods_cate/goods_cate') {
|
||||||
|
event.preventDefault();
|
||||||
|
}
|
||||||
|
}, {
|
||||||
|
passive: false
|
||||||
|
});
|
||||||
|
// #endif
|
||||||
|
this.getAllCategory();
|
||||||
|
},
|
||||||
|
/**
|
||||||
|
* 用户点击右上角分享
|
||||||
|
*/
|
||||||
|
// #ifdef MP
|
||||||
|
onShareAppMessage: function() {
|
||||||
|
wx.showShareMenu({
|
||||||
|
withShareTicket: true,
|
||||||
|
menus: ['shareAppMessage', 'shareTimeline']
|
||||||
|
})
|
||||||
|
return {
|
||||||
|
path: '/pages/goods_cate/goods_cate?activceCate=' + this.productList[this.navActive] ? this.productList[this.navActive].store_category_id : 0
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onShareTimeline: function() {
|
||||||
|
return {
|
||||||
|
query: {
|
||||||
|
activceCate: this.productList[this.navActive] ? this.productList[this.navActive].store_category_id : 0,
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// #endif
|
||||||
|
onShow() {
|
||||||
|
let that = this
|
||||||
|
let routes = getCurrentPages();
|
||||||
|
let curRoute = routes[routes.length - 1].route
|
||||||
|
this.activeRouter = '/' + curRoute
|
||||||
|
let pid = uni.getStorageSync('storeIndex')
|
||||||
|
if(pid) {
|
||||||
|
this.activceCate = pid
|
||||||
|
uni.removeStorageSync('storeIndex');
|
||||||
|
}
|
||||||
|
if(this.activceCate){
|
||||||
|
this.getCateFrom(this.productList)
|
||||||
|
pid && setTimeout(()=>this.tap(this.pidIndex, 'b' + this.activceCate), 200);
|
||||||
|
}
|
||||||
|
that.getNav()
|
||||||
|
},
|
||||||
|
onHide() {},
|
||||||
|
// //点击底部tabbar调用
|
||||||
|
// onTabItemTap() {
|
||||||
|
// this.getAllCategory();
|
||||||
|
// },
|
||||||
|
onReady() {
|
||||||
|
this.isNodes++;
|
||||||
|
},
|
||||||
|
|
||||||
|
methods: {
|
||||||
|
goRouter(item) {
|
||||||
|
var pages = getCurrentPages();
|
||||||
|
var page = (pages[pages.length - 1]).$page.fullPath;
|
||||||
|
if (item.link == page) return
|
||||||
|
uni.switchTab({
|
||||||
|
url: item.link,
|
||||||
|
fail(err) {
|
||||||
|
uni.redirectTo({
|
||||||
|
url: item.link
|
||||||
|
})
|
||||||
|
}
|
||||||
|
})
|
||||||
|
},
|
||||||
|
getNav() {
|
||||||
|
this.newData = this.navigation
|
||||||
|
if (this.newData.status && this.newData.status.status) {
|
||||||
|
uni.hideTabBar()
|
||||||
|
} else {
|
||||||
|
uni.showTabBar()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
infoScroll: function() {
|
||||||
|
let that = this;
|
||||||
|
//this.number = that.productList[len - 1].children.length;
|
||||||
|
//设置商品列表高度
|
||||||
|
uni.getSystemInfo({
|
||||||
|
success: function(res) {
|
||||||
|
that.height = (res.windowHeight) * (750 / res.windowWidth) - 98;
|
||||||
|
},
|
||||||
|
});
|
||||||
|
let hightArr = [];
|
||||||
|
for (let i = 0; i < that.productList.length; i++) {
|
||||||
|
let item = that.productList[i]
|
||||||
|
if(!that.productList[i].children){
|
||||||
|
continue;
|
||||||
|
}
|
||||||
|
for (let j = 0; j < that.productList[i].children.length; j++) {
|
||||||
|
//获取元素所在位置
|
||||||
|
let query = uni.createSelectorQuery().in(this);
|
||||||
|
let idView = "#b" + item.store_category_id + j;
|
||||||
|
query.select(idView).boundingClientRect();
|
||||||
|
query.exec(function(res) {
|
||||||
|
if(res[0]){
|
||||||
|
let top = res[0].top;
|
||||||
|
hightArr.push({top,i});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
};
|
||||||
|
};
|
||||||
|
that.hightArr = hightArr;
|
||||||
|
},
|
||||||
|
tap: function(index, id) {
|
||||||
|
this.toView = ''+id+0;
|
||||||
|
this.navActive = index;
|
||||||
|
setTimeout(()=>{
|
||||||
|
uni.$emit('scroll');
|
||||||
|
}, 300);
|
||||||
|
},
|
||||||
|
getAllCategory: function() {
|
||||||
|
let that = this;
|
||||||
|
let value = ""
|
||||||
|
that.pidIndex = 0;
|
||||||
|
getCategoryList().then(res => {
|
||||||
|
that.productList = res.data.list;
|
||||||
|
that.hotList = res.data.hot;
|
||||||
|
if(that.hotList.length>0){
|
||||||
|
let hot = {
|
||||||
|
cate_name: '推荐分类',store_category_id: 0,
|
||||||
|
children: [
|
||||||
|
{
|
||||||
|
cate_name:'推荐分类',
|
||||||
|
store_category_id: 1,
|
||||||
|
children:that.hotList
|
||||||
|
}
|
||||||
|
]
|
||||||
|
}
|
||||||
|
that.productList.unshift(hot)
|
||||||
|
}
|
||||||
|
that.getCateFrom(that.productList)
|
||||||
|
that.$nextTick(function(){
|
||||||
|
setTimeout(() => {
|
||||||
|
that.infoScroll();
|
||||||
|
setTimeout(()=>that.tap(that.pidIndex, 'b' + that.activceCate),200);
|
||||||
|
}, 300);
|
||||||
|
})
|
||||||
|
setTimeout(() => {
|
||||||
|
that.showSkeleton = false
|
||||||
|
}, 500)
|
||||||
|
})
|
||||||
|
},
|
||||||
|
//获取首页分类来源
|
||||||
|
getCateFrom: function(arr) {
|
||||||
|
let i = ""
|
||||||
|
arr.map((item, index) => {
|
||||||
|
if ((this.activceCate && item.store_category_id == this.activceCate)) {
|
||||||
|
this.pidIndex = index
|
||||||
|
i = 'sort' + index
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
})
|
||||||
|
this.$nextTick(() => {
|
||||||
|
this.intoindex = i
|
||||||
|
})
|
||||||
|
},
|
||||||
|
scroll: function(e) {
|
||||||
|
uni.$emit('scroll');
|
||||||
|
let scrollTop = e.detail.scrollTop + 10;
|
||||||
|
let scrollArr = this.hightArr;
|
||||||
|
for (let i = 0; i < scrollArr.length; i++) {
|
||||||
|
if (scrollTop >= scrollArr[i].top - scrollArr[0].top && scrollTop < (scrollArr[i + 1] ? scrollArr[i + 1].top : 0) - scrollArr[0].top) {
|
||||||
|
this.navActive = scrollArr[i].i
|
||||||
|
} else if (scrollTop >= scrollArr[scrollArr.length - 1].top - scrollArr[0].top) {
|
||||||
|
this.navActive = scrollArr[scrollArr.length - 1].i
|
||||||
|
}else if (scrollTop >= 0 && scrollTop < scrollArr[1].top - scrollArr[0].top) {
|
||||||
|
this.navActive = 0
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
searchSubmitValue: function(e) {
|
||||||
|
if (this.$util.trim(e.detail.value).length > 0)
|
||||||
|
uni.navigateTo({
|
||||||
|
url: '/pages/columnGoods/goods_list/index?searchValue=' + e.detail.value
|
||||||
|
})
|
||||||
|
else
|
||||||
|
return this.$util.Tips({
|
||||||
|
title: '请填写要搜索的产品信息'
|
||||||
|
});
|
||||||
|
},
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style scoped lang="scss">
|
||||||
|
.productSort {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
width: 100%;
|
||||||
|
.con-box {
|
||||||
|
flex: 1;
|
||||||
|
display: flex;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.productSort .header {
|
||||||
|
width: 100%;
|
||||||
|
height: 96rpx;
|
||||||
|
background-color: #fff;
|
||||||
|
border-bottom: 1px solid #f5f5f5;
|
||||||
|
}
|
||||||
|
.productSort .header .input {
|
||||||
|
width: 700rpx;
|
||||||
|
height: 60rpx;
|
||||||
|
background-color: #f5f5f5;
|
||||||
|
border-radius: 50rpx;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding: 0 25rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.productSort .header .input .iconfont {
|
||||||
|
font-size: 35rpx;
|
||||||
|
color: #555;
|
||||||
|
}
|
||||||
|
.productSort .header .input .placeholder {
|
||||||
|
color: #999;
|
||||||
|
}
|
||||||
|
.productSort .header .input .input-box {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
font-size: 26rpx;
|
||||||
|
height: 100%;
|
||||||
|
width: 597rpx;
|
||||||
|
color: #999999;
|
||||||
|
}
|
||||||
|
.productSort .aside {
|
||||||
|
background-color: #fff;
|
||||||
|
overflow-y: auto;
|
||||||
|
overflow-x: hidden;
|
||||||
|
width: 200rpx;
|
||||||
|
height: 100%;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
.productSort .aside .item {
|
||||||
|
height: 100rpx;
|
||||||
|
width: 100%;
|
||||||
|
font-size: 26rpx;
|
||||||
|
color: #424242;
|
||||||
|
}
|
||||||
|
.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: #f7f7f7;
|
||||||
|
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 14rpx;
|
||||||
|
background-color: #f7f7f7;
|
||||||
|
}
|
||||||
|
.productSort .conter .listw .title {
|
||||||
|
height: 100rpx;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.productSort .conter .listw .title .line {
|
||||||
|
width: 100rpx;
|
||||||
|
height: 2rpx;
|
||||||
|
background-color: #f0f0f0;
|
||||||
|
}
|
||||||
|
.productSort .conter .listw .title .name {
|
||||||
|
font-size: 28rpx;
|
||||||
|
color: #333;
|
||||||
|
margin: 0 30rpx;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
.productSort .conter .listw .title .list_title,
|
||||||
|
.productSort .conter .listw .title uni-image,
|
||||||
|
.productSort .conter .listw .title image{
|
||||||
|
width: 110rpx;
|
||||||
|
height: 26rpx;
|
||||||
|
border-radius: 0;
|
||||||
|
}
|
||||||
|
.productSort .conter .list {
|
||||||
|
flex-wrap: wrap;
|
||||||
|
background: #fff;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
padding-bottom: 26rpx;
|
||||||
|
}
|
||||||
|
.productSort .conter .list .item {
|
||||||
|
width: 174rpx;
|
||||||
|
margin-top: 26rpx;
|
||||||
|
}
|
||||||
|
.productSort .conter .list .item .picture,
|
||||||
|
.productSort .conter uni-image,
|
||||||
|
.productSort .conter .list .item image,
|
||||||
|
/deep/.easy-loadimage{
|
||||||
|
width: 110rpx;
|
||||||
|
height: 110rpx;
|
||||||
|
border-radius: 50%;
|
||||||
|
}
|
||||||
|
.productSort .conter .list .item .name {
|
||||||
|
font-size: 24rpx;
|
||||||
|
color: #333;
|
||||||
|
height: 56rpx;
|
||||||
|
line-height: 56rpx;
|
||||||
|
width: 120rpx;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
.page-footer {
|
||||||
|
position: fixed;
|
||||||
|
bottom: 0;
|
||||||
|
z-index: 30;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-around;
|
||||||
|
width: 100%;
|
||||||
|
height: calc(98rpx+ constant(safe-area-inset-bottom)); ///兼容 IOS<11.2/
|
||||||
|
height: calc(98rpx + env(safe-area-inset-bottom)); ///兼容 IOS>11.2/
|
||||||
|
box-sizing: border-box;
|
||||||
|
border-top: 1px solid #F3F3F3;
|
||||||
|
background-color: #fff;
|
||||||
|
box-shadow: 0px 0px 17rpx 1rpx rgba(206, 206, 206, 0.32);
|
||||||
|
padding-bottom: constant(safe-area-inset-bottom); ///兼容 IOS<11.2/
|
||||||
|
padding-bottom: env(safe-area-inset-bottom); ///兼容 IOS>11.2/
|
||||||
|
&.filter{
|
||||||
|
filter: blur(2rpx);
|
||||||
|
}
|
||||||
|
.foot-item {
|
||||||
|
display: flex;
|
||||||
|
width: max-content;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
flex-direction: column;
|
||||||
|
position: relative;
|
||||||
|
.count-num {
|
||||||
|
position: absolute;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
width: 40rpx;
|
||||||
|
height: 40rpx;
|
||||||
|
top: 0rpx;
|
||||||
|
right: -15rpx;
|
||||||
|
color: #fff;
|
||||||
|
font-size: 20rpx;
|
||||||
|
background-color: #FD502F;
|
||||||
|
border-radius: 50%;
|
||||||
|
padding: 4rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.foot-item image {
|
||||||
|
height: 50rpx;
|
||||||
|
width: 50rpx;
|
||||||
|
text-align: center;
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
.foot-item .txt {
|
||||||
|
font-size: 24rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
104
pages/goods_details/components/specs/index.vue
Normal file
104
pages/goods_details/components/specs/index.vue
Normal file
@ -0,0 +1,104 @@
|
|||||||
|
<template>
|
||||||
|
<!-- 产品参数 -->
|
||||||
|
<view>
|
||||||
|
<view class="specs" :class="specsInfo.show === true ? 'on' : ''">
|
||||||
|
<view class="title">商品参数<text class="iconfont icon-guanbi5" @click="closeSpecs"></text></view>
|
||||||
|
<view class="list">
|
||||||
|
<view class="item acea-row" v-for="(item,index) in specsInfo.params" :key="index">
|
||||||
|
<view class="name">{{item.name}}</view>
|
||||||
|
<view class="val">{{item.value}}</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="bnt" @click="closeSpecs">完成</view>
|
||||||
|
<slot name="bottom"></slot>
|
||||||
|
</view>
|
||||||
|
<view class="mask" @touchmove.prevent :hidden="specsInfo.show === false" @click="closeSpecs"></view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
props: {
|
||||||
|
specsInfo: {
|
||||||
|
type: Object,
|
||||||
|
default: () => {}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {};
|
||||||
|
},
|
||||||
|
mounted() {},
|
||||||
|
methods: {
|
||||||
|
closeSpecs(){
|
||||||
|
this.$emit('myevent');
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
.specs{
|
||||||
|
position: fixed;
|
||||||
|
bottom: 0;
|
||||||
|
width: 100%;
|
||||||
|
left: 0;
|
||||||
|
background-color: #fff;
|
||||||
|
z-index: 280;
|
||||||
|
border-radius: 16rpx 16rpx 0 0;
|
||||||
|
transform: translate3d(0, 100%, 0);
|
||||||
|
transition: all .3s cubic-bezier(.25, .5, .5, .9);
|
||||||
|
padding-bottom: 22rpx;
|
||||||
|
padding-bottom: calc(22rpx+ constant(safe-area-inset-bottom)); ///兼容 IOS<11.2/
|
||||||
|
padding-bottom: calc(22rpx + env(safe-area-inset-bottom)); ///兼容 IOS>11.2/
|
||||||
|
.title{
|
||||||
|
font-size: 32rpx;
|
||||||
|
color: #282828;
|
||||||
|
text-align: center;
|
||||||
|
margin: 38rpx 0 36rpx 0;
|
||||||
|
position: relative;
|
||||||
|
font-weight: bold;
|
||||||
|
.iconfont{
|
||||||
|
position: absolute;
|
||||||
|
right: 30rpx;
|
||||||
|
top:0;
|
||||||
|
font-size: 36rpx;
|
||||||
|
font-weight: normal;
|
||||||
|
color: #999999;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.list{
|
||||||
|
height: 750rpx;
|
||||||
|
margin: 0 30rpx;
|
||||||
|
color: #999999;
|
||||||
|
overflow-x: hidden;
|
||||||
|
overflow-y: auto;
|
||||||
|
.item{
|
||||||
|
padding: 30rpx 0;
|
||||||
|
border-bottom: 1px solid #eee;
|
||||||
|
.name{
|
||||||
|
width: 160rpx;
|
||||||
|
margin-right: 10rpx;
|
||||||
|
word-break: break-all;
|
||||||
|
}
|
||||||
|
.val{
|
||||||
|
width: 510rpx;
|
||||||
|
word-break: break-all;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.bnt{
|
||||||
|
width: 690rpx;
|
||||||
|
height: 86rpx;
|
||||||
|
text-align: center;
|
||||||
|
line-height: 86rpx;
|
||||||
|
border-radius: 43rpx;
|
||||||
|
background-color: var(--view-theme);
|
||||||
|
font-size: 30rpx;
|
||||||
|
color: #fff;
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.specs.on{
|
||||||
|
transform: translate3d(0, 0, 0);
|
||||||
|
}
|
||||||
|
</style>
|
||||||
595
pages/goods_details/discountsGoods.vue
Normal file
595
pages/goods_details/discountsGoods.vue
Normal file
@ -0,0 +1,595 @@
|
|||||||
|
<template>
|
||||||
|
<view :style="viewColor">
|
||||||
|
<view class="container" :class="popup.show==true?'on':''">
|
||||||
|
<view class="header">
|
||||||
|
<text class="title">优惠套餐({{discountsTotal}})</text>
|
||||||
|
<text class="iconfont icon-guanbi5" @tap.stop="closePopup"></text>
|
||||||
|
</view>
|
||||||
|
<view class="main_count">
|
||||||
|
<scroll-view scroll-y="true">
|
||||||
|
<view v-for="(item, index) in discountsData" :key="index" class="list">
|
||||||
|
<view class="acea-row list_title">
|
||||||
|
<view class="combo_list_name">
|
||||||
|
<image class="title_icon" src="/static/images/combo_title.png"></image>
|
||||||
|
<view class="name line1">套餐{{index+1}}: {{item.title}}</view>
|
||||||
|
</view>
|
||||||
|
<view class="combo_list_money">￥{{item.total_price}}</view>
|
||||||
|
</view>
|
||||||
|
<block v-for="(itemn, indexn) in item.discountsProduct" :key="indexn">
|
||||||
|
<view class="pro_list">
|
||||||
|
<view v-if="item.type == 1 && indexn!=0" class="checkbox" @tap.stop="checkedChange(item,itemn)">
|
||||||
|
<text v-if="itemn.checked" class="iconfont icon-xuanzhong1"></text>
|
||||||
|
<text v-else class="iconfont icon-weixuanzhong"></text>
|
||||||
|
</view>
|
||||||
|
<view v-if="item.type == 1 && indexn ==0" class="checkbox">
|
||||||
|
<text class="iconfont icon-xuanzhong3"></text>
|
||||||
|
</view>
|
||||||
|
<view class="picture">
|
||||||
|
<image :src="itemn.image" class="image"></image>
|
||||||
|
<text v-if="itemn.product_id == id" class="current_pro">当前商品</text>
|
||||||
|
</view>
|
||||||
|
<view class="info">
|
||||||
|
<view class="name line2">{{itemn.store_name}}</view>
|
||||||
|
<view class="list_attr" @click="selecAttr(index,indexn)">
|
||||||
|
<text class="line1">
|
||||||
|
{{itemn.attr || '默认'}}
|
||||||
|
</text>
|
||||||
|
<text class="iconfont icon-xiangxia"></text>
|
||||||
|
</view>
|
||||||
|
<view class="price">
|
||||||
|
<text>
|
||||||
|
￥{{itemn.product.price}}
|
||||||
|
</text>
|
||||||
|
<text class="ot_price">
|
||||||
|
￥{{itemn.product.ot_price}}
|
||||||
|
</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</block>
|
||||||
|
<view class="save_money">省: ¥ {{item.checked_save_money}}</view>
|
||||||
|
<view v-if="item.is_limit == 0 || (item.is_limit == 1 && item.limit_num > 0)" class="btn" @click="subData(index)">
|
||||||
|
购买此套餐{{item.checked_num}}件商品
|
||||||
|
</view>
|
||||||
|
<view v-else-if="item.is_limit == 1 && item.limit_num <= 0" class="btn disabled">
|
||||||
|
套餐已售罄
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</scroll-view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class='mask' catchtouchmove="true" :hidden='popup.show==false' @tap="closePopup"></view>
|
||||||
|
<productWindow :attr="attr" :isShow="1" :title="selectTitle" :iSplus="1" @myevent="onMyEvent"
|
||||||
|
@ChangeAttr="ChangeAttr" @attrVal="attrVal" @iptCartNum="iptCartNum" id="product-window" @goCat="goOrder()">
|
||||||
|
</productWindow>
|
||||||
|
</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 { goShopDetail } from '@/libs/order.js'
|
||||||
|
import { discountsCartAdd, getDiscountsLst } from '@/api/store.js';
|
||||||
|
import productWindow from './productWindow.vue'
|
||||||
|
import { mapGetters } from "vuex";
|
||||||
|
export default {
|
||||||
|
components: {
|
||||||
|
productWindow
|
||||||
|
},
|
||||||
|
props:{
|
||||||
|
uid: {
|
||||||
|
type: Number,
|
||||||
|
},
|
||||||
|
id: {
|
||||||
|
type: String|| Number,
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed: mapGetters(['viewColor']),
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
discountsData: [],
|
||||||
|
discountsTotal: 0,
|
||||||
|
popup: {
|
||||||
|
show: false
|
||||||
|
},
|
||||||
|
attr: {
|
||||||
|
cartAttr: false,
|
||||||
|
productAttr: [],
|
||||||
|
productSelect: {},
|
||||||
|
},
|
||||||
|
productValue: [], //系统属性
|
||||||
|
isOpen: false, //是否打开属性组件
|
||||||
|
attrValue: [],
|
||||||
|
attrTxt: "",
|
||||||
|
selectAttr: [],
|
||||||
|
selectValue: [], //选中的ID
|
||||||
|
proNum: 0,
|
||||||
|
images: [],
|
||||||
|
selectCountPrice: [],
|
||||||
|
selectTitle: "",
|
||||||
|
seleNum: 0,
|
||||||
|
isFirst: true,
|
||||||
|
seleIndexn: -1,
|
||||||
|
seleIndex: -1,
|
||||||
|
unique: "0"
|
||||||
|
};
|
||||||
|
},
|
||||||
|
mounted(){
|
||||||
|
this.$nextTick(function() {
|
||||||
|
|
||||||
|
})
|
||||||
|
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
// 点击关闭按钮
|
||||||
|
closePopup() {
|
||||||
|
this.$set(this.popup, 'show', false);
|
||||||
|
},
|
||||||
|
showPopup(id) {
|
||||||
|
this.id = id
|
||||||
|
this.$set(this.popup, 'show', true);
|
||||||
|
this.getList();
|
||||||
|
},
|
||||||
|
initAttr(){
|
||||||
|
this.discountsData.map((v, i) => {
|
||||||
|
this.getData(i)
|
||||||
|
})
|
||||||
|
},
|
||||||
|
getData(index){
|
||||||
|
this.discountsData[index].discountsProduct.forEach((item, i) => {
|
||||||
|
this.attr.productAttr = item.product.attr;
|
||||||
|
this.productValue = item.product.sku
|
||||||
|
this.DefaultSelect(index,i)
|
||||||
|
this.getPrice(this.discountsData[index])
|
||||||
|
})
|
||||||
|
},
|
||||||
|
/*获取套餐列表数据*/
|
||||||
|
getList(){
|
||||||
|
getDiscountsLst({product_id: this.id}).then(res => {
|
||||||
|
res.data.list.forEach((item, index) => {
|
||||||
|
item.total_price = 0;
|
||||||
|
item.checked_num = item.count;
|
||||||
|
item.checked_save_money = 0;
|
||||||
|
item.discountsProduct.forEach((v, i) => {
|
||||||
|
this.$set(v,'checked',true)
|
||||||
|
this.$set(v,'attr','')
|
||||||
|
this.$set(v,'unique','')
|
||||||
|
item.total_price += parseFloat(v.product.price)
|
||||||
|
item.checked_save_money += (parseFloat(v.product.ot_price) - parseFloat(v.product.price)).toFixed(2)
|
||||||
|
})
|
||||||
|
})
|
||||||
|
this.discountsTotal = res.data.count;
|
||||||
|
this.discountsData = res.data.list;
|
||||||
|
this.initAttr()
|
||||||
|
}).catch(err => {
|
||||||
|
|
||||||
|
});
|
||||||
|
},
|
||||||
|
/**
|
||||||
|
* 购物车手动填写
|
||||||
|
*
|
||||||
|
*/
|
||||||
|
iptCartNum: function(e) {
|
||||||
|
this.$set(this.attr.productSelect, 'cart_num', e);
|
||||||
|
},
|
||||||
|
/**
|
||||||
|
* 打开属性插件
|
||||||
|
*/
|
||||||
|
selecAttr: function(index, n) {
|
||||||
|
this.proNum = index
|
||||||
|
this.seleNum = n
|
||||||
|
this.selectTitle = this.discountsData[index].discountsProduct[n].product.store_name
|
||||||
|
this.attr.productAttr = this.discountsData[index].discountsProduct[n].product.attr
|
||||||
|
this.productValue = this.discountsData[index].discountsProduct[n].product.sku
|
||||||
|
if(this.isFirst || (!this.isFirst &&
|
||||||
|
(this.seleIndex != index && this.seleIndexn != n || this.seleIndex == index && this.seleIndexn != n || this.seleIndex != index && this.seleIndexn == n) || this.unique != this.attr.productSelect.unique)){
|
||||||
|
this.DefaultSelect(index,n)
|
||||||
|
}
|
||||||
|
this.seleIndex = index;this.seleIndexn = n
|
||||||
|
this.isFirst = false
|
||||||
|
|
||||||
|
this.$nextTick((e) => {
|
||||||
|
this.$set(this.attr, 'cartAttr', true);
|
||||||
|
this.$set(this, 'isOpen', true);
|
||||||
|
})
|
||||||
|
},
|
||||||
|
attrVal(val) {
|
||||||
|
this.$set(this.attr.productAttr[val.indexw], 'index', this.attr.productAttr[val.indexw]
|
||||||
|
.attr_values[val.indexn]);
|
||||||
|
},
|
||||||
|
/**
|
||||||
|
* 属性变动赋值
|
||||||
|
*
|
||||||
|
*/
|
||||||
|
ChangeAttr: function(res) {
|
||||||
|
let productSelect = this.productValue[res];
|
||||||
|
if (productSelect && productSelect.stock > 0) {
|
||||||
|
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, 'product_stock', productSelect.stock);
|
||||||
|
this.$set(this.attr.productSelect, 'unique', productSelect.unique);
|
||||||
|
this.$set(this, 'unique', productSelect.unique);
|
||||||
|
this.$set(this.attr.productSelect, 'cart_num', 1);
|
||||||
|
this.$set(this.discountsData[this.proNum].discountsProduct[this.seleNum], 'attr', res || "");
|
||||||
|
this.$set(this.discountsData[this.proNum].discountsProduct[this.seleNum]['product'], 'price', productSelect.price || 0);
|
||||||
|
this.$set(this.discountsData[this.proNum].discountsProduct[this.seleNum]['product'], 'ot_price', productSelect.ot_price || 0);
|
||||||
|
|
||||||
|
this.$set(this.discountsData[this.proNum].discountsProduct[this.seleNum], 'unique', productSelect.unique || "");
|
||||||
|
} else {
|
||||||
|
this.$set(this.attr.productSelect,"store_name",this.discountsData[0].discountsProduct[0].product.store_name
|
||||||
|
);
|
||||||
|
this.$set(this.attr.productSelect, "image", this.discountsData[0].discountsProduct[0].product.image);
|
||||||
|
this.$set(this.attr.productSelect, "price", this.discountsData[0].discountsProduct[0].product.price);
|
||||||
|
this.$set(this.attr.productSelect, "ot_price", this.discountsData[0].discountsProduct[0].product.ot_price);
|
||||||
|
this.$set(this.attr.productSelect, "product_stock", 0);
|
||||||
|
this.$set(this.attr.productSelect,"unique", "");
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
this.getPrice(this.discountsData[this.proNum])
|
||||||
|
},
|
||||||
|
|
||||||
|
/**
|
||||||
|
* 默认选中属性
|
||||||
|
*
|
||||||
|
*/
|
||||||
|
DefaultSelect: function(index,indexn) {
|
||||||
|
let productAttr = this.attr.productAttr;
|
||||||
|
let 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', productSelect.store_name);
|
||||||
|
this.$set(this.attr.productSelect, 'image', productSelect.image);
|
||||||
|
this.$set(this.attr.productSelect, 'price', productSelect.price);
|
||||||
|
this.$set(this.attr.productSelect, 'ot_price', productSelect.ot_price);
|
||||||
|
this.$set(this.attr.productSelect, 'stock', productSelect.stock);
|
||||||
|
this.$set(this.attr.productSelect, 'product_stock', productSelect.stock);
|
||||||
|
this.$set(this.attr.productSelect, 'unique', productSelect.unique);
|
||||||
|
this.$set(this, 'unique', productSelect.unique);
|
||||||
|
this.$set(this.attr.productSelect, 'cart_num', 1);
|
||||||
|
this.$set(this.attr.productSelect, 'vip_price', productSelect.vip_price);
|
||||||
|
this.$set(this.discountsData[index].discountsProduct[indexn], 'unique', productSelect.unique || "");
|
||||||
|
this.$set(this.discountsData[index].discountsProduct[indexn], 'attr', value.join(','));
|
||||||
|
this.$set(this.discountsData[index].discountsProduct[indexn]['product'], 'price', productSelect.price);
|
||||||
|
this.$set(this.discountsData[index].discountsProduct[indexn]['product'], 'ot_price', productSelect.ot_price);
|
||||||
|
this.$set(this.discountsData[index].discountsProduct[indexn]['product'], 'ot_price', productSelect.ot_price);
|
||||||
|
} else if (productSelect && !productAttr.length) {
|
||||||
|
this.$set(this.attr.productSelect, 'store_name', productSelect.store_name);
|
||||||
|
this.$set(this.attr.productSelect, 'image', productSelect.image);
|
||||||
|
this.$set(this.attr.productSelect, 'price', productSelect.price);
|
||||||
|
this.$set(this.attr.productSelect, 'ot_price', productSelect.ot_price);
|
||||||
|
this.$set(this.attr.productSelect, 'stock', productSelect.stock);
|
||||||
|
this.$set(this.attr.productSelect, 'product_stock', productSelect.stock);
|
||||||
|
this.$set(this.attr.productSelect, 'unique', productSelect.unique || '');
|
||||||
|
this.$set(this, 'unique', productSelect.unique);
|
||||||
|
this.$set(this.attr.productSelect, 'cart_num', 1);
|
||||||
|
this.$set(this.attr.productSelect, 'vip_price', productSelect.vip_price);
|
||||||
|
this.$set(this.discountsData[index].discountsProduct[indexn]['product'], 'price', productSelect.price);
|
||||||
|
this.$set(this.discountsData[index].discountsProduct[indexn]['product'], 'ot_price', productSelect.ot_price);
|
||||||
|
this.$set(this.discountsData[index].discountsProduct[indexn], 'attr', '')
|
||||||
|
this.$set(this.discountsData[index].discountsProduct[indexn], 'unique', productSelect.unique || "");
|
||||||
|
}else if (!productSelect && !productAttr.length || !productSelect && productAttr.length) {
|
||||||
|
this.$set(this.attr.productSelect,"store_name",this.discountsData[0].discountsProduct[0].product.store_name
|
||||||
|
);
|
||||||
|
this.$set(this.attr.productSelect, "image", this.discountsData[0].discountsProduct[0].product.image);
|
||||||
|
this.$set(this.attr.productSelect, "price", this.discountsData[0].discountsProduct[0].product.price);
|
||||||
|
this.$set(this.attr.productSelect, "ot_price", this.discountsData[0].discountsProduct[0].product.ot_price);
|
||||||
|
this.$set(this.attr.productSelect, "product_stock", 0);
|
||||||
|
this.$set(this.attr.productSelect,"unique", "");
|
||||||
|
this.$set(this, 'unique', "");
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onMyEvent: function() {
|
||||||
|
this.$set(this.attr, 'cartAttr', false);
|
||||||
|
this.$set(this, 'isOpen', false);
|
||||||
|
},
|
||||||
|
checkedChange(item,itemn) {
|
||||||
|
itemn.checked = !itemn.checked
|
||||||
|
if(itemn.checked){
|
||||||
|
item.checked_num++
|
||||||
|
}else{
|
||||||
|
item.checked_num--;
|
||||||
|
}
|
||||||
|
this.getPrice(item)
|
||||||
|
},
|
||||||
|
/*计算此套餐总价及节省价*/
|
||||||
|
getPrice(item){
|
||||||
|
let checked_save_money = 0;
|
||||||
|
let total_price = 0;
|
||||||
|
item.discountsProduct.forEach((v, i) => {
|
||||||
|
if(v.checked){
|
||||||
|
checked_save_money += (parseFloat(v.product.ot_price) - parseFloat(v.product.price));
|
||||||
|
total_price += parseFloat(v.product.price);
|
||||||
|
}
|
||||||
|
})
|
||||||
|
this.$set(item, 'checked_save_money', checked_save_money);
|
||||||
|
this.$set(item, 'total_price', total_price);
|
||||||
|
},
|
||||||
|
subData(index) {
|
||||||
|
let data = []
|
||||||
|
let reqData = {
|
||||||
|
is_new: 1,
|
||||||
|
discount_id: this.discountsData[index].discount_id,
|
||||||
|
data: [],
|
||||||
|
}
|
||||||
|
if (this.discountsData[index].type == 0) {
|
||||||
|
this.selectValue = []
|
||||||
|
this.discountsData[index].discountsProduct.map(v => {
|
||||||
|
this.selectValue.push(v.discount_product_id + '')
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
if (this.discountsData[index].checked_num < 2) {
|
||||||
|
return this.$util.Tips({
|
||||||
|
title: '请先选择套餐商品'
|
||||||
|
});
|
||||||
|
}
|
||||||
|
this.selectValue = []
|
||||||
|
this.discountsData[index].discountsProduct.map(v => {
|
||||||
|
if(v.checked){
|
||||||
|
this.selectValue.push(v.discount_product_id + '')
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
for (let i = 0; i < this.discountsData[index].discountsProduct.length; i++) {
|
||||||
|
for (let j = 0; j < this.selectValue.length; j++) {
|
||||||
|
if (this.discountsData[index].discountsProduct[i].discount_product_id == this.selectValue[j]) {
|
||||||
|
reqData.data.push({
|
||||||
|
cart_num: 1,
|
||||||
|
product_attr_unique: this.discountsData[index].discountsProduct[i].unique,
|
||||||
|
product_id: this.discountsData[index].discountsProduct[i].product_id
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
discountsCartAdd(reqData)
|
||||||
|
.then(function(res) {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: '/pages/users/order_confirm/index?cartId=' + res
|
||||||
|
.data
|
||||||
|
.cart_id
|
||||||
|
.join(',')
|
||||||
|
});
|
||||||
|
})
|
||||||
|
.catch(err => {
|
||||||
|
this.selectValue = []
|
||||||
|
return this.$util.Tips({
|
||||||
|
title: err
|
||||||
|
});
|
||||||
|
});
|
||||||
|
},
|
||||||
|
goOrder() {
|
||||||
|
this.$set(this, 'isOpen', false);
|
||||||
|
this.$set(this.attr, 'cartAttr', false);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.container{
|
||||||
|
position: fixed;
|
||||||
|
bottom: 0;
|
||||||
|
width: 100%;
|
||||||
|
left: 0;
|
||||||
|
background-color: #f5f5f5;
|
||||||
|
z-index: 300;
|
||||||
|
border-radius: 16rpx 16rpx 0 0;
|
||||||
|
transform: translate3d(0, 100%, 0);
|
||||||
|
transition: all .3s cubic-bezier(.25, .5, .5, .9);
|
||||||
|
max-height: 1000rpx;
|
||||||
|
&.on {
|
||||||
|
transform: translate3d(0, 0, 0);
|
||||||
|
}
|
||||||
|
.header{
|
||||||
|
position: relative;
|
||||||
|
padding: 36rpx 30rpx;
|
||||||
|
text-align: center;
|
||||||
|
|
||||||
|
.title{
|
||||||
|
color: #282828;
|
||||||
|
font-size: 32rpx;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
.iconfont{
|
||||||
|
color: #8A8A8A;
|
||||||
|
font-size: 28rpx;
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
right: 0;
|
||||||
|
}
|
||||||
|
.icon-guanbi5 {
|
||||||
|
right: 20rpx;
|
||||||
|
color: #8a8a8a;
|
||||||
|
font-size: 30rpx;
|
||||||
|
line-height: 30rpx;
|
||||||
|
top: 40rpx;
|
||||||
|
background-color: transparent;
|
||||||
|
font-weight: normal;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
scroll-view{
|
||||||
|
max-height: 1000rpx;
|
||||||
|
}
|
||||||
|
.main_count{
|
||||||
|
padding: 0 20rpx 30rpx;
|
||||||
|
max-height: 800rpx;
|
||||||
|
overflow-y: scroll;
|
||||||
|
.list{
|
||||||
|
margin-bottom: 20rpx;
|
||||||
|
background: #ffffff;
|
||||||
|
padding: 30rpx 20rpx;
|
||||||
|
.list_title{
|
||||||
|
color: #282828;
|
||||||
|
font-weight: bold;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
.combo_list_name{
|
||||||
|
font-size: 26rpx;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
.name{
|
||||||
|
max-width: 500rpx;
|
||||||
|
margin-left: 8rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.title_icon,uni-image,image{
|
||||||
|
width: 26rpx;
|
||||||
|
height:26rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.combo_list_money{
|
||||||
|
color: var(--view-priceColor);
|
||||||
|
font-size: 28rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&:last-child{
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
.btn{
|
||||||
|
width: 670rpx;
|
||||||
|
height: 60rpx;
|
||||||
|
line-height: 60rpx;
|
||||||
|
background-image: linear-gradient(270deg, var(--view-bntColor21) 0%, var(--view-bntColor22) 100%);
|
||||||
|
border-radius: 43px;
|
||||||
|
margin: 21rpx auto 0;
|
||||||
|
color: #ffffff;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 24rpx;
|
||||||
|
&.disabled{
|
||||||
|
cursor: not-allowed;
|
||||||
|
background:#bbb
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.save_money{
|
||||||
|
color: var(--view-priceColor);
|
||||||
|
font-size: 22rpx;
|
||||||
|
font-weight: bold;
|
||||||
|
text-align: center;
|
||||||
|
margin-top: 30rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.pro_list{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
padding: 30rpx 0;
|
||||||
|
border-bottom: 1px solid #EEEEEE;
|
||||||
|
&:last-child{
|
||||||
|
border-bottom: none;
|
||||||
|
}
|
||||||
|
.checkbox{
|
||||||
|
margin-right: 30rpx;
|
||||||
|
|
||||||
|
}
|
||||||
|
.icon-xuanzhong1{
|
||||||
|
color: var(--view-theme);
|
||||||
|
}
|
||||||
|
.icon-xuanzhong1,.icon-weixuanzhong{
|
||||||
|
font-size: 40rpx;
|
||||||
|
}
|
||||||
|
.icon-xuanzhong3{
|
||||||
|
color: var(--view-theme);
|
||||||
|
font-size: 18rpx;
|
||||||
|
width: 40rpx;
|
||||||
|
height: 40rpx;
|
||||||
|
border-radius: 100%;
|
||||||
|
background: var(--view-minorColor);
|
||||||
|
line-height: 40rpx;
|
||||||
|
}
|
||||||
|
.picture,.image,uni-image{
|
||||||
|
width: 180rpx;
|
||||||
|
height: 180rpx;
|
||||||
|
border-radius: 12rpx;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.current_pro{
|
||||||
|
background: linear-gradient(270deg, #F67A38 0%, #F11B09 100%);
|
||||||
|
border-radius: 12rpx 0px 12rpx 12rpx;
|
||||||
|
color: #fff;
|
||||||
|
line-height: 34rpx;
|
||||||
|
height: 34rpx;
|
||||||
|
font-size: 16rpx;
|
||||||
|
text-align: center;
|
||||||
|
position: absolute;
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100rpx;
|
||||||
|
}
|
||||||
|
.info{
|
||||||
|
margin-left: 30rpx;
|
||||||
|
position: relative;
|
||||||
|
.name{
|
||||||
|
color: #282828;
|
||||||
|
font-size: 24rpx;
|
||||||
|
line-height: 36rpx;
|
||||||
|
}
|
||||||
|
.price{
|
||||||
|
color: #282828;
|
||||||
|
font-weight: bold;
|
||||||
|
margin-top: 15rpx;
|
||||||
|
font-size: 20rpx;
|
||||||
|
font-weight: bold;
|
||||||
|
text{
|
||||||
|
font-size: 26rpx;
|
||||||
|
|
||||||
|
}
|
||||||
|
.ot_price{
|
||||||
|
font-weight: normal;
|
||||||
|
font-size: 20rpx;
|
||||||
|
color: #999;
|
||||||
|
text-decoration: line-through;
|
||||||
|
margin-left: 10rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
.list_attr{
|
||||||
|
max-width:390rpx;
|
||||||
|
height: 34rpx;
|
||||||
|
line-height: 34rpx;
|
||||||
|
font-size: 20rpx;
|
||||||
|
color: #666666;
|
||||||
|
border-radius: 18rpx;
|
||||||
|
background-color: #f5f5f5;
|
||||||
|
padding: 0 60rpx 0 20rpx;
|
||||||
|
margin-top: 15rpx;
|
||||||
|
position: relative;
|
||||||
|
.iconfont{
|
||||||
|
font-size: 12rpx;
|
||||||
|
position: absolute;
|
||||||
|
right: 20rpx;
|
||||||
|
top: 4rpx;
|
||||||
|
}
|
||||||
|
text{
|
||||||
|
display: inline-block;
|
||||||
|
max-width: 300rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
/deep/uni-checkbox .uni-checkbox-input{
|
||||||
|
width: 38rpx;
|
||||||
|
height: 38rpx;
|
||||||
|
border-radius: 100%;
|
||||||
|
margin-right: 30rpx;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
2528
pages/goods_details/index.vue
Normal file
2528
pages/goods_details/index.vue
Normal file
File diff suppressed because it is too large
Load Diff
361
pages/goods_details/productWindow.vue
Normal file
361
pages/goods_details/productWindow.vue
Normal file
@ -0,0 +1,361 @@
|
|||||||
|
<template>
|
||||||
|
<view :style="viewColor">
|
||||||
|
<view class="product-window"
|
||||||
|
:class="(attr.cartAttr === true ? 'on' : '') + ' ' + (iSbnt?'join':'') + ' ' + (iScart?'joinCart':'')">
|
||||||
|
<text class="iconfont icon-guanbi5" @click.stop="closeAttr"></text>
|
||||||
|
<view class="textpic acea-row row-between-wrapper">
|
||||||
|
<view class="pictrue">
|
||||||
|
<image :src="attr.productSelect.image" @click='getpreviewImage'></image>
|
||||||
|
</view>
|
||||||
|
<view class="text">
|
||||||
|
<view class="line1">
|
||||||
|
{{ title }}
|
||||||
|
</view>
|
||||||
|
<view class="money">
|
||||||
|
<view class="acea-row row-middle">
|
||||||
|
￥<text class="num">{{ attr.productSelect.price }}</text>
|
||||||
|
</view>
|
||||||
|
<text class="stock" v-if='isShow'>库存: {{ attr.productSelect.product_stock }}</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="rollTop">
|
||||||
|
<view class="productWinList">
|
||||||
|
<view class="item" v-for="(item, indexw) in attr.productAttr" :key="indexw">
|
||||||
|
<view class="title">{{ item.attr_name }}</view>
|
||||||
|
<view class="listn acea-row row-middle">
|
||||||
|
<view class="itemn" :class="item.index === itemn.attr ? 'on' : ''" v-for="(itemn, indexn) in item.attr_value"
|
||||||
|
@click="tapAttr(indexw, indexn)" :key="indexn">
|
||||||
|
{{ itemn.attr }}
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="joinBnt on"
|
||||||
|
v-if="!attr.productSelect || attr.productSelect.product_atock <=0">已售罄
|
||||||
|
</view>
|
||||||
|
<view class="joinBnt" v-if="attr.productSelect.product_stock" @click="goCat">确定</view>
|
||||||
|
<view class="joinBnt on" v-else-if="!attr.productSelect.product_stock">已售罄</view>
|
||||||
|
</view>
|
||||||
|
<view class="mask" @touchmove.prevent :hidden="attr.cartAttr === false" @click="closeAttr"></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 { mapGetters } from "vuex";
|
||||||
|
export default {
|
||||||
|
props: {
|
||||||
|
attr: {
|
||||||
|
type: Object,
|
||||||
|
default: () => {}
|
||||||
|
},
|
||||||
|
title: {
|
||||||
|
type: String
|
||||||
|
},
|
||||||
|
limitNum: {
|
||||||
|
type: Number,
|
||||||
|
value: 0
|
||||||
|
},
|
||||||
|
isShow: {
|
||||||
|
type: Number,
|
||||||
|
value: 0
|
||||||
|
},
|
||||||
|
iSbnt: {
|
||||||
|
type: Number,
|
||||||
|
value: 0
|
||||||
|
},
|
||||||
|
iSplus: {
|
||||||
|
type: Number,
|
||||||
|
value: 0
|
||||||
|
},
|
||||||
|
iScart: {
|
||||||
|
type: Number,
|
||||||
|
value: 0
|
||||||
|
},
|
||||||
|
is_vip: {
|
||||||
|
type: Number,
|
||||||
|
value: 0
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed: mapGetters(['viewColor']),
|
||||||
|
data() {
|
||||||
|
return {};
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
getpreviewImage: function() {
|
||||||
|
uni.previewImage({
|
||||||
|
urls: this.attr.productSelect.image.split(','),
|
||||||
|
current: this.attr.productSelect.image
|
||||||
|
});
|
||||||
|
},
|
||||||
|
goCat: function() {
|
||||||
|
this.$emit('goCat');
|
||||||
|
},
|
||||||
|
|
||||||
|
closeAttr: function() {
|
||||||
|
this.$emit('myevent');
|
||||||
|
},
|
||||||
|
|
||||||
|
tapAttr: function(indexw, indexn) {
|
||||||
|
let that = this;
|
||||||
|
that.$emit("attrVal", {
|
||||||
|
indexw: indexw,
|
||||||
|
indexn: indexn
|
||||||
|
});
|
||||||
|
this.$set(this.attr.productAttr[indexw], 'index', this.attr.productAttr[indexw].attr_values[indexn]);
|
||||||
|
let value = that
|
||||||
|
.getCheckedValue()
|
||||||
|
.join(",");
|
||||||
|
that.$emit("ChangeAttr", value);
|
||||||
|
|
||||||
|
},
|
||||||
|
//获取被选中属性；
|
||||||
|
getCheckedValue: function() {
|
||||||
|
let productAttr = this.attr.productAttr;
|
||||||
|
let value = [];
|
||||||
|
for (let i = 0; i < productAttr.length; i++) {
|
||||||
|
for (let j = 0; j < productAttr[i].attr_values.length; j++) {
|
||||||
|
if (productAttr[i].index === productAttr[i].attr_values[j]) {
|
||||||
|
value.push(productAttr[i].attr_values[j]);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return value;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
.vip-money {
|
||||||
|
color: #282828;
|
||||||
|
font-size: 28rpx;
|
||||||
|
font-weight: 700;
|
||||||
|
margin-left: 6rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.vipImg {
|
||||||
|
width: 68rpx;
|
||||||
|
height: 27rpx;
|
||||||
|
|
||||||
|
image {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-window {
|
||||||
|
position: fixed;
|
||||||
|
bottom: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 920rpx;
|
||||||
|
left: 0;
|
||||||
|
background-color: #fff;
|
||||||
|
z-index: 320;
|
||||||
|
border-radius: 16rpx 16rpx 0 0;
|
||||||
|
transform: translate3d(0, 100%, 0);
|
||||||
|
transition: all .3s cubic-bezier(.25, .5, .5, .9);
|
||||||
|
padding-bottom: 140rpx;
|
||||||
|
padding-bottom: calc(140rpx+ constant(safe-area-inset-bottom)); ///兼容 IOS<11.2/
|
||||||
|
padding-bottom: calc(140rpx + env(safe-area-inset-bottom)); ///兼容 IOS>11.2/
|
||||||
|
padding-bottom: calc(140rpx+ constant(safe-area-inset-bottom)); ///兼容 IOS<11.2/
|
||||||
|
padding-bottom: calc(140rpx + env(safe-area-inset-bottom)); ///兼容 IOS>11.2/
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-window.on {
|
||||||
|
transform: translate3d(0, 0, 0);
|
||||||
|
}
|
||||||
|
.product-window .icon-guanbi5{
|
||||||
|
position: absolute;
|
||||||
|
right: 20rpx;
|
||||||
|
color: #8a8a8a;
|
||||||
|
font-size: 30rpx;
|
||||||
|
line-height: 30rpx;
|
||||||
|
top: 20rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-window.join {
|
||||||
|
padding-bottom: 30rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-window.joinCart {
|
||||||
|
padding-bottom: 30rpx;
|
||||||
|
z-index: 10000;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-window .textpic {
|
||||||
|
padding: 0 130rpx 0 30rpx;
|
||||||
|
margin-top: 50rpx;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-window .textpic .pictrue {
|
||||||
|
width: 150rpx;
|
||||||
|
height: 150rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-window .textpic .pictrue image {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
border-radius: 10rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-window .textpic .text {
|
||||||
|
width: 410rpx;
|
||||||
|
font-size: 32rpx;
|
||||||
|
color: #202020;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-window .textpic .text .money {
|
||||||
|
font-size: 24rpx;
|
||||||
|
margin-top: 40rpx;
|
||||||
|
color: var(--view-priceColor);
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-window .textpic .text .money .num {
|
||||||
|
font-size: 36rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-window .textpic .text .money .stock {
|
||||||
|
color: #999;
|
||||||
|
margin-left: 6rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-window .textpic .iconfont {
|
||||||
|
position: absolute;
|
||||||
|
right: 30rpx;
|
||||||
|
top: -5rpx;
|
||||||
|
font-size: 35rpx;
|
||||||
|
color: #8a8a8a;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-window .rollTop {
|
||||||
|
max-height: 500rpx;
|
||||||
|
overflow: auto;
|
||||||
|
margin: 36rpx 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-window .productWinList .item~.item {
|
||||||
|
margin-top: 36rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-window .productWinList .item .title {
|
||||||
|
font-size: 30rpx;
|
||||||
|
color: #999;
|
||||||
|
padding: 0 30rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-window .productWinList .item .listn {
|
||||||
|
padding: 0 30rpx 0 16rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-window .productWinList .item .listn .itemn {
|
||||||
|
border: 1px solid #F2F2F2;
|
||||||
|
font-size: 26rpx;
|
||||||
|
color: #282828;
|
||||||
|
padding: 7rpx 33rpx;
|
||||||
|
border-radius: 25rpx;
|
||||||
|
margin: 20rpx 0 0 14rpx;
|
||||||
|
background-color: #F2F2F2;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-window .productWinList .item .listn .itemn.on {
|
||||||
|
color: var(--view-theme);
|
||||||
|
background: var(--view-minorColor);
|
||||||
|
border-color: var(--view-theme);
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-window .productWinList .item .listn .itemn.limit {
|
||||||
|
color: #999;
|
||||||
|
text-decoration: line-through;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-window .cart {
|
||||||
|
margin-top: 36rpx;
|
||||||
|
padding: 0 30rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-window .cart .title {
|
||||||
|
font-size: 30rpx;
|
||||||
|
color: #999;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-window .cart .carnum {
|
||||||
|
height: 54rpx;
|
||||||
|
margin-top: 24rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-window .cart .carnum .iconfont {
|
||||||
|
font-size: 25rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-window .cart .carnum view {
|
||||||
|
// border: 1px solid #a4a4a4;
|
||||||
|
width: 84rpx;
|
||||||
|
text-align: center;
|
||||||
|
height: 100%;
|
||||||
|
line-height: 54rpx;
|
||||||
|
color: #282828;
|
||||||
|
font-size: 45rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-window .cart .carnum .reduce {
|
||||||
|
border-right: 0;
|
||||||
|
border-radius: 6rpx 0 0 6rpx;
|
||||||
|
line-height: 48rpx;
|
||||||
|
font-size: 60rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-window .cart .carnum .reduce.on {
|
||||||
|
// border-color: #e3e3e3;
|
||||||
|
color: #DEDEDE;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-window .cart .carnum .plus {
|
||||||
|
border-left: 0;
|
||||||
|
border-radius: 0 6rpx 6rpx 0;
|
||||||
|
line-height: 46rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-window .cart .carnum .plus.on {
|
||||||
|
// border-color: #e3e3e3;
|
||||||
|
color: #dedede;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-window .cart .carnum .num {
|
||||||
|
background: rgba(242, 242, 242, 1);
|
||||||
|
color: #282828;
|
||||||
|
font-size: 28rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-window .joinBnt {
|
||||||
|
font-size: 30rpx;
|
||||||
|
width: 620rpx;
|
||||||
|
height: 86rpx;
|
||||||
|
border-radius: 50rpx;
|
||||||
|
text-align: center;
|
||||||
|
line-height: 86rpx;
|
||||||
|
color: #fff;
|
||||||
|
position: absolute;
|
||||||
|
bottom: 30rpx;
|
||||||
|
left: 65rpx;
|
||||||
|
background-image: linear-gradient(270deg, var(--view-bntColor21) 0%, var(--view-bntColor22) 100%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.product-window .joinBnt.on {
|
||||||
|
background-color: #bbb;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
347
pages/guide/guide.vue
Normal file
347
pages/guide/guide.vue
Normal file
@ -0,0 +1,347 @@
|
|||||||
|
<template>
|
||||||
|
<view>
|
||||||
|
<view class="swiper-css zqui-rel" :style="{ height: hpx }">
|
||||||
|
<swiper class="swiper" :style="{ height: hpx }" :indicator-dots="indicatorDots" :autoplay="autoplay"
|
||||||
|
disable-touch='true' :interval="interval" :duration="duration" @change="guideAction">
|
||||||
|
<swiper-item v-for="(item, index) in imageList" :key="index" catchtouchmove="stopChange">
|
||||||
|
<image class="image-size" mode="widthFix" :src="item.src" />
|
||||||
|
</swiper-item>
|
||||||
|
</swiper>
|
||||||
|
|
||||||
|
<!-- 按钮样式切换 -->
|
||||||
|
<template v-if="cur != 2">
|
||||||
|
<view class=" flex-column dots">
|
||||||
|
<block v-for="(item,index) in imageList" :key="index">
|
||||||
|
<view class="dot" :class="{'active': index == cur}"></view>
|
||||||
|
</block>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<!-- 第三张图使用按钮《立即进入》 -->
|
||||||
|
<template v-if="cur == 1">
|
||||||
|
<button class="flex-column cu-btn footer" @click="launchApp">立即体验</button>
|
||||||
|
</template>
|
||||||
|
<!-- 右上角跳过按钮 -->
|
||||||
|
<view class="btn-box" @click="launchApp"><text class="passbtn">{{num}}跳过</text></view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
const animation = weex.requireModule('animation');
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
//修改图片,文字描述
|
||||||
|
imageList: [{
|
||||||
|
|
||||||
|
src: '/static/images/guide.png'
|
||||||
|
}
|
||||||
|
|
||||||
|
],
|
||||||
|
indicatorDots: false,
|
||||||
|
autoplay: false,
|
||||||
|
interval: 10000,
|
||||||
|
duration: 500,
|
||||||
|
iStatusBarHeight: '0px',
|
||||||
|
hpx: '100%',
|
||||||
|
cur: 0,
|
||||||
|
dotsStyles: '',
|
||||||
|
num: 3
|
||||||
|
};
|
||||||
|
},
|
||||||
|
onLoad() {
|
||||||
|
let that = this;
|
||||||
|
plus.navigator.closeSplashscreen();
|
||||||
|
uni.getSystemInfo({
|
||||||
|
success: function(res) {
|
||||||
|
that.hpx = res.windowHeight + 'px';
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
onReady() {
|
||||||
|
// this.move(0, 1);
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
|
||||||
|
this.countDown()
|
||||||
|
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
countDown() {
|
||||||
|
let {
|
||||||
|
num
|
||||||
|
} = this;
|
||||||
|
// if (num === 3) this.nums = true;
|
||||||
|
num = num > 0 ? num - 1 : "GO";
|
||||||
|
setTimeout(() => {
|
||||||
|
this.num = num;
|
||||||
|
if (num == 'GO') {
|
||||||
|
this.launchApp()
|
||||||
|
return
|
||||||
|
}
|
||||||
|
this.countDown();
|
||||||
|
}, 1000);
|
||||||
|
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
stopTouchMove: function() {
|
||||||
|
return false;
|
||||||
|
},
|
||||||
|
|
||||||
|
launchApp() {
|
||||||
|
|
||||||
|
//跳过引导页,储存本地值,下次进入直接跳过
|
||||||
|
uni.setStorage({
|
||||||
|
key: 'launchFlag',
|
||||||
|
data: true,
|
||||||
|
success() {
|
||||||
|
|
||||||
|
uni.switchTab({
|
||||||
|
url: '/pages/index/index'
|
||||||
|
})
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
guideAction(event) {
|
||||||
|
let that = this,
|
||||||
|
index = event.detail.current;
|
||||||
|
that.cur = index;
|
||||||
|
// if (index == 0) {
|
||||||
|
// that.move(0, 1);
|
||||||
|
// that.moveTwo(150, 0.1);
|
||||||
|
// that.moveThree(150, 0.1);
|
||||||
|
// that.lefMainAction(0);
|
||||||
|
// }
|
||||||
|
// if (index == 1) {
|
||||||
|
// that.moveTwo(0, 1);
|
||||||
|
// that.move(150, 0.1);
|
||||||
|
// that.moveThree(150, 0.1);
|
||||||
|
// that.lefMainAction(uni.upx2px(80) + 'px');
|
||||||
|
// }
|
||||||
|
// if (index == 2) {
|
||||||
|
// that.moveThree(0, 1);
|
||||||
|
// that.moveTwo(150, 0.1);
|
||||||
|
// that.move(150, 0.1);
|
||||||
|
// that.lefMainAction(uni.upx2px(160) + 'px');
|
||||||
|
// }
|
||||||
|
},
|
||||||
|
lefMainAction(mum) {
|
||||||
|
var testLM = this.$refs.lefMain;
|
||||||
|
animation.transition(
|
||||||
|
testLM, {
|
||||||
|
styles: {
|
||||||
|
transform: 'translate(' + mum + ',0px)'
|
||||||
|
},
|
||||||
|
duration: 400, //ms
|
||||||
|
timingFunction: 'ease',
|
||||||
|
delay: 0 //ms
|
||||||
|
},
|
||||||
|
function() {}
|
||||||
|
);
|
||||||
|
},
|
||||||
|
move(tran, opa) {
|
||||||
|
var testEl = this.$refs.box1;
|
||||||
|
animation.transition(
|
||||||
|
testEl, {
|
||||||
|
styles: {
|
||||||
|
transform: 'translate(' + tran + 'px,0px)',
|
||||||
|
transformOrigin: 'center center',
|
||||||
|
opacity: opa
|
||||||
|
},
|
||||||
|
duration: 800, //ms
|
||||||
|
timingFunction: 'ease',
|
||||||
|
delay: 0 //ms
|
||||||
|
},
|
||||||
|
function() {}
|
||||||
|
);
|
||||||
|
var textE2 = this.$refs.box2;
|
||||||
|
animation.transition(
|
||||||
|
textE2, {
|
||||||
|
styles: {
|
||||||
|
transform: 'translate(0px,' + tran + 'px) scale(' + opa + ')',
|
||||||
|
transformOrigin: 'center center',
|
||||||
|
opacity: opa
|
||||||
|
},
|
||||||
|
duration: 800, //ms
|
||||||
|
timingFunction: 'ease',
|
||||||
|
delay: 0 //ms
|
||||||
|
},
|
||||||
|
function() {}
|
||||||
|
);
|
||||||
|
},
|
||||||
|
moveTwo(tran, opa) {
|
||||||
|
var testEl = this.$refs.box3;
|
||||||
|
animation.transition(
|
||||||
|
testEl, {
|
||||||
|
styles: {
|
||||||
|
transform: 'translate(' + tran + 'px,0px)',
|
||||||
|
transformOrigin: 'center center',
|
||||||
|
opacity: opa
|
||||||
|
},
|
||||||
|
duration: 800, //ms
|
||||||
|
timingFunction: 'ease',
|
||||||
|
delay: 0 //ms
|
||||||
|
},
|
||||||
|
function() {}
|
||||||
|
);
|
||||||
|
var textE2 = this.$refs.box4;
|
||||||
|
animation.transition(
|
||||||
|
textE2, {
|
||||||
|
styles: {
|
||||||
|
transform: 'translate(0px,' + tran + 'px) scale(' + opa + ')',
|
||||||
|
transformOrigin: 'center center',
|
||||||
|
opacity: opa
|
||||||
|
},
|
||||||
|
duration: 800, //ms
|
||||||
|
timingFunction: 'ease',
|
||||||
|
delay: 0 //ms
|
||||||
|
},
|
||||||
|
function() {}
|
||||||
|
);
|
||||||
|
},
|
||||||
|
moveThree(tran, opa) {
|
||||||
|
var testEl = this.$refs.box5;
|
||||||
|
animation.transition(
|
||||||
|
testEl, {
|
||||||
|
styles: {
|
||||||
|
transform: 'translate(' + tran + 'px,0px)',
|
||||||
|
transformOrigin: 'center center',
|
||||||
|
opacity: opa
|
||||||
|
},
|
||||||
|
duration: 800, //ms
|
||||||
|
timingFunction: 'ease',
|
||||||
|
delay: 0 //ms
|
||||||
|
},
|
||||||
|
function() {}
|
||||||
|
);
|
||||||
|
var textE2 = this.$refs.box6;
|
||||||
|
animation.transition(
|
||||||
|
textE2, {
|
||||||
|
styles: {
|
||||||
|
transform: 'translate(0px,' + tran + 'px) scale(' + opa + ')',
|
||||||
|
transformOrigin: 'center center',
|
||||||
|
opacity: opa
|
||||||
|
},
|
||||||
|
duration: 800, //ms
|
||||||
|
timingFunction: 'ease',
|
||||||
|
delay: 0 //ms
|
||||||
|
},
|
||||||
|
function() {}
|
||||||
|
);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
page {
|
||||||
|
|
||||||
|
min-height: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.guide {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
.image-size {
|
||||||
|
width: 750rpx;
|
||||||
|
height: 100%;
|
||||||
|
border: 1px solid red;
|
||||||
|
}
|
||||||
|
|
||||||
|
.title-box {
|
||||||
|
padding: 250rpx 0 120rpx 64rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.guide-title {
|
||||||
|
font-size: 48rpx;
|
||||||
|
font-weight: bold;
|
||||||
|
color: rgba(58, 61, 68, 1);
|
||||||
|
}
|
||||||
|
|
||||||
|
.guide-subtitle {
|
||||||
|
margin-top: 20rpx;
|
||||||
|
font-size: 35rpx;
|
||||||
|
color: rgba(131, 136, 146, 1);
|
||||||
|
line-height: 50rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.footer {
|
||||||
|
width: 231rpx;
|
||||||
|
height: 80rpx;
|
||||||
|
text-align: center;
|
||||||
|
position: fixed;
|
||||||
|
bottom: 116rpx;
|
||||||
|
left: 37%;
|
||||||
|
font-size: 30rpx;
|
||||||
|
color: #FFFFFF;
|
||||||
|
background-color: #2B9939;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn-box {
|
||||||
|
position: absolute;
|
||||||
|
z-index: 999;
|
||||||
|
right: 40rpx;
|
||||||
|
top: 120rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dots {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
position: absolute;
|
||||||
|
z-index: 999;
|
||||||
|
height: 151rpx;
|
||||||
|
left: 0;
|
||||||
|
right: 0;
|
||||||
|
bottom: 20rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.passbtn {
|
||||||
|
color: #ffffff;
|
||||||
|
text-align: center;
|
||||||
|
border-width: 1rpx;
|
||||||
|
border-color: rgba(255, 255, 255, 0.5);
|
||||||
|
border-style: solid;
|
||||||
|
border-radius: 30rpx;
|
||||||
|
font-size: 28rpx;
|
||||||
|
padding-top: 10rpx;
|
||||||
|
padding-bottom: 10rpx;
|
||||||
|
padding-left: 25rpx;
|
||||||
|
padding-right: 25rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dot {
|
||||||
|
margin: 0 4rpx;
|
||||||
|
width: 15rpx;
|
||||||
|
height: 15rpx;
|
||||||
|
background: #CDD2DD;
|
||||||
|
border-radius: 8rpx;
|
||||||
|
transition: all .6s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.dot.active {
|
||||||
|
width: 40rpx;
|
||||||
|
background: #838892 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 相对定位 */
|
||||||
|
.zqui-rel {
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.swiper-css {
|
||||||
|
width: 750rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.swiper-item {
|
||||||
|
width: 750rpx;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
34
pages/guide/judge.vue
Normal file
34
pages/guide/judge.vue
Normal file
@ -0,0 +1,34 @@
|
|||||||
|
<template>
|
||||||
|
<view class="content"></view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
onLoad() {
|
||||||
|
this.checkGuide();
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
checkGuide() {
|
||||||
|
console.log("进入checkGuide判断页");
|
||||||
|
// 思路： 检测是否有启动缓存，如果没有，就是第一次启动，第一次启动就去 启动介绍页面
|
||||||
|
try {
|
||||||
|
var launchFlag = uni.getStorageSync('launchFlag');
|
||||||
|
// console.log("launchFlag:" + launchFlag);
|
||||||
|
if (launchFlag) { //判断本地缓存跳转首页
|
||||||
|
|
||||||
|
uni.switchTab({
|
||||||
|
url:'/pages/index/index'
|
||||||
|
})
|
||||||
|
} else { //没有缓存进入启动页引导页
|
||||||
|
console.log('去引导页');
|
||||||
|
uni.redirectTo({
|
||||||
|
url: '/pages/guide/guide'
|
||||||
|
});
|
||||||
|
}
|
||||||
|
} catch (e) {
|
||||||
|
console.log(e.message);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
</script>
|
||||||
377
pages/home/index.vue
Normal file
377
pages/home/index.vue
Normal file
@ -0,0 +1,377 @@
|
|||||||
|
<template>
|
||||||
|
<view class="Circle_friends">
|
||||||
|
<view class="circle_friends_wrapper">
|
||||||
|
|
||||||
|
<zbpSwiper></zbpSwiper>
|
||||||
|
|
||||||
|
<view class="tabs_wrapper">
|
||||||
|
<u-tabs :list="tabsData.list" @click="tabsChange" lineColor="#F84221" keyName="cate_name"></u-tabs>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="goods">
|
||||||
|
<block v-for="(item,index) in cateGoods" :key="index">
|
||||||
|
<view class="goods_item" @click="gogogo(item)">
|
||||||
|
<image class="goods_img" :src="item.image[0]" mode="aspectFit"></image>
|
||||||
|
<view class="botm">
|
||||||
|
<view class="title">{{item.title}}</view>
|
||||||
|
<view class="goods_info flex_a_c">
|
||||||
|
<view class="l_info flex_a_c">
|
||||||
|
<image :src="(item.author && item.author.avatar) || '/static/images/f.png'"
|
||||||
|
mode="aspectFit" class="g_img"></image>
|
||||||
|
<view class="g_name">{{item.author && item.author.nickname}}</view>
|
||||||
|
</view>
|
||||||
|
<view class="nice_box" @click.stop="giveStart(item)">
|
||||||
|
<text class="iconfont"
|
||||||
|
:class="item.relevance_id ? 'icon-shoucang1' : 'icon-dianzan'"></text>
|
||||||
|
<text class="collect">{{item.count_start}}</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</block>
|
||||||
|
</view>
|
||||||
|
<view class="empty_wrapper" v-if="emptyShow">
|
||||||
|
<u-empty :show="emptyShow" mode="list" icon="http://cdn.uviewui.com/uview/empty/list.png"></u-empty>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<u-picker :defaultIndex="[0,0]" :show="showPicker" ref="uPicker" :columns="columnData" @confirm="confirm"
|
||||||
|
@cancel="showPicker = false" @change="changeHandler" keyName="name"></u-picker>
|
||||||
|
|
||||||
|
<!-- <view class="bg_color"></view> -->
|
||||||
|
|
||||||
|
<!-- <m-tabbar native>
|
||||||
|
<template v-slot:tabbar_index_2>
|
||||||
|
<view class="custom_style">
|
||||||
|
<view class="custom_style_icon"></view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
</m-tabbar> -->
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import mTabbar from '@/components/m-tabbar/m-tabbar.vue'
|
||||||
|
import zbpSwiper from '@/components/zbpSwiper'
|
||||||
|
import {
|
||||||
|
getSlideAPI
|
||||||
|
} from '@/api/lihai.js'
|
||||||
|
import {
|
||||||
|
graphicLstApi,
|
||||||
|
getTopicList,
|
||||||
|
graphicStartApi
|
||||||
|
} from '@/api/community.js'
|
||||||
|
import {
|
||||||
|
getIndexData,
|
||||||
|
getDiy
|
||||||
|
} from '@/api/api.js'
|
||||||
|
import {
|
||||||
|
getGeocoder,
|
||||||
|
merClassifly
|
||||||
|
} from '@/api/store.js';
|
||||||
|
import {
|
||||||
|
getArea,
|
||||||
|
getStreet
|
||||||
|
} from '@/api/article.js';
|
||||||
|
import {
|
||||||
|
Toast
|
||||||
|
} from '@/libs/uniApi'
|
||||||
|
export default {
|
||||||
|
components: {
|
||||||
|
mTabbar,
|
||||||
|
zbpSwiper
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
bgColor: '',
|
||||||
|
showPicker: false,
|
||||||
|
columnData: [],
|
||||||
|
show: false,
|
||||||
|
swiper: {
|
||||||
|
url: [{
|
||||||
|
img: ''
|
||||||
|
}],
|
||||||
|
indicatorDots: true, // 显示面板指示点
|
||||||
|
vertical: false, // 滑动方向是否为纵向
|
||||||
|
autoplay: true, // 是否自动切换
|
||||||
|
interval: 2000, // 自动切换时间间隔
|
||||||
|
duration: 500 // 滑动动画时长
|
||||||
|
},
|
||||||
|
tabsData: {
|
||||||
|
list: [],
|
||||||
|
tabsActive: 0
|
||||||
|
},
|
||||||
|
where: {
|
||||||
|
category_id: 0,
|
||||||
|
page: 1,
|
||||||
|
limit: 30
|
||||||
|
},
|
||||||
|
currentItemId: 69, // 默认获取 社区的数据 0 表示推荐 || 69 社区
|
||||||
|
keyword: '',
|
||||||
|
location: '',
|
||||||
|
emptyShow: false,
|
||||||
|
street: '',
|
||||||
|
cateGoods: []
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onPullDownRefresh() {
|
||||||
|
this.getCateList()
|
||||||
|
this.getGoods()
|
||||||
|
this.selfLocation()
|
||||||
|
this.Area()
|
||||||
|
uni.stopPullDownRefresh()
|
||||||
|
},
|
||||||
|
onLoad() {
|
||||||
|
this.getCateList()
|
||||||
|
this.getGoods()
|
||||||
|
this.selfLocation()
|
||||||
|
this.Area()
|
||||||
|
},
|
||||||
|
onShow() {},
|
||||||
|
methods: {
|
||||||
|
confirm(e) {
|
||||||
|
this.where.street_id = e.value[1].code
|
||||||
|
this.showPicker = false
|
||||||
|
},
|
||||||
|
|
||||||
|
changeHandler(e) {
|
||||||
|
const {
|
||||||
|
columnIndex,
|
||||||
|
value,
|
||||||
|
values,
|
||||||
|
index,
|
||||||
|
picker = this.$refs.uPicker
|
||||||
|
} = e;
|
||||||
|
if (columnIndex === 0) {
|
||||||
|
getStreet({
|
||||||
|
area_code: value[0]['code']
|
||||||
|
}).then(res => {
|
||||||
|
this.$refs.uPicker.setColumnValues(1, res.data);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
},
|
||||||
|
Area() {
|
||||||
|
getArea({
|
||||||
|
city_code: 510500
|
||||||
|
}).then(res => {
|
||||||
|
this.$refs.uPicker.setColumnValues(0, res.data);
|
||||||
|
this.Street(res.data[0]['code']);
|
||||||
|
});
|
||||||
|
},
|
||||||
|
Street(code) {
|
||||||
|
getStreet({
|
||||||
|
area_code: code
|
||||||
|
}).then(res => {
|
||||||
|
this.$refs.uPicker.setColumnValues(1, res.data);
|
||||||
|
});
|
||||||
|
},
|
||||||
|
gogogo(item) {
|
||||||
|
if (this.tabsData.tabsActive == 1) {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: `/pages/short_video/appSwiper/index?id=${this.cateGoods[0].community_id}`
|
||||||
|
})
|
||||||
|
|
||||||
|
} else {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: '/pages/plantGrass/plant_detail/index?id=' + item.community_id
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
giveStart(item) {
|
||||||
|
let status = item.relevance_id ? 0 : 1
|
||||||
|
graphicStartApi(item.community_id, {
|
||||||
|
status: status
|
||||||
|
}).then(res => {
|
||||||
|
Toast(res.message)
|
||||||
|
this.getGoods()
|
||||||
|
})
|
||||||
|
},
|
||||||
|
dianji() {
|
||||||
|
this.show = !this.show
|
||||||
|
},
|
||||||
|
// 获取发现商品
|
||||||
|
getGoods: function() {
|
||||||
|
// 数据写死：默认社区数据 category_id=69&page=1&limit=30
|
||||||
|
graphicLstApi(this.where).then(res => {
|
||||||
|
this.cateGoods = res.data.list
|
||||||
|
res.data.list.length <= 0 ? this.emptyShow = true : this.emptyShow = false
|
||||||
|
})
|
||||||
|
},
|
||||||
|
/*获取分类列表*/
|
||||||
|
async getCateList() {
|
||||||
|
const {
|
||||||
|
data
|
||||||
|
} = await getTopicList()
|
||||||
|
this.tabsData.list = [{
|
||||||
|
cate_name: "推荐",
|
||||||
|
category_id: 0
|
||||||
|
}, {
|
||||||
|
cate_name: "视频",
|
||||||
|
category_id: -1,
|
||||||
|
children: []
|
||||||
|
}, ...data]
|
||||||
|
},
|
||||||
|
tabsChange(item) {
|
||||||
|
this.where.category_id = item.category_id
|
||||||
|
this.getGoods()
|
||||||
|
this.street_id = item.id
|
||||||
|
this.tabsData.tabsActive = item.index
|
||||||
|
if (item.index == 1) {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: `/pages/short_video/appSwiper/index?id=${this.cateGoods[0].community_id}`
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
selfLocation() {
|
||||||
|
uni.getLocation({
|
||||||
|
type: 'gcj02',
|
||||||
|
success: (res) => {
|
||||||
|
let latitude, longitude;
|
||||||
|
latitude = res.latitude.toString();
|
||||||
|
longitude = res.longitude.toString();
|
||||||
|
getGeocoder({
|
||||||
|
lat: latitude,
|
||||||
|
long: longitude
|
||||||
|
}).then(res => {
|
||||||
|
this.$store.commit('setLocation', res.data)
|
||||||
|
this.street = res.data.address_component.street
|
||||||
|
}).catch(err => {
|
||||||
|
uni.showToast({
|
||||||
|
title: err,
|
||||||
|
icon: 'none'
|
||||||
|
})
|
||||||
|
})
|
||||||
|
},
|
||||||
|
fail: (err) => {
|
||||||
|
uni.showToast({
|
||||||
|
title: err.errMsg,
|
||||||
|
icon: 'none',
|
||||||
|
duration: 1000
|
||||||
|
});
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
page {
|
||||||
|
// background: linear-gradient(180deg, #FFFFFF 0%, #F6F6F6 100%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.Circle_friends {
|
||||||
|
position: relative;
|
||||||
|
padding: 0 0 87.72rpx 0;
|
||||||
|
background: linear-gradient(180deg, #FFFFFF 0%, #F6F6F6 100%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.circle_friends_wrapper {
|
||||||
|
position: relative;
|
||||||
|
z-index: 2;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.search_wrapper {
|
||||||
|
width: 694.74rpx;
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tabs_wrapper {
|
||||||
|
width: 694.74rpx;
|
||||||
|
margin: 0 auto;
|
||||||
|
margin-bottom: 21.05rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.empty_wrapper {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.goods {
|
||||||
|
margin: 0 auto;
|
||||||
|
width: 694.74rpx;
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
justify-content: space-between;
|
||||||
|
|
||||||
|
.goods_item {
|
||||||
|
width: 342.11rpx;
|
||||||
|
height: 491.23rpx;
|
||||||
|
border-radius: 8px;
|
||||||
|
overflow: hidden;
|
||||||
|
background-color: #fff;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
margin-bottom: 10.53rpx;
|
||||||
|
|
||||||
|
.goods_img {
|
||||||
|
width: 100%;
|
||||||
|
height: 294.74rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.botm {
|
||||||
|
flex: 1;
|
||||||
|
padding: 0 14.04rpx;
|
||||||
|
padding-bottom: 21.05rpx;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: space-between;
|
||||||
|
|
||||||
|
.title {
|
||||||
|
margin: 12px 0;
|
||||||
|
width: 100%;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
display: -webkit-box;
|
||||||
|
-webkit-line-clamp: 2;
|
||||||
|
-webkit-box-orient: vertical;
|
||||||
|
}
|
||||||
|
|
||||||
|
.goods_info {
|
||||||
|
justify-content: space-between;
|
||||||
|
|
||||||
|
.g_img {
|
||||||
|
width: 60rpx;
|
||||||
|
height: 60rpx;
|
||||||
|
border-radius: 50%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.g_name {
|
||||||
|
margin-left: 8.77rpx;
|
||||||
|
width: 100.63rpx;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
/* 溢出显示省略号 */
|
||||||
|
overflow: hidden;
|
||||||
|
/* 溢出隐藏 */
|
||||||
|
white-space: nowrap;
|
||||||
|
/* 强制不换行 */
|
||||||
|
}
|
||||||
|
|
||||||
|
.nice_box {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.isshow {
|
||||||
|
color: #FE3530 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.iconfont {
|
||||||
|
font-size: 30rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-shoucang1 {
|
||||||
|
color: #F84221;
|
||||||
|
}
|
||||||
|
|
||||||
|
.collect {
|
||||||
|
font-size: 24rpx;
|
||||||
|
margin-left: 5rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
160
pages/index/component/activeParty.vue
Normal file
160
pages/index/component/activeParty.vue
Normal file
@ -0,0 +1,160 @@
|
|||||||
|
<template>
|
||||||
|
<view class="hot-img" :style="'margin-top:' + mbConfig +'rpx;background-color:' + boxColor+';'" v-if="explosiveMoney.length">
|
||||||
|
<!--单行展示-->
|
||||||
|
<block v-if="tabConfig == 0">
|
||||||
|
<view class="item skeleton-rect" v-for="(item, index) in explosiveMoney" :key="index" @click="goDetail(item)">
|
||||||
|
<view class="title area-row">{{ item.info[0].value }}</view>
|
||||||
|
<view class="msg area-row line1">{{ item.info[1].value }}</view>
|
||||||
|
<view class="img">
|
||||||
|
<easy-loadimage mode="widthFix" :image-src="item.img"></easy-loadimage>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</block>
|
||||||
|
<!--多行展示-->
|
||||||
|
<block v-if="tabConfig == 1">
|
||||||
|
<view class="bd">
|
||||||
|
<view class="item skeleton-rect" v-for="(item, index) in explosiveMoney" :key="index" @click="goDetail(item)">
|
||||||
|
<view class="left">
|
||||||
|
<view class="title area-row">{{ item.info[0].value }}</view>
|
||||||
|
<view class="msg area-row">{{ item.info[1].value }}</view>
|
||||||
|
</view>
|
||||||
|
<view class="img">
|
||||||
|
<easy-loadimage mode="widthFix" :image-src="item.img"></easy-loadimage>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</block>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
import {merPath} from "@/utils/index"
|
||||||
|
export default {
|
||||||
|
name: 'activeParty',
|
||||||
|
props: {
|
||||||
|
dataConfig: {
|
||||||
|
type: Object,
|
||||||
|
default: () => {}
|
||||||
|
},
|
||||||
|
merId: {
|
||||||
|
type: String || Number,
|
||||||
|
default: ''
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
explosiveMoney: this.dataConfig.menuConfig.list,
|
||||||
|
themeColor: this.dataConfig.themeColor.color[0].item,
|
||||||
|
bgColor: this.dataConfig.bgColor.color,
|
||||||
|
mbConfig: this.dataConfig.mbConfig.val*2,
|
||||||
|
boxColor: this.dataConfig.boxColor.color[0].item,
|
||||||
|
tabConfig: this.dataConfig.tabConfig.tabVal, //展示样式
|
||||||
|
};
|
||||||
|
},
|
||||||
|
created() {},
|
||||||
|
methods: {
|
||||||
|
goDetail(url){
|
||||||
|
let urls = url.info[2].value
|
||||||
|
urls = merPath(urls, this.merId)
|
||||||
|
// console.log(urls,'urls');
|
||||||
|
if(urls.indexOf("http") != -1){
|
||||||
|
// #ifdef H5
|
||||||
|
location.href = urls
|
||||||
|
// #endif
|
||||||
|
}else{
|
||||||
|
if(['/pages/goods_cate/goods_cate','/pages/order_addcart/order_addcart','/pages/user/index','/pages/plant_grass/index'].indexOf(urls) == -1){
|
||||||
|
uni.navigateTo({
|
||||||
|
url:urls
|
||||||
|
})
|
||||||
|
}else{
|
||||||
|
uni.switchTab({
|
||||||
|
url:urls
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
.hot-img {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
margin: 0 20rpx 0;
|
||||||
|
padding: 20rpx 0;
|
||||||
|
width: 710rpx;
|
||||||
|
.item {
|
||||||
|
display: block;
|
||||||
|
width: 23.5%;
|
||||||
|
background-color: #fefeff;
|
||||||
|
padding: 20rpx 0 10rpx;
|
||||||
|
border-radius: 8rpx;
|
||||||
|
text-align: center;
|
||||||
|
box-shadow: 2px 1px 6px 1px rgba(0, 0, 0, 0.03);
|
||||||
|
.title {
|
||||||
|
font-weight: bold;
|
||||||
|
color: #282828;
|
||||||
|
height: 40rpx;
|
||||||
|
}
|
||||||
|
.msg {
|
||||||
|
margin: 5rpx auto 0;
|
||||||
|
font-size: 20rpx;
|
||||||
|
max-width: 120rpx;
|
||||||
|
height: 40rpx;
|
||||||
|
}
|
||||||
|
.img {
|
||||||
|
margin: 10rpx auto 0;
|
||||||
|
width: 130rpx;
|
||||||
|
height: 130rpx;
|
||||||
|
/deep/image,/deep/.easy-loadimage,/deep/uni-image {
|
||||||
|
width: 130rpx!important;
|
||||||
|
height: 130rpx!important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&:first-child .msg {
|
||||||
|
color: #8fbbe8;
|
||||||
|
}
|
||||||
|
&:nth-child(2) .msg {
|
||||||
|
color: #d797b7;
|
||||||
|
}
|
||||||
|
&:nth-child(3) .msg {
|
||||||
|
color: #c49bd1;
|
||||||
|
}
|
||||||
|
&:nth-child(4) .msg {
|
||||||
|
color: #a3bf95;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.bd{
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
.item{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
width: 49%;
|
||||||
|
margin-right: 2%;
|
||||||
|
background: #fff;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
padding: 20rpx;
|
||||||
|
justify-content: space-between;
|
||||||
|
&:nth-child(3),&:nth-child(4){
|
||||||
|
margin-top: 20rpx;
|
||||||
|
}
|
||||||
|
&:nth-child(2n){
|
||||||
|
margin-right: 0;
|
||||||
|
}
|
||||||
|
.left{
|
||||||
|
width: 150rpx;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.img{
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
/deep/image,/deep/.easy-loadimage,uni-image{
|
||||||
|
width: 120rpx!important;
|
||||||
|
height: 120rpx!important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
304
pages/index/component/bargain.vue
Normal file
304
pages/index/component/bargain.vue
Normal file
@ -0,0 +1,304 @@
|
|||||||
|
<template>
|
||||||
|
<view v-if="assistList.length > 0">
|
||||||
|
<view class="skeleton-rect" :style="'margin-top:'+mbConfig+'rpx;'">
|
||||||
|
<view class="assist-count" :class="'wrapper-count'+styleType" :style="'border-radius:'+bgStyle+'rpx'">
|
||||||
|
<view class="spike-bd">
|
||||||
|
<view class="title line1"><image class="title-img" :src="`${domain}/static/images/assist_title.png`"></image></view>
|
||||||
|
<view v-if="!merId" class="activity_pic">
|
||||||
|
<view v-for="(item, index) in assistUserList" class="picture">
|
||||||
|
<text v-if="item.avatar_img" class="avatar" :style="'background-image: url(' + item.avatar_img + ')'"></text>
|
||||||
|
<text v-else class="avatar" style="background-image: url('/static/images/f.png')"></text>
|
||||||
|
</view>
|
||||||
|
<text class="pic_count">{{ assistUserCount }}人助力成功</text>
|
||||||
|
</view>
|
||||||
|
<navigator v-if="!merId" url="/pages/activity/assist/index" class="more-btn" hover-class="none">
|
||||||
|
更多活动
|
||||||
|
<text class="iconfont icon-jiantou" hover-class="none"></text>
|
||||||
|
</navigator>
|
||||||
|
</view>
|
||||||
|
<view class="wapper_count">
|
||||||
|
<view class="spike-wrapper" :class="'wrapper'+styleType">
|
||||||
|
<scroll-view v-if="styleType != 2" :class="'colum'+styleType" :scroll-x="styleType == 0 ? true : false" show-scrollbar="false">
|
||||||
|
<view class="spike-item assist-item" v-for="(item, index) in assistList" :key="index" @click="handleAssist(item.product_assist_id)">
|
||||||
|
<view class="img-box" :class="'img-box'+conStyle">
|
||||||
|
<easy-loadimage mode="widthFix" :image-src="item.product.image"></easy-loadimage>
|
||||||
|
<text v-if="joinShow" class="participants">{{ item.user_count }}人参与</text>
|
||||||
|
</view>
|
||||||
|
<view v-if="titleShow || barginShow || priceShow" class="assist-info" :class="'assist-info'+styleType">
|
||||||
|
<view class="price-box presell-price">
|
||||||
|
<view v-if="titleShow" class="name line1">{{ item.store_name }}</view>
|
||||||
|
<view :style="'color:'+themeColor" class="price">
|
||||||
|
<text v-if="barginShow" class="assist_price">助力价</text>
|
||||||
|
<text v-if="priceShow" class="line1 price_num">￥{{ item.assistSku[0].assist_price }}</text>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<button v-if="bntShow" class="initiate_btn" :class="'initiate_btn'+styleType" :style="{background: `linear-gradient(180deg,${bgColor[0].item} 0%,${bgColor[1].item} 100%)`}">发起助力</button>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</scroll-view>
|
||||||
|
<block v-else class="acea-row row-between-wrapper combination">
|
||||||
|
<view
|
||||||
|
class="combination-item"
|
||||||
|
v-for="(item, index) in assistList"
|
||||||
|
:key="index"
|
||||||
|
:style="{ 'background-image': `url(${domain}/static/images/combination${index+1}.png)`,'border-radius':`${conStyle}rpx`}"
|
||||||
|
@click="handleAssist(item.product_assist_id)">
|
||||||
|
<view class="info">
|
||||||
|
<view class="price-box combination-price">
|
||||||
|
<view v-if="titleShow" class="name line1">{{ item.product.store_name }}</view>
|
||||||
|
<text :style="'color:'+themeColor" v-if="priceShow" class="price">
|
||||||
|
<text>￥</text>
|
||||||
|
{{ item.product.price }}
|
||||||
|
</text>
|
||||||
|
<text v-if="bntShow" class="gocom_btn" :style="{background: `linear-gradient(180deg,${bgColor[0].item} 0%,${bgColor[1].item} 100%)`}">
|
||||||
|
去助力
|
||||||
|
<text class="iconfont icon-jiantou"></text>
|
||||||
|
</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="img-box">
|
||||||
|
<easy-loadimage mode="widthFix" :image-src="item.product.image"></easy-loadimage>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view v-if="assistList.length == 1"
|
||||||
|
class="combination-item"
|
||||||
|
:style="{ 'background-image': `url(${domain}/static/images/combination2.png)`,'border-radius':`${conStyle}rpx`}"
|
||||||
|
@click="handleAssist(assistList[0].product_assist_id)">
|
||||||
|
<view class="info">
|
||||||
|
<view class="price-box combination-price">
|
||||||
|
<view v-if="titleShow" class="name line1">{{ assistList[0].product.store_name }}</view>
|
||||||
|
<text :style="'color:'+themeColor" v-if="priceShow" class="price">
|
||||||
|
<text>￥</text>
|
||||||
|
{{ assistList[0].product.price }}
|
||||||
|
</text>
|
||||||
|
<text v-if="bntShow" class="gocom_btn" :style="{background: `linear-gradient(180deg,${bgColor[0].item} 0%,${bgColor[1].item} 100%)`}">
|
||||||
|
去助力
|
||||||
|
<text class="iconfont icon-jiantou"></text>
|
||||||
|
</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="img-box">
|
||||||
|
<easy-loadimage mode="widthFix" :image-src="assistList[0].product.image"></easy-loadimage>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view v-if="assistList.length == 1"
|
||||||
|
class="combination-item"
|
||||||
|
:style="{ 'background-image': `url(${domain}/static/images/combination3.png)`,'border-radius':`${conStyle}rpx`}"
|
||||||
|
@click="handleAssist(assistList[0].product_assist_id)">
|
||||||
|
<view class="info">
|
||||||
|
<view class="price-box combination-price">
|
||||||
|
<view v-if="titleShow" class="name line1">{{ assistList[0].product.store_name }}</view>
|
||||||
|
<text :style="'color:'+themeColor" v-if="priceShow" class="price">
|
||||||
|
<text>￥</text>
|
||||||
|
{{ assistList[0].product.price }}
|
||||||
|
</text>
|
||||||
|
<text v-if="bntShow" class="gocom_btn" :style="{background: `linear-gradient(180deg,${bgColor[0].item} 0%,${bgColor[1].item} 100%)`}">
|
||||||
|
去助力
|
||||||
|
<text class="iconfont icon-jiantou"></text>
|
||||||
|
</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="img-box">
|
||||||
|
<easy-loadimage mode="widthFix" :image-src="assistList[0].product.image"></easy-loadimage>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view v-if="assistList.length == 2"
|
||||||
|
class="combination-item"
|
||||||
|
:style="{ 'background-image': `url(${domain}/static/images/combination3.png)`,'border-radius':`${conStyle}rpx`}"
|
||||||
|
@click="handleAssist(assistList[1].product_assist_id)">
|
||||||
|
<view class="info">
|
||||||
|
<view class="price-box combination-price">
|
||||||
|
<view v-if="titleShow" class="name line1">{{ assistList[1].product.store_name }}</view>
|
||||||
|
<text :style="'color:'+themeColor" v-if="priceShow" class="price">
|
||||||
|
<text>￥</text>
|
||||||
|
{{ assistList[1].product.price }}
|
||||||
|
</text>
|
||||||
|
<text v-if="bntShow" class="gocom_btn" :style="{background: `linear-gradient(180deg,${bgColor[0].item} 0%,${bgColor[1].item} 100%)`}">
|
||||||
|
去助力
|
||||||
|
<text class="iconfont icon-jiantou"></text>
|
||||||
|
</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="img-box">
|
||||||
|
<easy-loadimage mode="widthFix" :image-src="assistList[1].product.image"></easy-loadimage>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</block>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse" :isGoIndex="false"></authorize>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
import { HTTP_REQUEST_URL } from '@/config/app';
|
||||||
|
import { mapGetters } from 'vuex';
|
||||||
|
import { getAssistList, assistUserData, initiateAssistApi } from '@/api/activity.js';
|
||||||
|
import easyLoadimage from '@/components/easy-loadimage/easy-loadimage.vue';
|
||||||
|
import authorize from '@/components/Authorize';
|
||||||
|
export default {
|
||||||
|
computed: mapGetters(['isLogin', 'uid']),
|
||||||
|
name: 'bargain',
|
||||||
|
components:{
|
||||||
|
easyLoadimage,
|
||||||
|
authorize
|
||||||
|
},
|
||||||
|
props: {
|
||||||
|
dataConfig: {
|
||||||
|
type: Object,
|
||||||
|
default: () => {}
|
||||||
|
},
|
||||||
|
merId: {
|
||||||
|
type: String || Number,
|
||||||
|
default: ''
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
isAuto: false, //没有授权的不会自动授权
|
||||||
|
isShowAuth: false, //是否隐藏授权
|
||||||
|
assistList: [], //助力
|
||||||
|
assistUserList: [], //已助力数据
|
||||||
|
assistUserCount: '',
|
||||||
|
mbConfig: this.dataConfig.mbCongfig.val*2,
|
||||||
|
styleType: this.dataConfig.tabConfig.tabVal, //单行，多行，板块
|
||||||
|
bgStyle: this.dataConfig.bgStyle.type ? 20 : 0,
|
||||||
|
conStyle: this.dataConfig.conStyle.type ? 16 : 0,
|
||||||
|
bgColor: this.dataConfig.bgColor.color,
|
||||||
|
themeColor: this.dataConfig.priceColor && this.dataConfig.priceColor.color[0].item,
|
||||||
|
priceShow: this.dataConfig.priceShow.val,
|
||||||
|
bntShow: this.dataConfig.bntShow.val,
|
||||||
|
titleShow: this.dataConfig.titleShow.val,
|
||||||
|
barginShow: this.dataConfig.barginShow.val, //助力标签
|
||||||
|
joinShow: this.dataConfig.joinShow.val, //参与标签
|
||||||
|
domain: HTTP_REQUEST_URL,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
created() {},
|
||||||
|
mounted() {
|
||||||
|
this.getAssistUserCount();
|
||||||
|
this.getAssistProduct();
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
// 助力
|
||||||
|
getAssistProduct() {
|
||||||
|
let that = this;
|
||||||
|
getAssistList({
|
||||||
|
mer_id: that.merId,limit: that.styleType == 2 ? 3 : 12
|
||||||
|
}).then(res => {
|
||||||
|
that.assistList = res.data.list;
|
||||||
|
}).catch(e => {});
|
||||||
|
},
|
||||||
|
// 获取已助力成功数据
|
||||||
|
getAssistUserCount() {
|
||||||
|
let that = this;
|
||||||
|
assistUserData()
|
||||||
|
.then(res => {
|
||||||
|
that.assistUserCount = res.data.count;
|
||||||
|
that.assistUserList = res.data.list;
|
||||||
|
})
|
||||||
|
.catch(e => {});
|
||||||
|
},
|
||||||
|
handleAssist(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
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 微信登录回调
|
||||||
|
onLoadFun: function(e) {
|
||||||
|
this.isShowAuth = false;
|
||||||
|
},
|
||||||
|
// 授权关闭
|
||||||
|
authColse: function(e) {
|
||||||
|
this.isShowAuth = e;
|
||||||
|
},
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
@import '../style/main.scss';
|
||||||
|
.assist-count {
|
||||||
|
background-color: #fff;
|
||||||
|
margin: 0 20rpx;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
padding: 20rpx 0 0 20rpx;
|
||||||
|
box-shadow: 4rpx 2rpx 12rpx 2rpx rgba(0, 0, 0, 0.03);
|
||||||
|
&.wrapper-count2{
|
||||||
|
padding: 20rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.activity_pic {
|
||||||
|
margin-left: 20rpx;
|
||||||
|
padding-left: 20rpx;
|
||||||
|
position: relative;
|
||||||
|
&::before {
|
||||||
|
content: '';
|
||||||
|
display: inline-block;
|
||||||
|
width: 2rpx;
|
||||||
|
height: 40rpx;
|
||||||
|
background: #dcdcdc;
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
}
|
||||||
|
.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: 0.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;
|
||||||
|
}
|
||||||
|
.pic_count {
|
||||||
|
margin-left: 30rpx;
|
||||||
|
color: #999999;
|
||||||
|
font-size: 26rpx;
|
||||||
|
position: relative;
|
||||||
|
top: -4rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.price_num{
|
||||||
|
display: inline-block;
|
||||||
|
max-width: 100rpx;
|
||||||
|
overflow: hidden;
|
||||||
|
line-height: 32rpx;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
33
pages/index/component/blankPage.vue
Normal file
33
pages/index/component/blankPage.vue
Normal file
@ -0,0 +1,33 @@
|
|||||||
|
<template>
|
||||||
|
<view class="blankPage" :style="'height:'+ heightConfig +'rpx;'" v-if="heightConfig>0">
|
||||||
|
<view class="bankCon" :style="'background-color:'+ bgColor +';height:'+ heightConfig +'rpx;'"></view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: 'blankPage',
|
||||||
|
props: {
|
||||||
|
dataConfig: {
|
||||||
|
type: Object,
|
||||||
|
default: () => {}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
bgColor:this.dataConfig.bgColor.color[0].item,
|
||||||
|
heightConfig:this.dataConfig.heightConfig.val
|
||||||
|
};
|
||||||
|
},
|
||||||
|
created() {},
|
||||||
|
methods: {
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
<style lang="scss">
|
||||||
|
.blankPage{
|
||||||
|
.bankCon{
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
217
pages/index/component/combination.vue
Normal file
217
pages/index/component/combination.vue
Normal file
@ -0,0 +1,217 @@
|
|||||||
|
<template>
|
||||||
|
<view v-if="combinationList.length > 0" class="skeleton-rect" :style="'margin-top:'+mbConfig+'rpx'">
|
||||||
|
<view class="seckill-count" :class="'wrapper-count'+styleType" :style="'background:'+bgColor+';border-radius:'+bgStyle+'rpx'">
|
||||||
|
<view class="spike-bd">
|
||||||
|
<view class="acea-row row-middle">
|
||||||
|
<image class="title-img" :src="`${domain}/static/images/group_title.png`"></image>
|
||||||
|
</view>
|
||||||
|
<navigator v-if="!merId" url="/pages/activity/combination/index" class="more-btn" hover-class="none">
|
||||||
|
超值团购
|
||||||
|
<text class="iconfont icon-jiantou" hover-class="none"></text>
|
||||||
|
</navigator>
|
||||||
|
</view>
|
||||||
|
<view class="spike-wrapper" :class="'wrapper'+styleType">
|
||||||
|
<scroll-view v-if="styleType != 2" :class="'colum'+styleType" :scroll-x="styleType == 0 ? true : false" show-scrollbar="false">
|
||||||
|
<navigator
|
||||||
|
class="spike-item"
|
||||||
|
v-for="(item, index) in combinationList"
|
||||||
|
:key="index"
|
||||||
|
:url="'/pages/activity/combination_details/index?id=' + item.product_group_id"
|
||||||
|
hover-class="none" :class="'img-box'+conStyle">
|
||||||
|
<view class="img-box" :class="'img-box'+conStyle"><image :src="item.product.image" mode=""></image></view>
|
||||||
|
<view class="info">
|
||||||
|
<view v-if="titleShow" class="name line1">{{ item.product.store_name }}</view>
|
||||||
|
<view class="price-box">
|
||||||
|
<text v-if="pinkShow" class="comb-label" :style="'background:'+txtColor+';color:'+themeColor">{{item.buying_count_num}}人团</text>
|
||||||
|
<text v-if="priceShow" class="price" :style="'color:'+themeColor">
|
||||||
|
<text>￥</text>
|
||||||
|
{{ item.price }}
|
||||||
|
</text>
|
||||||
|
</view>
|
||||||
|
<view v-if="bntShow" class="com_btn">
|
||||||
|
去拼团
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</navigator>
|
||||||
|
</scroll-view>
|
||||||
|
<block v-else class="acea-row row-between-wrapper combination">
|
||||||
|
<navigator
|
||||||
|
class="combination-item"
|
||||||
|
v-for="(item, index) in combinationList"
|
||||||
|
:key="index"
|
||||||
|
:style="{ 'background-image': `url(${domain}/static/images/combination${index+1}.png)`}"
|
||||||
|
:url="'/pages/activity/combination_details/index?id=' + item.product_group_id"
|
||||||
|
hover-class="none" :class="'img-box'+conStyle">
|
||||||
|
<view class="info">
|
||||||
|
<view class="price-box combination-price">
|
||||||
|
<view v-if="titleShow" class="name line1">{{ item.product.store_name }}</view>
|
||||||
|
<text v-if="priceShow" class="price" :style="'color:'+themeColor">
|
||||||
|
<text>￥</text>
|
||||||
|
{{ item.price }}
|
||||||
|
</text>
|
||||||
|
<text v-if="bntShow" class="gocom_btn">
|
||||||
|
去拼团
|
||||||
|
<text class="iconfont icon-jiantou"></text>
|
||||||
|
</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="img-box" :class="'img-box'+conStyle">
|
||||||
|
<easy-loadimage mode="widthFix" :image-src="item.product.image"></easy-loadimage>
|
||||||
|
</view>
|
||||||
|
</navigator>
|
||||||
|
<navigator v-if="combinationList.length == 1"
|
||||||
|
class="combination-item"
|
||||||
|
hover-class="none"
|
||||||
|
:style="{ 'background-image': `url(${domain}/static/images/combination2.png)`}"
|
||||||
|
:url="'/pages/activity/combination_details/index?id=' + combinationList[0].product_group_id"
|
||||||
|
:class="'img-box'+conStyle">
|
||||||
|
<view class="info">
|
||||||
|
<view class="price-box combination-price">
|
||||||
|
<view v-if="titleShow" class="name line1">{{ combinationList[0].product.store_name }}</view>
|
||||||
|
<text v-if="priceShow" class="price" :style="'color:'+themeColor">
|
||||||
|
<text>￥</text>
|
||||||
|
{{ combinationList[0].price }}
|
||||||
|
</text>
|
||||||
|
<text v-if="bntShow" class="gocom_btn">
|
||||||
|
去拼团
|
||||||
|
<text class="iconfont icon-jiantou"></text>
|
||||||
|
</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="img-box" :class="'img-box'+conStyle">
|
||||||
|
<easy-loadimage mode="widthFix" :image-src="combinationList[0].product.image"></easy-loadimage>
|
||||||
|
</view>
|
||||||
|
</navigator>
|
||||||
|
<navigator v-if="combinationList.length == 1"
|
||||||
|
class="combination-item"
|
||||||
|
hover-class="none"
|
||||||
|
:style="{ 'background-image': `url(${domain}/static/images/combination3.png)`}"
|
||||||
|
:url="'/pages/activity/combination_details/index?id=' + combinationList[0].product_group_id"
|
||||||
|
:class="'img-box'+conStyle">
|
||||||
|
<view class="info">
|
||||||
|
<view class="price-box combination-price">
|
||||||
|
<view v-if="titleShow" class="name line1">{{ combinationList[0].product.store_name }}</view>
|
||||||
|
<text v-if="priceShow" class="price" :style="'color:'+themeColor">
|
||||||
|
<text>￥</text>
|
||||||
|
{{ combinationList[0].price }}
|
||||||
|
</text>
|
||||||
|
<text v-if="bntShow" class="gocom_btn">
|
||||||
|
去拼团
|
||||||
|
<text class="iconfont icon-jiantou"></text>
|
||||||
|
</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="img-box" :class="'img-box'+conStyle">
|
||||||
|
<easy-loadimage mode="widthFix" :image-src="combinationList[0].product.image"></easy-loadimage>
|
||||||
|
</view>
|
||||||
|
</navigator>
|
||||||
|
<navigator v-if="combinationList.length == 2"
|
||||||
|
class="combination-item"
|
||||||
|
hover-class="none"
|
||||||
|
:style="{ 'background-image': `url(${domain}/static/images/combination3.png)`}"
|
||||||
|
:url="'/pages/activity/combination_details/index?id=' + combinationList[1].product_group_id"
|
||||||
|
:class="'img-box'+conStyle">
|
||||||
|
<view class="info">
|
||||||
|
<view class="price-box combination-price">
|
||||||
|
<view v-if="titleShow" class="name line1">{{ combinationList[1].product.store_name }}</view>
|
||||||
|
<text v-if="priceShow" class="price" :style="'color:'+themeColor">
|
||||||
|
<text>￥</text>
|
||||||
|
{{ combinationList[1].price }}
|
||||||
|
</text>
|
||||||
|
<text v-if="bntShow" class="gocom_btn">
|
||||||
|
去拼团
|
||||||
|
<text class="iconfont icon-jiantou"></text>
|
||||||
|
</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="img-box" :class="'img-box'+conStyle">
|
||||||
|
<easy-loadimage mode="widthFix" :image-src="combinationList[1].product.image"></easy-loadimage>
|
||||||
|
</view>
|
||||||
|
</navigator>
|
||||||
|
</block>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { HTTP_REQUEST_URL } from '@/config/app';
|
||||||
|
import { getCombinationList } from '@/api/activity.js';
|
||||||
|
export default {
|
||||||
|
name: 'combination',
|
||||||
|
props: {
|
||||||
|
dataConfig: {
|
||||||
|
type: Object,
|
||||||
|
default: () => {}
|
||||||
|
},
|
||||||
|
merId: {
|
||||||
|
type: String || Number,
|
||||||
|
default: ''
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
domain: HTTP_REQUEST_URL,
|
||||||
|
combinationList: [],
|
||||||
|
themeColor: this.dataConfig.themeColor.color[0].item,//主题颜色
|
||||||
|
styleType: this.dataConfig.tabConfig.tabVal, //单行，多行，板块
|
||||||
|
mbConfig: this.dataConfig.mbConfig.val*2,
|
||||||
|
bgStyle: this.dataConfig.bgStyle.type ? 20 : 0,
|
||||||
|
bgColor: this.dataConfig.bgColor.color[0].item,
|
||||||
|
txtColor: this.dataConfig.txtColor.color[0].item,
|
||||||
|
conStyle: this.dataConfig.conStyle.type,
|
||||||
|
priceShow: this.dataConfig.priceShow.val,
|
||||||
|
bntShow: this.dataConfig.bntShow.val,
|
||||||
|
titleShow: this.dataConfig.titleShow.val,
|
||||||
|
pinkShow: this.dataConfig.pinkShow.val,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
created() {},
|
||||||
|
mounted() {
|
||||||
|
this.getCombinationList();
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
// 砍价列表
|
||||||
|
getCombinationList() {
|
||||||
|
let that = this;
|
||||||
|
getCombinationList({
|
||||||
|
mer_id: that.merId,
|
||||||
|
page: 1,
|
||||||
|
limit: that.styleType == 2 ? 3 : 12
|
||||||
|
}).then(res => {
|
||||||
|
that.combinationList = res.data.list
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
@import '../style/main.scss';
|
||||||
|
.seckill-count {
|
||||||
|
background-color: #fff;
|
||||||
|
margin: 0 20rpx;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
padding: 24rpx 0 26rpx 20rpx;
|
||||||
|
box-shadow: 4rpx 2rpx 12rpx 2rpx rgba(0, 0, 0, 0.03);
|
||||||
|
&.wrapper-count2{
|
||||||
|
padding: 24rpx 20rpx 26rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.comb-label{
|
||||||
|
font-size: 24rpx;
|
||||||
|
border-radius: 2rpx;
|
||||||
|
padding: 1rpx 5rpx;
|
||||||
|
}
|
||||||
|
.com_btn{
|
||||||
|
width: 96%;
|
||||||
|
margin: 10rpx auto 0;
|
||||||
|
height: 46rpx;
|
||||||
|
line-height: 46rpx;
|
||||||
|
background: linear-gradient(90deg, red 0%, #FF5400 100%);
|
||||||
|
border-radius: 24rpx;
|
||||||
|
text-align: center;
|
||||||
|
color: #fff;
|
||||||
|
font-size: 20rpx;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
296
pages/index/component/coupon.vue
Normal file
296
pages/index/component/coupon.vue
Normal file
@ -0,0 +1,296 @@
|
|||||||
|
<template>
|
||||||
|
<view class="coupon_main" :style="'margin: 0 '+prConfig+'rpx'">
|
||||||
|
<view class="coupon_count" :style="'margin-top:' + mbConfig +'rpx;border-radius:'+bgStyle+'rpx'" v-if="couponList.length">
|
||||||
|
<view class="acea-row coupon-title">
|
||||||
|
<text>领优惠券</text>
|
||||||
|
<navigator v-if="merId" :url="'/pages/store/home/index?id='+merId+'&coupon=1'" class="more-box" hover-class="none">
|
||||||
|
<view class="txt">查看更多 <text class="iconfont icon-jiantou"></text></view>
|
||||||
|
</navigator>
|
||||||
|
<navigator v-else url="/pages/activity/collect_coupons/index" class="more-box" hover-class="none">
|
||||||
|
<view class="txt">查看更多 <text class="iconfont icon-jiantou"></text></view>
|
||||||
|
</navigator>
|
||||||
|
</view>
|
||||||
|
<scroll-view scroll-x="true" style="white-space: nowrap; vertical-align: middle;" show-scrollbar="false">
|
||||||
|
<view class="wrapper" v-if="style == 0">
|
||||||
|
<view class="item item0" style="margin-right: 20rpx;" v-for="(item,index) in couponList"
|
||||||
|
:key="index" hover-class="none">
|
||||||
|
<view class="top" :style="{color:`${themeColor}`,backgroundImage: `url(${domain}/static/images/coupon-bg.png)`}">
|
||||||
|
<view class="money"><text>¥</text>{{item.coupon_price}}</view>
|
||||||
|
<view class="info">满{{item.use_min_price}}元可用</view>
|
||||||
|
</view>
|
||||||
|
<navigator hover-class="none" :style="{background:`${themeColor}`}" v-if="item.issue" :url="'/pages/columnGoods/goods_coupon_list/index?coupon_id='+item.coupon_id" class="coupon-btn"><text>去使用</text></navigator>
|
||||||
|
<view :style="{background:`${themeColor}`}" class="coupon-btn" v-else @click="receiveCoupon(item)"><text>立即领取</text></view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="wrapper" v-else-if="style == 1">
|
||||||
|
<view class="item item1" :style="{background:`${themeColor}`}" v-for="(item,index) in couponList"
|
||||||
|
:key="index" hover-class="none">
|
||||||
|
<view class="itemCon acea-row row-between-wrapper">
|
||||||
|
<view class="text" :style="{color:`${themeColor}`}">
|
||||||
|
<view class="money"><text>¥</text>{{item.coupon_price}}</view>
|
||||||
|
<view class="info">满{{item.use_min_price}}元可用</view>
|
||||||
|
</view>
|
||||||
|
<navigator v-if="item.issue" :url="'/pages/columnGoods/goods_coupon_list/index?coupon_id='+item.coupon_id" class="bnt"><text>去使用</text></navigator>
|
||||||
|
<view class="bnt" v-else @click="receiveCoupon(item)"><text>立即领取</text></view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</scroll-view>
|
||||||
|
</view>
|
||||||
|
<authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import {setCouponReceive} from '@/api/api.js';
|
||||||
|
import {getCouponLst} from '@/api/activity.js'
|
||||||
|
import authorize from '@/components/Authorize';
|
||||||
|
import { HTTP_REQUEST_URL } from '@/config/app';
|
||||||
|
import {
|
||||||
|
mapGetters
|
||||||
|
} from "vuex";
|
||||||
|
export default {
|
||||||
|
name: 'coupon',
|
||||||
|
props: {
|
||||||
|
dataConfig: {
|
||||||
|
type: Object,
|
||||||
|
default: () => {}
|
||||||
|
},
|
||||||
|
merId: {
|
||||||
|
type: String || Number,
|
||||||
|
default: ''
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed: mapGetters(['isLogin']),
|
||||||
|
components: {
|
||||||
|
authorize
|
||||||
|
},
|
||||||
|
watch:{
|
||||||
|
isLogin:{
|
||||||
|
handler:function(newV,oldV){
|
||||||
|
if(newV){
|
||||||
|
this.getCoupon();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
deep:true
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
domain: HTTP_REQUEST_URL,
|
||||||
|
couponList: [],
|
||||||
|
style: this.dataConfig.tabConfig&&this.dataConfig.tabConfig.tabVal || 0,
|
||||||
|
themeColor: this.dataConfig.themeColor.color[0].item,
|
||||||
|
mbConfig: this.dataConfig.mbConfig.val*2,
|
||||||
|
prConfig: this.dataConfig.prConfig&&this.dataConfig.prConfig.val*2,
|
||||||
|
bgStyle: this.dataConfig.bgStyle.type ? 20 : 0,
|
||||||
|
isShowAuth: false, //是否隐藏授权
|
||||||
|
isAuto: false, //没有授权的不会自动授权
|
||||||
|
};
|
||||||
|
},
|
||||||
|
created() {},
|
||||||
|
mounted() {
|
||||||
|
this.getCoupon();
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
getCoupon: function() {
|
||||||
|
let that = this;
|
||||||
|
getCouponLst({
|
||||||
|
mer_id: that.merId,
|
||||||
|
page: 1,
|
||||||
|
limit: 10
|
||||||
|
}).then(res => {
|
||||||
|
that.$set(that, 'couponList', res.data.list);
|
||||||
|
}).catch(err => {
|
||||||
|
return that.$util.Tips({
|
||||||
|
title: err
|
||||||
|
});
|
||||||
|
});
|
||||||
|
},
|
||||||
|
receiveCoupon: function(item) {
|
||||||
|
let that = this;
|
||||||
|
if (that.isLogin === false) {
|
||||||
|
this.isAuto = true;
|
||||||
|
this.isShowAuth = true
|
||||||
|
} else {
|
||||||
|
setCouponReceive(item.coupon_id).then(res => {
|
||||||
|
item.issue = 1
|
||||||
|
uni.showToast({
|
||||||
|
title: res.message,
|
||||||
|
icon: 'none'
|
||||||
|
})
|
||||||
|
}).catch(err => {
|
||||||
|
uni.showToast({
|
||||||
|
title: err,
|
||||||
|
icon: 'none'
|
||||||
|
})
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 授权回调
|
||||||
|
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
|
||||||
|
}
|
||||||
|
},
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.coupon_main {
|
||||||
|
.coupon_count{
|
||||||
|
background: #ffffff;
|
||||||
|
padding: 0 0 30rpx 20rpx;
|
||||||
|
}
|
||||||
|
.coupon-title {
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
padding: 20rpx 20rpx 20rpx 10rpx;
|
||||||
|
font-size: 28rpx;
|
||||||
|
font-weight: bold;
|
||||||
|
color: #282828;
|
||||||
|
.more-box {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
font-size: 24rpx;
|
||||||
|
color: #999999;
|
||||||
|
image {
|
||||||
|
width: 20rpx;
|
||||||
|
height: 20rpx;
|
||||||
|
margin-top: 10rpx;
|
||||||
|
margin: 10rpx 0 0 5rpx;
|
||||||
|
}
|
||||||
|
.txt {
|
||||||
|
display: block;
|
||||||
|
.iconfont{
|
||||||
|
font-size: 22rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.item {
|
||||||
|
position: relative;
|
||||||
|
&.item0{
|
||||||
|
margin-right: 28rpx;
|
||||||
|
width: 260rpx;
|
||||||
|
height: 194rpx;
|
||||||
|
position: relative;
|
||||||
|
display: flex;
|
||||||
|
justify-content: flex-end;
|
||||||
|
align-items: flex-end;
|
||||||
|
.top{
|
||||||
|
text-align: center;
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 10rpx;
|
||||||
|
width: 240rpx;
|
||||||
|
height: 124rpx;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
color: #E93323;
|
||||||
|
.money{
|
||||||
|
margin: 8rpx 0 2rpx;
|
||||||
|
font-size: 52rpx;
|
||||||
|
font-weight: bold;
|
||||||
|
text{
|
||||||
|
font-size: 28rpx;
|
||||||
|
font-weight: normal;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.info{
|
||||||
|
font-size: 24rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.coupon-btn{
|
||||||
|
width: 260rpx;
|
||||||
|
height: 160rpx;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 28rpx;
|
||||||
|
display: flex;
|
||||||
|
align-items: end;
|
||||||
|
justify-items: center;
|
||||||
|
justify-content: flex-end;
|
||||||
|
border-radius: 24rpx;
|
||||||
|
background: #E93323;
|
||||||
|
text{
|
||||||
|
display: inline-block;
|
||||||
|
color: #ffffff;
|
||||||
|
width: 100%;
|
||||||
|
position: absolute;
|
||||||
|
bottom: 20rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&.item1{
|
||||||
|
width: 244rpx;
|
||||||
|
height: 126rpx;
|
||||||
|
background: #BBBBBB;
|
||||||
|
border-radius: 14rpx;
|
||||||
|
color: #fff;
|
||||||
|
margin-right: 24rpx;
|
||||||
|
&::before {
|
||||||
|
position: absolute;
|
||||||
|
content: ' ';
|
||||||
|
width: 20rpx;
|
||||||
|
height: 20rpx;
|
||||||
|
border-radius: 50%;
|
||||||
|
background-color: #fff;
|
||||||
|
left: -8rpx;
|
||||||
|
top: 54rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.itemCon {
|
||||||
|
width: 244rpx;
|
||||||
|
height: 128rpx;
|
||||||
|
.text {
|
||||||
|
width: 198rpx;
|
||||||
|
height: 130rpx;
|
||||||
|
padding: 18rpx 0;
|
||||||
|
margin: -2rpx 0 0 -1rpx;
|
||||||
|
background-color: #f7f7f7;
|
||||||
|
border-radius: 14rpx;
|
||||||
|
.money {
|
||||||
|
font-size: 48rpx;
|
||||||
|
text-align: center;
|
||||||
|
font-weight: bold;
|
||||||
|
text {
|
||||||
|
font-size: 24rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.info {
|
||||||
|
font-size: 24rpx;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.bnt {
|
||||||
|
float: right;
|
||||||
|
position: relative;
|
||||||
|
height: 100%;
|
||||||
|
font-size: 20rpx;
|
||||||
|
writing-mode: vertical-lr;
|
||||||
|
line-height: 1.2;
|
||||||
|
width: 46rpx;
|
||||||
|
height: 128rpx;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.wrapper {
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
62
pages/index/component/customerService.vue
Normal file
62
pages/index/component/customerService.vue
Normal file
@ -0,0 +1,62 @@
|
|||||||
|
<template>
|
||||||
|
<view style="touch-action: none;" v-if="is_open_service != '0' || merId != '0'">
|
||||||
|
<view class="customerService" @touchmove.stop.prevent="setTouchMove" :style="{top:topConfig}">
|
||||||
|
<navigator class="pictrue" :url="'/pages/chat/customer_list/chat?mer_id='+merId" hover-class="none">
|
||||||
|
<image :src="logoConfig"></image>
|
||||||
|
</navigator>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
import { configMap } from '@/utils/index';
|
||||||
|
export default {
|
||||||
|
name: 'customerService',
|
||||||
|
props: {
|
||||||
|
dataConfig: {
|
||||||
|
type: Object,
|
||||||
|
default: () => {}
|
||||||
|
},
|
||||||
|
merId: {
|
||||||
|
type: [String, Number],
|
||||||
|
default: '0'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed: configMap({ is_open_service:0 }),
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
logoConfig: this.dataConfig.logoConfig.url,
|
||||||
|
topConfig: (this.dataConfig.topConfig.val || 75)+'%'
|
||||||
|
};
|
||||||
|
},
|
||||||
|
created() {},
|
||||||
|
methods: {
|
||||||
|
setTouchMove(e) {
|
||||||
|
var that = this;
|
||||||
|
if (e.touches[0].clientY < 545 && e.touches[0].clientY > 66) {
|
||||||
|
that.topConfig = e.touches[0].clientY+'px'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.customerService {
|
||||||
|
position: fixed;
|
||||||
|
right: 20rpx;
|
||||||
|
z-index: 999;
|
||||||
|
/* #ifdef MP || APP-PLUS */
|
||||||
|
top: 160rpx;
|
||||||
|
right: 0;
|
||||||
|
/* #endif */
|
||||||
|
.pictrue {
|
||||||
|
width: 86rpx;
|
||||||
|
height: 86rpx;
|
||||||
|
border-radius: 50%;
|
||||||
|
image {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
126
pages/index/component/follow.vue
Normal file
126
pages/index/component/follow.vue
Normal file
@ -0,0 +1,126 @@
|
|||||||
|
<template>
|
||||||
|
<view v-if='!subscribe'>
|
||||||
|
<!-- #ifdef H5 -->
|
||||||
|
<view class="follow acea-row row-between-wrapper" :style="'background:' + bgColor + ';margin-top:' + mbConfig + 'rpx;margin-left:'+prConfig+'rpx;margin-right:'+prConfig+'rpx;'">
|
||||||
|
<view class="picTxt acea-row row-middle">
|
||||||
|
<view class="pictrue"><image :src="imgConfig"></image></view>
|
||||||
|
<view class="name line1">{{ titleConfig }}</view>
|
||||||
|
</view>
|
||||||
|
<view class="notes acea-row row-center-wrapper" :style="'color:' + themeColor + ';border-color:' + themeColor + ';'" @click="followTap">关注</view>
|
||||||
|
</view>
|
||||||
|
<view class="followCode" v-if="followCode">
|
||||||
|
<view class="pictrue">
|
||||||
|
<view class="code-bg" :style="{ 'background-image': `url(${domain}/static/images/code-bg.png)`}"><img class="imgs" :src="followUrl" /></view>
|
||||||
|
</view>
|
||||||
|
<view class="mask" @click="closeFollowCode"></view>
|
||||||
|
</view>
|
||||||
|
<!-- #endif -->
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
// #ifdef H5
|
||||||
|
import { getSubscribe } from '@/api/public';
|
||||||
|
import { HTTP_REQUEST_URL } from '@/config/app';
|
||||||
|
export default {
|
||||||
|
name: 'follow',
|
||||||
|
props: {
|
||||||
|
dataConfig: {
|
||||||
|
type: Object,
|
||||||
|
default: () => {}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
domain: HTTP_REQUEST_URL,
|
||||||
|
followCode: false,
|
||||||
|
followUrl:this.dataConfig.codeConfig.url,
|
||||||
|
bgColor:this.dataConfig.bgColor.color[0].item,
|
||||||
|
imgConfig:this.dataConfig.imgConfig.url,
|
||||||
|
mbConfig:this.dataConfig.mbConfig.val*2,
|
||||||
|
prConfig:this.dataConfig.prConfig&&this.dataConfig.prConfig.val*2 || 0,
|
||||||
|
themeColor:this.dataConfig.themeColor.color[0].item,
|
||||||
|
titleConfig:this.dataConfig.titleConfig.value,
|
||||||
|
subscribe: true
|
||||||
|
};
|
||||||
|
},
|
||||||
|
created() {},
|
||||||
|
mounted() {
|
||||||
|
getSubscribe().then(res => {
|
||||||
|
this.subscribe = res.data.subscribe;
|
||||||
|
}).catch(() => {})
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
followTap(){
|
||||||
|
this.followCode = true;
|
||||||
|
},
|
||||||
|
closeFollowCode(){
|
||||||
|
this.followCode = false
|
||||||
|
},
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// #endif
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.follow {
|
||||||
|
padding: 0 20rpx;
|
||||||
|
height: 140rpx;
|
||||||
|
background: rgba(0, 0, 0, 0.02);
|
||||||
|
.picTxt {
|
||||||
|
.pictrue {
|
||||||
|
width: 92rpx;
|
||||||
|
height: 92rpx;
|
||||||
|
border-radius: 50%;
|
||||||
|
image {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
border-radius: 50%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.name {
|
||||||
|
font-size: 32rpx;
|
||||||
|
color: #000;
|
||||||
|
margin-left: 32rpx;
|
||||||
|
width: 400rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.notes {
|
||||||
|
font-size: 28rpx;
|
||||||
|
color: #02a0e8;
|
||||||
|
width: 120rpx;
|
||||||
|
height: 52rpx;
|
||||||
|
border: 2rpx solid rgba(2, 160, 232, 1);
|
||||||
|
opacity: 1;
|
||||||
|
border-radius: 6rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.followCode {
|
||||||
|
.pictrue {
|
||||||
|
width: 500rpx;
|
||||||
|
height: 720rpx;
|
||||||
|
border-radius: 12px;
|
||||||
|
left: 50%;
|
||||||
|
top: 50%;
|
||||||
|
margin-left: -250rpx;
|
||||||
|
margin-top: -360rpx;
|
||||||
|
position: fixed;
|
||||||
|
z-index: 10000;
|
||||||
|
.code-bg {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
}
|
||||||
|
.imgs {
|
||||||
|
width: 310rpx;
|
||||||
|
height: 310rpx;
|
||||||
|
margin-top: 92rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.mask {
|
||||||
|
z-index: 9999;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
453
pages/index/component/goodList.vue
Normal file
453
pages/index/component/goodList.vue
Normal file
@ -0,0 +1,453 @@
|
|||||||
|
<template>
|
||||||
|
<view class="index-product-wrapper" :style="{ marginTop: mbConfig + 'rpx', background: themeColor,borderRadius: bgStyle+'rpx'}" v-if="tempArr.length">
|
||||||
|
<!-- 单列 -->
|
||||||
|
<block v-if="itemStyle == 0">
|
||||||
|
<view class="list-box animated listA" :class="tempArr.length > 0 ? 'fadeIn on' : ''">
|
||||||
|
<view class="item" v-for="(item, index) in tempArr" :key="index" @click="goDetail(item)">
|
||||||
|
<view class="pictrue" :class="'cont'+conStyle">
|
||||||
|
<easy-loadimage mode="widthFix" :image-src="item.image"></easy-loadimage>
|
||||||
|
<view v-if="item.stock == 0" class="sell_out">已售罄</view>
|
||||||
|
<view v-if="item.border_pic" :style="{ backgroundImage: `url(${item.border_pic})` }" class="border-picture"></view>
|
||||||
|
</view>
|
||||||
|
<view class="text-info" style="display: flex; flex-direction: column; justify-content: space-between;">
|
||||||
|
<view>
|
||||||
|
<view v-if="titleShow" class="title">{{ item.store_name }}</view>
|
||||||
|
<view class="merchant_info">
|
||||||
|
<view v-if="item.merchant && item.merchant.type_name" :style="'background:'+labelColor" class="font-bg-red">{{item.merchant.type_name}}</view>
|
||||||
|
<view class="txt" :style="'border-color:'+priceColor+';color:'+priceColor+';'" v-if="item.issetCoupon && couponShow">领券</view>
|
||||||
|
<view class="txt delivery" v-if="item.delivery_free">包邮</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view v-if="priceShow" class="price acea-row" :style="'color:'+priceColor">
|
||||||
|
<view>
|
||||||
|
¥
|
||||||
|
<text>{{ item.price }}</text>
|
||||||
|
</view>
|
||||||
|
<view v-if="opriceShow" class="ot-price">¥{{item.ot_price}}</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</block>
|
||||||
|
<!-- 两列 -->
|
||||||
|
<block v-if="itemStyle == 1">
|
||||||
|
<view class="list-box listS animated" :class="tempArr.length > 0 ? 'fadeIn on' : ''">
|
||||||
|
<view class="item" v-for="(item, index) in tempArr" :key="index" @click="goDetail(item)" :style="'border-radius:'+bgStyle+'rpx;'">
|
||||||
|
<view class="pictrue picture1" :class="'cont'+conStyle">
|
||||||
|
<!-- <image :src="item.image" mode=""></image> -->
|
||||||
|
<easy-loadimage mode="widthFix" :image-src="item.image"></easy-loadimage>
|
||||||
|
<view v-if="item.stock == 0" class="sell_out">已售罄</view>
|
||||||
|
<view v-if="item.border_pic" :style="{ backgroundImage: `url(${item.border_pic})` }" class="border-picture"></view>
|
||||||
|
</view>
|
||||||
|
<view class="text-info" style="background:#fff;">
|
||||||
|
<view v-if="titleShow" class="title line2">{{ item.store_name }}</view>
|
||||||
|
<view v-if="priceShow" class="price acea-row" :style="'color:'+priceColor">
|
||||||
|
¥<text>{{ item.price }}</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</block>
|
||||||
|
<!-- 三列 -->
|
||||||
|
<block v-if="itemStyle == 2">
|
||||||
|
<view class="list-box animated listB" :class="tempArr.length > 0 ? 'fadeIn on' : ''">
|
||||||
|
<view class="item" v-for="(item, index) in tempArr" :key="index" @click="goDetail(item)" :style="'border-radius:'+bgStyle+'rpx;'">
|
||||||
|
<view class="pictrue" :class="'cont'+conStyle">
|
||||||
|
<!-- <image :src="item.image" mode=""></image> -->
|
||||||
|
<easy-loadimage mode="widthFix" :image-src="item.image"></easy-loadimage>
|
||||||
|
<view v-if="item.stock == 0" class="sell_out">已售罄</view>
|
||||||
|
<view v-if="item.border_pic" :style="{ backgroundImage: `url(${item.border_pic})` }" class="border-picture"></view>
|
||||||
|
</view>
|
||||||
|
<view class="text-info" style="display: flex; flex-direction: column; justify-content: space-between;">
|
||||||
|
<view v-if="titleShow" class="title line2">{{ item.store_name }}</view>
|
||||||
|
<view v-if="priceShow" class="price">
|
||||||
|
<view v-if="priceShow" :style="'color:'+priceColor">
|
||||||
|
¥<text>{{ item.price }}</text>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</block>
|
||||||
|
<!--大图-->
|
||||||
|
<block v-if="itemStyle == 3">
|
||||||
|
<view class="list-box animated listC" :class="tempArr.length > 0 ? 'fadeIn on' : ''">
|
||||||
|
<view class="item" v-for="(item, index) in tempArr" :key="index" @click="goDetail(item)" :style="'border-radius:'+bgStyle+'rpx;'">
|
||||||
|
<view class="pictrue" :class="'cont'+conStyle">
|
||||||
|
<easy-loadimage mode="widthFix" :image-src="item.image"></easy-loadimage>
|
||||||
|
</view>
|
||||||
|
<view class="text-info" style="display: flex; flex-direction: column; justify-content: space-between;">
|
||||||
|
<view v-if="titleShow" class="title line2">{{ item.store_name }}</view>
|
||||||
|
<view v-if="priceShow || opriceShow" class="price">
|
||||||
|
<view v-if="priceShow" :style="'color:'+priceColor">
|
||||||
|
¥<text>{{ item.price }}</text>
|
||||||
|
</view>
|
||||||
|
<view v-if="opriceShow" class="old-price">
|
||||||
|
¥{{ item.ot_price }}
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</block>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { getProductslist } from '@/api/store.js';
|
||||||
|
export default {
|
||||||
|
name: 'goodList',
|
||||||
|
props: {
|
||||||
|
dataConfig: {
|
||||||
|
type: Object,
|
||||||
|
default: () => {}
|
||||||
|
},
|
||||||
|
merId: {
|
||||||
|
type: String || Number,
|
||||||
|
default: ''
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
tempArr: [],
|
||||||
|
mbConfig: this.dataConfig.mbConfig.val*2,
|
||||||
|
numConfig: this.dataConfig.numConfig.val ? this.dataConfig.numConfig.val : this.dataConfig.numConfig.val,
|
||||||
|
themeColor: this.dataConfig.themeColor.color[0].item,
|
||||||
|
priceColor: this.dataConfig.fontColor.color[0].item,
|
||||||
|
labelColor: this.dataConfig.labelColor.color[0].item,
|
||||||
|
itemStyle: this.dataConfig.itemStyle.type,
|
||||||
|
sortType: this.dataConfig.goodsSort.type,
|
||||||
|
conStyle: this.dataConfig.conStyle.type,
|
||||||
|
bgStyle: this.dataConfig.bgStyle.type ? '20' : '0',
|
||||||
|
type: this.dataConfig.tabConfig.tabVal || 0,
|
||||||
|
selectId: this.dataConfig.selectConfig.activeValue || 0,
|
||||||
|
productIds: this.dataConfig.goodsList.ids || [],
|
||||||
|
titleShow: this.dataConfig.titleShow.val,
|
||||||
|
opriceShow: this.dataConfig.opriceShow.val,
|
||||||
|
priceShow: this.dataConfig.priceShow.val,
|
||||||
|
couponShow: this.dataConfig.couponShow.val
|
||||||
|
};
|
||||||
|
},
|
||||||
|
created() {},
|
||||||
|
mounted() {
|
||||||
|
this.productslist();
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
productslist() {
|
||||||
|
let data = {};
|
||||||
|
if (this.type == 1) {
|
||||||
|
data = {
|
||||||
|
mer_id: this.merId,
|
||||||
|
product_ids: this.productIds.toString(),
|
||||||
|
limit: this.productIds.length,
|
||||||
|
type: 1
|
||||||
|
};
|
||||||
|
} else {
|
||||||
|
data = {
|
||||||
|
mer_id: this.merId,
|
||||||
|
order: this.sortType == 2 ? 'price_asc' : this.sortType == 1 ? 'sales' : '',
|
||||||
|
limit: this.numConfig,
|
||||||
|
type: 1
|
||||||
|
};
|
||||||
|
if(this.merId){
|
||||||
|
data.mer_cate_id = this.selectId.toString()
|
||||||
|
}else{
|
||||||
|
data.cate_pid = this.selectId.toString()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
getProductslist(data).then(res => {
|
||||||
|
this.tempArr = res.data.list;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
goDetail(item) {
|
||||||
|
this.$emit('detail', item);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.index-product-wrapper {
|
||||||
|
margin: 30rpx 20rpx 0 20rpx;
|
||||||
|
.list-box {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
justify-content: space-between;
|
||||||
|
padding: 20rpx 20rpx 0;
|
||||||
|
.item {
|
||||||
|
width: 328rpx;
|
||||||
|
margin-bottom: 20rpx;
|
||||||
|
overflow: hidden;
|
||||||
|
position: relative;
|
||||||
|
&.on {
|
||||||
|
border-radius: 0;
|
||||||
|
}
|
||||||
|
.pictrue_log {
|
||||||
|
width: 92rpx;
|
||||||
|
height: 44rpx;
|
||||||
|
font-size: 26rpx;
|
||||||
|
line-height: 44rpx;
|
||||||
|
}
|
||||||
|
.pictrue,/deep/image,/deep/.easy-loadimage,/deep/uni-image {
|
||||||
|
width: 100%;
|
||||||
|
display: block;
|
||||||
|
position: relative;
|
||||||
|
.border-picture {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
background: center/cover no-repeat;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.picture1,/deep/.picture1 image,/deep/.picture1 .easy-loadimage,/deep/.picture1 uni-image {
|
||||||
|
height: 346rpx;
|
||||||
|
position: relative;
|
||||||
|
.border-picture {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
background: center/cover no-repeat;
|
||||||
|
}
|
||||||
|
.sell_out {
|
||||||
|
display: flex;
|
||||||
|
width: 150rpx;
|
||||||
|
height: 150rpx;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
border-radius: 100%;
|
||||||
|
background: rgba(0,0,0,.6);
|
||||||
|
color: #fff;
|
||||||
|
font-size: 30rpx;
|
||||||
|
position: absolute;
|
||||||
|
top: 50%;
|
||||||
|
left: 50%;
|
||||||
|
margin: -75rpx 0 0 -75rpx;
|
||||||
|
&::before{
|
||||||
|
content: "";
|
||||||
|
display: block;
|
||||||
|
width: 140rpx;
|
||||||
|
height: 140rpx;
|
||||||
|
border-radius: 100%;
|
||||||
|
border: 1px dashed #fff;
|
||||||
|
position: absolute;
|
||||||
|
top: 5rpx;
|
||||||
|
left: 5rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.cont1,/deep/.cont1 image,/deep/.cont1 .easy-loadimage,/deep/.cont1 uni-image,.cont1 .border-picture{
|
||||||
|
border-radius: 16rpx;
|
||||||
|
}
|
||||||
|
.text-info {
|
||||||
|
padding: 10rpx 20rpx 15rpx;
|
||||||
|
.title {
|
||||||
|
color: #222222;
|
||||||
|
overflow:hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
display: -webkit-box;
|
||||||
|
-webkit-line-clamp: 2;
|
||||||
|
-webkit-box-orient: vertical;
|
||||||
|
}
|
||||||
|
.old-price {
|
||||||
|
margin-top: 4rpx;
|
||||||
|
font-size: 26rpx;
|
||||||
|
color: #999;
|
||||||
|
text-decoration: line-through;
|
||||||
|
text {
|
||||||
|
margin-right: 2px;
|
||||||
|
font-size: 20rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.price {
|
||||||
|
display: flex;
|
||||||
|
margin-top: 20rpx;
|
||||||
|
font-size: 26rpx;
|
||||||
|
align-items: center;
|
||||||
|
text {
|
||||||
|
font-size: 36rpx;
|
||||||
|
font-weight: 550;
|
||||||
|
}
|
||||||
|
.ot-price{
|
||||||
|
color: #aaa;
|
||||||
|
font-size: 26rpx;
|
||||||
|
text-decoration: line-through;
|
||||||
|
margin-left: 6rpx;
|
||||||
|
font-weight: normal;
|
||||||
|
margin-top: 10rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.pictrue {
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.border-picture {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
border-radius: 8rpx;
|
||||||
|
background: center/cover no-repeat;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.merchant_info{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
margin-top: 20rpx;
|
||||||
|
.merchant_type{
|
||||||
|
color: #fff;
|
||||||
|
line-height: 30rpx;
|
||||||
|
padding: 0 10rpx;
|
||||||
|
border-radius: 2rpx;
|
||||||
|
font-size: 22rpx;
|
||||||
|
}
|
||||||
|
.txt {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
width: 56rpx;
|
||||||
|
height: 28rpx;
|
||||||
|
margin-left: 15rpx;
|
||||||
|
border: 1px solid $theme-color;
|
||||||
|
border-radius: 4rpx;
|
||||||
|
font-size: 20rpx;
|
||||||
|
font-weight: normal;
|
||||||
|
&.delivery{
|
||||||
|
margin-left: 0;
|
||||||
|
color: #FF9000;
|
||||||
|
border-color: #FF9000;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&.on {
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
&.listA {
|
||||||
|
.item {
|
||||||
|
display: flex;
|
||||||
|
width: 100%;
|
||||||
|
.pictrue,/deep/image,/deep/.easy-loadimage,/deep/uni-image {
|
||||||
|
width: 220rpx;
|
||||||
|
height: 220rpx;
|
||||||
|
}
|
||||||
|
.sell_out {
|
||||||
|
display: flex;
|
||||||
|
width: 110rpx;
|
||||||
|
height: 110rpx;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
border-radius: 100%;
|
||||||
|
background: rgba(0,0,0,.6);
|
||||||
|
color: #fff;
|
||||||
|
font-size: 24rpx;
|
||||||
|
position: absolute;
|
||||||
|
top: 50%;
|
||||||
|
left: 50%;
|
||||||
|
margin: -55rpx 0 0 -55rpx;
|
||||||
|
&::before{
|
||||||
|
content: "";
|
||||||
|
display: block;
|
||||||
|
width: 100rpx;
|
||||||
|
height: 100rpx;
|
||||||
|
border-radius: 100%;
|
||||||
|
border: 1px dashed #fff;
|
||||||
|
position: absolute;
|
||||||
|
top: 5rpx;
|
||||||
|
left: 5rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.text-info {
|
||||||
|
width: 490rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&.listB {
|
||||||
|
justify-content: inherit;
|
||||||
|
.item {
|
||||||
|
width: 31.3%;
|
||||||
|
margin-right: 3.05%;
|
||||||
|
.pictrue,/deep/image,/deep/.easy-loadimage,/deep/uni-image {
|
||||||
|
height: 220rpx;
|
||||||
|
}
|
||||||
|
.sell_out {
|
||||||
|
display: flex;
|
||||||
|
width: 110rpx;
|
||||||
|
height: 110rpx;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
border-radius: 100%;
|
||||||
|
background: rgba(0,0,0,.6);
|
||||||
|
color: #fff;
|
||||||
|
font-size: 24rpx;
|
||||||
|
position: absolute;
|
||||||
|
top: 50%;
|
||||||
|
left: 50%;
|
||||||
|
margin: -55rpx 0 0 -55rpx;
|
||||||
|
&::before{
|
||||||
|
content: "";
|
||||||
|
display: block;
|
||||||
|
width: 100rpx;
|
||||||
|
height: 100rpx;
|
||||||
|
border-radius: 100%;
|
||||||
|
border: 1px dashed #fff;
|
||||||
|
position: absolute;
|
||||||
|
top: 5rpx;
|
||||||
|
left: 5rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&:nth-child(3n) {
|
||||||
|
margin-right: 0;
|
||||||
|
}
|
||||||
|
.price{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
font-size: 20rpx;
|
||||||
|
text{
|
||||||
|
font-size: 28rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.text-info{
|
||||||
|
padding: 10rpx 4rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&.listC{
|
||||||
|
.item{
|
||||||
|
width: 100%;
|
||||||
|
.pictrue,/deep/image,/deep/.easy-loadimage,/deep/uni-image{
|
||||||
|
height: 320rpx;
|
||||||
|
}
|
||||||
|
.price{
|
||||||
|
margin-top: 20rpx;
|
||||||
|
font-size: 40rpx;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
.old-price{
|
||||||
|
font-weight: normal;
|
||||||
|
font-size: 22rpx;
|
||||||
|
margin-left: 10rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&.listS{
|
||||||
|
.price{
|
||||||
|
font-size: 40rpx;
|
||||||
|
display: flex;
|
||||||
|
align-items: baseline;
|
||||||
|
.old-price{
|
||||||
|
font-weight: normal;
|
||||||
|
font-size: 22rpx;
|
||||||
|
margin-left: 10rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
43
pages/index/component/guide.vue
Normal file
43
pages/index/component/guide.vue
Normal file
@ -0,0 +1,43 @@
|
|||||||
|
<template>
|
||||||
|
<view class="lines" :style="'padding:0 '+ lrEdge +'rpx;margin-top:'+ mbConfig +'rpx;'" v-if="heightConfig">
|
||||||
|
<view class="item" :style="'border-bottom-width:'+ heightConfig +'rpx;border-bottom-color:'+ lineColor +';border-bottom-style:'+ lineStyle +';'"></view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: 'guide',
|
||||||
|
props: {
|
||||||
|
dataConfig: {
|
||||||
|
type: Object,
|
||||||
|
default: () => {}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
heightConfig:this.dataConfig.heightConfig.val,
|
||||||
|
lineColor:this.dataConfig.lineColor.color[0].item,
|
||||||
|
lineStyle:this.dataConfig.lineStyle.type == 0 ? 'dashed' : this.dataConfig.lineStyle.type == 1 ? 'solid' : 'dotted',
|
||||||
|
lrEdge:this.dataConfig.lrEdge.val,
|
||||||
|
mbConfig:this.dataConfig.mbConfig.val*2
|
||||||
|
};
|
||||||
|
},
|
||||||
|
created() {},
|
||||||
|
methods: {
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.lines{
|
||||||
|
padding: 0 20rpx;
|
||||||
|
margin-top: 20rpx;
|
||||||
|
.item{
|
||||||
|
width: 100%;
|
||||||
|
box-sizing: border-box;
|
||||||
|
border-bottom-color: red;
|
||||||
|
border-bottom-width: 1px;
|
||||||
|
border-bottom-style: dotted;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
200
pages/index/component/headerSerch.vue
Normal file
200
pages/index/component/headerSerch.vue
Normal file
@ -0,0 +1,200 @@
|
|||||||
|
<template>
|
||||||
|
<!-- #ifdef H5 -->
|
||||||
|
<view class="header" :style="'background: '+ bgColor +' ;margin-top:'+ mbConfig +'rpx;'">
|
||||||
|
<view class="serch-wrapper acea-row row-between-wrapper" :style="'padding-left:'+prConfig+'rpx;'">
|
||||||
|
<view v-if="logoConfig" class="logo skeleton-rect">
|
||||||
|
<image :src="logoConfig" mode=""></image>
|
||||||
|
</view>
|
||||||
|
<navigator :url="merId ? '/pages/store/list/index?mer_id='+merId : '/pages/columnGoods/goods_search/index'" :class="logoConfig ? 'input' : 'uninput'" class="skeleton-rect box" hover-class="none"
|
||||||
|
:style="'border-radius:'+boxStyle+'rpx;text-align:'+txtStyle">
|
||||||
|
<text class="iconfont icon-xiazai5"></text>
|
||||||
|
搜索商品
|
||||||
|
</navigator>
|
||||||
|
<navigator class="btn skeleton-rect" url="/pages/chat/customer_list/index?type=0" hover-class="none">
|
||||||
|
<view class="iconfont icon-xiaoxi" :style="'color:'+iconColor"></view>
|
||||||
|
<text class="iconnum" v-if="userInfo.total_unread">{{ userInfo.total_unread }}</text>
|
||||||
|
</navigator>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<!-- #endif -->
|
||||||
|
<!-- #ifdef MP || APP-PLUS -->
|
||||||
|
<view>
|
||||||
|
<view class="mp-header" :style="'background: '+ bgColor +' ;margin-top:'+ mbConfig +'rpx;'">
|
||||||
|
<view class="sys-head skeleton-rect" :style="{ height: statusBarHeight }"></view>
|
||||||
|
<view class="serch-box skeleton-rect" style="height: 43px;">
|
||||||
|
<view class="serch-wrapper flex" :style="'padding-left:'+prConfig+'rpx;'">
|
||||||
|
<view v-if="logoConfig" class="logo skeleton-rect"><image :src="logoConfig" mode=""></image></view>
|
||||||
|
<navigator :url="merId ? '/pages/store/list/index?mer_id='+merId : '/pages/columnGoods/goods_search/index'" :class="logoConfig ? 'input' : 'uninput'"
|
||||||
|
hover-class="none" class="skeleton-rect box" :style="'border-radius:'+boxStyle+'rpx;text-align:'+txtStyle">
|
||||||
|
<text class="iconfont icon-xiazai5"></text>
|
||||||
|
搜索商品
|
||||||
|
</navigator>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view :style="'height:'+marTop+'px;'"></view>
|
||||||
|
</view>
|
||||||
|
<!-- #endif -->
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
let statusBarHeight = uni.getSystemInfoSync().statusBarHeight*2 + 'rpx';
|
||||||
|
export default {
|
||||||
|
name: 'headerSerch',
|
||||||
|
props: {
|
||||||
|
dataConfig: {
|
||||||
|
type: Object,
|
||||||
|
default: () => {}
|
||||||
|
},
|
||||||
|
userInfo: {
|
||||||
|
type: Object,
|
||||||
|
default: () => {}
|
||||||
|
},
|
||||||
|
merId: {
|
||||||
|
type: String || Number,
|
||||||
|
default: ''
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
statusBarHeight: statusBarHeight,
|
||||||
|
marTop:0,
|
||||||
|
searchH: 0,
|
||||||
|
bgColor: this.dataConfig.bgColor && this.dataConfig.bgColor.color[0].item,
|
||||||
|
iconColor: this.dataConfig.iconColor && this.dataConfig.iconColor.color[0].item,
|
||||||
|
boxStyle: this.dataConfig.boxStyle.type ? '0' : '32',
|
||||||
|
logoConfig: this.dataConfig.logoConfig.url,
|
||||||
|
mbConfig: this.dataConfig.mbConfig.val*2,
|
||||||
|
prConfig: this.dataConfig.prConfig.val*2,
|
||||||
|
txtStyle: this.dataConfig.txtStyle.type ? 'center' : 'xleft',
|
||||||
|
};
|
||||||
|
},
|
||||||
|
mounted(){
|
||||||
|
let that = this;
|
||||||
|
// #ifdef H5
|
||||||
|
// 获取H5 搜索框高度
|
||||||
|
setTimeout(() => {
|
||||||
|
let appSearchH = uni.createSelectorQuery().select('.serch-wrapper');
|
||||||
|
appSearchH
|
||||||
|
.boundingClientRect(function(data) {
|
||||||
|
that.searchH = data.height;
|
||||||
|
})
|
||||||
|
.exec();
|
||||||
|
}, 800);
|
||||||
|
// #endif
|
||||||
|
// #ifdef MP || APP-PLUS
|
||||||
|
setTimeout(() => {
|
||||||
|
// 获取小程序头部高度
|
||||||
|
let info = uni.createSelectorQuery().in(this).select(".mp-header");
|
||||||
|
info.boundingClientRect(function(data) {
|
||||||
|
that.marTop = data.height
|
||||||
|
}).exec()
|
||||||
|
}, 300)
|
||||||
|
// #endif
|
||||||
|
},
|
||||||
|
methods: {}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.header {
|
||||||
|
width: 100%;
|
||||||
|
background: #ffffff;
|
||||||
|
.btn {
|
||||||
|
position: relative;
|
||||||
|
margin-left: 30rpx;
|
||||||
|
.iconfont {
|
||||||
|
font-size: 45rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.iconnum {
|
||||||
|
min-width: 6px;
|
||||||
|
color: #fff;
|
||||||
|
background: #e93323;
|
||||||
|
border-radius: 15rpx;
|
||||||
|
position: absolute;
|
||||||
|
right: -10rpx;
|
||||||
|
top: -10rpx;
|
||||||
|
font-size: 10px;
|
||||||
|
padding: 0 4px;
|
||||||
|
}
|
||||||
|
.serch-wrapper {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
padding: 20rpx 30rpx 20rpx 30rpx;
|
||||||
|
.box{
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
|
.logo {
|
||||||
|
width: 127rpx;
|
||||||
|
height: 46rpx;
|
||||||
|
margin-right: 20rpx;
|
||||||
|
}
|
||||||
|
image {
|
||||||
|
width: 118rpx;
|
||||||
|
height: 42rpx;
|
||||||
|
}
|
||||||
|
.input,.uninput {
|
||||||
|
line-height: 64rpx;
|
||||||
|
padding: 0 0 0 30rpx;
|
||||||
|
background: rgba(237, 237, 237, 1);
|
||||||
|
border: 1px solid rgba(241, 241, 241, 1);
|
||||||
|
color: #bbbbbb;
|
||||||
|
font-size: 28rpx;
|
||||||
|
.iconfont {
|
||||||
|
margin-right: 20rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
/* #ifdef MP || APP-PLUS */
|
||||||
|
.mp-header {
|
||||||
|
z-index: 999;
|
||||||
|
position: fixed;
|
||||||
|
left: 0;
|
||||||
|
top: 0;
|
||||||
|
width: 100%;
|
||||||
|
/* #ifdef H5 */
|
||||||
|
padding-bottom: 20rpx;
|
||||||
|
/* #endif */
|
||||||
|
background-color: #fff;
|
||||||
|
.serch-wrapper {
|
||||||
|
height: 100%;
|
||||||
|
align-items: center;
|
||||||
|
padding: 0 50rpx 0 53rpx;
|
||||||
|
image {
|
||||||
|
width: 118rpx;
|
||||||
|
height: 42rpx;
|
||||||
|
margin-right: 30rpx;
|
||||||
|
}
|
||||||
|
.input,.uninput {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
/* #ifndef APP-PLUS */
|
||||||
|
width: 305rpx;
|
||||||
|
/* #endif */
|
||||||
|
/* #ifdef APP-PLUS */
|
||||||
|
flex: 1;
|
||||||
|
width: 500rpx;
|
||||||
|
/* #endif */
|
||||||
|
height: 58rpx;
|
||||||
|
padding: 0 0 0 30rpx;
|
||||||
|
background: rgba(247, 247, 247, 1);
|
||||||
|
border: 1px solid rgba(241, 241, 241, 1);
|
||||||
|
border-radius: 29rpx;
|
||||||
|
color: #bbbbbb;
|
||||||
|
font-size: 28rpx;
|
||||||
|
.iconfont {
|
||||||
|
margin-right: 20rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.uninput {
|
||||||
|
/* #ifdef MP */
|
||||||
|
min-width: 450rpx;
|
||||||
|
max-width: 480rpx;
|
||||||
|
/* #endif*/
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
/* #endif */
|
||||||
|
</style>
|
||||||
675
pages/index/component/homeComb.vue
Normal file
675
pages/index/component/homeComb.vue
Normal file
@ -0,0 +1,675 @@
|
|||||||
|
<template>
|
||||||
|
<view class="page_count">
|
||||||
|
<view class="bg-img">
|
||||||
|
<img :src="bgColor" alt="">
|
||||||
|
</view>
|
||||||
|
<!--搜索-->
|
||||||
|
<view :class="{scrolled:isScrolled}" class="my-main">
|
||||||
|
<!-- #ifdef H5 -->
|
||||||
|
<view>
|
||||||
|
<view class="header">
|
||||||
|
<view class="sys-head tui-skeleton" :style="{ height: statusBarHeight }"></view>
|
||||||
|
<view class="serch-box tui-skeleton">
|
||||||
|
<view class="serch-wrapper flex">
|
||||||
|
<view v-if="logoConfig || site_logo" class="logo skeleton-rect"><image :src="logoConfig || site_logo" mode="widthFix"></image></view>
|
||||||
|
<navigator v-if="hotWords.length > 0" :url="'/pages/columnGoods/goods_search/index?searchVal='+searchVal" :class="(logoConfig || site_logo) ? 'input' : 'uninput'"
|
||||||
|
hover-class="none" class="skeleton-rect box">
|
||||||
|
<view class='swiperTxt'>
|
||||||
|
<swiper :indicator-dots="indicatorDots" :autoplay="autoplay" :interval="interval" :duration="duration" vertical="true"
|
||||||
|
circular="true" @change="textChange">
|
||||||
|
<block v-for="(item,index) in hotWords" :key='index'>
|
||||||
|
<swiper-item catchtouchmove='catchTouchMove'>
|
||||||
|
<view class='acea-row row-between-wrapper'>
|
||||||
|
<view class='text acea-row row-between-wrapper'>
|
||||||
|
<view class='newsTitle line1'>{{item.val}}</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</swiper-item>
|
||||||
|
</block>
|
||||||
|
</swiper>
|
||||||
|
</view>
|
||||||
|
<text class="iconfont icon-xiazai5"></text>
|
||||||
|
</navigator>
|
||||||
|
<navigator v-else url="/pages/columnGoods/goods_search/index" :class="(logoConfig || site_logo) ? 'input' : 'uninput'"
|
||||||
|
hover-class="none" class="skeleton-rect">
|
||||||
|
搜索商品
|
||||||
|
<text class="iconfont icon-xiazai5"></text>
|
||||||
|
</navigator>
|
||||||
|
<navigator class="btn skeleton-rect" url="/pages/chat/customer_list/index?type=0" hover-class="none">
|
||||||
|
<view class="iconfont icon-xiaoxi" style="color:#fff;"></view>
|
||||||
|
<text class="iconnum" v-if="userInfo.total_unread">{{ userInfo.total_unread }}</text>
|
||||||
|
</navigator>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view :style="'height:'+isTop+'px'"></view>
|
||||||
|
</view>
|
||||||
|
<!-- #endif -->
|
||||||
|
<!-- #ifdef MP || APP-PLUS -->
|
||||||
|
<view>
|
||||||
|
<view class="mp-header" id="home">
|
||||||
|
<view class="sys-head tui-skeleton" :style="{ height: statusBarHeight }"></view>
|
||||||
|
<view class="serch-box tui-skeleton">
|
||||||
|
<view class="serch-wrapper flex">
|
||||||
|
<view v-if="logoConfig || site_logo" class="logo skeleton-rect"><image :src="logoConfig || site_logo" mode="widthFix"></image></view>
|
||||||
|
<navigator v-if="hotWords.length > 0" :url="'/pages/columnGoods/goods_search/index?searchVal='+searchVal" :class="(logoConfig || site_logo) ? 'input' : 'uninput'"
|
||||||
|
hover-class="none" class="skeleton-rect box">
|
||||||
|
<view class='swiperTxt'>
|
||||||
|
<swiper :indicator-dots="indicatorDots" :autoplay="autoplay" :interval="interval" :duration="duration" vertical="true"
|
||||||
|
circular="true" @change="textChange">
|
||||||
|
<block v-for="(item,index) in hotWords" :key='index'>
|
||||||
|
<swiper-item catchtouchmove='catchTouchMove'>
|
||||||
|
<view class='acea-row row-between-wrapper'>
|
||||||
|
<view class='text acea-row row-between-wrapper'>
|
||||||
|
<view class='newsTitle line1'>{{item.val}}</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</swiper-item>
|
||||||
|
</block>
|
||||||
|
</swiper>
|
||||||
|
</view>
|
||||||
|
<text class="iconfont icon-xiazai5"></text>
|
||||||
|
</navigator>
|
||||||
|
<navigator v-else url="/pages/columnGoods/goods_search/index" :class="(logoConfig || site_logo) ? 'input' : 'uninput'"
|
||||||
|
hover-class="none" class="skeleton-rect">
|
||||||
|
搜索商品
|
||||||
|
<text class="iconfont icon-xiazai5"></text>
|
||||||
|
</navigator>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view :style="'height:'+marTop+'px;'"></view>
|
||||||
|
</view>
|
||||||
|
<!-- #endif -->
|
||||||
|
<!--选项卡-->
|
||||||
|
<view style="visibility: hidden;" :style="{ height: navHeight + 'px' }"></view>
|
||||||
|
<view class="navTabBox tabNav" :class="{bgwhite:isScrolled}" :style="'top:'+isTop+'px'">
|
||||||
|
<view class="longTab" :style='"width:"+mainWidth+"px"'>
|
||||||
|
<scroll-view scroll-x="true" style="white-space: nowrap; display: flex;" scroll-with-animation :scroll-left="tabLeft" show-scrollbar="true">
|
||||||
|
<view class="longItem" :data-index="index" :class="index===tabClick?'click':''" @click="changeTab(item,index)" v-for="(item,index) in tabTitle" :key="index" :id="'id'+index">{{item.info[0].value}}</view>
|
||||||
|
<view class="underlineBox" :style='"transform:translateX("+isLeft+"px);width:"+isWidth+"px"'>
|
||||||
|
<view class="underline"></view>
|
||||||
|
</view>
|
||||||
|
</scroll-view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<!--轮播图-->
|
||||||
|
<view class="swiperBg" :style="{ marginTop: swiperTop+'px'}">
|
||||||
|
<block>
|
||||||
|
<view class="swiper page_swiper"
|
||||||
|
v-if="imgUrls.length">
|
||||||
|
<swiper
|
||||||
|
:autoplay="true"
|
||||||
|
:circular="circular"
|
||||||
|
:interval="intervals"
|
||||||
|
:duration="duration"
|
||||||
|
indicator-color="rgba(255,255,255,0.6)"
|
||||||
|
indicator-active-color="#fff"
|
||||||
|
:current="swiperCur"
|
||||||
|
previous-margin="30rpx"
|
||||||
|
next-margin="30rpx"
|
||||||
|
@change="swiperChange"
|
||||||
|
:class="{ scalex:isScale }"
|
||||||
|
>
|
||||||
|
<block v-for="(item,index) in imgUrls" :key="index">
|
||||||
|
<swiper-item :class="{ active: index == swiperCur,scalex:isScale }">
|
||||||
|
<view @click="goDetail(item)" class='slide-navigator acea-row row-between-wrapper'>
|
||||||
|
<image :src="item.img" class="slide-image aa"></image>
|
||||||
|
</view>
|
||||||
|
</swiper-item>
|
||||||
|
</block>
|
||||||
|
</swiper>
|
||||||
|
<view class="dots">
|
||||||
|
<block v-for="(item,index) in imgUrls" :key="index">
|
||||||
|
<view class="dot" :class="index == swiperCur ? ' active' : ''"></view>
|
||||||
|
</block>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</block>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
let statusBarHeight = uni.getSystemInfoSync().statusBarHeight + 'px';
|
||||||
|
import { configMap } from '@/utils';
|
||||||
|
export default {
|
||||||
|
name: 'homeComb',
|
||||||
|
props: {
|
||||||
|
dataConfig: {
|
||||||
|
type: Object,
|
||||||
|
default: () => {}
|
||||||
|
},
|
||||||
|
isScrolled: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
|
},
|
||||||
|
isScale: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
|
},
|
||||||
|
isMenu: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
|
},
|
||||||
|
userInfo: {
|
||||||
|
type: Object,
|
||||||
|
default: () => {}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
computed: configMap({site_logo: ''}),
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
statusBarHeight: statusBarHeight,
|
||||||
|
scrollHeight: 0,
|
||||||
|
autoplay: true,
|
||||||
|
interval: this.dataConfig.titleConfig.value * 1000 || 2500,
|
||||||
|
duration: 500,
|
||||||
|
marTop: 50,
|
||||||
|
searchH: 0,
|
||||||
|
logoConfig: this.dataConfig.logoConfig.url,
|
||||||
|
hotWords: this.dataConfig.hotWords.list || [],
|
||||||
|
tabClick: 0, //导航栏被点击
|
||||||
|
isLeft: 0, //导航栏下划线位置
|
||||||
|
isWidth: 0, //每个导航栏占位
|
||||||
|
mainWidth: 0,
|
||||||
|
tabLeft:0,
|
||||||
|
swiperIndex:0,
|
||||||
|
childIndex:0,
|
||||||
|
childID:0,
|
||||||
|
tabTitle:this.dataConfig.listConfig.list,
|
||||||
|
fixedTop: 0,
|
||||||
|
isTop: 0,
|
||||||
|
navHeight: 38,
|
||||||
|
homeTop: 20,
|
||||||
|
indicatorDots: false,
|
||||||
|
circular: true,
|
||||||
|
autoplay: true,
|
||||||
|
intervals: 3000,
|
||||||
|
duration: 500,
|
||||||
|
imgUrls: [], //图片轮播数据
|
||||||
|
imageH: 310,
|
||||||
|
swiperCur: 0,
|
||||||
|
swiperType: 1,
|
||||||
|
searchVal: this.dataConfig.hotWords && this.dataConfig.hotWords.list[0]['val'] || '',
|
||||||
|
bgColor: this.dataConfig.swiperConfig.list && this.dataConfig.swiperConfig.list[0]['img'],
|
||||||
|
tabId: false,
|
||||||
|
isCategory: false,
|
||||||
|
swiperTop: 0,
|
||||||
|
isFixed: true,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
watch: {
|
||||||
|
imageH(nVal, oVal) {
|
||||||
|
let self = this
|
||||||
|
this.imageH = nVal
|
||||||
|
},
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
var that = this
|
||||||
|
// 获取设备宽度
|
||||||
|
uni.getSystemInfo({
|
||||||
|
success(e) {
|
||||||
|
that.mainWidth = e.windowWidth
|
||||||
|
that.isWidth = (e.windowWidth-65) / 8
|
||||||
|
}
|
||||||
|
})
|
||||||
|
setTimeout((e) => {
|
||||||
|
const query = uni.createSelectorQuery().in(this);
|
||||||
|
query.select('.navTabBox').boundingClientRect(data => {
|
||||||
|
// that.navHeight = data.height
|
||||||
|
that.navHeight = data.height > 42 ? data.height : 42
|
||||||
|
}).exec();
|
||||||
|
// #ifdef H5
|
||||||
|
query.select('.header').boundingClientRect(data => {
|
||||||
|
that.isTop = data.height
|
||||||
|
that.marTop = data.height
|
||||||
|
}).exec();
|
||||||
|
// #endif
|
||||||
|
// #ifdef MP || APP-PLUS
|
||||||
|
// #ifdef APP-PLUS
|
||||||
|
const menuButton = 0
|
||||||
|
//#endif
|
||||||
|
// #ifdef MP
|
||||||
|
const menuButton = uni.getMenuButtonBoundingClientRect();
|
||||||
|
//#endif
|
||||||
|
query
|
||||||
|
.select('.mp-header')
|
||||||
|
.boundingClientRect(data => {
|
||||||
|
this.homeTop = menuButton.top * 2 + menuButton.height - data.height;
|
||||||
|
this.marTop = data.height
|
||||||
|
}).exec();
|
||||||
|
//#endif
|
||||||
|
}, 100)
|
||||||
|
that.isTop = (uni.getSystemInfoSync().statusBarHeight + 43)
|
||||||
|
that.imgUrls = that.dataConfig.swiperConfig.list
|
||||||
|
that.$nextTick(function() {
|
||||||
|
setTimeout((e) => {
|
||||||
|
// #ifdef H5
|
||||||
|
that.swiperTop = that.navHeight+that.marTop+(uni.getSystemInfoSync().statusBarHeight)
|
||||||
|
//#endif
|
||||||
|
// #ifdef MP
|
||||||
|
that.swiperTop = that.navHeight+that.marTop
|
||||||
|
// that.swiperTop = that.navHeight + that.marTop + 20
|
||||||
|
//#endif
|
||||||
|
// #ifdef APP-PLUS
|
||||||
|
that.swiperTop = uni.getSystemInfoSync().statusBarHeight + 50 + 30
|
||||||
|
//#endif
|
||||||
|
}, 500)
|
||||||
|
})
|
||||||
|
},
|
||||||
|
mounted(){
|
||||||
|
let that = this;
|
||||||
|
if(that.tabTitle[0]['value'] != '推荐'){
|
||||||
|
that.tabTitle.unshift({
|
||||||
|
img: '',
|
||||||
|
info: [{value: "推荐"},{value: false}]
|
||||||
|
})
|
||||||
|
}
|
||||||
|
that.$nextTick(function() {
|
||||||
|
uni.getImageInfo({
|
||||||
|
src: that.setDomain(that.imgUrls[0].img),
|
||||||
|
success: function(res) {
|
||||||
|
that.$set(that, 'imageH', res.height);
|
||||||
|
},
|
||||||
|
fail: function(error) {
|
||||||
|
that.$set(that, 'imageH', 310);
|
||||||
|
// console.log(error, 'error')
|
||||||
|
}
|
||||||
|
})
|
||||||
|
})
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
goDetail(url){
|
||||||
|
let urls = url.info[1].value
|
||||||
|
if(urls.indexOf("http") != -1){
|
||||||
|
// #ifdef H5
|
||||||
|
location.href = urls
|
||||||
|
// #endif
|
||||||
|
}else{
|
||||||
|
if(['/pages/goods_cate/goods_cate','/pages/order_addcart/order_addcart','/pages/user/index','/pages/plant_grass/index'].indexOf(urls) == -1){
|
||||||
|
uni.navigateTo({
|
||||||
|
url:urls
|
||||||
|
})
|
||||||
|
}else{
|
||||||
|
uni.switchTab({
|
||||||
|
url:urls
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
//替换安全域名
|
||||||
|
setDomain: function(url) {
|
||||||
|
url = url ? url.toString() : '';
|
||||||
|
//本地调试打开,生产请注销
|
||||||
|
if (url.indexOf("https://") > -1) return url;
|
||||||
|
else return url.replace('http://', 'https://');
|
||||||
|
},
|
||||||
|
swiperChange(e) {
|
||||||
|
let { current, source } = e.detail;
|
||||||
|
if (source === 'autoplay' || source === 'touch') {
|
||||||
|
this.swiperCur = e.detail.current;
|
||||||
|
this.bgColor = this.imgUrls[e.detail.current]['img']
|
||||||
|
}
|
||||||
|
},
|
||||||
|
textChange(e) {
|
||||||
|
let { current, source } = e.detail;
|
||||||
|
if (source === 'autoplay' || source === 'touch') {
|
||||||
|
this.searchVal = this.hotWords[e.detail.current]['val']
|
||||||
|
}
|
||||||
|
},
|
||||||
|
/**显示全部分类*/
|
||||||
|
showCategory() {
|
||||||
|
this.isCategory = true;
|
||||||
|
},
|
||||||
|
/*跳转为页面*/
|
||||||
|
changeTab(item, index) {
|
||||||
|
if(this.tabClick == index) return
|
||||||
|
this.tabClick = index //设置导航点击了哪一个
|
||||||
|
this.isLeft = index * this.isWidth + 16 //设置下划线位置
|
||||||
|
this.tabId = item.info[1].value
|
||||||
|
this.bgColor = this.tabId ? item.img : this.dataConfig.swiperConfig.list[0]['img']
|
||||||
|
this.imgUrls = this.tabId ? [{img:item.img}] : this.dataConfig.swiperConfig.list
|
||||||
|
this.$emit('changeDiy', this.tabId);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.page_count {
|
||||||
|
position: relative;
|
||||||
|
overflow: hidden;
|
||||||
|
.bg-img {
|
||||||
|
position: absolute;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
top: 0;
|
||||||
|
/* #ifdef MP || APP-PLUS */
|
||||||
|
z-index: -1;
|
||||||
|
/* #endif */
|
||||||
|
/* #ifdef H5 */
|
||||||
|
z-index: 0;
|
||||||
|
/* #endif */
|
||||||
|
z-index: 0;
|
||||||
|
filter: blur(0);
|
||||||
|
overflow: hidden;
|
||||||
|
img {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
filter: blur(30rpx);
|
||||||
|
transform: scale(1.5);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.my-main{
|
||||||
|
transition: background-color .5s ease;
|
||||||
|
}
|
||||||
|
.swiperTxt {
|
||||||
|
width: 300rpx;
|
||||||
|
line-height: 64rpx;
|
||||||
|
height: 64rpx;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
.swiperTxt .text {
|
||||||
|
width: 480rpx;
|
||||||
|
}
|
||||||
|
.swiperTxt .text .newsTitle {
|
||||||
|
width: 300rpx;
|
||||||
|
font-size: 24rpx;
|
||||||
|
color: #ffffff;
|
||||||
|
}
|
||||||
|
.swiperTxt swiper {
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
.header {
|
||||||
|
z-index: 99;
|
||||||
|
position: fixed;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
.btn {
|
||||||
|
position: relative;
|
||||||
|
margin-left: 30rpx;
|
||||||
|
.iconfont {
|
||||||
|
font-size: 45rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.iconnum {
|
||||||
|
min-width: 14rpx;
|
||||||
|
color: #E93323;
|
||||||
|
background: #fff;
|
||||||
|
border-radius: 15rpx;
|
||||||
|
position: absolute;
|
||||||
|
right: -10rpx;
|
||||||
|
top: -10rpx;
|
||||||
|
font-size: 10px;
|
||||||
|
padding: 0 5px;
|
||||||
|
}
|
||||||
|
.serch-wrapper {
|
||||||
|
align-items: center;
|
||||||
|
padding: 20rpx 30rpx 20rpx 30rpx;
|
||||||
|
.logo {
|
||||||
|
width: 133rpx;
|
||||||
|
margin-right: 20rpx;
|
||||||
|
}
|
||||||
|
image {
|
||||||
|
width: 133rpx;
|
||||||
|
height: 66rpx;
|
||||||
|
}
|
||||||
|
.box{
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
|
.input,.uninput {
|
||||||
|
line-height: 64rpx;
|
||||||
|
height: 64rpx;
|
||||||
|
padding: 0 0 0 30rpx;
|
||||||
|
background: rgba(0,0,0,.2);
|
||||||
|
color: #fff;
|
||||||
|
border-radius: 30rpx;
|
||||||
|
font-size: 28rpx;
|
||||||
|
z-index: 2;
|
||||||
|
position: relative;
|
||||||
|
box-sizing: border-box;
|
||||||
|
.iconfont {
|
||||||
|
position: absolute;
|
||||||
|
right: 20rpx;
|
||||||
|
top: 0;
|
||||||
|
color: #eeeeee;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.mp-header {
|
||||||
|
z-index: 99;
|
||||||
|
position: fixed;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
.box{
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
|
.serch-wrapper {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
padding: 0 50rpx 0 30rpx;
|
||||||
|
height: 76rpx;
|
||||||
|
.logo {
|
||||||
|
width: 133rpx;
|
||||||
|
margin-right: 20rpx;
|
||||||
|
line-height: 0;
|
||||||
|
}
|
||||||
|
image {
|
||||||
|
width: 118rpx;
|
||||||
|
height: 42rpx;
|
||||||
|
}
|
||||||
|
.input,.uninput {
|
||||||
|
display: flex;
|
||||||
|
/* #ifdef MP */
|
||||||
|
flex: 0;
|
||||||
|
/* #endif */
|
||||||
|
/* #ifdef APP-PLUS */
|
||||||
|
flex: 1;
|
||||||
|
/* #endif */
|
||||||
|
flex: 1;
|
||||||
|
align-items: center;
|
||||||
|
height: 64rpx;
|
||||||
|
line-height: 64rpx;
|
||||||
|
padding: 0 50rpx 0 30rpx;
|
||||||
|
background: rgba(0,0,0,.2);
|
||||||
|
border-radius: 100rpx;
|
||||||
|
color: #ffffff;
|
||||||
|
font-size: 28rpx;
|
||||||
|
position: relative;
|
||||||
|
box-sizing: border-box;
|
||||||
|
.iconfont {
|
||||||
|
position: absolute;
|
||||||
|
right: 20rpx;
|
||||||
|
top: 0;
|
||||||
|
color: #eeeeee;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
/* #ifdef MP */
|
||||||
|
.uninput{
|
||||||
|
max-width: 500rpx;
|
||||||
|
}
|
||||||
|
.input{
|
||||||
|
max-width: 340rpx;
|
||||||
|
}
|
||||||
|
/* #endif */
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.tabNav {
|
||||||
|
padding-top: 10rpx;
|
||||||
|
}
|
||||||
|
.navTabBox {
|
||||||
|
color: rgba(255, 255, 255, 1);
|
||||||
|
padding: 0 30rpx;
|
||||||
|
z-index: 10;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
box-sizing: border-box;
|
||||||
|
position: fixed;
|
||||||
|
&.isFixed {
|
||||||
|
z-index: 30;
|
||||||
|
position: fixed;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
/* #ifdef H5 */
|
||||||
|
top: 0;
|
||||||
|
/* #endif */
|
||||||
|
}
|
||||||
|
scroll-view{
|
||||||
|
width:100%;
|
||||||
|
padding-right: 30rpx;
|
||||||
|
height: 70rpx;
|
||||||
|
}
|
||||||
|
.click {
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
.longTab {
|
||||||
|
.longItem{
|
||||||
|
height: 50upx;
|
||||||
|
display: inline-block;
|
||||||
|
line-height: 50upx;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 28rpx;
|
||||||
|
color: #FFFFFF;
|
||||||
|
max-width: 160rpx;
|
||||||
|
margin-right: 30rpx;
|
||||||
|
position: relative;
|
||||||
|
&:last-child{
|
||||||
|
margin-right: 0;
|
||||||
|
}
|
||||||
|
&.click{
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 30rpx;
|
||||||
|
color: #FFFFFF;
|
||||||
|
&::after{
|
||||||
|
content: '';
|
||||||
|
transition: .5s;
|
||||||
|
width: 33rpx;
|
||||||
|
height: 4rpx;
|
||||||
|
background: #FFFFFF;
|
||||||
|
position: absolute;
|
||||||
|
bottom: -4rpx;
|
||||||
|
left: 50%;
|
||||||
|
margin-left: -16rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.scrolled{
|
||||||
|
z-index: 5000;
|
||||||
|
position: fixed;
|
||||||
|
min-height: 180rpx;
|
||||||
|
left: 0;
|
||||||
|
top: 0;
|
||||||
|
width: 100%;
|
||||||
|
background: #fff!important;
|
||||||
|
transition: background-color .5s ease;
|
||||||
|
.longItem,.click,.category text{
|
||||||
|
color: #000000!important;
|
||||||
|
}
|
||||||
|
.navTabBox,.mp-header{
|
||||||
|
transition: background-color .5s ease;
|
||||||
|
}
|
||||||
|
.btn .iconfont{
|
||||||
|
color: #333333!important;
|
||||||
|
}
|
||||||
|
.iconnum{
|
||||||
|
background: #333333!important;
|
||||||
|
}
|
||||||
|
.underline{
|
||||||
|
background: #000000!important;
|
||||||
|
}
|
||||||
|
.click{
|
||||||
|
&::after{
|
||||||
|
background-color:#fff!important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.swiperBg {
|
||||||
|
z-index: 1;
|
||||||
|
margin-top: 10rpx;
|
||||||
|
padding-bottom: 30rpx;
|
||||||
|
.colorBg {
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
top: 0;
|
||||||
|
height: 130rpx;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
.page_swiper {
|
||||||
|
position: relative;
|
||||||
|
width: 100%;
|
||||||
|
height: auto;
|
||||||
|
margin: 0 auto;
|
||||||
|
border-radius: 10rpx;
|
||||||
|
overflow-x: hidden;
|
||||||
|
z-index: 8;
|
||||||
|
padding: 0 10rpx;
|
||||||
|
swiper-item{
|
||||||
|
border-radius: 10rpx;
|
||||||
|
}
|
||||||
|
.swiper-item, image, .acea-row.row-between-wrapper {
|
||||||
|
width: 100%;
|
||||||
|
height:100%;
|
||||||
|
margin: 0 auto;
|
||||||
|
border-radius: 10rpx;
|
||||||
|
}
|
||||||
|
swiper{
|
||||||
|
width: 100%;
|
||||||
|
display: block;
|
||||||
|
height: 308rpx;
|
||||||
|
&.scalex{
|
||||||
|
/deep/.uni-swiper-slide-frame{
|
||||||
|
transform: translate(0,0)!important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
image {
|
||||||
|
transform: scale(0.93);
|
||||||
|
transition: all 0.6s ease;
|
||||||
|
}
|
||||||
|
swiper-item.active, swiper-item.scalex{
|
||||||
|
image {
|
||||||
|
transform: scale(1);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
/*用来包裹所有的小圆点 */
|
||||||
|
.dots {
|
||||||
|
width: 156rpx;
|
||||||
|
height: 36rpx;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: row;
|
||||||
|
position: absolute;
|
||||||
|
left: 320rpx;
|
||||||
|
bottom: 0;
|
||||||
|
}
|
||||||
|
/*未选中时的小圆点样式 */
|
||||||
|
.dot {
|
||||||
|
width: 16rpx;
|
||||||
|
height: 6rpx;
|
||||||
|
border-radius: 6rpx;
|
||||||
|
margin-right: 6rpx;
|
||||||
|
background-color: rgba(255,255,255,.4);
|
||||||
|
/*选中以后的小圆点样式 */
|
||||||
|
&.active {
|
||||||
|
width: 32rpx;
|
||||||
|
height: 6rpx;
|
||||||
|
background-color: rgba(255,255,255,.4);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
/deep/.dot0 .uni-swiper-dots-horizontal{
|
||||||
|
left: 10%;
|
||||||
|
}
|
||||||
|
/deep/.dot1 .uni-swiper-dots-horizontal{
|
||||||
|
left: 50%;
|
||||||
|
}
|
||||||
|
/deep/.dot2 .uni-swiper-dots-horizontal{
|
||||||
|
left: 90%;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
298
pages/index/component/hotRanking.vue
Normal file
298
pages/index/component/hotRanking.vue
Normal file
@ -0,0 +1,298 @@
|
|||||||
|
<template>
|
||||||
|
<view v-if="rankingData" class="rank_card bg-white">
|
||||||
|
<view class="cross">
|
||||||
|
<view class="cross_rank_header acea-row row-between row-middle">
|
||||||
|
<view class="rank_logo">
|
||||||
|
<image class="title-img" :src="`${domain}/static/images/rank_title.png`" alt=""></image>
|
||||||
|
</view>
|
||||||
|
<navigator url="/pages/activity/rank/index" hover-class="none" class="session">更多 <text class="iconfont icon-jiantou" hover-class="none"></text></navigator>
|
||||||
|
</view>
|
||||||
|
<view class="scroll_box">
|
||||||
|
<scroll-view scroll-x="true" style="white-space: nowrap; vertical-align: middle;"
|
||||||
|
show-scrollbar="false">
|
||||||
|
<view class="scroll_item" v-for="(item,idx) in rankingData" :key="idx" v-if="item.list.length > 0" :style="'border-radius:'+bgStyle+'rpx'">
|
||||||
|
<view>
|
||||||
|
<block v-if="item.list.length == 1">
|
||||||
|
<navigator :url="'/pages/activity/rank/index?cate_id='+item.cate_id" hover-class="none" class="acea-row row-between">
|
||||||
|
<view class="left_count" :style="'border-radius:'+conStyle+'rpx'">
|
||||||
|
<view class="left_pic">
|
||||||
|
<view class="picture" :class="'border'+conStyle">
|
||||||
|
<easy-loadimage mode="widthFix" :image-src="item.list[0]['image']"></easy-loadimage>
|
||||||
|
</view>
|
||||||
|
<view class="rank acea-row row-center row-middle">01</view>
|
||||||
|
</view>
|
||||||
|
<view class="cate_name">
|
||||||
|
<text class="rank_tit line1">{{item.cate_name}}</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="acea-row row-column row-between">
|
||||||
|
<view class="right_pic">
|
||||||
|
<view class="picture" :class="'border'+conStyle">
|
||||||
|
<easy-loadimage mode="widthFix" :image-src="item.list[0]['image']"></easy-loadimage>
|
||||||
|
</view>
|
||||||
|
<view class="rank acea-row row-center row-middle">02</view>
|
||||||
|
</view>
|
||||||
|
<view class="right_pic">
|
||||||
|
<view class="picture" :class="'border'+conStyle">
|
||||||
|
<easy-loadimage mode="widthFix" :image-src="item.list[0]['image']"></easy-loadimage>
|
||||||
|
</view>
|
||||||
|
<view class="rank acea-row row-center row-middle">03</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</navigator>
|
||||||
|
</block>
|
||||||
|
<block v-if="item.list.length == 2">
|
||||||
|
<navigator :url="'/pages/activity/rank/index?cate_id='+item.cate_id" hover-class="none" class="acea-row row-between">
|
||||||
|
<view class="left_count" :style="'border-radius:'+conStyle+'rpx'">
|
||||||
|
<view class="left_pic">
|
||||||
|
<view class="picture" :class="'border'+conStyle">
|
||||||
|
<easy-loadimage mode="widthFix" :image-src="item.list[0]['image']"></easy-loadimage>
|
||||||
|
</view>
|
||||||
|
<view class="rank acea-row row-center row-middle">01</view>
|
||||||
|
</view>
|
||||||
|
<view class="cate_name">
|
||||||
|
<text class="rank_tit line1">{{item.cate_name}}</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="acea-row row-column row-between">
|
||||||
|
<view class="right_pic">
|
||||||
|
<view class="picture" :class="'border'+conStyle">
|
||||||
|
<easy-loadimage mode="widthFix" :image-src="item.list[1]['image']"></easy-loadimage>
|
||||||
|
</view>
|
||||||
|
<view class="rank acea-row row-center row-middle">02</view>
|
||||||
|
</view>
|
||||||
|
<view class="right_pic">
|
||||||
|
<view class="picture" :class="'border'+conStyle">
|
||||||
|
<easy-loadimage mode="widthFix" :image-src="item.list[1]['image']"></easy-loadimage>
|
||||||
|
</view>
|
||||||
|
<view class="rank acea-row row-center row-middle">03</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</navigator>
|
||||||
|
</block>
|
||||||
|
<block v-if="item.list.length >= 3">
|
||||||
|
<navigator :url="'/pages/activity/rank/index?cate_id='+item.cate_id" hover-class="none" class="acea-row row-between">
|
||||||
|
<view class="left_count" :style="'border-radius:'+conStyle+'rpx'">
|
||||||
|
<view class="left_pic">
|
||||||
|
<view class="picture" :class="'border'+conStyle">
|
||||||
|
<easy-loadimage mode="widthFix" :image-src="item.list[0]['image']"></easy-loadimage>
|
||||||
|
</view>
|
||||||
|
<view class="rank acea-row row-center row-middle">01</view>
|
||||||
|
</view>
|
||||||
|
<view class="cate_name">
|
||||||
|
<text class="rank_tit line1">{{item.cate_name}}</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="acea-row row-column row-between">
|
||||||
|
<view class="right_pic">
|
||||||
|
<view class="picture" :class="'border'+conStyle">
|
||||||
|
<easy-loadimage mode="widthFix" :image-src="item.list[1]['image']"></easy-loadimage>
|
||||||
|
</view>
|
||||||
|
<view class="rank acea-row row-center row-middle">02</view>
|
||||||
|
</view>
|
||||||
|
<view class="right_pic">
|
||||||
|
<view class="picture" :class="'border'+conStyle">
|
||||||
|
<easy-loadimage mode="widthFix" :image-src="item.list[2]['image']"></easy-loadimage>
|
||||||
|
</view>
|
||||||
|
<view class="rank acea-row row-center row-middle">03</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</navigator>
|
||||||
|
</block>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</scroll-view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
import { HTTP_REQUEST_URL } from '@/config/app';
|
||||||
|
import { hotRankingApi } from '@/api/activity.js'
|
||||||
|
import easyLoadimage from '@/components/easy-loadimage/easy-loadimage.vue'
|
||||||
|
export default {
|
||||||
|
name: 'hotRanking',
|
||||||
|
components:{easyLoadimage},
|
||||||
|
props:{
|
||||||
|
dataConfig: {
|
||||||
|
type: Object,
|
||||||
|
default: () => {}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
data(){
|
||||||
|
return {
|
||||||
|
domain: HTTP_REQUEST_URL,
|
||||||
|
mbConfig: this.dataConfig.mbConfig.val*2,
|
||||||
|
list: this.dataConfig.cateConfig.list,
|
||||||
|
bgStyle: this.dataConfig.bgStyle.type ? 16 : 0,
|
||||||
|
conStyle: this.dataConfig.conStyle.type ? 10 : 0,
|
||||||
|
unique: this.dataConfig.timestamp,
|
||||||
|
rankingData: {},
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.getData();
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
getData: function() {
|
||||||
|
let that = this;
|
||||||
|
let data = {
|
||||||
|
unique: that.unique,
|
||||||
|
cate_pid: that.getCateId(),
|
||||||
|
};
|
||||||
|
hotRankingApi(data).then(res => {
|
||||||
|
that.rankingData = res.data
|
||||||
|
}).catch(err => {
|
||||||
|
return that.$util.Tips({
|
||||||
|
title: err
|
||||||
|
});
|
||||||
|
});
|
||||||
|
},
|
||||||
|
//获取分类id
|
||||||
|
getCateId(){
|
||||||
|
let arr = []
|
||||||
|
this.list.forEach((item, i) => {
|
||||||
|
arr.push(item.cate)
|
||||||
|
});
|
||||||
|
return arr.toString()
|
||||||
|
},
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.cross_rank_header{
|
||||||
|
padding: 30rpx 20rpx 0 40rpx;
|
||||||
|
.icon-jiantou{
|
||||||
|
font-size: 24rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.rank_logo{
|
||||||
|
position: relative;
|
||||||
|
.title-img{
|
||||||
|
width: 136rpx;
|
||||||
|
height: 36rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.session{
|
||||||
|
font-size: 24rpx;
|
||||||
|
color: #323232;
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
.scroll_box {
|
||||||
|
width: 750rpx;
|
||||||
|
margin-top: 24rpx;
|
||||||
|
padding-left: 32rpx;
|
||||||
|
}
|
||||||
|
.scroll_item {
|
||||||
|
display: inline-block;
|
||||||
|
background-color: #FFFFFF;
|
||||||
|
width: 414rpx;
|
||||||
|
padding: 20rpx;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
}
|
||||||
|
.scroll_item~.scroll_item {
|
||||||
|
margin-left: 20rpx;
|
||||||
|
}
|
||||||
|
.left_count{
|
||||||
|
width: 230rpx;
|
||||||
|
background: #FFF6F5;
|
||||||
|
border-radius: 10rpx;;
|
||||||
|
.cate_name{
|
||||||
|
margin-top: 10rpx;
|
||||||
|
text-align: center;
|
||||||
|
.rank_tit{
|
||||||
|
padding: 0 35rpx;
|
||||||
|
color: #E93323;
|
||||||
|
font-size: 26rpx;
|
||||||
|
font-weight: bold;
|
||||||
|
position: relative;
|
||||||
|
max-width: 230rpx;
|
||||||
|
display: inline-block;
|
||||||
|
&::before,&::after{
|
||||||
|
content: '';
|
||||||
|
display: inline-block;
|
||||||
|
width: 22rpx;
|
||||||
|
height: 30rpx;
|
||||||
|
background-image: url('../../activity/static/images/rank_cate.png');
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
position: absolute;
|
||||||
|
}
|
||||||
|
&::before{
|
||||||
|
left: 0;
|
||||||
|
}
|
||||||
|
&::after{
|
||||||
|
right: 0;
|
||||||
|
transform: rotateY(180deg);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.left_pic{
|
||||||
|
width: 230rpx;
|
||||||
|
height: 230rpx;
|
||||||
|
border-radius: 10rpx;
|
||||||
|
position: relative;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
.picture,/deep/image,/deep/.easy-loadimage,/deep/uni-image {
|
||||||
|
width: 200rpx!important;
|
||||||
|
height: 200rpx!important;
|
||||||
|
border-radius: 10rpx;
|
||||||
|
}
|
||||||
|
.border0{
|
||||||
|
border-radius: 0;
|
||||||
|
/deep/image,/deep/.easy-loadimage,/deep/uni-image{
|
||||||
|
border-radius: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.border10{
|
||||||
|
border-radius: 10rpx;
|
||||||
|
/deep/image,/deep/.easy-loadimage,/deep/uni-image{
|
||||||
|
border-radius: 10rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.rank {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 10rpx;
|
||||||
|
width: 50rpx;
|
||||||
|
height: 61rpx;
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 32rpx;
|
||||||
|
color: #CE8F21;;
|
||||||
|
background-image: url('../../activity/static/images/rank.png');
|
||||||
|
background-size: cover;
|
||||||
|
font-family: '黑体';
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.right_pic{
|
||||||
|
width: 124rpx;
|
||||||
|
height: 124rpx;
|
||||||
|
position: relative;
|
||||||
|
border-radius: 8rpx;
|
||||||
|
&:first-child{
|
||||||
|
margin-bottom: 20rpx;
|
||||||
|
}
|
||||||
|
.picture,/deep/image,/deep/.easy-loadimage,/deep/uni-image {
|
||||||
|
width: 124rpx!important;
|
||||||
|
height: 124rpx!important;
|
||||||
|
border-radius: 8rpx;
|
||||||
|
}
|
||||||
|
.rank {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 6rpx;
|
||||||
|
width: 30rpx;
|
||||||
|
height: 36rpx;
|
||||||
|
font-size: 16rpx;
|
||||||
|
font-weight: bold;
|
||||||
|
color: #CE8F21;;
|
||||||
|
background-image: url('../../activity/static/images/rank.png');
|
||||||
|
background-size: cover;
|
||||||
|
font-family: '黑体';
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
8
pages/index/component/index.js
Normal file
8
pages/index/component/index.js
Normal file
@ -0,0 +1,8 @@
|
|||||||
|
const path = require('path')
|
||||||
|
const files = require.context('./', false, /\.vue$/)
|
||||||
|
const modules = {}
|
||||||
|
files.keys().forEach(key => {
|
||||||
|
const name = path.basename(key, '.vue')
|
||||||
|
modules[name] = files(key).default || files(key)
|
||||||
|
})
|
||||||
|
export default modules
|
||||||
561
pages/index/component/liveBroadcast.vue
Normal file
561
pages/index/component/liveBroadcast.vue
Normal file
@ -0,0 +1,561 @@
|
|||||||
|
<template>
|
||||||
|
<!-- #ifdef MP -->
|
||||||
|
<view v-if="liveList.length > 0" style="margin: 0 20rpx;">
|
||||||
|
<view class="wrapper-count" :style="[{'margin-top': mbConfig + 'rpx'},{'background':bg},{'border-radius':bgStyle+'rpx'}]">
|
||||||
|
<view class="spike-bd">
|
||||||
|
<view class="title line1"><image class="title-img" :src="`${domain}/static/images/broadcast_title.png`"></image></view>
|
||||||
|
<navigator v-if="!merId" url="/pages/activity/liveBroadcast/index" class="more-btn" hover-class="none">
|
||||||
|
进入频道
|
||||||
|
<text class="iconfont icon-jiantou" hover-class="none"></text>
|
||||||
|
</navigator>
|
||||||
|
</view>
|
||||||
|
<!-- 直播 -->
|
||||||
|
<block v-if="listStyle == 0">
|
||||||
|
<view class="live-wrapper mores">
|
||||||
|
<scroll-view scroll-x="true" style="white-space: nowrap; display: flex">
|
||||||
|
<view class="item" v-for="(item, index) in liveList" :key="index">
|
||||||
|
<navigator hover-class="none" :url="'plugin-private://wx2b03c6e691cd7370/pages/live-player-plugin?room_id=' + item.room_id">
|
||||||
|
<view
|
||||||
|
class="live-top"
|
||||||
|
:style="'background:' + (item.live_status == 101 ? playBg : item.live_status != 101 && item.live_status != 102 ? endBg : notBg) + ';'"
|
||||||
|
:class="item.live_status == 102 ? 'playRadius' : 'notPlayRadius'"
|
||||||
|
>
|
||||||
|
<view v-if="item.live_status == 101">
|
||||||
|
<image :src="`${domain}/static/images/live-01.png`" mode=""></image>
|
||||||
|
<text>直播中</text>
|
||||||
|
</view>
|
||||||
|
<view v-if="item.live_status == 103 && item.replay_status === 1">
|
||||||
|
<image :src="`${domain}/static/images/live-02.png`" mode=""></image>
|
||||||
|
<text>回放</text>
|
||||||
|
</view>
|
||||||
|
<view v-if="(item.live_status != 101 && item.live_status != 102 && item.live_status != 103) || (item.live_status == 103 && item.replay_status == 0)">
|
||||||
|
<image :src="`${domain}/static/images/live-02.png`" mode=""></image>
|
||||||
|
<text>已结束</text>
|
||||||
|
</view>
|
||||||
|
<view v-if="item.live_status == 102">
|
||||||
|
<image :src="`${domain}/static/images/live-03.png`" mode=""></image>
|
||||||
|
<text>预告</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view v-if="item.live_status == 101 || item.live_status == 102" class="broadcast-time">{{ item.show_time }}</view>
|
||||||
|
<easy-loadimage mode="widthFix" :image-src="item.share_img"></easy-loadimage>
|
||||||
|
</navigator>
|
||||||
|
</view>
|
||||||
|
</scroll-view>
|
||||||
|
</view>
|
||||||
|
</block>
|
||||||
|
<block v-if="listStyle == 1">
|
||||||
|
<view class="live-wrapper-a">
|
||||||
|
<navigator class="live-item-a" v-for="(item,index) in liveList" :key="index" :url="'plugin-private://wx2b03c6e691cd7370/pages/live-player-plugin?room_id=' + item.room_id" hover-class="none">
|
||||||
|
<view class="img-box">
|
||||||
|
<view class="label bgblue" v-if="item.live_status == 102">
|
||||||
|
<view class="txt">预告</view>
|
||||||
|
<view class="msg">{{item.show_time}}</view>
|
||||||
|
</view>
|
||||||
|
<view class="label bggary" v-if="item.live_status==103 && item.replay_status === 1">
|
||||||
|
<image :src="`${domain}/static/images/live-02.png`" mode="" style="width: 20rpx; height: 20rpx;"></image>
|
||||||
|
<text>回放</text>
|
||||||
|
</view>
|
||||||
|
<view class="label bgred" v-if="item.live_status==101">
|
||||||
|
<image :src="`${domain}/static/images/live-01.png`" mode="" style="width: 21rpx; height: 22rpx;"></image>
|
||||||
|
<text>直播中</text>
|
||||||
|
</view>
|
||||||
|
<view class="label bggary" v-if="(item.live_status != 101 && item.live_status != 102 && item.live_status != 103) || (item.live_status == 103 && item.replay_status == 0)">
|
||||||
|
<image :src="`${domain}/static/images/live-02.png`" mode=""></image>
|
||||||
|
<text>已结束</text>
|
||||||
|
</view>
|
||||||
|
<image :src="item.share_img"></image>
|
||||||
|
</view>
|
||||||
|
<view class="info">
|
||||||
|
<view class="title line2">{{item.name}}</view>
|
||||||
|
<view class="people">
|
||||||
|
<text>{{item.anchor_name}}</text>
|
||||||
|
</view>
|
||||||
|
<view class="goods-wrapper">
|
||||||
|
<block v-if="item.broadcast.length<=3 && item.broadcast.length > 0">
|
||||||
|
<view class="goods-item" v-for="(goods,index) in item.broadcast" :key="index">
|
||||||
|
<image :src="goods.goods.cover_img" alt="">
|
||||||
|
<text class="line1">￥{{goods.goods.price}}</text>
|
||||||
|
</view>
|
||||||
|
</block>
|
||||||
|
<block v-if=" item.broadcast.length>3">
|
||||||
|
<view class="goods-item" v-for="(goods,index) in item.broadcast" :key="index" v-if="index<2">
|
||||||
|
<image :src="goods.goods.cover_img" alt="">
|
||||||
|
<text class="line1">￥{{goods.goods.price}}</text>
|
||||||
|
</view>
|
||||||
|
<view class="goods-item">
|
||||||
|
<image :src="item.broadcast[item.broadcast.length-1].goods.cover_img" alt="">
|
||||||
|
<view class="num">+{{item.broadcast.length}}</view>
|
||||||
|
</view>
|
||||||
|
</block>
|
||||||
|
<block v-if="item.broadcast.length == 0">
|
||||||
|
<view class="empty-goods" >暂无商品</view>
|
||||||
|
</block>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</navigator>
|
||||||
|
</view>
|
||||||
|
</block>
|
||||||
|
<block v-if="listStyle == 2">
|
||||||
|
<view class="live-wrapper-b">
|
||||||
|
<navigator class="live-item-b" v-for="(item,index) in liveList" :key="index" :url="'plugin-private://wx2b03c6e691cd7370/pages/live-player-plugin?room_id=' + item.room_id" hover-class="none" :style="[{'box-shadow':`0px 1px 20px ${boxShadow}`}]">
|
||||||
|
<view class="img-box">
|
||||||
|
<view class="label bgblue" v-if="item.live_status == 102">
|
||||||
|
<view class="txt">预告</view>
|
||||||
|
<view class="msg">{{item.show_time}}</view>
|
||||||
|
</view>
|
||||||
|
<view class="label bggary" v-if="item.live_status==103 && item.replay_status === 1">
|
||||||
|
<image :src="`${domain}/static/images/live-02.png`" mode="" style="width: 20rpx; height: 20rpx;"></image>
|
||||||
|
<text>回放</text>
|
||||||
|
</view>
|
||||||
|
<view class="label bgred" v-if="item.live_status==101">
|
||||||
|
<image :src="`${domain}/static/images/live-01.png`" mode="" style="width: 21rpx; height: 22rpx;"></image>
|
||||||
|
<text>直播中</text>
|
||||||
|
</view>
|
||||||
|
<view class="label bggary" v-if="(item.live_status != 101 && item.live_status != 102 && item.live_status != 103) || (item.live_status == 103 && item.replay_status == 0)">
|
||||||
|
<image :src="`${domain}/static/images/live-02.png`" mode=""></image>
|
||||||
|
<text>已结束</text>
|
||||||
|
</view>
|
||||||
|
<image :src="item.share_img"></image>
|
||||||
|
</view>
|
||||||
|
<view class="info">
|
||||||
|
<view class="title line2">{{item.name}}</view>
|
||||||
|
<view class="people">
|
||||||
|
<text>{{item.anchor_name}}</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</navigator>
|
||||||
|
</view>
|
||||||
|
</block>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<!-- #endif -->
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { HTTP_REQUEST_URL } from '@/config/app';
|
||||||
|
import {getLiveList} from '@/api/store.js';
|
||||||
|
import easyLoadimage from '@/components/easy-loadimage/easy-loadimage.vue';
|
||||||
|
export default {
|
||||||
|
name: 'liveBroadcast',
|
||||||
|
components: {
|
||||||
|
easyLoadimage
|
||||||
|
},
|
||||||
|
props: {
|
||||||
|
dataConfig: {
|
||||||
|
type: Object,
|
||||||
|
default: () => {}
|
||||||
|
},
|
||||||
|
merId: {
|
||||||
|
type: String || Number,
|
||||||
|
default: ''
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
domain: HTTP_REQUEST_URL,
|
||||||
|
listStyle: this.dataConfig.listStyle.type,
|
||||||
|
bgStyle: this.dataConfig.bgStyle && this.dataConfig.bgStyle.type ? '16' : '0',
|
||||||
|
mbConfig: this.dataConfig.mbConfig.val*2,
|
||||||
|
liveList: [],
|
||||||
|
bg:this.dataConfig.bg.color[0].item,
|
||||||
|
endBg: 'linear-gradient(#666666, #999999)',
|
||||||
|
notBg: 'rgb(26, 163, 246)',
|
||||||
|
playBg: 'linear-gradient(#FF0000, #FF5400)',
|
||||||
|
};
|
||||||
|
},
|
||||||
|
created() {},
|
||||||
|
mounted() {
|
||||||
|
this.getLiveList();
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
// 直播
|
||||||
|
getLiveList() {
|
||||||
|
let that = this;
|
||||||
|
getLiveList({
|
||||||
|
mer_id: that.merId,
|
||||||
|
limit: 10
|
||||||
|
}).then(res => {
|
||||||
|
that.liveList = res.data.list;
|
||||||
|
that.liveList.forEach(val => {
|
||||||
|
val.link =
|
||||||
|
(val.live_status == 103 && val.replay_status) || val.live_status === 101 || val.live_status === 102
|
||||||
|
? 'plugin-private://wx2b03c6e691cd7370/pages/live-player-plugin?room_id=' + val.room_id
|
||||||
|
: '';
|
||||||
|
});
|
||||||
|
})
|
||||||
|
.catch(e => {});
|
||||||
|
},
|
||||||
|
}
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
@import '../style/main.scss';
|
||||||
|
.wrapper-count{
|
||||||
|
padding: 24rpx 20rpx 0;
|
||||||
|
}
|
||||||
|
.live-wrapper {
|
||||||
|
position: relative;
|
||||||
|
width: 100%;
|
||||||
|
overflow: hidden;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
image {
|
||||||
|
width: 100%;
|
||||||
|
height: 400rpx;
|
||||||
|
}
|
||||||
|
.live-top {
|
||||||
|
z-index: 20;
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
top: 0;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
color: #fff;
|
||||||
|
width: 120rpx;
|
||||||
|
height: 32rpx;
|
||||||
|
}
|
||||||
|
.broadcast-time {
|
||||||
|
z-index: 20;
|
||||||
|
position: absolute;
|
||||||
|
left: 100rpx;
|
||||||
|
top: 0;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
color: #fff;
|
||||||
|
width: 160rpx;
|
||||||
|
height: 36rpx;
|
||||||
|
background: rgba(0, 0, 0, 0.4);
|
||||||
|
font-size: 22rpx;
|
||||||
|
border-radius: 0 0 18rpx 0;
|
||||||
|
}
|
||||||
|
.live-title {
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
bottom: 6rpx;
|
||||||
|
width: 100%;
|
||||||
|
height: 70rpx;
|
||||||
|
line-height: 70rpx;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 30rpx;
|
||||||
|
color: #fff;
|
||||||
|
background: rgba(0, 0, 0, 0.35);
|
||||||
|
}
|
||||||
|
&.mores {
|
||||||
|
width: 100%;
|
||||||
|
.item {
|
||||||
|
position: relative;
|
||||||
|
width: 280rpx;
|
||||||
|
display: inline-block;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
overflow: hidden;
|
||||||
|
margin-right: 20rpx;
|
||||||
|
/deep/image,/deep/image,/deep/.easy-loadimage,/deep/uni-image {
|
||||||
|
width: 280rpx;
|
||||||
|
height: 224rpx;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
}
|
||||||
|
.live-title {
|
||||||
|
height: 40rpx;
|
||||||
|
line-height: 40rpx;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 22rpx;
|
||||||
|
}
|
||||||
|
.live-top {
|
||||||
|
width: 110rpx;
|
||||||
|
height: 32rpx;
|
||||||
|
font-size: 22rpx;
|
||||||
|
image {
|
||||||
|
width: 20rpx;
|
||||||
|
height: 20rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.live-wrapper {
|
||||||
|
position: relative;
|
||||||
|
width: 100%;
|
||||||
|
overflow: hidden;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
image {
|
||||||
|
width: 100%;
|
||||||
|
height: 400rpx;
|
||||||
|
}
|
||||||
|
.live-top {
|
||||||
|
z-index: 20;
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
top: 0;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
color: #fff;
|
||||||
|
width: 180rpx;
|
||||||
|
height: 54rpx;
|
||||||
|
border-radius: 16rpx 0px 16rpx 0px;
|
||||||
|
&.playRadius {
|
||||||
|
border-radius: 16rpx 0 0 0;
|
||||||
|
}
|
||||||
|
&.notPlayRadius {
|
||||||
|
border-radius: 16rpx 0px 16rpx 0px;
|
||||||
|
}
|
||||||
|
image {
|
||||||
|
width: 30rpx;
|
||||||
|
height: 30rpx;
|
||||||
|
margin-right: 10rpx;
|
||||||
|
/* #ifdef H5 */
|
||||||
|
display: block;
|
||||||
|
/* #endif */
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.live-title {
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
bottom: 6rpx;
|
||||||
|
width: 100%;
|
||||||
|
height: 70rpx;
|
||||||
|
line-height: 70rpx;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 30rpx;
|
||||||
|
color: #fff;
|
||||||
|
background: rgba(0, 0, 0, 0.35);
|
||||||
|
}
|
||||||
|
&.mores {
|
||||||
|
width: 100%;
|
||||||
|
.item {
|
||||||
|
position: relative;
|
||||||
|
width: 280rpx;
|
||||||
|
display: inline-block;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
overflow: hidden;
|
||||||
|
margin-right: 20rpx;
|
||||||
|
image {
|
||||||
|
width: 280rpx;
|
||||||
|
height: 224rpx;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
}
|
||||||
|
.live-title {
|
||||||
|
height: 40rpx;
|
||||||
|
line-height: 40rpx;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 22rpx;
|
||||||
|
}
|
||||||
|
.live-top {
|
||||||
|
width: 100rpx;
|
||||||
|
height: 36rpx;
|
||||||
|
font-size: 22rpx;
|
||||||
|
image {
|
||||||
|
width: 20rpx;
|
||||||
|
height: 20rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.live-wrapper-a{
|
||||||
|
padding: 0rpx 20rpx 0;
|
||||||
|
.live-item-a{
|
||||||
|
display: flex;
|
||||||
|
background: #fff;
|
||||||
|
margin-bottom: 20rpx;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
overflow: hidden;
|
||||||
|
&:last-child{
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
.img-box{
|
||||||
|
position: relative;
|
||||||
|
width: 340rpx;
|
||||||
|
height: 270rpx;
|
||||||
|
image{
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.info{
|
||||||
|
flex: 1;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: space-between;
|
||||||
|
padding: 15rpx 20rpx;
|
||||||
|
.title{
|
||||||
|
font-size: 30rpx;
|
||||||
|
color: #333;
|
||||||
|
}
|
||||||
|
.people{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
color: #999;
|
||||||
|
font-size: 24rpx;
|
||||||
|
margin-top: 10rpx;
|
||||||
|
}
|
||||||
|
.goods-wrapper{
|
||||||
|
display: flex;
|
||||||
|
.goods-item{
|
||||||
|
position: relative;
|
||||||
|
width: 96rpx;
|
||||||
|
height: 96rpx;
|
||||||
|
margin-right: 20rpx;
|
||||||
|
overflow: hidden;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
&:last-child{
|
||||||
|
margin-right: 0;
|
||||||
|
}
|
||||||
|
image{
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
}
|
||||||
|
.bg{
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
top: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
background: rgba(0, 0, 0, 0.3);
|
||||||
|
}
|
||||||
|
text{
|
||||||
|
font-size: 24rpx;
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
bottom: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 60rpx;
|
||||||
|
line-height: 70rpx;
|
||||||
|
color: #fff;
|
||||||
|
background: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.75) 100%);
|
||||||
|
}
|
||||||
|
.num{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
top: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
background: rgba(0, 0, 0, 0.3);
|
||||||
|
color: #fff;
|
||||||
|
font-size: 28rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.empty-goods{
|
||||||
|
width: 96rpx;
|
||||||
|
height: 96rpx;
|
||||||
|
border-radius: 6rpx;
|
||||||
|
background-color: #B2B2B2;
|
||||||
|
color: #fff;
|
||||||
|
font-size: 20rpx;
|
||||||
|
text-align: center;
|
||||||
|
line-height: 96rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&.live-wrapper-c{
|
||||||
|
.live-item-a{
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
.img-box{
|
||||||
|
width: 100%;
|
||||||
|
border-radius: 8px 8px 0 0;
|
||||||
|
}
|
||||||
|
.info{
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: center;
|
||||||
|
flex-direction: initial;
|
||||||
|
.left{
|
||||||
|
width: 69%;
|
||||||
|
}
|
||||||
|
.goods-wrapper{
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.live-wrapper-b{
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
.live-item-b{
|
||||||
|
width: 328rpx;
|
||||||
|
background-color: #fff;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
overflow: hidden;
|
||||||
|
margin-bottom: 20rpx;
|
||||||
|
overflow: hidden;
|
||||||
|
.img-box{
|
||||||
|
position: relative;
|
||||||
|
image{
|
||||||
|
width: 100%;
|
||||||
|
height: 274rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.info{
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
padding: 20rpx;
|
||||||
|
.title{
|
||||||
|
font-size: 30rpx;
|
||||||
|
color: #333;
|
||||||
|
}
|
||||||
|
.people{
|
||||||
|
display: flex;
|
||||||
|
margin-top: 10rpx;
|
||||||
|
color: #999;
|
||||||
|
font-size: 24rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.label{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
top: 0;
|
||||||
|
border-radius: 16rpx 0px 16rpx 0;
|
||||||
|
font-size: 24rpx;
|
||||||
|
color: #fff;
|
||||||
|
image{
|
||||||
|
margin-right: 10rpx;
|
||||||
|
}
|
||||||
|
text{
|
||||||
|
font-size: 22rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.bgred{
|
||||||
|
width: 132rpx;
|
||||||
|
height: 38rpx;
|
||||||
|
background: linear-gradient(270deg, #F5742F 0%, #FF1717 100%)
|
||||||
|
}
|
||||||
|
.bggary{
|
||||||
|
width: 108rpx;
|
||||||
|
height: 38rpx;
|
||||||
|
background: linear-gradient(270deg, #999999 0%, #666666 100%)
|
||||||
|
}
|
||||||
|
.bgblue{
|
||||||
|
width: 220rpx;
|
||||||
|
height: 38rpx;
|
||||||
|
background: rgba(0,0,0,0.36);
|
||||||
|
overflow: hidden;
|
||||||
|
.txt{
|
||||||
|
position: relative;
|
||||||
|
left: -6rpx;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
width: 38px;
|
||||||
|
height: 100%;
|
||||||
|
text-align: center;
|
||||||
|
background: linear-gradient(270deg, #2FA1F5 0%, #0076FF 100%);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
105
pages/index/component/menus.vue
Normal file
105
pages/index/component/menus.vue
Normal file
@ -0,0 +1,105 @@
|
|||||||
|
<template>
|
||||||
|
<view class='nav acea-row acea-row' :style="'background:'+bgColor[0].item+';margin:' +mbConfig+'rpx '+prConfig+'rpx 0;border-radius:'+bgStyle+'rpx;'" v-if="menus.length">
|
||||||
|
<block v-if="rowStyle == 0">
|
||||||
|
<scroll-view scroll-x="true" style="white-space: nowrap; display: flex" show-scrollbar="false">
|
||||||
|
<view v-for="(item,index) in menus" :key="index" class='item' :style="'color:'+titleColor" @click="menusTap(item.info[1].value)">
|
||||||
|
<view class='pictrue skeleton-rect'>
|
||||||
|
<image :src='item.img' :style="'border-radius:'+menuStyle"></image>
|
||||||
|
</view>
|
||||||
|
<view class="menu-txt" :style="'color:'+titleColor">{{item.info[0].value}}</view>
|
||||||
|
</view>
|
||||||
|
</scroll-view>
|
||||||
|
</block>
|
||||||
|
<block v-else v-for="(item,index) in menus" :key="index">
|
||||||
|
<view class='item' :style="'color:'+titleColor+';width:'+number" @click="menusTap(item.info[1].value)">
|
||||||
|
<view class='pictrue skeleton-rect'>
|
||||||
|
<image :src='item.img' :style="'border-radius:'+menuStyle"></image>
|
||||||
|
</view>
|
||||||
|
<view class="menu-txt" :style="'color:'+titleColor">{{item.info[0].value}}</view>
|
||||||
|
</view>
|
||||||
|
</block>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import {merPath} from "@/utils/index"
|
||||||
|
export default {
|
||||||
|
name: 'menus',
|
||||||
|
props: {
|
||||||
|
dataConfig: {
|
||||||
|
type: Object,
|
||||||
|
default: () => {}
|
||||||
|
},
|
||||||
|
merId:{}
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
menus: this.dataConfig.menuConfig.list,
|
||||||
|
bgColor: this.dataConfig.bgColor.color,
|
||||||
|
menuStyle: this.dataConfig.menuStyle.type ? '50%' : 0,
|
||||||
|
rowStyle: this.dataConfig.tabConfig.tabVal, //0单行1多行
|
||||||
|
bgStyle: this.dataConfig.bgStyle.type ? '16' : '0',
|
||||||
|
titleColor: this.dataConfig.titleColor.color[0].item,
|
||||||
|
mbConfig: this.dataConfig.mbConfig.val*2,
|
||||||
|
prConfig: this.dataConfig.prConfig.val*2,
|
||||||
|
rowNum: this.dataConfig.rowsNum.type,//0两行，1三行，2四行
|
||||||
|
number: this.dataConfig.number.type == 0 ? '33.33%' : this.dataConfig.number.type == 1 ? '25%' : '20%', //三个四个五个
|
||||||
|
};
|
||||||
|
},
|
||||||
|
created() {},
|
||||||
|
mounted() {},
|
||||||
|
methods: {
|
||||||
|
menusTap(url) {
|
||||||
|
let data = this.$util.stringIntercept(url, 1, '\?');
|
||||||
|
data = this.$util.stringIntercept(data, 1, '\=');
|
||||||
|
uni.setStorageSync('storeIndex', data);
|
||||||
|
url = merPath(url, this.merId)
|
||||||
|
if(url.indexOf("http") != -1){
|
||||||
|
// #ifdef H5
|
||||||
|
location.href = url
|
||||||
|
// #endif
|
||||||
|
}else{
|
||||||
|
if(['/pages/goods_cate/goods_cate','/pages/plant_grass/index','/pages/order_addcart/order_addcart','/pages/user/index'].indexOf(url) == -1){
|
||||||
|
uni.navigateTo({
|
||||||
|
url:url
|
||||||
|
})
|
||||||
|
}else{
|
||||||
|
uni.switchTab({
|
||||||
|
url:url
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.nav {
|
||||||
|
padding: 30rpx 0 0;
|
||||||
|
.item {
|
||||||
|
width: 20%;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 24rpx;
|
||||||
|
display: inline-block;
|
||||||
|
margin-bottom: 20rpx;
|
||||||
|
.pictrue,/deep/.pictrue image,/deep/.pictrue .easy-loadimage,/deep/.pictrue uni-image {
|
||||||
|
width: 82rpx;
|
||||||
|
height: 82rpx;
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
.menu-txt {
|
||||||
|
font-size: 24rpx;
|
||||||
|
color: #454545;
|
||||||
|
margin-top: 15rpx;
|
||||||
|
}
|
||||||
|
&.four {
|
||||||
|
width: 25%;
|
||||||
|
.pictrue {
|
||||||
|
width: 90rpx;
|
||||||
|
height: 90rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
129
pages/index/component/news.vue
Normal file
129
pages/index/component/news.vue
Normal file
@ -0,0 +1,129 @@
|
|||||||
|
<template>
|
||||||
|
<view v-if="itemNew.length" :style="'margin-top:'+mbConfig+'rpx;'">
|
||||||
|
<view class='news acea-row row-between-wrapper':style="'background:'+bgColor[0].item+';margin: 0 '+prConfig+'rpx;border-radius:'+bgStyle+'rpx'">
|
||||||
|
<view class='pictrue'>
|
||||||
|
<image :src='logoConfig'></image>
|
||||||
|
</view>
|
||||||
|
<view class='swiperTxt'>
|
||||||
|
<swiper :indicator-dots="indicatorDots" :autoplay="autoplay" interval="2500" :duration="duration" vertical="true"
|
||||||
|
circular="true">
|
||||||
|
<block v-for="(item,index) in itemNew" :key='index'>
|
||||||
|
<swiper-item catchtouchmove='catchTouchMove'>
|
||||||
|
<view @click="goDetail(item.chiild[1].val)" class='acea-row row-between-wrapper'>
|
||||||
|
<view class='text acea-row row-between-wrapper'>
|
||||||
|
<view class='newsTitle line1' :style="'text-align:'+ (txtStyle==1?'center':txtStyle==2?'right':'left') +';color:'+txtColor">{{item.chiild[0].val}}</view>
|
||||||
|
</view>
|
||||||
|
<text class='iconfont icon-jiantou' style="color:#282828;"></text>
|
||||||
|
</view>
|
||||||
|
</swiper-item>
|
||||||
|
</block>
|
||||||
|
</swiper>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import {merPath} from "@/utils/index"
|
||||||
|
export default {
|
||||||
|
name: 'news',
|
||||||
|
props: {
|
||||||
|
dataConfig: {
|
||||||
|
type: Object,
|
||||||
|
default: () => {}
|
||||||
|
},
|
||||||
|
merId: {
|
||||||
|
type: String || Number,
|
||||||
|
default: ''
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
indicatorDots: false,
|
||||||
|
autoplay: true,
|
||||||
|
duration: 500,
|
||||||
|
itemNew: this.dataConfig.listConfig.list,
|
||||||
|
logoConfig: this.dataConfig.logoConfig.url,
|
||||||
|
bgColor: this.dataConfig.bgColor.color,
|
||||||
|
mbConfig: this.dataConfig.mbConfig.val*2,
|
||||||
|
prConfig: this.dataConfig.prConfig.val*2,
|
||||||
|
txtStyle: this.dataConfig.txtStyle.type,
|
||||||
|
txtColor: this.dataConfig.txtColor.color[0].item,
|
||||||
|
bgStyle: this.dataConfig.bgStyle.type ? 20 : 0,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
created() {},
|
||||||
|
mounted() {},
|
||||||
|
methods: {
|
||||||
|
goDetail(url){
|
||||||
|
let urls = merPath(url, this.merId)
|
||||||
|
// console.log(urls,'urls');
|
||||||
|
if(urls.indexOf("http") != -1){
|
||||||
|
// #ifdef H5
|
||||||
|
location.href = urls
|
||||||
|
// #endif
|
||||||
|
}else{
|
||||||
|
if(['/pages/goods_cate/goods_cate','/pages/order_addcart/order_addcart','/pages/user/index','/pages/plant_grass/index'].indexOf(urls) == -1){
|
||||||
|
uni.navigateTo({
|
||||||
|
url:urls
|
||||||
|
})
|
||||||
|
}else{
|
||||||
|
uni.switchTab({
|
||||||
|
url:urls
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.news {
|
||||||
|
height: 77rpx;
|
||||||
|
border-top: 1px solid #f4f4f4;
|
||||||
|
padding: 0 20rpx;
|
||||||
|
box-shadow: 0 10rpx 30rpx #f5f5f5;
|
||||||
|
}
|
||||||
|
.news .pictrue {
|
||||||
|
width: 130rpx;
|
||||||
|
height: 36rpx;
|
||||||
|
border-right: 1px solid #ddd;
|
||||||
|
padding-right: 23rpx;
|
||||||
|
box-sizing: content-box;
|
||||||
|
}
|
||||||
|
.news .pictrue image {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
.news .swiperTxt {
|
||||||
|
width: 510rpx;
|
||||||
|
height: 100%;
|
||||||
|
line-height: 77rpx;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
.news .swiperTxt .text {
|
||||||
|
width: 480rpx;
|
||||||
|
}
|
||||||
|
.news .swiperTxt .text .label {
|
||||||
|
font-size: 20rpx;
|
||||||
|
color: #ff4c48;
|
||||||
|
width: 64rpx;
|
||||||
|
height: 30rpx;
|
||||||
|
border-radius: 40rpx;
|
||||||
|
text-align: center;
|
||||||
|
line-height: 28rpx;
|
||||||
|
border: 2rpx solid #ff4947;
|
||||||
|
}
|
||||||
|
.news .swiperTxt .text .newsTitle {
|
||||||
|
width: 397rpx;
|
||||||
|
font-size: 24rpx;
|
||||||
|
color: #666;
|
||||||
|
}
|
||||||
|
.news .swiperTxt .icon-jiantou {
|
||||||
|
font-size: 22rpx;
|
||||||
|
}
|
||||||
|
.news .swiperTxt swiper {
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
303
pages/index/component/pictureCube.vue
Normal file
303
pages/index/component/pictureCube.vue
Normal file
@ -0,0 +1,303 @@
|
|||||||
|
<template>
|
||||||
|
<view class="pictureCube skeleton-rect" :class="{pageOn:bgStyle===1}" :style="{margin:'0 '+prConfig*2+'rpx',marginTop:slider*2+'rpx',background:bgColor}" v-if="picList.length" v-show="!isSortType">
|
||||||
|
<view class="advertItem01" v-for="(item,index) in picList" :key="index" v-if="style==0" @click="goDetail(item)">
|
||||||
|
<image :src="item.image" mode="widthFix"></image>
|
||||||
|
</view>
|
||||||
|
<view class="advertItem02 acea-row" v-if="style==1">
|
||||||
|
<view class="item" v-for="(item,index) in picList" :key="index" @click="goDetail(item)">
|
||||||
|
<image :src="item.image" :style="'height:'+ imageH +'rpx;'" mode="widthFix"></image>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="advertItem02 advertItem03 acea-row" v-if="style==2">
|
||||||
|
<view class="item" v-for="(item,index) in picList" :key="index" @click="goDetail(item)">
|
||||||
|
<image :src="item.image" :style="'height:'+ imageH +'rpx;'"></image>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="advertItem04 acea-row" v-if="style==3">
|
||||||
|
<view class="item" @click="goDetail(picList[0])">
|
||||||
|
<image :src="picList[0].image"></image>
|
||||||
|
</view>
|
||||||
|
<view class="item">
|
||||||
|
<view class="pic" @click="goDetail(picList[1])">
|
||||||
|
<image :src="picList[1].image"></image>
|
||||||
|
</view>
|
||||||
|
<view class="pic" @click="goDetail(picList[2])">
|
||||||
|
<image :src="picList[2].image"></image>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="advertItem02 advertItem05 acea-row" v-if="style==4">
|
||||||
|
<view class="item" v-for="(item,index) in picList" :key="index" @click="goDetail(item)">
|
||||||
|
<image :src="item.image" mode="aspectFit" :style="'height:'+ imageH +'rpx;'"></image>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="advertItem02 advertItem06 acea-row" v-if="style==5">
|
||||||
|
<view class="item" v-for="(item,index) in picList" :key="index" @click="goDetail(item)">
|
||||||
|
<image :src="item.image"></image>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import {merPath} from "@/utils/index"
|
||||||
|
|
||||||
|
export default {
|
||||||
|
name: 'pictureCube',
|
||||||
|
props: {
|
||||||
|
dataConfig: {
|
||||||
|
type: Object,
|
||||||
|
default: () => {}
|
||||||
|
},
|
||||||
|
isSortType: {
|
||||||
|
type: String | Number,
|
||||||
|
default: 0
|
||||||
|
},
|
||||||
|
merId: {
|
||||||
|
type: String || Number,
|
||||||
|
default: ''
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
picList: this.dataConfig.picStyle.picList,
|
||||||
|
style: this.dataConfig.tabConfig.tabVal,
|
||||||
|
bgStyle: this.dataConfig.bgStyle.type,
|
||||||
|
prConfig: this.dataConfig.prConfig.val,
|
||||||
|
slider: this.dataConfig.mbConfig.val,
|
||||||
|
bgColor: this.dataConfig.bgColor.color[0].item,
|
||||||
|
widthC: '',
|
||||||
|
imageH: ''
|
||||||
|
};
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
if(this.picList.length){
|
||||||
|
let that = this;
|
||||||
|
this.$nextTick((e) => {
|
||||||
|
if(this.style==1){
|
||||||
|
this.widthC = 375
|
||||||
|
}else if(this.style==2){
|
||||||
|
this.widthC = 250
|
||||||
|
}else if(this.style==4){
|
||||||
|
this.widthC = 188
|
||||||
|
}
|
||||||
|
uni.getImageInfo({
|
||||||
|
src: that.setDomain(that.picList[0].image),
|
||||||
|
success: (res) => {
|
||||||
|
if (res && res.height > 0) {
|
||||||
|
let height = res.height * ((that.widthC-that.prConfig*2) / res.width)
|
||||||
|
that.$set(that, 'imageH', height);
|
||||||
|
} else {
|
||||||
|
that.$set(that, 'imageH', (that.widthC-that.prConfig*2)*2);
|
||||||
|
}
|
||||||
|
},
|
||||||
|
fail: function(error) {
|
||||||
|
that.$set(that, 'imageH', (that.widthC-that.prConfig*2)*2);
|
||||||
|
}
|
||||||
|
})
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
created() {},
|
||||||
|
methods: {
|
||||||
|
//替换安全域名
|
||||||
|
setDomain: function(url) {
|
||||||
|
url = url ? url.toString() : '';
|
||||||
|
//本地调试打开,生产请注销
|
||||||
|
if (url.indexOf("https://") > -1) return url;
|
||||||
|
else return url.replace('http://', 'https://');
|
||||||
|
},
|
||||||
|
goDetail(url) {
|
||||||
|
let urls = url.link
|
||||||
|
urls = merPath(urls, this.merId)
|
||||||
|
if (urls.indexOf("http") != -1) {
|
||||||
|
// #ifdef H5
|
||||||
|
location.href = urls
|
||||||
|
// #endif
|
||||||
|
// #ifdef MP || APP-PLUS
|
||||||
|
uni.navigateTo({
|
||||||
|
url: `/pages/annex/web_view/index?url=${urls}`
|
||||||
|
});
|
||||||
|
// #endif
|
||||||
|
} else {
|
||||||
|
if (['/pages/goods_cate/goods_cate', '/pages/plant_grass/index', '/pages/order_addcart/order_addcart', '/pages/user/index']
|
||||||
|
.indexOf(urls) == -1) {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: urls
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
uni.reLaunch({
|
||||||
|
url: urls
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.pageOn{
|
||||||
|
border-radius:24rpx!important;
|
||||||
|
.advertItem01{
|
||||||
|
image{
|
||||||
|
border-radius:20rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.advertItem02{
|
||||||
|
.item{
|
||||||
|
&:nth-child(1){
|
||||||
|
image{
|
||||||
|
border-radius:20rpx 0 0 20rpx
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&:nth-child(2){
|
||||||
|
image{
|
||||||
|
border-radius:0 20rpx 20rpx 0
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.advertItem03{
|
||||||
|
.item{
|
||||||
|
&:nth-child(1){
|
||||||
|
image{
|
||||||
|
border-radius:20rpx 0 0 20rpx
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&:nth-child(2){
|
||||||
|
image{
|
||||||
|
border-radius:0
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&:nth-child(3){
|
||||||
|
image{
|
||||||
|
border-radius:0 20rpx 20rpx 0
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.advertItem04{
|
||||||
|
.item{
|
||||||
|
&:nth-child(1){
|
||||||
|
image{
|
||||||
|
border-radius:20rpx 0 0 20rpx
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&:nth-child(2){
|
||||||
|
.pic{
|
||||||
|
&:nth-child(1){
|
||||||
|
image{
|
||||||
|
border-radius:0 20rpx 0 0
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&:nth-child(2){
|
||||||
|
image{
|
||||||
|
border-radius:0 0 20rpx 0
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.advertItem05{
|
||||||
|
.item{
|
||||||
|
&:nth-child(1){
|
||||||
|
image{
|
||||||
|
border-radius:20rpx 0 0 20rpx
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&:nth-child(2){
|
||||||
|
image{
|
||||||
|
border-radius:0
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&:nth-child(4){
|
||||||
|
image{
|
||||||
|
border-radius:0 20rpx 20rpx 0
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.advertItem06{
|
||||||
|
.item{
|
||||||
|
&:nth-child(1){
|
||||||
|
image{
|
||||||
|
border-radius:20rpx 0 0 0
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&:nth-child(2){
|
||||||
|
image{
|
||||||
|
border-radius:0 20rpx 0 0
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&:nth-child(3){
|
||||||
|
image{
|
||||||
|
border-radius:0 0 0 20rpx
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&:nth-child(4){
|
||||||
|
image{
|
||||||
|
border-radius:0 0 20rpx 0
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.pictureCube {
|
||||||
|
background-color: #fff;
|
||||||
|
.advertItem01 {
|
||||||
|
width: 100%;
|
||||||
|
height: auto;
|
||||||
|
image {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.advertItem02{
|
||||||
|
width: 100%;
|
||||||
|
.item{
|
||||||
|
width: 50%;
|
||||||
|
height: auto;
|
||||||
|
image{
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.advertItem03{
|
||||||
|
.item{
|
||||||
|
width: 33.3333%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.advertItem04{
|
||||||
|
width: 100%;
|
||||||
|
.item{
|
||||||
|
width: 50%;
|
||||||
|
height: 376rpx;
|
||||||
|
.pic{
|
||||||
|
width: 100%;
|
||||||
|
height: 188rpx;
|
||||||
|
}
|
||||||
|
image{
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.advertItem05{
|
||||||
|
.item{
|
||||||
|
width: 25%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.advertItem06{
|
||||||
|
.item{
|
||||||
|
width: 50%;
|
||||||
|
height: 188rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
261
pages/index/component/plantList.vue
Normal file
261
pages/index/component/plantList.vue
Normal file
@ -0,0 +1,261 @@
|
|||||||
|
<template>
|
||||||
|
<view v-if="plantList.length > 0" :style="'margin-top:'+mbConfig+'rpx;'">
|
||||||
|
<view class="plant-count skeleton-rect" :style="'margin: 0 '+prConfig+'rpx;border-radius:'+bgStyle+'rpx'">
|
||||||
|
<block v-if="community_status">
|
||||||
|
<view class="spike-bd plant_bg" :style="{ 'background-image': `url(${domain}/static/images/plant_bg.png)`}">
|
||||||
|
<view class="title line1"><image class="title-img" :src="`${domain}/static/images/plant_title.png`"></image></view>
|
||||||
|
<navigator v-if="!merId" :open-type="open_grass ? 'switchTab' : 'navigate'" url="/pages/plant_grass/index" class="more-btn" hover-class="none">
|
||||||
|
好物分享
|
||||||
|
<text class="iconfont icon-jiantou" hover-class="none"></text>
|
||||||
|
</navigator>
|
||||||
|
</view>
|
||||||
|
<view class="live-wrapper plant" style="border-radius: 0;">
|
||||||
|
<scroll-view :class="'colum'+styleType" :scroll-x="styleType == 0 ? true : false" >
|
||||||
|
<view
|
||||||
|
v-for="(item, index) in plantList"
|
||||||
|
:key="index"
|
||||||
|
class="item"
|
||||||
|
:class="'plant-item'+styleType"
|
||||||
|
:style="'border-radius:'+conStyle+'rpx'"
|
||||||
|
@click="goDetail(item)"
|
||||||
|
>
|
||||||
|
<view :class="'img-box'+conStyle">
|
||||||
|
<easy-loadimage mode="widthFix" :image-src="item.image[0]"></easy-loadimage>
|
||||||
|
<view class="item_text">
|
||||||
|
<text v-if="titleShow" class="text_name line1">{{item.title}}</text>
|
||||||
|
<view v-if="avatarShow || nicknameShow" class="text_count acea-row">
|
||||||
|
<image v-if="avatarShow" :src="(item.author && item.author.avatar) || '/static/images/f.png'" ></image>
|
||||||
|
<text v-if="nicknameShow" class="name line1">{{(item.author && item.author.nickname) || ''}}</text>
|
||||||
|
</view>
|
||||||
|
<view class="like_count" v-if="styleType == 1">
|
||||||
|
<text class="iconfont" :class="item.relevance_id ? 'icon-shoucang1' : 'icon-dianzan'"></text>
|
||||||
|
<text class="collect">{{item.count_start}}</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</scroll-view>
|
||||||
|
</view>
|
||||||
|
</block>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { HTTP_REQUEST_URL } from '@/config/app';
|
||||||
|
import easyLoadimage from '@/components/easy-loadimage/easy-loadimage.vue';
|
||||||
|
import { graphicLstApi } from '@/api/community.js';
|
||||||
|
import { openPlantGrass } from "@/config/app.js";
|
||||||
|
import { mapGetters } from 'vuex';
|
||||||
|
import { configMap } from '@/utils';
|
||||||
|
export default {
|
||||||
|
computed: configMap(['community_status']),
|
||||||
|
components:{
|
||||||
|
easyLoadimage
|
||||||
|
},
|
||||||
|
name: 'plantList',
|
||||||
|
props: {
|
||||||
|
dataConfig: {
|
||||||
|
type: Object,
|
||||||
|
default: () => {}
|
||||||
|
},
|
||||||
|
merId: {
|
||||||
|
type: String || Number,
|
||||||
|
default: ''
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
plantList: [],
|
||||||
|
open_grass: openPlantGrass,
|
||||||
|
mbConfig: this.dataConfig.mbConfig.val*2, //页面间距
|
||||||
|
styleType: this.dataConfig.tabConfig.tabVal, //单行，多行，板块
|
||||||
|
prConfig: this.dataConfig.prConfig.val*2, //背景间距
|
||||||
|
bgStyle: this.dataConfig.bgStyle.type ? 16 : 0,
|
||||||
|
conStyle: this.dataConfig.conStyle.type ? 16 : 0,
|
||||||
|
titleShow: this.dataConfig.titleShow.val,
|
||||||
|
avatarShow: this.dataConfig.avatarShow.val,
|
||||||
|
nicknameShow: this.dataConfig.nicknameShow.val,
|
||||||
|
domain: HTTP_REQUEST_URL,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
created() {},
|
||||||
|
mounted() {
|
||||||
|
this.getPlantList()
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
// 种草
|
||||||
|
getPlantList(){
|
||||||
|
let that = this;
|
||||||
|
graphicLstApi({
|
||||||
|
mer_id: that.merId,
|
||||||
|
limit: 6
|
||||||
|
}).then(res => {
|
||||||
|
that.plantList = res.data.list;
|
||||||
|
}).catch(e => {});
|
||||||
|
},
|
||||||
|
goDetail(item){
|
||||||
|
if(item.is_type == 1){
|
||||||
|
uni.navigateTo({
|
||||||
|
url: '/pages/plantGrass/plant_detail/index?id='+item.community_id
|
||||||
|
});
|
||||||
|
}else{
|
||||||
|
uni.navigateTo({
|
||||||
|
//#ifdef APP
|
||||||
|
url: '/pages/short_video/appSwiper/index?id='+item.community_id
|
||||||
|
//#endif
|
||||||
|
//#ifndef APP
|
||||||
|
url: '/pages/short_video/nvueSwiper/index?id='+item.community_id
|
||||||
|
//#endif
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
@import '../style/main.scss';
|
||||||
|
.plant-count{
|
||||||
|
background: #ffffff;
|
||||||
|
box-shadow: 4rpx 2rpx 12rpx 2rpx rgba(0, 0, 0, 0.03);
|
||||||
|
}
|
||||||
|
.plant_bg{
|
||||||
|
margin-bottom: 0;
|
||||||
|
border-radius: 0;
|
||||||
|
padding: 24rpx 20rpx 27rpx 30rpx;
|
||||||
|
background-size: 100% 100%;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
.more-btn{
|
||||||
|
top: 22rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.live-wrapper {
|
||||||
|
position: relative;
|
||||||
|
width: 100%;
|
||||||
|
overflow: hidden;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
padding: 20rpx 20rpx 0;
|
||||||
|
image {
|
||||||
|
width: 100%;
|
||||||
|
height: 400rpx;
|
||||||
|
}
|
||||||
|
.item{
|
||||||
|
position: relative;
|
||||||
|
width: 280rpx;
|
||||||
|
height: 280rpx;
|
||||||
|
display: inline-block;
|
||||||
|
overflow: hidden;
|
||||||
|
margin-right: 20rpx;
|
||||||
|
/deep/image,.easy-loadimage,uni-image {
|
||||||
|
width: 280rpx;
|
||||||
|
height: 280rpx;
|
||||||
|
}
|
||||||
|
.img-box16{
|
||||||
|
/deep/image,.easy-loadimage,uni-image {
|
||||||
|
border-radius: 16rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.img-box0{
|
||||||
|
/deep/image,.easy-loadimage,uni-image {
|
||||||
|
border-radius: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&::before{
|
||||||
|
content: "";
|
||||||
|
display: block;
|
||||||
|
width: 280rpx;
|
||||||
|
height: 280rpx;
|
||||||
|
background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.4) 100%);
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
z-index: 9;
|
||||||
|
}
|
||||||
|
.item_text{
|
||||||
|
width: 260rpx;
|
||||||
|
padding: 17rpx 15rpx;
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
bottom: 0;
|
||||||
|
color: #ffffff;
|
||||||
|
z-index: 9;
|
||||||
|
image {
|
||||||
|
width: 34rpx;
|
||||||
|
height: 34rpx;
|
||||||
|
border-radius: 100%;
|
||||||
|
}
|
||||||
|
.text_name{
|
||||||
|
font-size: 24rpx;
|
||||||
|
width: 260rpx;
|
||||||
|
word-break: normal;
|
||||||
|
word-wrap: break-word;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
.text_count{
|
||||||
|
margin-top: 12rpx;
|
||||||
|
align-items: center;
|
||||||
|
.name{
|
||||||
|
font-size: 18rpx;
|
||||||
|
margin-left: 10rpx;
|
||||||
|
max-width: 200rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&.plant-item1{
|
||||||
|
width: 324rpx;
|
||||||
|
height: 440rpx;
|
||||||
|
margin-bottom: 20rpx;
|
||||||
|
&:nth-child(2n){
|
||||||
|
margin-right: 0;
|
||||||
|
}
|
||||||
|
/deep/image,.easy-loadimage,uni-image {
|
||||||
|
width: 324rpx;
|
||||||
|
height: 334rpx;
|
||||||
|
}
|
||||||
|
&::before{
|
||||||
|
width: 324rpx;
|
||||||
|
height: 334rpx;
|
||||||
|
}
|
||||||
|
.item_text{
|
||||||
|
position: static;
|
||||||
|
color: #282828;
|
||||||
|
position: relative;
|
||||||
|
width: 100%;
|
||||||
|
height: 110rpx;
|
||||||
|
.text_name {
|
||||||
|
font-size: 28rpx;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
.text_count{
|
||||||
|
width: 100%;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
.name{
|
||||||
|
max-width: 160rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.like_count{
|
||||||
|
position: absolute;
|
||||||
|
bottom: 10rpx;
|
||||||
|
right: 20rpx;
|
||||||
|
font-size: 24rpx;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
.iconfont{
|
||||||
|
margin-right: 6rpx;
|
||||||
|
}
|
||||||
|
.icon-shoucang1{
|
||||||
|
color: #E93323;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
image {
|
||||||
|
width: 34rpx;
|
||||||
|
height: 34rpx;
|
||||||
|
border-radius: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
222
pages/index/component/presellList.vue
Normal file
222
pages/index/component/presellList.vue
Normal file
@ -0,0 +1,222 @@
|
|||||||
|
<template>
|
||||||
|
<view v-if="presellList.length > 0" class="presell-wrapper" :style="'margin-top:'+mbConfig+'rpx;'">
|
||||||
|
<view class="presell-count" :class="'wrapper-count'+styleType" :style="'border-radius:'+bgStyle+'rpx'">
|
||||||
|
<view class="spike-bd title-bd" :style="'border-radius:'+bgStyle+'rpx '+bgStyle+'rpx 0 0;background-image:url('+domain+'/static/images/presell_bg.png)'">
|
||||||
|
<view class="title line1"><image class="title-img" :src="`${domain}/static/images/presell_title.png`"></image></view>
|
||||||
|
<navigator v-if="!merId" url="/pages/activity/presell/index" class="more-btn" hover-class="none">
|
||||||
|
进去逛逛
|
||||||
|
<text class="iconfont icon-jiantou" hover-class="none"></text>
|
||||||
|
</navigator>
|
||||||
|
</view>
|
||||||
|
<view class="wapper_count">
|
||||||
|
<view class="spike-wrapper" :class="'wrapper'+styleType">
|
||||||
|
<scroll-view v-if="styleType != 2" :class="'colum'+styleType" :scroll-x="styleType == 0 ? true : false" show-scrollbar="false">
|
||||||
|
<navigator
|
||||||
|
class="spike-item presell-item"
|
||||||
|
v-for="(item, index) in presellList"
|
||||||
|
:key="index"
|
||||||
|
:url="'/pages/activity/presell_details/index?id=' + item.product_presell_id"
|
||||||
|
hover-class="none"
|
||||||
|
>
|
||||||
|
<view class="img-box presell_imgBox" :class="'img-box'+conStyle">
|
||||||
|
<easy-loadimage mode="widthFix" :image-src="item.product.image"></easy-loadimage>
|
||||||
|
<view v-if="presellShow" class="box_bg" :style="{ 'background-image': `url(${domain}/static/images/combination4.png);`}">火热预定中</view>
|
||||||
|
</view>
|
||||||
|
<view v-if="priceShow || titleShow" class="info">
|
||||||
|
<view class="price-box presell-price">
|
||||||
|
<text :style="'color:'+themeColor" v-if="priceShow" class="price">
|
||||||
|
<text>预售价:￥</text>
|
||||||
|
{{ item.price }}
|
||||||
|
</text>
|
||||||
|
<view v-if="titleShow" class="name line1">{{ item.store_name }}</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</navigator>
|
||||||
|
</scroll-view>
|
||||||
|
<block v-else class="acea-row row-between-wrapper combination">
|
||||||
|
<navigator
|
||||||
|
class="combination-item"
|
||||||
|
v-for="(item, index) in presellList"
|
||||||
|
:key="index"
|
||||||
|
:style="{ 'background-image': `url(${domain}/static/images/combination${index+1}.png)`,'border-radius':`${conStyle}rpx`}"
|
||||||
|
:url="'/pages/activity/presell_details/index?id=' + item.product_presell_id"
|
||||||
|
hover-class="none">
|
||||||
|
<view class="info">
|
||||||
|
<view class="price-box combination-price">
|
||||||
|
<view v-if="titleShow" class="name line1">{{ item.product.store_name }}</view>
|
||||||
|
<text :style="'color:'+themeColor" v-if="priceShow" class="price">
|
||||||
|
<text>￥</text>
|
||||||
|
{{ item.price }}
|
||||||
|
</text>
|
||||||
|
<text v-if="presellShow" class="gocom_btn">
|
||||||
|
去预定
|
||||||
|
<text class="iconfont icon-jiantou"></text>
|
||||||
|
</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="img-box">
|
||||||
|
<easy-loadimage mode="widthFix" :image-src="item.product.image"></easy-loadimage>
|
||||||
|
</view>
|
||||||
|
</navigator>
|
||||||
|
<navigator v-if="presellList.length == 1"
|
||||||
|
class="combination-item"
|
||||||
|
hover-class="none"
|
||||||
|
:style="{ 'background-image': `url(${domain}/static/images/combination2.png)`,'border-radius':`${conStyle}rpx`}"
|
||||||
|
:url="'/pages/activity/presell_details/index?id=' + presellList[0].product_presell_id"
|
||||||
|
>
|
||||||
|
<view class="info">
|
||||||
|
<view class="price-box combination-price">
|
||||||
|
<view v-if="titleShow" class="name line1">{{ presellList[0].product.store_name }}</view>
|
||||||
|
<text :style="'color:'+themeColor" v-if="priceShow" class="price">
|
||||||
|
<text>￥</text>
|
||||||
|
{{ presellList[0].price }}
|
||||||
|
</text>
|
||||||
|
<text v-if="presellShow" class="gocom_btn">
|
||||||
|
去预定
|
||||||
|
<text class="iconfont icon-jiantou"></text>
|
||||||
|
</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="img-box">
|
||||||
|
<easy-loadimage mode="widthFix" :image-src="presellList[0].product.image"></easy-loadimage>
|
||||||
|
</view>
|
||||||
|
</navigator>
|
||||||
|
<navigator v-if="presellList.length == 1"
|
||||||
|
class="combination-item"
|
||||||
|
hover-class="none"
|
||||||
|
:style="{ 'background-image': `url(${domain}/static/images/combination3.png)`,'border-radius':`${conStyle}rpx`}"
|
||||||
|
:url="'/pages/activity/presell_details/index?id=' + presellList[0].product_presell_id"
|
||||||
|
>
|
||||||
|
<view class="info">
|
||||||
|
<view class="price-box combination-price">
|
||||||
|
<view v-if="titleShow" class="name line1">{{ presellList[0].product.store_name }}</view>
|
||||||
|
<text :style="'color:'+themeColor" v-if="priceShow" class="price">
|
||||||
|
<text>￥</text>
|
||||||
|
{{ presellList[0].price }}
|
||||||
|
</text>
|
||||||
|
<text v-if="presellShow" class="gocom_btn">
|
||||||
|
去预定
|
||||||
|
<text class="iconfont icon-jiantou"></text>
|
||||||
|
</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="img-box">
|
||||||
|
<easy-loadimage mode="widthFix" :image-src="presellList[0].product.image"></easy-loadimage>
|
||||||
|
</view>
|
||||||
|
</navigator>
|
||||||
|
<navigator v-if="presellList.length == 2"
|
||||||
|
class="combination-item"
|
||||||
|
hover-class="none"
|
||||||
|
:style="{ 'background-image': `url(${domain}/static/images/combination3.png)`,'border-radius':`${conStyle}rpx`}"
|
||||||
|
:url="'/pages/activity/presell_details/index?id=' + presellList[1].product_presell_id"
|
||||||
|
>
|
||||||
|
<view class="info">
|
||||||
|
<view class="price-box combination-price">
|
||||||
|
<view v-if="titleShow" class="name line1">{{ presellList[1].product.store_name }}</view>
|
||||||
|
<text :style="'color:'+themeColor" v-if="priceShow" class="price">
|
||||||
|
<text>￥</text>
|
||||||
|
{{ presellList[1].price }}
|
||||||
|
</text>
|
||||||
|
<text v-if="presellShow" class="gocom_btn">
|
||||||
|
去预定
|
||||||
|
<text class="iconfont icon-jiantou"></text>
|
||||||
|
</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="img-box">
|
||||||
|
<easy-loadimage mode="widthFix" :image-src="presellList[1].product.image"></easy-loadimage>
|
||||||
|
</view>
|
||||||
|
</navigator>
|
||||||
|
</block>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import easyLoadimage from '@/components/easy-loadimage/easy-loadimage.vue';
|
||||||
|
import { getPresellList } from '@/api/activity.js';
|
||||||
|
import { HTTP_REQUEST_URL } from '@/config/app';
|
||||||
|
export default {
|
||||||
|
components:{
|
||||||
|
easyLoadimage
|
||||||
|
},
|
||||||
|
name: 'presellList',
|
||||||
|
props: {
|
||||||
|
dataConfig: {
|
||||||
|
type: Object,
|
||||||
|
default: () => {}
|
||||||
|
},
|
||||||
|
merId: {
|
||||||
|
type: String || Number,
|
||||||
|
default: ''
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
domain: HTTP_REQUEST_URL,
|
||||||
|
presellList: [],
|
||||||
|
mbConfig: this.dataConfig.mbConfig.val*2, //页面间距
|
||||||
|
styleType: this.dataConfig.tabConfig.tabVal, //单行，多行，板块
|
||||||
|
bgStyle: this.dataConfig.bgStyle.type ? 20 : 0,
|
||||||
|
conStyle: this.dataConfig.conStyle.type ? 16 : 0,
|
||||||
|
titleShow: this.dataConfig.titleShow.val,
|
||||||
|
priceShow: this.dataConfig.priceShow.val,
|
||||||
|
themeColor: this.dataConfig.themeColor && this.dataConfig.themeColor.color[0].item,
|
||||||
|
presellShow: this.dataConfig.presellShow.val
|
||||||
|
};
|
||||||
|
},
|
||||||
|
created() {},
|
||||||
|
mounted() {
|
||||||
|
this.getPresellProduct()
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
// 预售
|
||||||
|
getPresellProduct() {
|
||||||
|
let that = this;
|
||||||
|
getPresellList({
|
||||||
|
mer_id: that.merId,
|
||||||
|
limit: that.styleType == 2 ? 3 : 12
|
||||||
|
}).then(res => {
|
||||||
|
that.presellList = res.data.list;
|
||||||
|
}).catch(e => {});
|
||||||
|
},
|
||||||
|
}
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
@import '../style/main.scss';
|
||||||
|
.presell-wrapper{
|
||||||
|
margin: 0 20rpx;
|
||||||
|
}
|
||||||
|
.spike-wrapper {
|
||||||
|
&.wrapper2{
|
||||||
|
padding: 0 20rpx 20rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.presell-count {
|
||||||
|
background-color: #fff;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
box-shadow: 4rpx 2rpx 12rpx 2rpx rgba(0, 0, 0, 0.03);
|
||||||
|
}
|
||||||
|
.title-bd {
|
||||||
|
margin-bottom: 0;
|
||||||
|
padding: 24rpx 30rpx 30rpx 30rpx;
|
||||||
|
border-radius: 16rpx 16rpx 0 0;
|
||||||
|
background-size: 100%;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
.more-btn {
|
||||||
|
top: 23rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.wapper_count {
|
||||||
|
padding-left: 20rpx;
|
||||||
|
}
|
||||||
|
.wrapper-count2{
|
||||||
|
.wapper_count{
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
185
pages/index/component/promotionList.vue
Normal file
185
pages/index/component/promotionList.vue
Normal file
@ -0,0 +1,185 @@
|
|||||||
|
<template>
|
||||||
|
<view class="index-product-wrapper" :class="iSshowH?'on':''" :style="'margin-top:'+mbConfig+'rpx;'">
|
||||||
|
<view class="nav-bd">
|
||||||
|
<view class="item" v-for="(item,index) in explosiveMoney" :index="index" :class="{active:index == ProductNavindex}"
|
||||||
|
@click="ProductNavTab(item.link.activeVal,index)">
|
||||||
|
<view class="txt">{{item.chiild[0].val}}</view>
|
||||||
|
<view class="label">{{item.chiild[1].val}}</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<!-- 首发新品 -->
|
||||||
|
<view class="list-box animated" :class='tempArr.length > 0?"fadeIn on":""'>
|
||||||
|
<view class="item" v-for="(item,index) in tempArr" :key="index" @click="goDetail(item)">
|
||||||
|
<view class="pictrue">
|
||||||
|
<span class="pictrue_log pictrue_log_class" v-if="item.activity && item.activity.type === '1'">秒杀</span>
|
||||||
|
<span class="pictrue_log pictrue_log_class" v-if="item.activity && item.activity.type === '2'">砍价</span>
|
||||||
|
<span class="pictrue_log pictrue_log_class" v-if="item.activity && item.activity.type === '3'">拼团</span>
|
||||||
|
<image :src="item.image" mode=""></image>
|
||||||
|
</view>
|
||||||
|
<view class="text-info">
|
||||||
|
<view class="title line1">{{item.store_name}}</view>
|
||||||
|
<view class="old-price"><text>¥</text>{{item.ot_price}}</view>
|
||||||
|
<view class="price" :style="'color:'+themeColor+';'">
|
||||||
|
<text>￥</text>{{item.price}}
|
||||||
|
<view class="txt" :style="'border-color:'+themeColor+';'" v-if="item.checkCoupon">券</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: 'promotionList',
|
||||||
|
props: {
|
||||||
|
dataConfig: {
|
||||||
|
type: Object,
|
||||||
|
default: () => {}
|
||||||
|
},
|
||||||
|
tempArr: {
|
||||||
|
type: Array,
|
||||||
|
default: []
|
||||||
|
},
|
||||||
|
iSshowH: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
ProductNavindex: 0,
|
||||||
|
explosiveMoney: this.dataConfig.tabConfig.list,
|
||||||
|
numConfig: this.dataConfig.numConfig.val,
|
||||||
|
// imgStyle: this.dataConfig.imgStyle.type,
|
||||||
|
mbConfig: this.dataConfig.mbConfig.val * 2,
|
||||||
|
themeColor: this.dataConfig.themeColor.color[0].item
|
||||||
|
};
|
||||||
|
},
|
||||||
|
created() {},
|
||||||
|
methods: {
|
||||||
|
// 首发新品切换
|
||||||
|
ProductNavTab(type, index) {
|
||||||
|
this.ProductNavindex = index;
|
||||||
|
this.$emit('changeTab', type);
|
||||||
|
},
|
||||||
|
goDetail(item){
|
||||||
|
this.$emit('detail',item);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
.index-product-wrapper {
|
||||||
|
margin: 30rpx 20rpx 0 20rpx;
|
||||||
|
&.on {
|
||||||
|
min-height: 1500rpx;
|
||||||
|
}
|
||||||
|
.nav-bd {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-around;
|
||||||
|
.item {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
&.on{
|
||||||
|
border-radius: 0;
|
||||||
|
}
|
||||||
|
.txt {
|
||||||
|
font-size: 32rpx;
|
||||||
|
color: #282828;
|
||||||
|
}
|
||||||
|
.label {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
width: 124rpx;
|
||||||
|
height: 32rpx;
|
||||||
|
margin-top: 5rpx;
|
||||||
|
font-size: 24rpx;
|
||||||
|
color: #999;
|
||||||
|
}
|
||||||
|
&.active {
|
||||||
|
color: $theme-color;
|
||||||
|
.label {
|
||||||
|
background: linear-gradient(90deg, $bg-star 0%, $bg-end 100%);
|
||||||
|
border-radius: 16rpx;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.list-box {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
justify-content: space-between;
|
||||||
|
margin-top: 30rpx;
|
||||||
|
.item {
|
||||||
|
width: 345rpx;
|
||||||
|
margin-bottom: 20rpx;
|
||||||
|
background-color: #fff;
|
||||||
|
border-radius: 20rpx;
|
||||||
|
overflow: hidden;
|
||||||
|
position: relative;
|
||||||
|
.pictrue_log {
|
||||||
|
width: 92rpx;
|
||||||
|
height: 44rpx;
|
||||||
|
font-size: 26rpx;
|
||||||
|
line-height: 44rpx;
|
||||||
|
}
|
||||||
|
image {
|
||||||
|
width: 100%;
|
||||||
|
height: 346rpx;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
.text-info {
|
||||||
|
padding: 10rpx 20rpx 15rpx;
|
||||||
|
.title {
|
||||||
|
color: #222222;
|
||||||
|
}
|
||||||
|
.old-price {
|
||||||
|
margin-top: 4rpx;
|
||||||
|
font-size: 26rpx;
|
||||||
|
color: #AAAAAA;
|
||||||
|
text-decoration: line-through;
|
||||||
|
text {
|
||||||
|
margin-right: 2px;
|
||||||
|
font-size: 20rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.price {
|
||||||
|
display: flex;
|
||||||
|
align-items: flex-end;
|
||||||
|
color: $theme-color;
|
||||||
|
font-size: 36rpx;
|
||||||
|
font-weight: 550;
|
||||||
|
text {
|
||||||
|
padding-bottom: 4rpx;
|
||||||
|
font-size: 26rpx;
|
||||||
|
font-weight: normal;
|
||||||
|
}
|
||||||
|
.txt {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
width: 28rpx;
|
||||||
|
height: 28rpx;
|
||||||
|
margin-left: 15rpx;
|
||||||
|
margin-bottom: 10rpx;
|
||||||
|
border: 1px solid $theme-color;
|
||||||
|
border-radius: 4rpx;
|
||||||
|
font-size: 20rpx;
|
||||||
|
font-weight: normal;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&.on {
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
49
pages/index/component/richText.vue
Normal file
49
pages/index/component/richText.vue
Normal file
@ -0,0 +1,49 @@
|
|||||||
|
<template>
|
||||||
|
<view class='richText' :style="'background-color:'+bgColor+';margin:'+ udConfig +'rpx '+ lrConfig +'rpx;'" v-if="description">
|
||||||
|
<!-- <view>大法官好地方规划的法规</view> -->
|
||||||
|
<!-- #ifndef APP-PLUS -->
|
||||||
|
<jyf-parser :domain='domain' :html="description.replace(/<br\/>/ig, '')" ref="article" :tag-style="tagStyle"></jyf-parser>
|
||||||
|
<!-- #endif -->
|
||||||
|
<!-- #ifdef APP-PLUS -->
|
||||||
|
<view class="description" v-html="description"></view>
|
||||||
|
<!-- #endif -->
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
import parser from "@/components/jyf-parser/jyf-parser";
|
||||||
|
import { HTTP_REQUEST_URL } from '@/config/app';
|
||||||
|
export default {
|
||||||
|
name: 'richText',
|
||||||
|
props: {
|
||||||
|
dataConfig: {
|
||||||
|
type: Object,
|
||||||
|
default: () => {}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
components: {
|
||||||
|
"jyf-parser": parser
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
tagStyle: {
|
||||||
|
img: 'width:100%;'
|
||||||
|
},
|
||||||
|
bgColor:this.dataConfig.bgColor.color[0].item,
|
||||||
|
lrConfig:this.dataConfig.lrConfig.val,
|
||||||
|
description:this.dataConfig.richText.val,
|
||||||
|
udConfig:this.dataConfig.udConfig.val * 2,
|
||||||
|
domain: HTTP_REQUEST_URL,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
created() {},
|
||||||
|
methods: {}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.richText{
|
||||||
|
padding: 20rpx;
|
||||||
|
background-color: #fff;
|
||||||
|
margin: 0 20rpx;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
240
pages/index/component/seckill.vue
Normal file
240
pages/index/component/seckill.vue
Normal file
@ -0,0 +1,240 @@
|
|||||||
|
<template>
|
||||||
|
<view v-if="spikeList.length > 0" class="skeleton-rect" :style="'margin-top:'+mbConfig+'rpx'">
|
||||||
|
<view class="seckill-count" :class="'wrapper-count'+styleType" :style="'background:'+bgColor+';border-radius:'+bgStyle+'rpx'">
|
||||||
|
<view class="spike-bd">
|
||||||
|
<view class="acea-row row-middle">
|
||||||
|
<image class="title-img" :src="`${domain}/static/images/spike_title.png`"></image>
|
||||||
|
<view class="spike-distance">
|
||||||
|
<text :style="'background-color:'+countDownColor" class="text bg-red">距结束</text>
|
||||||
|
<countDown class="spike-count" :is-day="false" :tip-text="' '" :day-text="' '" :hour-text="':'" :minute-text="':'" :second-text="' '" :datatime="datatime" :colors="themeColor" @getProduct="getProduct"></countDown>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<navigator v-if="!merId" url="/pages/activity/goods_seckill/index" class="more-btn" hover-class="none">
|
||||||
|
更多惊喜
|
||||||
|
<text class="iconfont icon-jiantou" hover-class="none"></text>
|
||||||
|
</navigator>
|
||||||
|
</view>
|
||||||
|
<view class="spike-wrapper" :class="'wrapper'+styleType">
|
||||||
|
<scroll-view v-if="styleType != 2" :class="'colum'+styleType" :scroll-x="styleType == 0 ? true : false" show-scrollbar="false">
|
||||||
|
<navigator
|
||||||
|
class="spike-item"
|
||||||
|
v-for="(item, index) in spikeList"
|
||||||
|
:key="index"
|
||||||
|
:url="'/pages/activity/goods_seckill_details/index?id=' + item.product_id + '&time=' + item.stop + ''"
|
||||||
|
hover-class="none">
|
||||||
|
<view class="img-box" :class="'img-box'+conStyle">
|
||||||
|
<easy-loadimage mode="widthFix" :image-src="item.image"></easy-loadimage>
|
||||||
|
</view>
|
||||||
|
<view class="info">
|
||||||
|
<view v-if="titleShow" class="name line1">{{ item.store_name }}</view>
|
||||||
|
<view v-if="progressShow" class="stock-box">
|
||||||
|
<view class="grabbed" :style="'width:' + item.percent + ';'"></view>
|
||||||
|
<text class="stock-sales">{{ item.percent }}</text>
|
||||||
|
</view>
|
||||||
|
<view class="price-box">
|
||||||
|
<text class="price">
|
||||||
|
<text>￥</text>
|
||||||
|
{{ item.price }}
|
||||||
|
</text>
|
||||||
|
<text v-if="priceShow" class="old-price">
|
||||||
|
<text>￥</text>
|
||||||
|
{{ item.ot_price }}
|
||||||
|
</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</navigator>
|
||||||
|
</scroll-view>
|
||||||
|
<block v-else class="acea-row row-between-wrapper combination">
|
||||||
|
<navigator
|
||||||
|
class="combination-item"
|
||||||
|
v-for="(item, index) in spikeList"
|
||||||
|
:key="index"
|
||||||
|
hover-class="none"
|
||||||
|
:style="{ 'background-image': `url(${domain}/static/images/combination${index+1}.png)`,'border-radius':`${conStyle}rpx`}"
|
||||||
|
:url="'/pages/activity/goods_seckill_details/index?id=' + item.product_id + '&time=' + item.stop + ''"
|
||||||
|
>
|
||||||
|
<view class="info">
|
||||||
|
<view class="price-box combination-price">
|
||||||
|
<view v-if="titleShow" class="name line1">{{ item.store_name }}</view>
|
||||||
|
<text class="price">
|
||||||
|
<text>￥</text>
|
||||||
|
{{ item.price }}
|
||||||
|
</text>
|
||||||
|
<text class="gocom_btn">
|
||||||
|
去抢购
|
||||||
|
<text class="iconfont icon-jiantou"></text>
|
||||||
|
</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="img-box">
|
||||||
|
<easy-loadimage mode="widthFix" :image-src="item.image"></easy-loadimage>
|
||||||
|
</view>
|
||||||
|
</navigator>
|
||||||
|
<navigator v-if="spikeList.length == 1"
|
||||||
|
class="combination-item"
|
||||||
|
hover-class="none"
|
||||||
|
:style="{ 'background-image': `url(${domain}/static/images/combination2.png)`,'border-radius':`${conStyle}rpx`}"
|
||||||
|
:url="'/pages/activity/goods_seckill_details/index?id=' + spikeList[0].product_id + '&time=' + spikeList[0].stop + ''"
|
||||||
|
>
|
||||||
|
<view class="info">
|
||||||
|
<view class="price-box combination-price">
|
||||||
|
<view v-if="titleShow" class="name line1">{{ spikeList[0].store_name }}</view>
|
||||||
|
<text class="price">
|
||||||
|
<text>￥</text>
|
||||||
|
{{ spikeList[0].price }}
|
||||||
|
</text>
|
||||||
|
<text class="gocom_btn">
|
||||||
|
去抢购
|
||||||
|
<text class="iconfont icon-jiantou"></text>
|
||||||
|
</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="img-box">
|
||||||
|
<easy-loadimage mode="widthFix" :image-src="spikeList[0].image"></easy-loadimage>
|
||||||
|
</view>
|
||||||
|
</navigator>
|
||||||
|
<navigator v-if="spikeList.length == 1"
|
||||||
|
class="combination-item"
|
||||||
|
hover-class="none"
|
||||||
|
:style="{ 'background-image': `url(${domain}/static/images/combination3.png)`,'border-radius':`${conStyle}rpx`}"
|
||||||
|
:url="'/pages/activity/goods_seckill_details/index?id=' + spikeList[0].product_id + '&time=' + spikeList[0].stop + ''"
|
||||||
|
>
|
||||||
|
<view class="info">
|
||||||
|
<view class="price-box combination-price">
|
||||||
|
<view v-if="titleShow" class="name line1">{{ spikeList[0].store_name }}</view>
|
||||||
|
<text class="price">
|
||||||
|
<text>￥</text>
|
||||||
|
{{ spikeList[0].price }}
|
||||||
|
</text>
|
||||||
|
<text class="gocom_btn">
|
||||||
|
去抢购
|
||||||
|
<text class="iconfont icon-jiantou"></text>
|
||||||
|
</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="img-box">
|
||||||
|
<easy-loadimage mode="widthFix" :image-src="spikeList[0].image"></easy-loadimage>
|
||||||
|
</view>
|
||||||
|
</navigator>
|
||||||
|
<navigator v-if="spikeList.length == 2"
|
||||||
|
class="combination-item"
|
||||||
|
hover-class="none"
|
||||||
|
:style="{ 'background-image': `url(${domain}/static/images/combination3.png)`,'border-radius':`${conStyle}rpx`}"
|
||||||
|
:url="'/pages/activity/goods_seckill_details/index?id=' + spikeList[1].product_id + '&time=' + spikeList[1].stop + ''"
|
||||||
|
>
|
||||||
|
<view class="info">
|
||||||
|
<view class="price-box combination-price">
|
||||||
|
<view v-if="titleShow" class="name line1">{{ spikeList[1].store_name }}</view>
|
||||||
|
<text class="price">
|
||||||
|
<text>￥</text>
|
||||||
|
{{ spikeList[1].price }}
|
||||||
|
</text>
|
||||||
|
<text class="gocom_btn">
|
||||||
|
去抢购
|
||||||
|
<text class="iconfont icon-jiantou"></text>
|
||||||
|
</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="img-box">
|
||||||
|
<easy-loadimage mode="widthFix" :image-src="spikeList[1].image"></easy-loadimage>
|
||||||
|
</view>
|
||||||
|
</navigator>
|
||||||
|
</block>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { HTTP_REQUEST_URL } from '@/config/app';
|
||||||
|
import countDown from '@/components/countDown';
|
||||||
|
import easyLoadimage from '@/components/easy-loadimage/easy-loadimage.vue';
|
||||||
|
import {
|
||||||
|
getSeckillIndexTime,
|
||||||
|
getSeckillList
|
||||||
|
} from '@/api/activity.js';
|
||||||
|
export default {
|
||||||
|
name: 'seckill',
|
||||||
|
components:{
|
||||||
|
countDown,
|
||||||
|
easyLoadimage
|
||||||
|
},
|
||||||
|
props: {
|
||||||
|
dataConfig: {
|
||||||
|
type: Object,
|
||||||
|
default: () => {}
|
||||||
|
},
|
||||||
|
merId: {
|
||||||
|
type: String || Number,
|
||||||
|
default: ''
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
domain: HTTP_REQUEST_URL,
|
||||||
|
datatime:0,
|
||||||
|
spikeList: [],
|
||||||
|
countDownColor: this.dataConfig.countDownColor.color[0].item,
|
||||||
|
themeColor: this.dataConfig.themeColor.color[0].item,
|
||||||
|
styleType: this.dataConfig.tabConfig.tabVal, //单行，多行，板块
|
||||||
|
mbConfig: this.dataConfig.mbConfig.val*2,
|
||||||
|
bgStyle: this.dataConfig.bgStyle.type ? 20 : 0,
|
||||||
|
bgColor: this.dataConfig.bgColor.color[0].item,
|
||||||
|
conStyle: this.dataConfig.conStyle.type ? 16 : 0,
|
||||||
|
priceShow: this.dataConfig.priceShow.val,
|
||||||
|
progressShow: this.dataConfig.progressShow.val,
|
||||||
|
titleShow: this.dataConfig.titleShow.val
|
||||||
|
};
|
||||||
|
},
|
||||||
|
created() {},
|
||||||
|
mounted() {
|
||||||
|
this.getSpikeProduct();
|
||||||
|
this.getSpeckillCutTime();
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
// 获取秒杀截止时间
|
||||||
|
getSpeckillCutTime() {
|
||||||
|
getSeckillIndexTime().then(res => {
|
||||||
|
this.datatime = res.data.seckillEndTime ? res.data.seckillEndTime : '';
|
||||||
|
});
|
||||||
|
},
|
||||||
|
getSpikeProduct() {
|
||||||
|
let that = this;
|
||||||
|
getSeckillList({
|
||||||
|
mer_id:that.merId,limit: that.styleType == 2 ? 3 : 12
|
||||||
|
}).then(res => {
|
||||||
|
that.spikeList = res.data.list;
|
||||||
|
that.spikeList.map(item => {
|
||||||
|
item.percent = item.stock === 0 ? '0%' : ((item.sales * 100) / item.stock).toFixed(2) + '%';
|
||||||
|
});
|
||||||
|
}).catch(e => {});
|
||||||
|
},
|
||||||
|
getProduct(){
|
||||||
|
this.getSpeckillCutTime();
|
||||||
|
this.getSpikeProduct();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
@import '../style/main.scss';
|
||||||
|
.seckill-count {
|
||||||
|
background-color: #fff;
|
||||||
|
margin: 0 20rpx;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
padding: 24rpx 0 26rpx 20rpx;
|
||||||
|
box-shadow: 4rpx 2rpx 12rpx 2rpx rgba(0, 0, 0, 0.03);
|
||||||
|
&.wrapper-count2{
|
||||||
|
padding: 24rpx 20rpx 26rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.spike-count{
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
/deep/.spike-bd .red{
|
||||||
|
color: #e93323!important;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
299
pages/index/component/shopList.vue
Normal file
299
pages/index/component/shopList.vue
Normal file
@ -0,0 +1,299 @@
|
|||||||
|
<template>
|
||||||
|
<view :style="'margin-top:' +mbConfig+'rpx;background:'+bgColor">
|
||||||
|
<view class="explosion" :style="'margin:0 '+prConfig+'rpx'">
|
||||||
|
<view class="common-hd" mode="widthFix" v-if="logoUrl">
|
||||||
|
<image class="title-img" mode="widthFix" :src="logoUrl"></image>
|
||||||
|
</view>
|
||||||
|
<view class="mer-box">
|
||||||
|
<block v-if="tabConfig == 0">
|
||||||
|
<view class="mer-item" v-for="(item, index) in brandList" :key="index" :style="'border-radius:'+bgStyle+'rpx'">
|
||||||
|
<view class="mer-hd" @click="goStore(item.mer_id)" :style="'border-radius:'+bgStyle+'rpx '+bgStyle+'rpx 0 0'">
|
||||||
|
<image :src="item.mer_banner"></image>
|
||||||
|
<view class="mer-name">
|
||||||
|
<image :src="item.mer_avatar"></image>
|
||||||
|
<view class="txt line1">{{ item.mer_name }}</view>
|
||||||
|
<text v-if="item.type_name" class="store_type" :style="'background:'+themeColor">{{ item.type_name }}</text>
|
||||||
|
<text v-else-if="item.is_trader" class="store_type" :style="'background:'+themeColor">自营</text>
|
||||||
|
</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"
|
||||||
|
>
|
||||||
|
<view class="picture">
|
||||||
|
<easy-loadimage mode="widthFix" :image-src="itemn.image"></easy-loadimage>
|
||||||
|
<view v-if="itemn.border_pic" :style="{ backgroundImage: `url(${itemn.border_pic})` }" class="border-picture"></view>
|
||||||
|
</view>
|
||||||
|
<view v-if="titleShow" class="name line1">{{itemn.store_name}}</view>
|
||||||
|
<view v-if="priceShow" class="price" :style="'color:'+themeColor">
|
||||||
|
<text>￥</text>
|
||||||
|
{{ itemn.price }}
|
||||||
|
</view>
|
||||||
|
</navigator>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</block>
|
||||||
|
<block v-else>
|
||||||
|
<view class="mer_count">
|
||||||
|
<view class="item" v-for="(item, index) in brandList" :key="index" @click="goStore(item.mer_id)">
|
||||||
|
<easy-loadimage mode="widthFix" :image-src="item.mer_avatar"></easy-loadimage>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</block>
|
||||||
|
<view class="more-shop" @click="moreShop">
|
||||||
|
<text>更多店铺</text>
|
||||||
|
<text class="iconfont icon-xiangyou"></text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import easyLoadimage from '@/components/easy-loadimage/easy-loadimage.vue';
|
||||||
|
import { storeMerchantList } from '@/api/store.js';
|
||||||
|
import { mapGetters } from 'vuex';
|
||||||
|
import { configMap } from '@/utils';
|
||||||
|
export default {
|
||||||
|
computed: configMap(['hide_mer_status']),
|
||||||
|
components: {
|
||||||
|
easyLoadimage
|
||||||
|
},
|
||||||
|
props: {
|
||||||
|
dataConfig: {
|
||||||
|
type: Object,
|
||||||
|
default: () => {}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
brandList: [],
|
||||||
|
mbConfig: this.dataConfig.mbConfig.val*2, //页面间距
|
||||||
|
prConfig: this.dataConfig.prConfig.val*2, //背景间距
|
||||||
|
logoUrl: this.dataConfig.logoConfig.url,
|
||||||
|
bgStyle: this.dataConfig.bgStyle.type ? '16' : 0,
|
||||||
|
bgColor: this.dataConfig.bgColor.color[0].item,
|
||||||
|
themeColor: this.dataConfig.themeColor.color[0].item,
|
||||||
|
tabConfig: this.dataConfig.tabConfig.tabVal, //展示样式
|
||||||
|
numConfig: this.dataConfig.numConfig.val,
|
||||||
|
titleShow: this.dataConfig.titleShow.val,
|
||||||
|
priceShow: this.dataConfig.priceShow.val
|
||||||
|
}
|
||||||
|
},
|
||||||
|
created() {},
|
||||||
|
mounted() {
|
||||||
|
this.storeMerchant();
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
// 进店看看
|
||||||
|
goStore(id) {
|
||||||
|
if (this.hide_mer_status != 1) {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: `/pages/store/home/index?id=${id}`
|
||||||
|
});
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 更多店铺
|
||||||
|
moreShop() {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: `/pages/store/shopStreet/index?cate_id=&type_id=`
|
||||||
|
});
|
||||||
|
},
|
||||||
|
// 品牌好店
|
||||||
|
storeMerchant() {
|
||||||
|
storeMerchantList({
|
||||||
|
page: 1,
|
||||||
|
limit: this.numConfig ? this.numConfig : 4,
|
||||||
|
is_best: 1
|
||||||
|
}).then(res => {
|
||||||
|
this.brandList = res.data.list;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
}
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
.explosion {
|
||||||
|
.common-hd {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
.title-img{
|
||||||
|
width: 242rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.mer-box {
|
||||||
|
margin-bottom: 20rpx;
|
||||||
|
.mer-item {
|
||||||
|
margin-bottom: 20rpx;
|
||||||
|
background-color: #fff;
|
||||||
|
text-align: center;
|
||||||
|
.mer-hd {
|
||||||
|
position: relative;
|
||||||
|
width: 100%;
|
||||||
|
height: 200rpx;
|
||||||
|
border-radius: 16rpx 16rpx 0 0;
|
||||||
|
overflow: hidden;
|
||||||
|
image {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
.mer-name {
|
||||||
|
position: absolute;
|
||||||
|
left: 20rpx;
|
||||||
|
top: 20rpx;
|
||||||
|
display: flex;
|
||||||
|
max-width: 60%;
|
||||||
|
padding: 8rpx 8rpx 8rpx 4rpx;
|
||||||
|
border-radius: 26rpx;
|
||||||
|
background: #fff;
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 12px;
|
||||||
|
align-items: center;
|
||||||
|
image {
|
||||||
|
width: 38rpx;
|
||||||
|
height: 38rpx;
|
||||||
|
margin-right: 10rpx;
|
||||||
|
border-radius: 50%;
|
||||||
|
}
|
||||||
|
.txt {
|
||||||
|
flex: 1;
|
||||||
|
line-height: 19px;
|
||||||
|
height: 19px;
|
||||||
|
}
|
||||||
|
.store_type {
|
||||||
|
font-size: 10px;
|
||||||
|
color: #fff;
|
||||||
|
background-color: #e93323;
|
||||||
|
padding: 0 5px;
|
||||||
|
line-height: 19px;
|
||||||
|
height: 19px;
|
||||||
|
margin-left: 20rpx;
|
||||||
|
border-radius: 30rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
/deep/.easy-loadimage,/deep/uni-image,image,/deep/.loadfail-img{
|
||||||
|
width: 100%;
|
||||||
|
height: 214rpx;
|
||||||
|
}
|
||||||
|
.pro-box {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
padding: 20rpx 20rpx 30rpx;
|
||||||
|
.pro-item {
|
||||||
|
width: 31.3%;
|
||||||
|
margin-right: 3.05%;
|
||||||
|
.picture,/deep/.easy-loadimage,/deep/uni-image,/deep/image,/deep/.loadfail-img {
|
||||||
|
width: 100%;
|
||||||
|
height: 214rpx;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.sell_out {
|
||||||
|
display: flex;
|
||||||
|
width: 110rpx;
|
||||||
|
height: 110rpx;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
border-radius: 100%;
|
||||||
|
background: rgba(0,0,0,.6);
|
||||||
|
color: #fff;
|
||||||
|
font-size: 24rpx;
|
||||||
|
position: absolute;
|
||||||
|
top: 50%;
|
||||||
|
left: 50%;
|
||||||
|
margin: -55rpx 0 0 -55rpx;
|
||||||
|
&::before{
|
||||||
|
content: "";
|
||||||
|
display: block;
|
||||||
|
width: 100rpx;
|
||||||
|
height: 100rpx;
|
||||||
|
border-radius: 100%;
|
||||||
|
border: 1px dashed #fff;
|
||||||
|
position: absolute;
|
||||||
|
top: 5rpx;
|
||||||
|
left: 5rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.border-picture {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
background: center/cover no-repeat;
|
||||||
|
}
|
||||||
|
.name{
|
||||||
|
padding: 6rpx 9rpx;
|
||||||
|
margin-top: 6rpx;
|
||||||
|
}
|
||||||
|
.price {
|
||||||
|
margin-top: 5rpx;
|
||||||
|
font-size: 28rpx;
|
||||||
|
color: $theme-color;
|
||||||
|
font-weight: bold;
|
||||||
|
text {
|
||||||
|
font-size: 28rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&:last-child {
|
||||||
|
margin-right: 0;
|
||||||
|
}
|
||||||
|
.picture {
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
.border-picture {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
background: center/cover no-repeat;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.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;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.mer_count{
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
padding: 20rpx;
|
||||||
|
align-items: center;
|
||||||
|
.item{
|
||||||
|
width: 23.5%;
|
||||||
|
height: 140rpx;
|
||||||
|
margin: 0 2% 10px 0;
|
||||||
|
background: #FEFEFF;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
/deep/uni-image,/deep/image,/deep/.easy-loadimage{
|
||||||
|
width: 140rpx;
|
||||||
|
height: 70rpx;
|
||||||
|
}
|
||||||
|
&:nth-child(4n){
|
||||||
|
margin-right: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
219
pages/index/component/swiperBg.vue
Normal file
219
pages/index/component/swiperBg.vue
Normal file
@ -0,0 +1,219 @@
|
|||||||
|
<template>
|
||||||
|
<view class="swiperBg" :style="'margin-top:' + marginTop +'rpx;background: linear-gradient(180deg, '+ bgColor0 +' 50%, '+ bgColor1 +' 100%);'">
|
||||||
|
<!-- 单图模式 -->
|
||||||
|
<block v-if="swiperType == 0">
|
||||||
|
<view class="item-img" v-for="(item,index) in imgUrls" :key="index" :style="{padding:'0 '+paddinglr+'rpx',marginBottom:itemEdge+'rpx'}">
|
||||||
|
<image @click="goDetail(item)" :src="item.img"></image></view>
|
||||||
|
</block>
|
||||||
|
<block v-else>
|
||||||
|
<view class="swiper page_swiper" :class="[docConfig == 1 ? 'square' : docConfig == 0 ? 'circular' : 'nodoc',imgConfig?'':'fillet','dot'+txtStyle]"
|
||||||
|
:style="'padding: 0 '+ paddinglr +'rpx;'"
|
||||||
|
v-if="imgUrls.length">
|
||||||
|
<swiper
|
||||||
|
indicator-dots="true"
|
||||||
|
:autoplay="true"
|
||||||
|
:circular="circular"
|
||||||
|
:interval="interval"
|
||||||
|
:duration="duration"
|
||||||
|
indicator-color="rgba(255,255,255,0.6)"
|
||||||
|
indicator-active-color="#fff"
|
||||||
|
:current="swiperCur"
|
||||||
|
previous-margin="20rpx"
|
||||||
|
next-margin="20rpx"
|
||||||
|
@change="swiperChange"
|
||||||
|
>
|
||||||
|
<block v-for="(item,index) in imgUrls" :key="index">
|
||||||
|
<swiper-item :class="{ active: index == swiperCur }">
|
||||||
|
<view @click="goDetail(item)" class='slide-navigator acea-row row-between-wrapper'>
|
||||||
|
<image :src="item.img" class="slide-image aa"></image>
|
||||||
|
</view>
|
||||||
|
</swiper-item>
|
||||||
|
</block>
|
||||||
|
</swiper>
|
||||||
|
</view>
|
||||||
|
</block>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import {merPath} from "@/utils/index"
|
||||||
|
|
||||||
|
export default {
|
||||||
|
name: 'swiperBg',
|
||||||
|
props: {
|
||||||
|
dataConfig: {
|
||||||
|
type: Object,
|
||||||
|
default: () => {}
|
||||||
|
},
|
||||||
|
merId:{}
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
indicatorDots: false,
|
||||||
|
circular: true,
|
||||||
|
autoplay: true,
|
||||||
|
interval: 3000,
|
||||||
|
duration: 500,
|
||||||
|
imgUrls: [], //图片轮播数据
|
||||||
|
bgColor0: this.dataConfig.isShow.val ? this.dataConfig.bgColor.color[0].item : 'transparent', //轮播背景颜色
|
||||||
|
bgColor1: this.dataConfig.isShow.val ? this.dataConfig.bgColor.color[1].item : 'transparent', //轮播背景颜色
|
||||||
|
marginTop: this.dataConfig.mbConfig.val, //组件上边距
|
||||||
|
paddinglr: this.dataConfig.lrConfig.val, //轮播左右边距
|
||||||
|
docConfig: this.dataConfig.docConfig.type, //指示点样式
|
||||||
|
imgConfig: this.dataConfig.imgConfig.type, //是否为圆角
|
||||||
|
txtStyle: this.dataConfig.txtStyle.type, //指示器位置
|
||||||
|
imageH: 310,
|
||||||
|
swiperCur: 0,
|
||||||
|
swiperType: 1,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
watch: {
|
||||||
|
imageH(nVal, oVal) {
|
||||||
|
let self = this
|
||||||
|
this.imageH = nVal
|
||||||
|
}
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
this.imgUrls = this.dataConfig.swiperConfig.list
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
let that = this;
|
||||||
|
this.$nextTick(function() {
|
||||||
|
uni.getImageInfo({
|
||||||
|
src: that.setDomain(that.imgUrls[0].img),
|
||||||
|
success: function(res) {
|
||||||
|
that.$set(that, 'imageH', res.height);
|
||||||
|
},
|
||||||
|
fail: function(error) {
|
||||||
|
that.$set(that, 'imageH', 310);
|
||||||
|
}
|
||||||
|
})
|
||||||
|
})
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
//替换安全域名
|
||||||
|
setDomain: function(url) {
|
||||||
|
url = url ? url.toString() : '';
|
||||||
|
//本地调试打开,生产请注销
|
||||||
|
if (url.indexOf("https://") > -1) return url;
|
||||||
|
else return url.replace('http://', 'https://');
|
||||||
|
},
|
||||||
|
swiperChange(e) {
|
||||||
|
let { current, source } = e.detail;
|
||||||
|
if (source === 'autoplay' || source === 'touch') {
|
||||||
|
this.swiperCur = e.detail.current;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
goDetail(url){
|
||||||
|
let urls = url.info[1].value
|
||||||
|
urls = merPath(urls, this.merId)
|
||||||
|
if(urls.indexOf("http") != -1){
|
||||||
|
// #ifdef H5
|
||||||
|
location.href = urls
|
||||||
|
// #endif
|
||||||
|
}else{
|
||||||
|
if(['/pages/goods_cate/goods_cate','/pages/order_addcart/order_addcart','/pages/user/index','/pages/plant_grass/index'].indexOf(urls) == -1){
|
||||||
|
uni.navigateTo({
|
||||||
|
url:urls
|
||||||
|
})
|
||||||
|
}else{
|
||||||
|
uni.switchTab({
|
||||||
|
url:urls
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.swiperBg {
|
||||||
|
position: relative;
|
||||||
|
background: #fff;
|
||||||
|
z-index: 1;
|
||||||
|
.colorBg {
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
top: 0;
|
||||||
|
height: 130rpx;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
.page_swiper {
|
||||||
|
position: relative;
|
||||||
|
width: 100%;
|
||||||
|
height: auto;
|
||||||
|
margin: 0 auto;
|
||||||
|
border-radius: 10rpx;
|
||||||
|
overflow-x: hidden;
|
||||||
|
/* #ifdef MP */
|
||||||
|
z-index: 20;
|
||||||
|
/* #endif */
|
||||||
|
/* 设置圆角 */
|
||||||
|
&.fillet {
|
||||||
|
.swiper-item, image, .acea-row.row-between-wrapper{
|
||||||
|
border-radius: 10rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.swiper-item, image, .acea-row.row-between-wrapper {
|
||||||
|
width: 100%;
|
||||||
|
height:100%;
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
swiper{
|
||||||
|
width: 100%;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
image {
|
||||||
|
transform: scale(0.93);
|
||||||
|
transition: all 0.6s ease;
|
||||||
|
}
|
||||||
|
swiper-item.active {
|
||||||
|
image {
|
||||||
|
transform: scale(1);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// 圆形指示点
|
||||||
|
&.circular {
|
||||||
|
/deep/.uni-swiper-dot {
|
||||||
|
width: 10rpx;
|
||||||
|
height: 10rpx;
|
||||||
|
background: rgba(0, 0, 0, .4);
|
||||||
|
}
|
||||||
|
/deep/.uni-swiper-dot-active {
|
||||||
|
background: #fff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// 方形指示点
|
||||||
|
&.square {
|
||||||
|
/deep/.uni-swiper-dot {
|
||||||
|
width: 20rpx;
|
||||||
|
height: 5rpx;
|
||||||
|
border-radius: 3rpx;
|
||||||
|
background: rgba(0, 0, 0, .4);
|
||||||
|
}
|
||||||
|
/deep/.uni-swiper-dot-active {
|
||||||
|
background: #fff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&.nodoc{
|
||||||
|
/deep/.uni-swiper-dot {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
/deep/.dot0 .uni-swiper-dots-horizontal{
|
||||||
|
left: 10%;
|
||||||
|
}
|
||||||
|
/deep/.dot1 .uni-swiper-dots-horizontal{
|
||||||
|
left: 50%;
|
||||||
|
}
|
||||||
|
/deep/.dot2 .uni-swiper-dots-horizontal{
|
||||||
|
left: 90%;
|
||||||
|
}
|
||||||
|
.item-img image{
|
||||||
|
display: block;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
270
pages/index/component/tabNav.vue
Normal file
270
pages/index/component/tabNav.vue
Normal file
@ -0,0 +1,270 @@
|
|||||||
|
<template>
|
||||||
|
<view>
|
||||||
|
<!-- #ifdef MP || APP-PLUS -->
|
||||||
|
<view style="visibility: hidden;" :style="{ height: navHeight + 'rpx' }" v-if="isFixed"></view>
|
||||||
|
<!-- #endif -->
|
||||||
|
<view class="navTabBox tabNav" :class="{isFixed:isFixed}" :style="'background: '+ bgColor +';margin-top:'+mbConfig+'rpx;color:'+txtColor+';top:'+isTop">
|
||||||
|
<view class="longTab" :style='"width:"+mainWidth+"px"'>
|
||||||
|
<scroll-view scroll-x="true" style="white-space: nowrap; display: flex;" scroll-with-animation :scroll-left="tabLeft" show-scrollbar="true">
|
||||||
|
<view class="longItem" :style="'width:'+isWidth+'px;color:' + (index===tabClick ? activeColor : txtColor)" :data-index="index" :class="index===tabClick?'click':''" v-for="(item,index) in tabTitle" :key="index" :id="'id'+index" @click="longClick(index,item.store_category_id,item.pid)">{{item.cate_name}}</view>
|
||||||
|
<view class="underlineBox" :style='"transform:translateX("+isLeft+"px);width:"+isWidth+"px"'>
|
||||||
|
<view class="underline" :style="'background-color:'+activeColor"></view>
|
||||||
|
</view>
|
||||||
|
</scroll-view>
|
||||||
|
</view>
|
||||||
|
<navigator v-if="merId" :url="'/pages/store/home/index?id='+merId+'&type=2'" class="category" hover-class="none" :style="'background-color:'+bgColor+';color:'+txtColor">
|
||||||
|
<text class="iconfont icon-fenlei3"></text>分类
|
||||||
|
</navigator>
|
||||||
|
<navigator v-else open-type='switchTab' url="/pages/goods_cate/goods_cate" class="category" hover-class="none" :style="'background-color:'+bgColor+';color:'+txtColor">
|
||||||
|
<text class="iconfont icon-fenlei3"></text>分类
|
||||||
|
</navigator>
|
||||||
|
</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();
|
||||||
|
export default {
|
||||||
|
name: 'navTab',
|
||||||
|
props: {
|
||||||
|
tabTitle: {
|
||||||
|
type: Array,
|
||||||
|
default: []
|
||||||
|
},
|
||||||
|
dataConfig: {
|
||||||
|
type: Object,
|
||||||
|
default: () => {}
|
||||||
|
},
|
||||||
|
isFixed: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
|
},
|
||||||
|
merId: {
|
||||||
|
type: String || Number,
|
||||||
|
default: ''
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
tabClick: 0, //导航栏被点击
|
||||||
|
isLeft: 0, //导航栏下划线位置
|
||||||
|
isWidth: 0, //每个导航栏占位
|
||||||
|
mainWidth: 0,
|
||||||
|
tabLeft:0,
|
||||||
|
swiperIndex:0,
|
||||||
|
childIndex:0,
|
||||||
|
childID:0,
|
||||||
|
bgColor:this.dataConfig.bgColor.color[0].item,
|
||||||
|
mbConfig:this.dataConfig.mbConfig.val * 2,
|
||||||
|
txtColor:this.dataConfig.txtColor.color[0].item,
|
||||||
|
activeColor: this.dataConfig.activeColor.color[0].item,
|
||||||
|
fixedTop: 0,
|
||||||
|
isTop: 0,
|
||||||
|
navHeight: 38,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
created() {
|
||||||
|
var that = this
|
||||||
|
// 获取设备宽度
|
||||||
|
uni.getSystemInfo({
|
||||||
|
success(e) {
|
||||||
|
that.mainWidth = e.windowWidth
|
||||||
|
that.isWidth = (e.windowWidth-65) / 4
|
||||||
|
}
|
||||||
|
})
|
||||||
|
setTimeout((e) => {
|
||||||
|
const query = uni.createSelectorQuery().in(this);
|
||||||
|
query.select('.navTabBox').boundingClientRect(data => {
|
||||||
|
|
||||||
|
that.navHeight = data.height * 2
|
||||||
|
that.$emit('bindHeight', data)
|
||||||
|
}).exec();
|
||||||
|
}, 300)
|
||||||
|
that.$nextTick(function() {
|
||||||
|
uni.getSystemInfo({
|
||||||
|
success: function(res) {
|
||||||
|
that.windowHeight = res.windowHeight;
|
||||||
|
}
|
||||||
|
});
|
||||||
|
})
|
||||||
|
// #ifdef MP || APP-PLUS
|
||||||
|
this.isTop = (uni.getSystemInfoSync().statusBarHeight + 43) + 'px'
|
||||||
|
// #endif
|
||||||
|
// #ifdef H5
|
||||||
|
this.isTop = 0
|
||||||
|
// #endif
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
// 导航栏点击
|
||||||
|
longClick(index,id,fid){
|
||||||
|
app.globalData.fid = fid;
|
||||||
|
this.childIndex = 0;
|
||||||
|
if(this.tabTitle.length>3){
|
||||||
|
var tempIndex = index - 2;
|
||||||
|
tempIndex = tempIndex<=0 ? 0 : tempIndex;
|
||||||
|
this.tabLeft = (index-2) * this.isWidth //设置下划线位置
|
||||||
|
}
|
||||||
|
this.tabClick = index //设置导航点击了哪一个
|
||||||
|
this.isLeft = index * this.isWidth //设置下划线位置
|
||||||
|
let obj = {
|
||||||
|
index:index,
|
||||||
|
pid:id//自己的id
|
||||||
|
}
|
||||||
|
if(!this.merId){
|
||||||
|
this.parentEmit(obj);
|
||||||
|
}else{
|
||||||
|
if(id){
|
||||||
|
uni.navigateTo({
|
||||||
|
url: '/pages/store/list/index?id='+id+'&mer_id='+this.merId
|
||||||
|
});
|
||||||
|
}else{
|
||||||
|
uni.navigateTo({
|
||||||
|
url: '/pages/store/home/index?id='+this.merId
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
},
|
||||||
|
parentEmit(obj){
|
||||||
|
this.$emit('changeTab', obj);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.tabNav {
|
||||||
|
padding-top: 10rpx;
|
||||||
|
}
|
||||||
|
.navTabBox {
|
||||||
|
width: 100%;
|
||||||
|
color: rgba(255, 255, 255, 1);
|
||||||
|
position: relative;
|
||||||
|
padding-bottom: 10rpx;
|
||||||
|
&.isFixed {
|
||||||
|
z-index: 10;
|
||||||
|
position: fixed;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
/* #ifdef H5 */
|
||||||
|
top: 0;
|
||||||
|
/* #endif */
|
||||||
|
}
|
||||||
|
.click {
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
.longTab {
|
||||||
|
/* #ifdef H5 */
|
||||||
|
padding-right: 106rpx;
|
||||||
|
/* #endif */
|
||||||
|
/* #ifdef MP || APP-PLUS */
|
||||||
|
padding-right: 116rpx;
|
||||||
|
/* #endif */
|
||||||
|
.longItem{
|
||||||
|
height: 50upx;
|
||||||
|
display: inline-block;
|
||||||
|
line-height: 50upx;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 28rpx;
|
||||||
|
color: #333333;
|
||||||
|
max-width: 160rpx;
|
||||||
|
white-space: nowrap;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
&.click{
|
||||||
|
font-weight: bold;
|
||||||
|
font-size: 30rpx;
|
||||||
|
color: #E93323;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.underlineBox {
|
||||||
|
height: 3px;
|
||||||
|
width: 20%;
|
||||||
|
display: flex;
|
||||||
|
align-content: center;
|
||||||
|
justify-content: center;
|
||||||
|
transition: .5s;
|
||||||
|
.underline {
|
||||||
|
width: 33rpx;
|
||||||
|
height: 4rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.category{
|
||||||
|
position: absolute;
|
||||||
|
right: 0;
|
||||||
|
top: 10rpx;
|
||||||
|
/* #ifdef H5 */
|
||||||
|
width: 132rpx;
|
||||||
|
/* #endif */
|
||||||
|
/* #ifdef MP */
|
||||||
|
width: 120rpx;
|
||||||
|
/* #endif */
|
||||||
|
/* #ifdef APP-PLUS */
|
||||||
|
width: 150rpx;
|
||||||
|
/* #endif */
|
||||||
|
height: 50upx;
|
||||||
|
line-height: 50upx;
|
||||||
|
z-index: 3;
|
||||||
|
padding: 0 15rpx 0 25rpx;
|
||||||
|
.iconfont{
|
||||||
|
font-size: 30rpx;
|
||||||
|
margin-right:6rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.child-box{
|
||||||
|
width: 100%;
|
||||||
|
position: relative;
|
||||||
|
background-color: #fff;
|
||||||
|
/* #ifdef H5 */
|
||||||
|
box-shadow: 0 2px 5px 1px rgba(0, 0, 0, 0.02);
|
||||||
|
/* #endif */
|
||||||
|
/* #ifdef MP */
|
||||||
|
box-shadow: 0 2rpx 3rpx 1rpx #f9f9f9;
|
||||||
|
/* #endif */
|
||||||
|
.wrapper{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
padding: 20rpx 0;
|
||||||
|
background: #fff;
|
||||||
|
}
|
||||||
|
.child-item{
|
||||||
|
flex-shrink: 0;
|
||||||
|
width:140rpx;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
margin-left: 10rpx;
|
||||||
|
image{
|
||||||
|
width: 90rpx;
|
||||||
|
height: 90rpx;
|
||||||
|
border-radius: 50%;
|
||||||
|
}
|
||||||
|
.txt{
|
||||||
|
font-size: 24rpx;
|
||||||
|
color: #282828;
|
||||||
|
text-align: center;
|
||||||
|
margin-top: 10rpx;
|
||||||
|
}
|
||||||
|
&.on{
|
||||||
|
image{
|
||||||
|
border: 1px solid $theme-color-opacity;
|
||||||
|
}
|
||||||
|
.txt{
|
||||||
|
color: $theme-color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
65
pages/index/component/titles.vue
Normal file
65
pages/index/component/titles.vue
Normal file
@ -0,0 +1,65 @@
|
|||||||
|
<template>
|
||||||
|
<view v-if="titleConfig">
|
||||||
|
<navigator :url="path(linkConfig)" hover-class="none" class='title' :class="[(textPosition==0?'left':textPosition==2?'right':''),(textStyle==1?'italics':textStyle==2?'blod':'')]" :style="'font-size:'+fontSize+'rpx;margin:'+mbConfig+'rpx '+prConfig+'rpx 0;background-color:'+titleColor+';border-radius:'+bgStyle+'rpx;'">
|
||||||
|
<view :style="'color:'+textColor">{{titleConfig}}</view>
|
||||||
|
</navigator>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import {merPath} from "@/utils/index"
|
||||||
|
export default {
|
||||||
|
name: 'titles',
|
||||||
|
props: {
|
||||||
|
dataConfig: {
|
||||||
|
type: Object,
|
||||||
|
default: () => {}
|
||||||
|
},
|
||||||
|
merId: {
|
||||||
|
type: String || Number,
|
||||||
|
default: ''
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
fontSize:this.dataConfig.fontSize.val*2,
|
||||||
|
linkConfig:this.dataConfig.linkConfig.value,
|
||||||
|
mbConfig:this.dataConfig.mbConfig.val*2,
|
||||||
|
prConfig:this.dataConfig.prConfig.val*2,
|
||||||
|
textPosition:this.dataConfig.textPosition.type,
|
||||||
|
textStyle:this.dataConfig.textStyle.type,
|
||||||
|
titleColor:this.dataConfig.titleColor.color[0].item,
|
||||||
|
titleConfig:this.dataConfig.titleConfig.value,
|
||||||
|
textColor:this.dataConfig.themeColor.color[0].item,
|
||||||
|
bgStyle:this.dataConfig.bgStyle.type ? '16' : '0'
|
||||||
|
};
|
||||||
|
},
|
||||||
|
created() {},
|
||||||
|
methods:{
|
||||||
|
path(url){
|
||||||
|
return merPath(url, this.merId)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
.title{
|
||||||
|
font-size: 40rpx;
|
||||||
|
color: #282828;
|
||||||
|
text-align: center;
|
||||||
|
&.left{
|
||||||
|
text-align: left;
|
||||||
|
}
|
||||||
|
&.right{
|
||||||
|
text-align: right;
|
||||||
|
}
|
||||||
|
&.blod{
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
&.italics{
|
||||||
|
font-style: italic;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
</style>
|
||||||
159
pages/index/component/topic.vue
Normal file
159
pages/index/component/topic.vue
Normal file
@ -0,0 +1,159 @@
|
|||||||
|
<template>
|
||||||
|
<view v-if="activityData.length > 0" :style="'margin-top:'+mbConfig+'rpx;'" class="skeleton-rect">
|
||||||
|
<view class="activity_count" :style="'background:'+bgColor+';margin: 0 '+prConfig+'rpx;border-radius:'+bgStyle+'rpx'">
|
||||||
|
<view class="spike-bd">
|
||||||
|
<view class="title">
|
||||||
|
<image class="title-img" :src="`${domain}/static/images/topic_title.png`"></image>
|
||||||
|
</view>
|
||||||
|
<navigator :url="merId ? '/pages/store/home/index?id='+merId+'&type=4' : '/pages/activity/topic/index'" class="more-btn" hover-class="none">
|
||||||
|
进入专场
|
||||||
|
<text class="iconfont icon-jiantou"></text>
|
||||||
|
</navigator>
|
||||||
|
</view>
|
||||||
|
<view v-if="activityData.length">
|
||||||
|
<!-- 单图模式 -->
|
||||||
|
<block v-if="activityData.length == 1">
|
||||||
|
<view class="topic_swiper"
|
||||||
|
v-for="(item,index) in activityData"
|
||||||
|
:key="index"
|
||||||
|
@click="goTopicDetail(item.info[1].value)">
|
||||||
|
<image :src="item.img"></image>
|
||||||
|
</view>
|
||||||
|
</block>
|
||||||
|
<view v-else class="topic_swiper" :class="[pointerStyle?'circular':'square',conStyle?'':'fillet','dot'+txtStyle]">
|
||||||
|
<swiper indicator-dots="true" :autoplay="autoplay" :circular="true" :interval="2500" :duration="duration"
|
||||||
|
indicator-color="rgba(255,255,255,0.6)" indicator-active-color="rgba(233, 51, 35, 1)">
|
||||||
|
<block v-for="(item,index) in activityData" :key="index">
|
||||||
|
<swiper-item>
|
||||||
|
<view @click="goTopicDetail(item.info[1].value)" class='slide-navigator acea-row row-between-wrapper'>
|
||||||
|
<image :src="item.img" class="slide-image"></image>
|
||||||
|
</view>
|
||||||
|
</swiper-item>
|
||||||
|
</block>
|
||||||
|
</swiper>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { HTTP_REQUEST_URL } from '@/config/app';
|
||||||
|
export default {
|
||||||
|
name: 'topic',
|
||||||
|
props: {
|
||||||
|
dataConfig: {
|
||||||
|
type: Object,
|
||||||
|
default: () => {}
|
||||||
|
},
|
||||||
|
merId: {
|
||||||
|
type: String || Number,
|
||||||
|
default: ''
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
indicatorDots: false,
|
||||||
|
autoplay: true,
|
||||||
|
duration: 500,
|
||||||
|
activityData: this.dataConfig.menuConfig.list,
|
||||||
|
bgColor: this.dataConfig.colorShow.val ? this.dataConfig.bgColor.color[0].item : 'transparent',
|
||||||
|
mbConfig: this.dataConfig.mbConfig.val*2, //页面间距
|
||||||
|
prConfig: this.dataConfig.prConfig.val*2, //背景间距
|
||||||
|
txtStyle: this.dataConfig.txtStyle.type,
|
||||||
|
bgStyle: this.dataConfig.bgStyle.type ? 20 : 0,
|
||||||
|
colorShow: this.dataConfig.colorShow.val,
|
||||||
|
pointerStyle: this.dataConfig.pointerStyle.type, //指示点样式
|
||||||
|
conStyle: this.dataConfig.conStyle.type, //内容样式
|
||||||
|
domain: HTTP_REQUEST_URL,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
created() {},
|
||||||
|
mounted() {},
|
||||||
|
methods: {
|
||||||
|
goTopicDetail(url) {
|
||||||
|
if(url.indexOf("http") != -1){
|
||||||
|
// #ifdef H5
|
||||||
|
location.href = url
|
||||||
|
// #endif
|
||||||
|
}else{
|
||||||
|
if(['/pages/goods_cate/goods_cate','/pages/order_addcart/order_addcart','/pages/user/index'].indexOf(url) == -1){
|
||||||
|
uni.navigateTo({
|
||||||
|
url:url
|
||||||
|
})
|
||||||
|
}else{
|
||||||
|
uni.switchTab({
|
||||||
|
url:url
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
@import '../style/main.scss';
|
||||||
|
.activity_count{
|
||||||
|
margin-bottom: 20rpx;
|
||||||
|
background: #ffffff;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
position: relative;
|
||||||
|
padding: 24rpx 20rpx 26rpx;
|
||||||
|
/deep/swiper-item,uni-swiper-item,swiper{
|
||||||
|
height: 278rpx;
|
||||||
|
}
|
||||||
|
/deep/uni-image,/deep/image,/deep/.easy-loadimage{
|
||||||
|
width: 650rpx;
|
||||||
|
height: 278rpx;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
}
|
||||||
|
/deep/.uni-swiper-wrapper{
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.topic_swiper{
|
||||||
|
width: 650rpx;
|
||||||
|
margin: 0 auto;
|
||||||
|
line-height: 0;
|
||||||
|
&.fillet {
|
||||||
|
border-radius: 0;
|
||||||
|
/deep/uni-image,/deep/image,/deep/.easy-loadimage{
|
||||||
|
border-radius: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// 圆形指示点
|
||||||
|
&.circular {
|
||||||
|
/deep/.uni-swiper-dot {
|
||||||
|
width: 10rpx;
|
||||||
|
height: 10rpx;
|
||||||
|
background: rgba(0, 0, 0, .4);
|
||||||
|
}
|
||||||
|
/deep/.uni-swiper-dot-active {
|
||||||
|
background: rgba(233, 51, 35, 1);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
// 方形指示点
|
||||||
|
&.square {
|
||||||
|
/deep/.uni-swiper-dot {
|
||||||
|
width: 20rpx;
|
||||||
|
height: 5rpx;
|
||||||
|
border-radius: 3rpx;
|
||||||
|
background: rgba(0, 0, 0, .4);
|
||||||
|
}
|
||||||
|
/deep/.uni-swiper-dot-active {
|
||||||
|
background: rgba(233, 51, 35, 1);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
/deep/.dot0 .uni-swiper-dots-horizontal{
|
||||||
|
left: 10%;
|
||||||
|
}
|
||||||
|
/deep/.dot1 .uni-swiper-dots-horizontal{
|
||||||
|
left: 50%;
|
||||||
|
}
|
||||||
|
/deep/.dot2 .uni-swiper-dots-horizontal{
|
||||||
|
left: 90%;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
1305
pages/index/index.vue
Normal file
1305
pages/index/index.vue
Normal file
File diff suppressed because it is too large
Load Diff
1757
pages/index/index_two.vue
Normal file
1757
pages/index/index_two.vue
Normal file
File diff suppressed because it is too large
Load Diff
386
pages/index/style/main.scss
Normal file
386
pages/index/style/main.scss
Normal file
@ -0,0 +1,386 @@
|
|||||||
|
.main {
|
||||||
|
padding: 0 20rpx;
|
||||||
|
}
|
||||||
|
.spike-bd {
|
||||||
|
margin-bottom: 20rpx;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
padding: 0 20rpx 0 10rpx;
|
||||||
|
display: flex;
|
||||||
|
position: relative;
|
||||||
|
justify-content: space-between;
|
||||||
|
.title-img{
|
||||||
|
width: 136rpx;
|
||||||
|
height: 36rpx;
|
||||||
|
}
|
||||||
|
.title {
|
||||||
|
font-weight: bold;
|
||||||
|
color: #282828;
|
||||||
|
font-size: 0;
|
||||||
|
.title-img{
|
||||||
|
width: 136rpx;
|
||||||
|
height: 36rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.spike-distance {
|
||||||
|
margin-left: 15rpx;
|
||||||
|
position: relative;
|
||||||
|
top: 1.4rpx;
|
||||||
|
display: flex;
|
||||||
|
border: 1px solid #e93323;
|
||||||
|
border-radius: 4rpx;
|
||||||
|
height: 40rpx;
|
||||||
|
padding-left: 92rpx;
|
||||||
|
.bg-red {
|
||||||
|
font-size: 20rpx;
|
||||||
|
color: #fff;
|
||||||
|
background-color: #e93323;
|
||||||
|
padding: 0 10rpx;
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
height: 110%;
|
||||||
|
position: absolute;
|
||||||
|
left: -1rpx;
|
||||||
|
top: -2rpx;
|
||||||
|
width: 92rpx;
|
||||||
|
border-radius: 4rpx 0 0 4rpx;
|
||||||
|
}
|
||||||
|
.time {
|
||||||
|
font-size: 22rpx;
|
||||||
|
padding: 0 12rpx;
|
||||||
|
color: #e93323;
|
||||||
|
height: 36rpx;
|
||||||
|
line-height: 38rpx;
|
||||||
|
/deep/.red {
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.red-color {
|
||||||
|
color: #e93323;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.more-btn {
|
||||||
|
color: #282828;
|
||||||
|
font-size: 24rpx;
|
||||||
|
.iconfont {
|
||||||
|
font-size: 22rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.colum0{
|
||||||
|
white-space: nowrap;
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
.combination-item {
|
||||||
|
/* #ifdef MP */
|
||||||
|
width: 294rpx;
|
||||||
|
height: 140rpx;
|
||||||
|
/* #endif */
|
||||||
|
/* #ifdef H5 || APP-PLUS */
|
||||||
|
width: 328rpx;
|
||||||
|
height: 180rpx;
|
||||||
|
/* #endif */
|
||||||
|
display: inline-block;
|
||||||
|
background-size: 100%;
|
||||||
|
position: relative;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
.img-box {
|
||||||
|
width: 122rpx;
|
||||||
|
height: 122rpx;
|
||||||
|
position: absolute;
|
||||||
|
/deep/image,/deep/.easy-loadimage,/deep/uni-image {
|
||||||
|
width: 122rpx;
|
||||||
|
height: 122rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.name {
|
||||||
|
font-size: 30rpx;
|
||||||
|
color: #333333;
|
||||||
|
font-weight: bold;
|
||||||
|
line-height: 32rpx;
|
||||||
|
}
|
||||||
|
.price {
|
||||||
|
display: block;
|
||||||
|
font-size: 30rpx;
|
||||||
|
font-weight: bold;
|
||||||
|
margin-top: 8rpx;
|
||||||
|
color: #e93323;
|
||||||
|
text {
|
||||||
|
font-size: 20rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.gocom_btn {
|
||||||
|
display: block;
|
||||||
|
margin-top: 6rpx;
|
||||||
|
color: #fff;
|
||||||
|
font-size: 22rpx;
|
||||||
|
font-weight: bold;
|
||||||
|
width: 100rpx;
|
||||||
|
line-height: 30rpx;
|
||||||
|
text-align: center;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
text {
|
||||||
|
font-weight: normal;
|
||||||
|
font-size: 16rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&:nth-child(1) {
|
||||||
|
/* #ifdef MP */
|
||||||
|
height: 336rpx;
|
||||||
|
/* #endif */
|
||||||
|
/* #ifdef H5 || APP-PLUS */
|
||||||
|
height: 378rpx;
|
||||||
|
/* #endif */
|
||||||
|
padding: 20rpx 20rpx 28rpx;
|
||||||
|
float: left;
|
||||||
|
.img-box {
|
||||||
|
width: 210rpx;
|
||||||
|
height: 210rpx;
|
||||||
|
right: 18rpx;
|
||||||
|
bottom: 18rpx;
|
||||||
|
/deep/image,/deep/.easy-loadimage,/deep/uni-image {
|
||||||
|
width: 210rpx;
|
||||||
|
height: 210rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.gocom_btn {
|
||||||
|
background: linear-gradient(90deg, #fd5d48 0%, #f63724 100%);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&:nth-child(2),
|
||||||
|
&:nth-child(3) {
|
||||||
|
float: right;
|
||||||
|
padding: 20rpx 18rpx;
|
||||||
|
.name {
|
||||||
|
width: 148rpx;
|
||||||
|
}
|
||||||
|
.img-box {
|
||||||
|
right: 14rpx;
|
||||||
|
bottom: 14rpx;
|
||||||
|
/deep/image,/deep/.easy-loadimage,/deep/uni-image{
|
||||||
|
width: 122rpx;
|
||||||
|
height: 122rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&:nth-child(2) {
|
||||||
|
.gocom_btn {
|
||||||
|
background: linear-gradient(90deg, #fdca1a 0%, #f7b21f 100%);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&:nth-child(3) {
|
||||||
|
margin-top: 18rpx;
|
||||||
|
.img-box {
|
||||||
|
right: 14rpx;
|
||||||
|
bottom: 14rpx;
|
||||||
|
}
|
||||||
|
.gocom_btn {
|
||||||
|
background: linear-gradient(90deg, #ffb052 0%, #fe961a 100%);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.spike-wrapper {
|
||||||
|
width: 100%;
|
||||||
|
&.wrapper2{
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
.spike-item {
|
||||||
|
display: inline-block;
|
||||||
|
width: 222rpx;
|
||||||
|
margin: 0 20rpx 20rpx 0;
|
||||||
|
&.presell-item {
|
||||||
|
width: 210rpx;
|
||||||
|
.img-box {
|
||||||
|
height: 210rpx;
|
||||||
|
/deep/image,/deep/.easy-loadimage,uni-image{
|
||||||
|
height: 210rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.name {
|
||||||
|
margin-top: 8rpx;
|
||||||
|
color: #282828;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&.assist-item {
|
||||||
|
box-shadow: 0px 2px 20px 0px rgba(0, 0, 0, 0.08);
|
||||||
|
}
|
||||||
|
.img-box {
|
||||||
|
position: relative;
|
||||||
|
height: 222rpx;
|
||||||
|
.participants {
|
||||||
|
padding: 4rpx 12rpx;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
background: rgba(0, 0, 0, 0.35);
|
||||||
|
color: #fff;
|
||||||
|
text-align: center;
|
||||||
|
position: absolute;
|
||||||
|
top: 10rpx;
|
||||||
|
left: 10rpx;
|
||||||
|
font-size: 20rpx;
|
||||||
|
}
|
||||||
|
/deep/image,/deep/.easy-loadimage,uni-image {
|
||||||
|
width: 100%;
|
||||||
|
height: 222rpx;
|
||||||
|
border-radius: 16rpx;
|
||||||
|
}
|
||||||
|
.box_bg {
|
||||||
|
position: absolute;
|
||||||
|
bottom: 0;
|
||||||
|
left: 0;
|
||||||
|
text-align: center;
|
||||||
|
width: 149rpx;
|
||||||
|
height: 42rpx;
|
||||||
|
line-height: 42rpx;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-size: cover;
|
||||||
|
color: #fff;
|
||||||
|
font-size: 22rpx;
|
||||||
|
}
|
||||||
|
.msg {
|
||||||
|
position: absolute;
|
||||||
|
left: 10rpx;
|
||||||
|
bottom: 16rpx;
|
||||||
|
width: 86rpx;
|
||||||
|
height: 30rpx;
|
||||||
|
background: rgba(255, 255, 255, 1);
|
||||||
|
border: 1px solid rgba(255, 109, 96, 1);
|
||||||
|
border-radius: 6rpx;
|
||||||
|
font-size: 20rpx;
|
||||||
|
color: $theme-color;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
/deep/.img-box0 image,/deep/.img-box0 .easy-loadimage,/deep/.img-box0 uni-image {
|
||||||
|
border-radius: 0;
|
||||||
|
}
|
||||||
|
.info {
|
||||||
|
margin-top: 10rpx;
|
||||||
|
.name {
|
||||||
|
font-size: 26rpx;
|
||||||
|
}
|
||||||
|
.stock-box {
|
||||||
|
width: 100%;
|
||||||
|
height: 20rpx;
|
||||||
|
background-color: #ffdcd9;
|
||||||
|
border-radius: 20rpx;
|
||||||
|
margin-top: 13rpx;
|
||||||
|
position: relative;
|
||||||
|
color: #fff;
|
||||||
|
font-size: 18rpx;
|
||||||
|
line-height: 20rpx;
|
||||||
|
text-align: center;
|
||||||
|
overflow: hidden;
|
||||||
|
.grabbed {
|
||||||
|
height: 20rpx;
|
||||||
|
background: linear-gradient(#ff0000, #ff5400);
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
border-radius: 20rpx;
|
||||||
|
}
|
||||||
|
.stock-sales {
|
||||||
|
position: absolute;
|
||||||
|
left: 50%;
|
||||||
|
margin-left: -40rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.price-box {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: flex-start;
|
||||||
|
margin-top: 4rpx;
|
||||||
|
&.presell-price {
|
||||||
|
display: block;
|
||||||
|
.old-price {
|
||||||
|
display: block;
|
||||||
|
margin: 6rpx 0 0 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.tips {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
width: 28rpx;
|
||||||
|
height: 28rpx;
|
||||||
|
background-color: $theme-color;
|
||||||
|
color: #fff;
|
||||||
|
font-size: 20rpx;
|
||||||
|
border-radius: 2px;
|
||||||
|
}
|
||||||
|
.price {
|
||||||
|
display: flex;
|
||||||
|
color: $theme-color;
|
||||||
|
font-size: 28rpx;
|
||||||
|
font-weight: bold;
|
||||||
|
text {
|
||||||
|
font-size: 18rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.old-price {
|
||||||
|
display: flex;
|
||||||
|
margin-left: 10rpx;
|
||||||
|
color: #aaaaaa;
|
||||||
|
text-decoration: line-through;
|
||||||
|
font-size: 20rpx;
|
||||||
|
text {
|
||||||
|
font-size: 18rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.assist-info {
|
||||||
|
.price {
|
||||||
|
display: flex;
|
||||||
|
color: $theme-color;
|
||||||
|
font-size: 28rpx;
|
||||||
|
font-weight: bold;
|
||||||
|
margin-top: 8rpx;
|
||||||
|
text {
|
||||||
|
font-size: 18rpx;
|
||||||
|
}
|
||||||
|
.assist_price {
|
||||||
|
font-size: 20rpx;
|
||||||
|
display: inline-block;
|
||||||
|
width: 82rpx;
|
||||||
|
height: 32rpx;
|
||||||
|
text-align: center;
|
||||||
|
line-height: 30rpx;
|
||||||
|
background: #ffeae5;
|
||||||
|
border-radius: 4rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&.assist-info1{
|
||||||
|
padding-bottom: 20rpx;
|
||||||
|
}
|
||||||
|
.price-box {
|
||||||
|
padding: 15rpx 15rpx 8rpx;
|
||||||
|
.name {
|
||||||
|
font-size: 24rpx;
|
||||||
|
color: #333;
|
||||||
|
line-height: 30rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.initiate_btn {
|
||||||
|
width: 100%;
|
||||||
|
height: 48rpx;
|
||||||
|
line-height: 48rpx;
|
||||||
|
background: linear-gradient(90deg, #ff0000 0%, #ff5400 100%);
|
||||||
|
text-align: center;
|
||||||
|
color: #fff;
|
||||||
|
font-size: 24rpx;
|
||||||
|
border-radius: 0 0 16rpx 16rpx;
|
||||||
|
margin: 0 auto;
|
||||||
|
&.initiate_btn1{
|
||||||
|
width: 90%;
|
||||||
|
border-radius: 24rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
&.wrapper1{
|
||||||
|
.spike-item{
|
||||||
|
width: 210rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
699
pages/moreProject/moreProject.vue
Normal file
699
pages/moreProject/moreProject.vue
Normal file
@ -0,0 +1,699 @@
|
|||||||
|
<template>
|
||||||
|
<view class="gather">
|
||||||
|
<block v-if="isShow&&userInfoData.mer_info.mer_name">
|
||||||
|
<view class="" v-if="userInfoData.mer_info.business_status==2">
|
||||||
|
<view class="special_work com" v-if="userInfoData.mer_info.type_code === 'TypeSupplyChain'">
|
||||||
|
<view class="special_work com" v-if="true">
|
||||||
|
<view class="title">市级供应链</view>
|
||||||
|
<view class="content">
|
||||||
|
<view class="examine"
|
||||||
|
@click="navigator(`/pages/nongKe/supply_chain/goods_list?merid=${mer_id}`)">
|
||||||
|
<image class="icon_img" :src="`${prefix}zsgl.png`" mode="aspectFill"></image>
|
||||||
|
<text class="text">在售管理</text>
|
||||||
|
</view>
|
||||||
|
<view class="examine"
|
||||||
|
@click="navigator(`/pages/admin/order/index?mer_id=${mer_id}&product_type=98&type_id=${userInfoData.mer_info.type_id}`)">
|
||||||
|
<image class="icon_img" :src="`${prefix}cwgl.png`" mode="aspectFill"></image>
|
||||||
|
<text class="text">财务管理</text>
|
||||||
|
</view>
|
||||||
|
<!-- <view class="examine"
|
||||||
|
@click="navigator(`/pages/admin/financial_management/index?mer_id=${mer_id}&product_type=98&type_id=${userInfoData.mer_info.type_id}`)">
|
||||||
|
<image class="icon_img" :src="`${prefix}cwgl.png`" mode="aspectFill"></image>
|
||||||
|
<text class="text">财务管理</text>
|
||||||
|
</view>
|
||||||
|
<view class="examine"
|
||||||
|
@click="navigator(`/pages/admin/order/index?mer_id=${mer_id}&product_type=98&type_id=${userInfoData.mer_info.type_id}`)">
|
||||||
|
<image class="icon_img" :src="`${prefix}ddgl.png`" mode="aspectFill"></image>
|
||||||
|
<text class="text">订单管理</text>
|
||||||
|
</view> -->
|
||||||
|
<view class="examine"
|
||||||
|
@click="navigator(`/pages/nongKe/gather/select_warehouse?mer_id=${mer_id}&stype=1`)">
|
||||||
|
<image class="icon_img" :src="`${prefix}rkgl.png`" mode="aspectFill">
|
||||||
|
</image>
|
||||||
|
<text class="text">入库管理</text>
|
||||||
|
</view>
|
||||||
|
<view class="examine"
|
||||||
|
@click="navigator(`/pages/product/basicSet?mer_id=${mer_id}&product_type=98`, '商户设置')">
|
||||||
|
<image class="icon_img" :src="`${prefix}shsz.png`" mode="aspectFill"></image>
|
||||||
|
<text class="text">商户设置</text>
|
||||||
|
</view>
|
||||||
|
<view class="examine"
|
||||||
|
@click="navigator(`/pages/product/transactionApplication/index?mer_id=${mer_id}`, '交易申请')">
|
||||||
|
<image class="icon_img" src="@/static/images/jy.png" mode="aspectFill">
|
||||||
|
</image>
|
||||||
|
<text class="text">交易申请</text>
|
||||||
|
</view>
|
||||||
|
<view class="examine" @click="navigator(`/pages/product/list/index?mer_id=${mer_id}`)">
|
||||||
|
<image class="icon_img" :src="`${prefix}spgl.png`" mode="aspectFill">
|
||||||
|
</image>
|
||||||
|
<text class="text">商品管理</text>
|
||||||
|
</view>
|
||||||
|
<view class="examine" @click="navigator(`/pages/users/embody/embody?mer_id=${mer_id}`)">
|
||||||
|
<image class="icon_img" :src="`${prefix}txgl.png`" mode="aspectFill">
|
||||||
|
</image>
|
||||||
|
<text class="text">提现管理</text>
|
||||||
|
</view>
|
||||||
|
<view class="examine"
|
||||||
|
@click="navigator(`/pages/admin/order_cancellation/index?mer_id=${mer_id}`)">
|
||||||
|
<image class="icon_img" :src="`${prefix}ddhx.png`" mode="aspectFill">
|
||||||
|
</image>
|
||||||
|
<text class="text">订单核销</text>
|
||||||
|
</view>
|
||||||
|
<!-- <view class="examine"
|
||||||
|
@click="navigator(`/pages/commissionedSales/index/index?mer_id=${mer_id}`)">
|
||||||
|
<image class="icon_img" src="@/static/images/weituo.png" mode="aspectFill">
|
||||||
|
</image>
|
||||||
|
<text class="text">委托销售</text>
|
||||||
|
</view>
|
||||||
|
<view class="examine"
|
||||||
|
@click="navigator(`/pages/users/order_list/relase?mer_id=${mer_id}&status=-1`)">
|
||||||
|
<image class="icon_img" src="@/static/images/weituo.png" mode="aspectFill">
|
||||||
|
</image>
|
||||||
|
<text class="text">委托订单</text>
|
||||||
|
</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="aspectFill">
|
||||||
|
</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="aspectFill">
|
||||||
|
</image>
|
||||||
|
<text class="text">财务公开</text>
|
||||||
|
</view> -->
|
||||||
|
<!-- <view class="examine" @click="navigator(`/pages/admin/order/index?mer_id=${mer_id}`)">
|
||||||
|
<image class="icon_img" :src="`${prefix}ddgl.png`" mode="aspectFill">
|
||||||
|
</image>
|
||||||
|
<text class="text">订单管理</text>
|
||||||
|
</view> -->
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="business com"
|
||||||
|
v-if="userInfoData.mer_info.type_code === 'TypeStore'||userInfoData.mer_info.type_code === 'TypeTownSupplyChain'">
|
||||||
|
<view class="business com" v-if="true">
|
||||||
|
<view class="special_work com">
|
||||||
|
<view class="title">我的店铺</view>
|
||||||
|
<view class="content ">
|
||||||
|
<!-- <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}`)">
|
||||||
|
|
||||||
|
<image class="icon_img" :src="`${prefix}ghcg.png`" mode="aspectFill"></image>
|
||||||
|
<text class="text">供货采购</text>
|
||||||
|
</view>
|
||||||
|
<view class="examine"
|
||||||
|
@click="navigator('/pages/users/order_list/indexCopy?status=-1&product_type=98')">
|
||||||
|
<image class="icon_img" :src="`${prefix}jhgl.png`" mode="aspectFill"></image>
|
||||||
|
<text class="text">进货管理</text>
|
||||||
|
</view> -->
|
||||||
|
<view class="examine"
|
||||||
|
@click="navigator(`/pages/admin/stockOut/index?mer_id=${mer_id}`)">
|
||||||
|
<image class="icon_img" :src="`${prefix}smck.png`" mode="aspectFill">
|
||||||
|
</image>
|
||||||
|
<text class="text">扫码出库</text>
|
||||||
|
</view>
|
||||||
|
<view class="examine"
|
||||||
|
@click="navigator(`/pages/nongKe/gather/select_warehouse?mer_id=${mer_id}&stype=2`)">
|
||||||
|
<image class="icon_img" :src="`${prefix}rkgl.png`" mode="aspectFill">
|
||||||
|
</image>
|
||||||
|
<text class="text">入库管理</text>
|
||||||
|
</view>
|
||||||
|
<view class="examine" @click="navigator(`/pages/users/embody/embody?mer_id=${mer_id}`)">
|
||||||
|
<image class="icon_img" :src="`${prefix}txgl.png`" mode="aspectFill">
|
||||||
|
</image>
|
||||||
|
<text class="text">提现管理</text>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="examine"
|
||||||
|
@click="navigator(`/pages/chat/customer_list/index?type=1&mer_id=${mer_id}`)">
|
||||||
|
<image class="icon_img" :src="`${prefix}kfjl.png`" mode="aspectFill">
|
||||||
|
</image>
|
||||||
|
<text class="text">客服记录</text>
|
||||||
|
</view>
|
||||||
|
<view class="examine"
|
||||||
|
@click="navigator(`/pages/admin/order_cancellation/index?mer_id=${mer_id}`)">
|
||||||
|
<image class="icon_img" :src="`${prefix}ddhx.png`" mode="aspectFill">
|
||||||
|
</image>
|
||||||
|
<text class="text">订单核销</text>
|
||||||
|
</view>
|
||||||
|
<view class="examine"
|
||||||
|
@click="navigator(`/pages/admin/order/index?mer_id=${mer_id}&type_id=${userInfoData.mer_info.type_id}`)">
|
||||||
|
<image class="icon_img" :src="`${prefix}ddgl.png`" mode="aspectFill">
|
||||||
|
</image>
|
||||||
|
<text class="text">订单管理</text>
|
||||||
|
</view>
|
||||||
|
<view class="examine" @click="navigator(`/pages/product/list/index?mer_id=${mer_id}`)">
|
||||||
|
<image class="icon_img" :src="`${prefix}spgl.png`" mode="aspectFill">
|
||||||
|
</image>
|
||||||
|
<text class="text">商品管理</text>
|
||||||
|
</view>
|
||||||
|
<view class="examine"
|
||||||
|
@click="navigator(`/pages/product/basicSet?mer_id=${mer_id}`, '商户设置')">
|
||||||
|
<image class="icon_img" :src="`${prefix}shsz.png`" mode="aspectFill">
|
||||||
|
</image>
|
||||||
|
<text class="text">商户设置</text>
|
||||||
|
</view>
|
||||||
|
<view class="examine"
|
||||||
|
@click="navigator(`/pages/product/transactionApplication/index?mer_id=${mer_id}`, '交易申请')">
|
||||||
|
<image class="icon_img" src="@/static/images/jy.png" mode="aspectFill">
|
||||||
|
</image>
|
||||||
|
<text class="text">交易申请</text>
|
||||||
|
</view>
|
||||||
|
<!-- <view class="examine"
|
||||||
|
@click="navigator(`/pages/users/trading_hall/index?mer_id=${mer_id}`)">
|
||||||
|
<image class="icon_img" src="@/static/images/diaohuo.png" mode="aspectFill">
|
||||||
|
</image>
|
||||||
|
<text class="text">交易大厅</text>
|
||||||
|
</view>
|
||||||
|
<view class="examine"
|
||||||
|
@click="navigator(`/pages/commissionedSales/index/index?mer_id=${mer_id}`)">
|
||||||
|
<image class="icon_img" src="@/static/images/weituo.png" mode="aspectFill">
|
||||||
|
</image>
|
||||||
|
<text class="text">委托销售</text>
|
||||||
|
</view>
|
||||||
|
<view class="examine"
|
||||||
|
@click="navigator(`/pages/users/order_list/relase?mer_id=${mer_id}&status=-1`)">
|
||||||
|
<image class="icon_img" src="@/static/images/weituo.png" mode="aspectFill">
|
||||||
|
</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="aspectFill">
|
||||||
|
</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="aspectFill">
|
||||||
|
</image>
|
||||||
|
<text class="text">财务公开</text>
|
||||||
|
</view> -->
|
||||||
|
|
||||||
|
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- <gatherBusiness :userInfoData="userInfoData" /> -->
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="business com" v-if="userInfoData.mer_info.type_code === 'TypeCloudWarehouse'">
|
||||||
|
<view class="business com" v-if="true">
|
||||||
|
<view class="special_work com">
|
||||||
|
<view class="title">里海云仓</view>
|
||||||
|
<view class="content ">
|
||||||
|
<view class="examine"
|
||||||
|
@click="navigator(`/pages/nongKe/supply_chain/supplier?type_id=12&isDetail=1&product_type=98&cate_id=${userInfoData.mer_info.category_id}`)">
|
||||||
|
<image class="icon_img" :src="`${prefix}ghcg.png`" mode="aspectFill"></image>
|
||||||
|
<text class="text">供货采购</text>
|
||||||
|
</view>
|
||||||
|
<view class="examine" @click="navigator('/pages/users/order_list/index?status=-1')">
|
||||||
|
<image class="icon_img" :src="`${prefix}jhgl.png`" mode="aspectFill"></image>
|
||||||
|
<text class="text">进货管理</text>
|
||||||
|
</view>
|
||||||
|
<view class="examine"
|
||||||
|
@click="navigator(`/pages/admin/stockOut/index?mer_id=${mer_id}`)">
|
||||||
|
<image class="icon_img" :src="`${prefix}smck.png`" mode="aspectFill">
|
||||||
|
</image>
|
||||||
|
<text class="text">扫码出库</text>
|
||||||
|
</view>
|
||||||
|
<view class="examine"
|
||||||
|
@click="navigator(`/pages/nongKe/gather/select_warehouse?mer_id=${mer_id}&stype=2`)">
|
||||||
|
<image class="icon_img" :src="`${prefix}rkgl.png`" mode="aspectFill">
|
||||||
|
</image>
|
||||||
|
<text class="text">入库管理</text>
|
||||||
|
</view>
|
||||||
|
<view class="examine" @click="navigator(`/pages/users/embody/embody?mer_id=${mer_id}`)">
|
||||||
|
<image class="icon_img" :src="`${prefix}txgl.png`" mode="aspectFill">
|
||||||
|
</image>
|
||||||
|
<text class="text">提现管理</text>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="examine"
|
||||||
|
@click="navigator(`/pages/chat/customer_list/index?type=1&mer_id=${mer_id}`)">
|
||||||
|
<image class="icon_img" :src="`${prefix}kfjl.png`" mode="aspectFill">
|
||||||
|
</image>
|
||||||
|
<text class="text">客服记录</text>
|
||||||
|
</view>
|
||||||
|
<view class="examine"
|
||||||
|
@click="navigator(`/pages/admin/order_cancellation/index?mer_id=${mer_id}`)">
|
||||||
|
<image class="icon_img" :src="`${prefix}ddhx.png`" mode="aspectFill">
|
||||||
|
</image>
|
||||||
|
<text class="text">订单核销</text>
|
||||||
|
</view>
|
||||||
|
<view class="examine"
|
||||||
|
@click="navigator(`/pages/admin/order/index?mer_id=${mer_id}&type_id=${userInfoData.mer_info.type_id}`)">
|
||||||
|
<image class="icon_img" :src="`${prefix}ddgl.png`" mode="aspectFill">
|
||||||
|
</image>
|
||||||
|
<text class="text">订单管理</text>
|
||||||
|
</view>
|
||||||
|
<view class="examine" @click="navigator(`/pages/product/list/index?mer_id=${mer_id}`)">
|
||||||
|
<image class="icon_img" :src="`${prefix}spgl.png`" mode="aspectFill">
|
||||||
|
</image>
|
||||||
|
<text class="text">商品管理</text>
|
||||||
|
</view>
|
||||||
|
<view class="examine"
|
||||||
|
@click="navigator(`/pages/product/basicSet?mer_id=${mer_id}`, '商户设置')">
|
||||||
|
<image class="icon_img" :src="`${prefix}shsz.png`" mode="aspectFill">
|
||||||
|
</image>
|
||||||
|
<text class="text">商户设置</text>
|
||||||
|
</view>
|
||||||
|
<view class="examine"
|
||||||
|
@click="navigator(`/pages/product/transactionApplication/index?mer_id=${mer_id}`, '交易申请')">
|
||||||
|
<image class="icon_img" src="@/static/images/jy.png" mode="aspectFill">
|
||||||
|
</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="aspectFill">
|
||||||
|
</image>
|
||||||
|
<text class="text">财务公开</text>
|
||||||
|
</view> -->
|
||||||
|
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="business com"
|
||||||
|
v-if="userInfoData.mer_info.type_code === 'TypeFeaturedCultural'|| userInfoData.mer_info.type_code === 'TypeFamousSpecialties'|| userInfoData.mer_info.type_code === 'TypeLocalCuisine' ">
|
||||||
|
<view class="business com" v-if="true">
|
||||||
|
<view class="special_work com">
|
||||||
|
<view class="title">我的店铺</view>
|
||||||
|
<view class="content ">
|
||||||
|
|
||||||
|
<view class="examine" @click="navigator(`/pages/users/embody/embody?mer_id=${mer_id}`)">
|
||||||
|
<image class="icon_img" :src="`${prefix}txgl.png`" mode="aspectFill">
|
||||||
|
</image>
|
||||||
|
<text class="text">提现管理</text>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="examine"
|
||||||
|
@click="navigator(`/pages/chat/customer_list/index?type=1&mer_id=${mer_id}`)">
|
||||||
|
<image class="icon_img" :src="`${prefix}kfjl.png`" mode="aspectFill">
|
||||||
|
</image>
|
||||||
|
<text class="text">客服记录</text>
|
||||||
|
</view>
|
||||||
|
<view class="examine"
|
||||||
|
@click="navigator(`/pages/admin/order_cancellation/index?mer_id=${mer_id}`)">
|
||||||
|
<image class="icon_img" :src="`${prefix}ddhx.png`" mode="aspectFill">
|
||||||
|
</image>
|
||||||
|
<text class="text">订单核销</text>
|
||||||
|
</view>
|
||||||
|
<view class="examine"
|
||||||
|
@click="navigator(`/pages/admin/order/index?mer_id=${mer_id}&type_id=${userInfoData.mer_info.type_id}`)">
|
||||||
|
<image class="icon_img" :src="`${prefix}ddgl.png`" mode="aspectFill">
|
||||||
|
</image>
|
||||||
|
<text class="text">订单管理</text>
|
||||||
|
</view>
|
||||||
|
<view class="examine" @click="navigator(`/pages/product/list/index?mer_id=${mer_id}`)">
|
||||||
|
<image class="icon_img" :src="`${prefix}spgl.png`" mode="aspectFill">
|
||||||
|
</image>
|
||||||
|
<text class="text">商品管理</text>
|
||||||
|
</view>
|
||||||
|
<view class="examine"
|
||||||
|
@click="navigator(`/pages/product/basicSet?mer_id=${mer_id}`, '商户设置')">
|
||||||
|
<image class="icon_img" :src="`${prefix}shsz.png`" mode="aspectFill">
|
||||||
|
</image>
|
||||||
|
<text class="text">商户设置</text>
|
||||||
|
</view>
|
||||||
|
<view class="examine"
|
||||||
|
@click="navigator(`/pages/product/transactionApplication/index?mer_id=${mer_id}`, '交易申请')">
|
||||||
|
<image class="icon_img" src="@/static/images/jy.png" mode="aspectFill">
|
||||||
|
</image>
|
||||||
|
<text class="text">交易申请</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="" v-else>
|
||||||
|
<view class="business com">
|
||||||
|
<view class="special_work com">
|
||||||
|
<view class="title">我的店铺</view>
|
||||||
|
<view class="content ">
|
||||||
|
|
||||||
|
<view class="examine"
|
||||||
|
@click="navigator(`/pages/product/basicSet?mer_id=${mer_id}`, '商户设置')">
|
||||||
|
<image class="icon_img" :src="`${prefix}shsz.png`" mode="aspectFill">
|
||||||
|
</image>
|
||||||
|
<text class="text">商户设置</text>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
<view class="examine" v-if="userInfoData.mer_info.setting_status==1" @click="navigator(`/pages/product/transactionApplication/index?mer_id=${mer_id}&business_status=${userInfoData.mer_info.business_status}`, '交易申请')">
|
||||||
|
<image class="icon_img" src="@/static/images/jy.png" mode="aspectFill">
|
||||||
|
</image>
|
||||||
|
<text class="text">交易申请</text>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</block>
|
||||||
|
<view class="" style="padding-top: 1px;" v-else>
|
||||||
|
<emptyPage title="暂无信息"></emptyPage>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import mTabbar from '@/components/m-tabbar/m-tabbar.vue'
|
||||||
|
import emptyPage from '@/components/emptyPage.vue';
|
||||||
|
import zbpSwiper from '@/components/zbpSwiper'
|
||||||
|
import {
|
||||||
|
mapState,
|
||||||
|
mapGetters
|
||||||
|
} from 'vuex'
|
||||||
|
import {
|
||||||
|
getWorkArticleCount,
|
||||||
|
getSlideAPI
|
||||||
|
} from '@/api/article.js'
|
||||||
|
import {
|
||||||
|
getStoreList,
|
||||||
|
getUserInfo
|
||||||
|
} from '@/api/user.js'
|
||||||
|
import {
|
||||||
|
getGeocoder,
|
||||||
|
microSeachBarCode,
|
||||||
|
microEadtProduct
|
||||||
|
} from '@/api/store.js'
|
||||||
|
import {
|
||||||
|
Toast
|
||||||
|
} from '@/libs/uniApi';
|
||||||
|
import {
|
||||||
|
getDiy
|
||||||
|
} from '@/api/api.js'
|
||||||
|
|
||||||
|
export default {
|
||||||
|
components: {
|
||||||
|
mTabbar,
|
||||||
|
zbpSwiper,
|
||||||
|
emptyPage
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
locationArr: ({}),
|
||||||
|
emptyText: '暂无可用应用',
|
||||||
|
jurisdiction: false, // 是否有权限
|
||||||
|
mer_id: '',
|
||||||
|
userInfoData: {
|
||||||
|
mer_info: {
|
||||||
|
type_id: 0
|
||||||
|
}
|
||||||
|
},
|
||||||
|
prefix: 'https://lihai001.oss-cn-chengdu.aliyuncs.com/public/kk/luzhou/static4/11/',
|
||||||
|
isShow: false,
|
||||||
|
bgColor: '',
|
||||||
|
isFshow: false,
|
||||||
|
street: ''
|
||||||
|
};
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
...mapGetters(['userInfo', 'location', 'isLogin'])
|
||||||
|
},
|
||||||
|
created() {},
|
||||||
|
onLoad() {},
|
||||||
|
onShow() {
|
||||||
|
if (this.isLogin) {
|
||||||
|
this.emptyText = '暂无可用应用'
|
||||||
|
this.jurisdiction = false
|
||||||
|
} else {
|
||||||
|
// this.emptyText = '请登录'
|
||||||
|
uni.navigateTo({
|
||||||
|
url:'/pages/users/login/login_copy'
|
||||||
|
})
|
||||||
|
this.jurisdiction = true
|
||||||
|
}
|
||||||
|
this.getUserInfo()
|
||||||
|
this.appLocation()
|
||||||
|
},
|
||||||
|
onPullDownRefresh() {
|
||||||
|
this.getUserInfo()
|
||||||
|
uni.stopPullDownRefresh()
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
this.appLocation()
|
||||||
|
|
||||||
|
},
|
||||||
|
|
||||||
|
methods: {
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
//获取定位
|
||||||
|
appLocation() {
|
||||||
|
uni.getLocation({
|
||||||
|
type: 'wgs84',
|
||||||
|
timeout: '10',
|
||||||
|
success: (res) => {
|
||||||
|
// console.log(res)
|
||||||
|
|
||||||
|
let latitude, longitude;
|
||||||
|
latitude = res.latitude.toString();
|
||||||
|
longitude = res.longitude.toString();
|
||||||
|
getGeocoder({
|
||||||
|
lat: latitude,
|
||||||
|
long: longitude
|
||||||
|
}).then(res => {
|
||||||
|
this.street = res.data.address_component.street
|
||||||
|
Cache.set('ADRESS_LOCATION', this.street)
|
||||||
|
}).catch(err => {
|
||||||
|
uni.showToast({
|
||||||
|
title: err,
|
||||||
|
icon: 'none'
|
||||||
|
})
|
||||||
|
})
|
||||||
|
},
|
||||||
|
fail: (err) => {
|
||||||
|
|
||||||
|
// uni.showToast({
|
||||||
|
// title: "获取定位超时",
|
||||||
|
// icon: 'none',
|
||||||
|
// duration: 2000
|
||||||
|
// });
|
||||||
|
}
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
scrolling() {
|
||||||
|
// 滚动条距文档顶部的距离
|
||||||
|
let scrollTop =
|
||||||
|
window.pageYOffset ||
|
||||||
|
document.documentElement.scrollTop ||
|
||||||
|
document.body.scrollTop;
|
||||||
|
// 滚动条滚动的距离
|
||||||
|
let scrollStep = scrollTop - this.oldScrollTop;
|
||||||
|
console.log("header 滚动距离 ", scrollTop);
|
||||||
|
// 更新——滚动前，滚动条距文档顶部的距离
|
||||||
|
this.oldScrollTop = scrollTop;
|
||||||
|
|
||||||
|
//变量windowHeight是可视区的高度
|
||||||
|
let windowHeight =
|
||||||
|
document.documentElement.clientHeight || document.body.clientHeight;
|
||||||
|
//变量scrollHeight是滚动条的总高度
|
||||||
|
let scrollHeight =
|
||||||
|
document.documentElement.scrollHeight || document.body.scrollHeight;
|
||||||
|
|
||||||
|
//滚动条到底部的条件
|
||||||
|
if (scrollTop + windowHeight == scrollHeight) {
|
||||||
|
//你想做的事情
|
||||||
|
console.log("header 你已经到底部了");
|
||||||
|
}
|
||||||
|
if (scrollStep < 0) {
|
||||||
|
this.isFshow = false
|
||||||
|
console.log("header 滚动条向上滚动了！");
|
||||||
|
} else {
|
||||||
|
this.isFshow = true
|
||||||
|
console.log("header 滚动条向下滚动了！");
|
||||||
|
}
|
||||||
|
// 判断是否到了最顶部
|
||||||
|
if (scrollTop <= 0) {
|
||||||
|
this.isFshow = false
|
||||||
|
console.log("header 到了最顶部")
|
||||||
|
}
|
||||||
|
},
|
||||||
|
|
||||||
|
kkchange(e) {
|
||||||
|
this.bgColor = e
|
||||||
|
},
|
||||||
|
|
||||||
|
navigator(url, t) {
|
||||||
|
// if (this.userInfoData.is_wsxx === 0 && t != '商户设置') return Toast("请完善商户信息");
|
||||||
|
uni.navigateTo({
|
||||||
|
url: url
|
||||||
|
})
|
||||||
|
},
|
||||||
|
getUserInfo: function() {
|
||||||
|
let that = this;
|
||||||
|
getUserInfo().then(res => {
|
||||||
|
that.userInfoData = res.data;
|
||||||
|
// console.log(res.data.service);
|
||||||
|
if (res.data.service == null) {
|
||||||
|
// console.log('123');
|
||||||
|
this.isShow = false
|
||||||
|
} else {
|
||||||
|
this.isShow = true
|
||||||
|
this.mer_id = res.data.service.mer_id
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!res.data.mer_info) {
|
||||||
|
that.$set(this, 'jurisdiction', false);
|
||||||
|
}
|
||||||
|
// console.log(that.userInfoData);
|
||||||
|
});
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.gather {
|
||||||
|
padding-bottom: 164.91rpx;
|
||||||
|
background: linear-gradient(180deg, #FFFFFF 0%, #F6F6F6 100%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.bg-img {
|
||||||
|
position: absolute;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
top: 0;
|
||||||
|
/* #ifdef MP || APP-PLUS */
|
||||||
|
z-index: -100;
|
||||||
|
/* #endif */
|
||||||
|
/* #ifdef H5 */
|
||||||
|
z-index: -100;
|
||||||
|
/* #endif */
|
||||||
|
z-index: -100;
|
||||||
|
filter: blur(0);
|
||||||
|
overflow: hidden;
|
||||||
|
|
||||||
|
|
||||||
|
img {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
filter: blur(30rpx);
|
||||||
|
transform: scale(1.5);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.site-box {
|
||||||
|
width: 100%;
|
||||||
|
height: 120rpx;
|
||||||
|
margin-bottom: 26.32rpx;
|
||||||
|
position: absolute;
|
||||||
|
top: 0rpx;
|
||||||
|
position: fixed;
|
||||||
|
z-index: 999;
|
||||||
|
padding-top: 30rpx;
|
||||||
|
padding-right: 20rpx;
|
||||||
|
|
||||||
|
// 位置
|
||||||
|
.place_wrapper {
|
||||||
|
color: #fff;
|
||||||
|
margin-right: 24.56rpx;
|
||||||
|
font-size: 30rpx;
|
||||||
|
|
||||||
|
.town_name {
|
||||||
|
margin-left: 21rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.iconfont {
|
||||||
|
font-size: 35.09rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.top_box {
|
||||||
|
// padding-top: 180rpx;
|
||||||
|
background: linear-gradient(#36A2FF, #fff);
|
||||||
|
}
|
||||||
|
|
||||||
|
.com {
|
||||||
|
margin-left: 50%;
|
||||||
|
transform: translate(-50%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.business {
|
||||||
|
width: 694.74rpx;
|
||||||
|
// margin-bottom: 175rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.special_work {
|
||||||
|
// padding: 17.54rpx;
|
||||||
|
width: 694.74rpx;
|
||||||
|
// margin-top: 52.63rpx;
|
||||||
|
padding-top: 32rpx;
|
||||||
|
border-radius: 17.54rpx;
|
||||||
|
// box-shadow: 0px 0px 6px 1px rgba(0, 0, 0, 0.16);
|
||||||
|
|
||||||
|
.title {
|
||||||
|
font-size: 31.58rpx;
|
||||||
|
font-weight: 700;
|
||||||
|
margin-bottom: 38.6rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content {
|
||||||
|
display: flex;
|
||||||
|
align-content: center;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
// justify-content: space-between;
|
||||||
|
|
||||||
|
.examine {
|
||||||
|
margin-bottom: 35rpx;
|
||||||
|
width: 173.68rpx;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
// margin: 0 0 33.33rpx 33.33rpx !important;
|
||||||
|
|
||||||
|
.icon_img {
|
||||||
|
width: 63.16rpx;
|
||||||
|
height: 63.16rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.text {
|
||||||
|
font-size: 26.32rpx;
|
||||||
|
margin-top: 21.05rpx;
|
||||||
|
color: #000;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.text {
|
||||||
|
font-size: 29.82rpx;
|
||||||
|
color: #a4a4a4;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.cont_jus {
|
||||||
|
margin-top: 56.14rpx;
|
||||||
|
justify-content: flex-start;
|
||||||
|
|
||||||
|
&:first-child {
|
||||||
|
// margin-right: 33rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.examine {
|
||||||
|
margin-right: 48rpx;
|
||||||
|
|
||||||
|
&:first-child {
|
||||||
|
margin-right: 48rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
352
pages/news_details/index.vue
Normal file
352
pages/news_details/index.vue
Normal file
@ -0,0 +1,352 @@
|
|||||||
|
<template>
|
||||||
|
<view>
|
||||||
|
<view class='newsDetail' style="padding-bottom: 50px;">
|
||||||
|
<view class='title'>{{articleInfo.title}}</view>
|
||||||
|
<view class='list acea-row row-middle'>
|
||||||
|
<view class='label'>{{articleInfo.author}}</view>
|
||||||
|
<view class='item'></text>{{articleInfo.create_time}}</view>
|
||||||
|
<!-- <view class='item'><text class='iconfont icon-liulan'></text>{{articleInfo.visit}}</view> -->
|
||||||
|
</view>
|
||||||
|
<view class='conters'>
|
||||||
|
<!-- <rich-text :nodes="content" class="conter"></rich-text> -->
|
||||||
|
<jyf-parser :html="content.replace(/<br\/>/ig, '')" ref="article" :tag-style="tagStyle"></jyf-parser>
|
||||||
|
</view>
|
||||||
|
<view class="picTxt acea-row row-between-wrapper" v-if="store_info.id">
|
||||||
|
<view class="pictrue">
|
||||||
|
<image :src="store_info.image"></image>
|
||||||
|
</view>
|
||||||
|
<view class="text">
|
||||||
|
<view class="name line1">{{store_info.store_name}}</view>
|
||||||
|
<view class="money font-color">
|
||||||
|
￥<text class="num">{{store_info.price}}</text>
|
||||||
|
</view>
|
||||||
|
<view class="y_money">￥{{store_info.ot_price}}</view>
|
||||||
|
</view>
|
||||||
|
<navigator :url="'/pages/goods_details/index?id='+store_info.id" hover-class="none" class="label"><text
|
||||||
|
class="span">查看商品</text></navigator>
|
||||||
|
</view>
|
||||||
|
<!-- #ifdef H5 -->
|
||||||
|
<button class="bnt bg-color" hover-class='none' @click="listenerActionSheet">和好友一起分享</button>
|
||||||
|
<!-- #endif -->
|
||||||
|
<!-- #ifdef MP -->
|
||||||
|
<button class="bnt bg-color" open-type="share" hover-class='none'>和好友一起分享</button>
|
||||||
|
<!-- #endif -->
|
||||||
|
<!-- #ifdef APP-PLUS -->
|
||||||
|
<button class="bnt bg-color" open-type="share" hover-class='none' @click="uniShare">分享</button>
|
||||||
|
<!-- #endif -->
|
||||||
|
</view>
|
||||||
|
<shareInfo @setShareInfoStatus="setShareInfoStatus" :shareInfoStatus="shareInfoStatus"></shareInfo>
|
||||||
|
<!-- <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 parser from "@/components/jyf-parser/jyf-parser";
|
||||||
|
import {
|
||||||
|
getArticleDetails
|
||||||
|
} from '@/api/api.js';
|
||||||
|
import shareInfo from '@/components/shareInfo';
|
||||||
|
import home from '@/components/home';
|
||||||
|
import UniShare from 'uni_modules/uni-share/js_sdk/uni-share.js';
|
||||||
|
const uniShare = new UniShare();
|
||||||
|
export default {
|
||||||
|
components: {
|
||||||
|
shareInfo,
|
||||||
|
home,
|
||||||
|
"jyf-parser": parser,
|
||||||
|
},
|
||||||
|
onBackPress({
|
||||||
|
from
|
||||||
|
}) {
|
||||||
|
if (from == 'backbutton') {
|
||||||
|
this.$nextTick(function() {
|
||||||
|
uniShare.hide()
|
||||||
|
})
|
||||||
|
return uniShare.isShow;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
id: 0,
|
||||||
|
articleInfo: [],
|
||||||
|
store_info: {},
|
||||||
|
content: '',
|
||||||
|
shareInfoStatus: false,
|
||||||
|
tagStyle: {
|
||||||
|
img: 'width:100%;display:block;'
|
||||||
|
},
|
||||||
|
};
|
||||||
|
},
|
||||||
|
/**
|
||||||
|
* 生命周期函数--监听页面加载
|
||||||
|
*/
|
||||||
|
onLoad: function(options) {
|
||||||
|
if (options.hasOwnProperty('id')) {
|
||||||
|
this.id = options.id;
|
||||||
|
} else {
|
||||||
|
// #ifndef H5
|
||||||
|
uni.navigateBack({
|
||||||
|
delta: 1
|
||||||
|
});
|
||||||
|
// #endif
|
||||||
|
// #ifdef H5
|
||||||
|
history.back();
|
||||||
|
// #endif
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onShow: function() {
|
||||||
|
this.getArticleOne();
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
// 分享
|
||||||
|
uniShare() {
|
||||||
|
uniShare.show({
|
||||||
|
content: { //公共的分享参数配置 类型（type）、链接（herf）、标题（title）、summary（描述）、imageUrl（缩略图）
|
||||||
|
type: 0,
|
||||||
|
href: 'https://uniapp.dcloud.io/',
|
||||||
|
title: '标题',
|
||||||
|
summary: '描述',
|
||||||
|
imageUrl: 'https://img-cdn-aliyun.dcloud.net.cn/stream/icon/__UNI__HelloUniApp.png'
|
||||||
|
},
|
||||||
|
menus: [{
|
||||||
|
"img": "/static/images/weixin.png",
|
||||||
|
"text": "微信好友",
|
||||||
|
"share": { //当前项的分享参数配置。可覆盖公共的配置如下：分享到微信小程序，配置了type=5
|
||||||
|
"provider": "weixin",
|
||||||
|
"scene": "WXSceneSession"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"img": "/static/images/weixin.png",
|
||||||
|
"text": "微信朋友圈",
|
||||||
|
"share": {
|
||||||
|
"provider": "weixin",
|
||||||
|
"scene": "WXSceneTimeline"
|
||||||
|
}
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"img": "/static/images/weixin.png",
|
||||||
|
"text": "微信小程序",
|
||||||
|
"share": {
|
||||||
|
provider: "weixin",
|
||||||
|
scene: "WXSceneSession",
|
||||||
|
type: 5,
|
||||||
|
miniProgram: {
|
||||||
|
id: '123',
|
||||||
|
path: '/pages/list/detail',
|
||||||
|
webUrl: '/#/pages/list/detail',
|
||||||
|
type: 0
|
||||||
|
},
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// {
|
||||||
|
// "img": "/static/app-plus/sharemenu/weibo.png",
|
||||||
|
// "text": "微博",
|
||||||
|
// "share": {
|
||||||
|
// "provider": "sinaweibo"
|
||||||
|
// }
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// "img": "/static/app-plus/sharemenu/qq.png",
|
||||||
|
// "text": "QQ",
|
||||||
|
// "share": {
|
||||||
|
// "provider": "qq"
|
||||||
|
// }
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// "img": "/static/app-plus/sharemenu/copyurl.png",
|
||||||
|
// "text": "复制",
|
||||||
|
// "share": "copyurl"
|
||||||
|
// },
|
||||||
|
// {
|
||||||
|
// "img": "/static/app-plus/sharemenu/more.png",
|
||||||
|
// "text": "更多",
|
||||||
|
// "share": "shareSystem"
|
||||||
|
// }
|
||||||
|
],
|
||||||
|
cancelText: "取消分享",
|
||||||
|
}, e => { //callback
|
||||||
|
console.log(uniShare.isShow);
|
||||||
|
console.log(e);
|
||||||
|
})
|
||||||
|
},
|
||||||
|
getArticleOne: function() {
|
||||||
|
let that = this;
|
||||||
|
getArticleDetails(that.id).then(res => {
|
||||||
|
uni.setNavigationBarTitle({
|
||||||
|
title: res.data.title.substring(0, 7) + "..."
|
||||||
|
});
|
||||||
|
that.$set(that, 'articleInfo', res.data);
|
||||||
|
that.$set(that, 'store_info', res.data.store_info ? res.data.store_info : {});
|
||||||
|
that.content = res.data.content.content;
|
||||||
|
// #ifdef H5
|
||||||
|
if (this.$wechat.isWeixin()) {
|
||||||
|
this.setShareInfo();
|
||||||
|
}
|
||||||
|
// #endif
|
||||||
|
});
|
||||||
|
},
|
||||||
|
listenerActionSheet() {
|
||||||
|
this.shareInfoStatus = true
|
||||||
|
},
|
||||||
|
setShareInfoStatus() {
|
||||||
|
this.shareInfoStatus = false
|
||||||
|
},
|
||||||
|
setShareInfo: function() {
|
||||||
|
let href = location.href;
|
||||||
|
let configAppMessage = {
|
||||||
|
desc: this.articleInfo.synopsis,
|
||||||
|
title: this.articleInfo.title,
|
||||||
|
link: href,
|
||||||
|
imgUrl: this.articleInfo.image_input
|
||||||
|
};
|
||||||
|
this.$wechat.wechatEvevt(["updateAppMessageShareData", "updateTimelineShareData"], configAppMessage);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
page {
|
||||||
|
background-color: #fff !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.newsDetail .title {
|
||||||
|
padding: 0 30rpx;
|
||||||
|
font-size: 34rpx;
|
||||||
|
color: #282828;
|
||||||
|
font-weight: bold;
|
||||||
|
margin: 45rpx 0 23rpx 0;
|
||||||
|
line-height: 1.5;
|
||||||
|
}
|
||||||
|
|
||||||
|
.newsDetail .list {
|
||||||
|
margin: 0 30rpx;
|
||||||
|
padding-bottom: 25rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.newsDetail .list .label {
|
||||||
|
font-size: 30rpx;
|
||||||
|
color: #B1B2B3;
|
||||||
|
}
|
||||||
|
|
||||||
|
.newsDetail .list .item {
|
||||||
|
margin-left: 27rpx;
|
||||||
|
font-size: 30rpx;
|
||||||
|
color: #B1B2B3;
|
||||||
|
}
|
||||||
|
|
||||||
|
.newsDetail .list .item .iconfont {
|
||||||
|
font-size: 28rpx;
|
||||||
|
margin-right: 10rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.newsDetail .list .item .iconfont.icon-shenhezhong {
|
||||||
|
font-size: 26rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.newsDetail .conters {
|
||||||
|
padding: 0 30rpx;
|
||||||
|
font-size: 32rpx;
|
||||||
|
line-height: 1.7;
|
||||||
|
|
||||||
|
/deep/ img {
|
||||||
|
max-width: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.newsDetail .picTxt {
|
||||||
|
width: 690rpx;
|
||||||
|
height: 200rpx;
|
||||||
|
border-radius: 20rpx;
|
||||||
|
border: 1px solid #e1e1e1;
|
||||||
|
position: relative;
|
||||||
|
margin: 30rpx auto 0 auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.newsDetail .picTxt .pictrue {
|
||||||
|
width: 200rpx;
|
||||||
|
height: 200rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.newsDetail .picTxt .pictrue image {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
border-radius: 20rpx 0 0 20rpx;
|
||||||
|
display: block;
|
||||||
|
}
|
||||||
|
|
||||||
|
.newsDetail .picTxt .text {
|
||||||
|
width: 460rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.newsDetail .picTxt .text .name {
|
||||||
|
font-size: 30rpx;
|
||||||
|
color: #282828;
|
||||||
|
}
|
||||||
|
|
||||||
|
.newsDetail .picTxt .text .money {
|
||||||
|
font-size: 24rpx;
|
||||||
|
margin-top: 40rpx;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
.newsDetail .picTxt .text .money .num {
|
||||||
|
font-size: 36rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.newsDetail .picTxt .text .y_money {
|
||||||
|
font-size: 26rpx;
|
||||||
|
color: #999;
|
||||||
|
text-decoration: line-through;
|
||||||
|
}
|
||||||
|
|
||||||
|
.newsDetail .picTxt .label {
|
||||||
|
position: absolute;
|
||||||
|
background-color: #303131;
|
||||||
|
width: 160rpx;
|
||||||
|
height: 50rpx;
|
||||||
|
right: -7rpx;
|
||||||
|
border-radius: 25rpx 0 6rpx 25rpx;
|
||||||
|
text-align: center;
|
||||||
|
line-height: 50rpx;
|
||||||
|
bottom: 24rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.newsDetail .picTxt .label .span {
|
||||||
|
background-image: linear-gradient(to right, #fff71e 0%, #f9b513 100%);
|
||||||
|
-webkit-background-clip: text;
|
||||||
|
-webkit-text-fill-color: transparent;
|
||||||
|
}
|
||||||
|
|
||||||
|
.newsDetail .picTxt .label:after {
|
||||||
|
content: " ";
|
||||||
|
position: absolute;
|
||||||
|
width: 0;
|
||||||
|
height: 0;
|
||||||
|
border-bottom: 8rpx solid #303131;
|
||||||
|
border-right: 8rpx solid transparent;
|
||||||
|
top: -7rpx;
|
||||||
|
right: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.newsDetail .bnt {
|
||||||
|
color: #fff;
|
||||||
|
font-size: 30rpx;
|
||||||
|
width: 690rpx;
|
||||||
|
height: 90rpx;
|
||||||
|
border-radius: 45rpx;
|
||||||
|
margin: 48rpx auto;
|
||||||
|
text-align: center;
|
||||||
|
line-height: 90rpx;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
352
pages/news_list/index.vue
Normal file
352
pages/news_list/index.vue
Normal file
@ -0,0 +1,352 @@
|
|||||||
|
<template>
|
||||||
|
<view>
|
||||||
|
<view class='newsList'>
|
||||||
|
<view class='swiper' v-if="imgUrls.length > 0">
|
||||||
|
<swiper indicator-dots="true" :autoplay="autoplay" :circular="circular" :interval="interval"
|
||||||
|
:duration="duration" indicator-color="rgba(102,102,102,0.3)" indicator-active-color="#666">
|
||||||
|
<block v-for="(item,index) in imgUrls" :key="index">
|
||||||
|
<swiper-item>
|
||||||
|
<navigator :url="'/pages/news_details/index?id='+item.id">
|
||||||
|
<image :src="item.image_input[0]" class="slide-image" />
|
||||||
|
</navigator>
|
||||||
|
</swiper-item>
|
||||||
|
</block>
|
||||||
|
</swiper>
|
||||||
|
</view>
|
||||||
|
<view class='nav' v-if="navList.length > 0">
|
||||||
|
<scroll-view class="scroll-view_x" scroll-x scroll-with-animation :scroll-left="scrollLeft"
|
||||||
|
style="width:auto;overflow:hidden;">
|
||||||
|
<block v-for="(item,index) in navList" :key="index">
|
||||||
|
<view class='item' style="text-align: center;" :class='active==item.article_category_id?"on":""'
|
||||||
|
@click='tabSelect(item.article_category_id)'>
|
||||||
|
<view>{{item.title}}</view>
|
||||||
|
<view class='line bg-color' v-if="active==item.article_category_id"></view>
|
||||||
|
</view>
|
||||||
|
</block>
|
||||||
|
</scroll-view>
|
||||||
|
</view>
|
||||||
|
<view class='list'>
|
||||||
|
<block v-for="(item,index) in articleList" :key="index">
|
||||||
|
<navigator :url='"/pages/news_details/index?id="+item.article_id' hover-class='none'
|
||||||
|
class='item acea-row row-between-wrapper'>
|
||||||
|
<view class='text acea-row row-column-between'>
|
||||||
|
<view class='name line2'>{{item.title}}</view>
|
||||||
|
<view>{{item.create_time}}</view>
|
||||||
|
</view>
|
||||||
|
<view class='pictrue'>
|
||||||
|
<image :src='item.image_input'></image>
|
||||||
|
</view>
|
||||||
|
</navigator>
|
||||||
|
</block>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class='empty-box acea-row row-middle' v-if="articleList.length == 0 && (page != 1 || active== 0)">
|
||||||
|
<view class='pictrue'>
|
||||||
|
<image src='../../static/images/empty-box.png'></image>
|
||||||
|
<view class="txt">暂无新闻信息~</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<!-- <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 {
|
||||||
|
getArticleCategoryLists,
|
||||||
|
getArticleCategoryList,
|
||||||
|
getArticleList,
|
||||||
|
getArticleHotList,
|
||||||
|
getArticleBannerList
|
||||||
|
} from '@/api/api.js';
|
||||||
|
import home from '@/components/home';
|
||||||
|
export default {
|
||||||
|
components: {
|
||||||
|
home
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
imgUrls: [],
|
||||||
|
articleList: [],
|
||||||
|
indicatorDots: false,
|
||||||
|
circular: true,
|
||||||
|
autoplay: true,
|
||||||
|
interval: 3000,
|
||||||
|
duration: 500,
|
||||||
|
navList: [],
|
||||||
|
active: 0,
|
||||||
|
page: 1,
|
||||||
|
limit: 8,
|
||||||
|
status: false,
|
||||||
|
scrollLeft: 0,
|
||||||
|
type: 0
|
||||||
|
};
|
||||||
|
},
|
||||||
|
/**
|
||||||
|
* 生命周期函数--监听页面显示
|
||||||
|
*/
|
||||||
|
onShow: function() {},
|
||||||
|
/**
|
||||||
|
* 生命周期函数--监听页面显示
|
||||||
|
*/
|
||||||
|
onLoad: function(e) {
|
||||||
|
|
||||||
|
this.type = e.type
|
||||||
|
this.getArticleCate();
|
||||||
|
this.status = false;
|
||||||
|
this.page = 1;
|
||||||
|
this.articleList = [];
|
||||||
|
},
|
||||||
|
/**
|
||||||
|
* 页面上拉触底事件的处理函数
|
||||||
|
*/
|
||||||
|
onReachBottom: function() {
|
||||||
|
this.getCidArticle();
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
getArticleHot: function() {
|
||||||
|
let that = this;
|
||||||
|
getArticleHotList().then(res => {
|
||||||
|
that.$set(that, 'articleList', res.data);
|
||||||
|
});
|
||||||
|
},
|
||||||
|
getArticleBanner: function() {
|
||||||
|
let that = this;
|
||||||
|
getArticleBannerList().then(res => {
|
||||||
|
that.imgUrls = res.data;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
getCidArticle: function() {
|
||||||
|
let that = this;
|
||||||
|
if (that.active == 0) return;
|
||||||
|
let limit = that.limit;
|
||||||
|
let page = that.page;
|
||||||
|
let articleList = that.articleList;
|
||||||
|
if (that.status) return;
|
||||||
|
getArticleList(that.active, {
|
||||||
|
page: page,
|
||||||
|
limit: limit
|
||||||
|
}).then(res => {
|
||||||
|
let articleListNew = [];
|
||||||
|
let len = res.length;
|
||||||
|
articleListNew = articleList.concat(res.data.list);
|
||||||
|
that.page++;
|
||||||
|
that.$set(that, 'articleList', articleListNew);
|
||||||
|
that.status = limit > len;
|
||||||
|
that.page = that.page;
|
||||||
|
});
|
||||||
|
},
|
||||||
|
getArticleCate: function() {
|
||||||
|
let that = this;
|
||||||
|
if (this.type == 1) {
|
||||||
|
getArticleCategoryLists().then(res => {
|
||||||
|
this.active = res.data[0].article_category_id
|
||||||
|
that.$set(that, 'navList', res.data);
|
||||||
|
this.getCidArticle();
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
getArticleCategoryList().then(res => {
|
||||||
|
this.active = res.data[0].article_category_id
|
||||||
|
that.$set(that, 'navList', res.data);
|
||||||
|
this.getCidArticle();
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
},
|
||||||
|
tabSelect(active) {
|
||||||
|
this.active = active;
|
||||||
|
if (this.active == 0) this.getArticleHot();
|
||||||
|
else {
|
||||||
|
this.$set(this, 'articleList', []);
|
||||||
|
this.page = 1;
|
||||||
|
this.status = false;
|
||||||
|
this.getCidArticle();
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
page {
|
||||||
|
background-color: #fff !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.newsList .swiper {
|
||||||
|
width: 100%;
|
||||||
|
position: relative;
|
||||||
|
box-sizing: border-box;
|
||||||
|
padding: 0 30rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.newsList .swiper swiper {
|
||||||
|
width: 100%;
|
||||||
|
height: 365rpx;
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.newsList .swiper .slide-image {
|
||||||
|
width: 100%;
|
||||||
|
height: 335rpx;
|
||||||
|
border-radius: 6rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
// #ifdef MP-WEIXIN
|
||||||
|
.newsList .swiper .wx-swiper-dot {
|
||||||
|
width: 12rpx !important;
|
||||||
|
height: 12rpx !important;
|
||||||
|
border-radius: 0;
|
||||||
|
transform: rotate(-45deg);
|
||||||
|
transform-origin: 0 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.newsList .swiper .wx-swiper-dot~.wx-swiper-dot {
|
||||||
|
margin-left: 5rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.newsList .swiper .wx-swiper-dots.wx-swiper-dots-horizontal {
|
||||||
|
margin-bottom: -15rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
// #endif
|
||||||
|
// #ifdef APP-PLUS || H5
|
||||||
|
.newsList .swiper .uni-swiper-dot {
|
||||||
|
width: 12rpx !important;
|
||||||
|
height: 12rpx !important;
|
||||||
|
border-radius: 0;
|
||||||
|
transform: rotate(-45deg);
|
||||||
|
transform-origin: 0 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.newsList .swiper .uni-swiper-dot~.uni-swiper-dot {
|
||||||
|
margin-left: 5rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.newsList .swiper .uni-swiper-dots.uni-swiper-dots-horizontal {
|
||||||
|
margin-bottom: -15rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
// #endif
|
||||||
|
.newsList .nav {
|
||||||
|
padding: 0 30rpx;
|
||||||
|
width: 100%;
|
||||||
|
white-space: nowrap;
|
||||||
|
box-sizing: border-box;
|
||||||
|
margin-top: 43rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.newsList .nav .item {
|
||||||
|
display: inline-block;
|
||||||
|
font-size: 32rpx;
|
||||||
|
color: #999;
|
||||||
|
min-width: 130rpx;
|
||||||
|
white-space: nowrap;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
position: relative;
|
||||||
|
padding-bottom: 20rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.newsList .nav .item.on {
|
||||||
|
color: #282828;
|
||||||
|
}
|
||||||
|
|
||||||
|
.newsList .nav .item~.item {
|
||||||
|
margin-left: 46rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.newsList .nav .item .line {
|
||||||
|
width: 24rpx;
|
||||||
|
height: 4rpx;
|
||||||
|
border-radius: 2rpx;
|
||||||
|
margin: 10rpx auto 0 auto;
|
||||||
|
position: absolute;
|
||||||
|
bottom: 5rpx;
|
||||||
|
left: 50%;
|
||||||
|
margin-left: -12rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.newsList .list .item {
|
||||||
|
margin: 0 30rpx;
|
||||||
|
border-bottom: 1px solid #f0f0f0;
|
||||||
|
padding: 35rpx 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.newsList .list .item .pictrue {
|
||||||
|
width: 250rpx;
|
||||||
|
height: 156rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.newsList .list .item .pictrue image {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
border-radius: 6rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.newsList .list .item .text {
|
||||||
|
width: 420rpx;
|
||||||
|
height: 156rpx;
|
||||||
|
font-size: 24rpx;
|
||||||
|
color: #999;
|
||||||
|
}
|
||||||
|
|
||||||
|
.newsList .list .item .text .name {
|
||||||
|
font-size: 30rpx;
|
||||||
|
color: #282828;
|
||||||
|
}
|
||||||
|
|
||||||
|
.newsList .list .item .picList .pictrue {
|
||||||
|
width: 335rpx;
|
||||||
|
height: 210rpx;
|
||||||
|
margin-top: 30rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.newsList .list .item .picList.on .pictrue {
|
||||||
|
width: 217rpx;
|
||||||
|
height: 136rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.newsList .list .item .picList .pictrue image {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
border-radius: 6rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.newsList .list .item .time {
|
||||||
|
text-align: right;
|
||||||
|
font-size: 24rpx;
|
||||||
|
color: #999;
|
||||||
|
margin-top: 22rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.noCommodity {
|
||||||
|
border: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.empty-box {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
margin-top: 200rpx;
|
||||||
|
|
||||||
|
image {
|
||||||
|
width: 414rpx;
|
||||||
|
height: 240rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.txt {
|
||||||
|
font-size: 26rpx;
|
||||||
|
color: #999;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
1572
pages/nongKe/cloud_entrepot/index.vue
Normal file
1572
pages/nongKe/cloud_entrepot/index.vue
Normal file
File diff suppressed because it is too large
Load Diff
1051
pages/nongKe/cloud_entrepot/indexa.vue
Normal file
1051
pages/nongKe/cloud_entrepot/indexa.vue
Normal file
File diff suppressed because it is too large
Load Diff
152
pages/nongKe/cpns/goodsPopup.vue
Normal file
152
pages/nongKe/cpns/goodsPopup.vue
Normal file
@ -0,0 +1,152 @@
|
|||||||
|
<template>
|
||||||
|
<u-popup :show="goodsStatu" mode="bottom" :closeOnClickOverlay="false">
|
||||||
|
<view class="goodsPopup">
|
||||||
|
<view class="close" @click="colse">关闭</view>
|
||||||
|
<view class="container">
|
||||||
|
<!-- <image src="" /> -->
|
||||||
|
<view class="content">
|
||||||
|
<view class="image">
|
||||||
|
<image :src="info.image" />
|
||||||
|
</view>
|
||||||
|
<view class="content_info">
|
||||||
|
<view>{{ info.store_name }}</view>
|
||||||
|
<view>￥:{{ info.price * info.num }}</view>
|
||||||
|
<view>库存:{{ info.stock }}</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="goods_num">
|
||||||
|
<view>数量</view>
|
||||||
|
<view class="shop_num">
|
||||||
|
<view class="shop_box" @click="addor(-1)">-</view>
|
||||||
|
<view class="num">{{ info.num }}</view>
|
||||||
|
<view class="shop_box" @click="addor(+1)">+</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="shopgo" @click="handel">添加到购物车</view>
|
||||||
|
</view>
|
||||||
|
</u-popup>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
props: {
|
||||||
|
goodsStatu: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
|
},
|
||||||
|
//商品参数
|
||||||
|
goods_info: {
|
||||||
|
type: Object,
|
||||||
|
default: {}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
info: this.goods_info,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
onLoad() {
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
addor(item, index) {
|
||||||
|
this.info.num += item;
|
||||||
|
if (this.info.num <= 0) {
|
||||||
|
// console.log(goods_info);
|
||||||
|
this.info.num = 1;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 返回修改过后的商品参数给父组件
|
||||||
|
handel() {
|
||||||
|
this.$emit("change", this.info);
|
||||||
|
},
|
||||||
|
colse() {
|
||||||
|
this.$emit("colses", true);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.goodsPopup {
|
||||||
|
display: flex;
|
||||||
|
position: relative;
|
||||||
|
height: 30vh;
|
||||||
|
|
||||||
|
.close {
|
||||||
|
position: absolute;
|
||||||
|
top: 10rpx;
|
||||||
|
right: 10rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.container {
|
||||||
|
width: 100%;
|
||||||
|
|
||||||
|
.content {
|
||||||
|
width: 90%;
|
||||||
|
display: flex;
|
||||||
|
margin: auto;
|
||||||
|
|
||||||
|
.image {
|
||||||
|
width: 200rpx;
|
||||||
|
height: 200rpx;
|
||||||
|
border-radius: 20rpx;
|
||||||
|
|
||||||
|
>image {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.content_info :nth-child(1) {
|
||||||
|
font-size: 36rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content_info :nth-child(2) {
|
||||||
|
font-size: 32rpx;
|
||||||
|
color: #fe9a10;
|
||||||
|
}
|
||||||
|
|
||||||
|
.content_info :nth-child(3) {
|
||||||
|
color: #666;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.goods_num {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
width: 80%;
|
||||||
|
margin: auto;
|
||||||
|
|
||||||
|
.shop_num {
|
||||||
|
display: flex;
|
||||||
|
|
||||||
|
>view {
|
||||||
|
width: 80rpx;
|
||||||
|
height: 40rpx;
|
||||||
|
border: 1px solid;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.num {
|
||||||
|
border-left: 0;
|
||||||
|
border-right: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.shopgo {
|
||||||
|
position: absolute;
|
||||||
|
bottom: 50rpx;
|
||||||
|
left: 50%;
|
||||||
|
transform: translate(-50%, 0);
|
||||||
|
width: 200rpx;
|
||||||
|
background: red;
|
||||||
|
line-height: 80rpx;
|
||||||
|
text-align: center;
|
||||||
|
border-radius: 40rpx;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
1308
pages/nongKe/food/index.vue
Normal file
1308
pages/nongKe/food/index.vue
Normal file
File diff suppressed because it is too large
Load Diff
387
pages/nongKe/food/indexa.vue
Normal file
387
pages/nongKe/food/indexa.vue
Normal file
@ -0,0 +1,387 @@
|
|||||||
|
<template>
|
||||||
|
<view class="box">
|
||||||
|
<view class="head">
|
||||||
|
<view style="height: var(--status-bar-height);"></view>
|
||||||
|
<!-- <u--image style="position: absolute;" :showLoading="true" src="/static/images/MYTC/BG.png" width="750rpx"
|
||||||
|
height="748.25rpx" @click="click"></u--image> -->
|
||||||
|
<view class="head_tit">
|
||||||
|
<view class="head_tit_l">
|
||||||
|
<view class="iconfont icon-xiangzuo"></view>
|
||||||
|
<view style="font-size: 40rpx;font-weight: 700;margin-left: 30rpx; transform: skewX(-10deg);">
|
||||||
|
当地美食
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="head_tit_r" style="font-size: 29.79rpx;">
|
||||||
|
江阳区 <text style="margin-left: 10rpx;" class="iconfont icon-xiangxia"></text>
|
||||||
|
<view class="" style="font-size: 22.78rpx;">
|
||||||
|
晴天30℃
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="head_serch">
|
||||||
|
<view style="position: relative;">
|
||||||
|
<u-search borderColor="#FF6D20" bgColor="white" :showAction="false" placeholder="搜索店铺名称"
|
||||||
|
v-model="keyword" class="serch_cls"></u-search>
|
||||||
|
<u--image @tap="searchSubmit" class="img_cls" :showLoading="true" src="/static/images/GXSC/SS.png"
|
||||||
|
width="115.65rpx" height="56.82rpx"></u--image>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="foodType">
|
||||||
|
<view class="foodLi" v-for="(item,index) in lists" :key="index">
|
||||||
|
<u--image :showLoading="true" src="https://cdn.uviewui.com/uview/album/1.jpg" width="70rpx"
|
||||||
|
height="70rpx"></u--image>
|
||||||
|
<view class="" style="text-align: center;">
|
||||||
|
早餐
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
<!-- 餐厅 -->
|
||||||
|
<view>
|
||||||
|
<u-tabs :list="list1" :activeStyle="{
|
||||||
|
color: '#303133',
|
||||||
|
fontWeight: 'bold',
|
||||||
|
transform: 'scale(1.05)'
|
||||||
|
}" lineColor="#FF6D20" lineWidth='60'></u-tabs>
|
||||||
|
</view>
|
||||||
|
<!-- 分类 -->
|
||||||
|
|
||||||
|
<view class="display_around">
|
||||||
|
<view class="">
|
||||||
|
全部美食
|
||||||
|
</view>
|
||||||
|
<view class="">
|
||||||
|
附近
|
||||||
|
</view>
|
||||||
|
<view class="">
|
||||||
|
智能排序
|
||||||
|
</view>
|
||||||
|
<view class="">
|
||||||
|
筛选
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="display_around hot_serch">
|
||||||
|
<view class="hot_serch_li" v-for="item,index in [1,1,1,1]" :key="index">
|
||||||
|
泸州万达
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view style="padding: 0 20rpx;">
|
||||||
|
<view class="store" style="background-color: white;">
|
||||||
|
<view class="goods_list">
|
||||||
|
<view class="goods_cards" @click="goStore(item.mer_id)" v-for="(item,index) in storeList"
|
||||||
|
:key="index">
|
||||||
|
<view class="left">
|
||||||
|
<u--image :showLoading="true" :src="item.mer_avatar" width="157.71rpx"
|
||||||
|
height="157.71rpx"></u--image>
|
||||||
|
</view>
|
||||||
|
<view class="right">
|
||||||
|
<view class="li heads" style="display: flex;">
|
||||||
|
<text class="com_name">{{item.mer_name}}</text>
|
||||||
|
<text
|
||||||
|
style="font-weight: normal; font-size: 10rpx;color: #737373;padding:0 10rpx; border-radius: 10rpx; border: 1px solid #737373;">{{item.type_name}}</text>
|
||||||
|
</view>
|
||||||
|
<view class="li">
|
||||||
|
<u--image v-for="item,index in [1,1,,1,1,1]" :key="index" :showLoading="true"
|
||||||
|
src="/static/images/GXSC/PF.png" width="20.85rpx" height="19.85rpx"></u--image>
|
||||||
|
<text style="margin-left:10rpx;color: #FF6D20; ">5.0</text>
|
||||||
|
<text>￥80/人</text>
|
||||||
|
<text>20分钟</text>
|
||||||
|
<text>1.1km</text>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
<view class="li" style="align-items: center;">
|
||||||
|
<u--image :showLoading="true" src="/static/images/GXSC/DH.png" width="33.85rpx"
|
||||||
|
height="33.85rpx"></u--image>
|
||||||
|
<text> {{item.service_phone}}</text>
|
||||||
|
</view>
|
||||||
|
<view class="li" style="align-items: center;">
|
||||||
|
<u--image :showLoading="true" src="/static/images/GXSC/SJ.png" width="33.85rpx"
|
||||||
|
height="33.85rpx"></u--image>
|
||||||
|
<text>{{item.mer_take_time[0]}}-{{item.mer_take_time[1]}}</text>
|
||||||
|
</view>
|
||||||
|
<view class="li" style="align-items: center;">
|
||||||
|
<u--image :showLoading="true" src="/static/images/GXSC/DW.png" width="33.85rpx"
|
||||||
|
height="33.85rpx"></u--image>
|
||||||
|
<text class="address">{{item.mer_address}}</text>
|
||||||
|
</view>
|
||||||
|
<u-line color="#B3B3B3"></u-line>
|
||||||
|
|
||||||
|
<view class="package display_around" v-for="item,index in [1,1,1]" :key="index">
|
||||||
|
<text class="hui">惠</text>
|
||||||
|
<text class="price">￥100</text>
|
||||||
|
<text class="sale">6.9折</text>
|
||||||
|
<text style="text-decoration: line-through;color: #B3B3B3;">￥100</text>
|
||||||
|
<text>究极套餐</text>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import {
|
||||||
|
storeMerchantList,
|
||||||
|
} from '@/api/store.js';
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
keyword: "",
|
||||||
|
list: [1, 1, 1, 11, 1, 11, 11],
|
||||||
|
lists: [1, 1, 1, 1, 1],
|
||||||
|
storeList: [1, 1, 1, 1, 1, 1, 1, 1, 1],
|
||||||
|
list1: [{
|
||||||
|
name: "美食餐厅"
|
||||||
|
}, {
|
||||||
|
name: "聚餐宴请"
|
||||||
|
}, {
|
||||||
|
name: "单人餐"
|
||||||
|
}, ]
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onLaunch() {
|
||||||
|
console.log(46545)
|
||||||
|
// storeMerchantList().then(res => {
|
||||||
|
// // this.count = res.data.count
|
||||||
|
// // this.storeList = this.storeList.concat(res.data.list)
|
||||||
|
// // this.loading = false
|
||||||
|
// // this.loadingIcon = false
|
||||||
|
// console.log(res)
|
||||||
|
// })
|
||||||
|
|
||||||
|
},
|
||||||
|
onShow() {
|
||||||
|
// console.log(46545)
|
||||||
|
storeMerchantList().then(res => {
|
||||||
|
// this.count = res.data.count
|
||||||
|
this.storeList = res.data.list
|
||||||
|
// this.loading = false
|
||||||
|
// this.loadingIcon = false
|
||||||
|
// console.log(res)
|
||||||
|
})
|
||||||
|
},
|
||||||
|
methods: {},
|
||||||
|
onPullDownRefresh() {
|
||||||
|
uni.stopPullDownRefresh()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.head {
|
||||||
|
// background-color: #F94621;
|
||||||
|
// background: url('/static/images/MYTC/BG.png') no-repeat;
|
||||||
|
padding: 20rpx;
|
||||||
|
border-radius: 0rpx 0rpx 31.54rpx 31.54rpx;
|
||||||
|
|
||||||
|
.head_tit {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
// color: white;
|
||||||
|
// margin-bottom: 20rpx;
|
||||||
|
|
||||||
|
.head_tit_l {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.head_tit_r {
|
||||||
|
// display: flex;
|
||||||
|
// align-items: center;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.head_serch {
|
||||||
|
margin: 20rpx 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.foodType {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-around;
|
||||||
|
background-color: #fff;
|
||||||
|
padding: 21rpx 38rpx;
|
||||||
|
border-radius: 21.03rpx 21.03rpx 21.03rpx 21.03rpx;
|
||||||
|
|
||||||
|
.foodLi {}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.head_content {
|
||||||
|
.head_content_card {
|
||||||
|
background: linear-gradient(to bottom, #FCB9AD, #FFFBF9, #FFFFFF);
|
||||||
|
border-radius: 21.03rpx 21.03rpx 21.03rpx 21.03rpx;
|
||||||
|
overflow: hidden;
|
||||||
|
padding: 20rpx 10rpx;
|
||||||
|
|
||||||
|
.goods_card {
|
||||||
|
margin-right: 20rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.goods_tit {
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
display: -webkit-box;
|
||||||
|
-webkit-line-clamp: 2;
|
||||||
|
-webkit-box-orient: vertical;
|
||||||
|
}
|
||||||
|
|
||||||
|
.goods_price {
|
||||||
|
color: #F84221;
|
||||||
|
font-size: 29.79rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.hot_serch {
|
||||||
|
margin: 20rpx;
|
||||||
|
|
||||||
|
.hot_serch_li {
|
||||||
|
background-color: white;
|
||||||
|
padding: 8rpx 22rpx;
|
||||||
|
border-radius: 10.51rpx 10.51rpx 10.51rpx 10.51rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.store {
|
||||||
|
|
||||||
|
.goods_list {
|
||||||
|
margin-top: 20rpx;
|
||||||
|
|
||||||
|
.goods_cards {
|
||||||
|
margin-top: 20rpx;
|
||||||
|
height: auto;
|
||||||
|
background-color: white;
|
||||||
|
padding: 20rpx;
|
||||||
|
border-radius: 20rpx;
|
||||||
|
display: flex;
|
||||||
|
// align-items: center;
|
||||||
|
|
||||||
|
.left {
|
||||||
|
margin-right: 20rpx;
|
||||||
|
width: 158rpx;
|
||||||
|
height: 158rpx;
|
||||||
|
// background-color: red;
|
||||||
|
border-radius: 20rpx;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.right {
|
||||||
|
// box-sizing: border-box;
|
||||||
|
width: 75vw;
|
||||||
|
overflow: hidden;
|
||||||
|
// background-color: red;
|
||||||
|
|
||||||
|
.heads {
|
||||||
|
font-weight: bold;
|
||||||
|
|
||||||
|
.flag {
|
||||||
|
background: linear-gradient(to bottom, #F84221, #FF6D20);
|
||||||
|
width: 66.59rpx;
|
||||||
|
height: 36.8rpx;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 22.78rpx;
|
||||||
|
color: white;
|
||||||
|
border-radius: 10.51rpx 10.51rpx 10.51rpx 10.51rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.goods_card_a {
|
||||||
|
margin-right: 20rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.goods_price_a {
|
||||||
|
color: #F84221;
|
||||||
|
}
|
||||||
|
|
||||||
|
.goods_tit_a {
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
display: -webkit-box;
|
||||||
|
-webkit-line-clamp: 1;
|
||||||
|
-webkit-box-orient: vertical;
|
||||||
|
}
|
||||||
|
|
||||||
|
.li {
|
||||||
|
display: flex;
|
||||||
|
font-size: 26.29rpx;
|
||||||
|
margin-bottom: 10rpx;
|
||||||
|
|
||||||
|
align-items: center;
|
||||||
|
color: #737373;
|
||||||
|
|
||||||
|
text {
|
||||||
|
margin: 0 10rpx 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.package {
|
||||||
|
margin-top: 30rpx;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.hui {
|
||||||
|
border-radius: 10.51rpx 10.51rpx 10.51rpx 10.51rpx;
|
||||||
|
background-color: #FEEBE7;
|
||||||
|
color: #F84221;
|
||||||
|
font-size: 22.78rpx;
|
||||||
|
// padding: 5rpx;
|
||||||
|
width: 36rpx;
|
||||||
|
height: 35rpx;
|
||||||
|
text-align: center;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.price {
|
||||||
|
color: #F84221;
|
||||||
|
font-size: 36.8rpx;
|
||||||
|
font-weight: bold;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sale {
|
||||||
|
width: 77.1rpx;
|
||||||
|
height: 44rpx;
|
||||||
|
background-color: white;
|
||||||
|
color: #F84221;
|
||||||
|
border: 1px solid #F84221;
|
||||||
|
border-radius: 10.51rpx 10.51rpx 10.51rpx 10.51rpx;
|
||||||
|
font-size: 22.78rpx;
|
||||||
|
text-align: center;
|
||||||
|
line-height: 40rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.address {
|
||||||
|
white-space: nowrap;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
width: 200px;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.img_cls {
|
||||||
|
position: absolute;
|
||||||
|
top: 50%;
|
||||||
|
right: 7rpx;
|
||||||
|
transform: translateY(-50%);
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.display_around {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-around;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
737
pages/nongKe/gather/select_warehouse.vue
Normal file
737
pages/nongKe/gather/select_warehouse.vue
Normal file
@ -0,0 +1,737 @@
|
|||||||
|
<template>
|
||||||
|
<view class="select_warehouse">
|
||||||
|
<view class="wrapper flex_a_c_j_sb">
|
||||||
|
<block v-for="item in goodsData" :key="item.name">
|
||||||
|
<view class="select_item" @click="navigato(item.type)"
|
||||||
|
:style="{'background-image': `url(${item.src})`}">
|
||||||
|
<view class="title">{{ item.name }}</view>
|
||||||
|
<view class="iconfont icon-jiantou"></view>
|
||||||
|
</view>
|
||||||
|
</block>
|
||||||
|
</view>
|
||||||
|
<view class="list-box listA" :class="goods.length > 0 ? 'fadeIn on' : ''">
|
||||||
|
<view class="item" v-for="(item, index) in goods" :key="index">
|
||||||
|
<view class="pictrue">
|
||||||
|
<easy-loadimage mode="widthFix" :image-src="item.image"></easy-loadimage>
|
||||||
|
</view>
|
||||||
|
<view class="text-info">
|
||||||
|
<view class="title">{{ item.store_name }}</view>
|
||||||
|
<view class="price">¥<text>{{ item.price }}</text></view>
|
||||||
|
<view class="add-btn" @click="addGoods(item)">加入仓库</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<u-popup :show="editGoodsShow" @close="editGoodsClose" :round="18" mode="center">
|
||||||
|
<view class="edit_goods_box">
|
||||||
|
<view class="edit_name flex_a_c edit_name_no">
|
||||||
|
<text>商品编号：</text><input type="text" disabled placeholder="请输入商品名称" v-model="editGoodsCode">
|
||||||
|
</view>
|
||||||
|
<view class="edit_name flex_a_c edit_name_no">
|
||||||
|
<text>商品名称：</text> <input type="text" disabled placeholder="请输入商品名称" v-model="editGoodsName">
|
||||||
|
</view>
|
||||||
|
<view class="edit_name flex_a_c">
|
||||||
|
编辑商品价格：<input type="text" placeholder="请输入商品名称" v-model="editGoodsPrice">
|
||||||
|
</view>
|
||||||
|
<view class="edit_store flex_a_c">
|
||||||
|
编辑商品库存：<input type="text" placeholder="请输入库存" v-model="editGoodsStore">
|
||||||
|
</view>
|
||||||
|
<view class="edit_goods_btn">
|
||||||
|
<u-button type="error" text="取消" class="edit_btn" @click="editGoodsShow=false">
|
||||||
|
</u-button>
|
||||||
|
<u-button type="primary" text="保存" class="edit_btn" @click="editGoodsClose">
|
||||||
|
</u-button>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</u-popup>
|
||||||
|
<u-modal :show="addGoodsShow" content='是否添加到你的仓库中?' @cancel="addGoodsclose()" @close="addGoodsclose()"
|
||||||
|
@confirm="addGoodsopen()" :closeOnClickOverlay="true" :showCancelButton="true"></u-modal>
|
||||||
|
<u-popup :show="searchGoodsShow" @close="searchGoodsClose" :round="18" mode="center">
|
||||||
|
<view class="search_goods_box">
|
||||||
|
<input type="text" v-model="searchGoodsName" class="searchGoods" placeholder="请输入商品名称">
|
||||||
|
<view class="search_goods_btn">
|
||||||
|
<view class="cancel edit_btn" @click="searchGoodsShow=false">取消</view>
|
||||||
|
<view class="search edit_btn" @click="searchGoodsClose">搜索</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</u-popup>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import {
|
||||||
|
productCreate
|
||||||
|
} from '@/api/product.js'
|
||||||
|
import {
|
||||||
|
microSeachBarCode,
|
||||||
|
microEadtProduct
|
||||||
|
} from '@/api/store.js'
|
||||||
|
import {
|
||||||
|
seachBarCodeAPI,
|
||||||
|
post_product_import
|
||||||
|
} from '@/api/api.js'
|
||||||
|
import {
|
||||||
|
Toast
|
||||||
|
} from '@/libs/uniApi'
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
goodsData: [{
|
||||||
|
name: '',
|
||||||
|
type: 1,
|
||||||
|
src: 'https://lihai001.oss-cn-chengdu.aliyuncs.com/public/kk/luzhou/static4/mingcheng.png'
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '扫码入库',
|
||||||
|
type: 2,
|
||||||
|
src: 'https://lihai001.oss-cn-chengdu.aliyuncs.com/public/kk/luzhou/static4/saoma.png'
|
||||||
|
}
|
||||||
|
],
|
||||||
|
product_id: '',
|
||||||
|
editGoodsCode: '',
|
||||||
|
editGoodsName: '',
|
||||||
|
editGoodsPrice: '',
|
||||||
|
editGoodsStore: '',
|
||||||
|
editGoodsShow: false, // 扫码修改商品信息
|
||||||
|
mer_id: 0,
|
||||||
|
searchGoodsShow: false,
|
||||||
|
searchGoodsName: '',
|
||||||
|
goods: [],
|
||||||
|
item: [],
|
||||||
|
addGoodsShow: false,
|
||||||
|
stype: '',
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onLoad(e) {
|
||||||
|
this.mer_id = e.mer_id
|
||||||
|
this.stype = e.stype
|
||||||
|
if (this.stype == 1) {
|
||||||
|
return this.goodsData[0].name = '商品添加'
|
||||||
|
}
|
||||||
|
if (this.stype == 2) {
|
||||||
|
return this.goodsData[0].name = '商品名称添加'
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onShow() {
|
||||||
|
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
addGoods(item) {
|
||||||
|
this.addGoodsShow = true
|
||||||
|
this.item = item
|
||||||
|
},
|
||||||
|
addGoodsopen() {
|
||||||
|
if (this.item) {
|
||||||
|
post_product_import(this.item.product_id).then(e => {
|
||||||
|
if (e.status == 200) {
|
||||||
|
Toast(e.data.msg)
|
||||||
|
this.addGoodsShow = false
|
||||||
|
} else {
|
||||||
|
// console.log(e);
|
||||||
|
Toast(e.message)
|
||||||
|
this.addGoodsShow = false
|
||||||
|
}
|
||||||
|
}).catch(err => {
|
||||||
|
// console.log(err);
|
||||||
|
if (err == "已经导入过该商品了") {
|
||||||
|
Toast('已经导入过该商品了')
|
||||||
|
this.addGoodsShow = false
|
||||||
|
} else {
|
||||||
|
Toast('导入出错')
|
||||||
|
this.addGoodsShow = false
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
this.item = []
|
||||||
|
},
|
||||||
|
addGoodsclose() {
|
||||||
|
this.addGoodsShow = false
|
||||||
|
},
|
||||||
|
openSearch() {},
|
||||||
|
async searchGoodsClose() {
|
||||||
|
const rq = {
|
||||||
|
mer_id: this.mer_id,
|
||||||
|
name: this.searchGoodsName
|
||||||
|
}
|
||||||
|
const {
|
||||||
|
data
|
||||||
|
} = await seachBarCodeAPI(rq).catch(err => Toast(err))
|
||||||
|
if (data.list.length < 1) {
|
||||||
|
this.searchGoodsShow = false
|
||||||
|
Toast("暂无搜索商品,请添加！")
|
||||||
|
setTimeout(() => {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: `/pages/product/addGoods/index?mer_id=${rq.mer_id}`
|
||||||
|
})
|
||||||
|
}, 2000)
|
||||||
|
return
|
||||||
|
}
|
||||||
|
this.goods = data.list
|
||||||
|
this.searchGoodsShow = false
|
||||||
|
},
|
||||||
|
async editGoodsClose() {
|
||||||
|
const data = {
|
||||||
|
price: this.editGoodsPrice,
|
||||||
|
stock: this.editGoodsStore,
|
||||||
|
id: this.product_id
|
||||||
|
}
|
||||||
|
try {
|
||||||
|
const res = await microEadtProduct(data)
|
||||||
|
Toast("更新成功")
|
||||||
|
this.editGoodsShow = false
|
||||||
|
} catch (e) {
|
||||||
|
Toast("更新失败")
|
||||||
|
this.editGoodsShow = false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
navigato(type) {
|
||||||
|
if (type === 1) {
|
||||||
|
if (this.stype == 1) {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: `/pages/product/addGoods/index?mer_id=${this.mer_id}`
|
||||||
|
});
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
this.searchGoodsShow = true
|
||||||
|
} else {
|
||||||
|
this.scanCode();
|
||||||
|
}
|
||||||
|
},
|
||||||
|
scanCode() {
|
||||||
|
const self = this
|
||||||
|
uni.scanCode({
|
||||||
|
scanType: ["qrCode", "barCode", "datamatrix", "pdf417"],
|
||||||
|
success(res) {
|
||||||
|
if (self.stype == 1) {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: `/pages/product/addGoods/index?mer_id=${self.mer_id}&code=${res.result}`
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
self.seachBarCode(res.result)
|
||||||
|
}
|
||||||
|
|
||||||
|
},
|
||||||
|
fail(res) {
|
||||||
|
// console.log(res);
|
||||||
|
},
|
||||||
|
})
|
||||||
|
},
|
||||||
|
async seachBarCode(code) {
|
||||||
|
await seachBarCodeAPI({
|
||||||
|
code: code,
|
||||||
|
mer_id: this.mer_id
|
||||||
|
}).then(res => {
|
||||||
|
if (!res.data) {
|
||||||
|
uni.showToast({
|
||||||
|
title: res.message,
|
||||||
|
duration: 3000,
|
||||||
|
icon: 'none',
|
||||||
|
});
|
||||||
|
} else {
|
||||||
|
if (res.data.list.length < 1) {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: `/pages/product/addGoods/index?mer_id=${this.mer_id}&code=${code}`
|
||||||
|
})
|
||||||
|
return
|
||||||
|
}
|
||||||
|
this.goods = res.data.list
|
||||||
|
}
|
||||||
|
})
|
||||||
|
|
||||||
|
|
||||||
|
},
|
||||||
|
},
|
||||||
|
onPullDownRefresh() {
|
||||||
|
uni.stopPullDownRefresh()
|
||||||
|
},
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
.select_warehouse {
|
||||||
|
padding-top: 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.wrapper {
|
||||||
|
width: 694.74rpx;
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.goods-wrapper {
|
||||||
|
.item {
|
||||||
|
display: flex;
|
||||||
|
height: 175.44rpx;
|
||||||
|
width: 100%;
|
||||||
|
background-color: #fff;
|
||||||
|
margin-top: 21.05rpx;
|
||||||
|
border-radius: 8px;
|
||||||
|
padding: 12px;
|
||||||
|
|
||||||
|
.l_cont {
|
||||||
|
image {
|
||||||
|
width: 133.33rpx;
|
||||||
|
height: 133.33rpx;
|
||||||
|
border-radius: 8px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.r_cont {
|
||||||
|
margin-left: 17.54rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.select_item {
|
||||||
|
width: 336.84rpx;
|
||||||
|
height: 189.47rpx;
|
||||||
|
border-radius: 8px;
|
||||||
|
background-color: #eee;
|
||||||
|
padding: 35.09rpx 28.07rpx;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: space-between;
|
||||||
|
color: #fff;
|
||||||
|
background-size: cover;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
|
||||||
|
.title {
|
||||||
|
font-size: 35.09rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.search_goods_box {
|
||||||
|
width: 694.74rpx;
|
||||||
|
padding: 28.07rpx;
|
||||||
|
font-size: 31.58rpx;
|
||||||
|
|
||||||
|
.searchGoods {
|
||||||
|
height: 87.72rpx;
|
||||||
|
border: 1px solid #f5f5f5;
|
||||||
|
border-radius: 8px;
|
||||||
|
padding: 12px;
|
||||||
|
margin: 21.05rpx 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.search_goods_btn {
|
||||||
|
margin-top: 28.07rpx;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
|
||||||
|
.edit_btn {
|
||||||
|
color: #fff;
|
||||||
|
border-radius: 8px;
|
||||||
|
text-align: center;
|
||||||
|
line-height: 70.18rpx;
|
||||||
|
height: 70.18rpx;
|
||||||
|
width: 210.53rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cancel {
|
||||||
|
background-color: $u-error;
|
||||||
|
}
|
||||||
|
|
||||||
|
.search {
|
||||||
|
background-color: $u-primary;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 扫码编辑商品
|
||||||
|
.edit_goods_box {
|
||||||
|
width: 694.74rpx;
|
||||||
|
padding: 28.07rpx;
|
||||||
|
font-size: 31.58rpx;
|
||||||
|
|
||||||
|
text {
|
||||||
|
color: '#f8f9f9';
|
||||||
|
}
|
||||||
|
|
||||||
|
.edit_name,
|
||||||
|
.edit_store {
|
||||||
|
height: 105.26rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.edit_name_no {
|
||||||
|
color: #a4a4a4;
|
||||||
|
}
|
||||||
|
|
||||||
|
.edit_store {
|
||||||
|
// border-top: 1px solid #a4a4a4;
|
||||||
|
margin-top: 21.05rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
/deep/.u-button {
|
||||||
|
width: 300rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.edit_goods_btn {
|
||||||
|
margin-top: 28.07rpx;
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
|
||||||
|
.edit_btn {
|
||||||
|
width: 210.53rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.list-box {
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
justify-content: space-between;
|
||||||
|
padding: 20rpx 28rpx 0;
|
||||||
|
|
||||||
|
.item {
|
||||||
|
width: 328rpx;
|
||||||
|
margin-bottom: 20rpx;
|
||||||
|
overflow: hidden;
|
||||||
|
position: relative;
|
||||||
|
border-radius: 8px;
|
||||||
|
background-color: #fff;
|
||||||
|
|
||||||
|
&.on {
|
||||||
|
border-radius: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pictrue_log {
|
||||||
|
width: 92rpx;
|
||||||
|
height: 44rpx;
|
||||||
|
font-size: 26rpx;
|
||||||
|
line-height: 44rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pictrue,
|
||||||
|
/deep/image,
|
||||||
|
/deep/.easy-loadimage,
|
||||||
|
/deep/uni-image {
|
||||||
|
width: 100%;
|
||||||
|
display: block;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
.border-picture {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
background: center/cover no-repeat;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.picture1,
|
||||||
|
/deep/.picture1 image,
|
||||||
|
/deep/.picture1 .easy-loadimage,
|
||||||
|
/deep/.picture1 uni-image {
|
||||||
|
height: 346rpx;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
.border-picture {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
background: center/cover no-repeat;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sell_out {
|
||||||
|
display: flex;
|
||||||
|
width: 150rpx;
|
||||||
|
height: 150rpx;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
border-radius: 100%;
|
||||||
|
background: rgba(0, 0, 0, .6);
|
||||||
|
color: #fff;
|
||||||
|
font-size: 30rpx;
|
||||||
|
position: absolute;
|
||||||
|
top: 50%;
|
||||||
|
left: 50%;
|
||||||
|
margin: -75rpx 0 0 -75rpx;
|
||||||
|
|
||||||
|
&::before {
|
||||||
|
content: "";
|
||||||
|
display: block;
|
||||||
|
width: 140rpx;
|
||||||
|
height: 140rpx;
|
||||||
|
border-radius: 100%;
|
||||||
|
border: 1px dashed #fff;
|
||||||
|
position: absolute;
|
||||||
|
top: 5rpx;
|
||||||
|
left: 5rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.cont1,
|
||||||
|
/deep/.cont1 image,
|
||||||
|
/deep/.cont1 .easy-loadimage,
|
||||||
|
/deep/.cont1 uni-image,
|
||||||
|
.cont1 .border-picture {
|
||||||
|
border-radius: 16rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-info {
|
||||||
|
padding: 10rpx 20rpx 15rpx;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
|
||||||
|
.add-btn {
|
||||||
|
align-self: flex-end;
|
||||||
|
text-align: center;
|
||||||
|
width: 175.44rpx;
|
||||||
|
color: #fff;
|
||||||
|
margin-top: auto;
|
||||||
|
padding: 7.02rpx 21.05rpx;
|
||||||
|
border-radius: 100px;
|
||||||
|
background: $uni-theme-bg-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
.title {
|
||||||
|
font-size: 31.58rpx;
|
||||||
|
margin-bottom: 10.53rpx;
|
||||||
|
color: #222222;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
display: -webkit-box;
|
||||||
|
-webkit-line-clamp: 2;
|
||||||
|
-webkit-box-orient: vertical;
|
||||||
|
}
|
||||||
|
|
||||||
|
.old-price {
|
||||||
|
margin-top: 4rpx;
|
||||||
|
font-size: 26rpx;
|
||||||
|
color: #999;
|
||||||
|
text-decoration: line-through;
|
||||||
|
|
||||||
|
text {
|
||||||
|
margin-right: 2px;
|
||||||
|
font-size: 20rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.price {
|
||||||
|
display: flex;
|
||||||
|
margin-top: 20rpx;
|
||||||
|
font-size: 26rpx;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
text {
|
||||||
|
font-size: 36rpx;
|
||||||
|
font-weight: 550;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ot-price {
|
||||||
|
color: #aaa;
|
||||||
|
font-size: 26rpx;
|
||||||
|
text-decoration: line-through;
|
||||||
|
margin-left: 6rpx;
|
||||||
|
font-weight: normal;
|
||||||
|
margin-top: 10rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.pictrue {
|
||||||
|
position: relative;
|
||||||
|
}
|
||||||
|
|
||||||
|
.border-picture {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
border-radius: 8rpx;
|
||||||
|
background: center/cover no-repeat;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.merchant_info {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
margin-top: 20rpx;
|
||||||
|
|
||||||
|
.merchant_type {
|
||||||
|
color: #fff;
|
||||||
|
line-height: 30rpx;
|
||||||
|
padding: 0 10rpx;
|
||||||
|
border-radius: 2rpx;
|
||||||
|
font-size: 22rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.txt {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
width: 56rpx;
|
||||||
|
height: 28rpx;
|
||||||
|
margin-left: 15rpx;
|
||||||
|
border: 1px solid $theme-color;
|
||||||
|
border-radius: 4rpx;
|
||||||
|
font-size: 20rpx;
|
||||||
|
font-weight: normal;
|
||||||
|
|
||||||
|
&.delivery {
|
||||||
|
margin-left: 0;
|
||||||
|
color: #FF9000;
|
||||||
|
border-color: #FF9000;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.on {
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
|
||||||
|
&.listA {
|
||||||
|
.item {
|
||||||
|
display: flex;
|
||||||
|
width: 100%;
|
||||||
|
|
||||||
|
.pictrue,
|
||||||
|
/deep/image,
|
||||||
|
/deep/.easy-loadimage,
|
||||||
|
/deep/uni-image {
|
||||||
|
width: 220rpx;
|
||||||
|
height: 220rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sell_out {
|
||||||
|
display: flex;
|
||||||
|
width: 110rpx;
|
||||||
|
height: 110rpx;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
border-radius: 100%;
|
||||||
|
background: rgba(0, 0, 0, .6);
|
||||||
|
color: #fff;
|
||||||
|
font-size: 24rpx;
|
||||||
|
position: absolute;
|
||||||
|
top: 50%;
|
||||||
|
left: 50%;
|
||||||
|
margin: -55rpx 0 0 -55rpx;
|
||||||
|
|
||||||
|
&::before {
|
||||||
|
content: "";
|
||||||
|
display: block;
|
||||||
|
width: 100rpx;
|
||||||
|
height: 100rpx;
|
||||||
|
border-radius: 100%;
|
||||||
|
border: 1px dashed #fff;
|
||||||
|
position: absolute;
|
||||||
|
top: 5rpx;
|
||||||
|
left: 5rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-info {
|
||||||
|
width: 490rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.listB {
|
||||||
|
justify-content: inherit;
|
||||||
|
|
||||||
|
.item {
|
||||||
|
width: 31.3%;
|
||||||
|
margin-right: 3.05%;
|
||||||
|
|
||||||
|
.pictrue,
|
||||||
|
/deep/image,
|
||||||
|
/deep/.easy-loadimage,
|
||||||
|
/deep/uni-image {
|
||||||
|
height: 220rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.sell_out {
|
||||||
|
display: flex;
|
||||||
|
width: 110rpx;
|
||||||
|
height: 110rpx;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
border-radius: 100%;
|
||||||
|
background: rgba(0, 0, 0, .6);
|
||||||
|
color: #fff;
|
||||||
|
font-size: 24rpx;
|
||||||
|
position: absolute;
|
||||||
|
top: 50%;
|
||||||
|
left: 50%;
|
||||||
|
margin: -55rpx 0 0 -55rpx;
|
||||||
|
|
||||||
|
&::before {
|
||||||
|
content: "";
|
||||||
|
display: block;
|
||||||
|
width: 100rpx;
|
||||||
|
height: 100rpx;
|
||||||
|
border-radius: 100%;
|
||||||
|
border: 1px dashed #fff;
|
||||||
|
position: absolute;
|
||||||
|
top: 5rpx;
|
||||||
|
left: 5rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&:nth-child(3n) {
|
||||||
|
margin-right: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.price {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
font-size: 20rpx;
|
||||||
|
|
||||||
|
text {
|
||||||
|
font-size: 28rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.text-info {
|
||||||
|
padding: 10rpx 4rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.listC {
|
||||||
|
.item {
|
||||||
|
width: 100%;
|
||||||
|
|
||||||
|
.pictrue,
|
||||||
|
/deep/image,
|
||||||
|
/deep/.easy-loadimage,
|
||||||
|
/deep/uni-image {
|
||||||
|
height: 320rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.price {
|
||||||
|
margin-top: 20rpx;
|
||||||
|
font-size: 40rpx;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.old-price {
|
||||||
|
font-weight: normal;
|
||||||
|
font-size: 22rpx;
|
||||||
|
margin-left: 10rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
&.listS {
|
||||||
|
.price {
|
||||||
|
font-size: 40rpx;
|
||||||
|
display: flex;
|
||||||
|
align-items: baseline;
|
||||||
|
|
||||||
|
.old-price {
|
||||||
|
font-weight: normal;
|
||||||
|
font-size: 22rpx;
|
||||||
|
margin-left: 10rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
1023
pages/nongKe/goods_list/index.vue
Normal file
1023
pages/nongKe/goods_list/index.vue
Normal file
File diff suppressed because it is too large
Load Diff
1311
pages/nongKe/specialty/index.vue
Normal file
1311
pages/nongKe/specialty/index.vue
Normal file
File diff suppressed because it is too large
Load Diff
324
pages/nongKe/specialty/indexa.vue
Normal file
324
pages/nongKe/specialty/indexa.vue
Normal file
@ -0,0 +1,324 @@
|
|||||||
|
<template>
|
||||||
|
<view class="box">
|
||||||
|
<view class="head">
|
||||||
|
<view style="height: var(--status-bar-height);"></view>
|
||||||
|
<!-- <u--image style="position: absolute;" :showLoading="true" src="/static/images/MYTC/BG.png" width="750rpx"
|
||||||
|
height="748.25rpx" @click="click"></u--image> -->
|
||||||
|
<view class="head_tit">
|
||||||
|
<view class="head_tit_l">
|
||||||
|
<view class="iconfont icon-xiangzuo"></view>
|
||||||
|
<view
|
||||||
|
style="font-size: 40rpx;font-weight: 700;margin-left: 30rpx; transform: skewX(-10deg);color:white;">
|
||||||
|
名优特产
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="head_tit_r" style="font-size: 29.79rpx;">
|
||||||
|
江阳区 <text style="margin-left: 10rpx;" class="iconfont icon-xiangxia"></text>
|
||||||
|
<view class="" style="font-size: 22.78rpx;">
|
||||||
|
晴天30℃
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="head_serch">
|
||||||
|
<view style="position: relative;">
|
||||||
|
<!-- <u-search borderColor="#FF6D20" bgColor="white" :showAction="false" placeholder="搜索店铺名称"
|
||||||
|
v-model="keyword" class="serch_cls"></u-search> -->
|
||||||
|
<!-- <u--image class="img_cls" style="position: absolute; top: 3px;right: 3px;" :showLoading="true"
|
||||||
|
src="/static/images/MYTC/SS.png" width="115.65rpx" height="56.82rpx"></u--image> -->
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="head_content">
|
||||||
|
<view style="font-size: 40rpx;font-weight: 700;color:white; margin-bottom: 10rpx;">
|
||||||
|
精选特产
|
||||||
|
</view>
|
||||||
|
<view class="head_content_card">
|
||||||
|
|
||||||
|
<u-scroll-list>
|
||||||
|
<view v-for="(item, index) in list" :key="index" class="goods_card">
|
||||||
|
<u--image :showLoading="true" src="https://cdn.uviewui.com/uview/album/1.jpg"
|
||||||
|
width="210.28rpx" height="210.28rpx"></u--image>
|
||||||
|
<view class="goods_tit">
|
||||||
|
笑口常开地方就是的开发建设的开发建设的,v空间和客户可怜见立刻就
|
||||||
|
</view>
|
||||||
|
<view class="goods_price">
|
||||||
|
￥ 10.00
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- <image :src="item.thumb"></image> -->
|
||||||
|
</view>
|
||||||
|
</u-scroll-list>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="store" style="background-color: white;">
|
||||||
|
<view class="goods_list">
|
||||||
|
<view class="goods_cards" @click="goStore(item.mer_id)" v-for="(item,index) in storeList" :key="index">
|
||||||
|
<view class="left">
|
||||||
|
<u--image :showLoading="true" :src="item.mer_avatar" width="157.71rpx"
|
||||||
|
height="157.71rpx"></u--image>
|
||||||
|
</view>
|
||||||
|
<view class="right">
|
||||||
|
<view class="li heads" style="display: flex;">
|
||||||
|
<text class="flag">特产</text>
|
||||||
|
<text class="com_name">{{item.mer_name}}</text>
|
||||||
|
<text
|
||||||
|
style="font-weight: normal; font-size: 10rpx;color: #737373;padding:0 10rpx; border-radius: 10rpx; border: 1px solid #737373;">{{item.type_name}}</text>
|
||||||
|
</view>
|
||||||
|
<view class="li">
|
||||||
|
<u--image v-for="item,index in [1,1,,1,1,1]" :key="index" :showLoading="true"
|
||||||
|
src="/static/images/GXSC/PF.png" width="20.85rpx" height="19.85rpx"></u--image>
|
||||||
|
<text style="margin-left: 10rpx;color: #FF6D20; ">5.0</text>
|
||||||
|
<text>月销2000+</text>
|
||||||
|
<text>20分钟</text>
|
||||||
|
<text>1.1km</text>
|
||||||
|
</view>
|
||||||
|
<view class="li" style="align-items: center;">
|
||||||
|
<u--image :showLoading="true" src="/static/images/GXSC/DH.png" width="33.85rpx"
|
||||||
|
height="33.85rpx"></u--image>
|
||||||
|
<text> {{item.service_phone}}</text>
|
||||||
|
</view>
|
||||||
|
<view class="li" style="align-items: center;">
|
||||||
|
<u--image :showLoading="true" src="/static/images/GXSC/SJ.png" width="33.85rpx"
|
||||||
|
height="33.85rpx"></u--image>
|
||||||
|
<text>{{item.mer_take_time[0]}}-{{item.mer_take_time[1]}}</text>
|
||||||
|
</view>
|
||||||
|
<view class="li" style="align-items: center;">
|
||||||
|
<u--image :showLoading="true" src="/static/images/GXSC/DW.png" width="33.85rpx"
|
||||||
|
height="33.85rpx"></u--image>
|
||||||
|
<text class="address">{{item.mer_address}}</text>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="">
|
||||||
|
<u-scroll-list>
|
||||||
|
<view v-for="(item, index) in list" :key="index" style="margin-right: 20rpx;">
|
||||||
|
<u--image :showLoading="true" src="https://cdn.uviewui.com/uview/album/1.jpg"
|
||||||
|
width="164.72rpx" height="164.72rpx"></u--image>
|
||||||
|
<view class="goods_tit_a">
|
||||||
|
笑口常开地方就是的开发建设的开发建设的,v空间和客户可怜见立刻就
|
||||||
|
</view>
|
||||||
|
<view style="color: red;">
|
||||||
|
$10.00
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- <image :src="item.thumb"></image> -->
|
||||||
|
</view>
|
||||||
|
<!-- <view v-for="(item, index) in list" :key="index">
|
||||||
|
<image :src="item.thumb"></image>
|
||||||
|
</view> -->
|
||||||
|
</u-scroll-list>
|
||||||
|
</view>
|
||||||
|
<!-- <view class="">
|
||||||
|
<u-scroll-list>
|
||||||
|
<view v-for="(item, index) in list" :key="index" class="goods_card_a">
|
||||||
|
<u--image :showLoading="true" src="https://cdn.uviewui.com/uview/album/1.jpg"
|
||||||
|
width="164.72rpx" height="164.72rpx" @click="click"></u--image>
|
||||||
|
<view class="goods_tit_a">
|
||||||
|
笑口常开地方就是的开发建设的开发建设的,v空间和客户可怜见立刻就
|
||||||
|
</view>
|
||||||
|
<view class="goods_price">
|
||||||
|
$10.00
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</u-scroll-list>
|
||||||
|
</view>
|
||||||
|
-->
|
||||||
|
|
||||||
|
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import {
|
||||||
|
storeMerchantList,
|
||||||
|
} from '@/api/store.js';
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
keyword: "",
|
||||||
|
list: [1, 1, 1, 11, 1, 11, 11],
|
||||||
|
storeList: [1, 1, 1, 1, 1, 1, 1, 1, 1]
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onLaunch() {
|
||||||
|
console.log(46545)
|
||||||
|
// storeMerchantList().then(res => {
|
||||||
|
// // this.count = res.data.count
|
||||||
|
// // this.storeList = this.storeList.concat(res.data.list)
|
||||||
|
// // this.loading = false
|
||||||
|
// // this.loadingIcon = false
|
||||||
|
// console.log(res)
|
||||||
|
// })
|
||||||
|
|
||||||
|
},
|
||||||
|
onShow() {
|
||||||
|
// console.log(46545)
|
||||||
|
storeMerchantList().then(res => {
|
||||||
|
// this.count = res.data.count
|
||||||
|
this.storeList = res.data.list
|
||||||
|
// this.loading = false
|
||||||
|
// this.loadingIcon = false
|
||||||
|
// console.log(res)
|
||||||
|
})
|
||||||
|
},
|
||||||
|
methods: {},
|
||||||
|
onPullDownRefresh() {
|
||||||
|
uni.stopPullDownRefresh()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.head {
|
||||||
|
// background-color: #F94621;
|
||||||
|
background: url('/static/images/MYTC/BG.png') no-repeat;
|
||||||
|
padding: 20rpx;
|
||||||
|
border-radius: 0rpx 0rpx 31.54rpx 31.54rpx;
|
||||||
|
|
||||||
|
.head_tit {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
color: white;
|
||||||
|
// margin-bottom: 20rpx;
|
||||||
|
|
||||||
|
.head_tit_l {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.head_tit_r {
|
||||||
|
// display: flex;
|
||||||
|
// align-items: center;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.head_serch {
|
||||||
|
margin: 20rpx 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.head_content {
|
||||||
|
.head_content_card {
|
||||||
|
background: linear-gradient(to bottom, #FCB9AD, #FFFBF9, #FFFFFF);
|
||||||
|
border-radius: 21.03rpx 21.03rpx 21.03rpx 21.03rpx;
|
||||||
|
overflow: hidden;
|
||||||
|
padding: 20rpx 10rpx;
|
||||||
|
|
||||||
|
.goods_card {
|
||||||
|
margin-right: 20rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.goods_tit {
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
display: -webkit-box;
|
||||||
|
-webkit-line-clamp: 2;
|
||||||
|
-webkit-box-orient: vertical;
|
||||||
|
}
|
||||||
|
|
||||||
|
.goods_price {
|
||||||
|
color: #F84221;
|
||||||
|
font-size: 29.79rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.store {
|
||||||
|
.goods_list {
|
||||||
|
margin-top: 20rpx;
|
||||||
|
|
||||||
|
.goods_cards {
|
||||||
|
margin-top: 20rpx;
|
||||||
|
height: auto;
|
||||||
|
background-color: white;
|
||||||
|
padding: 20rpx;
|
||||||
|
border-radius: 20rpx;
|
||||||
|
display: flex;
|
||||||
|
// align-items: center;
|
||||||
|
|
||||||
|
.left {
|
||||||
|
margin-right: 20rpx;
|
||||||
|
width: 158rpx;
|
||||||
|
height: 158rpx;
|
||||||
|
// background-color: red;
|
||||||
|
border-radius: 20rpx;
|
||||||
|
overflow: hidden;
|
||||||
|
}
|
||||||
|
|
||||||
|
.right {
|
||||||
|
// box-sizing: border-box;
|
||||||
|
width: 75vw;
|
||||||
|
overflow: hidden;
|
||||||
|
// background-color: red;
|
||||||
|
|
||||||
|
.heads {
|
||||||
|
font-weight: bold;
|
||||||
|
|
||||||
|
.flag {
|
||||||
|
background: linear-gradient(to bottom, #F84221, #FF6D20);
|
||||||
|
width: 66.59rpx;
|
||||||
|
height: 36.8rpx;
|
||||||
|
text-align: center;
|
||||||
|
font-size: 22.78rpx;
|
||||||
|
color: white;
|
||||||
|
border-radius: 10.51rpx 10.51rpx 10.51rpx 10.51rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.goods_card_a {
|
||||||
|
margin-right: 20rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.goods_price_a {
|
||||||
|
color: #F84221;
|
||||||
|
}
|
||||||
|
|
||||||
|
.goods_tit_a {
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
display: -webkit-box;
|
||||||
|
-webkit-line-clamp: 1;
|
||||||
|
-webkit-box-orient: vertical;
|
||||||
|
}
|
||||||
|
|
||||||
|
.li {
|
||||||
|
display: flex;
|
||||||
|
font-size: 26.29rpx;
|
||||||
|
margin-bottom: 10rpx;
|
||||||
|
|
||||||
|
align-items: center;
|
||||||
|
color: #737373;
|
||||||
|
|
||||||
|
text {
|
||||||
|
margin: 0 10rpx 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.address {
|
||||||
|
white-space: nowrap;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
width: 200px;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
</style>
|
||||||
BIN
pages/nongKe/static/images/grade_bg.png
Normal file
BIN
pages/nongKe/static/images/grade_bg.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 136 KiB |
BIN
pages/nongKe/static/images/level_avatar.png
Normal file
BIN
pages/nongKe/static/images/level_avatar.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 8.0 KiB |
BIN
pages/nongKe/static/images/member-font.png
Normal file
BIN
pages/nongKe/static/images/member-font.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 9.6 KiB |
BIN
pages/nongKe/static/images/member-wang.png
Normal file
BIN
pages/nongKe/static/images/member-wang.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4.0 KiB |
BIN
pages/nongKe/static/images/noEvaluate.png
Normal file
BIN
pages/nongKe/static/images/noEvaluate.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 9.6 KiB |
BIN
pages/nongKe/static/images/noInvoice.png
Normal file
BIN
pages/nongKe/static/images/noInvoice.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 7.5 KiB |
BIN
pages/nongKe/static/images/presell_orderBg.png
Normal file
BIN
pages/nongKe/static/images/presell_orderBg.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.6 KiB |
BIN
pages/nongKe/static/images/upgrade_icon.png
Normal file
BIN
pages/nongKe/static/images/upgrade_icon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.4 KiB |
139
pages/nongKe/supply_chain/component/goodsPopup.vue
Normal file
139
pages/nongKe/supply_chain/component/goodsPopup.vue
Normal file
@ -0,0 +1,139 @@
|
|||||||
|
<template>
|
||||||
|
<u-popup :show="goodsStatu" mode="bottom" :closeOnClickOverlay="false">
|
||||||
|
<view class="goodsPopup">
|
||||||
|
<view class="close" @click="colse">关闭</view>
|
||||||
|
<view class="container">
|
||||||
|
<!-- <image src="" /> -->
|
||||||
|
<view class="content">
|
||||||
|
<view class="image">
|
||||||
|
<image :src="info.image" />
|
||||||
|
</view>
|
||||||
|
<view class="content_info">
|
||||||
|
<view>{{ info.store_name }}</view>
|
||||||
|
<view>￥:{{ info.price * info.num }}</view>
|
||||||
|
<view>库存:{{ info.stock }}</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="goods_num">
|
||||||
|
<view>数量</view>
|
||||||
|
<view class="shop_num">
|
||||||
|
<view class="shop_box" @click="addor(-1)">-</view>
|
||||||
|
<view class="num">{{ info.num }}</view>
|
||||||
|
<view class="shop_box" @click="addor(+1)">+</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="shopgo" @click="handel">添加到购物车</view>
|
||||||
|
</view>
|
||||||
|
</u-popup>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
props: {
|
||||||
|
goodsStatu: {
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
|
},
|
||||||
|
//商品参数
|
||||||
|
goods_info: {
|
||||||
|
type: Object,
|
||||||
|
default: {}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
info:this.goods_info,
|
||||||
|
};
|
||||||
|
},
|
||||||
|
onLoad() {
|
||||||
|
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
addor(item, index) {
|
||||||
|
this.info.num += item;
|
||||||
|
if (this.info.num <= 0) {
|
||||||
|
this.info.num = 1;
|
||||||
|
}
|
||||||
|
},
|
||||||
|
// 返回修改过后的商品参数给父组件
|
||||||
|
handel() {
|
||||||
|
this.$emit("change",this.info);
|
||||||
|
},
|
||||||
|
colse(){
|
||||||
|
this.$emit("colses",true);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
};
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.goodsPopup {
|
||||||
|
display: flex;
|
||||||
|
position: relative;
|
||||||
|
height: 30vh;
|
||||||
|
.close {
|
||||||
|
position: absolute;
|
||||||
|
top: 10rpx;
|
||||||
|
right: 10rpx;
|
||||||
|
}
|
||||||
|
.container {
|
||||||
|
width: 100%;
|
||||||
|
.content {
|
||||||
|
width: 90%;
|
||||||
|
display: flex;
|
||||||
|
margin: auto;
|
||||||
|
.image {
|
||||||
|
width: 200rpx;
|
||||||
|
height: 200rpx;
|
||||||
|
border-radius: 20rpx;
|
||||||
|
> image {
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.content_info :nth-child(1) {
|
||||||
|
font-size: 36rpx;
|
||||||
|
}
|
||||||
|
.content_info :nth-child(2) {
|
||||||
|
font-size: 32rpx;
|
||||||
|
color: #fe9a10;
|
||||||
|
}
|
||||||
|
.content_info :nth-child(3) {
|
||||||
|
color: #666;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.goods_num {
|
||||||
|
display: flex;
|
||||||
|
justify-content: space-between;
|
||||||
|
width: 80%;
|
||||||
|
margin: auto;
|
||||||
|
.shop_num {
|
||||||
|
display: flex;
|
||||||
|
> view {
|
||||||
|
width: 80rpx;
|
||||||
|
height: 40rpx;
|
||||||
|
border: 1px solid;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
.num {
|
||||||
|
border-left: 0;
|
||||||
|
border-right: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.shopgo {
|
||||||
|
position: absolute;
|
||||||
|
bottom: 50rpx;
|
||||||
|
left: 50%;
|
||||||
|
transform: translate(-50%, 0);
|
||||||
|
width: 200rpx;
|
||||||
|
background: red;
|
||||||
|
line-height: 80rpx;
|
||||||
|
text-align: center;
|
||||||
|
border-radius: 40rpx;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
119
pages/nongKe/supply_chain/component/recommend.vue
Normal file
119
pages/nongKe/supply_chain/component/recommend.vue
Normal file
@ -0,0 +1,119 @@
|
|||||||
|
<template>
|
||||||
|
<view class='recommend'>
|
||||||
|
<view class="common-hd">
|
||||||
|
<view class="title">为你推荐</view>
|
||||||
|
</view>
|
||||||
|
<view class='recommendList' :class="indexP?'on':''">
|
||||||
|
<WaterfallsFlow :wfList='hostProduct' @itemTap="goDetail" :type="0" />
|
||||||
|
</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 {mapGetters} from "vuex";
|
||||||
|
import { goShopDetail } from '@/libs/order.js'
|
||||||
|
import {initiateAssistApi} from '@/api/activity.js';
|
||||||
|
import {toLogin} from '@/libs/login.js';
|
||||||
|
import WaterfallsFlow from '@/components/WaterfallsFlow/WaterfallsFlow.vue'
|
||||||
|
export default {
|
||||||
|
components:{WaterfallsFlow},
|
||||||
|
computed: mapGetters(['uid']),
|
||||||
|
props: {
|
||||||
|
hostProduct: {
|
||||||
|
type: Array,
|
||||||
|
default: function() {
|
||||||
|
return [];
|
||||||
|
}
|
||||||
|
},
|
||||||
|
indexP:{
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
|
},
|
||||||
|
isLogin:{
|
||||||
|
type: Boolean,
|
||||||
|
default: false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
};
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
|
||||||
|
},
|
||||||
|
onPullDownRefresh(){
|
||||||
|
// 模拟上拉刷新
|
||||||
|
setTimeout(()=>{
|
||||||
|
const newList = this.hostProduct.reverse();
|
||||||
|
this.hostProduct = newList;
|
||||||
|
uni.stopPullDownRefresh();
|
||||||
|
},500)
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
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 {
|
||||||
|
// #ifdef H5 || APP-PLUS
|
||||||
|
toLogin();
|
||||||
|
// #endif
|
||||||
|
// #ifdef MP
|
||||||
|
this.$emit('isShowAuth', true);
|
||||||
|
this.$emit('isAuto', true);
|
||||||
|
// #endif
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
.common-hd {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
height: 118rpx;
|
||||||
|
.title {
|
||||||
|
padding: 0 80rpx;
|
||||||
|
font-size: 34rpx;
|
||||||
|
color: $theme-color;
|
||||||
|
font-weight: bold;
|
||||||
|
background-image: url("~@/static/images/index-title.png");
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-size: 100% auto;
|
||||||
|
background-position: left center;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.recommend .recommendList {
|
||||||
|
padding: 0 20rpx;
|
||||||
|
min-height: 100rpx;
|
||||||
|
}
|
||||||
|
.recommend .recommendList.on{
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
/deep/.looming-gray{
|
||||||
|
border-radius: 16rpx 16rpx 0 0;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
278
pages/nongKe/supply_chain/component/rightSlider.vue
Normal file
278
pages/nongKe/supply_chain/component/rightSlider.vue
Normal file
@ -0,0 +1,278 @@
|
|||||||
|
|
||||||
|
<template>
|
||||||
|
<view class="right-wrapper" @touchmove.stop.prevent="moveStop" :style="viewColor">
|
||||||
|
<view class="control-wrapper animated" :class="showBox?'slideInRight':''">
|
||||||
|
<view class="content-box">
|
||||||
|
<view class="title">店铺类型</view>
|
||||||
|
<view class="brand-wrapper">
|
||||||
|
<scroll-view style="max-height: 400rpx;" :scroll-y="isShow">
|
||||||
|
<view class="wrapper">
|
||||||
|
<view class="item line1" v-for="(item,index) in list" :key="index" :class="item.check?'on':''" @tap="bindChenck1(item)">
|
||||||
|
{{item.type_name}}
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</scroll-view>
|
||||||
|
<view class="btns" v-if="!isShow && list.length>9" @click="isShow = true">展开全部<text class="iconfont icon-xiangxia"></text></view>
|
||||||
|
<view class="btns" v-if="isShow && list.length>9" @click="isShow = false">收起<text class="iconfont icon-xiangshang"></text></view>
|
||||||
|
</view>
|
||||||
|
<view class="title">商户分类</view>
|
||||||
|
<view class="brand-wrapper">
|
||||||
|
<scroll-view style="max-height: 400rpx;" :scroll-y="isShow">
|
||||||
|
<view class="wrapper">
|
||||||
|
<view class="item line1" v-for="(item,index) in merCate" :key="index" :class="item.check?'on':''" @tap="bindChenck2(item)">
|
||||||
|
{{item.category_name}}
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</scroll-view>
|
||||||
|
<view class="btns" v-if="!isShow && merCate.length>9" @click="isShow = true">展开全部<text class="iconfont icon-xiangxia"></text></view>
|
||||||
|
<!-- <view class="btns" v-if="isShow && merCate.length>9" @click="isShow = false">收起<text class="iconfont icon-xiangshang"></text></view> -->
|
||||||
|
</view>
|
||||||
|
<view class="foot-btn">
|
||||||
|
<view class="btn-item" @click="reset">重置</view>
|
||||||
|
<view class="btn-item confirm" @click="confirm">确定</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="right-bg" @click="close"></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 { mapGetters } from "vuex";
|
||||||
|
export default{
|
||||||
|
props: {
|
||||||
|
storeTypeArr: { //店铺类型
|
||||||
|
type: Array,
|
||||||
|
},
|
||||||
|
merList: { //商户分类
|
||||||
|
type: Array,
|
||||||
|
},
|
||||||
|
status:{
|
||||||
|
type:Boolean,
|
||||||
|
default:false
|
||||||
|
},
|
||||||
|
},
|
||||||
|
computed: mapGetters(['viewColor']),
|
||||||
|
data(){
|
||||||
|
return {
|
||||||
|
min: '',
|
||||||
|
max:'',
|
||||||
|
isShow:false,
|
||||||
|
list:[],
|
||||||
|
merCate: [],
|
||||||
|
activeList:[],
|
||||||
|
selectList: [],
|
||||||
|
showBox:false
|
||||||
|
}
|
||||||
|
},
|
||||||
|
mounted() {
|
||||||
|
// 重要组件挂载后
|
||||||
|
this.list = this.storeTypeArr //店铺类型
|
||||||
|
this.merCate = this.merList //商户分类
|
||||||
|
this.showBox = this.status
|
||||||
|
},
|
||||||
|
methods:{
|
||||||
|
bindChenck1(item){
|
||||||
|
item.check = !item.check
|
||||||
|
this.arrFilter1()
|
||||||
|
},
|
||||||
|
bindChenck2(item){
|
||||||
|
item.check = !item.check
|
||||||
|
this.arrFilter2()
|
||||||
|
},
|
||||||
|
arrFilter1(){
|
||||||
|
this.selectList = this.list.filter(item=>{
|
||||||
|
return item.check == true
|
||||||
|
})
|
||||||
|
},
|
||||||
|
arrFilter2(){
|
||||||
|
this.activeList = this.merCate.filter(item=>{
|
||||||
|
return item.check == true
|
||||||
|
})
|
||||||
|
},
|
||||||
|
reset(){
|
||||||
|
this.list.forEach((el,index)=>{
|
||||||
|
el.check = false
|
||||||
|
})
|
||||||
|
this.merCate.forEach((el,index)=>{
|
||||||
|
el.check = false
|
||||||
|
})
|
||||||
|
this.arrFilter1()
|
||||||
|
this.arrFilter2()
|
||||||
|
},
|
||||||
|
confirm(){
|
||||||
|
this.arrFilter1()
|
||||||
|
this.arrFilter2()
|
||||||
|
// console.log(this.activeList)
|
||||||
|
let obj = {
|
||||||
|
storeTypeArr:this.selectList,
|
||||||
|
merList: this.activeList,
|
||||||
|
status:false
|
||||||
|
}
|
||||||
|
this.showBox = false
|
||||||
|
this.$emit('confirm',obj)
|
||||||
|
},
|
||||||
|
close(){
|
||||||
|
this.showBox = false
|
||||||
|
this.$emit('close')
|
||||||
|
},
|
||||||
|
moveStop(){}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
.slideInRight{
|
||||||
|
animation-duration:.5s
|
||||||
|
}
|
||||||
|
.right-wrapper{
|
||||||
|
z-index: 99;
|
||||||
|
position: fixed;
|
||||||
|
left: 0;
|
||||||
|
top: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
.control-wrapper{
|
||||||
|
z-index: 90;
|
||||||
|
position: absolute;
|
||||||
|
right: 0;
|
||||||
|
top: 0;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
width: 635rpx;
|
||||||
|
height: 100%;
|
||||||
|
background-color: #F5F5F5;
|
||||||
|
.header{
|
||||||
|
padding: 50rpx 26rpx 40rpx;
|
||||||
|
background-color: #fff;
|
||||||
|
.title{
|
||||||
|
font-size: 26rpx;
|
||||||
|
font-weight: bold;
|
||||||
|
color: #282828;
|
||||||
|
}
|
||||||
|
.input-wrapper{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
margin-top: 28rpx;
|
||||||
|
input{
|
||||||
|
width:260rpx;
|
||||||
|
height:56rpx;
|
||||||
|
padding: 0 10rpx;
|
||||||
|
background:rgba(242,242,242,1);
|
||||||
|
border-radius:28rpx;
|
||||||
|
font-size: 22rpx;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
.line{
|
||||||
|
width:15rpx;
|
||||||
|
height:2rpx;
|
||||||
|
background:#7D7D7D;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.content-box{
|
||||||
|
position: relative;
|
||||||
|
flex: 1;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
margin-top: 20rpx;
|
||||||
|
padding: 0 26rpx;
|
||||||
|
background-color: #fff;
|
||||||
|
overflow: hidden;
|
||||||
|
.title{
|
||||||
|
padding: 40rpx 0 20rpx;
|
||||||
|
font-size: 26rpx;
|
||||||
|
font-weight: bold;
|
||||||
|
color: #282828;
|
||||||
|
}
|
||||||
|
.brand-wrapper{
|
||||||
|
// flex: 1;
|
||||||
|
overflow: hidden;
|
||||||
|
.wrapper{
|
||||||
|
display: flex;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
padding-bottom: 20rpx;
|
||||||
|
}
|
||||||
|
.item{
|
||||||
|
display: block;
|
||||||
|
width:186rpx;
|
||||||
|
height:56rpx;
|
||||||
|
line-height: 56rpx;
|
||||||
|
text-align: center;
|
||||||
|
background:rgba(242,242,242,1);
|
||||||
|
border-radius:28rpx;
|
||||||
|
margin-top: 25rpx;
|
||||||
|
padding: 0 10rpx;
|
||||||
|
margin-right: 12rpx;
|
||||||
|
&:nth-child(3n){
|
||||||
|
margin-right: 0;
|
||||||
|
}
|
||||||
|
&.on{
|
||||||
|
background: var(--view-minorColor);
|
||||||
|
border:1px solid var(--view-theme);
|
||||||
|
color: var(--view-theme);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.btns{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
padding-top: 10rpx;
|
||||||
|
font-size: 22rpx;
|
||||||
|
color: #999;
|
||||||
|
.iconfont{
|
||||||
|
margin-left: 10rpx;
|
||||||
|
margin-top: 5rpx;
|
||||||
|
font-size: 20rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.foot-btn{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: space-between;
|
||||||
|
position: absolute;
|
||||||
|
// width: 100%;
|
||||||
|
// text-align: center;
|
||||||
|
bottom: 30rpx;
|
||||||
|
.btn-item{
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
width:286rpx;
|
||||||
|
height:68rpx;
|
||||||
|
background:rgba(255,255,255,1);
|
||||||
|
border:1px solid rgba(170,170,170,1);
|
||||||
|
border-radius:34rpx;
|
||||||
|
font-size: 26rpx;
|
||||||
|
color: #282828;
|
||||||
|
&.confirm{
|
||||||
|
background: var(--view-theme);
|
||||||
|
border-color: var(--view-theme);
|
||||||
|
color: #fff;
|
||||||
|
margin-left: 20rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
.right-bg{
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
top: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
background-color: rgba(0,0,0,.5);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
251
pages/nongKe/supply_chain/component/shop_card.vue
Normal file
251
pages/nongKe/supply_chain/component/shop_card.vue
Normal file
@ -0,0 +1,251 @@
|
|||||||
|
<template>
|
||||||
|
<view class="shop_card">
|
||||||
|
<view class="pro_item" @click="goStore(store_item.mer_id)">
|
||||||
|
<view class="merchant_msg" :style="{backgroundImage: `url(${store_item.mer_banner})`}">
|
||||||
|
<view class="shade"></view>
|
||||||
|
<u--image :showLoading="true" :src="store_item.mer_avatar" width="112.28rpx" height="112.28rpx" shape="circle">
|
||||||
|
</u--image>
|
||||||
|
<view class="merchant_r_msg">
|
||||||
|
<view class="flex_a_c_j_sb">
|
||||||
|
<view class="mct_msg_title flex_a_c">
|
||||||
|
<view class="store_site flex_a_c" v-if="store_item.street_name">{{ store_item.street_name }}</view>
|
||||||
|
<view class="name">{{ store_item.mer_name }}</view>
|
||||||
|
</view>
|
||||||
|
<image class="high_img" :src="youZhiImg" mode="aspectFit"></image>
|
||||||
|
</view>
|
||||||
|
<view class="mct_msg_detail flex_a_c">
|
||||||
|
<view class="product_score">{{ store_item.product_score }}分</view>
|
||||||
|
<text>月售{{ store_item.sales }}份</text>
|
||||||
|
<view style="margin-left: 17.54rpx;">
|
||||||
|
关注人数{{store_item.care_count<10000 ? store_item.care_count : (store_item.care_count/10000).toFixed(2)+'万'}}
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<!-- 地址 -->
|
||||||
|
<view class="location flex" v-if="false">
|
||||||
|
<text v-if="store_item.distance">{{store_item.distance}}</text>
|
||||||
|
<view class="coupon" v-for="(coupon,index) in store_item.store_coupon.slice(0, 3)" :key="index">
|
||||||
|
{{coupon}}
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<scroll-view scroll-x="true" class="goods_info">
|
||||||
|
<view v-for="(itemn,indexn) in store_item.recommend" :key="indexn" class="goods_info_item"
|
||||||
|
@click.stop="navTogoodsDetail(itemn.product_id)">
|
||||||
|
<image class="goods_info_img" :src="itemn.image" mode="aspectFit"></image>
|
||||||
|
<view class="goods_info_name">{{itemn.store_name}}</view>
|
||||||
|
<view class="goods_info_price">￥{{itemn.price}}</view>
|
||||||
|
</view>
|
||||||
|
</scroll-view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
export default {
|
||||||
|
name: 'ShopCard',
|
||||||
|
props: {
|
||||||
|
store_item: {
|
||||||
|
type: Object
|
||||||
|
},
|
||||||
|
isDetail: {
|
||||||
|
type: Number,
|
||||||
|
default: 1
|
||||||
|
}
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return { youZhiImg: 'https://lihai001.oss-cn-chengdu.aliyuncs.com/public/kk/z2586.png', }
|
||||||
|
},
|
||||||
|
mounted() {},
|
||||||
|
methods: {
|
||||||
|
navTogoodsDetail(id) {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: `/pages/goods_details/index?id=${id}`
|
||||||
|
})
|
||||||
|
},
|
||||||
|
goStore(id) {
|
||||||
|
// console.log(this.isDetail);
|
||||||
|
if (this.isDetail == 2) {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: `/pages/store/home/index?id=${id}`
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: `/pages/nongKe/supply_chain/merchant?id=${id}`
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style scoped lang="scss">
|
||||||
|
.shop_card {}
|
||||||
|
|
||||||
|
.pro_item {
|
||||||
|
/* box-shadow: 0px 0px 6px 1px rgba(0, 0, 0, 0.25); */
|
||||||
|
border-radius: 28.07rpx;
|
||||||
|
margin-bottom: 17.54rpx;
|
||||||
|
// background-image: url('https://lihai001.oss-cn-chengdu.aliyuncs.com/public/kk/luzhou/static4/2/storeBg.png');
|
||||||
|
background-size: 100% 100%;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
background-color: #f5f5f5;
|
||||||
|
|
||||||
|
.merchant_msg {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
color: #666666;
|
||||||
|
font-size: 24.56rpx;
|
||||||
|
// background-color: rgba(0, 0, 0, 0.5);
|
||||||
|
background-size: cover;
|
||||||
|
background-repeat: no-repeat;
|
||||||
|
border-radius: 8px;
|
||||||
|
padding: 12.28rpx 22.81rpx;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
// 遮罩层
|
||||||
|
.shade {
|
||||||
|
position: absolute;
|
||||||
|
top: 0;
|
||||||
|
left: 0;
|
||||||
|
width: 100%;
|
||||||
|
height: 100%;
|
||||||
|
background-color: rgba(255, 255, 255, 0.7);
|
||||||
|
}
|
||||||
|
|
||||||
|
.merchant_avatar {
|
||||||
|
width: 87.72rpx;
|
||||||
|
height: 87.72rpx;
|
||||||
|
border-radius: 100px;
|
||||||
|
margin-right: 10.53rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.merchant_r_msg {
|
||||||
|
flex: 1;
|
||||||
|
width: 100%;
|
||||||
|
color: #000;
|
||||||
|
margin-left: 11rpx;
|
||||||
|
position: relative;
|
||||||
|
z-index: 1;
|
||||||
|
|
||||||
|
.mct_msg_title {
|
||||||
|
font-size: 28.07rpx;
|
||||||
|
font-weight: bold;
|
||||||
|
overflow: hidden;
|
||||||
|
|
||||||
|
.store_site {
|
||||||
|
&::after {
|
||||||
|
content: "|";
|
||||||
|
display: inline-block;
|
||||||
|
margin: 8.77rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.name {
|
||||||
|
width: 157.89rpx;
|
||||||
|
white-space: nowrap;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.high_img {
|
||||||
|
margin-left: 24.56rpx;
|
||||||
|
width: 36.84rpx;
|
||||||
|
height: 43.86rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.enter_shop {
|
||||||
|
font-size: 24.56rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.location {
|
||||||
|
color: #666666;
|
||||||
|
font-size: 24.56rpx;
|
||||||
|
|
||||||
|
.coupon {
|
||||||
|
margin-left: 17.54rpx;
|
||||||
|
font-size: 24.56rpx;
|
||||||
|
color: #20A162;
|
||||||
|
padding: 3rpx 10rpx;
|
||||||
|
border-radius: 4px;
|
||||||
|
border: 1px solid #20A162;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.mct_msg_detail {
|
||||||
|
margin-top: 21.05rpx;
|
||||||
|
|
||||||
|
.product_score {
|
||||||
|
font-size: 24.56rpx;
|
||||||
|
color: #FE9A10;
|
||||||
|
font-weight: 700;
|
||||||
|
margin-right: 33.33rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.grade {
|
||||||
|
font-size: 21.05rpx;
|
||||||
|
color: #20A162;
|
||||||
|
margin: 0 28.07rpx;
|
||||||
|
text-align: center;
|
||||||
|
padding: 5.26rpx;
|
||||||
|
border-radius: 4px;
|
||||||
|
border: 1px solid #20A162;
|
||||||
|
}
|
||||||
|
|
||||||
|
.on_sale {
|
||||||
|
&::before {
|
||||||
|
content: '满减';
|
||||||
|
color: #fff;
|
||||||
|
padding: 3.51rpx 10.53rpx;
|
||||||
|
margin-right: 8.77rpx;
|
||||||
|
border-radius: 7.02rpx 0px 7.02rpx 0px;
|
||||||
|
background: linear-gradient(180deg, #66CE69 0%, #20A162 100%);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.goods_info {
|
||||||
|
padding: 0 22.81rpx;
|
||||||
|
width: 100%;
|
||||||
|
white-space: nowrap;
|
||||||
|
margin-top: 26.32rpx;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
// justify-content: space-between;
|
||||||
|
|
||||||
|
.goods_info_item {
|
||||||
|
display: inline-block;
|
||||||
|
margin-right: 21.05rpx;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
&:last-child {
|
||||||
|
margin-right: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.goods_info_img {
|
||||||
|
width: 140.35rpx;
|
||||||
|
height: 140.35rpx;
|
||||||
|
border-radius: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.goods_info_name {
|
||||||
|
margin: 14.04rpx 0;
|
||||||
|
width: 140.35rpx;
|
||||||
|
font-size: 28.07rpx;
|
||||||
|
white-space: nowrap;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
}
|
||||||
|
|
||||||
|
.goods_info_price {
|
||||||
|
font-size: 24.56rpx;
|
||||||
|
color: #F84221;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
185
pages/nongKe/supply_chain/finance.vue
Normal file
185
pages/nongKe/supply_chain/finance.vue
Normal file
@ -0,0 +1,185 @@
|
|||||||
|
<template>
|
||||||
|
<view class="finance">
|
||||||
|
<view class="tabs_box flex_a_c">
|
||||||
|
<u-subsection :list="subsList" :current="curNow" activeColor="#20A162" @change="subsChange"></u-subsection>
|
||||||
|
</view>
|
||||||
|
<block v-for="(item,i) in goodsList" :key="item.order_id">
|
||||||
|
<view class="list_item">
|
||||||
|
<view class="item_header flex_a_c_j_sb">
|
||||||
|
<view class="title_left">
|
||||||
|
<view class="name">采购人:{{item.real_name}}</view>
|
||||||
|
<view class="name">电 话:{{item.user_phone}}</view>
|
||||||
|
<view class="time">{{item.pay_time}}</view>
|
||||||
|
</view>
|
||||||
|
<view class="btn_right" @click="setInfo(item.mer_id,item.order_id)" v-if="item.status=='0'">去发货</view>
|
||||||
|
<view class="btn_right" v-else="item.status=='2'">已完成</view>
|
||||||
|
</view>
|
||||||
|
<view class="item_cont">
|
||||||
|
<view class="item_cell">采购商家：{{item.merchant.mer_name}}</view>
|
||||||
|
<view class="item_cell flex">
|
||||||
|
<view class="">采购详情：</view>
|
||||||
|
<view style="width: 100%;flex: 1;">
|
||||||
|
<!-- v-for="(item,index) in 3" :key="index" -->
|
||||||
|
<view class="flex_a_c_j_sb" v-for="list in item.orderProduct" :key="list.order_product_id">
|
||||||
|
<view class="">{{list.cart_info.product.store_name}}</view>
|
||||||
|
<view class="pro_num">X{{list.product_num}} </view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="item_cell">收货地址：{{item.user_address}}</view>
|
||||||
|
<view class="item_cell">订单编号：{{item.order_sn}}</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</block>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { mapGetters } from 'vuex'
|
||||||
|
import { getOrderList, setAdminOrderDelivery } from '@/api/admin.js'
|
||||||
|
import { Toast } from '../../../libs/uniApi'
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
curNow: '0',
|
||||||
|
serObj: {
|
||||||
|
status: '0',
|
||||||
|
page: '1',
|
||||||
|
limit: '20',
|
||||||
|
product_type:98,
|
||||||
|
},
|
||||||
|
subsList: ['未发货', '已发货', '全部订单'],
|
||||||
|
goodsList: [],
|
||||||
|
merId: ''
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onLoad(options) {
|
||||||
|
// console.log(options.merid,'123');
|
||||||
|
this.merId = options.merid
|
||||||
|
},
|
||||||
|
onShow() {
|
||||||
|
this.getDefaultData()
|
||||||
|
},
|
||||||
|
computed: mapGetters(['userInfo']),
|
||||||
|
methods: {
|
||||||
|
subsChange(index) {
|
||||||
|
this.curNow = index
|
||||||
|
//未发货
|
||||||
|
if (index == '0') {
|
||||||
|
this.serObj.status = '0'
|
||||||
|
this.getDefaultData()
|
||||||
|
}
|
||||||
|
//index=='2'已发货
|
||||||
|
if (index == '1') {
|
||||||
|
this.serObj.status = '1'
|
||||||
|
this.getDefaultData()
|
||||||
|
}
|
||||||
|
//全部订单---暂时无接口
|
||||||
|
if (index == '2') {
|
||||||
|
delete this.serObj.status
|
||||||
|
this.getDefaultData()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
//默认是未发货查询
|
||||||
|
async getDefaultData() {
|
||||||
|
const res = await getOrderList(this.serObj, this.merId)
|
||||||
|
// console.log(res);
|
||||||
|
this.goodsList = res.data.list
|
||||||
|
},
|
||||||
|
//去发货---
|
||||||
|
goDeliver_goods(order_id) {},
|
||||||
|
setInfo(merId, orderId) {
|
||||||
|
let that = this;
|
||||||
|
const data = {
|
||||||
|
delivery_id: this.userInfo.phone,
|
||||||
|
delivery_name: this.userInfo.service.nickname,
|
||||||
|
delivery_type: 2,
|
||||||
|
is_split: 0,
|
||||||
|
split: []
|
||||||
|
}
|
||||||
|
setAdminOrderDelivery(merId, orderId, data).then(
|
||||||
|
res => {
|
||||||
|
this.getDefaultData()
|
||||||
|
Toast('提交成功')
|
||||||
|
},
|
||||||
|
error => {
|
||||||
|
that.$util.Tips({
|
||||||
|
title: error
|
||||||
|
})
|
||||||
|
}
|
||||||
|
);
|
||||||
|
},
|
||||||
|
},
|
||||||
|
onPullDownRefresh() {
|
||||||
|
uni.stopPullDownRefresh()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
.finance {}
|
||||||
|
|
||||||
|
::v-deep .u-subsection {
|
||||||
|
height: 94.74rpx !important;
|
||||||
|
padding: 10.53rpx !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
::v-deep .u-subsection__bar {
|
||||||
|
height: 73.68rpx !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tabs_box {
|
||||||
|
padding: 0 28.07rpx;
|
||||||
|
height: 136.84rpx;
|
||||||
|
background-color: #fff;
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
.pro_num{
|
||||||
|
color: #20A162;
|
||||||
|
}
|
||||||
|
.title_left {
|
||||||
|
width: 548rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.list_item {
|
||||||
|
background-color: #fff;
|
||||||
|
width: 694.74rpx;
|
||||||
|
margin: 0 auto;
|
||||||
|
margin-top: 31.58rpx;
|
||||||
|
padding: 28.07rpx;
|
||||||
|
border-radius: 8px;
|
||||||
|
|
||||||
|
.item_header {
|
||||||
|
width: 100%;
|
||||||
|
padding-bottom: 17.54rpx;
|
||||||
|
border-bottom: 1px dashed #20A162;
|
||||||
|
|
||||||
|
.name {
|
||||||
|
font-size: 31.58rpx;
|
||||||
|
color: #333;
|
||||||
|
font-weight: bold;
|
||||||
|
margin-bottom: 21.05rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.time {
|
||||||
|
color: #999;
|
||||||
|
font-size: 24.56rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn_right {
|
||||||
|
color: #20A162;
|
||||||
|
text-align: center;
|
||||||
|
line-height: 49.12rpx;
|
||||||
|
width: 138.6rpx;
|
||||||
|
height: 49.12rpx;
|
||||||
|
border-radius: 4px;
|
||||||
|
border: 1px solid #20A162;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.item_cell {
|
||||||
|
margin-top: 24.56rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
358
pages/nongKe/supply_chain/goods_list.vue
Normal file
358
pages/nongKe/supply_chain/goods_list.vue
Normal file
@ -0,0 +1,358 @@
|
|||||||
|
<template>
|
||||||
|
<view class="goods_list">
|
||||||
|
<view class="head_search flex_a_c">
|
||||||
|
<view class="search_content flex_a_c_j_sb">
|
||||||
|
<view class="flex_a_c">
|
||||||
|
<view class="iconfont icon-sousuo"></view>
|
||||||
|
<input type="text" v-model="params.keyword" placeholder="请搜索">
|
||||||
|
</view>
|
||||||
|
<button class="search_btn" @click="searchClick">搜索</button>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<block v-for="(item,i) in goodsList" :key="i">
|
||||||
|
<view class="list_item flex_a_c">
|
||||||
|
<image class="goods_img" :src="item.image" mode="aspectFit"></image>
|
||||||
|
<view class="r_box flex_a_c_j_sb">
|
||||||
|
<view class="message">
|
||||||
|
<view class="goodstitle">{{item.store_name}}</view>
|
||||||
|
<view class="flex_a_c">
|
||||||
|
<view class="">分类：{{item.storeCategory.cate_name}}</view>
|
||||||
|
<view class="unit">单位：{{item.unit_name}}</view>
|
||||||
|
</view>
|
||||||
|
<view class="bar_code">条形码：{{ item.bar_code || "无" }}</view>
|
||||||
|
</view>
|
||||||
|
<view class="redact_box">
|
||||||
|
<view class="order_price">订货价：{{item.price}}</view>
|
||||||
|
<button class="redact" @click="redactShow(item)">编辑</button>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</block>
|
||||||
|
|
||||||
|
<u-popup :show="popupShow" @close="popupShow = false" mode="center" :round="10" closeOnClickOverlay>
|
||||||
|
<view class="popup_cont" v-if="redactGoods.store_name">
|
||||||
|
<view class="title">{{redactGoods.store_name}}</view>
|
||||||
|
<view class="message flex_a_c_j_sb">
|
||||||
|
<view class="">分类：{{redactGoods.storeCategory.cate_name}}</view>
|
||||||
|
<view class="">单位：{{redactGoods.unit_name}}</view>
|
||||||
|
<view class="">订货价：{{redactGoods.price}}</view>
|
||||||
|
</view>
|
||||||
|
<view class="bar_code flex_a_c_j_sb">
|
||||||
|
<view>条形码：{{ redactGoods.bar_code || "无" }}</view>
|
||||||
|
<view>库存：{{ redactGoods.stock }}</view>
|
||||||
|
</view>
|
||||||
|
<view class="sub_title">订货价</view>
|
||||||
|
<input class="input" type="text" placeholder="请输入价格" v-model="goodsPrive">
|
||||||
|
<!-- <view class="sub_title">库存量</view>
|
||||||
|
<input class="input" type="number" placeholder="请输入库存数量" v-model="goodsNum"> -->
|
||||||
|
<view class="btns_box">
|
||||||
|
<view class="cancel" @click="popupClose">取消</view>
|
||||||
|
<view class="save" @click="submitCreatedGoods">保存</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</u-popup>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
<script>
|
||||||
|
import {
|
||||||
|
getStorage,
|
||||||
|
removeStorage,
|
||||||
|
Toast,
|
||||||
|
Loading,
|
||||||
|
hideLoading,
|
||||||
|
Modal
|
||||||
|
} from '@/libs/uniApi.js';
|
||||||
|
import {
|
||||||
|
productLstApi,
|
||||||
|
productCreate,
|
||||||
|
productUpdate,
|
||||||
|
productDetail
|
||||||
|
} from '@/api/product.js'
|
||||||
|
import {
|
||||||
|
checkLogin
|
||||||
|
} from '../../../libs/login';
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
goodsPrive: '',
|
||||||
|
goodsNum: '',
|
||||||
|
goodsList: [],
|
||||||
|
redactGoods: {},
|
||||||
|
search: '',
|
||||||
|
popupShow: false,
|
||||||
|
merId: '',
|
||||||
|
product_id: '',
|
||||||
|
addGoodsSecoundData: {
|
||||||
|
is_good: 0, // 是否推荐
|
||||||
|
is_gift_bag: 0,
|
||||||
|
sort: '',
|
||||||
|
once_count: '', // 限购数量
|
||||||
|
video_link: ''
|
||||||
|
},
|
||||||
|
disModel: false,
|
||||||
|
particulars: {},
|
||||||
|
mer_id: '',
|
||||||
|
status: 'loadmore',
|
||||||
|
loadingText: '努力加载中',
|
||||||
|
loadmoreText: '轻轻上拉',
|
||||||
|
nomoreText: '实在没有了',
|
||||||
|
params: {
|
||||||
|
page: 1,
|
||||||
|
limit: 10,
|
||||||
|
keyword: ''
|
||||||
|
},
|
||||||
|
// page: 1,
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onLoad(e) {
|
||||||
|
this.mer_id = e.merid
|
||||||
|
this.getGoodsList()
|
||||||
|
this.initData();
|
||||||
|
|
||||||
|
// uni.setNavigationBarTitle({
|
||||||
|
// title: e.title
|
||||||
|
// })
|
||||||
|
},
|
||||||
|
onShow() {},
|
||||||
|
methods: {
|
||||||
|
async searchClick() {
|
||||||
|
const {
|
||||||
|
data
|
||||||
|
} = await productLstApi(this.mer_id, this.params)
|
||||||
|
this.goodsList = data.list
|
||||||
|
},
|
||||||
|
async getGoodsList() {
|
||||||
|
const {
|
||||||
|
data
|
||||||
|
} = await productLstApi(this.mer_id, this.params)
|
||||||
|
this.goodsList.push(...data.list)
|
||||||
|
if (data.length < 9) this.status = 'nomore';
|
||||||
|
},
|
||||||
|
redactShow(item) {
|
||||||
|
this.product_id = item.product_id
|
||||||
|
this.merId = item.mer_id
|
||||||
|
this.redactGoods = item
|
||||||
|
this.popupShow = true
|
||||||
|
productDetail(item.mer_id, item.product_id).then(res => {
|
||||||
|
this.particulars = res.data
|
||||||
|
})
|
||||||
|
// console.log('打开弹框', item);
|
||||||
|
},
|
||||||
|
popupClose() {
|
||||||
|
this.goodsPrive = ''
|
||||||
|
this.goodsNum = ''
|
||||||
|
this.popupShow = false
|
||||||
|
},
|
||||||
|
// 创建商品
|
||||||
|
async submitCreatedGoods() {
|
||||||
|
this.particulars.attrValue[0].stock = Number(this.goodsNum)
|
||||||
|
this.particulars.attrValue[0].price = this.goodsPrive
|
||||||
|
const res = await productUpdate(this.merId, this.product_id, this.particulars)
|
||||||
|
// Toast(message)
|
||||||
|
this.getGoodsList()
|
||||||
|
this.goodsList = []
|
||||||
|
this.popupShow = false
|
||||||
|
this.goodsPrive = ''
|
||||||
|
this.goodsNum = ''
|
||||||
|
},
|
||||||
|
initData() {
|
||||||
|
let editGoodsDetils = {};
|
||||||
|
if (getStorage('goodsDis')) {
|
||||||
|
this.disModel = true;
|
||||||
|
}
|
||||||
|
if (this.product_id) {
|
||||||
|
editGoodsDetils = getStorage('editGoodsDetils');
|
||||||
|
Object.keys(this.addGoodsSecoundData).forEach(item => {
|
||||||
|
this.addGoodsSecoundData[item] = editGoodsDetils[item];
|
||||||
|
});
|
||||||
|
|
||||||
|
if (editGoodsDetils.content) {
|
||||||
|
setStorage('goodsDis', {
|
||||||
|
store_name: editGoodsDetils.content.title,
|
||||||
|
imageList: editGoodsDetils.content.image
|
||||||
|
});
|
||||||
|
this.disModel = true;
|
||||||
|
}
|
||||||
|
setStorage('canChangeSecound', true);
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (getStorage('addGoodsSecoundData')) {
|
||||||
|
Object.keys(this.addGoodsSecoundData).forEach(item => {
|
||||||
|
if (getStorage('addGoodsSecoundData')[item] || getStorage('addGoodsSecoundData')[item] ==
|
||||||
|
0) {
|
||||||
|
this.addGoodsSecoundData[item] = getStorage('addGoodsSecoundData')[item];
|
||||||
|
}
|
||||||
|
});
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
// 加载更多
|
||||||
|
onReachBottom() {
|
||||||
|
if (this.status == 'nomore') return;
|
||||||
|
this.status = 'loading';
|
||||||
|
this.params.page = ++this.params.page;
|
||||||
|
this.getGoodsList()
|
||||||
|
},
|
||||||
|
onPullDownRefresh() {
|
||||||
|
this.params.page = 1
|
||||||
|
this.goodsList = []
|
||||||
|
this.getGoodsList()
|
||||||
|
uni.stopPullDownRefresh()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
.goods_list {}
|
||||||
|
|
||||||
|
|
||||||
|
.head_search {
|
||||||
|
width: 100%;
|
||||||
|
background-color: #fff;
|
||||||
|
height: 108.77rpx;
|
||||||
|
|
||||||
|
.search_content {
|
||||||
|
margin: 0 auto;
|
||||||
|
width: 694.74rpx;
|
||||||
|
height: 66.67rpx;
|
||||||
|
padding: 2px 2px 2px 21.05rpx;
|
||||||
|
border: 1px solid $uni-theme-color;
|
||||||
|
border-radius: 100px;
|
||||||
|
|
||||||
|
.icon-sousuo {
|
||||||
|
font-weight: bold;
|
||||||
|
color: $uni-theme-color;
|
||||||
|
margin-right: 17.54rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.search_btn {
|
||||||
|
color: #fff;
|
||||||
|
width: 135.09rpx;
|
||||||
|
height: 59.65rpx;
|
||||||
|
line-height: 59.65rpx;
|
||||||
|
background: $uni-theme-bg-color;
|
||||||
|
border-radius: 100px;
|
||||||
|
font-size: 25rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.list_item,
|
||||||
|
.popup_cont {
|
||||||
|
margin: 0 auto;
|
||||||
|
width: 694.74rpx;
|
||||||
|
// height: 236.84rpx;
|
||||||
|
background: #FFFFFF;
|
||||||
|
border-radius: 8px;
|
||||||
|
padding: 21.05rpx;
|
||||||
|
margin-top: 21.05rpx;
|
||||||
|
|
||||||
|
.title {
|
||||||
|
|
||||||
|
font-weight: bold;
|
||||||
|
color: #333;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.list_item {
|
||||||
|
font-size: 24.56rpx;
|
||||||
|
|
||||||
|
.redact_box {
|
||||||
|
height: 100%;
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: flex-end;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.redact {
|
||||||
|
margin-top: 7.02rpx;
|
||||||
|
color: #fff;
|
||||||
|
width: 129.82rpx;
|
||||||
|
height: 50.88rpx;
|
||||||
|
line-height: 50.88rpx;
|
||||||
|
background: $uni-theme-bg-color;
|
||||||
|
border-radius: 7px;
|
||||||
|
font-size: 25rpx
|
||||||
|
}
|
||||||
|
|
||||||
|
.r_box {
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.unit {
|
||||||
|
margin-left: 35.09rpx;
|
||||||
|
margin: 7.02rpx 0 7.02rpx 35.09rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.goods_img {
|
||||||
|
width: 119.3rpx;
|
||||||
|
height: 119.3rpx;
|
||||||
|
border-radius: 8px;
|
||||||
|
margin-right: 26.32rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.goodstitle {
|
||||||
|
width: 42vw;
|
||||||
|
font-weight: bold;
|
||||||
|
white-space: nowrap;
|
||||||
|
/* 不换行 */
|
||||||
|
overflow: hidden;
|
||||||
|
/* 溢出隐藏 */
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.popup_cont {
|
||||||
|
width: 680.7rpx;
|
||||||
|
padding: 31.58rpx;
|
||||||
|
font-size: 28.07rpx;
|
||||||
|
|
||||||
|
.message {
|
||||||
|
margin: 28.07rpx 0 21.05rpx 0;
|
||||||
|
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
.sub_title {
|
||||||
|
font-size: 28.07rpx;
|
||||||
|
margin: 35.09rpx 0 14.04rpx 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.input {
|
||||||
|
width: 100%;
|
||||||
|
height: 84.21rpx;
|
||||||
|
background-color: #F5F5F5;
|
||||||
|
border-radius: 4px;
|
||||||
|
padding-left: 4px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.btns_box {
|
||||||
|
margin-top: 49.12rpx;
|
||||||
|
display: flex;
|
||||||
|
justify-content: end;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.cancel {
|
||||||
|
font-size: 31.58rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.save {
|
||||||
|
color: #FFFFFF;
|
||||||
|
text-align: center;
|
||||||
|
line-height: 77.19rpx;
|
||||||
|
margin-left: 57.89rpx;
|
||||||
|
width: 250.88rpx;
|
||||||
|
height: 77.19rpx;
|
||||||
|
background: #009E56;
|
||||||
|
border-radius: 100px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
67
pages/nongKe/supply_chain/maps.vue
Normal file
67
pages/nongKe/supply_chain/maps.vue
Normal file
@ -0,0 +1,67 @@
|
|||||||
|
<template>
|
||||||
|
<view class="">
|
||||||
|
<map id="map" :enable-zoom="true" :markers="markers" :scale="19" :latitude="28.908447" :enable-scroll="true"
|
||||||
|
:longitude="105.439304" style="width: 100vw;height: 100vh;">
|
||||||
|
<!-- <cover-image class="map_btn" @tap="test" src="../../static/img/logistics/DH.png">
|
||||||
|
</cover-image> -->
|
||||||
|
</map>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import {
|
||||||
|
vicinityStoreApi,
|
||||||
|
supAgoodsApi
|
||||||
|
} from '@/api/store.js';
|
||||||
|
export default {
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
markers: [{
|
||||||
|
id: 1,
|
||||||
|
latitude: 28.908447,
|
||||||
|
longitude: 105.439304,
|
||||||
|
title: "测试商家名称",
|
||||||
|
iconPath: "/static/images/GXSC/SJicon.png"
|
||||||
|
}, {
|
||||||
|
id: 2,
|
||||||
|
latitude: 28.909447,
|
||||||
|
longitude: 105.439304,
|
||||||
|
title: "测试商家名称",
|
||||||
|
iconPath: "/static/images/GXSC/SJicon.png"
|
||||||
|
}, {
|
||||||
|
id: 3,
|
||||||
|
latitude: 28.908447,
|
||||||
|
longitude: 105.459304,
|
||||||
|
title: "测试商家名称",
|
||||||
|
iconPath: "/static/images/GXSC/SJicon.png"
|
||||||
|
}, ]
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
,
|
||||||
|
onLoad(options) {
|
||||||
|
let that = this
|
||||||
|
// supAgoodsApi()
|
||||||
|
vicinityStoreApi(options.street_id).then(res => {
|
||||||
|
// console.log(res.data.list)
|
||||||
|
res.data.list.forEach(item => {
|
||||||
|
if (!item.lat) return
|
||||||
|
this.markers = []
|
||||||
|
// console.log(item)
|
||||||
|
that.markers.push({
|
||||||
|
id: item.mer_id,
|
||||||
|
latitude: item.lat,
|
||||||
|
longitude: item.long,
|
||||||
|
title: item.mer_name,
|
||||||
|
iconPath: "/static/images/GXSC/SJicon.png"
|
||||||
|
|
||||||
|
})
|
||||||
|
})
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
</style>
|
||||||
619
pages/nongKe/supply_chain/merchant.vue
Normal file
619
pages/nongKe/supply_chain/merchant.vue
Normal file
@ -0,0 +1,619 @@
|
|||||||
|
<template>
|
||||||
|
<view class="merchant">
|
||||||
|
<view class="head_search flex_a_c">
|
||||||
|
<view class="search_content flex_a_c_j_sb">
|
||||||
|
<view class="flex_a_c">
|
||||||
|
<view class="iconfont icon-sousuo"></view>
|
||||||
|
<input type="text" v-model="infoData.keyword" placeholder="请搜索">
|
||||||
|
</view>
|
||||||
|
<button class="search_btn" @click="searchBtn">搜索</button>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view style="background-color: #fff;width: 100%;">
|
||||||
|
<view class="tabs_box flex_a_c_j_sb">
|
||||||
|
<view v-for="(item,index) in tabsList" :key="index" class="flex_a_c" :class="active==index?'active':''">
|
||||||
|
<view @click="tabsChange(index,order)">{{item}}</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<block v-for="(item,index) in list" :key="index">
|
||||||
|
<view class="item_list flex">
|
||||||
|
<view>
|
||||||
|
<image class="goods_image" :src="item.image" mode="aspectFit"></image>
|
||||||
|
</view>
|
||||||
|
<view class="left_goods_msg">
|
||||||
|
<view class="name">{{ item.store_name }}</view>
|
||||||
|
<view class="classify flex_a_c">
|
||||||
|
<text>分类：{{ item.cate_name ? item.cate_name : '无' }}</text>
|
||||||
|
<text style="margin-left: 17.54rpx;">单位：{{ item.unit_name }}</text>
|
||||||
|
</view>
|
||||||
|
<view class="bar_code">条形码：{{item.bar_code?item.bar_code : '无'}}</view>
|
||||||
|
</view>
|
||||||
|
<view class="right_goods_msg">
|
||||||
|
<view class="num">订货价：{{item.price}}</view>
|
||||||
|
<view class="add_goods" @click="getGoodsDetails(item)">加入购物单</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</block>
|
||||||
|
<u-loadmore :status="status" :loading-text="loadingText" :loadmore-text="loadmoreText" :nomore-text="nomoreText" />
|
||||||
|
|
||||||
|
<navigator class="bottom_purchase" url="./shopping_trolley" open-type="navigate">采购清单</navigator>
|
||||||
|
|
||||||
|
<goodsPopup :goodsStatu="isPopupShow" @colses="isPopupShow=false" :goods_info="goodsInfo"></goodsPopup>
|
||||||
|
<u-popup :show="show" @close="close">
|
||||||
|
<view>
|
||||||
|
<h3 style=" margin: 15px 5px 5px 24px;">颜色规格</h3>
|
||||||
|
<scroll-view :scroll-top="scrollTop" scroll-y="true" class="scroll-Y">
|
||||||
|
<view class="scroll-view-item" v-for="(item,index) in attrValue" :key="index">
|
||||||
|
<view class="scroll_item_top">
|
||||||
|
<image :src="Image" mode=""></image>
|
||||||
|
<view class="text">
|
||||||
|
<view>{{item.sku}}</view>
|
||||||
|
<view>库存: <text>{{item.stock}}</text> </view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<view class="scroll_item_bon">
|
||||||
|
<view class="reduce" @click.stop='subCart(item,index)'>-</view>
|
||||||
|
<input type="text" disabled="true" v-model="goods[index].cart_num" />
|
||||||
|
<view class="plus" :class="goods.numAdd ? 'on' : ''" @click.stop='addCart(item,index)'>+</view>
|
||||||
|
<!-- <u-number-box
|
||||||
|
button-size="36"
|
||||||
|
color="#ffffff"
|
||||||
|
bgColor="#2979ff"
|
||||||
|
iconStyle="color: #fff"
|
||||||
|
v-model="number.cart_num"
|
||||||
|
></u-number-box> -->
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</scroll-view>
|
||||||
|
<button class="btn" @click="addshopcart">确定</button>
|
||||||
|
</view>
|
||||||
|
</u-popup>
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import {
|
||||||
|
getStoreGoods,
|
||||||
|
getProductDetail,
|
||||||
|
postCartAdd
|
||||||
|
} from '@/api/store.js'
|
||||||
|
import { Toast } from '@/libs/uniApi'
|
||||||
|
import goodsPopup from '../cpns/goodsPopup.vue'
|
||||||
|
import {
|
||||||
|
changeCartNum
|
||||||
|
} from '@/api/order.js';
|
||||||
|
export default {
|
||||||
|
components: {
|
||||||
|
goodsPopup
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
status: 'loadmore',
|
||||||
|
loadingText: '努力加载中',
|
||||||
|
loadmoreText: '轻轻上拉',
|
||||||
|
nomoreText: '我也是有底线的~~',
|
||||||
|
myCount: 0,
|
||||||
|
goodsInfo: {},
|
||||||
|
isPopupShow: false,
|
||||||
|
cartCount: 0,
|
||||||
|
isAllSelect: false,
|
||||||
|
search: '',
|
||||||
|
active: 0,
|
||||||
|
src: 'https://cdn.uviewui.com/uview/album/1.jpg',
|
||||||
|
tabsList: ['综合', '新品', '价格(升)', '销量'],
|
||||||
|
value: 5,
|
||||||
|
list: [],
|
||||||
|
attr: {
|
||||||
|
cartAttr: false,
|
||||||
|
productAttr: [],
|
||||||
|
productSelect: {}
|
||||||
|
},
|
||||||
|
productValue: [], // 系统属性
|
||||||
|
attrValue: '', // 已选属性,
|
||||||
|
infoData: {
|
||||||
|
page: 1,
|
||||||
|
limit: 10,
|
||||||
|
product_type: 98,
|
||||||
|
keyword: ''
|
||||||
|
},
|
||||||
|
id: '',
|
||||||
|
order: true,
|
||||||
|
num: '',
|
||||||
|
show: false,
|
||||||
|
scrollTop: 0,
|
||||||
|
attrValue: [],
|
||||||
|
Image: '',
|
||||||
|
goods: [{
|
||||||
|
cart_num: 0
|
||||||
|
}],
|
||||||
|
goodsLite: {},
|
||||||
|
goodsindexL: ''
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onLoad(e) {
|
||||||
|
this.id = e.id
|
||||||
|
this.getStoreGoodsList()
|
||||||
|
|
||||||
|
// getStoreGoods(e.id, this.infoData).then(res => {
|
||||||
|
// this.list = res.data.list
|
||||||
|
// })
|
||||||
|
},
|
||||||
|
onShow() {},
|
||||||
|
methods: {
|
||||||
|
async searchBtn() {
|
||||||
|
this.infoData.page = 1
|
||||||
|
const res = await getStoreGoods(this.id, this.infoData)
|
||||||
|
this.list = res.data.list
|
||||||
|
},
|
||||||
|
// jian() {
|
||||||
|
// Toast('请到购物清单减少数量')
|
||||||
|
// },
|
||||||
|
// goodsPopupClick(item) {
|
||||||
|
// this.goodsInfo = item
|
||||||
|
// this.isPopupShow = true
|
||||||
|
// },
|
||||||
|
navGoodsDetails(id) {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: `/pages/goods_details/index?id=${id}&type=town`
|
||||||
|
})
|
||||||
|
},
|
||||||
|
valChange(e) {
|
||||||
|
// console.log('当前值为: ' + e.value)
|
||||||
|
},
|
||||||
|
//添加购物车 *data是修改过后的参数
|
||||||
|
handelInfo(data) {},
|
||||||
|
//获取商品数据
|
||||||
|
async getStoreGoodsList() {
|
||||||
|
// console.log(this.infoData);
|
||||||
|
const res = await getStoreGoods(this.id, this.infoData)
|
||||||
|
this.list.push(...res.data.list)
|
||||||
|
if (res.data.list.length < 10) this.status = 'nomore'
|
||||||
|
// this.publicMethods1(res)
|
||||||
|
},
|
||||||
|
//上拉刷新
|
||||||
|
publicMethods1(res) {
|
||||||
|
this.num = res.data.count
|
||||||
|
this.list = [...this.list, ...res.data.list]
|
||||||
|
if (this.list.length < this.num) {
|
||||||
|
this.status = 'loadmore'
|
||||||
|
} else {
|
||||||
|
this.status = 'nomore'
|
||||||
|
}
|
||||||
|
|
||||||
|
},
|
||||||
|
tabsChange(i, order) {
|
||||||
|
this.active = i
|
||||||
|
this.list = []
|
||||||
|
this.infoData.page = 1
|
||||||
|
this.order = !this.order
|
||||||
|
if (i == 0) {
|
||||||
|
this.infoData.order = ''
|
||||||
|
this.getStoreGoodsList()
|
||||||
|
}
|
||||||
|
if (i == 1) {
|
||||||
|
this.infoData.order = 'is_new'
|
||||||
|
this.getStoreGoodsList()
|
||||||
|
}
|
||||||
|
//价格升序
|
||||||
|
if (i == 2) {
|
||||||
|
if (order) {
|
||||||
|
this.infoData.order = 'price_asc'
|
||||||
|
this.getStoreGoodsList()
|
||||||
|
this.tabsList[2] = '价格(升)'
|
||||||
|
} else {
|
||||||
|
this.infoData.order = 'price_desc'
|
||||||
|
this.getStoreGoodsList()
|
||||||
|
this.tabsList[2] = '价格(降)'
|
||||||
|
}
|
||||||
|
}
|
||||||
|
if (i == 3) {
|
||||||
|
this.infoData.order = 'sales'
|
||||||
|
this.getStoreGoodsList()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
/**
|
||||||
|
* 获取产品详情
|
||||||
|
*/
|
||||||
|
getGoodsDetails(item) {
|
||||||
|
console.log(item);
|
||||||
|
if (item.product.attrValue.length == 1) {
|
||||||
|
let that = this;
|
||||||
|
const count = '1'
|
||||||
|
getProductDetail(item.product_id, { product_type: 98 }).then(res => {
|
||||||
|
const unique = Object.values(res.data.sku)[0].unique
|
||||||
|
that.goCat(res.data.product_id, count, unique)
|
||||||
|
}).catch(err => {
|
||||||
|
Toast(err)
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
this.show = true
|
||||||
|
this.attrValue = item.product.attrValue
|
||||||
|
this.Image = item.image
|
||||||
|
for (let i = 1; i < item.product.attrValue.length; i++) {
|
||||||
|
this.goods.push({
|
||||||
|
cart_num: 0
|
||||||
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
},
|
||||||
|
/*
|
||||||
|
* 加入购物车
|
||||||
|
*/
|
||||||
|
goCat: function(id, count, unique) {
|
||||||
|
let that = this
|
||||||
|
let q = {
|
||||||
|
is_new: 0,
|
||||||
|
product_id: id,
|
||||||
|
cart_num: count,
|
||||||
|
product_attr_unique: unique,
|
||||||
|
// source: this.source,
|
||||||
|
product_type: 98,
|
||||||
|
spread_id: ''
|
||||||
|
};
|
||||||
|
postCartAdd(q)
|
||||||
|
.then(res => {
|
||||||
|
that.$util.Tips({
|
||||||
|
title: "添加购物车成功",
|
||||||
|
});
|
||||||
|
})
|
||||||
|
.catch(res => {
|
||||||
|
return that.$util.Tips({
|
||||||
|
title: res
|
||||||
|
});
|
||||||
|
});
|
||||||
|
},
|
||||||
|
close() {
|
||||||
|
this.show = false
|
||||||
|
},
|
||||||
|
//购物车增加
|
||||||
|
addCart(item, index) {
|
||||||
|
let that = this
|
||||||
|
that.goods[index].cart_num = that.goods[index].cart_num + 1
|
||||||
|
that.goods.numAdd = true
|
||||||
|
that.goodsLite = item
|
||||||
|
that.goodsindexL = index
|
||||||
|
let q = {
|
||||||
|
is_new: 0,
|
||||||
|
product_id: that.goodsLite.product_id,
|
||||||
|
cart_num: that.goods[that.goodsindexL].cart_num,
|
||||||
|
product_attr_unique: that.goodsLite.unique,
|
||||||
|
// source: this.source,
|
||||||
|
product_type: 98,
|
||||||
|
spread_id: ''
|
||||||
|
};
|
||||||
|
postCartAdd(q).then(res => {
|
||||||
|
that.$util.Tips({
|
||||||
|
title: "添加购物车成功",
|
||||||
|
});
|
||||||
|
})
|
||||||
|
.catch(res => {
|
||||||
|
this.show = false
|
||||||
|
return that.$util.Tips({
|
||||||
|
title: res
|
||||||
|
});
|
||||||
|
});
|
||||||
|
|
||||||
|
},
|
||||||
|
subCart(item, index) {
|
||||||
|
let that = this
|
||||||
|
if (that.goods[index].cart_num == 0) {
|
||||||
|
return
|
||||||
|
} else {
|
||||||
|
that.goods[index].cart_num = that.goods[index].cart_num - 1
|
||||||
|
that.goods.numAdd = true
|
||||||
|
that.goodsLite = item
|
||||||
|
that.goodsindexL = index
|
||||||
|
let q = {
|
||||||
|
is_new: 0,
|
||||||
|
product_id: that.goodsLite.product_id,
|
||||||
|
cart_num: that.goods[that.goodsindexL].cart_num,
|
||||||
|
product_attr_unique: that.goodsLite.unique,
|
||||||
|
// source: this.source,
|
||||||
|
product_type: 98,
|
||||||
|
spread_id: ''
|
||||||
|
};
|
||||||
|
postCartAdd(q).then(res => {
|
||||||
|
that.$util.Tips({
|
||||||
|
title: "添加购物车成功",
|
||||||
|
});
|
||||||
|
})
|
||||||
|
.catch(res => {
|
||||||
|
this.show = false
|
||||||
|
return that.$util.Tips({
|
||||||
|
title: res
|
||||||
|
});
|
||||||
|
});
|
||||||
|
}
|
||||||
|
},
|
||||||
|
addshopcart() {
|
||||||
|
console.log(this.goodsLite);
|
||||||
|
console.log(this.goodsindexL);
|
||||||
|
this.show = false
|
||||||
|
// let that = this
|
||||||
|
// let q = {
|
||||||
|
// is_new: 0,
|
||||||
|
// product_id: that.goodsLite.product_id,
|
||||||
|
// cart_num: that.goods[that.goodsindexL].cart_num,
|
||||||
|
// product_attr_unique: that.goodsLite.unique,
|
||||||
|
// // source: this.source,
|
||||||
|
// product_type: 98,
|
||||||
|
// spread_id: ''
|
||||||
|
// };
|
||||||
|
// postCartAdd(q).then(res => {
|
||||||
|
// this.show = false
|
||||||
|
// that.$util.Tips({
|
||||||
|
// title: "添加购物车成功",
|
||||||
|
// });
|
||||||
|
// })
|
||||||
|
// .catch(res => {
|
||||||
|
// this.show = false
|
||||||
|
// return that.$util.Tips({
|
||||||
|
// title: res
|
||||||
|
// });
|
||||||
|
// });
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onReachBottom() {
|
||||||
|
//如果状态为nomore 则不能在触发上拉事件
|
||||||
|
if (this.status != 'nomore') {
|
||||||
|
this.infoData.page++
|
||||||
|
this.getStoreGoodsList()
|
||||||
|
}
|
||||||
|
|
||||||
|
},
|
||||||
|
onPullDownRefresh() {
|
||||||
|
uni.stopPullDownRefresh()
|
||||||
|
},
|
||||||
|
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
//减号
|
||||||
|
/deep/.uicon-minus {
|
||||||
|
font-weight: 700 !important;
|
||||||
|
color: #000 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.minus {
|
||||||
|
color: #000;
|
||||||
|
display: inline-block;
|
||||||
|
width: 70rpx;
|
||||||
|
height: 60rpx;
|
||||||
|
background-color: rgb(235, 236, 238);
|
||||||
|
padding-top: 20rpx;
|
||||||
|
padding-left: 24rpx;
|
||||||
|
border-top-left-radius: 4px;
|
||||||
|
border-bottom-left-radius: 4px;
|
||||||
|
|
||||||
|
.reduce {
|
||||||
|
font-weight: bold !important;
|
||||||
|
font-weight: 700;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.merchant {
|
||||||
|
padding-bottom: 175.44rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.icon-xuanzhong1 {
|
||||||
|
color: $uni-theme-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
.head_search {
|
||||||
|
width: 100%;
|
||||||
|
background-color: #fff;
|
||||||
|
height: 108.77rpx;
|
||||||
|
|
||||||
|
.search_content {
|
||||||
|
margin: 0 auto;
|
||||||
|
width: 694.74rpx;
|
||||||
|
height: 66.67rpx;
|
||||||
|
padding: 2px 2px 2px 21.05rpx;
|
||||||
|
border: 1px solid $uni-theme-color;
|
||||||
|
border-radius: 100px;
|
||||||
|
|
||||||
|
.icon-sousuo {
|
||||||
|
font-weight: bold;
|
||||||
|
color: $uni-theme-color;
|
||||||
|
margin-right: 17.54rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.search_btn {
|
||||||
|
color: #fff;
|
||||||
|
width: 135.09rpx;
|
||||||
|
height: 59.65rpx;
|
||||||
|
line-height: 59.65rpx;
|
||||||
|
background: $uni-theme-bg-color;
|
||||||
|
border-radius: 100px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.tabs_box {
|
||||||
|
justify-content: space-around;
|
||||||
|
width: 694.74rpx;
|
||||||
|
margin: 0 auto;
|
||||||
|
height: 80.7rpx;
|
||||||
|
border-top: 1px solid #E7E6E4;
|
||||||
|
background-color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.active {
|
||||||
|
font-weight: 700;
|
||||||
|
color: $uni-theme-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
.item_list {
|
||||||
|
margin: 0 auto;
|
||||||
|
margin-top: 28.07rpx;
|
||||||
|
padding: 21.05rpx;
|
||||||
|
width: 694.74rpx;
|
||||||
|
background: #FFFFFF;
|
||||||
|
border-radius: 8px;
|
||||||
|
font-size: 24.56rpx;
|
||||||
|
|
||||||
|
.goods_image {
|
||||||
|
width: 119.3rpx;
|
||||||
|
height: 119.3rpx;
|
||||||
|
border-radius: 8px;
|
||||||
|
margin-right: 26.32rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.left_goods_msg {
|
||||||
|
width: 100%;
|
||||||
|
flex: 1;
|
||||||
|
|
||||||
|
.name {
|
||||||
|
font-size: 28.07rpx;
|
||||||
|
font-weight: 700;
|
||||||
|
width: 315.79rpx;
|
||||||
|
white-space: nowrap;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.price {
|
||||||
|
width: 100%;
|
||||||
|
margin-bottom: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.right_goods_msg {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
justify-content: space-between;
|
||||||
|
align-items: flex-end;
|
||||||
|
|
||||||
|
.num {
|
||||||
|
font-size: 24.56rpx;
|
||||||
|
color: $uni-theme-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
.purchase_btn {
|
||||||
|
color: #fff;
|
||||||
|
padding: 7.02rpx 21.05rpx;
|
||||||
|
background: $uni-theme-color;
|
||||||
|
border-radius: 100px;
|
||||||
|
margin-left: 21.05rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.add_goods {
|
||||||
|
text-align: center;
|
||||||
|
width: 180rpx;
|
||||||
|
height: 60rpx;
|
||||||
|
line-height: 60rpx;
|
||||||
|
background: $uni-theme-bg-color;
|
||||||
|
border-radius: 100px;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.bottom_purchase {
|
||||||
|
z-index: 999;
|
||||||
|
position: fixed;
|
||||||
|
left: 50%;
|
||||||
|
bottom: 52.63rpx;
|
||||||
|
transform: translate(-50%);
|
||||||
|
width: 526.32rpx;
|
||||||
|
height: 80.7rpx;
|
||||||
|
text-align: center;
|
||||||
|
line-height: 80.7rpx;
|
||||||
|
border-radius: 100px;
|
||||||
|
background-color: $uni-theme-color;
|
||||||
|
color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.scroll-Y {
|
||||||
|
height: 50vh;
|
||||||
|
width: 90%;
|
||||||
|
margin: auto;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.scroll-view-item {
|
||||||
|
font-size: 36rpx;
|
||||||
|
border-bottom: 1px solid #ccc;
|
||||||
|
|
||||||
|
.scroll_item_top {
|
||||||
|
height: 60px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: flex-start;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
image {
|
||||||
|
width: 50px;
|
||||||
|
height: 50px;
|
||||||
|
margin: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.text {
|
||||||
|
width: 200px;
|
||||||
|
height: 60px;
|
||||||
|
float: left;
|
||||||
|
|
||||||
|
view {
|
||||||
|
height: 30px;
|
||||||
|
overflow: hidden;
|
||||||
|
white-space: nowrap;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
|
||||||
|
text {
|
||||||
|
color: #F84221;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.scroll_item_bon {
|
||||||
|
width: 100%;
|
||||||
|
height: 40px;
|
||||||
|
display: flex;
|
||||||
|
justify-content: flex-end;
|
||||||
|
align-items: center;
|
||||||
|
|
||||||
|
.reduce {
|
||||||
|
width: 30px;
|
||||||
|
height: 30px;
|
||||||
|
text-align: center;
|
||||||
|
color: #BDC4CE;
|
||||||
|
background: #EEEEEE;
|
||||||
|
}
|
||||||
|
|
||||||
|
input {
|
||||||
|
width: 50px;
|
||||||
|
height: 30px;
|
||||||
|
text-align: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.plus {
|
||||||
|
width: 30px;
|
||||||
|
text-align: center;
|
||||||
|
height: 30px;
|
||||||
|
color: #FFFFFF;
|
||||||
|
background: linear-gradient(180deg, #F98649 0%, #F34E45 100%);
|
||||||
|
}
|
||||||
|
|
||||||
|
.on {
|
||||||
|
background-color: #e3e3e3;
|
||||||
|
color: #dedede;
|
||||||
|
}
|
||||||
|
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.btn {
|
||||||
|
width: 100%;
|
||||||
|
height: 50px;
|
||||||
|
background: linear-gradient(84deg, #F98649 0%, #F34E45 100%);
|
||||||
|
border-radius: 24px 24px 24px 24px;
|
||||||
|
line-height: 50px;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
1146
pages/nongKe/supply_chain/purchase_control.vue
Normal file
1146
pages/nongKe/supply_chain/purchase_control.vue
Normal file
File diff suppressed because it is too large
Load Diff
1345
pages/nongKe/supply_chain/shopping_trolley.vue
Normal file
1345
pages/nongKe/supply_chain/shopping_trolley.vue
Normal file
File diff suppressed because it is too large
Load Diff
548
pages/nongKe/supply_chain/supplier-copy.vue
Normal file
548
pages/nongKe/supply_chain/supplier-copy.vue
Normal file
@ -0,0 +1,548 @@
|
|||||||
|
<template>
|
||||||
|
<view class="supplier" :style="{height: winHeight + 'px' }">
|
||||||
|
<!-- <view class="head-wrapper" :style="'top:'+statusBarHeight">
|
||||||
|
<view class="head-menu">
|
||||||
|
<view class='iconfont icon-xiangzuo' @click="returns"></view>
|
||||||
|
<view class="iconfont icon-shouye4" @click="goHome"></view>
|
||||||
|
</view>
|
||||||
|
</view> -->
|
||||||
|
<view class="header_warpper">
|
||||||
|
<!-- <u-swiper :list="swiperList" keyName="img" :autoplay="true" height="491.23rpx"></u-swiper> -->
|
||||||
|
<!-- <view class="head_search flex_a_c">
|
||||||
|
<view class="search_content flex_a_c_j_sb">
|
||||||
|
<view class="flex_a_c">
|
||||||
|
<view class="iconfont icon-sousuo"></view>
|
||||||
|
<input type="text" v-model="sotreParam.keyword" placeholder="请搜索">
|
||||||
|
</view>
|
||||||
|
<button class="search_btn" @click="searchStoreMerchant">搜索</button>
|
||||||
|
</view>
|
||||||
|
</view> -->
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="con-box">
|
||||||
|
<view class="left_classify">
|
||||||
|
<scroll-view scroll-y="true" style="height: 100%; overflow: hidden;" scroll-with-animation='true'>
|
||||||
|
<block v-for="(item,index) in merList" :key="item.merchant_category_id">
|
||||||
|
<view class="clify_item" :class="activeTwo === index ? 'pictch' : ''" @click="classifyClick(item, index)">
|
||||||
|
{{ item.category_name }}
|
||||||
|
</view>
|
||||||
|
</block>
|
||||||
|
</scroll-view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<view class="right_storee">
|
||||||
|
<scroll-view scroll-y="true" style="height: 100%; overflow: hidden;" scroll-with-animation='true'
|
||||||
|
@scrolltolower="scrolltolower" class="my-scroll-view">
|
||||||
|
<image class="banner" :src="src" mode="aspectFit"></image>
|
||||||
|
<view style="background-color: #fff;width: 100%;">
|
||||||
|
<view class="tabs_box flex_a_c_j_sb">
|
||||||
|
<view v-for="(item,index) in tabsList" :key="index" class="flex_a_c" :class="active==index?'active':''">
|
||||||
|
<view @click="tabsChange(index)">{{item}}</view>
|
||||||
|
<!-- <view class="iconfont icon-shaixuan" v-if="index==3"></view> -->
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
|
<block v-for="(item,index) in storeMerchant" :key="index">
|
||||||
|
<storeCard :store_item="item" :category="item.category_name" :isDetail="isDetail"></storeCard>
|
||||||
|
</block>
|
||||||
|
<u-loadmore :status="status" :loading-text="loadingText" :loadmore-text="loadmoreText"
|
||||||
|
:nomore-text="nomoreText" />
|
||||||
|
</scroll-view>
|
||||||
|
</view>
|
||||||
|
|
||||||
|
</view>
|
||||||
|
|
||||||
|
<!-- <u-action-sheet :show="show" @close="close" @select="select" :actions="actions" :closeOnClickOverlay="true">
|
||||||
|
</u-action-sheet>
|
||||||
|
<rightSlider v-if="rightBox" :status="rightBox" :merList="merList" :storeTypeArr="storeTypeArr" @confirm="confirm"
|
||||||
|
@close="rightSliderClose"></rightSlider> -->
|
||||||
|
</view>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
var statusBarHeight = uni.getSystemInfoSync().statusBarHeight + 'px';
|
||||||
|
import storeCard from './component/shop_card.vue'
|
||||||
|
import rightSlider from './component/rightSlider';
|
||||||
|
import { getDiy } from '@/api/api.js'
|
||||||
|
import { storeMerchantList, merClassifly, getStoreTypeApi } from '@/api/store.js'
|
||||||
|
import { storeClassifyDel } from '@/api/product.js'
|
||||||
|
export default {
|
||||||
|
components: {
|
||||||
|
rightSlider,
|
||||||
|
storeCard
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
statusBarHeight: statusBarHeight, //系统导航条高度
|
||||||
|
swiperList: [],
|
||||||
|
activeTwo: 0,
|
||||||
|
winHeight: 0,
|
||||||
|
num: '',
|
||||||
|
status: 'loadmore',
|
||||||
|
loadingText: '努力加载中',
|
||||||
|
loadmoreText: '轻轻上拉',
|
||||||
|
nomoreText: '我也是有底线的~~',
|
||||||
|
show: false,
|
||||||
|
actions: [{
|
||||||
|
name: '选项1',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '选项2',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '选项3',
|
||||||
|
}, {
|
||||||
|
name: '选项4',
|
||||||
|
},
|
||||||
|
{
|
||||||
|
name: '选项5',
|
||||||
|
},
|
||||||
|
],
|
||||||
|
src: 'https://cdn.uviewui.com/uview/album/1.jpg',
|
||||||
|
search: '',
|
||||||
|
tabsList: ['综合排序', '销量优先', '好评'],
|
||||||
|
active: 0,
|
||||||
|
storeMerchant: [],
|
||||||
|
storeList: {
|
||||||
|
page: 1,
|
||||||
|
limit: 10
|
||||||
|
},
|
||||||
|
StoreType: [],
|
||||||
|
rightBox: false,
|
||||||
|
merList: [], //商户分类
|
||||||
|
storeTypeArr: [], //店铺类型
|
||||||
|
sotreParam: {
|
||||||
|
keyword: '',
|
||||||
|
page: 1,
|
||||||
|
limit: 10,
|
||||||
|
order: 'order', // 顺序
|
||||||
|
category_id: '', // 分类
|
||||||
|
type_id: '', // 类型
|
||||||
|
street_id: '' // 位置
|
||||||
|
},
|
||||||
|
isDetail: 2
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onLoad(e) {
|
||||||
|
this.sotreParam.street_id = e.street_id
|
||||||
|
if (e.type_id) {
|
||||||
|
this.sotreParam.type_id = e.type_id
|
||||||
|
}
|
||||||
|
if (e.isDetail) this.isDetail = e.isDetail
|
||||||
|
this.getStoreMerchant()
|
||||||
|
this.getStore()
|
||||||
|
this.getClassfication()
|
||||||
|
this.getStoreType()
|
||||||
|
this.getBanner()
|
||||||
|
uni.getSystemInfo({
|
||||||
|
success: (res) => {
|
||||||
|
this.winHeight = res.windowHeight
|
||||||
|
this.$set(this, 'winHeight', res.windowHeight)
|
||||||
|
},
|
||||||
|
});
|
||||||
|
},
|
||||||
|
onShow() {},
|
||||||
|
methods: {
|
||||||
|
// 后退
|
||||||
|
returns: function() {
|
||||||
|
uni.navigateBack()
|
||||||
|
},
|
||||||
|
// 首页
|
||||||
|
goHome() {
|
||||||
|
uni.switchTab({
|
||||||
|
url: '/pages/home/index'
|
||||||
|
});
|
||||||
|
},
|
||||||
|
async getBanner() {
|
||||||
|
const { data } = await getDiy({ id: 0 })
|
||||||
|
if (data.value['1683638943100000']) {
|
||||||
|
this.swiperList = data.value['1683638943100000'].swiperConfig.list
|
||||||
|
} else {
|
||||||
|
this.swiperList = data.value['1683875164005000'].swiperConfig.list
|
||||||
|
}
|
||||||
|
},
|
||||||
|
classifyClick(item, index) {
|
||||||
|
this.activeTwo = index
|
||||||
|
this.storeMerchant = []
|
||||||
|
this.sotreParam.page = 1
|
||||||
|
this.sotreParam.category_id = item.merchant_category_id
|
||||||
|
this.getStoreMerchant();
|
||||||
|
},
|
||||||
|
// 获取商户分类
|
||||||
|
getClassfication: function() {
|
||||||
|
let temp = []
|
||||||
|
merClassifly()
|
||||||
|
.then(res => {
|
||||||
|
temp = res.data.map(item => {
|
||||||
|
return {
|
||||||
|
...item,
|
||||||
|
check: false
|
||||||
|
}
|
||||||
|
})
|
||||||
|
if (this.sotreParam.category_id.length > 0) {
|
||||||
|
this.sotreParam.category_id.forEach((ids, index) => {
|
||||||
|
temp.forEach(el => {
|
||||||
|
if (ids == el.merchant_category_id) {
|
||||||
|
el.check = true
|
||||||
|
}
|
||||||
|
})
|
||||||
|
})
|
||||||
|
}
|
||||||
|
temp.unshift({
|
||||||
|
category_name: '全部',
|
||||||
|
merchant_category_id: ''
|
||||||
|
})
|
||||||
|
this.merList = temp
|
||||||
|
})
|
||||||
|
.catch(res => {
|
||||||
|
this.$util.Tips({
|
||||||
|
title: res
|
||||||
|
});
|
||||||
|
});
|
||||||
|
},
|
||||||
|
// 获取店铺类型
|
||||||
|
getStoreType: function() {
|
||||||
|
let temp = []
|
||||||
|
getStoreTypeApi()
|
||||||
|
.then(res => {
|
||||||
|
temp = res.data.map(item => {
|
||||||
|
return {
|
||||||
|
...item,
|
||||||
|
check: false
|
||||||
|
}
|
||||||
|
})
|
||||||
|
if (this.sotreParam.type_id.length > 0) {
|
||||||
|
this.sotreParam.type_id.forEach((ids, index) => {
|
||||||
|
temp.forEach(el => {
|
||||||
|
if (ids == el.mer_type_id) {
|
||||||
|
el.check = true
|
||||||
|
}
|
||||||
|
})
|
||||||
|
})
|
||||||
|
}
|
||||||
|
this.storeTypeArr = temp
|
||||||
|
})
|
||||||
|
.catch(res => {
|
||||||
|
this.$util.Tips({
|
||||||
|
title: res
|
||||||
|
});
|
||||||
|
});
|
||||||
|
},
|
||||||
|
|
||||||
|
// 组件确定
|
||||||
|
confirm(data) {
|
||||||
|
let arr1 = [],
|
||||||
|
arr2 = []
|
||||||
|
if (data.storeTypeArr.length == 0) {
|
||||||
|
this.sotreParam.type_id = ''
|
||||||
|
} else {
|
||||||
|
data.storeTypeArr.forEach(item => {
|
||||||
|
arr1.push(item.mer_type_id)
|
||||||
|
})
|
||||||
|
this.sotreParam.type_id = arr1.toString();
|
||||||
|
}
|
||||||
|
if (data.merList.length == 0) {
|
||||||
|
this.sotreParam.category_id = ''
|
||||||
|
} else {
|
||||||
|
data.merList.forEach(item => {
|
||||||
|
arr2.push(item.merchant_category_id)
|
||||||
|
})
|
||||||
|
this.sotreParam.category_id = arr2.toString();
|
||||||
|
}
|
||||||
|
this.rightBox = data.status
|
||||||
|
this.loadend = false;
|
||||||
|
this.$set(this.sotreParam, 'page', 1)
|
||||||
|
this.storeList = [];
|
||||||
|
this.getStoreMerchant();
|
||||||
|
},
|
||||||
|
// 组件关闭
|
||||||
|
rightSliderClose() {
|
||||||
|
this.rightBox = false
|
||||||
|
},
|
||||||
|
//获取商户
|
||||||
|
async getStoreMerchant() {
|
||||||
|
const res = await storeMerchantList(this.sotreParam)
|
||||||
|
this.storeMerchant.push(...res.data.list)
|
||||||
|
// console.log(this.storeMerchant);
|
||||||
|
if (res.data.list.length < 10) this.status = 'nomore'
|
||||||
|
},
|
||||||
|
async searchStoreMerchant() {
|
||||||
|
this.storeMerchant = []
|
||||||
|
const res = await storeMerchantList(this.sotreParam)
|
||||||
|
this.storeMerchant = res.data.list
|
||||||
|
},
|
||||||
|
navigator(id) {
|
||||||
|
uni.navigateTo({
|
||||||
|
url: `/pages/nongKe/supply_chain/merchant?id=${id}`
|
||||||
|
})
|
||||||
|
},
|
||||||
|
//获取商户类型分类
|
||||||
|
async getStore() {
|
||||||
|
const res = await merClassifly()
|
||||||
|
for (let i = 0; i < res.data.length; i++) {
|
||||||
|
this.actions[i].name = res.data[i].category_name
|
||||||
|
this.actions[i].index = res.data[i].merchant_category_id
|
||||||
|
}
|
||||||
|
},
|
||||||
|
tabsChange(i) {
|
||||||
|
this.active = i
|
||||||
|
// this.sotreParam.category_id = ''
|
||||||
|
// this.sotreParam.type_id = ''
|
||||||
|
this.sotreParam.page = 1
|
||||||
|
this.storeMerchant = []
|
||||||
|
if (this.active == 0) {
|
||||||
|
this.sotreParam.order = ''
|
||||||
|
this.getStoreMerchant()
|
||||||
|
}
|
||||||
|
if (this.active == 1) {
|
||||||
|
this.sotreParam.order = 'sales'
|
||||||
|
this.getStoreMerchant()
|
||||||
|
}
|
||||||
|
if (this.active == 2) {
|
||||||
|
this.sotreParam.order = 'rate'
|
||||||
|
this.getStoreMerchant()
|
||||||
|
}
|
||||||
|
//筛选
|
||||||
|
if (this.active == 3) {
|
||||||
|
this.status = 'nomore'
|
||||||
|
this.rightBox = true
|
||||||
|
// this.sotreParam.order = ''
|
||||||
|
// this.getStoreMerchant()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
close() {
|
||||||
|
this.show = false
|
||||||
|
},
|
||||||
|
select(e) {
|
||||||
|
// console.log('select', e);
|
||||||
|
|
||||||
|
},
|
||||||
|
scrolltolower() {
|
||||||
|
if (this.status != 'nomore') {
|
||||||
|
this.sotreParam.page++
|
||||||
|
this.getStoreMerchant()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onReachBottom() {
|
||||||
|
//如果状态为nomore 则不能在触发上拉事件
|
||||||
|
if (this.status != 'nomore') {
|
||||||
|
this.sotreParam.page++
|
||||||
|
this.getStoreMerchant()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
onPullDownRefresh() {
|
||||||
|
this.storeMerchant = []
|
||||||
|
this.getStoreMerchant()
|
||||||
|
uni.stopPullDownRefresh()
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="scss">
|
||||||
|
.supplier {
|
||||||
|
display: flex;
|
||||||
|
flex-direction: column;
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.header_warpper {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
.head_search {
|
||||||
|
width: 100%;
|
||||||
|
background-color: #fff;
|
||||||
|
height: 108.77rpx;
|
||||||
|
|
||||||
|
.search_content {
|
||||||
|
margin: 0 auto;
|
||||||
|
width: 694.74rpx;
|
||||||
|
height: 66.67rpx;
|
||||||
|
padding: 2px 2px 2px 21.05rpx;
|
||||||
|
border: 1px solid $uni-theme-color;
|
||||||
|
border-radius: 100px;
|
||||||
|
|
||||||
|
.icon-sousuo {
|
||||||
|
font-weight: bold;
|
||||||
|
color: $uni-theme-color;
|
||||||
|
margin-right: 17.54rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.search_btn {
|
||||||
|
color: #fff;
|
||||||
|
width: 135.09rpx;
|
||||||
|
height: 59.65rpx;
|
||||||
|
line-height: 59.65rpx;
|
||||||
|
background: $uni-theme-bg-color;
|
||||||
|
border-radius: 100px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.con-box {
|
||||||
|
flex: 1;
|
||||||
|
display: flex;
|
||||||
|
overflow: hidden;
|
||||||
|
margin-top: 28.07rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.left_classify {
|
||||||
|
width: 192.98rpx;
|
||||||
|
height: 100%;
|
||||||
|
overflow-y: auto;
|
||||||
|
overflow-x: hidden;
|
||||||
|
overflow: hidden;
|
||||||
|
|
||||||
|
.clify_item {
|
||||||
|
width: 192.98rpx;
|
||||||
|
height: 112.28rpx;
|
||||||
|
text-align: center;
|
||||||
|
line-height: 112.28rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.pictch {
|
||||||
|
background: #fff;
|
||||||
|
font-weight: 700;
|
||||||
|
position: relative;
|
||||||
|
|
||||||
|
&::before {
|
||||||
|
position: absolute;
|
||||||
|
left: 0;
|
||||||
|
top: 0;
|
||||||
|
content: '';
|
||||||
|
display: inline-block;
|
||||||
|
width: 3px;
|
||||||
|
height: 100%;
|
||||||
|
background-color: #F84221;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.right_storee {
|
||||||
|
flex: 1;
|
||||||
|
width: 557.89rpx;
|
||||||
|
height: 100%;
|
||||||
|
overflow-y: auto;
|
||||||
|
overflow-x: hidden;
|
||||||
|
overflow: hidden;
|
||||||
|
padding: 0 12.28rpx;
|
||||||
|
background-color: #fff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.banner {
|
||||||
|
width: 100%;
|
||||||
|
height: 131.58rpx;
|
||||||
|
border-radius: 5px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.tabs_box {
|
||||||
|
width: 100%;
|
||||||
|
margin: 0 auto;
|
||||||
|
height: 80.7rpx;
|
||||||
|
border-top: 1px solid #E7E6E4;
|
||||||
|
background-color: #fff;
|
||||||
|
padding: 0 21.05rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.active {
|
||||||
|
font-weight: 700;
|
||||||
|
color: #F84221;
|
||||||
|
}
|
||||||
|
|
||||||
|
.item_cont {
|
||||||
|
width: 100%;
|
||||||
|
// height: 147.37rpx;
|
||||||
|
padding: 17.54rpx 28.07rpx;
|
||||||
|
background-color: #fff;
|
||||||
|
margin-top: 28.07rpx;
|
||||||
|
border-radius: 8px;
|
||||||
|
|
||||||
|
.item-left {
|
||||||
|
.img {
|
||||||
|
width: 98.25rpx;
|
||||||
|
height: 98.25rpx;
|
||||||
|
border-radius: 100px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.item-right {
|
||||||
|
margin-left: 21.05rpx;
|
||||||
|
|
||||||
|
.store_name {
|
||||||
|
margin-bottom: 8.77rpx;
|
||||||
|
|
||||||
|
.sales_volume {
|
||||||
|
font-size: 28.07rpx;
|
||||||
|
color: #666;
|
||||||
|
margin-left: 52.63rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
.name {
|
||||||
|
flex: 1;
|
||||||
|
width: 245.61rpx;
|
||||||
|
font-size: 31.58rpx;
|
||||||
|
// font-weight: bold;
|
||||||
|
white-space: nowrap;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.msg {
|
||||||
|
|
||||||
|
.category_name {
|
||||||
|
color: $uni-theme-color;
|
||||||
|
}
|
||||||
|
|
||||||
|
.scope {
|
||||||
|
flex: 1;
|
||||||
|
width: 350.88rpx;
|
||||||
|
white-space: nowrap;
|
||||||
|
overflow: hidden;
|
||||||
|
text-overflow: ellipsis;
|
||||||
|
|
||||||
|
&::before {
|
||||||
|
content: '|';
|
||||||
|
margin: 0 10.53rpx;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
.head-wrapper {
|
||||||
|
z-index: 999;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
position: fixed;
|
||||||
|
left: 30rpx;
|
||||||
|
top: 0;
|
||||||
|
/* #ifdef MP */
|
||||||
|
height: 43px;
|
||||||
|
/* #endif */
|
||||||
|
/* #ifdef H5 */
|
||||||
|
height: 114rpx;
|
||||||
|
/* #endif */
|
||||||
|
}
|
||||||
|
|
||||||
|
.head-menu {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
height: 54rpx;
|
||||||
|
width: 140rpx;
|
||||||
|
background: rgba(0, 0, 0, .25);
|
||||||
|
border-radius: 27rpx;
|
||||||
|
|
||||||
|
.iconfont {
|
||||||
|
flex: 1;
|
||||||
|
text-align: center;
|
||||||
|
color: #fff;
|
||||||
|
box-sizing: border-box;
|
||||||
|
|
||||||
|
&.icon-xiangzuo {
|
||||||
|
border-right: 1px solid #fff;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
</style>
|
||||||
1580
pages/nongKe/supply_chain/supplier.vue
Normal file
1580
pages/nongKe/supply_chain/supplier.vue
Normal file
File diff suppressed because it is too large
Load Diff
Some files were not shown because too many files have changed in this diff Show More
Loading…
x
Reference in New Issue
Block a user