首页,我的 写扫码点餐之前提交1.0.0
This commit is contained in:
wwz
parent
6cea5aeb42
commit
f2513ef13a
76
App.vue
76
App.vue
|
|
@ -1,15 +1,79 @@
|
|||
<script>
|
||||
<script setup>
|
||||
import {
|
||||
useNavbarStore
|
||||
} from '@/stores/navbarStore';
|
||||
export default {
|
||||
onLaunch: function() {
|
||||
import {
|
||||
APIgeocodelocation
|
||||
} from "@/common/api/api.js"
|
||||
import {
|
||||
onLaunch
|
||||
} from '@dcloudio/uni-app';
|
||||
import {
|
||||
getCurrentInstance
|
||||
} from 'vue'
|
||||
const {
|
||||
proxy
|
||||
} = getCurrentInstance()
|
||||
// 小程序启动时执行
|
||||
onLaunch(async () => {
|
||||
// 标记应用启动完成
|
||||
const store = useNavbarStore();
|
||||
store.initNavbarHeight();
|
||||
},
|
||||
onShow: function() {},
|
||||
onHide: function() {}
|
||||
try {
|
||||
uni.getLocation({
|
||||
type: 'wgs84',
|
||||
success: async (res) => {
|
||||
let successres = await APIgeocodelocation({
|
||||
lng: res.longitude,
|
||||
lat: res.latitude,
|
||||
})
|
||||
if (successres.code == 0) {
|
||||
let datastorage = {
|
||||
country: successres.data.addressComponent.country, // "中国"
|
||||
province: successres.data.addressComponent
|
||||
.province, //province: "陕西省"
|
||||
address: successres.data.addressComponent.city, //district: "西安市"
|
||||
district: successres.data.addressComponent
|
||||
.district, //district: "未央区"
|
||||
lng: res.longitude,
|
||||
lat: res.latitude,
|
||||
}
|
||||
uni.cache.set('getLocationstorage', datastorage);
|
||||
proxy.$isResolve()
|
||||
}
|
||||
},
|
||||
|
||||
});
|
||||
} catch (error) {
|
||||
let successres = await APIgeocodelocation({
|
||||
lng: '',
|
||||
lat: '',
|
||||
})
|
||||
if (successres.code == 0) {
|
||||
let datastorage = {
|
||||
country: successres.data.addressComponent.country, // "中国"
|
||||
province: successres.data.addressComponent
|
||||
.province, //province: "陕西省"
|
||||
address: successres.data.addressComponent.city, //district: "西安市"
|
||||
district: successres.data.addressComponent
|
||||
.district, //district: "未央区"
|
||||
lng: res.longitude,
|
||||
lat: res.latitude,
|
||||
}
|
||||
uni.cache.set('getLocationstorage', datastorage);
|
||||
proxy.$isResolve()
|
||||
}
|
||||
}
|
||||
});
|
||||
|
||||
// export default {
|
||||
// onLaunch: async function() {
|
||||
|
||||
|
||||
// },
|
||||
// onShow: function() {},
|
||||
// onHide: function() {}
|
||||
// }
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
|
|
|
|||
|
|
@ -0,0 +1,20 @@
|
|||
// 引入 request 文件
|
||||
import request from '@/common/api/request.js'
|
||||
|
||||
//根据经纬度获取信息
|
||||
export const APIgeocodelocation = (data) => {
|
||||
return request({
|
||||
url: '/location/geocode',
|
||||
method: 'get',
|
||||
data: data,
|
||||
toast: false
|
||||
})
|
||||
}
|
||||
//根据经纬度获取信息
|
||||
export const APIcustomlogin = (data) => {
|
||||
return request({
|
||||
url: '/login/auth/custom/login',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
|
@ -0,0 +1,27 @@
|
|||
// 引入 request 文件
|
||||
import request from '@/common/api/request.js'
|
||||
//获取优惠券参数列表
|
||||
export const APIordergetYhqPara = (data) => {
|
||||
return request({
|
||||
url: '/order/getYhqPara',
|
||||
method: 'get',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
//系统优惠券
|
||||
export const APIorderfindCoupons = (data) => {
|
||||
return request({
|
||||
url: '/order/findCoupons',
|
||||
method: 'get',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
// 我的优惠券
|
||||
export const APIordermineCoupons = (data) => {
|
||||
return request({
|
||||
url: '/order/mineCoupons',
|
||||
method: 'post',
|
||||
data: data,
|
||||
toast: false
|
||||
})
|
||||
}
|
||||
|
|
@ -0,0 +1,46 @@
|
|||
// 引入 request 文件
|
||||
import request from '@/common/api/request.js'
|
||||
//首页上半部分
|
||||
export const APIhomehomePageUp = (data) => {
|
||||
return request({
|
||||
url: '/home/homePageUp',
|
||||
method: 'post',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
//首页上半部分
|
||||
export const APIhome = (data) => {
|
||||
return request({
|
||||
url: '/home',
|
||||
method: 'post',
|
||||
data: data,
|
||||
toast: false
|
||||
})
|
||||
}
|
||||
//首页上半部分
|
||||
export const APIshopUserInfo = (data) => {
|
||||
return request({
|
||||
url: '/user/shopUserInfo',
|
||||
method: 'get',
|
||||
data: data,
|
||||
toast: false
|
||||
})
|
||||
}
|
||||
//首页上半部分
|
||||
export const APIgeocodelocation = (data) => {
|
||||
return request({
|
||||
url: '/location/geocode',
|
||||
method: 'get',
|
||||
data: data,
|
||||
toast: false
|
||||
})
|
||||
}
|
||||
///商户登录后 shopId和autokey
|
||||
export const APIshopExtend = (data) => {
|
||||
return request({
|
||||
url: '/common/shopExtend',
|
||||
method: 'post',
|
||||
data: data,
|
||||
toast: false
|
||||
})
|
||||
}
|
||||
|
|
@ -0,0 +1,18 @@
|
|||
// 引入 request 文件
|
||||
import request from '@/common/api/request.js'
|
||||
//获取top部分(店铺列表)
|
||||
export const APIdistiricttopCommon = (data) => {
|
||||
return request({
|
||||
url: '/distirict/topCommon',
|
||||
method: 'get',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
//预约到店(店铺列表)
|
||||
export const APIdistirictsubShopList = (data) => {
|
||||
return request({
|
||||
url: '/distirict/subShopList',
|
||||
method: 'get',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
|
@ -0,0 +1,11 @@
|
|||
// 引入 request 文件
|
||||
import request from '@/common/api/request.js'
|
||||
|
||||
//通过桌码获取店铺信息
|
||||
export const APIproductqueryShop = (data) => {
|
||||
return request({
|
||||
url: '/product/queryShop',
|
||||
method: 'get',
|
||||
data: data
|
||||
})
|
||||
}
|
||||
|
|
@ -0,0 +1,115 @@
|
|||
export default (params) => {
|
||||
let url = params.url;
|
||||
let method = params.method || "get";
|
||||
let data = params.data || {};
|
||||
let type = params.type || 1;
|
||||
let toast = params.toast || true;
|
||||
let header = {
|
||||
version: uni.conf.version,
|
||||
type: uni.getSystemInfoSync().platform,
|
||||
// #ifdef APP-PLUS
|
||||
environment: 'app',
|
||||
// #endif
|
||||
// #ifdef H5
|
||||
environment: 'H5',
|
||||
// #endif
|
||||
// #ifdef MP-WEIXIN
|
||||
environment: 'wx',
|
||||
// #endif
|
||||
// #ifdef MP-ALIPAY
|
||||
environment: 'alipay',
|
||||
// #endif
|
||||
token: uni.cache.get('token'),
|
||||
openId: uni.cache.get('miniAppOpenId'),
|
||||
id: uni.cache.get('userInfo').id,
|
||||
shopId: uni.cache.get('shopId'),
|
||||
userId: uni.cache.get('userInfo').id,
|
||||
}
|
||||
if (toast) {
|
||||
uni.showLoading({
|
||||
title: '加载中',
|
||||
mask: true
|
||||
})
|
||||
}
|
||||
return new Promise((resolve, reject) => {
|
||||
uni.request({
|
||||
url: uni.conf.baseUrl + url,
|
||||
method: method,
|
||||
header: header,
|
||||
data: data,
|
||||
success(response) {
|
||||
const res = response.data
|
||||
// 根据返回的状态码做出对应的操作
|
||||
//获取成功
|
||||
if (res.code == 0) {
|
||||
uni.hideLoading();
|
||||
uni.hideToast();
|
||||
resolve(res);
|
||||
} else {
|
||||
switch (res.code) {
|
||||
case '-4':
|
||||
resolve(res)
|
||||
// uni.showToast({
|
||||
// title: res.message || res.msg || res.error,
|
||||
// icon: "none",
|
||||
// success: () => {
|
||||
// setTimeout(() => {
|
||||
// uni.reLaunch({
|
||||
// url: "/pages/login/index",
|
||||
// })
|
||||
// }, 1000);
|
||||
// }
|
||||
// })
|
||||
break;
|
||||
case 404:
|
||||
uni.showToast({
|
||||
title: '请求地址不存在...',
|
||||
duration: 2000,
|
||||
})
|
||||
break;
|
||||
default:
|
||||
// 是否提示
|
||||
console.log(res)
|
||||
if (toast) {
|
||||
uni.showToast({
|
||||
title: res.message || res.msg || res.error,
|
||||
icon: "none",
|
||||
success: () => {
|
||||
setTimeout(res => {
|
||||
|
||||
}, 2000)
|
||||
}
|
||||
})
|
||||
}
|
||||
break;
|
||||
}
|
||||
}
|
||||
},
|
||||
fail(err) {
|
||||
console.log(err)
|
||||
if (err.errMsg.indexOf('request:fail') !== -1) {
|
||||
uni.showToast({
|
||||
title: '网络异常',
|
||||
icon: "error",
|
||||
duration: 2000
|
||||
})
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '未知异常',
|
||||
duration: 2000
|
||||
})
|
||||
}
|
||||
reject(err);
|
||||
|
||||
},
|
||||
complete() {
|
||||
// 不管成功还是失败都会执行
|
||||
setTimeout(res => {
|
||||
uni.hideLoading();
|
||||
uni.hideToast();
|
||||
}, 10000)
|
||||
|
||||
}
|
||||
});
|
||||
}).catch((e) => {});
|
||||
};
|
||||
|
|
@ -3,18 +3,17 @@ export default {
|
|||
return uni.api.post("/login/auth/custom/login", data);
|
||||
},
|
||||
loginwxuserInfo(data) { //获取用户详情
|
||||
return uni.api.get("/login/userInfo", data,false);
|
||||
return uni.api.get("/login/userInfo", data, false);
|
||||
},
|
||||
userwxlogins(data) { // 获取手机号
|
||||
console.log(data)
|
||||
return uni.api.post("/login/getPhoneNumber", data);
|
||||
},
|
||||
getShopExtend(data) { //获取图片 通过shopId和autokey
|
||||
return uni.api.post("/common/shopExtend", data,false);
|
||||
return uni.api.post("/common/shopExtend", data, false);
|
||||
},
|
||||
// 获取弹窗广告列表
|
||||
getPopUpAd(data) {
|
||||
return uni.api.get("/tbShopAd/list", data,false);
|
||||
return uni.api.get("/tbShopAd/list", data, false);
|
||||
},
|
||||
logincreateCardNo(data) { //获取会员码
|
||||
return uni.api.get("/login/createCardNo", data);
|
||||
|
|
@ -23,7 +22,7 @@ export default {
|
|||
return uni.api.get("/product/queryShop", data);
|
||||
},
|
||||
productChoseCount(data) { //就餐人数选择
|
||||
return uni.api.post("/product/choseCount", data,false);
|
||||
return uni.api.post("/product/choseCount", data, false);
|
||||
},
|
||||
productqueryProduct(data) { //获取商品信息
|
||||
return uni.api.post("/product/queryProduct", data, false);
|
||||
|
|
@ -77,7 +76,7 @@ export default {
|
|||
return uni.api.get("/order/orderList", data);
|
||||
},
|
||||
orderorderInfo(data) { //订单回显
|
||||
return uni.api.get("/order/orderInfo", data ,false);
|
||||
return uni.api.get("/order/orderInfo", data, false);
|
||||
},
|
||||
removeOrder(data) { //删除订单
|
||||
return uni.api.post("/order/rmOrder", data);
|
||||
|
|
@ -107,7 +106,7 @@ export default {
|
|||
|
||||
// 获取店铺会员信息
|
||||
shopUserInfo(data) {
|
||||
return uni.api.get("/user/shopUserInfo", data,false);
|
||||
return uni.api.get("/user/shopUserInfo", data, false);
|
||||
},
|
||||
// 注册会员
|
||||
openMember(data) {
|
||||
|
|
@ -273,7 +272,7 @@ export default {
|
|||
* @param {Object} data
|
||||
*/
|
||||
setSubMsg(data) {
|
||||
return uni.api.post("/callTable/subMsg", data,false);
|
||||
return uni.api.post("/callTable/subMsg", data, false);
|
||||
},
|
||||
|
||||
/**
|
||||
|
|
|
|||
|
|
@ -1,34 +0,0 @@
|
|||
export default {
|
||||
|
||||
/**
|
||||
* 获取排号信息
|
||||
* @param {Object} param
|
||||
*/
|
||||
getQueueUpList(param) {
|
||||
return uni.api.get("/callTable/queue", param);
|
||||
},
|
||||
|
||||
/**
|
||||
* 获取桌型列表
|
||||
* @param {Object} param
|
||||
*/
|
||||
getQueueUpTablList(param) {
|
||||
return uni.api.get("/callTable", param);
|
||||
},
|
||||
|
||||
/**
|
||||
* 取号
|
||||
* @param {Object} data
|
||||
*/
|
||||
getTakeNumber(data) {
|
||||
return uni.api.post("/callTable/takeNumber", data, false);
|
||||
},
|
||||
|
||||
/**
|
||||
* 取消排号
|
||||
* @param {Object} data
|
||||
*/
|
||||
cancelTakeNumber(data) {
|
||||
return uni.api.post("/callTable", data, false);
|
||||
},
|
||||
}
|
||||
|
|
@ -2,20 +2,20 @@
|
|||
<view>
|
||||
<!-- 占位高度 -->
|
||||
<view v-if="hasPlaceholder" :style="{ height: `${height}px` }"></view>
|
||||
<view class="navbar" :style="[centerContentStyle,navbarStyle]">
|
||||
<view class="navbar" :style="[centerContentStyle.oneStyle,navbarStyle]">
|
||||
<!-- 左边返回键 -->
|
||||
<view v-if="showBack" @click="goBack" class="back-icon">
|
||||
<up-icon name="arrow-left" color="#606266" size="24"></up-icon>
|
||||
</view>
|
||||
<!-- 中间内容 -->
|
||||
<view class="center-content" >
|
||||
<view class="center-content">
|
||||
<view v-if="showSearch">
|
||||
<view class="navbar_tow_tow flex-start">
|
||||
<input type="text" class="navbar_tow_towinput" v-model="keyword" placeholder="请输入关键字" />
|
||||
<view class="navbar_tow_towview">搜索</view>
|
||||
</view>
|
||||
</view>
|
||||
<view v-else>{{ title }}</view>
|
||||
<view v-else :style="[centerContentStyle.towStyle]">{{ title }}</view>
|
||||
</view>
|
||||
<!-- 右边文字 -->
|
||||
<view v-if="rightText" class="right-text" @click="onRightTextClick">{{ rightText }}</view>
|
||||
|
|
@ -30,6 +30,7 @@
|
|||
} from '@/stores/navbarStore';
|
||||
import {
|
||||
ref,
|
||||
reactive,
|
||||
watch,
|
||||
onMounted,
|
||||
computed
|
||||
|
|
@ -39,13 +40,12 @@
|
|||
const {
|
||||
showBack,
|
||||
rightText,
|
||||
showSearch,
|
||||
title,
|
||||
isTransparent,
|
||||
height,
|
||||
hasPlaceholder
|
||||
} = store;
|
||||
|
||||
const showSearch = computed(() => store.showSearch);
|
||||
const title = computed(() => store.title);
|
||||
const keyword = ref()
|
||||
|
||||
const goBack = () => {
|
||||
|
|
@ -65,23 +65,31 @@
|
|||
};
|
||||
});
|
||||
// 小程序单独胶囊的样式
|
||||
const centerContentStyle = ref({});
|
||||
const centerContentStyle = reactive({
|
||||
oneStyle: {},
|
||||
towStyle: {}
|
||||
});
|
||||
onMounted(() => {
|
||||
// #ifdef MP-WEIXIN
|
||||
const menuButtonInfo = uni.getMenuButtonBoundingClientRect();
|
||||
const systemInfo = uni.getSystemInfoSync();
|
||||
const statusBarHeight = systemInfo.statusBarHeight;
|
||||
console.log(menuButtonInfo)
|
||||
// 计算标题的垂直偏移量
|
||||
// const verticalOffset = menuButtonInfo.top - statusBarHeight;
|
||||
const verticalOffset = menuButtonInfo.top > menuButtonInfo.height ? menuButtonInfo.height : Math.abs(menuButtonInfo.top - menuButtonInfo.height)
|
||||
const verticalOffset = menuButtonInfo.top > menuButtonInfo.height ? menuButtonInfo.height : Math.abs(
|
||||
menuButtonInfo.top - menuButtonInfo.height)
|
||||
const titleHeight = menuButtonInfo.height;
|
||||
centerContentStyle.value = {
|
||||
centerContentStyle.oneStyle = {
|
||||
paddingTop: `${verticalOffset}px`,
|
||||
paddingRight:`${menuButtonInfo.width +20}px`,
|
||||
paddingRight: `${menuButtonInfo.width +20}px`,
|
||||
// paddingTeft: `${menuButtonInfo.width +20}px`,
|
||||
height: `${height}px`,
|
||||
lineHeight: `${height}px`,
|
||||
boxSizing: 'border-box',
|
||||
};
|
||||
centerContentStyle.towStyle = {
|
||||
paddingLeft: `${menuButtonInfo.right - menuButtonInfo.left}px`,
|
||||
};
|
||||
// #endif
|
||||
|
||||
});
|
||||
|
|
@ -13,12 +13,27 @@ function get(key) {
|
|||
}
|
||||
// res = JSON.parse(res)
|
||||
|
||||
if (res.expire > 0 && res.expire < uni.utils.timestamp()) {
|
||||
console.log(res)
|
||||
if (res.__expiretime && res.__expiretime < uni.utils.timestamp()) {
|
||||
remove(key)
|
||||
return ''
|
||||
} else {
|
||||
return res.data
|
||||
try {
|
||||
const parsed = JSON.parse(res);
|
||||
C
|
||||
} catch (e) {
|
||||
return res
|
||||
}
|
||||
// // #ifdef H5
|
||||
// try {
|
||||
// const parsed = JSON.parse(res);
|
||||
// return typeof parsed === 'object' && parsed !== null && !Array.isArray(parsed) ? parsed : ''
|
||||
// } catch (e) {
|
||||
// return res
|
||||
// }
|
||||
// // #endif
|
||||
// // #ifndef H5
|
||||
// return res
|
||||
// // #endif
|
||||
}
|
||||
} catch (e) {
|
||||
return ''
|
||||
|
|
@ -56,13 +71,21 @@ function getStorageData(key) {
|
|||
* @param {Number} expire 指定秒数后过期
|
||||
* @return void
|
||||
*/
|
||||
function set(key, value, expire = 0) {
|
||||
let obj = {
|
||||
data: value, //存储的数据
|
||||
time: Date.now() / 1000, //记录存储的时间戳
|
||||
expire: expire //记录过期时间，单位秒
|
||||
}
|
||||
uni.setStorageSync(key, obj)
|
||||
function set(key, value, expire = uni.conf.default_expire) {
|
||||
let cacheItem = {}
|
||||
cacheItem = value
|
||||
// console.log(cacheItem)
|
||||
// if (expire > 0) {
|
||||
// cacheItem.__expiretime = uni.utils.timestamp() + expire
|
||||
// }
|
||||
// // #ifdef H5
|
||||
// uni.setStorageSync(key, JSON.stringify(cacheItem))
|
||||
// // #endif
|
||||
// // #ifndef H5
|
||||
// uni.setStorageSync(key, cacheItem)
|
||||
// // #endif
|
||||
uni.setStorageSync(key, JSON.stringify(cacheItem))
|
||||
// uni.setStorageSync(key, cacheItem)
|
||||
}
|
||||
|
||||
/**
|
||||
|
|
@ -113,9 +136,9 @@ function removeList(prefix) {
|
|||
|
||||
function _randomRemove() {
|
||||
const info = uni.getStorageInfoSync()
|
||||
if (info.currentSize > 0.7 * info.limitSize
|
||||
|| info.keys.length > uni.conf.autoRemoveCache.count
|
||||
|| info.currentSize > uni.conf.autoRemoveCache.size) {
|
||||
if (info.currentSize > 0.7 * info.limitSize ||
|
||||
info.keys.length > uni.conf.autoRemoveCache.count ||
|
||||
info.currentSize > uni.conf.autoRemoveCache.size) {
|
||||
for (let i = 0; i < 100; i++) {
|
||||
if (info.keys.length < 1) {
|
||||
return
|
||||
|
|
@ -140,9 +163,9 @@ function _removeExpired(key) {
|
|||
|
||||
function _autoRemoveExpired() {
|
||||
const info = uni.getStorageInfoSync()
|
||||
if (info.currentSize > 0.7 * info.limitSize
|
||||
|| info.keys.length > uni.conf.autoRemoveCache.count
|
||||
|| info.currentSize > uni.conf.autoRemoveCache.size) {
|
||||
if (info.currentSize > 0.7 * info.limitSize ||
|
||||
info.keys.length > uni.conf.autoRemoveCache.count ||
|
||||
info.currentSize > uni.conf.autoRemoveCache.size) {
|
||||
if (info.keys && info.keys.length > 0) {
|
||||
info.keys.forEach(key => {
|
||||
_removeExpired(key)
|
||||
|
|
|
|||
|
|
@ -1,66 +0,0 @@
|
|||
export function request(options) {
|
||||
return new Promise((resolve, reject) => {
|
||||
uni.request({
|
||||
url: uni.conf.baseUrl + options.url,
|
||||
data: options.data || {},
|
||||
method: options.method,
|
||||
// 设置请求头，添加版本号
|
||||
header: {
|
||||
'Content-Type': 'application/json;charset=UTF-8',
|
||||
version: uni.conf.version,
|
||||
type: uni.getSystemInfoSync().platform,
|
||||
// #ifdef APP-PLUS
|
||||
environment: 'app',
|
||||
// #endif
|
||||
// #ifdef H5
|
||||
environment: 'h5',
|
||||
// #endif
|
||||
// #ifdef MP-WEIXIN
|
||||
environment: 'wx',
|
||||
// #endif
|
||||
// #ifdef MP-ALIPAY
|
||||
environment: 'alipay',
|
||||
// #endif
|
||||
token: uni.cache.get('token'),
|
||||
openId: uni.cache.get('miniAppOpenId'),
|
||||
id: uni.cache.get('userInfo').id,
|
||||
loginName: "",
|
||||
},
|
||||
success(res) {
|
||||
const data = res.data || res;
|
||||
// 根据项目返回的code判断
|
||||
if (data.code != 0){
|
||||
switch (data.code) {
|
||||
case '200':
|
||||
resolve(data.data);
|
||||
break;
|
||||
case '500':
|
||||
uni.showToast({
|
||||
title: data.message,
|
||||
icon: "none"
|
||||
});
|
||||
reject(false);
|
||||
break;
|
||||
case '400':
|
||||
uni.showToast({
|
||||
title: data.message,
|
||||
icon: "none"
|
||||
});
|
||||
// 跳转到登录页面等操作
|
||||
reject(false);
|
||||
break;
|
||||
default:
|
||||
reject(false);
|
||||
break;
|
||||
}
|
||||
}else{
|
||||
resolve(data.data);
|
||||
}
|
||||
},
|
||||
fail(res) {
|
||||
// 失败处理
|
||||
reject(res);
|
||||
}
|
||||
});
|
||||
});
|
||||
}
|
||||
27
main.js
27
main.js
|
|
@ -17,16 +17,25 @@ import {
|
|||
createSSRApp
|
||||
} from "vue";
|
||||
import * as Pinia from 'pinia';
|
||||
import { createUnistorage } from './uni_modules/pinia-plugin-unistorage'
|
||||
import {
|
||||
createUnistorage
|
||||
} from './uni_modules/pinia-plugin-unistorage';
|
||||
|
||||
export function createApp() {
|
||||
// 状态管理
|
||||
const app = createSSRApp(App)
|
||||
// 状态管理
|
||||
const store = Pinia.createPinia()
|
||||
// 持久化
|
||||
store.use(createUnistorage())
|
||||
app.use(store)
|
||||
app.use(uviewPlus)
|
||||
// 创建 SSR 应用实例
|
||||
const app = createSSRApp(App);
|
||||
// 创建 Pinia 实例
|
||||
const store = Pinia.createPinia();
|
||||
// 应用 Pinia 持久化插件
|
||||
store.use(createUnistorage());
|
||||
// 使用 Pinia 状态管理
|
||||
app.use(store);
|
||||
// 使用 uviewPlus 插件
|
||||
app.use(uviewPlus);
|
||||
// 配置 $onLaunched 全局属性
|
||||
app.config.globalProperties.$onLaunched = new Promise((resolve) => {
|
||||
app.config.globalProperties.$isResolve = resolve;
|
||||
});
|
||||
return {
|
||||
app,
|
||||
Pinia,
|
||||
|
|
|
|||
67
pages.json
67
pages.json
|
|
@ -14,13 +14,72 @@
|
|||
"navigationBarTitleText": "",
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/index/indexs",
|
||||
"style": {
|
||||
"navigationBarTitleText": "",
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/index/tothestore",
|
||||
"style": {
|
||||
"navigationBarTitleText": "",
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/index/coupons/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "红包中心"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/product/index",
|
||||
"style": {
|
||||
"navigationBarTitleText": "",
|
||||
"navigationStyle": "custom"
|
||||
}
|
||||
},
|
||||
{
|
||||
"path": "pages/user/user",
|
||||
"style": {
|
||||
"navigationBarTitleText": "",
|
||||
"navigationBarBackgroundColor": "#FFD158",
|
||||
"navigationStyle": "custom",
|
||||
"mp-alipay": {
|
||||
"transparentTitle": "always",
|
||||
"titlePenetrate": "YES",
|
||||
"allowsBounceVertical": "NO"
|
||||
}
|
||||
}
|
||||
}
|
||||
],
|
||||
"uniIdRouter": {},
|
||||
"globalStyle": {
|
||||
"navigationBarTextStyle": "black",
|
||||
"navigationBarTitleText": "uni-app",
|
||||
"navigationBarBackgroundColor": "#F8F8F8",
|
||||
"backgroundColor": "#F8F8F8"
|
||||
"navigationBarTitleText": "零点八零",
|
||||
"navigationBarBackgroundColor": "#ffffff",
|
||||
"backgroundColor": "#F2F2F2"
|
||||
},
|
||||
"uniIdRouter": {}
|
||||
"tabBar": {
|
||||
"backgroundColor": "#ffffff",
|
||||
"color": "#999",
|
||||
"selectedColor": "#000",
|
||||
"borderStyle": "white",
|
||||
"list": [{
|
||||
"iconPath": "static/tabbar/1.png",
|
||||
"selectedIconPath": "static/tabbar/1-1.png",
|
||||
"pagePath": "pages/index/index",
|
||||
"text": "首页"
|
||||
},
|
||||
{
|
||||
"iconPath": "static/tabbar/4.png",
|
||||
"selectedIconPath": "static/tabbar/4-1.png",
|
||||
"pagePath": "pages/user/user",
|
||||
"text": "我的"
|
||||
}
|
||||
]
|
||||
}
|
||||
}
|
||||
|
|
@ -0,0 +1,165 @@
|
|||
<template>
|
||||
<view class="AreaSelect flex-start">
|
||||
<!-- 省份选择 -->
|
||||
<view class="selector">
|
||||
<!--{{ selectedProvince ? selectedProvince.name : '请选择省份' }}-->
|
||||
<view v-if="showProvinceList" class="option-list"
|
||||
style="background: #f9f9f9;height: 60vh;border-radius: 0 0 0 20rpx;">
|
||||
<view v-for="(province,index) in provinces" :key="province.code"
|
||||
:style="selectedProvince && provincestyle ==index?'background: #fff;font-weight: bold;':''"
|
||||
@click="selectProvince(province,index)">
|
||||
{{ province.name }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 城市选择，只有选择了省份才显示 -->
|
||||
<view v-if="selectedProvince" class="selector">
|
||||
<!--{{ selectedCity ? selectedCity.name : '请选择城市' }}-->
|
||||
<view v-if="showCityList" class="option-list">
|
||||
<view v-for="(city,index) in cities" :key="city.code"
|
||||
:style="selectedCity && citiesstyle == index?'font-weight: bold;':''"
|
||||
@click="selectCity(city,index)">
|
||||
{{ city.name }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 区县选择，只有选择了城市才显示 -->
|
||||
<view v-if="selectedCity" class="selector" @click="toggleDistrictList">
|
||||
<!--{{ selectedDistrict ? selectedDistrict.name : '请选择区县' }} -->
|
||||
<view v-if="showDistrictList" class="option-list">
|
||||
<view v-for="(district,index) in districts" :key="district.code"
|
||||
:style="selectedDistrict && districtsstyle == index?'font-weight: bold;':''"
|
||||
@click="selectDistrict(district,index)">
|
||||
{{ district.name }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- 输出选中的内容 -->
|
||||
<!-- <view v-if="(selectedProvince &&!selectedCity) || (selectedCity &&!selectedDistrict) || selectedDistrict">
|
||||
你选中的地区是：
|
||||
{{ selectedProvince ? selectedProvince.name : '' }}
|
||||
{{ selectedCity ? selectedCity.name : '' }}
|
||||
{{ selectedDistrict ? selectedDistrict.name : '' }}
|
||||
</view> -->
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {
|
||||
ref,
|
||||
defineEmits
|
||||
} from 'vue';
|
||||
import {
|
||||
cityData
|
||||
} from './cityData.js';
|
||||
const emits = defineEmits(['updateValue']);
|
||||
// 省份列表
|
||||
const provinces = ref(cityData);
|
||||
// 选中的省份
|
||||
const selectedProvince = ref(null);
|
||||
// 显示省份列表
|
||||
const showProvinceList = ref(true);
|
||||
// 城市列表
|
||||
const cities = ref([]);
|
||||
// 选中的城市
|
||||
const selectedCity = ref(null);
|
||||
// 显示城市列表
|
||||
const showCityList = ref(true);
|
||||
// 区县列表
|
||||
const districts = ref([]);
|
||||
// 选中的区县
|
||||
const selectedDistrict = ref(null);
|
||||
// 显示区县列表
|
||||
const showDistrictList = ref(true);
|
||||
|
||||
// 切换省份列表显示状态
|
||||
const toggleProvinceList = () => {
|
||||
showProvinceList.value = !showProvinceList.value;
|
||||
// showCityList.value = false;
|
||||
// showDistrictList.value = false;
|
||||
};
|
||||
// 选择省份 选中状态
|
||||
const provincestyle = ref(null)
|
||||
// 选择省份
|
||||
const selectProvince = (province, index) => {
|
||||
selectedProvince.value = province;
|
||||
cities.value = province.children || [];
|
||||
selectedCity.value = null;
|
||||
districts.value = [];
|
||||
selectedDistrict.value = null;
|
||||
provincestyle.value = index
|
||||
// showProvinceList.value = false;
|
||||
};
|
||||
|
||||
// 切换城市列表显示状态
|
||||
const toggleCityList = () => {
|
||||
showCityList.value = !showCityList.value;
|
||||
// showProvinceList.value = false;
|
||||
// showDistrictList.value = false;
|
||||
};
|
||||
|
||||
// 切换城市列表显示状态
|
||||
const citiesstyle = ref(null)
|
||||
// 选择城市
|
||||
const selectCity = (city, index) => {
|
||||
selectedCity.value = city;
|
||||
districts.value = city.children || [];
|
||||
citiesstyle.value = index
|
||||
if (districts.value.length == 0) {
|
||||
emits('updateValue', selectedCity.value.name ? selectedCity.value.name : '')
|
||||
}
|
||||
// showCityList.value = false;
|
||||
};
|
||||
|
||||
// 切换区县列表显示状态
|
||||
const toggleDistrictList = () => {
|
||||
showDistrictList.value = !showDistrictList.value;
|
||||
// showProvinceList.value = false;
|
||||
// showCityList.value = false;
|
||||
};
|
||||
|
||||
// 切换区县选择
|
||||
const districtsstyle = ref(null)
|
||||
// 选择区县
|
||||
const selectDistrict = (district, index) => {
|
||||
selectedDistrict.value = district;
|
||||
districtsstyle.value = index
|
||||
emits('updateValue', selectedDistrict.value.name ? selectedDistrict.value.name : selectedCity.value.name)
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.AreaSelect {
|
||||
height: 60vh;
|
||||
border-radius: 0 0 20rpx 20rpx;
|
||||
background: #fff;
|
||||
align-items: flex-start;
|
||||
overflow: auto;
|
||||
.selector {
|
||||
position: relative;
|
||||
width: 30%;
|
||||
cursor: pointer;
|
||||
background: #f9f9f9;
|
||||
|
||||
.option-list {
|
||||
position: absolute;
|
||||
top: 100%;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
background-color: #fff;
|
||||
z-index: 1;
|
||||
|
||||
.Selected {}
|
||||
|
||||
view {
|
||||
padding: 16rpx 24rpx;
|
||||
cursor: pointer;
|
||||
|
||||
view:hover {
|
||||
background-color: #f0f0f0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -32,7 +32,10 @@
|
|||
|
||||
<script setup>
|
||||
import {
|
||||
defineProps
|
||||
defineProps,
|
||||
onBeforeUnmount,
|
||||
reactive,
|
||||
defineExpose
|
||||
} from 'vue';
|
||||
const props = defineProps({
|
||||
bannervo: {
|
||||
|
|
@ -48,21 +51,18 @@
|
|||
}] //
|
||||
}
|
||||
});
|
||||
const timersetIntervalnewVal = () => {
|
||||
this.timersetInterval = setInterval(() => {
|
||||
this.endMove()
|
||||
}, 2000);
|
||||
}
|
||||
|
||||
const startMove = () => {
|
||||
this.slideNote.x = e.changedTouches[0] ? e.changedTouches[0].pageX : 0;
|
||||
this.slideNote.y = e.changedTouches[0] ? e.changedTouches[0].pageY : 0;
|
||||
const slideNote = reactive({
|
||||
x: 0,
|
||||
y: 0
|
||||
})
|
||||
const startMove = (e) => {
|
||||
slideNote.x = e.changedTouches[0] ? e.changedTouches[0].pageX : 0;
|
||||
}
|
||||
const endMove = (e) => {
|
||||
// this.itemStyless = []
|
||||
var newList = JSON.parse(JSON.stringify(this.itemStyle))
|
||||
// console.log(newList)
|
||||
// if ((e.changedTouches[0].pageX - this.slideNote.x) < 0) {
|
||||
var newList = props.itemStyle
|
||||
console.log(newList)
|
||||
// if ((e.changedTouches[0].pageX - slideNote.x) < 0) {
|
||||
// 向左滑动
|
||||
var last = [newList.pop()]
|
||||
newList = last.concat(newList)
|
||||
|
|
@ -71,10 +71,36 @@
|
|||
// newList.push(newList[0])
|
||||
// newList.splice(0, 1)
|
||||
// }
|
||||
this.$emit('changeValue', newList);
|
||||
|
||||
this.$forceUpdate();
|
||||
console.log(newList)
|
||||
// this.$emit('changeValue', newList);
|
||||
}
|
||||
|
||||
// 定义定时器变量
|
||||
let timer = null;
|
||||
// 启动定时器
|
||||
const startTimer = () => {
|
||||
timer = setInterval(() => {
|
||||
endMove()
|
||||
}, 1000);
|
||||
};
|
||||
// 定义清除定时器的方法
|
||||
const clearTimer = () => {
|
||||
if (timer) {
|
||||
clearInterval(timer);
|
||||
timer = null;
|
||||
}
|
||||
};
|
||||
// 在组件销毁前清除定时器
|
||||
onBeforeUnmount(() => {
|
||||
clearTimer();
|
||||
});
|
||||
// 向外暴露清除定时器和启动定时器的方法
|
||||
defineExpose({
|
||||
clearTimer,
|
||||
startTimer
|
||||
});
|
||||
// 初始启动定时器
|
||||
// startTimer();
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
|
|
|
|||
|
|
@ -0,0 +1,53 @@
|
|||
// cityData.js
|
||||
export const cityData = [
|
||||
{
|
||||
"name": "北京市",
|
||||
"code": "110000",
|
||||
"children": [
|
||||
{
|
||||
"name": "东城区",
|
||||
"code": "110101",
|
||||
"children": []
|
||||
},
|
||||
{
|
||||
"name": "西城区",
|
||||
"code": "110102",
|
||||
"children": []
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"name": "广东省",
|
||||
"code": "440000",
|
||||
"children": [
|
||||
{
|
||||
"name": "广州市",
|
||||
"code": "440100",
|
||||
"children": [
|
||||
{
|
||||
"name": "天河区",
|
||||
"code": "440106"
|
||||
},
|
||||
{
|
||||
"name": "越秀区",
|
||||
"code": "440104"
|
||||
}
|
||||
]
|
||||
},
|
||||
{
|
||||
"name": "深圳市",
|
||||
"code": "440300",
|
||||
"children": [
|
||||
{
|
||||
"name": "福田区",
|
||||
"code": "440304"
|
||||
},
|
||||
{
|
||||
"name": "南山区",
|
||||
"code": "440305"
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
}
|
||||
];
|
||||
|
|
@ -13,11 +13,16 @@
|
|||
ref,
|
||||
defineProps
|
||||
} from 'vue';
|
||||
import {
|
||||
APIproductqueryShop
|
||||
} from "@/common/api/product/product.js";
|
||||
import {
|
||||
Storelogin
|
||||
} from '@/stores/share.js';
|
||||
const props = defineProps({
|
||||
district: Array
|
||||
});
|
||||
const clickdistrict = (item) => {
|
||||
console.log(item, '调试')
|
||||
switch (item.jumpType) {
|
||||
case 'absolute':
|
||||
uni.pro.navigateTo('webview/webview', {
|
||||
|
|
@ -28,11 +33,7 @@
|
|||
uni.navigateToMiniProgram(JSON.parse(item.value))
|
||||
break;
|
||||
case 'relative':
|
||||
uni.setStorage({
|
||||
key: 'itemData',
|
||||
data: item,
|
||||
});
|
||||
uni.pro.navigateTo(item.absUrl, item.name);
|
||||
uni.pro.navigateTo(item.absUrl);
|
||||
break;
|
||||
case 'scan':
|
||||
if (!uni.utils.pluschooseImage()) {
|
||||
|
|
@ -44,9 +45,19 @@
|
|||
let tableCode = getQueryString(decodeURIComponent(res.result), 'code')
|
||||
uni.cache.set('tableCode', tableCode)
|
||||
if (tableCode) {
|
||||
let data = await this.api.productqueryShop({
|
||||
let data = await APIproductqueryShop({
|
||||
code: uni.cache.get('tableCode'),
|
||||
})
|
||||
// -4请求登录
|
||||
const store = Storelogin();
|
||||
if (data.code == '-4') {
|
||||
if (await store.actionslogin()) {
|
||||
// 成功
|
||||
} else {
|
||||
// 失败接着请求
|
||||
await store.actionslogin()
|
||||
}
|
||||
}
|
||||
if (data.data.shopTableInfo && !data.data.shopTableInfo.choseCount) {
|
||||
uni.pro.navigateTo('/pagesOrder/orderAMeal/index', {
|
||||
tableCode: tableCode,
|
||||
|
|
@ -90,13 +101,16 @@
|
|||
overflow-x: auto;
|
||||
flex-wrap: nowrap;
|
||||
box-sizing: border-box;
|
||||
|
||||
.towcontent_item {
|
||||
width: 25%;
|
||||
margin-left: 34rpx;
|
||||
|
||||
image {
|
||||
width: 92rpx;
|
||||
height: 92rpx;
|
||||
}
|
||||
|
||||
text {
|
||||
margin-top: 16rpx;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
|
|
@ -106,6 +120,7 @@
|
|||
white-space: nowrap;
|
||||
}
|
||||
}
|
||||
|
||||
.towcontent_item:nth-child(1) {
|
||||
margin-left: 0rpx;
|
||||
}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,77 @@
|
|||
<template>
|
||||
<view class="AreaSelect flex-start">
|
||||
<view class="selector" v-for="(province,index) in provinces" :key="index">
|
||||
<view class="item"
|
||||
:style="selectedProvince && provincestyle == index?'background: #fff;font-weight: bold;':''"
|
||||
@click="selectProvince(province,index)">
|
||||
{{ province.name }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {
|
||||
ref,
|
||||
defineEmits
|
||||
} from 'vue';
|
||||
import {
|
||||
cityData
|
||||
} from './cityData.js';
|
||||
const emits = defineEmits(['grouping']);
|
||||
// 省份列表
|
||||
const provinces = ref([{
|
||||
detail: [],
|
||||
dictId: 56,
|
||||
dictName: "category",
|
||||
isChild: null,
|
||||
name: "双人餐",
|
||||
value: "2"
|
||||
}, {
|
||||
detail: [],
|
||||
dictId: 56,
|
||||
dictName: "category",
|
||||
isChild: null,
|
||||
name: "双人餐",
|
||||
value: "2"
|
||||
}]);
|
||||
// 选中的省份
|
||||
const selectedProvince = ref(null);
|
||||
// 显示省份列表
|
||||
const showProvinceList = ref(true);
|
||||
|
||||
// 切换省份列表显示状态
|
||||
const toggleProvinceList = () => {
|
||||
showProvinceList.value = !showProvinceList.value;
|
||||
// showCityList.value = false;
|
||||
// showDistrictList.value = false;
|
||||
};
|
||||
// 选择省份 选中状态
|
||||
const provincestyle = ref(null)
|
||||
// 选择省份
|
||||
const selectProvince = (province, index) => {
|
||||
selectedProvince.value = province;
|
||||
provincestyle.value = index
|
||||
emits('grouping', selectedProvince.value.name);
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.AreaSelect {
|
||||
max-height: 60vh;
|
||||
border-radius: 0 0 20rpx 20rpx;
|
||||
align-items: flex-start;
|
||||
overflow: auto;
|
||||
|
||||
.selector {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
border-radius: 0 0 0 20rpx;
|
||||
|
||||
.item {
|
||||
padding: 16rpx 24rpx;
|
||||
background: #f9f9f9;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,655 @@
|
|||
<template>
|
||||
<view class="container">
|
||||
<view class="containertop">
|
||||
<view class="containertopbox">
|
||||
<view class="containertopboxone flex-start">
|
||||
<view>可使用红包</view>
|
||||
<text>{{viewlist.totalnumber}}张</text>
|
||||
</view>
|
||||
<view class="containertopboxitem flex-start" v-for="(item,index) in viewlist.list" :key="index"
|
||||
@click="clickiconone(item)">
|
||||
<view class="containertopboxitemleft flex-colum"
|
||||
:class="item.status == 0?'':'containertopboxitemlefts'">
|
||||
<view class="containertopboxitemleft_one"
|
||||
:class="item.status == 0?'':'containertopboxitemleft_ones'">
|
||||
<text style="font-size: 28rpx;">￥</text>
|
||||
<text>{{item.couponsAmount || 0}}</text>
|
||||
</view>
|
||||
<view class="containertopboxitemleft_tow"
|
||||
:class="item.status == 0?'':'containertopboxitemleft_tows'">
|
||||
优惠券(元)
|
||||
</view>
|
||||
</view>
|
||||
<view class="containertopboxitemright">
|
||||
<view class="containertopboxitemright_one">
|
||||
无门槛使用
|
||||
</view>
|
||||
<view class="containertopboxitemright_tow">
|
||||
通用红包券
|
||||
</view>
|
||||
<view class="containertopboxitemright_there">
|
||||
有效期至：{{$u.timeFormat(item.endTime, 'yyyy/mm/dd') || '0'}}
|
||||
</view>
|
||||
<view
|
||||
:class="item.status == 0?'containertopboxitemright_four':'containertopboxitemright_fours'">
|
||||
<text v-if="onLoaddata.orderfood">
|
||||
{{item.status == 0 ? '去使用':'无法使用'}}
|
||||
</text>
|
||||
<text v-else>
|
||||
{{item.status == 0 ? '兑换积分':'已过期'}}
|
||||
</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<navigator url="/pages/user/coupon" hover-class="navigator-hover"
|
||||
style="margin-top: 20rpx;font-weight: 400;font-size: 28rpx;text-align: center; width: 100%;">
|
||||
查看更多
|
||||
</navigator>
|
||||
</view>
|
||||
<view class="containerbottom">
|
||||
<view class="containerbottomtop">
|
||||
<view class="containerbottomtoptopbox flex-start">
|
||||
<view>可购买红包</view>
|
||||
<text>（根据您的订单金额推荐更适合您的优惠力度）</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="containerbottombox_bottom">
|
||||
<view class="containerbottombox_bottomone">
|
||||
购买省钱包，本单立减
|
||||
</view>
|
||||
<view v-for="(item,index) in orderview.list" :key="index">
|
||||
<view class="containerbottombox_bottomtow">
|
||||
{{item.name}}
|
||||
</view>
|
||||
<view class="containerbottombox_bottombox flex-start" v-for="(item1,index1) in item.listdata"
|
||||
:key="index1" @click="clickicon(item1)">
|
||||
<view class="containerbottombox_bottomthere">
|
||||
<view class="containerbottombox_bottomthere_topitem">
|
||||
<view class="onecontainerbottombox_bottomthere_topitem">
|
||||
<view class="containerbottombox_bottomthere_topitemone">
|
||||
通用红包
|
||||
</view>
|
||||
<view class="containerbottombox_bottomthere_topitemtow flex-center">
|
||||
<view class="a">
|
||||
¥
|
||||
</view>
|
||||
<view class="b">
|
||||
{{item1.couponsAmount}}
|
||||
</view>
|
||||
<view class="c">
|
||||
无门槛
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="towcontainerbottombox_bottomthere_topitem">
|
||||
有效期：{{$u.timeFormat(item1.updateTime, 'yyyy/mm/dd') || '0'}}
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="therecontainerbottombox_bottomthere_topitem flex-around">
|
||||
<up-icon v-if="item1.id == couponid" name="checkmark-circle" color="#F1CB66"
|
||||
size="45"></up-icon>
|
||||
<text v-else class="theretext"></text>
|
||||
<view :class="item1.id == couponid?'c':'b'">
|
||||
<text :class="item1.id == couponid?'c':'b'"
|
||||
style="font-size:20rpx ;">¥</text>{{item1.couponsPrice}}/张
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
|
||||
<script setup>
|
||||
import {
|
||||
ref,
|
||||
computed,
|
||||
reactive,
|
||||
onBeforeUnmount,
|
||||
onMounted,
|
||||
} from "vue";
|
||||
import {
|
||||
onLoad,
|
||||
onReady,
|
||||
onShow,
|
||||
onReachBottom,
|
||||
onPageScroll
|
||||
} from '@dcloudio/uni-app'
|
||||
import Nav from '@/components/CustomNavbar.vue'; //导航栏
|
||||
import {
|
||||
APIordergetYhqPara,
|
||||
APIorderfindCoupons,
|
||||
APIordermineCoupons
|
||||
} from "@/common/api/index/coupons.js"
|
||||
import {
|
||||
useNavbarStore
|
||||
} from '@/stores/navbarStore';
|
||||
const store = useNavbarStore();
|
||||
// 数据
|
||||
const viewlist = reactive({
|
||||
list: [],
|
||||
totalnumber: ''
|
||||
})
|
||||
const orderview = reactive({
|
||||
list: [],
|
||||
listdata: []
|
||||
})
|
||||
const couponid = ref('')
|
||||
const form = reactive({
|
||||
page: 1, //页数
|
||||
size: 10, //页容量
|
||||
status: 'loadmore'
|
||||
})
|
||||
const onLoaddata = reactive({
|
||||
orderfood: '', //等于0扫码点餐下单
|
||||
amount: '' //下单金额传来的值
|
||||
})
|
||||
//团购优惠卷
|
||||
const clickicon = (e) => {
|
||||
couponid.value = e.id
|
||||
e.clickiconone = 1
|
||||
let data = e
|
||||
if (onLoaddata.orderfood == 0) { //等于0扫码点餐下单
|
||||
if (onLoaddata.amount > e.couponsAmount) {
|
||||
uni.$emit('emitclickorderfood', e)
|
||||
uni.navigateBack()
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '优惠券面值大于支付金额',
|
||||
icon: "none",
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
//自己优惠劵处理
|
||||
const clickiconone = (e) => {
|
||||
e.clickiconone = 0
|
||||
let data = e
|
||||
if (onLoaddata.orderfood == 0) { //等于0扫码点餐下单
|
||||
if (onLoaddata.amount > e.couponsAmount) {
|
||||
uni.$emit('emitclickorderfood', data)
|
||||
uni.navigateBack()
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '优惠券面值大于支付金额',
|
||||
icon: "none",
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
//类型列表
|
||||
const ordergetYhqParass = async () => {
|
||||
let res = await APIordergetYhqPara()
|
||||
try {
|
||||
orderview.list = res.data
|
||||
for (let i = 0; i <= res.data.length; i++) {
|
||||
orderfindCouponses(i, orderview.list[i].name);
|
||||
}
|
||||
} catch (e) {
|
||||
//TODO handle the exception
|
||||
}
|
||||
}
|
||||
|
||||
//系统优惠券列表
|
||||
const orderfindCouponses = async (i, name) => {
|
||||
let res = await APIorderfindCoupons({
|
||||
page: 1,
|
||||
size: 10,
|
||||
type: name
|
||||
})
|
||||
orderview.list[i].orderview.listdata = res.data.list
|
||||
console.log(orderview.list)
|
||||
}
|
||||
const ordermineCouponsthis = async () => {
|
||||
let res = await APIordermineCoupons({
|
||||
userId: uni.getStorageSync('userInfo').id,
|
||||
status: 0,
|
||||
page: form.page,
|
||||
size: form.size,
|
||||
orderId: ''
|
||||
})
|
||||
try {
|
||||
viewlist.totalnumber = res.data.total
|
||||
viewlist.list = res.data.list.slice(0, 2)
|
||||
} catch (e) {
|
||||
//TODO handle the exception
|
||||
}
|
||||
}
|
||||
onLoad((e) => {
|
||||
try {
|
||||
onLoaddata.orderfood = e.orderfood //等于0扫码点餐下单
|
||||
onLoaddata.amount = e.amount
|
||||
} catch (e) {
|
||||
//TODO handle the exception
|
||||
}
|
||||
})
|
||||
onShow(() => {
|
||||
try {
|
||||
ordermineCouponsthis()
|
||||
ordergetYhqParass()
|
||||
} catch (e) {
|
||||
//TODO handle the exception
|
||||
}
|
||||
})
|
||||
// export default {
|
||||
// methods: {
|
||||
// clickicon(e) { //团购优惠卷
|
||||
// this.couponid = e.id
|
||||
// e.clickiconone = 1
|
||||
// let data = e
|
||||
// if (this.onLoaddata.orderfood == 0) { //等于0扫码点餐下单
|
||||
// if (this.onLoaddata.amount > e.couponsAmount) {
|
||||
// uni.$emit('emitclickorderfood', e)
|
||||
// uni.navigateBack()
|
||||
// } else {
|
||||
// uni.showToast({
|
||||
// title: '优惠券面值大于支付金额',
|
||||
// icon: "none",
|
||||
// })
|
||||
// }
|
||||
// }
|
||||
// },
|
||||
// clickiconone(e) { //自己优惠劵处理
|
||||
// e.clickiconone = 0
|
||||
// let data = e
|
||||
// if (this.onLoaddata.orderfood == 0) { //等于0扫码点餐下单
|
||||
// if (this.onLoaddata.amount > e.couponsAmount) {
|
||||
// uni.$emit('emitclickorderfood', data)
|
||||
// uni.navigateBack()
|
||||
// } else {
|
||||
// uni.showToast({
|
||||
// title: '优惠券面值大于支付金额',
|
||||
// icon: "none",
|
||||
// })
|
||||
// }
|
||||
// }
|
||||
// },
|
||||
// async ordergetYhqParass() { //类型列表
|
||||
// let res = await this.api.ordergetYhqPara()
|
||||
// try {
|
||||
// this.orderview.list = res.data
|
||||
// for (let i = 0; i <= res.data.length; i++) {
|
||||
// this.orderfindCouponses(i, this.orderview.list[i].name);
|
||||
// }
|
||||
// } catch (e) {
|
||||
// //TODO handle the exception
|
||||
// }
|
||||
// },
|
||||
// async orderfindCouponses(i, name) {
|
||||
// let res = await this.api.orderfindCoupons({
|
||||
// page: 1,
|
||||
// size: 10,
|
||||
// type: name
|
||||
// })
|
||||
// this.orderview.list[i].orderview.listdata = res.data.list
|
||||
// console.log(this.orderview.list)
|
||||
// this.$forceUpdate();
|
||||
// },
|
||||
// async ordermineCouponsthis() {
|
||||
// let res = await this.api.ordermineCoupons({
|
||||
// userId: uni.cache.get('userInfo').id,
|
||||
// status: 0,
|
||||
// page: this.form.page,
|
||||
// size: this.form.size,
|
||||
// orderId: ''
|
||||
// })
|
||||
// try {
|
||||
// this.viewlist.totalnumber = res.data.total
|
||||
// this.viewlist.list = res.data.list.slice(0, 2)
|
||||
// } catch (e) {
|
||||
// //TODO handle the exception
|
||||
// }
|
||||
// },
|
||||
// }
|
||||
// };
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.container {
|
||||
.containertop {
|
||||
padding: 48rpx 32rpx;
|
||||
|
||||
.containertopbox {
|
||||
.containertopboxone {
|
||||
view {
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 32rpx;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
text {
|
||||
margin-left: 12rpx;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
font-size: 24rpx;
|
||||
color: #666666;
|
||||
}
|
||||
}
|
||||
|
||||
.containertopboxitem {
|
||||
margin-top: 20rpx;
|
||||
width: 100%;
|
||||
position: relative;
|
||||
|
||||
.containertopboxitemleft {
|
||||
position: relative;
|
||||
width: 182rpx;
|
||||
height: 192rpx;
|
||||
background: #F1CB66;
|
||||
border-radius: 18rpx 0rpx 0rpx 18rpx;
|
||||
box-shadow: 0rpx 6rpx 12rpx 2rpx rgba(0, 0, 0, 0.16);
|
||||
|
||||
::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: 0rpx;
|
||||
left: 166rpx;
|
||||
background: #f9f9f9;
|
||||
display: inline-block;
|
||||
width: 32rpx;
|
||||
height: 16rpx;
|
||||
border-radius: 0 0 32rpx 32rpx;
|
||||
z-index: 999;
|
||||
}
|
||||
|
||||
::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
bottom: 0rpx;
|
||||
left: 166rpx;
|
||||
background: #f9f9f9;
|
||||
display: inline-block;
|
||||
width: 32rpx;
|
||||
height: 16rpx;
|
||||
line-height: 32rpx;
|
||||
border-radius: 32rpx 32rpx 0 0;
|
||||
box-shadow: 0rpx 6rpx 12rpx 2rpx rgba(255, 255, 255, 0.16);
|
||||
z-index: 999;
|
||||
|
||||
}
|
||||
|
||||
.containertopboxitemleft_one {
|
||||
text {
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 60rpx;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
|
||||
.containertopboxitemleft_ones {
|
||||
text {
|
||||
color: #999999;
|
||||
}
|
||||
}
|
||||
|
||||
.containertopboxitemleft_tow {
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
.containertopboxitemleft_tows {
|
||||
color: #999999;
|
||||
}
|
||||
}
|
||||
|
||||
.containertopboxitemlefts {
|
||||
background: #F7F7F7;
|
||||
}
|
||||
|
||||
.containertopboxitemright {
|
||||
position: relative;
|
||||
padding: 0 32rpx;
|
||||
flex: auto;
|
||||
height: 192rpx;
|
||||
background: #FFFFFF;
|
||||
box-shadow: 0rpx 6rpx 12rpx 2rpx rgba(0, 0, 0, 0.16);
|
||||
border-radius: 0rpx 18rpx 18rpx 0rpx;
|
||||
|
||||
.containertopboxitemright_one {
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
color: #666666;
|
||||
padding: 12rpx 0;
|
||||
border-bottom: 1rpx dotted #707070;
|
||||
}
|
||||
|
||||
.containertopboxitemright_tow {
|
||||
margin-top: 14rpx;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 32rpx;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.containertopboxitemright_there {
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
.containertopboxitemright_four {
|
||||
position: absolute;
|
||||
right: 32rpx;
|
||||
top: 50%;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
color: #FFFFFF;
|
||||
padding: 0 14rpx;
|
||||
height: 48rpx;
|
||||
line-height: 48rpx;
|
||||
text-align: center;
|
||||
background: #FE665E;
|
||||
border-radius: 24rpx 24rpx 24rpx 24rpx;
|
||||
}
|
||||
|
||||
.containertopboxitemright_fours {
|
||||
position: absolute;
|
||||
right: 32rpx;
|
||||
top: 50%;
|
||||
font-family: PingFang SC, PingFang SC;
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
color: #999999;
|
||||
padding: 0 14rpx;
|
||||
height: 48rpx;
|
||||
line-height: 48rpx;
|
||||
text-align: center;
|
||||
background: #F7F7F7;
|
||||
border-radius: 24rpx 24rpx 24rpx 24rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.containerbottom {
|
||||
.containerbottomtop {
|
||||
padding: 0 32rpx;
|
||||
|
||||
.containerbottomtoptopbox {
|
||||
view {
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 32rpx;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
text {
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
font-size: 24rpx;
|
||||
color: #666666;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.containerbottombox_bottom {
|
||||
margin-top: 16rpx;
|
||||
width: 100%;
|
||||
background: #FFFFFF;
|
||||
border-radius: 42rpx 0rpx 0rpx 42rpx;
|
||||
|
||||
// overflow-x: auto;
|
||||
.containerbottombox_bottomone {
|
||||
padding: 20rpx 64rpx 0 64rpx;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 28rpx;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.containerbottombox_bottomtow {
|
||||
margin-top: 16rpx;
|
||||
padding: 0 64rpx;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
font-size: 28rpx;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.containerbottombox_bottombox {
|
||||
padding-left: 34rpx;
|
||||
width: 100%;
|
||||
overflow-x: auto;
|
||||
flex-wrap: nowrap;
|
||||
|
||||
.containerbottombox_bottomthere:nth-child(1) {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.containerbottombox_bottomthere {
|
||||
margin-top: 16rpx;
|
||||
margin-left: 46rpx;
|
||||
|
||||
.containerbottombox_bottomthere_topitem {
|
||||
width: 236rpx;
|
||||
border-radius: 24rpx 24rpx 24rpx 24rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
background: #fd5977;
|
||||
|
||||
.towcontainerbottombox_bottomthere_topitem {
|
||||
padding: 20rpx 0 16rpx 0;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 20rpx;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
.onecontainerbottombox_bottomthere_topitem::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
bottom: -6rpx;
|
||||
width: 100%;
|
||||
height: 20rpx;
|
||||
background: #fef7f5;
|
||||
left: 0;
|
||||
z-index: 1;
|
||||
border-radius: 0 0 50% 50%;
|
||||
}
|
||||
|
||||
.onecontainerbottombox_bottomthere_topitem {
|
||||
position: relative;
|
||||
background: #fef7f5;
|
||||
width: 100%;
|
||||
z-index: 99;
|
||||
|
||||
.containerbottombox_bottomthere_topitemone {
|
||||
width: 136rpx;
|
||||
height: 40rpx;
|
||||
background: #F1CB66;
|
||||
text-align: center;
|
||||
border-radius: 0rpx 0rpx 20rpx 20rpx;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
color: #333333;
|
||||
line-height: 40rpx;
|
||||
margin: auto;
|
||||
}
|
||||
|
||||
.containerbottombox_bottomthere_topitemtow {
|
||||
align-items: baseline;
|
||||
width: 100%;
|
||||
|
||||
.a {
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 40rpx;
|
||||
color: #FF4C11;
|
||||
}
|
||||
|
||||
.b {
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 70rpx;
|
||||
color: #FF4C11;
|
||||
}
|
||||
|
||||
.c {
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
color: #FF4C11;
|
||||
}
|
||||
}
|
||||
|
||||
.containerbottombox_bottomthere_topitemthere {
|
||||
position: relative;
|
||||
height: 50rpx;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 20rpx;
|
||||
color: #FFFFFF;
|
||||
width: 100%;
|
||||
z-index: 9;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.therecontainerbottombox_bottomthere_topitem {
|
||||
width: 100%;
|
||||
margin-top: 20rpx;
|
||||
|
||||
.theretext {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
background: #FFFFFF;
|
||||
border: 2rpx solid #E8E8E8;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.c {
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 28rpx;
|
||||
color: #FF4C11;
|
||||
}
|
||||
|
||||
.b {
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 28rpx;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,673 @@
|
|||
<template>
|
||||
<view class="content">
|
||||
<!-- 占位符导航栏 -->
|
||||
<navseat class="navbar" :opacity='opacitys' :title='toplist.name' :titleshow='false'></navseat>
|
||||
|
||||
<view class="onecontent">
|
||||
<image class="onecontentimage" :src="toplist.coverImg" mode="aspectFill"></image>
|
||||
<!-- 小内切圆 -->
|
||||
<view class="after"></view>
|
||||
<view class="onecontentabsolute">
|
||||
</view>
|
||||
</view>
|
||||
<view class="towcontent">
|
||||
<!-- <view :class="isFixedTop?'towcontentlistxitemboxfixed':''" :style="{'top':customheighttop + 'px'}">
|
||||
<view class="towcontentlistxitem flex-start">
|
||||
<view class="towcontentlistxitembox flex-colum"
|
||||
:class="towcontentclickindex == index?'towcontentlistxitemboxopacity':''"
|
||||
v-for="(item,index) in listbox" :key="index" @click="towcontentclick(index)">
|
||||
<text>{{item.name}}</text>
|
||||
<image v-if="towcontentclickindex == index"
|
||||
src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/index/today/dg.png" mode="widthFix">
|
||||
</image>
|
||||
</view>
|
||||
</view>
|
||||
</view> -->
|
||||
<view v-if="isFixedTop" :style="{'height':windowHeight - seighT + 'px'}"></view>
|
||||
<view class="towcontentboutton" :style="{'height':seighT + 'px'}">
|
||||
<!-- <scroll-view :style="{'height':seighT + 'px'}" scroll-y @scrolltolower="loadMore"> -->
|
||||
<view class="fivecontent_item" v-for="(item,index) in list" :key="index" @click="clickproduct(item)">
|
||||
<view class="fivecontent_item_nav flex-start">
|
||||
<image class="fivecontent_item_navimage" :src="item.shopImage" mode="aspectFill"></image>
|
||||
<view class="fivecontent_item_nav_left">
|
||||
<view class="fivecontent_item_nav_lefttop flex-between">
|
||||
<view>
|
||||
{{item.shopName}}
|
||||
</view>
|
||||
<view>
|
||||
{{item.distances}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="fivecontent_item_nav_lefttopstart flex-start">
|
||||
<view class="fivecontent_item_nav_leftlang flex-start" v-for="(s,index1) in item.shopTag"
|
||||
:key="index1" :style="{'background':s.backColor,'color':s.backColor}">
|
||||
<image class="fivecontent_item_nav_leftlangimage" v-if="s.shareImg" :src="s.shareImg"
|
||||
mode="aspectFill"></image>
|
||||
<text class="fivecontent_item_nav_leftlangtext">{{s.name}}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="fivecontent_item_box">
|
||||
<view class="fivecontent_item_boxitem flex-between">
|
||||
<image :src="item.image" mode=""></image>
|
||||
<view class="fivecontent_item_boxitemleft flex-colum-start">
|
||||
<view class="fivecontent_item_boxitemleftone flex-between">
|
||||
<view>{{item.productName.length>7?item.productName.substring(0,7)+'...':item.productName}}</view>
|
||||
<text>已抢{{item.realSalesNumber}}份</text>
|
||||
</view>
|
||||
<view class="flex-start flexstartboxfttow">
|
||||
<view class="fivecontent_item_boxitemlefttow flex-start"
|
||||
v-for="(c,index2) in item.proTag" :key="index2"
|
||||
:style="{'background':c.backColor,'color':c.backColor}">
|
||||
<image class="fivecontent_item_boxitemlefttowimage" v-if="c.shareImg"
|
||||
:src="c.shareImg" mode="aspectFill"></image>
|
||||
<text class="fivecontent_item_boxitemlefttowtext">{{c.name}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="indexboxitemleftthere flex-colum-start">
|
||||
<view class="indexboxitemleftthereabsolute">
|
||||
马上抢
|
||||
</view>
|
||||
<view class="indexboxitemlefttheretext flex-start">
|
||||
<view class="fivecontent_item_boxitemlefthere_one flex-start">
|
||||
<text class="flex_startone">到手</text>
|
||||
<text class="flex_starttow">¥{{item.salePrice}}</text>
|
||||
</view>
|
||||
<view class="fivecontent_item_boxitemlefthere_tow">
|
||||
{{item.discount || ''}}折
|
||||
</view>
|
||||
<view class="fivecontent_item_boxitemlefthere_there">
|
||||
¥{{item.originPrice}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="indexboxitemleftthere_countdown flex-between">
|
||||
<text class="indexboxitemleftthere_countdowntext">共省{{item.save}}元</text>
|
||||
<view class="indexboxitemleftthere_countdowntexts">
|
||||
<uni-countdown @timeup="updateCity" :show-day="false"
|
||||
:day="item.end_times.d" :hour="item.end_times.h"
|
||||
:minute="item.end_times.m" :second="item.end_times.s"
|
||||
:indexs='index' color="#FFFFFF" border-color="#00B26A"
|
||||
splitorColor="#FFFFFF" :font-size="7"></uni-countdown>
|
||||
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<u-loadmore height='40' :status="form.status" iconSize='24' fontSize='24' />
|
||||
<!-- </scroll-view> -->
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import navseat from '@/components/navseat.vue'
|
||||
export default {
|
||||
components: {
|
||||
navseat
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
titlename: '咖啡',
|
||||
opacitys: false,
|
||||
towcontentclickindex: 0,
|
||||
windowHeight: '',
|
||||
seighT: '',
|
||||
customheighttop: '', //top高度
|
||||
isFixedTop: false,
|
||||
Topdistance: 3000, //吸顶初始距离
|
||||
list: [],
|
||||
toplist: {},
|
||||
listbox: [],
|
||||
form: {
|
||||
address: '', //地址
|
||||
type: '', //品类
|
||||
orderBy: '', //1.理我最近 2.销量优先 3.价格优先
|
||||
distance: '', //附近1KM 1选中 0不选中
|
||||
page: 1, //页数
|
||||
size: 10, //页容量
|
||||
status: 'loadmore'
|
||||
},
|
||||
type:''
|
||||
};
|
||||
},
|
||||
onPageScroll(e) {
|
||||
if (e.scrollTop <= 44) { //搜索导航栏
|
||||
this.opacitys = false
|
||||
} else {
|
||||
this.opacitys = true
|
||||
}
|
||||
if (e.scrollTop >= this.Topdistance) { //类别导航栏
|
||||
this.isFixedTop = true
|
||||
} else {
|
||||
this.isFixedTop = false
|
||||
}
|
||||
},
|
||||
onLoad(e) {
|
||||
let _this = this
|
||||
uni.getStorage({
|
||||
key: 'itemData',
|
||||
success: function(res) {
|
||||
_this.type = res.data.value
|
||||
_this.distiricttopCommon()
|
||||
// setTimeout(() => {
|
||||
_this.GetTop()
|
||||
// _this.init_fn()
|
||||
// }, 1000)
|
||||
}
|
||||
});
|
||||
// this.type = e.value
|
||||
// this.distiricttopCommon()
|
||||
// setTimeout(() => {
|
||||
// this.GetTop()
|
||||
// }, 1000)
|
||||
},
|
||||
onShow() {
|
||||
let _this = this
|
||||
uni.getStorage({
|
||||
key: 'itemData',
|
||||
success: function(res) {
|
||||
_this.type = res.data.value
|
||||
_this.distiricttopCommon()
|
||||
// setTimeout(() => {
|
||||
// _this.GetTop()
|
||||
_this.init_fn()
|
||||
// }, 1000)
|
||||
}
|
||||
});
|
||||
// this.init_fn()
|
||||
},
|
||||
computed: {
|
||||
HeighT() { //手机类型的尺寸
|
||||
return this.$store.getters.is_BarHeight
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
clickproduct(item){
|
||||
uni.pro.navigateTo('product/index',{
|
||||
id:item.id
|
||||
})
|
||||
},
|
||||
init_fn() {
|
||||
this.list = []
|
||||
this.form = {
|
||||
address: uni.cache.get('getLocationstorage').address, //地址
|
||||
lng: uni.cache.get('getLocationstorage').lng,
|
||||
lat: uni.cache.get('getLocationstorage').lat,
|
||||
type:this.type, //品类
|
||||
orderBy:0, //0.今日上新 1.离我最近 2.销量优先 3.价格优先 4.热榜推荐
|
||||
other: '', //附近1KM 1选中 0不选中
|
||||
page: 1, //页数
|
||||
size: 10, //页容量
|
||||
dateType: 1,
|
||||
status: 'loadmore'
|
||||
}
|
||||
this.onLoadlist()
|
||||
},
|
||||
async distiricttopCommon(e) {
|
||||
let res = await this.api.distiricttopCommon({
|
||||
type: this.type, //团购卷品类Id/subShop-预约到店
|
||||
orderBy: ''
|
||||
})
|
||||
if (res.code == 0) {
|
||||
this.toplist = res.data.carousel[0]
|
||||
this.listbox = res.data.menu
|
||||
}
|
||||
},
|
||||
async onLoadlist() {
|
||||
try {
|
||||
let res = await this.api.indexlist(this.form)
|
||||
var dates = new Date().getTime();
|
||||
res.data.list.forEach((item, index) => {
|
||||
var leftTime = item.endTime - dates; //计算两日期之间相差的毫秒数
|
||||
if (leftTime >= 0) {
|
||||
let d = Math.floor(leftTime / 1000 / 60 / 60 / 24);
|
||||
let h = Math.floor(leftTime / 1000 / 60 / 60 % 24);
|
||||
let m = Math.floor(leftTime / 1000 / 60 % 60);
|
||||
let s = Math.floor(leftTime / 1000 % 60);
|
||||
item.end_times = {
|
||||
d: d,
|
||||
h: h,
|
||||
m: m,
|
||||
s: s
|
||||
}
|
||||
} else {
|
||||
item.end_times = 0
|
||||
}
|
||||
})
|
||||
if (res.data.pages < this.form.page) {
|
||||
this.form.status = 'nomore'
|
||||
return false;
|
||||
} else {
|
||||
this.form.status = 'loading';
|
||||
this.form.page = ++this.form.page;
|
||||
setTimeout(() => {
|
||||
this.list = [...this.list, ...res.data.list];
|
||||
this.form.status = 'loading';
|
||||
if (res.data.pageNum == res.data.pages) {
|
||||
this.form.status = 'nomore';
|
||||
} else {
|
||||
this.form.status = 'loading';
|
||||
}
|
||||
}, 500)
|
||||
}
|
||||
} catch (e) {}
|
||||
},
|
||||
//G滚动底部
|
||||
loadMore(e) {
|
||||
console.log(e)
|
||||
},
|
||||
//获取元素距离顶部的距离
|
||||
GetTop() {
|
||||
uni.getSystemInfo({
|
||||
success: (data) => {
|
||||
console.log(data)
|
||||
this.windowHeight = data.windowHeight - data.statusBarHeight //总高度
|
||||
// #ifdef MP-WEIXIN
|
||||
const custom = wx.getMenuButtonBoundingClientRect()
|
||||
this.seighT = data.windowHeight - custom.height - custom.top;
|
||||
console.log(custom)
|
||||
this.customheighttop = custom.height + custom.top
|
||||
// #endif
|
||||
// #ifdef APP-PLUS
|
||||
this.customheighttop = data.statusBarHeight / 2
|
||||
this.seighT = data.windowHeight - data.statusBarHeight / 2
|
||||
// #endif
|
||||
this.$u.getRect('.towcontentlistxitembt').then(res => {
|
||||
this.seighT = this.seighT - res.height //高度
|
||||
})
|
||||
this.$u.getRect('.towcontentlistxitem').then(res => {
|
||||
this.Topdistance = res.top - this.HeighT.heightBar //滚动距离 //滚动距离
|
||||
this.seighT = this.seighT - res.height //高度
|
||||
console.log(res)
|
||||
})
|
||||
|
||||
}
|
||||
})
|
||||
},
|
||||
towcontentclick(index) {
|
||||
this.towcontentclickindex = index
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
page {
|
||||
background: #F9F9F9;
|
||||
}
|
||||
|
||||
.content {
|
||||
.onecontent {
|
||||
width: 100%;
|
||||
height: 492rpx;
|
||||
position: relative;
|
||||
|
||||
.onecontentimage {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
top: 0;
|
||||
}
|
||||
|
||||
.after {
|
||||
position: absolute;
|
||||
bottom: 32rpx;
|
||||
right: 0;
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
line-height: 40rpx;
|
||||
text-align: center;
|
||||
background-image: radial-gradient(160rpx at 0px 0px, rgba(0, 0, 0, 0) 40rpx, #fff 40rpx);
|
||||
}
|
||||
|
||||
.onecontentabsolute {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
padding: 0 52rpx;
|
||||
bottom: 64rpx;
|
||||
|
||||
.onecontentabsoluteitem {
|
||||
padding: 8rpx 16rpx;
|
||||
background: #FFFFFF;
|
||||
border-radius: 12rpx 12rpx 12rpx 12rpx;
|
||||
|
||||
image {
|
||||
width: 24.16rpx;
|
||||
height: 29.31rpx;
|
||||
}
|
||||
|
||||
input {
|
||||
padding: 0 16rpx;
|
||||
flex: auto;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
font-size: 24rpx;
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
.onecontentabsoluteitembotton {
|
||||
width: 120rpx;
|
||||
height: 56rpx;
|
||||
line-height: 56rpx;
|
||||
text-align: center;
|
||||
background: linear-gradient(109deg, #FF9D84 0%, #FFFFFF 100%);
|
||||
border-radius: 28rpx 28rpx 28rpx 28rpx;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: bold;
|
||||
font-size: 24rpx;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.towcontent {
|
||||
position: relative;
|
||||
margin-top: -32rpx;
|
||||
|
||||
.towcontentlistxitemboxfixed {
|
||||
position: fixed;
|
||||
top: 0;
|
||||
width: 100%;
|
||||
z-index: 99;
|
||||
margin-top: 0rpx !important;
|
||||
}
|
||||
|
||||
.towcontentlistxitem {
|
||||
// margin-top: -32rpx;
|
||||
padding: 36rpx 28rpx 0rpx 28rpx;
|
||||
border-radius: 24rpx 0rpx 0rpx 0rpx;
|
||||
background: #F9F9F9;
|
||||
|
||||
.towcontentlistxitembox:nth-child(1) {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.towcontentlistxitembox {
|
||||
margin-left: 48rpx;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
font-size: 28rpx;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.towcontentlistxitemboxopacity {
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: bold;
|
||||
font-size: 32rpx;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
image {
|
||||
width: 38.83rpx;
|
||||
height: 8.62rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.towcontentlistxitembt {
|
||||
padding: 28rpx;
|
||||
overflow-x: auto;
|
||||
flex-wrap: nowrap;
|
||||
background: #F9F9F9;
|
||||
|
||||
.towcontentlistxitembtitem {
|
||||
flex: none;
|
||||
padding: 8rpx 24rpx;
|
||||
background: #FFFFFF;
|
||||
border-radius: 8rpx 8rpx 8rpx 8rpx;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
font-size: 28rpx;
|
||||
color: #666666;
|
||||
margin-left: 32rpx;
|
||||
}
|
||||
|
||||
.towcontentlistxitembtitem:nth-child(1) {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.towcontentlistxitembtitemaktev {
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 28rpx;
|
||||
color: #333333;
|
||||
background: #FEE06A;
|
||||
border-radius: 8rpx 8rpx 8rpx 8rpx;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.towcontentboutton {
|
||||
padding: 0 28rpx;
|
||||
|
||||
.fivecontent_item:nth-child(1) {
|
||||
margin-top: 0;
|
||||
}
|
||||
|
||||
.fivecontent_item {
|
||||
margin-top: 32rpx;
|
||||
padding: 24rpx;
|
||||
width: 100%;
|
||||
background: #FFFFFF;
|
||||
border-radius: 18rpx 18rpx 18rpx 18rpx;
|
||||
|
||||
.fivecontent_item_nav {
|
||||
image {
|
||||
width: 60rpx;
|
||||
height: 60rpx;
|
||||
border-radius: 8rpx;
|
||||
}
|
||||
|
||||
.fivecontent_item_nav_left {
|
||||
flex: auto;
|
||||
margin-left: 12rpx;
|
||||
|
||||
.fivecontent_item_nav_lefttop {
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
font-size: 24rpx;
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
.fivecontent_item_nav_leftlang {
|
||||
margin-top: 8rpx;
|
||||
width: max-content;
|
||||
padding: 4rpx 10rpx;
|
||||
background: #FFF9E1;
|
||||
border-radius: 4rpx 4rpx 4rpx 4rpx;
|
||||
|
||||
text {
|
||||
margin-left: 6rpx;
|
||||
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
font-size: 16rpx;
|
||||
color: #F9A511;
|
||||
}
|
||||
|
||||
image {
|
||||
width: 10.82rpx;
|
||||
height: 14.06rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.fivecontent_item_nav_leftlang:nth-child(2) {
|
||||
margin-left: 12rpx;
|
||||
background: #FEE9DF;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.fivecontent_item_box {
|
||||
margin-top: 20rpx;
|
||||
border-top: 2rpx solid #E5E5E5;
|
||||
padding-top: 14rpx;
|
||||
|
||||
.fivecontent_item_boxitem {
|
||||
image {
|
||||
width: 192rpx;
|
||||
height: 192rpx;
|
||||
border-radius: 12rpx;
|
||||
}
|
||||
|
||||
.fivecontent_item_boxitemleft {
|
||||
margin-left: 24rpx;
|
||||
flex: auto;
|
||||
|
||||
.fivecontent_item_boxitemleftone {
|
||||
width: 100%;
|
||||
|
||||
text {
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
font-size: 24rpx;
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
view {
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 28rpx;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
|
||||
.fivecontent_item_boxitemlefttow {
|
||||
margin-top: 8rpx;
|
||||
width: max-content;
|
||||
padding: 4rpx 10rpx;
|
||||
background: #FFF9E1;
|
||||
border-radius: 4rpx 4rpx 4rpx 4rpx;
|
||||
|
||||
text {
|
||||
margin-left: 6rpx;
|
||||
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
font-size: 16rpx;
|
||||
color: #F9A511;
|
||||
}
|
||||
|
||||
image {
|
||||
width: 10.82rpx;
|
||||
height: 14.06rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.fivecontent_item_boxitemlefttow:nth-child(2) {
|
||||
margin-left: 12rpx;
|
||||
background: #FFD6D7;
|
||||
border-radius: 4rpx 4rpx 4rpx 4rpx;
|
||||
}
|
||||
|
||||
.indexboxitemleftthere {
|
||||
position: relative;
|
||||
margin-top: 30rpx;
|
||||
padding-left: 16rpx;
|
||||
width: 100%;
|
||||
background: url(https://czg-qr-order.oss-cn-beijing.aliyuncs.com/index/qinggou.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
|
||||
.indexboxitemleftthereabsolute {
|
||||
position: absolute;
|
||||
top: 14rpx;
|
||||
right: 12rpx;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: bold;
|
||||
font-size: 24rpx;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
.indexboxitemlefttheretext {
|
||||
// width: 100%;
|
||||
margin-top: 12rpx;
|
||||
// align-items: flex-end;
|
||||
|
||||
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
|
||||
.fivecontent_item_boxitemlefthere_one {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
|
||||
.flex_startone {
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 16rpx;
|
||||
color: #FF7127;
|
||||
}
|
||||
|
||||
.flex_starttow {
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
color: #FF7127;
|
||||
}
|
||||
}
|
||||
|
||||
.fivecontent_item_boxitemlefthere_tow {
|
||||
margin-left: 4rpx;
|
||||
padding: 2rpx 10rpx;
|
||||
border-radius: 4rpx 4rpx 4rpx 4rpx;
|
||||
border: 2rpx solid #FF7127;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 16rpx;
|
||||
color: #FF7127;
|
||||
}
|
||||
|
||||
.fivecontent_item_boxitemlefthere_there {
|
||||
margin-left: 6rpx;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
font-size: 16rpx;
|
||||
color: #999999;
|
||||
text-decoration-line: line-through;
|
||||
}
|
||||
}
|
||||
|
||||
.indexboxitemleftthere_countdown {
|
||||
width: 100%;
|
||||
padding-right: 7rpx;
|
||||
margin-top: 2rpx;
|
||||
.indexboxitemleftthere_countdowntext {
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
font-size: 24rpx;
|
||||
color: #999999;
|
||||
padding-bottom: 8rpx;
|
||||
}
|
||||
|
||||
.indexboxitemleftthere_countdowntexts {
|
||||
font-family: Roboto, Roboto;
|
||||
font-weight: 400;
|
||||
color: #333333;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: bold;
|
||||
font-size: 16rpx;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,377 @@
|
|||
<template>
|
||||
<view class="content">
|
||||
<!-- 占位符导航栏 -->
|
||||
<navseat :opacity='opacity' :title='titlename' :titleshow='true'></navseat>
|
||||
<view class="onecontent">
|
||||
<view class="onecontentabsolute"></view>
|
||||
</view>
|
||||
<view class="towcontent">
|
||||
<view class="towcontentone">
|
||||
<image class="towcontentoneimage" src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/index/mrmd1.png"
|
||||
mode="aspectFill"></image>
|
||||
<view class="towcontentonebox">
|
||||
<image class="towcontentoneboximage"
|
||||
src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/index/mrmd2.png" mode="aspectFill">
|
||||
</image>
|
||||
<view class="towcontentoneboxswiper">
|
||||
<swiper class="swiper" circular :autoplay='true' :vertical='true' display-multiple-items="4"
|
||||
:interval="'3000'">
|
||||
<swiper-item class="swiperitem" v-for="(item,index) in orderfindWiningUserlist"
|
||||
:key="index">
|
||||
<view class="swiper-item">{{item.userName}}* 免单{{item.orderAmount}}元订单号：{{item.orderNo}}
|
||||
</view>
|
||||
</swiper-item>
|
||||
|
||||
</swiper>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="towcontentoness">
|
||||
<view class="towcontentonebox_box">
|
||||
订单数：{{total}}
|
||||
</view>
|
||||
<view class="towcontentonebox">
|
||||
<view class="towcontentoneboxswiper">
|
||||
<view class="swiper-item" style="margin-bottom: 32rpx;">
|
||||
<view class="swiper_itemone">
|
||||
免单状态
|
||||
</view>
|
||||
<view class="swiper_itemtow">
|
||||
订单号
|
||||
</view>
|
||||
<view class="swiper_itemthere">
|
||||
金额
|
||||
</view>
|
||||
</view>
|
||||
<view class="swiperitem" v-for="(item,index) in ordermineWinnerList" :key="index">
|
||||
<view class="swiper-item" style="margin-top: 32rpx;">
|
||||
<view class="swiper_itemone">
|
||||
{{item.isRefund == true ? '已免单':'待免单'}}
|
||||
</view>
|
||||
<view class="swiper_itemtow">
|
||||
{{item.orderNo}}
|
||||
</view>
|
||||
<view class="swiper_itemthere">
|
||||
{{item.orderAmount}}元
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- <swiper class="swiper" circular :autoplay='true' :vertical='true' interval="3000"
|
||||
display-multiple-items="4">
|
||||
<swiper-item class="swiperitem" v-for="(item,index) in orderfindWiningUserlist"
|
||||
:key="index">
|
||||
<view class="swiper-item">
|
||||
<view class="swiper_itemone">
|
||||
{{item.orderAmount}}元
|
||||
</view>
|
||||
<view class="swiper_itemtow">
|
||||
{{item.orderNo}}
|
||||
</view>
|
||||
<view class="swiper_itemthere">
|
||||
{{item.isRefund == true ? '已免单':'待免单'}}
|
||||
</view>
|
||||
</view>
|
||||
</swiper-item>
|
||||
</swiper> -->
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="towcontenttow">
|
||||
注：每笔订单完成后30天内均有机会获得免单
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {
|
||||
forEach
|
||||
} from 'lodash';
|
||||
import navseat from '@/components/navseat.vue'
|
||||
export default {
|
||||
components: {
|
||||
navseat
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
titlename: '',
|
||||
opacity: false,
|
||||
orderfindWiningUserlist: [],
|
||||
ordermineWinnerList: [],
|
||||
form: {
|
||||
address: '', //地址
|
||||
type: '', //品类
|
||||
orderBy: '', //1.理我最近 2.销量优先 3.价格优先
|
||||
other: '', //附近1KM 1选中 0不选中
|
||||
page: 1, //页数
|
||||
size: 10, //页容量
|
||||
status: 'loadmore'
|
||||
},
|
||||
total:0
|
||||
};
|
||||
},
|
||||
onLoad(e) {
|
||||
this.orderfindWiningUser()
|
||||
this.ordermineWinnerEvent()
|
||||
let _this = this
|
||||
uni.getStorage({
|
||||
key: 'itemData',
|
||||
success: function(res) {
|
||||
_this.titlename = res.data.name
|
||||
}
|
||||
});
|
||||
},
|
||||
onReachBottom() {
|
||||
this.ordermineWinnerEvent()
|
||||
},
|
||||
onPageScroll(e) {
|
||||
if (e.scrollTop <= 44) { //搜索导航栏
|
||||
this.opacity = false
|
||||
} else {
|
||||
this.opacity = true
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
|
||||
cut(str, firstStr, lastStr) {
|
||||
let start = str.indexOf(firstStr);
|
||||
let end = str.lastIndexOf(lastStr);
|
||||
return str.slice(start, end + 1); //slice方法截取的部分不包括第二参数所在位置
|
||||
},
|
||||
|
||||
async ordermineWinnerEvent() {
|
||||
let res = await this.api.ordermineWinner({
|
||||
userId: uni.getStorageSync('userInfo').id,
|
||||
page: this.form.page,
|
||||
size: this.form.size
|
||||
})
|
||||
if(res.code ==0){
|
||||
this.total = res.data.total
|
||||
if(this.form.page==1){
|
||||
this.ordermineWinnerList = res.data.list
|
||||
}else{
|
||||
this.ordermineWinnerList.push(...res.data.list)
|
||||
}
|
||||
this.form.page = ++this.form.page;
|
||||
}
|
||||
},
|
||||
async orderfindWiningUser() {
|
||||
let res = await this.api.orderfindWiningUser()
|
||||
this.orderfindWiningUserlist = res.data.map((i) => {
|
||||
i.userName = i.userName.slice(0, 1)
|
||||
return i
|
||||
})
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
page {
|
||||
background: #F9F9F9;
|
||||
}
|
||||
|
||||
.content {
|
||||
.onecontent {
|
||||
width: 100%;
|
||||
height: 684.19rpx;
|
||||
position: relative;
|
||||
background: linear-gradient(96deg, #F9F2D9 0%, #FBE1DA 100%);
|
||||
|
||||
.onecontentabsolute {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
height: 534.19rpx;
|
||||
width: 100%;
|
||||
background: url(https://czg-qr-order.oss-cn-beijing.aliyuncs.com/index/mrmd.png) no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.towcontent {
|
||||
position: relative;
|
||||
padding: 0 28rpx;
|
||||
width: 100%;
|
||||
margin-top: -100rpx;
|
||||
background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(249, 242, 217, 0.77) 10%, #F5DFDF 100%);
|
||||
|
||||
.towcontentone {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
background: linear-gradient(180deg, rgba(255, 241, 204, 0.77) 0%, rgba(255, 255, 255, 0.56) 40%, #FFFFFF 100%);
|
||||
border-radius: 30rpx 30rpx 30rpx 30rpx;
|
||||
border: 2rpx solid #FFFFFF;
|
||||
padding: 32rpx 24rpx;
|
||||
|
||||
.towcontentoneimage {
|
||||
position: absolute;
|
||||
top: -30rpx;
|
||||
left: 50%;
|
||||
transform: translatex(-50%);
|
||||
width: 118rpx;
|
||||
height: 46rpx;
|
||||
}
|
||||
|
||||
.towcontentonebox {
|
||||
width: 100%;
|
||||
|
||||
.towcontentoneboximage {
|
||||
width: 171.63rpx;
|
||||
height: 37.24rpx;
|
||||
}
|
||||
|
||||
.towcontentoneboxswiper {
|
||||
width: 100%;
|
||||
padding-top: 24rpx;
|
||||
overflow: hidden;
|
||||
|
||||
.swiper {
|
||||
height: 242rpx;
|
||||
|
||||
.swiperitem {
|
||||
height: 40rpx;
|
||||
|
||||
.swiper-item {
|
||||
display: block;
|
||||
height: 40rpx;
|
||||
text-align: left;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 28rpx;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.towcontentoness {
|
||||
margin-top: 48rpx;
|
||||
width: 100%;
|
||||
background: rgba(255, 255, 255, 0.96);
|
||||
border-radius: 30rpx 30rpx 30rpx 30rpx;
|
||||
padding: 38rpx 48rpx;
|
||||
|
||||
.towcontentonebox_box {
|
||||
margin: 0 auto;
|
||||
text-align: center;
|
||||
width: 262rpx;
|
||||
height: 58rpx;
|
||||
line-height: 58rpx;
|
||||
background: #FFA436;
|
||||
border-radius: 30rpx 30rpx 30rpx 30rpx;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: bold;
|
||||
font-size: 32rpx;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
.towcontentonebox {
|
||||
width: 100%;
|
||||
|
||||
.towcontentoneboximage {
|
||||
width: 171.63rpx;
|
||||
height: 37.24rpx;
|
||||
}
|
||||
|
||||
.swiper-item {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
.swiper_itemone {
|
||||
width: 25%;
|
||||
text-align: center;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 28rpx;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.swiper_itemtow {
|
||||
width: auto;
|
||||
text-align: center;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 28rpx;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.swiper_itemthere {
|
||||
width: 25%;
|
||||
text-align: center;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 28rpx;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
|
||||
.towcontentoneboxswiper {
|
||||
width: 100%;
|
||||
// height: 242rpx;
|
||||
padding-top: 24rpx;
|
||||
overflow: hidden;
|
||||
|
||||
.swiper {
|
||||
height: 230rpx;
|
||||
|
||||
.swiperitem {
|
||||
height: 40rpx;
|
||||
|
||||
.swiper-item {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
.swiper_itemone {
|
||||
width: 25%;
|
||||
text-align: center;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 28rpx;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.swiper_itemtow {
|
||||
width: auto;
|
||||
text-align: center;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 28rpx;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.swiper_itemthere {
|
||||
width: 25%;
|
||||
text-align: center;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 28rpx;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.towcontenttow {
|
||||
margin-top: 32rpx;
|
||||
padding-bottom: 144rpx;
|
||||
text-align: center;
|
||||
width: 100%;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 28rpx;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -5,7 +5,8 @@
|
|||
<!-- 轮播图 -->
|
||||
<swipers :carousel='hometoplist.carousel'></swipers>
|
||||
<!-- 广告 -->
|
||||
<advertisement :bannervo='hometoplist.bannerVO' :itemStyle='advertisementStyle'></advertisement>
|
||||
<advertisement :bannervo='hometoplist.bannervo' :itemStyle='advertisementStyle' ref="refbannervo">
|
||||
</advertisement>
|
||||
<!-- 金刚区 -->
|
||||
<diamond :district='hometoplist.district'></diamond>
|
||||
<!-- 今日上线 -->
|
||||
|
|
@ -22,16 +23,20 @@
|
|||
<view class="flex-between" style="flex-wrap: inherit;">
|
||||
<view class="fourcontent_item flex-start" v-for="(item,index) in hometoplist.menu"
|
||||
:key="index" @click="viewHistory(item,index)"
|
||||
:class="!item.isChild && index ? 'fourcontent_itemactev':''">
|
||||
<!-- <view class="fourcontent_item flex-start" v-for="(item,index) in hometoplist.menu" :key="index"
|
||||
@click="viewHistory(item,index)"
|
||||
:class="!item.isChild && viewHistoryindex == index ? 'fourcontent_itemactev':''"> -->
|
||||
:class="!item.isChild && viewHistoryindex == index ? 'fourcontent_itemactev':''">
|
||||
<text style="margin-right: 10rpx;">{{item.name}}</text>
|
||||
<up-icon v-if="item.isChild" style="margin-left: 10rpx;" name="arrow-down-fill"
|
||||
<up-icon v-if="item.isChild" style="margin-left: 10rpx;"
|
||||
:name="showproductlist && viewHistoryindex == index ?'arrow-up-fill':'arrow-down-fill'"
|
||||
color="#333333" size="12"></up-icon>
|
||||
</view>
|
||||
</view>
|
||||
<view class="componentsclass" v-if="showproductlist">
|
||||
<AreaSelect v-if="viewHistoryindex == 0" @updateValue="openproductlist" />
|
||||
<grouping v-if="viewHistoryindex == 1 || viewHistoryindex == 2 || viewHistoryindex == 3"
|
||||
@grouping="openproductlist" />
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</up-sticky>
|
||||
|
||||
<!-- 首页抢购区域 -->
|
||||
|
|
@ -129,10 +134,9 @@
|
|||
</view>
|
||||
</view>
|
||||
<up-loadmore height='40' :status="formhomelist.status" iconSize='16' fontSize='16' />
|
||||
<!-- </scroll-view> -->
|
||||
</view>
|
||||
</view>
|
||||
<!-- <indexs v-if="showindex == 'shopIndex'"></indexs> -->
|
||||
<indexs v-if="showindex == 'shopIndex'"></indexs>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
|
|
@ -141,7 +145,10 @@
|
|||
ref,
|
||||
computed,
|
||||
onMounted,
|
||||
reactive
|
||||
reactive,
|
||||
onBeforeUnmount,
|
||||
watch,
|
||||
getCurrentInstance
|
||||
} from "vue";
|
||||
import {
|
||||
onLoad,
|
||||
|
|
@ -150,21 +157,27 @@
|
|||
onReachBottom,
|
||||
onPageScroll
|
||||
} from '@dcloudio/uni-app'
|
||||
// 获取全局属性
|
||||
const {
|
||||
proxy
|
||||
} = getCurrentInstance();
|
||||
import swipers from './components/swiper.vue' //引入轮播
|
||||
import advertisement from './components/advertisement.vue' //广告
|
||||
import diamond from './components/diamond.vue' //金刚区
|
||||
import todaylist from './components/todaylist.vue' //今日上线
|
||||
// import popupad from '@/components/popupad.vue'
|
||||
// import productlist from './components/productlist.vue'
|
||||
// import category from '@/components/qiyue-category/qiyue-category.vue';
|
||||
// import indexs from './indexs.vue';
|
||||
import indexs from './indexs.vue';
|
||||
import AreaSelect from './components/AreaSelect.vue'; //城市联动
|
||||
import grouping from './components/grouping.vue'; //其他
|
||||
import Nav from '@/components/indexnav.vue'; //导航栏
|
||||
import API from "@/common/js/api.js"
|
||||
import {
|
||||
APIhomehomePageUp,
|
||||
APIhome,
|
||||
APIshopUserInfo
|
||||
} from "@/common/api/index/index.js"
|
||||
import {
|
||||
useNavbarStore
|
||||
} from '@/stores/navbarStore';
|
||||
const store = useNavbarStore();
|
||||
|
||||
// 动态更新导航栏配置
|
||||
store.updateNavbarConfig({
|
||||
showBack: true, //左边返回键
|
||||
|
|
@ -178,8 +191,8 @@
|
|||
const showindex = ref('index')
|
||||
//计算广告图片的重合尺寸是位移
|
||||
const getStyle = (e) => {
|
||||
if (e > hometoplist.bannerVO.counponsInfo.length / 2) {
|
||||
var right = hometoplist.bannerVO.counponsInfo.length - e
|
||||
if (e > hometoplist.bannervo.counponsInfo.length / 2) {
|
||||
var right = hometoplist.bannervo.counponsInfo.length - e
|
||||
return {
|
||||
transform: 'scale(' + (1) + ') translate(-' + (right * 20) + '%,0px)',
|
||||
zIndex: 9999 - right,
|
||||
|
|
@ -193,20 +206,22 @@
|
|||
}
|
||||
}
|
||||
}
|
||||
const advertisementStyle = ref([{
|
||||
transform: 'scale(' + (1) + ') translate(-' + (0 * 20) + '%,0px)',
|
||||
zIndex: 9999,
|
||||
opacity: 1
|
||||
}])
|
||||
const advertisementStyle = ref([])
|
||||
const refbannervo = ref(null);
|
||||
//数据
|
||||
const hometoplist = reactive({})
|
||||
const hometoplist = reactive({
|
||||
bannervo: {
|
||||
counponsInfo: [],
|
||||
coupons: ''
|
||||
}
|
||||
})
|
||||
// 首页上面数据
|
||||
const hometop = async () => {
|
||||
try {
|
||||
let res = await API.homehomePageUp()
|
||||
let res = await APIhomehomePageUp()
|
||||
Object.assign(hometoplist, res.data)
|
||||
if (hometoplist.bannerVO.counponsInfo) {
|
||||
hometoplist.bannerVO.counponsInfo.forEach((item, index) => {
|
||||
if (hometoplist.bannervo.counponsInfo) {
|
||||
hometoplist.bannervo.counponsInfo.forEach((item, index) => {
|
||||
advertisementStyle.value.push(getStyle(index))
|
||||
})
|
||||
}
|
||||
|
|
@ -232,7 +247,7 @@
|
|||
const homelist = ref([]) //接收数据
|
||||
const onLoadhome = async () => {
|
||||
try {
|
||||
let res = await API.home(formhomelist)
|
||||
let res = await APIhome(formhomelist)
|
||||
var dates = new Date().getTime();
|
||||
res.data.list.forEach((item, index) => {
|
||||
var leftTime = item.endTime - dates; //计算两日期之间相差的毫秒数
|
||||
|
|
@ -288,16 +303,21 @@
|
|||
})
|
||||
onLoadhome()
|
||||
}
|
||||
const updateCity = async (data) => {
|
||||
console.log(data)
|
||||
// this.list[data].end_times = 0;
|
||||
}
|
||||
|
||||
// 弹出层处理
|
||||
const showproductlist = ref(false);
|
||||
// 定义方法
|
||||
const openproductlist = (e) => {
|
||||
hometoplist.menu[viewHistoryindex.value].name = e //下标更改name
|
||||
showproductlist.value = !showproductlist.value
|
||||
}
|
||||
|
||||
// 存储每个元素距离顶部的距离
|
||||
const elementTop = ref(0);
|
||||
// 存储是否吸顶的状态
|
||||
const isSticky = ref(true);
|
||||
//下标
|
||||
const viewHistoryindex = ref(null)
|
||||
// 点击滑动元素
|
||||
const viewHistory = async (item, index) => {
|
||||
if (isSticky) {
|
||||
|
|
@ -306,7 +326,12 @@
|
|||
duration: 300
|
||||
});
|
||||
}
|
||||
|
||||
// 是否有弹出层
|
||||
if (item.isChild) {
|
||||
showproductlist.value = showproductlist.value ? viewHistoryindex.value == index ? false : true : !
|
||||
showproductlist.value
|
||||
}
|
||||
viewHistoryindex.value = index
|
||||
}
|
||||
// 滑动
|
||||
onPageScroll((res) => {
|
||||
|
|
@ -315,86 +340,71 @@
|
|||
});
|
||||
onShow(() => {})
|
||||
onMounted(async () => {
|
||||
await proxy.$onLaunched;
|
||||
console.log(uni.cache.get('shopId'))
|
||||
if (uni.cache.get('shopId') && uni.cache.get('token')) {
|
||||
showindex.value = 'shopIndex'
|
||||
let res = await APIshopUserInfo({
|
||||
"shopId": uni.cache.get('shopId'),
|
||||
"userId": uni.getStorageSync('userInfo').id,
|
||||
})
|
||||
if (res.code == 0) {
|
||||
//商家信息
|
||||
uni.cache.set('shopUserInfo', res.data)
|
||||
}
|
||||
} else {
|
||||
hometop()
|
||||
init_fn()
|
||||
showindex.value = 'index'
|
||||
// 获取初始定位高度
|
||||
setTimeout(() => {
|
||||
const query = uni.createSelectorQuery().select('#fourcontent');
|
||||
query.boundingClientRect((rect) => {
|
||||
console.log(rect.top, 111)
|
||||
elementTop.value = rect.top - store.height
|
||||
}).exec();
|
||||
}, 500)
|
||||
// 查询是否有无内存
|
||||
if (uni.cache.get('shopId') && uni.cache.get('token')) {
|
||||
showindex.value = 'shopIndex'
|
||||
uni.cache.set('types', 'index');
|
||||
let res = await API.shopUserInfo({
|
||||
"shopId": uni.cache.get('shopId'),
|
||||
"userId": uni.cache.get('userInfo').id,
|
||||
})
|
||||
if (res.code == 0) {
|
||||
shopUserInfo = res.data
|
||||
// uni.cache.set('shopUserInfo', this.shopUserInfo)
|
||||
}
|
||||
if (uni.cache.get('forceUpdate') == 1) {
|
||||
// this.forceUpdate = !this.forceUpdate;
|
||||
}
|
||||
// this.getShopExtend()
|
||||
} else {
|
||||
uni.getLocation({
|
||||
type: 'wgs84',
|
||||
success: async (res) => {
|
||||
// console.log(res)
|
||||
let successres = await API.geocodelocation({
|
||||
lng: res.longitude,
|
||||
lat: res.latitude,
|
||||
})
|
||||
if (successres.code == 0) {
|
||||
let datastorage = {
|
||||
country: successres.data.addressComponent.country, // "中国"
|
||||
province: successres.data.addressComponent
|
||||
.province, //province: "陕西省"
|
||||
address: successres.data.addressComponent.city, //district: "西安市"
|
||||
district: successres.data.addressComponent
|
||||
.district, //district: "未央区"
|
||||
lng: res.longitude,
|
||||
lat: res.latitude,
|
||||
}
|
||||
uni.cache.set('getLocationstorage', datastorage);
|
||||
}
|
||||
},
|
||||
fail: async (err) => {
|
||||
showindex.value = 'index'
|
||||
}
|
||||
});
|
||||
}
|
||||
hometop()
|
||||
init_fn()
|
||||
|
||||
|
||||
});
|
||||
onReachBottom(() => {
|
||||
onLoadhome()
|
||||
})
|
||||
onLoad(() => {
|
||||
|
||||
})
|
||||
// 页面离开时清除定时器
|
||||
// onBeforeUnmount(() => {
|
||||
// if (refbannervo.value) {
|
||||
// refbannervo.value.clearTimer();
|
||||
// }
|
||||
// });
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
<style lang="scss" scoped>
|
||||
.content {
|
||||
height: 1000vh;
|
||||
background: #F9F9F9;
|
||||
|
||||
.fourcontent {
|
||||
padding: 32rpx 28rpx;
|
||||
padding: 32rpx 0;
|
||||
overflow-x: auto;
|
||||
flex-wrap: nowrap;
|
||||
background: #f9f9f9;
|
||||
margin: 0 32rpx;
|
||||
|
||||
.componentsclass {
|
||||
margin-top: 32rpx;
|
||||
left: 0;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100vh;
|
||||
transition-duration: 350ms;
|
||||
transition-timing-function: ease-out;
|
||||
z-index: 10075;
|
||||
background-color: rgba(0, 0, 0, 0.5);
|
||||
}
|
||||
|
||||
.fourcontent_item {
|
||||
flex-wrap: nowrap;
|
||||
margin-left: 22rpx;
|
||||
padding: 11rpx 31rpx;
|
||||
margin-left: 20rpx;
|
||||
padding: 10rpx 24rpx;
|
||||
background: #FFFFFF;
|
||||
border-radius: 8rpx 8rpx 8rpx 8rpx;
|
||||
|
||||
|
|
@ -412,6 +422,8 @@
|
|||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
.fivecontent {
|
||||
padding: 0 28rpx;
|
||||
height: 100vh;
|
||||
|
|
|
|||
|
|
@ -1,6 +1,7 @@
|
|||
<template>
|
||||
<view class="content">
|
||||
<view class="contentbox" :style="'background:url('+(shopExtend?shopExtend.value:'https://czg-qr-order.oss-cn-beijing.aliyuncs.com/indexs/shuangbackground.png')+') no-repeat center center / cover' ">
|
||||
<view class="contentbox"
|
||||
:style="'background:url('+(shopExtend?shopExtend.value:'https://czg-qr-order.oss-cn-beijing.aliyuncs.com/indexs/shuangbackground.png')+') no-repeat center center / cover' ">
|
||||
<view class="contentboxitem flex-between">
|
||||
<view class="contentboxitemleft flex-colum" @click="scanCodehandle(0)">
|
||||
<image src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/indexs/Xdiancan.png" mode="aspectFill">
|
||||
|
|
@ -31,84 +32,83 @@
|
|||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
userInfo: null,
|
||||
};
|
||||
},
|
||||
props: {
|
||||
shopUserInfo: {
|
||||
type: Object,
|
||||
default () {
|
||||
return {
|
||||
amount: '',
|
||||
shopName: ""
|
||||
}
|
||||
}
|
||||
},
|
||||
shopExtend: {
|
||||
type: Object,
|
||||
default () {
|
||||
return {}
|
||||
}
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
this.userInfo = uni.cache.get('userInfo');
|
||||
},
|
||||
methods: {
|
||||
scanCodehandle(i) {
|
||||
setTimeout(()=>{
|
||||
uni.cache.set('forceUpdate',2)
|
||||
},200)
|
||||
uni.scanCode({
|
||||
success: async (res) => {
|
||||
let tableCode = this.getQueryString(decodeURIComponent(res.result), 'code')
|
||||
uni.cache.set('tableCode', tableCode)
|
||||
if (tableCode) {
|
||||
let data = await this.api.productqueryShop({
|
||||
code: uni.cache.get('tableCode'),
|
||||
})
|
||||
console.log()
|
||||
<script setup>
|
||||
import {
|
||||
ref,
|
||||
onMounted,
|
||||
reactive
|
||||
} from "vue";
|
||||
import {
|
||||
onShow,
|
||||
} from '@dcloudio/uni-app'
|
||||
import {
|
||||
APIproductqueryShop
|
||||
} from "@/common/api/product/product.js";
|
||||
import {
|
||||
APIshopExtend
|
||||
} from "@/common/api/index/index.js";
|
||||
|
||||
if ( data.data.shopTableInfo && !data.data.shopTableInfo.choseCount ) {
|
||||
uni.pro.navigateTo('/pagesOrder/orderAMeal/index', {
|
||||
tableCode: tableCode,
|
||||
shopId: data.data.storeInfo.id,
|
||||
const shopExtend = reactive({
|
||||
autokey: "index_bg",
|
||||
createTime: "2024-08-27T06:59:35.000+00:00",
|
||||
id: 17,
|
||||
name: "首页",
|
||||
shopId: 29,
|
||||
type: "img",
|
||||
updateTime: null,
|
||||
value: ""
|
||||
})
|
||||
} else {
|
||||
uni.pro.navigateTo('order_food/order_food', {
|
||||
tableCode: tableCode,
|
||||
})
|
||||
}
|
||||
const userInfo = uni.cache.get('userInfo')
|
||||
const shopUserInfo = uni.cache.get('shopUserInfo')
|
||||
|
||||
}
|
||||
},
|
||||
fail: () => {
|
||||
}
|
||||
const scanCodehandle = (i) => {
|
||||
uni.pro.navigateTo('product/index', {
|
||||
tableCode: uni.cache.get('tableCode')
|
||||
})
|
||||
},
|
||||
memberindex(url) {
|
||||
// uni.scanCode({
|
||||
// success: async (res) => {
|
||||
// let tableCode = getQueryString(decodeURIComponent(res.result), 'code')
|
||||
// uni.cache.set('tableCode', tableCode)
|
||||
// if (tableCode) {
|
||||
// let data = await APIproductqueryShop({
|
||||
// code: uni.cache.get('tableCode'),
|
||||
// })
|
||||
// if (data.data.shopTableInfo && !data.data.shopTableInfo.choseCount) {
|
||||
// uni.pro.navigateTo('/pagesOrder/orderAMeal/index', {
|
||||
// tableCode: tableCode,
|
||||
// shopId: data.data.storeInfo.id,
|
||||
// })
|
||||
// } else {
|
||||
// uni.pro.navigateTo('product/product', {
|
||||
// tableCode: tableCode,
|
||||
// })
|
||||
// }
|
||||
// }
|
||||
// },
|
||||
// fail: () => {}
|
||||
// })
|
||||
}
|
||||
const memberindex = (url) => {
|
||||
uni.pro.navigateTo(url, {
|
||||
shopId: uni.cache.get('shopId'),
|
||||
type: 'index',
|
||||
})
|
||||
|
||||
},
|
||||
getQueryString(url, name) { //解码
|
||||
}
|
||||
const getQueryString = (url, name) => { //解码
|
||||
var reg = new RegExp('(^|&|/?)' + name + '=([^&|/?]*)(&|/?|$)', 'i')
|
||||
var r = url.substr(1).match(reg)
|
||||
if (r != null) {
|
||||
return r[2]
|
||||
}
|
||||
return null;
|
||||
},
|
||||
|
||||
}
|
||||
|
||||
};
|
||||
onShow(async () => {
|
||||
let res = await APIshopExtend({
|
||||
shopId: uni.cache.get('shopId'),
|
||||
autokey: "index_bg" //index_bg my_bg member_bg shopInfo_bg
|
||||
})
|
||||
Object.assign(shopExtend, res.data)
|
||||
})
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
|
|
|
|||
|
|
@ -1,9 +1,7 @@
|
|||
<template>
|
||||
<view>
|
||||
<Nav />
|
||||
<view class="content" :style="{ marginTop: `${store.height}px` }">
|
||||
<!-- 轮播图 -->
|
||||
<swipers :carousel='hometoplist.carousel'></swipers>
|
||||
<view class="content">
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
|
@ -11,7 +9,7 @@
|
|||
<script setup>
|
||||
import {
|
||||
ref,
|
||||
computed,
|
||||
reactive,
|
||||
onMounted
|
||||
} from "vue";
|
||||
import {
|
||||
|
|
@ -19,15 +17,8 @@
|
|||
onReady,
|
||||
onShow
|
||||
} from '@dcloudio/uni-app'
|
||||
import swipers from './components/swiper.vue' //引入轮播
|
||||
import popupad from '@/components/popupad.vue'
|
||||
import diamond from './components/diamond.vue'
|
||||
import todaylist from './components/todaylist.vue'
|
||||
import productlist from './components/productlist.vue'
|
||||
import advertisement from './components/advertisement.vue'
|
||||
import category from '@/components/qiyue-category/qiyue-category.vue';
|
||||
import indexs from './indexs.vue';
|
||||
import Nav from '@/components/indexnav.vue'; //导航栏
|
||||
import Nav from '@/components/CustomNavbar.vue'; //导航栏
|
||||
// pinia管理
|
||||
import {
|
||||
useNavbarStore
|
||||
} from '@/stores/navbarStore';
|
||||
|
|
@ -42,24 +33,8 @@
|
|||
isTransparent: false,
|
||||
hasPlaceholder: false //是否要占位符
|
||||
});
|
||||
const targetObj = {
|
||||
a: 1
|
||||
};
|
||||
const sourceObj1 = {
|
||||
b: 2
|
||||
};
|
||||
const sourceObj2 = {
|
||||
c: 3
|
||||
};
|
||||
|
||||
// 将 sourceObj1 和 sourceObj2 的属性复制到 targetObj
|
||||
const result = Object.assign(targetObj, sourceObj1, sourceObj2);
|
||||
|
||||
console.log(result);
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.content {
|
||||
height: 1000vh;
|
||||
}
|
||||
<style lang="scss" scoped>
|
||||
.content {}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,335 @@
|
|||
<template>
|
||||
<view class="content">
|
||||
<!-- 占位符导航栏 -->
|
||||
<Nav />
|
||||
<view class="onecontent">
|
||||
<image class="onecontentimage" :src="toplist.coverImg" mode="aspectFill"></image>
|
||||
<view class="onecontentabsolute">
|
||||
</view>
|
||||
<!-- 小内切圆 -->
|
||||
<view class="after"></view>
|
||||
</view>
|
||||
<view class="towcontent">
|
||||
<view class="fivecontent_item flex-between" v-for="(item,index) in list" :key="index">
|
||||
<view class="fivecontent_itemone flex-start">
|
||||
<image class="fivecontent_itemoneimage" :src="item.coverImg" mode=""></image>
|
||||
<view class="fivecontent_itemonebox">
|
||||
<view class="fivecontent_itemoneboxone flex-start">
|
||||
<view class="fivecontent_itemoneboxone_o">
|
||||
热销TOP{{index}}
|
||||
</view>
|
||||
<view class="fivecontent_itemoneboxone_t">
|
||||
{{item.shopName}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="fivecontent_itemoneboxtow flex-start" @click="goMap(item)">
|
||||
<image class="fivecontent_itemoneboxtowimage"
|
||||
src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/dw.png" mode="widthFix"></image>
|
||||
<view class="fivecontent_itemoneboxtow_o">
|
||||
{{item.address.length>7?item.address.substring(0,7)+'...':item.address}}
|
||||
</view>
|
||||
<view class="fivecontent_itemoneboxtow_t">
|
||||
{{item.distances}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="fivecontent_itemtow" @click="makePhoneCall(item)">
|
||||
马上预约
|
||||
</view>
|
||||
</view>
|
||||
<up-loadmore height='40' :status="form.status" iconSize='14' fontSize='14' />
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {
|
||||
ref,
|
||||
computed,
|
||||
reactive,
|
||||
onBeforeUnmount,
|
||||
onMounted,
|
||||
} from "vue";
|
||||
import {
|
||||
onLoad,
|
||||
onReady,
|
||||
onShow,
|
||||
onReachBottom,
|
||||
onPageScroll
|
||||
} from '@dcloudio/uni-app'
|
||||
import Nav from '@/components/CustomNavbar.vue'; //导航栏
|
||||
import {
|
||||
APIdistiricttopCommon,
|
||||
APIdistirictsubShopList
|
||||
} from "@/common/api/index/tothestore.js"
|
||||
import {
|
||||
useNavbarStore
|
||||
} from '@/stores/navbarStore';
|
||||
const store = useNavbarStore();
|
||||
|
||||
// 数据
|
||||
const list = ref([])
|
||||
const toplist = ref({})
|
||||
const form = reactive({
|
||||
address: '', //地址
|
||||
type: '', //品类
|
||||
orderBy: '', //1.理我最近 2.销量优先 3.价格优先
|
||||
other: '', //附近1KM 1选中 0不选中
|
||||
page: 1, //页数
|
||||
size: 10, //页容量
|
||||
status: 'loadmore'
|
||||
})
|
||||
const init_fn = () => {
|
||||
list.value = []
|
||||
form.page = 1 //页数
|
||||
form.size = 10 //页数
|
||||
form.status = 'loadmore' //页数
|
||||
distirictsubShopList()
|
||||
}
|
||||
|
||||
const distiricttopCommon = async () => {
|
||||
let res = await APIdistiricttopCommon({
|
||||
type: 'subShop', //团购卷品类Id/subShop-预约到店
|
||||
orderBy: ''
|
||||
})
|
||||
console.log(res.data.carousel[0])
|
||||
if (res.code == 0) {
|
||||
toplist.value = res.data.carousel[0]
|
||||
// 动态更新导航栏配置
|
||||
store.updateNavbarConfig({
|
||||
showBack: true, //左边返回键
|
||||
rightText: '', //右边文字
|
||||
showSearch: false, //true是标题其他事文字
|
||||
title: toplist.value.name,
|
||||
isTransparent: false,
|
||||
hasPlaceholder: false //是否要占位符
|
||||
});
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
const goMap = (d) => {
|
||||
uni.openLocation({
|
||||
longitude: (d.lng * 1),
|
||||
latitude: (d.lat * 1)
|
||||
})
|
||||
}
|
||||
// 打电话
|
||||
const makePhoneCall = (item) => {
|
||||
uni.makePhoneCall({
|
||||
phoneNumber: item.phone //仅为示例
|
||||
});
|
||||
}
|
||||
const distirictsubShopList = async () => {
|
||||
let res = await APIdistirictsubShopList({
|
||||
address: uni.cache.get('getLocationstorage').address, //地址
|
||||
lng: uni.cache.get('getLocationstorage').lng,
|
||||
lat: uni.cache.get('getLocationstorage').lat,
|
||||
distanceInKm: '10', //默认10 以经纬度为中心 多大范围以内 单位km
|
||||
isPage: '', //是否分页 1分页 0不分页
|
||||
page: form.page, //页数
|
||||
size: form.size, //页容量
|
||||
})
|
||||
if (res.data.pages < form.page) {
|
||||
form.status = 'nomore'
|
||||
if (form.page == 1 && res.data.list.length == 0) {
|
||||
list.value = []
|
||||
}
|
||||
return false;
|
||||
} else {
|
||||
form.status = 'loading';
|
||||
if (form.page == 1) {
|
||||
list.value = res.data.list
|
||||
} else {
|
||||
list.value = [...list.value, ...res.data.list];
|
||||
}
|
||||
form.page = ++form.page;
|
||||
if (form.page > res.data.pages) {
|
||||
form.status = 'nomore';
|
||||
} else {
|
||||
form.status = 'loading';
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
// // 滑动到指定位置导航栏隐藏
|
||||
onPageScroll((res) => {
|
||||
uni.$u.debounce(store.scrollTop = res.scrollTop, 500)
|
||||
});
|
||||
onMounted(() => {
|
||||
init_fn()
|
||||
distiricttopCommon()
|
||||
})
|
||||
onReachBottom(() => {
|
||||
distirictsubShopList()
|
||||
// 分页
|
||||
})
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
page {
|
||||
background: #F9F9F9;
|
||||
}
|
||||
|
||||
.content {
|
||||
.onecontent {
|
||||
width: 100%;
|
||||
height: 460rpx;
|
||||
position: relative;
|
||||
|
||||
.after {
|
||||
position: absolute;
|
||||
bottom: 32rpx;
|
||||
right: 0;
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
line-height: 40rpx;
|
||||
text-align: center;
|
||||
background-image: radial-gradient(160rpx at 0px 0px, rgba(0, 0, 0, 0) 40rpx, #F9F9F9 40rpx);
|
||||
}
|
||||
|
||||
.onecontentimage {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
top: 0;
|
||||
|
||||
}
|
||||
|
||||
.onecontentabsolute {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
padding: 0 52rpx;
|
||||
bottom: 64rpx;
|
||||
|
||||
.onecontentabsoluteitem {
|
||||
padding: 8rpx 16rpx;
|
||||
background: #FFFFFF;
|
||||
border-radius: 12rpx 12rpx 12rpx 12rpx;
|
||||
|
||||
image {
|
||||
width: 24.16rpx;
|
||||
height: 29.31rpx;
|
||||
}
|
||||
|
||||
input {
|
||||
padding: 0 16rpx;
|
||||
flex: auto;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
font-size: 24rpx;
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
.onecontentabsoluteitembotton {
|
||||
width: 120rpx;
|
||||
height: 56rpx;
|
||||
line-height: 56rpx;
|
||||
text-align: center;
|
||||
background: linear-gradient(109deg, #FF9D84 0%, #FFFFFF 100%);
|
||||
border-radius: 28rpx 28rpx 28rpx 28rpx;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: bold;
|
||||
font-size: 24rpx;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.towcontent {
|
||||
position: relative;
|
||||
margin-top: -32rpx;
|
||||
padding: 32rpx 28rpx;
|
||||
border-radius: 24rpx 0rpx 0rpx 0rpx;
|
||||
background: #F9F9F9;
|
||||
|
||||
.fivecontent_item:nth-child(1) {
|
||||
margin-top: 0;
|
||||
|
||||
}
|
||||
|
||||
.fivecontent_item {
|
||||
background: #FFFFFF;
|
||||
padding: 16rpx 24rpx;
|
||||
margin-top: 32rpx;
|
||||
width: 100%;
|
||||
border-radius: 10rpx 10rpx 10rpx 10rpx;
|
||||
|
||||
.fivecontent_itemone {
|
||||
.fivecontent_itemoneimage {
|
||||
width: 84rpx;
|
||||
height: 84rpx;
|
||||
border-radius: 16rpx;
|
||||
}
|
||||
|
||||
.fivecontent_itemonebox {
|
||||
margin-left: 16rpx;
|
||||
height: 84rpx;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.fivecontent_itemoneboxone {
|
||||
.fivecontent_itemoneboxone_o {
|
||||
padding: 2rpx 8rpx;
|
||||
background: linear-gradient(116deg, #FF9D2B 0%, #FF4805 100%);
|
||||
border-radius: 4rpx 4rpx 4rpx 4rpx;
|
||||
font-family: Roboto, Roboto;
|
||||
font-weight: 500;
|
||||
font-size: 16rpx;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
.fivecontent_itemoneboxone_t {
|
||||
margin-left: 12rpx;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
font-size: 28rpx;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
|
||||
.fivecontent_itemoneboxtow {
|
||||
margin-top: 10rpx;
|
||||
|
||||
.fivecontent_itemoneboxtowimage {
|
||||
width: 24rpx;
|
||||
height: 24rpx;
|
||||
}
|
||||
|
||||
.fivecontent_itemoneboxtow_o {
|
||||
margin-left: 8rpx;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
font-size: 24rpx;
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
.fivecontent_itemoneboxtow_t {
|
||||
margin-left: 16rpx;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
font-size: 24rpx;
|
||||
color: #999999;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.fivecontent_itemtow {
|
||||
padding: 8rpx 16rpx;
|
||||
background: #FEE06A;
|
||||
border-radius: 24rpx 24rpx 24rpx 24rpx;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: bold;
|
||||
font-size: 24rpx;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,47 @@
|
|||
<template>
|
||||
<view>
|
||||
<Nav />
|
||||
<view class="content">
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {
|
||||
ref,
|
||||
reactive,
|
||||
onMounted
|
||||
} from "vue";
|
||||
import {
|
||||
onLoad,
|
||||
onReady,
|
||||
onShow,
|
||||
onPageScroll
|
||||
} from '@dcloudio/uni-app'
|
||||
import Nav from '@/components/CustomNavbar.vue'; //导航栏
|
||||
// pinia管理
|
||||
import {
|
||||
useNavbarStore
|
||||
} from '@/stores/navbarStore';
|
||||
const store = useNavbarStore();
|
||||
|
||||
// 动态更新导航栏配置
|
||||
store.updateNavbarConfig({
|
||||
showBack: true, //左边返回键
|
||||
rightText: '', //右边文字
|
||||
showSearch: false, //true是标题其他事文字
|
||||
title: '',
|
||||
isTransparent: false,
|
||||
hasPlaceholder: false //是否要占位符
|
||||
});
|
||||
|
||||
// 标题滑动滑动
|
||||
onPageScroll((res) => {
|
||||
// isSticky.value = res.scrollTop > elementTop.value ? true : false
|
||||
// uni.$u.debounce(store.scrollTop = res.scrollTop, 500)
|
||||
});
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.content {}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,321 @@
|
|||
<template>
|
||||
<view class="content">
|
||||
<view class="content_box">
|
||||
<view class="content_box_item flex-start">
|
||||
<view class="content_box_item_one">
|
||||
联系人
|
||||
</view>
|
||||
<view class="content_box_item_tow">
|
||||
<input type="text" v-model="form.name" placeholder="请填写收货人姓名" />
|
||||
</view>
|
||||
</view>
|
||||
<view class="content_box_item flex-start">
|
||||
<view class="content_box_item_one">
|
||||
联系电话
|
||||
</view>
|
||||
<view class="content_box_item_tow">
|
||||
<input type="number" v-model="form.mobile" maxlength="11"
|
||||
placeholder="请填写收货人手机号码" />
|
||||
</view>
|
||||
</view>
|
||||
<pick-regions :defaultRegion="defaultRegionCode" @getRegion="handleGetRegion">
|
||||
<view class="content_box_item flex-start">
|
||||
<view class="content_box_item_one">
|
||||
所在地区
|
||||
</view>
|
||||
<view class="content_box_item_tow flex-start">
|
||||
<input type="text" v-model="regionName" disabled="disabled" placeholder="省市区、乡镇等" />
|
||||
<!-- <image class="content_box_itemimage" @click="chooseLocation" src="@/static/address.png" mode="aspectFill">
|
||||
</image> -->
|
||||
</view>
|
||||
</view>
|
||||
</pick-regions>
|
||||
<!-- <view class="content_box_item flex-start">
|
||||
<view class="content_box_item_one">
|
||||
所在街道
|
||||
</view>
|
||||
<view class="content_box_item_tow">
|
||||
<input type="text" v-model="form.name" placeholder="填写街道" />
|
||||
</view>
|
||||
</view> -->
|
||||
<view class="content_box_item flex-start">
|
||||
<view class="content_box_item_one">
|
||||
详细地址
|
||||
</view>
|
||||
<view class="content_box_item_tow">
|
||||
<input type="text" v-model="form.address" placeholder="请填写详细地址" />
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="content_box_tow flex-between">
|
||||
<view class="content_box_tow_one">
|
||||
设为默认地址
|
||||
</view>
|
||||
<u-switch v-model="showis_default" size="20" @change="change"></u-switch>
|
||||
</view>
|
||||
<view class="positionfixed flex-center" @click="usereditaddress">
|
||||
保存
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
import pickRegions from '@/components/pick-regions/pick-regions.vue'
|
||||
export default {
|
||||
components: {
|
||||
pickRegions
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
region: [],
|
||||
showis_default: true,
|
||||
defaultRegionCode: '610112', //默认未央区
|
||||
height: '',
|
||||
form: {
|
||||
regionName: '',
|
||||
type: ''
|
||||
},
|
||||
valueswitch: false
|
||||
};
|
||||
},
|
||||
async onLoad(e) {
|
||||
this.form.id = e.id
|
||||
if (e.type == 1) {
|
||||
uni.setNavigationBarTitle({
|
||||
title: '添加地址'
|
||||
})
|
||||
} else {
|
||||
uni.setNavigationBarTitle({
|
||||
title: '修改地址'
|
||||
})
|
||||
let res = await this.api.usereaddressshow({
|
||||
id: this.form.id
|
||||
})
|
||||
console.log(res)
|
||||
if (res) {
|
||||
this.form = res
|
||||
if (res.is_default == 1) {
|
||||
this.showis_default = true
|
||||
} else {
|
||||
this.showis_default = false
|
||||
}
|
||||
}
|
||||
}
|
||||
this.form.type = e.type
|
||||
},
|
||||
onShow() {},
|
||||
watch: {},
|
||||
computed: {
|
||||
regionName() {
|
||||
// 转为字符串
|
||||
let res = null
|
||||
if (this.region.length == 0) {
|
||||
res = this.form.province + this.form.city + this.form.area
|
||||
} else {
|
||||
res = this.region.map(item => item.name).join(' ')
|
||||
}
|
||||
return res
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
change(e) {
|
||||
this.showis_default = e
|
||||
console.log('change', e);
|
||||
},
|
||||
async usereditaddress() {
|
||||
if (this.form.name == null || this.form.name == '') {
|
||||
uni.showToast({
|
||||
title: '请输入姓名',
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (this.form.mobile == null || this.form.mobile == '') {
|
||||
uni.showToast({
|
||||
title: '请输入电话号码',
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (this.form.province == null || this.form.province == '') {
|
||||
uni.showToast({
|
||||
title: '请选择省，市，区',
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (this.form.address == null || this.form.address == '') {
|
||||
uni.showToast({
|
||||
title: '请输入详细地址',
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
|
||||
let res = await this.api.usereditaddress({
|
||||
id: this.form.id, //地址ID
|
||||
province: this.form.province, //省
|
||||
city: this.form.city, //市
|
||||
area: this.form.area, //区
|
||||
address: this.form.address, //详细地址
|
||||
name: this.form.name, //姓名
|
||||
mobile: this.form.mobile, //电话
|
||||
lng: this.form.lng, //经度
|
||||
is_default: this.showis_default == true ? 1 : '', //1 默认
|
||||
lat: this.form.lat, //维度
|
||||
type: this.form.type //1 添加 2修改
|
||||
})
|
||||
console.log(res)
|
||||
if (res == 1) {
|
||||
uni.showToast({
|
||||
title: this.form.type == 1 ? '添加成功' : '修改成功',
|
||||
icon: 'none'
|
||||
});
|
||||
setTimeout(() => {
|
||||
uni.navigateBack()
|
||||
}, 1000);
|
||||
}
|
||||
},
|
||||
handleGetRegion(region) {
|
||||
console.log(111, region)
|
||||
this.region = region
|
||||
this.form.province = region[0].name
|
||||
this.form.city = region[1].name
|
||||
this.form.area = region[2].name
|
||||
|
||||
},
|
||||
chooseLocation() {
|
||||
uni.chooseAddress({
|
||||
success: (res) => {
|
||||
console.log(res)
|
||||
this.form.address = res.address
|
||||
this.form.lat = res.latitude
|
||||
this.form.lng = res.longitude
|
||||
this.lnglat = res.latitude + '-' + res.longitude
|
||||
console.log('位置名称：' + res.name);
|
||||
console.log('详细地址：' + res.address);
|
||||
console.log('纬度：' + res.latitude);
|
||||
console.log('经度：' + res.longitude);
|
||||
},
|
||||
fail: (e) => {
|
||||
console.log(e)
|
||||
// uni.getSetting({
|
||||
// success: function(res) {
|
||||
// var statu = res.authSetting;
|
||||
// console.log(statu);
|
||||
// if (!statu['scope.userLocation']) {
|
||||
// console.log(123);
|
||||
// uni.showModal({
|
||||
// title: '是否授权当前位置',
|
||||
// content: '需要获取您的地理位置，请确认授权，否则地图功能将无法使用',
|
||||
// success(tip) {
|
||||
// if (tip.confirm) {
|
||||
// uni.authorize({
|
||||
// scope: 'scope.userLocation',
|
||||
// success:()=> {
|
||||
// this.chooseLocation()
|
||||
// }
|
||||
// })
|
||||
// } else {
|
||||
// uni.showToast({
|
||||
// title: '授权失败',
|
||||
// icon: 'none',
|
||||
// duration: 1000
|
||||
// })
|
||||
// }
|
||||
// }
|
||||
// })
|
||||
|
||||
// }
|
||||
// }
|
||||
// })
|
||||
}
|
||||
})
|
||||
},
|
||||
edit(e) {
|
||||
uni.pro.navigateTo('my/address/edit', e.id)
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background: #F9F9F9;
|
||||
}
|
||||
|
||||
.content {
|
||||
padding: 0 30rpx;
|
||||
|
||||
.content_box {
|
||||
padding-left: 40rpx;
|
||||
background: #FFF;
|
||||
|
||||
.content_box_item {
|
||||
margin-top: 24rpx;
|
||||
width: 100%;
|
||||
padding: 32rpx;
|
||||
border-bottom: 1rpx solid #F6F6F6;
|
||||
|
||||
.content_box_item_one {
|
||||
width: 112rpx;
|
||||
font-size: 28rpx;
|
||||
font-family: PingFang SC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.content_box_item_tow {
|
||||
flex: auto;
|
||||
padding-left: 80rpx;
|
||||
font-size: 28rpx;
|
||||
font-family: PingFang SC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #CCCCCC;
|
||||
|
||||
input {
|
||||
flex: auto;
|
||||
height: 100%;
|
||||
font-size: 28rpx;
|
||||
font-family: PingFang SC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #CCCCCC;
|
||||
}
|
||||
}
|
||||
|
||||
.content_box_itemimage {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.content_box_tow {
|
||||
margin-top: 24rpx;
|
||||
padding: 34rpx 44rpx;
|
||||
background: #FFF;
|
||||
|
||||
.content_box_tow_one {
|
||||
font-size: 28rpx;
|
||||
font-family: PingFang SC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
|
||||
.positionfixed {
|
||||
position: fixed;
|
||||
background: #f6f6f6;
|
||||
width: 90%;
|
||||
bottom: 50rpx;
|
||||
left: 5%;
|
||||
padding: 24rpx 34rpx;
|
||||
text-align: center;
|
||||
background:#f0cb66;
|
||||
border-radius: 46rpx;
|
||||
font-size: 30rpx;
|
||||
font-family: PingFang SC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,244 @@
|
|||
<template>
|
||||
<view class="content" >
|
||||
<view class="contentitem" v-for="(item,index) in list" :key="index" @click.stop="order_fn(item)">
|
||||
<view class="contentitemone flex-start">
|
||||
<view class="contentitemone_textone">
|
||||
{{item.name}}
|
||||
</view>
|
||||
<view class="contentitemone_textyow">
|
||||
{{item.mobile.replace(/(\d{3})\d{4}(\d{4})/, '$1****$2')}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="contentitemtow ">
|
||||
{{item.province}}{{item.area}}{{item.city}}{{item.address}}
|
||||
</view>
|
||||
<view class="contentitemthere flex-between">
|
||||
<view class="contentitemthereone flex-start" @click.stop="edit(item)">
|
||||
<u-icon v-if="item.is_default == 1" style="margin-right: 10rpx;" name="checkmark-circle-fill"
|
||||
color="##9397c1" size="18"></u-icon>
|
||||
<view v-else class="contentitemthereonecircle">
|
||||
|
||||
</view>
|
||||
默认地址
|
||||
</view>
|
||||
<view class="contentitemtheretow flex-start">
|
||||
<text @click.stop="edit(item)">编辑</text>
|
||||
<text style="margin-left: 60rpx;" @click.stop="clickdelete(item)">删除</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="positionfixed flex-center" @click="add">
|
||||
<u-icon name="plus" color="#FFF" size="24"></u-icon>
|
||||
<view style="margin-left: 20rpx;">添加地址</view>
|
||||
</view>
|
||||
<view v-if="list.length==0 && is_end == true" class="flex-colum">
|
||||
<image style="margin-top: 100rpx;" :src="bgnothave" mode="aspectFill">
|
||||
</image>
|
||||
</view>
|
||||
<u-loadmore :status="form.status" />
|
||||
<view :style="{height:height}"></view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
bgnothave: uni.getStorageSync('bgnothave'),
|
||||
height: '',
|
||||
is_order: 0,
|
||||
list: [],
|
||||
is_end: false,
|
||||
form: {
|
||||
page: 1,
|
||||
status: 'loadmore',
|
||||
},
|
||||
|
||||
};
|
||||
},
|
||||
onLoad(e) {
|
||||
this.is_order = e.order
|
||||
},
|
||||
onReachBottom() {
|
||||
this.usermyaddresslist()
|
||||
},
|
||||
|
||||
mounted() {
|
||||
var query = uni.createSelectorQuery().in(this).select('.positionfixed')
|
||||
query.boundingClientRect(ele => {
|
||||
var that = this;
|
||||
uni.getSystemInfo({
|
||||
success(res) {
|
||||
that.height = ele.height + 50 + "px";
|
||||
that = null;
|
||||
}
|
||||
})
|
||||
}).exec();
|
||||
},
|
||||
onShow() {
|
||||
// this.inif()
|
||||
},
|
||||
methods: {
|
||||
async usermyaddresslist() {
|
||||
let res = await this.api.usermyaddresslist({
|
||||
page: this.form.page
|
||||
})
|
||||
if (res.length == 0) {
|
||||
this.is_end = true
|
||||
this.form.status = 'nomore'
|
||||
return false;
|
||||
} else {
|
||||
this.form.status = 'loading';
|
||||
this.form.page = ++this.form.page;
|
||||
setTimeout(() => {
|
||||
this.list = [...this.list, ...res];
|
||||
if (res.length == 10) {
|
||||
this.form.status = 'loading';
|
||||
} else {
|
||||
this.is_end = true;
|
||||
this.form.status = 'nomore';
|
||||
}
|
||||
}, 500)
|
||||
}
|
||||
},
|
||||
order_fn(item) {
|
||||
if (this.is_order == 1) {
|
||||
uni.$emit('update', JSON.stringify(item));
|
||||
uni.navigateBack({
|
||||
delta: 1
|
||||
})
|
||||
|
||||
}
|
||||
},
|
||||
add() {
|
||||
uni.pro.navigateTo('my/address/edit', {
|
||||
type: 1
|
||||
})
|
||||
},
|
||||
edit(e) {
|
||||
uni.pro.navigateTo('my/address/edit', {
|
||||
type: 2,
|
||||
id: e.id
|
||||
})
|
||||
},
|
||||
inif() {
|
||||
this.list = []
|
||||
this.is_end = false,
|
||||
this.form = {
|
||||
page: 1,
|
||||
status: 'loadmore',
|
||||
},
|
||||
this.usermyaddresslist()
|
||||
},
|
||||
async clickdelete(e) {
|
||||
var this_ = this
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '确认删除该地址吗？',
|
||||
async success(data) {
|
||||
if (data.confirm) {
|
||||
let res = await this_.api.useredeleteaddress({
|
||||
id: e.id
|
||||
})
|
||||
if (res) {
|
||||
this_.inif()
|
||||
}
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background: #F9F9F9;
|
||||
}
|
||||
|
||||
.content {
|
||||
padding: 0 30rpx;
|
||||
|
||||
.positionfixed {
|
||||
position: fixed;
|
||||
background: #f6f6f6;
|
||||
width: 80%;
|
||||
bottom: 50rpx;
|
||||
left: 10%;
|
||||
padding: 24rpx 34rpx;
|
||||
text-align: center;
|
||||
background: var(--bg-color-button);
|
||||
border-radius: 46rpx;
|
||||
font-size: 30rpx;
|
||||
font-family: PingFang SC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
.contentitem {
|
||||
padding: 32rpx 40rpx;
|
||||
margin-top: 24rpx;
|
||||
width: 100%;
|
||||
background: #ffffff;
|
||||
border-radius: 18rpx;
|
||||
|
||||
.contentitemone {
|
||||
.contentitemone_textone {
|
||||
font-size: 28rpx;
|
||||
font-family: PingFang SC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.contentitemone_textyow {
|
||||
margin-left: 40rpx;
|
||||
font-size: 28rpx;
|
||||
font-family: PingFang SC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
|
||||
.contentitemtow {
|
||||
margin-top: 12rpx;
|
||||
font-size: 28rpx;
|
||||
font-family: PingFang SC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
.contentitemtow::after {
|
||||
display: inline-block;
|
||||
content: '';
|
||||
margin: 32rpx 0 20rpx 0;
|
||||
width: 100%;
|
||||
height: 1rpx;
|
||||
background: #f6f6f6;
|
||||
}
|
||||
|
||||
.contentitemthere {
|
||||
.contentitemthereone {
|
||||
font-size: 28rpx;
|
||||
font-family: PingFang SC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #5C685D;
|
||||
}
|
||||
|
||||
.contentitemthereonecircle {
|
||||
margin-right: 10rpx;
|
||||
border-radius: 50%;
|
||||
width: 28rpx;
|
||||
height: 28rpx;
|
||||
border: 2rpx solid #666666;
|
||||
}
|
||||
|
||||
.contentitemtheretow {
|
||||
font-size: 28rpx;
|
||||
font-family: PingFang SC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #666666;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,659 @@
|
|||
<template>
|
||||
<view class="container">
|
||||
<view class="towcontent">
|
||||
<view class="towcontentlistxitem flex-start">
|
||||
<view class="towcontentlistxitembox flex-colum"
|
||||
:class="tabIndex == item.type?'towcontentlistxitemboxopacity':''" v-for="(item,index) in tabList"
|
||||
:key="index" @click="towcontentclick(item)">
|
||||
<text class="title">{{item.name}}</text>
|
||||
<image v-if="tabIndex == item.type"
|
||||
src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/index/today/dg.png" mode="widthFix">
|
||||
</image>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="containertop"
|
||||
:class="{select: type == 'confirm_order_coupon' || type == 'confirm_order_product' || type == 'orderInfo_coupon' || type == 'orderInfo_product'}">
|
||||
<view class="containertopbox">
|
||||
<view class="containertopboxitem flex-start" v-for="(item,index) in list" :key="index">
|
||||
<view class="containertopboxitemleft flex-colum"
|
||||
:class="{'containertopboxitemleft_vip': item.type == 2,'containertopboxitemlefts': status != 1,}">
|
||||
<view class="containertopboxitemleft_one"
|
||||
:class="status == 1?'':'containertopboxitemleft_ones'">
|
||||
<block v-if="item.type == 2">
|
||||
<text>{{item.num || 0}}</text>
|
||||
<text style="font-size: 28rpx;margin-left: 6rpx;">张</text>
|
||||
</block>
|
||||
<block v-else>
|
||||
<text style="font-size: 28rpx;margin-right: 6rpx;">￥</text>
|
||||
<text>{{item.discountAmount || 0}}</text>
|
||||
</block>
|
||||
|
||||
</view>
|
||||
<view class="containertopboxitemleft_tow" :class="{
|
||||
'containertopboxitemleft_tows': status != 1,
|
||||
'containertopboxitemleft_nameVip': item.type == 2,
|
||||
}">
|
||||
{{ item.type == 2 ? item.name : '优惠券(元)'}}
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="containertopboxitemright">
|
||||
<view class="containertopboxitemright_one">
|
||||
<view class="flex-start">
|
||||
<image class="icon"
|
||||
src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/user/coupon_icon.png"
|
||||
mode="aspectFill">
|
||||
<text class="title">{{ item.shopName }}</text>
|
||||
</view>
|
||||
<text>无门槛使用</text>
|
||||
</view>
|
||||
<view class="containertopboxitemright_tow">
|
||||
<view> {{ item.type == 2 ? '会员商品券' : item.name}}</view>
|
||||
<view @click="navigatorGo(item)"
|
||||
:class="status == 1?'containertopboxitemright_four containertopboxitemright_btn':'containertopboxitemright_fours containertopboxitemright_btn'">
|
||||
{{status == 1 ? '去使用':'已使用'}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="containertopboxitemright_there" v-if="item.type == 1 ">
|
||||
有效期至：{{$u.timeFormat(item.endTime, 'yyyy/mm/dd') || '0'}}
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<image style="width: 402rpx;height: 442rpx;margin:240rpx auto 32rpx;"
|
||||
src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/nomore.png" v-if="list.length <= 0"
|
||||
mode="aspectFill"></image>
|
||||
<u-loadmore :status="form.status" iconSize='24' fontSize='24' height='40' />
|
||||
</view>
|
||||
</view>
|
||||
<view class="btnBox"
|
||||
v-if="type == 'confirm_order_coupon' || type == 'confirm_order_product' || type == 'orderInfo_coupon' || type == 'orderInfo_product'">
|
||||
<view class="btn" @click="cancelCoupon">暂不使用券</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
tabList: [
|
||||
|
||||
{
|
||||
name: '未使用',
|
||||
type: '1'
|
||||
},
|
||||
{
|
||||
name: '已使用',
|
||||
type: '2'
|
||||
},
|
||||
{
|
||||
name: '已过期',
|
||||
type: '-1'
|
||||
}
|
||||
],
|
||||
tabIndex: 1,
|
||||
list: [],
|
||||
status: 1,
|
||||
type: "",
|
||||
payAmount: 0,
|
||||
shopId: null,
|
||||
orderId: null,
|
||||
couopnInfo: null,
|
||||
shoppingCart: [],
|
||||
productList: [],
|
||||
|
||||
};
|
||||
},
|
||||
onLoad(options) {
|
||||
console.log(options)
|
||||
if (options.type) {
|
||||
this.type = options.type
|
||||
}
|
||||
if (options.payAmount) {
|
||||
this.payAmount = options.payAmount
|
||||
}
|
||||
if (options.shopId) {
|
||||
this.shopId = options.shopId
|
||||
}
|
||||
if (options.orderId) {
|
||||
this.orderId = options.orderId
|
||||
}
|
||||
if (options.couopnInfo) {
|
||||
this.couopnInfo = JSON.parse(decodeURIComponent(options.couopnInfo))
|
||||
}
|
||||
if (options.shoppingCart) {
|
||||
this.shoppingCart = JSON.parse(decodeURIComponent(options.shoppingCart))
|
||||
}
|
||||
if (options.productList) {
|
||||
this.productList = JSON.parse(decodeURIComponent(options.productList))
|
||||
}
|
||||
},
|
||||
onShow() {
|
||||
this.list = [];
|
||||
this.getCouponList()
|
||||
},
|
||||
methods: {
|
||||
|
||||
/**
|
||||
* 切换类型
|
||||
* @param {Object} item
|
||||
*/
|
||||
towcontentclick(item) {
|
||||
this.tabIndex = item.type;
|
||||
this.status = item.type;
|
||||
this.list = [];
|
||||
this.getCouponList()
|
||||
},
|
||||
|
||||
/**
|
||||
* 获取优惠券数据
|
||||
*/
|
||||
async getCouponList() {
|
||||
try {
|
||||
let params = {
|
||||
userId: uni.getStorageSync('userInfo').id,
|
||||
status: this.status
|
||||
}
|
||||
if (this.type == 'confirm_order_coupon' || this.type == 'confirm_order_product' || this.type ==
|
||||
'orderInfo_coupon' || this.type == 'orderInfo_product') {
|
||||
params.orderId = -1;
|
||||
}
|
||||
if (this.shopId) {
|
||||
params.shopId = this.shopId;
|
||||
}
|
||||
let res = await this.api.conponList(params)
|
||||
if (res.code == 0) {
|
||||
console.log(res)
|
||||
let list = [];
|
||||
if (this.type == 'confirm_order_coupon' || this.type == 'orderInfo_coupon') {
|
||||
list = res.data.filter(v => v.type == 1);
|
||||
} else if (this.type == 'confirm_order_product' || this.type == 'orderInfo_product') {
|
||||
list = res.data.filter(v => v.type == 2);
|
||||
} else {
|
||||
list = res.data;
|
||||
}
|
||||
this.list = list;
|
||||
}
|
||||
} catch (e) {
|
||||
//TODO handle the exception
|
||||
}
|
||||
},
|
||||
|
||||
/**
|
||||
* 去使用优惠券
|
||||
*/
|
||||
navigatorGo(item) {
|
||||
|
||||
uni.cache.set('shopId', item.shopId)
|
||||
if (this.type == 'confirm_order_coupon' || this.type == 'confirm_order_product' || this.type ==
|
||||
'orderInfo_coupon' || this.type == 'orderInfo_product') {
|
||||
if (item.type == 1) {
|
||||
if (this.payAmount < item.fullAmount) {
|
||||
uni.showToast({
|
||||
title: "当前订单金额不足使用金额",
|
||||
icon: "none",
|
||||
})
|
||||
return;
|
||||
}
|
||||
if (this.payAmount < item.discountAmount) {
|
||||
uni.showToast({
|
||||
title: "当前订单金额不足抵扣金额",
|
||||
icon: "none",
|
||||
})
|
||||
return;
|
||||
}
|
||||
uni.$emit('couponItem', JSON.stringify(item))
|
||||
let selectCouponData = uni.cache.get('selectCouponData') || [];
|
||||
let couponList = selectCouponData.filter(v => v.type == 1);
|
||||
if (couponList.length > 0) {
|
||||
couponList.map(items => {
|
||||
if (item.type == 1) {
|
||||
for (var v in items) {
|
||||
items[v] = item[v]
|
||||
}
|
||||
}
|
||||
})
|
||||
} else {
|
||||
selectCouponData.push(item)
|
||||
}
|
||||
uni.cache.set('selectCouponData', selectCouponData)
|
||||
uni.navigateBack();
|
||||
} else {
|
||||
let productNum = 0; //商品购物车数量
|
||||
let productTicketNum = 0; //商品券使用数量
|
||||
let product = this.shoppingCart.filter(v => v.productId == item.proId);
|
||||
let productTicket = this.productList.filter(v => v.productId == item.proId);
|
||||
if (product.length <= 0) {
|
||||
uni.showToast({
|
||||
title: "购物车没有" + item.name,
|
||||
icon: "none",
|
||||
})
|
||||
return;
|
||||
}
|
||||
if (this.productList.filter(v => v.userCouponId == item.id).length > 0) {
|
||||
uni.showToast({
|
||||
title: `当前优惠券已选择`,
|
||||
icon: "none",
|
||||
})
|
||||
return;
|
||||
}
|
||||
// 计算当前商品购物车数量
|
||||
product.forEach(item => {
|
||||
productNum += item.number;
|
||||
})
|
||||
// 计算当前商品券使用数量
|
||||
productTicket.forEach(item => {
|
||||
productTicketNum += item.num;
|
||||
})
|
||||
if ((productNum - productTicketNum) == 0) {
|
||||
uni.showToast({
|
||||
title: `当前商品已经全部抵扣`,
|
||||
icon: "none",
|
||||
})
|
||||
return;
|
||||
}
|
||||
let isNum = 0;
|
||||
let isProductItem;
|
||||
|
||||
// 确认订单
|
||||
if (this.type == 'confirm_order_product') {
|
||||
product.forEach(item => {
|
||||
for (let i = 0; i < item.number; i++) {
|
||||
isNum++
|
||||
if (isNum == productTicketNum + 1) {
|
||||
isProductItem = item;
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
if (this.payAmount < (isProductItem.memberPrice > 0 ? isProductItem.memberPrice : isProductItem
|
||||
.salePrice)) {
|
||||
uni.showToast({
|
||||
title: `当前金额不足商品抵扣`,
|
||||
icon: "none",
|
||||
})
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
// 订单详情
|
||||
if (this.type == 'orderInfo_product') {
|
||||
product.forEach(item => {
|
||||
for (let i = 0; i < item.num; i++) {
|
||||
isNum++
|
||||
if (isNum == productTicketNum + 1) {
|
||||
isProductItem = item;
|
||||
}
|
||||
}
|
||||
})
|
||||
|
||||
if (this.payAmount < (isProductItem.memberPrice > 0 ? isProductItem.memberPrice : isProductItem
|
||||
.price)) {
|
||||
uni.showToast({
|
||||
title: `当前金额不足商品抵扣`,
|
||||
icon: "none",
|
||||
})
|
||||
return;
|
||||
}
|
||||
}
|
||||
|
||||
if (!isProductItem) {
|
||||
uni.showToast({
|
||||
title: `当前订单无可抵扣商品`,
|
||||
icon: "none",
|
||||
})
|
||||
return;
|
||||
}
|
||||
// let productNum = 0;
|
||||
// product.map(item => {
|
||||
// productNum += item.number
|
||||
// })
|
||||
// if ( productNum < item.num) {
|
||||
// uni.showToast({
|
||||
// title: `购物车${item.name}数量不足`,
|
||||
// icon: "none",
|
||||
// })
|
||||
// return;
|
||||
// }
|
||||
// if (product[0].number item.num) {
|
||||
|
||||
// }
|
||||
uni.$emit('couponItem', JSON.stringify(item))
|
||||
let selectCouponData = uni.cache.get('selectCouponData') || [];
|
||||
selectCouponData.push(item)
|
||||
uni.cache.set('selectCouponData', selectCouponData)
|
||||
uni.navigateBack();
|
||||
}
|
||||
|
||||
|
||||
} else {
|
||||
uni.pro.navigateTo('/pages/order_food/order_food', {
|
||||
shopId: item.shopId
|
||||
})
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 取消使用优惠券/商品券
|
||||
*/
|
||||
async cancelCoupon() {
|
||||
let selectCouponData = uni.cache.get('selectCouponData')
|
||||
if (this.type == 'confirm_order_coupon' || this.type == 'orderInfo_coupon') {
|
||||
let couponList = selectCouponData.filter(v => v.type == 1);
|
||||
let productList = selectCouponData.filter(v => v.type == 2);
|
||||
if (couponList.length > 0) {
|
||||
uni.cache.set('selectCouponData', productList)
|
||||
if (this.couopnInfo && this.orderId) {
|
||||
let params = {
|
||||
shopId: this.shopId,
|
||||
orderId: this.orderId,
|
||||
}
|
||||
if (this.couopnInfo.userCouponInfos.filter(v => v.type == 2).length > 0) {
|
||||
params.userCouponInfos = this.couopnInfo.userCouponInfos.filter(v => v.type == 2)
|
||||
}
|
||||
if (this.couopnInfo.isPointsChecked && this.couopnInfo.calcUsablePointsData.pointsNum &&
|
||||
this.couopnInfo.calcUsablePointsData.pointsNum > 0) {
|
||||
params.pointsNum = this.couopnInfo.calcUsablePointsData.pointsNum;
|
||||
}
|
||||
let res = await this.api.useCoupon(params)
|
||||
}
|
||||
}
|
||||
} else if (this.type == 'confirm_order_product' || this.type == 'orderInfo_product') {
|
||||
let couponList = selectCouponData.filter(v => v.type == 1);
|
||||
let productList = selectCouponData.filter(v => v.type == 2);
|
||||
if (productList.length > 0) {
|
||||
uni.cache.set('selectCouponData', couponList)
|
||||
|
||||
if (this.couopnInfo && this.orderId) {
|
||||
let params = {
|
||||
shopId: this.shopId,
|
||||
orderId: this.orderId,
|
||||
}
|
||||
if (this.couopnInfo.userCouponInfos.filter(v => v.type == 1).length > 0) {
|
||||
params.userCouponInfos = this.couopnInfo.userCouponInfos.filter(v => v.type == 1)
|
||||
}
|
||||
if (this.couopnInfo.isPointsChecked && this.couopnInfo.calcUsablePointsData.pointsNum &&
|
||||
this.couopnInfo.calcUsablePointsData.pointsNum > 0) {
|
||||
params.pointsNum = this.couopnInfo.calcUsablePointsData.pointsNum;
|
||||
}
|
||||
let res = await this.api.useCoupon(params)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
uni.navigateBack();
|
||||
},
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.container {
|
||||
.towcontent {
|
||||
padding: 0 28rpx;
|
||||
border-top: 16rpx solid #f7f7f7;
|
||||
|
||||
.towcontentlistxitem {
|
||||
width: 100%;
|
||||
margin-top: 32rpx;
|
||||
|
||||
.towcontentlistxitembox {
|
||||
width: 33.33%;
|
||||
font-family: PingFang SC, PingFang SC;
|
||||
font-weight: 500;
|
||||
font-size: 28rpx;
|
||||
color: #333333;
|
||||
|
||||
image {
|
||||
margin-top: 6rpx;
|
||||
width: 38.83rpx;
|
||||
height: 8.62rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.towcontentlistxitemboxopacity {
|
||||
font-weight: bold;
|
||||
|
||||
text {
|
||||
color: #E3AD7F;
|
||||
}
|
||||
|
||||
image {
|
||||
width: 38.83rpx;
|
||||
height: 8.62rpx;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.containertop {
|
||||
padding: 40rpx 32rpx;
|
||||
|
||||
.containertopbox {
|
||||
margin-top: 8rpx;
|
||||
|
||||
.containertopboxitem::after {
|
||||
position: absolute;
|
||||
bottom: 14rpx;
|
||||
left: 14rpx;
|
||||
content: '';
|
||||
display: inline-block;
|
||||
background: url(https://czg-qr-order.oss-cn-beijing.aliyuncs.com/coupontop.png) no-repeat;
|
||||
width: 72.83rpx;
|
||||
height: 77.14rpx;
|
||||
background-size: cover;
|
||||
}
|
||||
|
||||
.containertopboxitem {
|
||||
margin-bottom: 32rpx;
|
||||
width: 100%;
|
||||
position: relative;
|
||||
border-radius: 18rpx;
|
||||
box-shadow: 0rpx 6rpx 12rpx 2rpx rgba(0, 0, 0, 0.16);
|
||||
overflow: hidden;
|
||||
|
||||
.containertopboxitemleft {
|
||||
position: relative;
|
||||
width: 182rpx;
|
||||
height: 192rpx;
|
||||
background: #E3AD7F;
|
||||
border-radius: 18rpx 0rpx 0rpx 18rpx;
|
||||
padding: 0 20rpx;
|
||||
|
||||
|
||||
// ::before {
|
||||
// content: '';
|
||||
// position: absolute;
|
||||
// bottom: 0rpx;
|
||||
// left: 166rpx;
|
||||
// background: #fff;
|
||||
// display: inline-block;
|
||||
// width: 32rpx;
|
||||
// height: 16rpx;
|
||||
// line-height: 32rpx;
|
||||
// border-radius: 32rpx 32rpx 0 0;
|
||||
// box-shadow: 0rpx 6rpx 12rpx 2rpx rgba(255, 255, 255, 0.16);
|
||||
// z-index: 999;
|
||||
|
||||
// }
|
||||
|
||||
.containertopboxitemleft_one {
|
||||
text {
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 60rpx;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
|
||||
.containertopboxitemleft_ones {
|
||||
text {
|
||||
color: #999999;
|
||||
}
|
||||
}
|
||||
|
||||
.containertopboxitemleft_tow {
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
.containertopboxitemleft_nameVip {
|
||||
color: #967152;
|
||||
}
|
||||
|
||||
.containertopboxitemleft_tows {
|
||||
color: #999999;
|
||||
}
|
||||
}
|
||||
|
||||
.containertopboxitemleft::after {
|
||||
content: '';
|
||||
position: absolute;
|
||||
top: -20rpx;
|
||||
left: 166rpx;
|
||||
background: #fff;
|
||||
display: inline-block;
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
border-radius: 50%;
|
||||
box-shadow: inset 0rpx 1rpx 9rpx 21rpx rgba(0, 0, 0, 0.04);
|
||||
z-index: 999;
|
||||
}
|
||||
|
||||
.containertopboxitemleft::before {
|
||||
content: '';
|
||||
position: absolute;
|
||||
bottom: -20rpx;
|
||||
left: 166rpx;
|
||||
background: #fff;
|
||||
display: inline-block;
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
border-radius: 50%;
|
||||
box-shadow: inset 0rpx 0rpx 15rpx 1rpx rgba(0, 0, 0, 0.1);
|
||||
z-index: 999;
|
||||
}
|
||||
|
||||
.containertopboxitemleft_vip {
|
||||
background-color: #E1D4B2;
|
||||
}
|
||||
|
||||
.containertopboxitemlefts {
|
||||
background: #F7F7F7;
|
||||
}
|
||||
|
||||
.containertopboxitemright {
|
||||
position: relative;
|
||||
padding: 0 32rpx;
|
||||
flex: auto;
|
||||
height: 192rpx;
|
||||
background: #FFFFFF;
|
||||
border-radius: 0rpx 18rpx 18rpx 0rpx;
|
||||
|
||||
.containertopboxitemright_one {
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
padding: 16rpx 0 20rpx 0;
|
||||
border-bottom: 1rpx dashed #707070;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
|
||||
.icon {
|
||||
width: 26rpx;
|
||||
height: 26rpx;
|
||||
margin-right: 14rpx;
|
||||
}
|
||||
|
||||
text {
|
||||
font-weight: bold;
|
||||
font-size: 24rpx;
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
.title {
|
||||
color: #333;
|
||||
}
|
||||
}
|
||||
|
||||
.containertopboxitemright_tow {
|
||||
margin-top: 24rpx;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: bold;
|
||||
font-size: 32rpx;
|
||||
color: #333333;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.containertopboxitemright_there {
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
.containertopboxitemright_btn {
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
padding: 8rpx 24rpx;
|
||||
border-radius: 24rpx 24rpx 24rpx 24rpx;
|
||||
}
|
||||
|
||||
.containertopboxitemright_four {
|
||||
color: #FFFFFF;
|
||||
background: #967152;
|
||||
}
|
||||
|
||||
.containertopboxitemright_fours {
|
||||
color: #999999;
|
||||
background: #F7F7F7;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.select {
|
||||
padding-bottom: 180rpx;
|
||||
}
|
||||
|
||||
.btnBox {
|
||||
width: 100%;
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
z-index: 999;
|
||||
background-color: #fff;
|
||||
padding: 30rpx 30rpx 50rpx 30rpx;
|
||||
|
||||
.btn {
|
||||
width: 100%;
|
||||
height: 90rpx;
|
||||
line-height: 90rpx;
|
||||
text-align: center;
|
||||
font-weight: bold;
|
||||
font-size: 36rpx;
|
||||
color: #FFFFFF;
|
||||
border-radius: 12rpx;
|
||||
background: #E3AD7F;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,453 @@
|
|||
<template>
|
||||
<view class="container">
|
||||
|
||||
<view class="info_list">
|
||||
|
||||
<view class="list_item">
|
||||
<view class="list_item_left">头像</view>
|
||||
<view class="list_item_right flex-center">
|
||||
<!-- #ifdef MP-WEIXIN -->
|
||||
<button class="list_item_right_head" type="default" open-type="chooseAvatar" @chooseavatar="onChooseAvatar">
|
||||
<image class="list_item_right_head" :src="userHeadImg" mode="aspectFill"></image>
|
||||
</button>
|
||||
<!-- #endif -->
|
||||
<!-- #ifdef MP-ALIPAY -->
|
||||
<button class="list_item_right_head" @click="onChooseAvatar">
|
||||
<image class="list_item_right_head" :src="userHeadImg" mode="aspectFill"></image>
|
||||
</button>
|
||||
<!-- #endif -->
|
||||
|
||||
<u-icon name="arrow-right" color="#999999" size="16"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
<view class="list_item">
|
||||
<view class="list_item_left">昵称</view>
|
||||
<view class="list_item_right" style="width: 100%;">
|
||||
<u-input v-model="nickName" type="text" input-align="right" placeholder="请输入不支持特殊字符10个字以内" :custom-style="{color:'#333',fontSize: '28rpx',border:'none'}" placeholder-style="color:#999;font-size: 28rpx"/>
|
||||
</view>
|
||||
</view>
|
||||
<view class="list_item">
|
||||
<view class="list_item_left">账号</view>
|
||||
<view class="list_item_right ">
|
||||
<!-- #ifdef MP-WEIXIN -->
|
||||
<button class="phone" v-if="!mobile" open-type="getPhoneNumber" @getphonenumber="getPhone">
|
||||
<!-- #endif -->
|
||||
<!-- #ifdef MP-ALIPAY -->
|
||||
<button class="phone" v-if="!mobile" open-type="getAuthorize" scope='phoneNumber' @getAuthorize="getPhone" @error="getPhoneError">
|
||||
<!-- #endif -->
|
||||
<view class="flex-colum-end">
|
||||
<view class="text">请授权手机号</view>
|
||||
</view>
|
||||
</button>
|
||||
<view v-else >
|
||||
<view class="flex-colum-end">
|
||||
<view class="text">{{phonetitle }}</view>
|
||||
<view class="place">绑定的手机号不能修改</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="list_item">
|
||||
<view class="list_item_left">性别</view>
|
||||
<view class="list_item_right flex-center">
|
||||
<view class="place r" @click="sexShow = true">{{sexText}}</view>
|
||||
<u-picker @cancel="sexShow = false" itemHeight="66" :show="sexShow" :columns="sexList" keyName="label" @confirm="confirmSex"></u-picker>
|
||||
<u-icon name="arrow-right" color="#999999" size="16"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
<view class="list_item">
|
||||
<view class="list_item_left">生日</view>
|
||||
<view class="list_item_right flex-center">
|
||||
<view class="place r" @click="calendarShow = (birthDay ? false : true)"> {{ birthDay || '生日一旦填写不能修改'}}</view>
|
||||
<!-- <u-calendar @close="calendarShow = false" monthNum="99" minDate="1945-01-01" maxDate="2055-12-12" :show="calendarShow" mode="single" @confirm="confirmCalendar"></u-calendar> -->
|
||||
<!-- <u-picker :show="calendarShow" ref="uPicker" :columns="columns" @confirm="confirm" @change="changeHandler"></u-picker> -->
|
||||
<!-- <picker :show="calendarShow" mode="date"></picker> -->
|
||||
<u-datetime-picker
|
||||
mode="date"
|
||||
itemHeight="90"
|
||||
visibleItemCount="5"
|
||||
@cancel="calendarShow = false"
|
||||
:show="calendarShow"
|
||||
:minDate="-2208988800000"
|
||||
v-model="value1"
|
||||
@confirm="confirmTime"
|
||||
></u-datetime-picker>
|
||||
<u-icon name="arrow-right" color="#999999" size="16"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
<view class="list_item" @click="boxClick">
|
||||
<view class="list_item_left">绑定微信</view>
|
||||
<view class="list_item_right flex-center">
|
||||
<view class="text r">已绑定</view>
|
||||
<u-icon name="arrow-right" color="#999999" size="16"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="save active" @click="$u.debounce(sumbit, 500)">保存</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
components: {
|
||||
},
|
||||
|
||||
data() {
|
||||
return {
|
||||
sexShow: false,
|
||||
calendarShow: false,
|
||||
sexText: '请选择',
|
||||
value1: Number(new Date()),
|
||||
form: {
|
||||
sex: 1,
|
||||
address: '', //地址
|
||||
type: '', //品类
|
||||
orderBy: '', //1.理我最近 2.销量优先 3.价格优先
|
||||
other: '', //附近1KM 1选中 0不选中
|
||||
page: 1, //页数
|
||||
size: 10, //页容量
|
||||
status: 'loadmore',
|
||||
},
|
||||
sexList: [
|
||||
[{
|
||||
value: 1,
|
||||
label: '男'
|
||||
},
|
||||
{
|
||||
value: 0,
|
||||
label: '女'
|
||||
},]
|
||||
],
|
||||
|
||||
userInfo: uni.cache.get('userInfo'),
|
||||
userHeadImg: "",
|
||||
nickName: '',
|
||||
birthDay: "",
|
||||
mobile: "",
|
||||
phonetitle: ""
|
||||
};
|
||||
},
|
||||
computed:{
|
||||
|
||||
},
|
||||
onLoad() {
|
||||
this.userInfo = uni.cache.get('userInfo')
|
||||
this.userHeadImg = this.userInfo.headImg;
|
||||
this.nickName = this.userInfo.nickName;
|
||||
this.sex = this.userInfo.sex;
|
||||
if ( this.userInfo.sex != null ) {
|
||||
this.sexText = this.userInfo.sex == 1 ? '男' : '女';
|
||||
}
|
||||
this.birthDay = this.userInfo.birthDay;
|
||||
this.phonetitle = this.userInfo.telephone ? (this.userInfo.telephone.substr(0, 3) + "****" + this.userInfo.telephone.substr(7)) : ""
|
||||
this.mobile = this.userInfo.telephone;
|
||||
this.date = this.getDate({ format: true})
|
||||
},
|
||||
|
||||
methods: {
|
||||
|
||||
/**
|
||||
* 确定生日
|
||||
* @param {Object} e
|
||||
*/
|
||||
confirmTime(e) {
|
||||
this.calendarShow = false;
|
||||
this.birthDay = this.getDate(e.value);
|
||||
},
|
||||
|
||||
/**
|
||||
* 确定性别
|
||||
* @param {Object} e
|
||||
*/
|
||||
confirmSex(e) {
|
||||
this.sexShow = false;
|
||||
this.sex = e.value[0].value;
|
||||
this.sexText = e.value[0].label;
|
||||
console.log(e)
|
||||
},
|
||||
|
||||
getDate(time) { //年月日
|
||||
const date = new Date(time);
|
||||
// const date = new Date();
|
||||
let year = date.getFullYear();
|
||||
let month = date.getMonth() + 1;
|
||||
let day = date.getDate();
|
||||
|
||||
|
||||
month = month > 9 ? month : '0' + month;
|
||||
day = day > 9 ? day : '0' + day;
|
||||
return `${year}-${month}-${day}`;
|
||||
},
|
||||
|
||||
/**
|
||||
* 获取手机号
|
||||
* @param {Object} d
|
||||
*/
|
||||
async getPhone(d) {
|
||||
console.log(d)
|
||||
// #ifdef MP-WEIXIN
|
||||
if (d.detail.iv) {
|
||||
uni.login({
|
||||
provider: 'weixin',
|
||||
success: async (data) => {
|
||||
// 微信小程序环境
|
||||
console.log(data)
|
||||
let res = await this.api.userwxlogins({
|
||||
code: data.code,
|
||||
encryptedData: d.detail.encryptedData,
|
||||
iv: d.detail.iv,
|
||||
source: "wechar"
|
||||
})
|
||||
this.phonetitle = res.data.substr(0, 3) + "****" + res.data.substr(7)
|
||||
this.mobile = res.data;
|
||||
}
|
||||
});
|
||||
}
|
||||
// #endif
|
||||
// #ifdef MP-ALIPAY
|
||||
// 支付宝小程序环境
|
||||
my.getAuthCode({
|
||||
scopes: 'auth_user',
|
||||
success: (res) => {
|
||||
console.log(res)
|
||||
let authCode = res.authCode;
|
||||
my.getPhoneNumber({
|
||||
success: async (data) => {
|
||||
let res = await this.api.userwxlogins({
|
||||
// code: authCode,
|
||||
encryptedData: JSON.parse(data.response).response,
|
||||
source: "alipay"
|
||||
})
|
||||
this.phonetitle = res.data.substr(0, 3) + "****" + res.data.substr(7)
|
||||
this.mobile = res.data;
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
// #endif
|
||||
},
|
||||
|
||||
getPhoneError (e) {
|
||||
console.log(e)
|
||||
},
|
||||
|
||||
/**
|
||||
* 取消绑定/退出登录
|
||||
*/
|
||||
boxClick() {
|
||||
uni.showModal({
|
||||
title: '注意',
|
||||
content: '确定要取消绑定吗？',
|
||||
success: async (res) => {
|
||||
if (res.confirm) {
|
||||
try {
|
||||
await this.api.loginOut();
|
||||
} catch (e) {
|
||||
//TODO handle the exception
|
||||
}
|
||||
uni.cache.clear();
|
||||
uni.reLaunch({
|
||||
url: '/pages/login/login'
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
/**
|
||||
* 上传头像
|
||||
* @param {Object} e
|
||||
*/
|
||||
onChooseAvatar(e) {
|
||||
let _this = this;
|
||||
//#ifdef MP-WEIXIN
|
||||
let avatarUrl = e.detail.avatarUrl
|
||||
uni.uploadFile({
|
||||
url: uni.conf.baseUrl + '/common/upload',
|
||||
// url: uni.conf.baseUrl + '/common/upload',
|
||||
filePath: avatarUrl,
|
||||
header: {
|
||||
environment: 'app',
|
||||
type: 'android',
|
||||
version: '1.7.3',
|
||||
'content-type': 'multipart/form-data'
|
||||
},
|
||||
fileType:'image',
|
||||
name: "file",
|
||||
formData: {
|
||||
file: avatarUrl,
|
||||
},
|
||||
success: (uploadFileRes) => {
|
||||
let { data } = JSON.parse(uploadFileRes.data)
|
||||
this.userHeadImg = data
|
||||
},
|
||||
fail: (res) => {
|
||||
console.log(res)
|
||||
}
|
||||
});
|
||||
// #endif
|
||||
//#ifdef MP-ALIPAY
|
||||
uni.chooseImage({
|
||||
count: 1, // 默认9，设置图片的数量
|
||||
sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有
|
||||
sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有
|
||||
success: function (res) {
|
||||
// 成功选择图片后
|
||||
let avatarUrl = res.tempFilePaths[0]; // 获取文件路径
|
||||
|
||||
my.uploadFile({
|
||||
url: uni.conf.baseUrl + '/common/upload',
|
||||
// url: uni.conf.baseUrl + '/common/upload',
|
||||
filePath: avatarUrl,
|
||||
header: {
|
||||
environment: 'app',
|
||||
type: 'android',
|
||||
version: '1.7.3',
|
||||
'content-type': 'multipart/form-data'
|
||||
},
|
||||
fileType:'image',
|
||||
name: "file",
|
||||
formData: {
|
||||
file: avatarUrl,
|
||||
},
|
||||
success: (uploadFileRes) => {
|
||||
let { data } = JSON.parse(uploadFileRes.data)
|
||||
_this.userHeadImg = data
|
||||
},
|
||||
fail: (res) => {
|
||||
console.log(res)
|
||||
}
|
||||
});
|
||||
},
|
||||
fail: (res) => {
|
||||
console.log(res)
|
||||
}
|
||||
});
|
||||
|
||||
// #endif
|
||||
|
||||
|
||||
},
|
||||
|
||||
/**
|
||||
* 保存
|
||||
*/
|
||||
async sumbit() {
|
||||
let res = await this.api.upUserInfo({
|
||||
headImg: this.userHeadImg,
|
||||
nickName: this.nickName,
|
||||
sex: this.sex,
|
||||
birthDay: this.birthDay,
|
||||
telephone: this.mobile,
|
||||
})
|
||||
if (res.code == 0) {
|
||||
uni.navigateBack()
|
||||
}
|
||||
}
|
||||
|
||||
},
|
||||
computed: {
|
||||
HeighT() { //手机类型的尺寸
|
||||
return this.$store.getters.is_BarHeight
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
page {
|
||||
background: #fff;
|
||||
}
|
||||
.container{
|
||||
|
||||
::v-deep .u-input input{
|
||||
background-color: transparent;
|
||||
}
|
||||
.info_list{
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 0 20rpx;
|
||||
.list_item{
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
padding: 24rpx 0;
|
||||
border-bottom: 1rpx solid #E5E5E5;
|
||||
.list_item_left{
|
||||
font-weight: bold;
|
||||
font-size: 32rpx;
|
||||
color: #333333;
|
||||
flex-shrink: 0;
|
||||
}
|
||||
.list_item_right{
|
||||
font-weight: 400;
|
||||
font-size: 28rpx;
|
||||
color: #333333;
|
||||
.list_item_right_head{
|
||||
width: 98rpx;
|
||||
height: 98rpx;
|
||||
border-radius: 50rpx;
|
||||
margin-right: 16rpx;
|
||||
padding: 0;
|
||||
}
|
||||
.phone{
|
||||
border: none;
|
||||
background-color: transparent;
|
||||
// #ifdef MP-ALIPAY
|
||||
display: initial;
|
||||
// #endif
|
||||
}
|
||||
.place{
|
||||
font-size: 28rpx;
|
||||
color: #999;
|
||||
line-height: initial;
|
||||
}
|
||||
.text{
|
||||
font-size: 28rpx;
|
||||
color: #333;
|
||||
line-height: initial;
|
||||
}
|
||||
|
||||
.r{
|
||||
margin-right: 16rpx;
|
||||
}
|
||||
button{
|
||||
outline: none;
|
||||
text{
|
||||
color: #fff!important;
|
||||
}
|
||||
}
|
||||
button::after{
|
||||
border: none;
|
||||
}
|
||||
button:active {
|
||||
background-color: inherit;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.save{
|
||||
width: 502rpx;
|
||||
height: 96rpx;
|
||||
line-height: 96rpx;
|
||||
text-align: center;
|
||||
background-color: #E0E0E0;
|
||||
border-radius: 48rpx;
|
||||
font-weight: 400;
|
||||
font-size: 32rpx;
|
||||
color: #999999;
|
||||
position: fixed;
|
||||
bottom: 100rpx;
|
||||
left: 0;
|
||||
right: 0;
|
||||
margin: auto;
|
||||
}
|
||||
.save.active{
|
||||
background-color: #E3AD7F;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
</style>
|
||||
|
|
@ -0,0 +1,254 @@
|
|||
<template>
|
||||
<view class="Box">
|
||||
<view class="box_one" v-if="isPwd == 0">安全密码用于商户推广提现/订单退款，确保资金安全</view>
|
||||
<view class="box_box">
|
||||
<view class="box_item flex-between" v-if="isPwd == 0">
|
||||
<text class="top_box_one_text">手机号码</text>
|
||||
<input type="number" v-model="form.mobile" placeholder="请输入手机号" maxlength="11" disabled="disabled" />
|
||||
</view>
|
||||
<view class="box_item flex-between">
|
||||
<text class="top_box_one_text">密码</text>
|
||||
<input type="number" v-model="form.password" placeholder="密码必须是6位" maxlength="6"
|
||||
:password="!passwords" />
|
||||
</view>
|
||||
<view class="box_item flex-between">
|
||||
<text class="top_box_one_text">确认密码</text>
|
||||
<input type="number" v-model="form.payPassword" placeholder="确认密码必须是6位" maxlength="6"
|
||||
:password="!payPasswords" />
|
||||
</view>
|
||||
<view class="box_item flex-between" style="position:relative;">
|
||||
<text class="top_box_one_text">验证码</text>
|
||||
<input type="number" v-model="form.checkCode" placeholder="请输入验证码" style="padding-right: 140rpx;" />
|
||||
<view class="top_box_one_texts">
|
||||
<view v-if="showText == true" class="yzm" @click="CodeRegister">{{ Recapture }}</view>
|
||||
<view v-else style="color: #ccc; background-color: #f9f9f9; border-radius:16px; padding: 10rpx;">
|
||||
{{ second }}s重新发送
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="flex-colum">
|
||||
<view class="Box_bottom" @click="userInfosavePayPassword">确定</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
isPwd: uni.cache.get('userInfo').isPwd,
|
||||
form: {
|
||||
mobile: uni.cache.get('userInfo').telephone,
|
||||
password: '',
|
||||
payPassword: '',
|
||||
checkCode: ''
|
||||
},
|
||||
passwords: false,
|
||||
payPasswords: false,
|
||||
// 注册定时器 初始值
|
||||
second: 60,
|
||||
showText: true,
|
||||
Recapture: '发送验证码'
|
||||
};
|
||||
},
|
||||
onLoad() {
|
||||
|
||||
if (uni.cache.get('userInfo').isPwd != 0) {
|
||||
uni.setNavigationBarTitle({
|
||||
title: '忘记支付密码', // 标题文本，必须是字符串
|
||||
});
|
||||
}
|
||||
|
||||
},
|
||||
methods: {
|
||||
async CodeRegister() {
|
||||
const res = await this.api.phoneValidateCode({
|
||||
// post 手机验证码
|
||||
phone: this.form.mobile
|
||||
});
|
||||
if (res) {
|
||||
uni.showToast({
|
||||
title: '验证码获取成功',
|
||||
icon: 'none'
|
||||
});
|
||||
// 定时器
|
||||
this.showText = false;
|
||||
this.Recapture = '重新获取';
|
||||
var interval = setInterval(() => {
|
||||
let times = --this.second;
|
||||
this.second = times < 10 ? '0' + times : times; //小于10秒补 0
|
||||
}, 1000);
|
||||
setTimeout(() => {
|
||||
clearInterval(interval);
|
||||
this.second = 60;
|
||||
this.showText = true;
|
||||
}, 60000);
|
||||
}
|
||||
},
|
||||
async loginwxuserInfo() {
|
||||
let res = await this.api.loginwxuserInfo({
|
||||
userId: uni.getStorageSync('userInfo').id,
|
||||
})
|
||||
if (res.code == 0) {
|
||||
uni.cache.set('userInfo', res.data);
|
||||
}
|
||||
},
|
||||
async userInfosavePayPassword() {
|
||||
|
||||
if (this.form.mobile.length != 11 && this.isPwd == 0) {
|
||||
uni.showToast({
|
||||
title: '手机号必须是11位',
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (this.form.password == null || this.form.password == '') {
|
||||
uni.showToast({
|
||||
title: '请输入密码',
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (this.form.payPassword == null || this.form.payPassword == '') {
|
||||
uni.showToast({
|
||||
title: '请输入确认密码',
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (this.form.password.length != 6 || this.form.payPassword.length != 6) {
|
||||
uni.showToast({
|
||||
title: '密码必须是6位',
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (this.form.payPassword != this.form.password) {
|
||||
uni.showToast({
|
||||
title: '密码和确认密码不一致',
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (this.form.checkCode == null || this.form.checkCode == '') {
|
||||
uni.showToast({
|
||||
title: '请输入验证码',
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
let res = await this.api.loginresetPwd({
|
||||
pwd: this.form.password,
|
||||
code: this.form.checkCode
|
||||
})
|
||||
|
||||
if (res.code == 0) {
|
||||
if (uni.cache.get('userInfo').isPwd != 0) {
|
||||
uni.showToast({
|
||||
title: '修改成功',
|
||||
icon: 'none'
|
||||
});
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '设置成功',
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
// 获取用户信息
|
||||
this.loginwxuserInfo()
|
||||
setTimeout(() => {
|
||||
uni.navigateBack();
|
||||
}, 1000);
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background: #f9f9f9;
|
||||
}
|
||||
|
||||
.Box {
|
||||
padding: 0 28rpx;
|
||||
|
||||
.box_one {
|
||||
margin-top: 26rpx;
|
||||
font-size: 24rpx;
|
||||
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #999999;
|
||||
}
|
||||
|
||||
.box_box {
|
||||
background: #fff;
|
||||
padding: 0 32rpx;
|
||||
|
||||
.box_item {
|
||||
.top_box_one_text {
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 28rpx;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
input {
|
||||
padding: 26rpx 0;
|
||||
width: 75%;
|
||||
font-size: 24rpx;
|
||||
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #999999;
|
||||
border-bottom: 1rpx solid #E5E5E5;
|
||||
}
|
||||
|
||||
.repeat {
|
||||
position: absolute;
|
||||
bottom: 26rpx;
|
||||
right: 0;
|
||||
width: 25rpx;
|
||||
height: 17rpx;
|
||||
}
|
||||
|
||||
.top_box_one_texts {
|
||||
position: absolute;
|
||||
right: 32rpx;
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #5082fd;
|
||||
|
||||
.yzm {
|
||||
padding: 6rpx 10rpx;
|
||||
background: #FFD158;
|
||||
border-radius: 6px 6px 6px 6px;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 12px;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.flex-colum {
|
||||
width: 100%;
|
||||
margin-top: 156rpx;
|
||||
|
||||
.Box_bottom {
|
||||
width: 558rpx;
|
||||
height: 72rpx;
|
||||
background: #FFD158;
|
||||
border-radius: 50rpx;
|
||||
font-size: 36rpx;
|
||||
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #ffffff;
|
||||
line-height: 72rpx;
|
||||
text-align: center;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,223 @@
|
|||
<template>
|
||||
<view class="content">
|
||||
<view v-if="isPwd == 0">
|
||||
<view class="contenttext flex-center">
|
||||
{{form.password.length == 6?'请再次确认支付密码':"请设置新密码，用于支付验证"}}
|
||||
</view>
|
||||
<view class="contentbox flex-between">
|
||||
<view class="contentboxitem flex-colum">
|
||||
{{consumeFee.slice(0,1)}}
|
||||
</view>
|
||||
<view class="contentboxitem flex-colum">
|
||||
{{consumeFee.slice(1,2)}}
|
||||
</view>
|
||||
<view class="contentboxitem flex-colum">
|
||||
{{consumeFee.slice(2,3)}}
|
||||
</view>
|
||||
<view class="contentboxitem flex-colum">
|
||||
{{consumeFee.slice(3,4)}}
|
||||
</view>
|
||||
<view class="contentboxitem flex-colum">
|
||||
{{consumeFee.slice(4,5)}}
|
||||
</view>
|
||||
<view class="contentboxitem flex-colum">
|
||||
{{consumeFee.slice(5,6)}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="" v-else>
|
||||
|
||||
</view>
|
||||
<cwx-keyboard ref="keyboard" v-if="isPwd == 0" @confirmEvent="confirmEvent"
|
||||
:money.sync="consumeFee"></cwx-keyboard>
|
||||
</view>
|
||||
</template>
|
||||
<script>
|
||||
import cwxKeyboard from '@/components/cwx-keyboard/cwx-keyboard';
|
||||
export default {
|
||||
components: {
|
||||
cwxKeyboard
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
isPwd: uni.cache.get('userInfo').isPwd,
|
||||
form: {
|
||||
mobile: uni.cache.get('userInfo').telephone,
|
||||
password: '', //密码
|
||||
payPassword: '', //二次密码
|
||||
checkCode: ''
|
||||
},
|
||||
passwords: false,
|
||||
payPasswords: false,
|
||||
// 注册定时器 初始值
|
||||
second: 60,
|
||||
showText: true,
|
||||
Recapture: '发送验证码',
|
||||
consumeFee: '', //第一遍
|
||||
consumeFees: '', //第二遍
|
||||
money: ''
|
||||
};
|
||||
},
|
||||
onLoad() {
|
||||
if (uni.cache.get('userInfo').isPwd != 0) {
|
||||
uni.setNavigationBarTitle({
|
||||
title: '忘记支付密码', // 标题文本，必须是字符串
|
||||
});
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
consumeFee(newVal, oldVal) {
|
||||
if (this.form.password.length == 6) {
|
||||
this.form.payPassword = newVal
|
||||
if (this.form.payPassword.length == 6) {
|
||||
this.userInfosavePayPassword()
|
||||
}
|
||||
} else {
|
||||
this.form.password = newVal
|
||||
if (this.form.password.length == 6) {
|
||||
this.$refs.keyboard._handleClearKey() //清空
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
confirmEvent(e) {
|
||||
console.log(e)
|
||||
},
|
||||
async CodeRegister() {
|
||||
const res = await this.api.phoneValidateCode({
|
||||
// post 手机验证码
|
||||
phone: this.form.mobile
|
||||
});
|
||||
if (res) {
|
||||
uni.showToast({
|
||||
title: '验证码获取成功',
|
||||
icon: 'none'
|
||||
});
|
||||
// 定时器
|
||||
this.showText = false;
|
||||
this.Recapture = '重新获取';
|
||||
var interval = setInterval(() => {
|
||||
let times = --this.second;
|
||||
this.second = times < 10 ? '0' + times : times; //小于10秒补 0
|
||||
}, 1000);
|
||||
setTimeout(() => {
|
||||
clearInterval(interval);
|
||||
this.second = 60;
|
||||
this.showText = true;
|
||||
}, 60000);
|
||||
}
|
||||
},
|
||||
async loginwxuserInfo() {
|
||||
let res = await this.api.loginwxuserInfo({
|
||||
userId: uni.getStorageSync('userInfo').id,
|
||||
})
|
||||
if (res.code == 0) {
|
||||
uni.cache.set('userInfo', res.data);
|
||||
}
|
||||
},
|
||||
async userInfosavePayPassword() {
|
||||
if (this.form.mobile.length != 11 && this.isPwd == 0) {
|
||||
uni.showToast({
|
||||
title: '手机号必须是11位',
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (this.form.password == null || this.form.password == '') {
|
||||
uni.showToast({
|
||||
title: '请输入密码',
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (this.form.payPassword == null || this.form.payPassword == '') {
|
||||
uni.showToast({
|
||||
title: '请输入确认密码',
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (this.form.password.length != 6 || this.form.payPassword.length != 6) {
|
||||
uni.showToast({
|
||||
title: '密码必须是6位',
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (this.form.payPassword != this.form.password) {
|
||||
this.$refs.keyboard._handleClearKey() //清空
|
||||
this.form.payPassword = ''
|
||||
this.form.password = ''
|
||||
uni.showToast({
|
||||
title: '密码和确认密码不一致',
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
if (this.form.checkCode == null || this.form.checkCode == '') {
|
||||
uni.showToast({
|
||||
title: '请输入验证码',
|
||||
icon: 'none'
|
||||
});
|
||||
return false;
|
||||
}
|
||||
let res = await this.api.loginresetPwd({
|
||||
pwd: this.form.password,
|
||||
code: this.form.checkCode
|
||||
})
|
||||
|
||||
if (res.code == 0) {
|
||||
if (uni.cache.get('userInfo').isPwd != 0) {
|
||||
uni.showToast({
|
||||
title: '修改成功',
|
||||
icon: 'none'
|
||||
});
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: '设置成功',
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
// 获取用户信息
|
||||
this.loginwxuserInfo()
|
||||
setTimeout(() => {
|
||||
uni.navigateBack();
|
||||
}, 1000);
|
||||
} else {
|
||||
this.$refs.keyboard._handleClearKey() //清空
|
||||
this.form.payPassword = ''
|
||||
this.form.password = ''
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.content {
|
||||
height: 100%;
|
||||
background: #FFFFFF;
|
||||
|
||||
.contenttext {
|
||||
padding: 48rpx 0;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
font-size: 40rpx;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.contentbox {
|
||||
margin-top: 48rpx;
|
||||
padding: 0 56rpx;
|
||||
|
||||
.contentboxitem {
|
||||
width: 88rpx;
|
||||
height: 88rpx;
|
||||
background: #FFFFFF;
|
||||
border-radius: 8rpx 8rpx 8rpx 8rpx;
|
||||
border: 2rpx solid #999999;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,692 @@
|
|||
<template>
|
||||
<view class="content" :style="[theme]">
|
||||
<view class="onecontent">
|
||||
<view class="onecontentone flex-start">
|
||||
<view class="onecontent_one">
|
||||
商品信息
|
||||
</view>
|
||||
</view>
|
||||
<view class="onecontenttow flex-start">
|
||||
<view class="onecontenttowitem flex-between" v-for="(item,index) in elist.goods" :key="index">
|
||||
<view class="onecontenttowitem_one flex-start">
|
||||
<image class="onecontenttowitemimage" :src="item.img" mode="aspectFill"></image>
|
||||
<view class="onecontenttowitem_onebox flex-colum-start">
|
||||
<view class="onecontenttowitem_onebox_one">
|
||||
{{item.title || '无'}}
|
||||
</view>
|
||||
<view class="onecontenttowitem_onebox_tow">
|
||||
{{item.spec || '无'}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="onecontenttowitem_tow flex-colum-end">
|
||||
<view class="onecontenttowitem_towstext_one">
|
||||
{{item.price || '无'}}
|
||||
</view>
|
||||
<view class="onecontenttowitem_towstetx_tow">
|
||||
×{{item.number || '无'}}
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="onecontent" style="margin-top: 32rpx;">
|
||||
<view class="onecontentone flex-between">
|
||||
<view class="onecontent_one">
|
||||
确认地址
|
||||
</view>
|
||||
<u-icon name="arrow-right" color="#000" size="14"></u-icon>
|
||||
</view>
|
||||
<view class="onecontentaddress flex-colum-start" v-if="elist.address" @click="clickaddress">
|
||||
<view class="onecontentaddressone" v-if="formlist.type == 3">
|
||||
{{elist.address.address}}
|
||||
</view>
|
||||
<view class="onecontentaddressone" v-else>
|
||||
{{elist.address.province}}-{{elist.address.city}}-{{elist.address.area}}-{{elist.address.address}}
|
||||
</view>
|
||||
<view class="onecontentaddresstow">
|
||||
{{elist.address.name}}<text style="margin-left: 10rpx;">{{elist.address.mobile}}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="onecontentaddress" v-else>
|
||||
<view class="onecontentaddressone" @click="clickaddress">
|
||||
去添加地址
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="therecontent">
|
||||
<!-- <view class="therecontenttow flex-between">
|
||||
<view class="therecontenttow_one">
|
||||
商品金额
|
||||
</view>
|
||||
<view class="therecontenttow_tow">
|
||||
{{elist.number}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="therecontenttow flex-between">
|
||||
<view class="therecontenttow_one">
|
||||
优惠券
|
||||
</view>
|
||||
<view class="therecontenttow_tow">
|
||||
暂无可用
|
||||
</view>
|
||||
</view> -->
|
||||
<view class="therecontenttow flex-between">
|
||||
<view class="therecontenttow_one">
|
||||
运费
|
||||
</view>
|
||||
<view class="therecontenttow_tow">
|
||||
￥{{elist.freight}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="therecontenttow flex-between">
|
||||
<view class="therecontenttow_one">
|
||||
合计
|
||||
</view>
|
||||
<view class="therecontenttow_tow" style="color:#FC5F69;">
|
||||
￥{{elist.price.total_price}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- <view class="fivecontent">
|
||||
<view class="fivecontentitem flex-between">
|
||||
<view class="fivecontentitem_one">
|
||||
手机号码
|
||||
</view>
|
||||
<view class="fivecontentitem_tow">
|
||||
{{mobile}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="fivecontentitem flex-between">
|
||||
<view class="fivecontentitem_one">
|
||||
姓名
|
||||
</view>
|
||||
<view class="fivecontentitem_tow">
|
||||
张雪
|
||||
</view>
|
||||
</view>
|
||||
</view> -->
|
||||
<view class="sixcontent">
|
||||
<view class="sixcontentone flex-between">
|
||||
<view class="sixcontent_one">
|
||||
支付方式
|
||||
</view>
|
||||
</view>
|
||||
<view class="sixcontenttow">
|
||||
<view class="sixcontenttowitem flex-between" @click="clickselect(1)">
|
||||
<view class="sixcontenttowitemone flex-start">
|
||||
<image src="https://ointmentweapp.oss-cn-beijing.aliyuncs.com/image/wx.png" mode="aspectFill"></image>
|
||||
<text class="sixcontenttowitemonetext">微信支付</text>
|
||||
</view>
|
||||
<view class="flex-start">
|
||||
<u-icon v-if="pay_type == 1" name="checkmark-circle-fill" color="#333333" size="18"></u-icon>
|
||||
<u-icon v-else name="checkmark-circle-fill" color="#999999" size="18"></u-icon>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
<view class="sixcontenttowitem flex-between" @click="clickselect(2)">
|
||||
<view class="sixcontenttowitemone flex-start">
|
||||
|
||||
<image src="https://ointmentweapp.oss-cn-beijing.aliyuncs.com/image/ye.png" mode="aspectFill"></image>
|
||||
<text class="sixcontenttowitemonetext">余额支付</text>
|
||||
</view>
|
||||
<view class="flex-start">
|
||||
<u-icon v-if="pay_type == 2" name="checkmark-circle-fill" color="#333333" size="18"></u-icon>
|
||||
<u-icon v-else name="checkmark-circle-fill" color="#999999" size="18"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- <view class="fourcontent">
|
||||
<view class="fourcontentone flex-start">
|
||||
<view class="fourcontent_one">
|
||||
须知：
|
||||
</view>
|
||||
</view>
|
||||
<view class="fourcontenttow flex-colum-start">
|
||||
|
||||
</view>
|
||||
</view> -->
|
||||
<view :style="{height:height}">
|
||||
|
||||
</view>
|
||||
<view class="fixedview flex-between">
|
||||
<view class="fixedview_one flex-start">
|
||||
<view class="fixedview_oneone">
|
||||
实付金额：
|
||||
</view>
|
||||
<view class="fixedview_onetow">
|
||||
<text>¥</text>{{elist.price.price}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="fixedview_tow" @tap="$u.debounce(showpopupclick,1000)">
|
||||
立即付款
|
||||
</view>
|
||||
</view>
|
||||
<u-popup :show="showpopup" @close="closepopup" @open="openpopup" mode="center" :round="10">
|
||||
<view class="u-popupflex-colum flex-colum">
|
||||
<view class="u-popupflex-columview">
|
||||
请输入支付密码
|
||||
</view>
|
||||
<u-code-input v-model="ucodeinputvalue" :maxlength="6" dot @finish="finish"></u-code-input>
|
||||
</view>
|
||||
</u-popup>
|
||||
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
showpopup: false,
|
||||
ucodeinputvalue: '',
|
||||
height: '',
|
||||
order_id: '',
|
||||
elist: {
|
||||
address: {
|
||||
|
||||
},
|
||||
price: {
|
||||
total_price: '',
|
||||
id: ''
|
||||
}
|
||||
},
|
||||
mobile: uni.cache.get('loginuser').userinfo.mobile,
|
||||
formlist: {
|
||||
goods_id: ''
|
||||
},
|
||||
pay_type: 1
|
||||
}
|
||||
},
|
||||
async onLoad(e) {
|
||||
// this.elist = JSON.parse(optionItem)
|
||||
this.formlist = e
|
||||
this.formlist.spec = decodeURIComponent(e.spec)
|
||||
let res = await this.api.shoppingindexgoodindexoforders({
|
||||
type: this.formlist.type, // 1购物车 2商品详情页
|
||||
goods_id: this.formlist.goods_id, //商品ID 商品详情页来源时必填
|
||||
car_id: this.formlist.car_id, //购物车ID 1,2 购物车来源时必填
|
||||
number: this.formlist.number, //数量 商品详情页来源时必填
|
||||
spec: this.formlist.spec, //规格 商品详情页来源时必填
|
||||
address_id: this.formlist.address_id, //地址ID 可以为空（为空时返回默认地址）
|
||||
order_id:this.formlist.order_id,
|
||||
})
|
||||
if (res) {
|
||||
this.elist = res
|
||||
this.elist.goods[0].spec = this.formlist.spec
|
||||
if (this.elist.address) {
|
||||
this.elist.address.mobile = res.address.mobile.replace(/(\d{3})\d{4}(\d{4})/, '$1****$2')
|
||||
}
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
theme() {
|
||||
return this.$store.getters.theme
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
clickaddress() {
|
||||
uni.pro.navigateTo("user/address/index", {
|
||||
order: 1
|
||||
});
|
||||
uni.$once('update', data => {
|
||||
this.elist.address = JSON.parse(data)
|
||||
if (this.elist.address) {
|
||||
this.elist.address.mobile = this.elist.address.mobile.replace(/(\d{3})\d{4}(\d{4})/, '$1****$2')
|
||||
}
|
||||
this.$forceUpdate();
|
||||
})
|
||||
},
|
||||
openpopup() {
|
||||
console.log('open');
|
||||
},
|
||||
closepopup() {
|
||||
this.showpopup = false
|
||||
},
|
||||
|
||||
finish(e) {
|
||||
this.reservationmakenowsub()
|
||||
},
|
||||
showpopupclick() {
|
||||
if(this.elist.address == null || this.elist.address == undefined){
|
||||
uni.showToast({
|
||||
icon: 'none',
|
||||
title: '收货地址不能为空'
|
||||
})
|
||||
return false
|
||||
}
|
||||
if (this.pay_type == 1) {
|
||||
uni.showLoading({
|
||||
title: '加载中',
|
||||
mask: true
|
||||
})
|
||||
this.reservationmakenowsub()
|
||||
return false;
|
||||
} else {
|
||||
if (this.pay_type == 2) {
|
||||
if (this.elist.is_vip_password == 0) {
|
||||
uni.showModal({
|
||||
title: '提示',
|
||||
content: '您目前没有设置密码，请先设置支付密码',
|
||||
success: function(res) {
|
||||
if (res.confirm) {
|
||||
uni.redirectTo({
|
||||
url: '/pages/my/setup/repairpassword'
|
||||
});
|
||||
} else if (res.cancel) {}
|
||||
}
|
||||
});
|
||||
} else {
|
||||
this.showpopup = true
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
async reservationmakenowsub() {
|
||||
var datareslane = await this.api.shoppingindexgoodindexsuborder({
|
||||
type: this.formlist.type,
|
||||
goods_id: this.formlist.goods_id, //商品ID 商品详情页来源时必填
|
||||
car_id: this.formlist.car_id, //购物车ID 1,2 购物车来源时必填
|
||||
number: this.formlist.number, //数量 商品详情页来源时必填
|
||||
spec: this.formlist.spec, //规格 商品详情页来源时必填
|
||||
address_id: this.formlist.address_id, //地址ID 可以为空（为空时返回默认地址）
|
||||
pay_type: this.pay_type ,//1微信 2余额卡
|
||||
order_id:this.formlist.order_id
|
||||
})
|
||||
console.log(datareslane, 280)
|
||||
if (datareslane.data) {
|
||||
let res = await this.api.shoppingindexgoodindexgetpayparams({
|
||||
order_id: datareslane.data.order_id,
|
||||
sec_password: this.ucodeinputvalue //安全密码 余额卡支付时有效
|
||||
}) //判断是否支付成功
|
||||
this.ucodeinputvalue = ''
|
||||
console.log(res, 287)
|
||||
if (res.data.pay_status == 0) {
|
||||
this.showpopup = false
|
||||
uni.showLoading({
|
||||
title: '加载中',
|
||||
mask: true
|
||||
})
|
||||
// #ifdef MP-WEIXIN
|
||||
uni.requestPayment({
|
||||
provider: 'wxpay', //支付类型-固定值
|
||||
partnerid: res.data.pay_data.payAppId, // 微信支付商户号
|
||||
timeStamp: res.data.pay_data.payTimeStamp, // 时间戳（单位：秒）
|
||||
nonceStr: res.data.pay_data.paynonceStr, // 随机字符串
|
||||
package: res.data.pay_data.payPackage, // 固定值
|
||||
signType: res.data.pay_data.paySignType, //固定值
|
||||
paySign: res.data.pay_data.paySign, //签名
|
||||
success: (res) => {
|
||||
uni.showToast({
|
||||
title: "支付成功"
|
||||
})
|
||||
uni.redirectTo({
|
||||
url: "/pages/mall/order/ordersuccess?id=" + datareslane.data.order_id,
|
||||
});
|
||||
},
|
||||
fail: (err) => {
|
||||
setTimeout(res => {
|
||||
uni.showToast({
|
||||
icon: 'none',
|
||||
title: '支付失败'
|
||||
})
|
||||
uni.hideLoading()
|
||||
}, 2000)
|
||||
uni.redirectTo({
|
||||
url: "/pages/mall/order/index?e=" +0,
|
||||
});
|
||||
}
|
||||
});
|
||||
// #endif
|
||||
} else {
|
||||
uni.redirectTo({
|
||||
url: "/pages/mall/order/ordersuccess?id=" + datareslane.data.order_id,
|
||||
});
|
||||
}
|
||||
} else {
|
||||
uni.showToast({
|
||||
title: res.message || res.msg,
|
||||
icon: "none",
|
||||
success() {
|
||||
setTimeout(res => {
|
||||
// if (options.toast) {
|
||||
uni.hideLoading()
|
||||
// }
|
||||
}, 2000)
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
},
|
||||
clickselect(b) {
|
||||
this.pay_type = b
|
||||
},
|
||||
},
|
||||
mounted() {
|
||||
//#ifdef MP-WEIXIN || H5
|
||||
var query = uni.createSelectorQuery().in(this).select('.fixedview')
|
||||
query.boundingClientRect(ele => {
|
||||
var that = this;
|
||||
uni.getSystemInfo({
|
||||
success(res) {
|
||||
that.height = (ele.height) + "px";
|
||||
that = null;
|
||||
}
|
||||
})
|
||||
}).exec();
|
||||
//#endif
|
||||
//#ifdef MP-ALIPAY
|
||||
my.createSelectorQuery().selectAll('.fixedview').boundingClientRect().exec(ele => {
|
||||
var nodeData = ele[0]
|
||||
var that = this;
|
||||
that.height = (nodeData.height) + "px";
|
||||
that = null;
|
||||
})
|
||||
//#endif
|
||||
},
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
page {
|
||||
background: #F6F6F6;
|
||||
}
|
||||
|
||||
.content {
|
||||
padding: 32rpx 28rpx;
|
||||
|
||||
.onecontent {
|
||||
width: 100%;
|
||||
background: #FFFFFF;
|
||||
padding: 32rpx;
|
||||
border-radius: 12rpx;
|
||||
|
||||
.onecontentone {
|
||||
padding-bottom: 28rpx;
|
||||
border-bottom: 1px solid #F7F7F7;
|
||||
|
||||
.onecontent_one {
|
||||
font-size: 28rpx;
|
||||
font-weight: bold;
|
||||
font-family: PingFang SC-Bold, PingFang SC;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.onecontent_tow {
|
||||
flex: 1;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
margin-left: 32rpx;
|
||||
font-size: 32rpx;
|
||||
font-family: PingFang SC-Bold, PingFang SC;
|
||||
font-weight: bold;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
|
||||
.onecontentaddress {
|
||||
.onecontentaddressone {
|
||||
margin-top: 24rpx;
|
||||
font-size: 28rpx;
|
||||
font-family: PingFang SC-Medium, PingFang SC;
|
||||
font-weight: 500;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.onecontentaddresstow {
|
||||
margin-top: 24rpx;
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #666666;
|
||||
}
|
||||
}
|
||||
|
||||
.onecontenttow {
|
||||
width: 100%;
|
||||
|
||||
.onecontenttowitem {
|
||||
margin-top: 24rpx;
|
||||
width: 100%;
|
||||
|
||||
.onecontenttowitem_one {
|
||||
.onecontenttowitemimage {
|
||||
width: 124rpx;
|
||||
height: 124rpx;
|
||||
}
|
||||
|
||||
.onecontenttowitem_onebox {
|
||||
margin-left: 24rpx;
|
||||
|
||||
.onecontenttowitem_onebox_one {
|
||||
font-size: 32rpx;
|
||||
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #1A1A1A;
|
||||
}
|
||||
|
||||
.onecontenttowitem_onebox_tow {
|
||||
margin-top: 32rpx;
|
||||
font-size: 24rpx;
|
||||
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #666666;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.onecontenttowitem_tow {
|
||||
.onecontenttowitem_towstext_one {
|
||||
font-size: 32rpx;
|
||||
font-family: Roboto-Medium, Roboto;
|
||||
font-weight: 500;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.onecontenttowitem_towstetx_tow {
|
||||
margin-top: 32rpx;
|
||||
font-size: 28rpx;
|
||||
font-family: DIN Alternate-Bold, DIN Alternate;
|
||||
font-weight: bold;
|
||||
color: #666666;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.fivecontent {
|
||||
width: 100%;
|
||||
background: #FFFFFF;
|
||||
padding: 32rpx;
|
||||
border-radius: 12rpx;
|
||||
margin-top: 32rpx;
|
||||
|
||||
.fivecontentitem:nth-child(2) {
|
||||
border: none !important;
|
||||
}
|
||||
|
||||
.fivecontentitem {
|
||||
padding: 18rpx 0;
|
||||
border-bottom: 1px solid #F7F7F7;
|
||||
|
||||
.fivecontentitem_one {
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.fivecontentitem_tow {
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.therecontent {
|
||||
width: 100%;
|
||||
background: #FFFFFF;
|
||||
padding: 32rpx;
|
||||
border-radius: 12rpx;
|
||||
margin-top: 32rpx;
|
||||
|
||||
.therecontenttow:nth-child(1) {
|
||||
margin-top: 0 !important;
|
||||
}
|
||||
|
||||
.therecontenttow {
|
||||
margin-top: 32rpx;
|
||||
|
||||
.therecontenttow_one {
|
||||
font-size: 28rpx;
|
||||
font-family: PingFang SC-Regular, PingFang SC;
|
||||
font-weight: 400;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.therecontenttow_tow {
|
||||
font-size: 28rpx;
|
||||
font-family: PingFang SC-Bold, PingFang SC;
|
||||
font-weight: 500;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.sixcontent {
|
||||
width: 100%;
|
||||
background: #FFFFFF;
|
||||
padding: 32rpx;
|
||||
margin-top: 32rpx;
|
||||
border-radius: 12rpx;
|
||||
|
||||
.sixcontentone {
|
||||
padding-bottom: 28rpx;
|
||||
border-bottom: 1px solid #F7F7F7;
|
||||
|
||||
.sixcontent_one {
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
|
||||
.sixcontenttow {
|
||||
.sixcontenttowitem {
|
||||
margin-top: 16rpx;
|
||||
|
||||
.sixcontenttowitemone {
|
||||
image {
|
||||
margin-left: 24rpx;
|
||||
width: 31.37rpx;
|
||||
height: 27.34rpx;
|
||||
}
|
||||
|
||||
.sixcontenttowitemonetext {
|
||||
margin-left: 14rpx;
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.fourcontent {
|
||||
|
||||
width: 100%;
|
||||
background: #FFFFFF;
|
||||
padding: 32rpx;
|
||||
margin-top: 32rpx;
|
||||
border-radius: 12rpx;
|
||||
|
||||
.fourcontentone {
|
||||
padding-bottom: 28rpx;
|
||||
border-bottom: 1px solid #F7F7F7;
|
||||
|
||||
.fourcontent_one {
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN-Bold, Source Han Sans CN;
|
||||
font-weight: bold;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.fourcontenttow {
|
||||
margin-top: 16rpx;
|
||||
width: 100%;
|
||||
|
||||
/deep/ img {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.u-popupflex-colum {
|
||||
padding: 80rpx 40rpx;
|
||||
border-radius: 50rpx;
|
||||
background: #FFFFFF;
|
||||
|
||||
.u-popupflex-columview {
|
||||
font-family: SourceHanSansCN-Bold-, SourceHanSansCN-Bold;
|
||||
font-weight: normal;
|
||||
color: #000;
|
||||
font-weight: bold;
|
||||
margin-bottom: 50rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.fixedview {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
padding: 24rpx 28rpx;
|
||||
background: #FFFFFF;
|
||||
|
||||
.fixedview_one {
|
||||
.fixedview_oneone {
|
||||
font-size: 28rpx;
|
||||
font-family: SourceHanSansCN-Bold-, SourceHanSansCN-Bold;
|
||||
font-weight: normal;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.fixedview_onetow {
|
||||
font-size: 44rpx;
|
||||
font-family: SourceHanSansCN-Bold-, SourceHanSansCN-Bold;
|
||||
font-weight: normal;
|
||||
color: #F45C4C;
|
||||
font-weight: bold;
|
||||
|
||||
text {
|
||||
font-size: 28rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.fixedview_tow {
|
||||
background: var(--bg-color-button);
|
||||
border-radius: 34rpx;
|
||||
padding: 10rpx 44rpx;
|
||||
font-size: 32rpx;
|
||||
font-family: PingFang SC-Bold, PingFang SC;
|
||||
font-weight: bold;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,341 @@
|
|||
<template>
|
||||
<view id="wrapper">
|
||||
<view class="nav-wrap" :class="{ 'is-fixed': isFixed }"
|
||||
:style="{ paddingTop: `${menuInfo.top}px`, paddingBottom: `${paddingBtmSize}px` }">
|
||||
<view class="content" :style="{ height: `${menuInfo.height}px`, paddingLeft: `${paddingBtmSize}px` }">
|
||||
<view class="left-btn">
|
||||
<view class="btn" :style="{ width: `${menuInfo.height}px`, height: `${menuInfo.height}px` }"
|
||||
@click="navClickHandle(1)">
|
||||
<u-icon name="arrow-left" :color="isFixed ? '#333' : '#fff'" size="38"></u-icon>
|
||||
</view>
|
||||
<view class="left-btntitle"
|
||||
:style="{ height: `${menuInfo.height}px`,lineHeight:`${menuInfo.height}px`}">
|
||||
积分商城
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
<view class="shop-cover">
|
||||
<image class="img" src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/shopindexnav.png" mode="widthFix">
|
||||
</image>
|
||||
<view class="shop-coverone" :style="{ paddingTop: `${menuInfo.top + menuInfo.height + 25}px`}">
|
||||
<view class="shop-coveronebox flex-center">
|
||||
<view style="margin-right: 10rpx;">
|
||||
当前积分
|
||||
</view>
|
||||
<u-icon name="error-circle" color="#fff" size="32"></u-icon>
|
||||
</view>
|
||||
<view class="shop-coveroneboxnuber">
|
||||
5830
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="shop_content">
|
||||
<view class="shop_contenttitle">积分明细</view>
|
||||
<!-- <view class="shop_contenbox flex-start">
|
||||
<view class="shop_contenboxitem" :class="index == 0?'shop_contenboxitems':''"
|
||||
v-for="(item,index) in shopcontenboxlsit" :key="index">
|
||||
{{item.name}}
|
||||
</view>
|
||||
</view> -->
|
||||
<view class="shop_contenlist">
|
||||
<view class="shop_contenlistabsolute">
|
||||
<view class="flex-start">
|
||||
<text class="flex-starttext">收入</text>
|
||||
/
|
||||
<text>支出</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="shop_contenlistitem flex-between" v-for="(item,index) in 6" :key="index">
|
||||
<view class="shop_contenlistitemone flex-colum-start">
|
||||
<view>交易积分-线下收款</view>
|
||||
<view>2023-01-11 17:33:09</view>
|
||||
</view>
|
||||
<view class="shop_contenlistitemtow">+0.02</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import _ from 'lodash';
|
||||
import navbar from '@/uni_modules/uview-ui/libs/config/props/navbar';
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
menuInfo: uni.getMenuButtonBoundingClientRect(),
|
||||
paddingBtmSize: 6,
|
||||
isFixed: false,
|
||||
active: 0,
|
||||
titleTopNums: [],
|
||||
shopcontenboxlsit: [{
|
||||
name: '全部'
|
||||
|
||||
},
|
||||
{
|
||||
name: '交易积分'
|
||||
|
||||
}, {
|
||||
name: '活动积分'
|
||||
|
||||
}, {
|
||||
name: '任务积分'
|
||||
|
||||
}
|
||||
]
|
||||
};
|
||||
},
|
||||
onPageScroll(e) {
|
||||
if (e.scrollTop >= (this.menuInfo.top + this.menuInfo.height + this.paddingBtmSize) / 2) {
|
||||
this.isFixed = true;
|
||||
uni.setNavigationBarColor({
|
||||
frontColor: '#000000',
|
||||
backgroundColor: '#ffffff'
|
||||
});
|
||||
} else {
|
||||
this.isFixed = false;
|
||||
uni.setNavigationBarColor({
|
||||
frontColor: '#ffffff',
|
||||
backgroundColor: '#000000'
|
||||
});
|
||||
}
|
||||
this.countScrollTitle(e.scrollTop);
|
||||
},
|
||||
onLoad(e) {
|
||||
// #ifdef APP-PLUS || H5
|
||||
uni.getSystemInfo({
|
||||
success: (res) => {
|
||||
console.log(res)
|
||||
this.menuInfo = res
|
||||
}
|
||||
})
|
||||
// #endif
|
||||
// #ifdef MP-WEIXIN
|
||||
this.menuInfo = uni.getMenuButtonBoundingClientRect()
|
||||
// #endif
|
||||
},
|
||||
onUnload() {
|
||||
|
||||
},
|
||||
methods: {
|
||||
// 导航栏点击
|
||||
navClickHandle(t) {
|
||||
switch (t) {
|
||||
case 1:
|
||||
// 返回
|
||||
uni.switchTab({
|
||||
url: '/pages/index/index'
|
||||
})
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
},
|
||||
countScrollTitle: _.throttle(function(top) {
|
||||
if (this.titleTopNums.length > 1) {
|
||||
for (let i = 0; i <= this.titleTopNums.length - 1; i++) {
|
||||
if (top >= this.titleTopNums[i] && top < this.titleTopNums[i + 1]) {
|
||||
this.titleTopNumIndex = i;
|
||||
}
|
||||
}
|
||||
if (top >= this.titleTopNums[this.titleTopNums.length - 1]) {
|
||||
this.titleTopNumIndex = this.titleTopNums.length - 1;
|
||||
}
|
||||
}
|
||||
}, 100),
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
$bg: #fafafa;
|
||||
$tabLeft: 200upx;
|
||||
$itemH: 100upx;
|
||||
$cartH: 90upx;
|
||||
|
||||
.nav-wrap {
|
||||
width: 100%;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 97;
|
||||
|
||||
&.is-fixed {
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.content {
|
||||
position: relative;
|
||||
|
||||
.left-btn {
|
||||
display: flex;
|
||||
|
||||
.btn {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-right: $paddingSize;
|
||||
}
|
||||
}
|
||||
|
||||
.left-btntitle {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
|
||||
text-align: center;
|
||||
font-family: SourceHanSansCN-Bold, SourceHanSansCN-Bold;
|
||||
font-weight: normal;
|
||||
font-size: 36rpx;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.shop-cover {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
// &::after {
|
||||
// content: '';
|
||||
// width: 100%;
|
||||
// height: 100%;
|
||||
// position: absolute;
|
||||
// top: 0;
|
||||
// left: 0;
|
||||
// z-index: 2;
|
||||
// background-color: rgba(0, 0, 0, 0.3);
|
||||
// }
|
||||
|
||||
.img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.shop-coverone {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
padding: 0rpx 32rpx;
|
||||
z-index: 2;
|
||||
|
||||
.shop-coveronebox {
|
||||
padding: 6rpx 10rpx;
|
||||
background: rgba(255, 255, 255, 0.2);
|
||||
border-radius: 58rpx 58rpx 58rpx 58rpx;
|
||||
font-family: PingFangSC-Semibold, PingFangSC-Semibold;
|
||||
font-weight: normal;
|
||||
font-size: 28rpx;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
|
||||
.shop-coveroneboxnuber {
|
||||
margin-top: 32rpx;
|
||||
font-family: Roboto, Roboto;
|
||||
font-weight: 400;
|
||||
font-size: 74rpx;
|
||||
color: #FFFFFF;
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.shop_content {
|
||||
background: #FFFFFF;
|
||||
border-radius: 26rpx 26rpx 0rpx 0rpx;
|
||||
position: relative;
|
||||
z-index: 5;
|
||||
top: -92rpx;
|
||||
|
||||
.shop_contenttitle {
|
||||
padding: 16rpx 0;
|
||||
width: 100%;
|
||||
text-align: center;
|
||||
font-family: SourceHanSansCN-Medium, SourceHanSansCN-Medium;
|
||||
font-weight: bold;
|
||||
font-size: 32rpx;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.shop_contenbox {
|
||||
padding: 0 60rpx;
|
||||
|
||||
.shop_contenboxitem:nth-child(1) {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.shop_contenboxitem {
|
||||
margin-left: 24rpx;
|
||||
padding: 6rpx 10rpx;
|
||||
background: #F9F9F9;
|
||||
border-radius: 8rpx 8rpx 8rpx 8rpx;
|
||||
font-family: SourceHanSansCN-Regular, SourceHanSansCN-Regular;
|
||||
font-weight: normal;
|
||||
font-size: 28rpx;
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
.shop_contenboxitems {
|
||||
background: #F1CB66;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
|
||||
.shop_contenlist {
|
||||
position: relative;
|
||||
margin-top: 32rpx;
|
||||
background: #fff;
|
||||
|
||||
.shop_contenlistabsolute {
|
||||
position: absolute;
|
||||
top: -32rpx;
|
||||
right: 32rpx;
|
||||
|
||||
.flex-start {
|
||||
font-family: SourceHanSansCN-Regular, SourceHanSansCN-Regular;
|
||||
font-weight: normal;
|
||||
font-size: 24rpx;
|
||||
color: #999999;
|
||||
|
||||
.flex-starttext {
|
||||
color: #FF981E;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.shop_contenlistitem {
|
||||
padding: 32rpx 44rpx;
|
||||
border-bottom: 2rpx solid #E5E5E5;
|
||||
|
||||
.shop_contenlistitemone {
|
||||
view:nth-child(1) {
|
||||
font-family: SourceHanSansCN-Regular, SourceHanSansCN-Regular;
|
||||
font-weight: normal;
|
||||
font-size: 28rpx;
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
view:nth-child(2) {
|
||||
margin-top: 16rpx;
|
||||
font-family: SourceHanSansCN-Regular, SourceHanSansCN-Regular;
|
||||
font-weight: normal;
|
||||
font-size: 28rpx;
|
||||
color: #999999;
|
||||
}
|
||||
}
|
||||
|
||||
.shop_contenlistitemtow {
|
||||
font-family: SourceHanSansCN-Medium, SourceHanSansCN-Medium;
|
||||
font-weight: normal;
|
||||
font-size: 32rpx;
|
||||
color: #FF981E;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,418 @@
|
|||
<template>
|
||||
<view id="wrapper">
|
||||
<view class="nav-wrap" :class="{ 'is-fixed': isFixed }"
|
||||
:style="{ paddingTop: `${menuInfo.top}px`, paddingBottom: `${paddingBtmSize}px` }">
|
||||
<view class="content" :style="{ height: `${menuInfo.height}px`, paddingLeft: `${paddingBtmSize}px` }">
|
||||
<view class="left-btn">
|
||||
<view class="btn" :style="{ width: `${menuInfo.height}px`, height: `${menuInfo.height}px` }"
|
||||
@click="navClickHandle(1)">
|
||||
<u-icon name="arrow-left" :color="isFixed ? '#333' : '#fff'" size="38"></u-icon>
|
||||
</view>
|
||||
<view class="left-btntitle"
|
||||
:style="{ height: `${menuInfo.height}px`,lineHeight:`${menuInfo.height}px`}">
|
||||
积分商城
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
<view class="shop-cover">
|
||||
<image class="img" src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/shopindexnav.png" mode="widthFix">
|
||||
</image>
|
||||
<view class="shop-coverone" :style="{ paddingTop: `${menuInfo.top + menuInfo.height + 25}px`}">
|
||||
<view class="shop-coveronebox flex-start">
|
||||
<image src="@/static/shop/weitu.png" mode="aspectFill"></image>
|
||||
<view style="margin-left: 10rpx;">
|
||||
当前积分
|
||||
</view>
|
||||
</view>
|
||||
<view class="shop-coveroneboxnuber">
|
||||
5830
|
||||
</view>
|
||||
<navigator url="/pages/user/shop/detail" hover-class="navigator-hover"
|
||||
class="shop-coveroneboxdetail flex-start">
|
||||
<view style="margin-right: 20rpx;">
|
||||
积分明细
|
||||
</view>
|
||||
<u-icon name="arrow-right" color="#666666" size="28"></u-icon>
|
||||
</navigator>
|
||||
<view class="shop-coveroneinput flex-start">
|
||||
<u-search shape="round" searchIconSize='32rpx' height='100%' bgColor='#fff' placeholder="请输入商品"
|
||||
:animation="true" :clearabled="true" v-model="keyword"></u-search>
|
||||
<view class="shop-coveroneinputsouso">
|
||||
搜索
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="shop_content">
|
||||
<view class="shop_contenttitle">
|
||||
<view class="shop_contenttitleitem" :class="index == 1?'shop_contenttitleitems':''"
|
||||
v-for="(item,index) in shopcontenboxlsit" :key="index">
|
||||
{{item.name}}
|
||||
</view>
|
||||
</view>
|
||||
<view class="shop_contentlist flex-between">
|
||||
<view class="shop_contentlistitem flex-colum-start" @click="clickshopinfo(item)"
|
||||
v-for="(item,index) in 4" :key="index">
|
||||
<image class="shop_contentlistitemimage" src="@/static/avatar.png" mode="aspectFill"></image>
|
||||
<view class="shop_contentlistitemone">
|
||||
澳洲高级洗发水
|
||||
</view>
|
||||
<view class="shop_contentlistitemtow flex-start">
|
||||
<image src="@/static/shop/weitu.png" mode="aspectFill"></image>
|
||||
<view>
|
||||
30积分
|
||||
</view>
|
||||
</view>
|
||||
<view class="shop_contentlistitemthere flex-between">
|
||||
<view>
|
||||
市场价¥100.00
|
||||
</view>
|
||||
<view>
|
||||
已兑换0390件
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import _ from 'lodash';
|
||||
import navbar from '@/uni_modules/uview-ui/libs/config/props/navbar';
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
keyword: '',
|
||||
menuInfo: {},
|
||||
paddingBtmSize: 6,
|
||||
isFixed: false,
|
||||
active: 0,
|
||||
titleTopNums: [],
|
||||
shopcontenboxlsit: [{
|
||||
name: '全部'
|
||||
},
|
||||
{
|
||||
name: '交易积分'
|
||||
}, {
|
||||
name: '活动积分'
|
||||
|
||||
}, {
|
||||
name: '任务积分'
|
||||
|
||||
}, {
|
||||
name: '任务积分'
|
||||
|
||||
}, {
|
||||
name: '任务积分'
|
||||
|
||||
}, {
|
||||
name: '任务积分'
|
||||
|
||||
}, {
|
||||
name: '任务积分'
|
||||
|
||||
}
|
||||
]
|
||||
};
|
||||
},
|
||||
onPageScroll(e) {
|
||||
if (e.scrollTop >= (this.menuInfo.top + this.menuInfo.height + this.paddingBtmSize) / 2) {
|
||||
this.isFixed = true;
|
||||
uni.setNavigationBarColor({
|
||||
frontColor: '#000000',
|
||||
backgroundColor: '#ffffff'
|
||||
});
|
||||
} else {
|
||||
this.isFixed = false;
|
||||
uni.setNavigationBarColor({
|
||||
frontColor: '#ffffff',
|
||||
backgroundColor: '#000000'
|
||||
});
|
||||
}
|
||||
this.countScrollTitle(e.scrollTop);
|
||||
},
|
||||
onLoad() {
|
||||
// #ifdef APP-PLUS || H5
|
||||
uni.getSystemInfo({
|
||||
success: (e) => {
|
||||
console.log(e)
|
||||
this.menuInfo = e
|
||||
}
|
||||
})
|
||||
// #endif
|
||||
// #ifdef MP-WEIXIN
|
||||
this.menuInfo = uni.getMenuButtonBoundingClientRect()
|
||||
// #endif
|
||||
},
|
||||
onUnload() {
|
||||
|
||||
},
|
||||
methods: {
|
||||
clickshopinfo(item) {
|
||||
uni.pro.navigateTo('user/shop/shopinfo', {
|
||||
item: item
|
||||
})
|
||||
},
|
||||
// 导航栏点击
|
||||
navClickHandle(t) {
|
||||
switch (t) {
|
||||
case 1:
|
||||
// 返回
|
||||
uni.switchTab({
|
||||
url: '/pages/index/index'
|
||||
})
|
||||
break;
|
||||
default:
|
||||
break;
|
||||
}
|
||||
},
|
||||
countScrollTitle: _.throttle(function(top) {
|
||||
if (this.titleTopNums.length > 1) {
|
||||
for (let i = 0; i <= this.titleTopNums.length - 1; i++) {
|
||||
if (top >= this.titleTopNums[i] && top < this.titleTopNums[i + 1]) {
|
||||
this.titleTopNumIndex = i;
|
||||
}
|
||||
}
|
||||
if (top >= this.titleTopNums[this.titleTopNums.length - 1]) {
|
||||
this.titleTopNumIndex = this.titleTopNums.length - 1;
|
||||
}
|
||||
}
|
||||
}, 100),
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
$bg: #fafafa;
|
||||
$tabLeft: 200upx;
|
||||
$itemH: 100upx;
|
||||
$cartH: 90upx;
|
||||
|
||||
page {
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.nav-wrap {
|
||||
width: 100%;
|
||||
position: fixed;
|
||||
top: 0;
|
||||
left: 0;
|
||||
z-index: 97;
|
||||
|
||||
&.is-fixed {
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.content {
|
||||
position: relative;
|
||||
|
||||
.left-btn {
|
||||
display: flex;
|
||||
|
||||
.btn {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
margin-right: $paddingSize;
|
||||
}
|
||||
}
|
||||
|
||||
.left-btntitle {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
|
||||
text-align: center;
|
||||
font-family: SourceHanSansCN-Bold, SourceHanSansCN-Bold;
|
||||
font-weight: normal;
|
||||
font-size: 36rpx;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.shop-cover {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
// &::after {
|
||||
// content: '';
|
||||
// width: 100%;
|
||||
// height: 100%;
|
||||
// position: absolute;
|
||||
// top: 0;
|
||||
// left: 0;
|
||||
// z-index: 2;
|
||||
// background-color: rgba(0, 0, 0, 0.3);
|
||||
// }
|
||||
|
||||
.img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
}
|
||||
|
||||
.shop-coverone {
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
top: 0;
|
||||
left: 0;
|
||||
padding: 0rpx 32rpx;
|
||||
z-index: 2;
|
||||
|
||||
.shop-coveronebox {
|
||||
font-family: PingFangSC-Semibold, PingFangSC-Semibold;
|
||||
font-weight: normal;
|
||||
font-size: 28rpx;
|
||||
color: #333333;
|
||||
|
||||
image {
|
||||
width: 28rpx;
|
||||
height: 28rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.shop-coveroneboxnuber {
|
||||
margin-top: 8rpx;
|
||||
font-family: Roboto, Roboto;
|
||||
font-weight: bold;
|
||||
font-size: 74rpx;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.shop-coveroneboxdetail {
|
||||
font-family: SourceHanSansCN-Regular, SourceHanSansCN-Regular;
|
||||
font-weight: normal;
|
||||
font-size: 28rpx;
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
.shop-coveroneinput {
|
||||
margin-top: 32rpx;
|
||||
background: #FFFFFF;
|
||||
border-radius: 38rpx 38rpx 38rpx 38rpx;
|
||||
height: 64rpx;
|
||||
line-height: 64rpx;
|
||||
|
||||
.shop-coveroneinputsouso {
|
||||
border-left: 2rpx solid #E8E8E8;
|
||||
height: 100%;
|
||||
padding: 4rpx 28rpx;
|
||||
font-family: SourceHanSansCN-Regular, SourceHanSansCN-Regular;
|
||||
font-weight: normal;
|
||||
font-size: 28rpx;
|
||||
line-height: 60 rpx;
|
||||
color: #666666;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.shop_content {
|
||||
position: relative;
|
||||
top: 0rpx;
|
||||
margin-top: -24rpx;
|
||||
z-index: 3;
|
||||
width: 100%;
|
||||
background: #FFFFFF;
|
||||
border-radius: 32rpx 32rpx 0rpx 0rpx;
|
||||
padding: 0 28rpx 28rpx 28rpx;
|
||||
|
||||
.shop_contenttitle {
|
||||
width: 100%;
|
||||
padding-top: 32rpx;
|
||||
display: flex;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
overflow-x: scroll;
|
||||
white-space: nowrap;
|
||||
|
||||
.shop_contenttitleitem:nth-child(1) {
|
||||
margin-left: 0;
|
||||
}
|
||||
|
||||
.shop_contenttitleitem {
|
||||
margin-left: 18rpx;
|
||||
font-family: SourceHanSansCN-Regular, SourceHanSansCN-Regular;
|
||||
font-weight: normal;
|
||||
font-size: 32rpx;
|
||||
color: #666666;
|
||||
}
|
||||
|
||||
.shop_contenttitleitems {
|
||||
color: #FF981E;
|
||||
}
|
||||
}
|
||||
|
||||
.shop_contentlist {
|
||||
.shop_contentlistitem {
|
||||
margin-top: 32rpx;
|
||||
width: 48%;
|
||||
background: #FFFFFF;
|
||||
box-shadow: 0rpx 2rpx 4rpx 2rpx rgba(0, 0, 0, 0.16);
|
||||
border-radius: 18rpx 18rpx 18rpx 18rpx;
|
||||
|
||||
.shop_contentlistitemimage {
|
||||
width: 100%;
|
||||
height: 296rpx;
|
||||
border-radius: 18rpx 18rpx 0 0;
|
||||
}
|
||||
|
||||
.shop_contentlistitemone {
|
||||
padding: 16rpx 16rpx 0 16rpx;
|
||||
width: 100%;
|
||||
text-overflow: ellipsis;
|
||||
overflow: hidden;
|
||||
white-space: nowrap;
|
||||
font-weight: normal;
|
||||
font-size: 28rpx;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.shop_contentlistitemtow {
|
||||
padding: 16rpx 16rpx 0 16rpx;
|
||||
|
||||
image {
|
||||
width: 28rpx;
|
||||
height: 28rpx;
|
||||
}
|
||||
|
||||
view {
|
||||
margin-left: 6rpx;
|
||||
font-family: SourceHanSansCN-Medium, SourceHanSansCN-Medium;
|
||||
font-weight: normal;
|
||||
font-size: 24rpx;
|
||||
color: #FF981E;
|
||||
}
|
||||
}
|
||||
|
||||
.shop_contentlistitemthere {
|
||||
padding: 16rpx;
|
||||
width: 100%;
|
||||
|
||||
view:nth-child(1) {
|
||||
font-family: SourceHanSansCN-Regular, SourceHanSansCN-Regular;
|
||||
font-weight: normal;
|
||||
font-size: 20rpx;
|
||||
color: #999999;
|
||||
text-align: center;
|
||||
font-style: normal;
|
||||
text-decoration-line: line-through;
|
||||
text-transform: none;
|
||||
}
|
||||
|
||||
view:nth-child(2) {
|
||||
font-family: SourceHanSansCN-Regular, SourceHanSansCN-Regular;
|
||||
font-weight: normal;
|
||||
font-size: 20rpx;
|
||||
color: #999999;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,560 @@
|
|||
<template>
|
||||
<view class="content">
|
||||
<image class="contentimage" src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/drder/ewm.png" mode="aspectFill"></image>
|
||||
<view class="contentbox">
|
||||
<view class="contentbox_one">
|
||||
111
|
||||
</view>
|
||||
<view class="contentbox_tow flex-start">
|
||||
<image src="@/static/shop/weitu.png" mode="aspectFill"></image>
|
||||
<view style="margin-left: 10rpx;">
|
||||
当前积分
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="contentboxtow">
|
||||
<view class="onecontentterewone flex-start">
|
||||
<view class="onecontenttereone_one">
|
||||
商品详情
|
||||
</view>
|
||||
</view>
|
||||
<!-- <view class="introduction_yow" v-html="list.details">
|
||||
|
||||
</view> -->
|
||||
</view>
|
||||
<view :style="{height:height}">
|
||||
|
||||
</view>
|
||||
<view class="fixedview flex-between">
|
||||
<view class="fixedview_letr flex-start">
|
||||
<view class="fixedview_letr_item flex-colum" @click="eeInfoindex">
|
||||
<image src="@/static/shop/s.png" mode="aspectFill"></image>
|
||||
<text>首页</text>
|
||||
</view>
|
||||
<view class="fixedview_letr_item flex-colum" @click="makePhoneCall">
|
||||
<image src="@/static/shop/k.png" mode="aspectFill"></image>
|
||||
<text>客服</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="fixedview_tow flex-between">
|
||||
<view class="fixedview_towtow" @click="overlayshowsboxs(2)">
|
||||
立即购买
|
||||
</view>
|
||||
<!-- <view class="fixedview_towtow" style="background: #ccc;">
|
||||
立即购买
|
||||
</view> -->
|
||||
</view>
|
||||
</view>
|
||||
<u-overlay :show="overlayshow">
|
||||
<view class="warp">
|
||||
<view class="rect" @tap.stop>
|
||||
<view class="onerect flex-start">
|
||||
<image class="onecontentone_image" src="@/static/shop/k.png" mode="aspectFill"></image>
|
||||
<view class="nonecontentone_view flex-colum-start">
|
||||
<text class="nonecontentone_view_one">贝尔纳干红葡萄酒</text>
|
||||
<view class="nonecontentone_view_otow flex-start">
|
||||
<image src="@/static/shop/weitu.png" mode="aspectFill"></image>
|
||||
<view style="margin-left: 10rpx;">
|
||||
当前积分
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="onerecticon" @click="overlayshow = false">
|
||||
<u-icon @click="overlayshow = false" name="close-circle-fill" color="#000000"
|
||||
size="32"></u-icon>
|
||||
|
||||
</view>
|
||||
</view>
|
||||
<view class="towrect" v-for="(item,n) in list.spec" :key="item.id">
|
||||
<view class="towrect_one">
|
||||
{{item.spec_name}}
|
||||
</view>
|
||||
<view class="flex-start">
|
||||
<view class="towrect_tow" v-for="(item1,index1) in item.spec_options" :key="index1"
|
||||
@click="overlayshowsbox(item1,index1)">
|
||||
<view
|
||||
:class="[item1.isShow?'noneActive':'',towrecttowclass == index1?'towrect_towtext':'towrect_towtexts']">
|
||||
{{item1.name}}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="thererect flex-between">
|
||||
<view class="thererect_one">
|
||||
购买数量
|
||||
</view>
|
||||
<view class="thererect_tow">
|
||||
<u-number-box v-model="numberbox" :min="1" button-size="24" color="#ffffff"
|
||||
:bgColor="theme.cartpieces" iconStyle="color: #fff" integer></u-number-box>
|
||||
</view>
|
||||
</view>
|
||||
<view class="fuorrect flex-between">
|
||||
<view class="fuorrect_one">
|
||||
合计
|
||||
</view>
|
||||
<view class="fuorrect_tow">
|
||||
¥100
|
||||
</view>
|
||||
</view>
|
||||
<view class="fvirect flex-center" @click="requestSubscribeMessage">
|
||||
确定
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</u-overlay>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
|
||||
data() {
|
||||
return {
|
||||
goods_id: '',
|
||||
overlayshow: false,
|
||||
towrecttowclass: 0,
|
||||
numberbox: 1,
|
||||
list: {},
|
||||
height: '',
|
||||
lsitform: {},
|
||||
selectArr: [], //存放被选中的值
|
||||
shopItemInfo: {}, //存放要和选中的值进行匹配的数据
|
||||
subIndex: [], //是否选中 因为不确定是多规格还是单规格，所以这里定义数组来判断
|
||||
}
|
||||
},
|
||||
computed: {},
|
||||
onLoad(e) {
|
||||
this.goods_id = e.id
|
||||
},
|
||||
onShow() {},
|
||||
mounted() {
|
||||
//#ifdef MP-WEIXIN || H5
|
||||
var query = uni.createSelectorQuery().in(this).select('.fixedview')
|
||||
query.boundingClientRect(ele => {
|
||||
var that = this;
|
||||
uni.getSystemInfo({
|
||||
success(res) {
|
||||
that.height = (ele.height) + "px";
|
||||
that = null;
|
||||
}
|
||||
})
|
||||
}).exec();
|
||||
//#endif
|
||||
//#ifdef MP-ALIPAY
|
||||
my.createSelectorQuery().selectAll('.fixedview').boundingClientRect().exec(ele => {
|
||||
var nodeData = ele[0]
|
||||
var that = this;
|
||||
that.height = (nodeData.height) + "px";
|
||||
that = null;
|
||||
})
|
||||
//#endif
|
||||
},
|
||||
methods: {
|
||||
makePhoneCall() {
|
||||
uni.makePhoneCall({
|
||||
phoneNumber: this.list.mobile //打电话
|
||||
});
|
||||
},
|
||||
overlayshowsboxs(e) {
|
||||
this.cartshping = e
|
||||
this.overlayshow = true
|
||||
|
||||
},
|
||||
async overlayshowsbox(item1, index1) {
|
||||
this.towrecttowclass = index1
|
||||
this.lsitform = item1
|
||||
this.lsitform.title_name = item1.title_name
|
||||
// this.lsitform.name = item1.name
|
||||
console.log(this.lsitform)
|
||||
},
|
||||
async requestSubscribeMessage() {
|
||||
// if (this.lsitform.id == '' || this.lsitform.id == null) {
|
||||
// uni.showToast({
|
||||
// title: '请选择合法规格',
|
||||
// icon: 'none'
|
||||
// });
|
||||
// return false;
|
||||
// }
|
||||
// if (this.cartshping == 1) {
|
||||
// this.$u.debounce(this.shoppingindexgoodindexsaddcar(), 200);
|
||||
// } else {
|
||||
uni.pro.navigateTo('user/shop/confirm', {
|
||||
type: 2, // 1购物车 2商品详情页
|
||||
goods_id: this.goods_id, //商品ID 商品详情页来源时必填
|
||||
car_id: '', //购物车ID 1,2 购物车来源时必填
|
||||
number: this.numberbox, //商品详情页来源时必填
|
||||
spec: this.lsitform.name, //规格 商品详情页来源时必填
|
||||
address_id: '', //地址ID 可以为空（为空时返回默认地址）
|
||||
})
|
||||
// }
|
||||
},
|
||||
async shoppingindexgoodindexsaddcar() {
|
||||
let res = await this.api.shoppingindexgoodindexsaddcar({
|
||||
number: this.numberbox,
|
||||
goods_id: this.goods_id,
|
||||
spec: this.lsitform.name,
|
||||
})
|
||||
if (res == 1) {
|
||||
this.overlayshow = false
|
||||
console.log(res)
|
||||
uni.showToast({
|
||||
title: '添加购物车成功',
|
||||
icon: 'none'
|
||||
});
|
||||
}
|
||||
|
||||
},
|
||||
eeInfoindex() { //去首页
|
||||
uni.pro.navigateTo('user/shop/index')
|
||||
},
|
||||
async shoppingindexgoodsgoodsdetail() {
|
||||
let res = await this.api.shoppingindexgoodsgoodsdetail({
|
||||
goods_id: this.goods_id
|
||||
})
|
||||
this.list = res
|
||||
this.lsitform = res.spec[0]
|
||||
this.lsitform.title_name = res.spec[0].title
|
||||
this.lsitform.img = res.host_img
|
||||
this.list.details = res.details.replace(/style\s*?=\s*?([‘"])[\s\S]*?\1/ig,
|
||||
'style="max-width:100%;height:auto;"') // 替换style
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
page {
|
||||
background: #F6F6F6;
|
||||
}
|
||||
|
||||
|
||||
.fixedview {
|
||||
position: fixed;
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
padding: 24rpx 28rpx;
|
||||
background: #FFFFFF;
|
||||
|
||||
.fixedview_letr {
|
||||
.fixedview_letr_item:nth-child(1) {
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
.fixedview_letr_item {
|
||||
margin-left: 32rpx;
|
||||
|
||||
image {
|
||||
width: 40rpx;
|
||||
height: 40rpx;
|
||||
}
|
||||
|
||||
text {
|
||||
margin-top: 8rpx;
|
||||
font-size: 20rpx;
|
||||
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.fixedview_one {
|
||||
.fixedview_oneone {
|
||||
font-size: 28rpx;
|
||||
font-family: SourceHanSansCN-Bold-, SourceHanSansCN-Bold;
|
||||
font-weight: normal;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.fixedview_onetow {
|
||||
font-size: 44rpx;
|
||||
font-family: SourceHanSansCN-Bold-, SourceHanSansCN-Bold;
|
||||
font-weight: normal;
|
||||
color: #F45C4C;
|
||||
font-weight: bold;
|
||||
|
||||
text {
|
||||
font-size: 28rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.fixedview_tow {
|
||||
flex: auto;
|
||||
padding-left: 24rpx;
|
||||
|
||||
.fixedview_towone {
|
||||
// width: 50%;
|
||||
// font-size: 28rpx;
|
||||
// font-family: Source Han Sans CN-Bold, Source Han Sans CN;
|
||||
// font-weight: bold;
|
||||
// color: var(--cart-text-color);
|
||||
// height: 72rpx;
|
||||
// line-height: 72rpx;
|
||||
// text-align: center;
|
||||
// border-radius: 50rpx 0 0 50rpx;
|
||||
// background: var(--cart-background-color);
|
||||
}
|
||||
|
||||
.fixedview_towtow {
|
||||
width: 100%;
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN-Bold, Source Han Sans CN;
|
||||
font-weight: bold;
|
||||
color: #333333;
|
||||
height: 72rpx;
|
||||
line-height: 72rpx;
|
||||
text-align: center;
|
||||
border-radius: 50rpx;
|
||||
background: #F1CB66;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.warp {
|
||||
position: relative;
|
||||
height: 100%;
|
||||
|
||||
.rect {
|
||||
position: absolute;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
background: #FFFFFF;
|
||||
border-radius: 60rpx 60rpx 0px 0px;
|
||||
padding: 48rpx 32rpx 32rpx 32rpx;
|
||||
|
||||
.onerect {
|
||||
position: relative;
|
||||
padding-bottom: 34rpx;
|
||||
border-bottom: 1rpx solid #F7F7F7;
|
||||
|
||||
image {
|
||||
width: 124rpx;
|
||||
height: 124rpx;
|
||||
}
|
||||
|
||||
.nonecontentone_view {
|
||||
|
||||
margin-left: 16rpx;
|
||||
|
||||
.nonecontentone_view_one {
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
white-space: nowrap;
|
||||
font-size: 32rpx;
|
||||
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #1A1A1A;
|
||||
}
|
||||
|
||||
.nonecontentone_view_otow {
|
||||
margin-top: 10rpx;
|
||||
font-family: SourceHanSansCN-Medium, SourceHanSansCN-Medium;
|
||||
font-weight: normal;
|
||||
font-size: 28rpx;
|
||||
color: #FF981E;
|
||||
|
||||
image {
|
||||
width: 28rpx;
|
||||
height: 28rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.onerecticon {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.towrect {
|
||||
padding-bottom: 34rpx;
|
||||
border-bottom: 1rpx solid #F7F7F7;
|
||||
padding-top: 34rpx;
|
||||
|
||||
.towrect_one {
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #1A1A1A;
|
||||
}
|
||||
|
||||
.towrect_tow {
|
||||
margin-top: 16rpx;
|
||||
margin-left: 10rpx;
|
||||
|
||||
.noneActive {
|
||||
background-color: #ccc;
|
||||
opacity: 0.4;
|
||||
color: #000;
|
||||
pointer-events: none;
|
||||
}
|
||||
|
||||
.towrect_towtext {
|
||||
width: 100%;
|
||||
background: #FFFFFF;
|
||||
border-radius: 8rpx;
|
||||
border: 1rpx solid #4F5066;
|
||||
padding: 8rpx 26rpx;
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #4F5066;
|
||||
}
|
||||
|
||||
|
||||
.towrect_towtexts {
|
||||
width: 100%;
|
||||
background: #F7F7F7;
|
||||
border-radius: 8rpx;
|
||||
padding: 8rpx 26rpx;
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #4F5066;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
.thererect {
|
||||
padding: 34rpx 0;
|
||||
border-bottom: 1rpx solid #F7F7F7;
|
||||
border-top: 1rpx solid #F7F7F7;
|
||||
|
||||
.thererect_one {
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #1A1A1A;
|
||||
}
|
||||
|
||||
.thererect_tow {}
|
||||
}
|
||||
|
||||
.fuorrect {
|
||||
margin-top: 32rpx;
|
||||
|
||||
.fuorrect_one {
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #1A1A1A;
|
||||
}
|
||||
|
||||
.fuorrect_tow {
|
||||
font-weight: bold;
|
||||
font-size: 32rpx;
|
||||
font-family: SourceHanSansCN-Bold-, SourceHanSansCN-Bold;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
|
||||
.fvirect {
|
||||
margin-top: 200rpx;
|
||||
padding: 16rpx;
|
||||
text-align: center;
|
||||
background: #F1CB66;
|
||||
border-radius: 40rpx;
|
||||
font-size: 36rpx;
|
||||
font-family: PingFang SC-Bold, PingFang SC;
|
||||
font-weight: bold;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.content {
|
||||
.contentimage {
|
||||
width: 100%;
|
||||
height: 528rpx;
|
||||
}
|
||||
|
||||
.contentbox {
|
||||
padding: 28rpx 32rpx;
|
||||
width: 100%;
|
||||
background: #FFFFFF;
|
||||
|
||||
.contentbox_one {
|
||||
font-size: 32rpx;
|
||||
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
|
||||
font-weight: 500;
|
||||
color: #1A1A1A;
|
||||
}
|
||||
|
||||
.contentbox_tow {
|
||||
margin-top: 12rpx;
|
||||
font-family: SourceHanSansCN-Medium, SourceHanSansCN-Medium;
|
||||
font-weight: normal;
|
||||
font-size: 28rpx;
|
||||
color: #FF981E;
|
||||
|
||||
image {
|
||||
width: 28rpx;
|
||||
height: 28rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.contentboxtow {
|
||||
margin-top: 14rpx;
|
||||
width: 100%;
|
||||
padding: 28rpx 32rpx;
|
||||
background: #FFFFFF;
|
||||
|
||||
.onecontentterewone::before {
|
||||
content: '';
|
||||
display: inline-block;
|
||||
width: 4rpx;
|
||||
height: 24rpx;
|
||||
background: #febc46;
|
||||
border-radius: 4rpx;
|
||||
}
|
||||
|
||||
.onecontentterewone {
|
||||
.onecontenttereone_one {
|
||||
margin-left: 16rpx;
|
||||
font-size: 32rpx;
|
||||
font-family: Source Han Sans CN-Bold, Source Han Sans CN;
|
||||
font-weight: bold;
|
||||
color: #1A1A1A;
|
||||
|
||||
text {
|
||||
color: #999999;
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.introduction_yow {
|
||||
margin-top: 18rpx;
|
||||
font-size: 28rpx;
|
||||
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
|
||||
font-weight: 400;
|
||||
color: #1A1A1A;
|
||||
width: 100%;
|
||||
|
||||
/deep/ [alt] {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/deep/ img {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
img {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
/deep/ p {
|
||||
width: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
|
@ -0,0 +1,276 @@
|
|||
<template>
|
||||
<view class="container">
|
||||
<image class="topBack"
|
||||
:src="shopExtend?shopExtend.value:'https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/myTopBack.png'"
|
||||
mode="aspectFill"></image>
|
||||
<view class="myContent">
|
||||
<view class="my_info flex-between">
|
||||
<view class="my_info_left">
|
||||
<image class="my_info_left_head" :src="userInfo.headImg" mode="aspectFill"></image>
|
||||
<view class="name">{{userInfo.nickName || '无'}}</view>
|
||||
</view>
|
||||
<image class="my_info_right_qr" @click="clickEvent" v-if="shopInfo.isVip!=0"
|
||||
:src="'https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/my_qRcode.png'" mode="aspectFill">
|
||||
</image>
|
||||
<view class="my_info_right" @click="clickEvent" v-else>
|
||||
<text>免费入会</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
|
||||
<view class="my_item my_assets">
|
||||
<view class="my_item_title">我的资产</view>
|
||||
<view class="my_assets_list">
|
||||
<view class="my_list_item" @click="clickTo(item,index)" v-for="(item,index) in myAssetsList"
|
||||
:key="index">
|
||||
<image class="my_list_item_icon" :src="item.icon" mode="aspectFill"></image>
|
||||
<view class="my_list_item_name">{{item.name}}</view>
|
||||
<view class="my_list_item_num">{{item.num || '**'}}</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="my_item my_fun">
|
||||
<view class="my_item_title">我的功能</view>
|
||||
<view class="my_fun_list">
|
||||
<view class="my_list_item" @click="clickTo(item,index)" v-for="(item,index) in myFunList"
|
||||
:key="index">
|
||||
<view class="my_list_item_left">
|
||||
<image class="my_list_item_icon" :src="item.icon" mode="aspectFill"></image>
|
||||
<view class="my_list_item_name">{{item.name}}</view>
|
||||
</view>
|
||||
<view class="my_list_item_right">
|
||||
<u-icon name="play-right-fill" color="#999999" size="12"></u-icon>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
</view>
|
||||
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {
|
||||
ref,
|
||||
computed,
|
||||
onMounted,
|
||||
reactive
|
||||
} from "vue";
|
||||
import {
|
||||
onLoad,
|
||||
onReady,
|
||||
onShow
|
||||
} from '@dcloudio/uni-app'
|
||||
const myAssetsList = ref([
|
||||
[{
|
||||
name: "储值",
|
||||
type: "recharge",
|
||||
num: 0,
|
||||
icon: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/storedValue.png"
|
||||
},
|
||||
{
|
||||
name: "积分",
|
||||
type: "points",
|
||||
num: 0,
|
||||
icon: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/points.png"
|
||||
},
|
||||
{
|
||||
name: "优惠券",
|
||||
type: "my_coupon",
|
||||
num: 0,
|
||||
icon: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/coupon.png"
|
||||
},
|
||||
// { name: "权益卡", type: "", num: 0, icon: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/equityCard.png"}
|
||||
]
|
||||
])
|
||||
const myFunList = ref([{
|
||||
name: "我的优惠券",
|
||||
type: "my_coupon",
|
||||
icon: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/my_coupon.png"
|
||||
},
|
||||
{
|
||||
name: "我的订单",
|
||||
type: "my_order",
|
||||
icon: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/my_order.png"
|
||||
},
|
||||
// { name: "收货地址", type: "", icon: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/my_address.png"},
|
||||
{
|
||||
name: "个人资料",
|
||||
type: "my_info",
|
||||
icon: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/personal.png"
|
||||
},
|
||||
{
|
||||
name: "我的会员卡",
|
||||
type: "my_member",
|
||||
icon: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/my_member.png"
|
||||
},
|
||||
// { name: "关于", type: "", icon: "https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/inRegard.png"},
|
||||
])
|
||||
const shopInfo = reactive({
|
||||
isVip: 0
|
||||
})
|
||||
const userInfo = reactive({
|
||||
nickName: '无名',
|
||||
headImg: 'https://czg-qr-order.oss-cn-beijing.aliyuncs.com/my/my_member.png'
|
||||
})
|
||||
const teblist = ref([])
|
||||
const shopExtend = ref(null)
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.topBack {
|
||||
width: 100%;
|
||||
height: 400rpx;
|
||||
position: absolute;
|
||||
}
|
||||
|
||||
.myContent {
|
||||
position: relative;
|
||||
z-index: 1;
|
||||
padding: 298rpx 20rpx 0 20rpx;
|
||||
|
||||
.my_info {
|
||||
height: 172rpx;
|
||||
align-items: center;
|
||||
background-color: #fff;
|
||||
padding: 0 32rpx;
|
||||
border-radius: 18rpx;
|
||||
|
||||
.my_info_left {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.my_info_left_head {
|
||||
width: 84rpx;
|
||||
height: 84rpx;
|
||||
margin-right: 18rpx;
|
||||
border-radius: 50%;
|
||||
}
|
||||
|
||||
.name {
|
||||
font-weight: 400;
|
||||
font-size: 36rpx;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
|
||||
.my_info_right {
|
||||
width: 136rpx;
|
||||
height: 48rpx;
|
||||
background-color: #E3AD7F;
|
||||
border-radius: 24rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
|
||||
text {
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
color: #FFFFFF;
|
||||
}
|
||||
}
|
||||
|
||||
.my_info_right_qr {
|
||||
width: 60rpx;
|
||||
height: 60rpx;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
|
||||
|
||||
.my_item {
|
||||
background-color: #fff;
|
||||
padding: 22rpx 32rpx;
|
||||
border-radius: 18rpx;
|
||||
margin-top: 16rpx;
|
||||
|
||||
.my_item_title {
|
||||
font-weight: bold;
|
||||
font-size: 32rpx;
|
||||
color: #333333;
|
||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
||||
}
|
||||
}
|
||||
|
||||
.my_assets {
|
||||
.my_item_title {
|
||||
margin-bottom: 26rpx;
|
||||
}
|
||||
|
||||
.my_assets_list {
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
padding: 0 38rpx;
|
||||
|
||||
.my_list_item {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
|
||||
.my_list_item_icon {
|
||||
width: 52rpx;
|
||||
height: 44rpx;
|
||||
}
|
||||
|
||||
.my_list_item_name {
|
||||
font-weight: 500;
|
||||
font-size: 24rpx;
|
||||
color: #333333;
|
||||
margin-top: 16rpx;
|
||||
margin-bottom: 16rpx;
|
||||
}
|
||||
|
||||
.my_list_item_num {
|
||||
font-weight: 400;
|
||||
font-size: 20rpx;
|
||||
color: #E3AD7F;
|
||||
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.my_fun {
|
||||
.my_item_title {
|
||||
margin-bottom: 18rpx;
|
||||
}
|
||||
|
||||
.my_fun_list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
|
||||
.my_list_item {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
padding: 24rpx 0 26rpx 0;
|
||||
border-bottom: 1rpx solid #E5E5E5;
|
||||
|
||||
.my_list_item_left {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.my_list_item_icon {
|
||||
width: 44rpx;
|
||||
height: 44rpx;
|
||||
margin-right: 18rpx;
|
||||
}
|
||||
|
||||
.my_list_item_name {
|
||||
font-weight: 400;
|
||||
font-size: 28rpx;
|
||||
color: #333333;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.my_list_item:last-child {
|
||||
border-bottom: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Binary file not shown.
|
After Width: | Height: | Size: 1.1 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 710 B |
Binary file not shown.
|
After Width: | Height: | Size: 827 B |
Binary file not shown.
|
After Width: | Height: | Size: 660 B |
Binary file not shown.
|
After Width: | Height: | Size: 1.0 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 776 B |
Binary file not shown.
|
After Width: | Height: | Size: 1.5 KiB |
Binary file not shown.
|
After Width: | Height: | Size: 942 B |
|
|
@ -1,5 +1,9 @@
|
|||
import { defineStore } from 'pinia';
|
||||
|
||||
import {
|
||||
defineStore
|
||||
} from 'pinia';
|
||||
import {
|
||||
ref
|
||||
} from 'vue';
|
||||
export const useNavbarStore = defineStore('navbar', {
|
||||
state: () => ({
|
||||
showBack: true,
|
||||
|
|
@ -25,7 +29,8 @@ export const useNavbarStore = defineStore('navbar', {
|
|||
if (res.platform === 'weapp') {
|
||||
const menuButtonInfo = uni.getMenuButtonBoundingClientRect();
|
||||
const topGap = menuButtonInfo.top - statusBarHeight;
|
||||
const bottomGap = statusBarHeight + menuButtonInfo.height + topGap * 2 - (menuButtonInfo.top + menuButtonInfo.height);
|
||||
const bottomGap = statusBarHeight + menuButtonInfo.height + topGap * 2 - (
|
||||
menuButtonInfo.top + menuButtonInfo.height);
|
||||
navBarHeight = menuButtonInfo.height + topGap + bottomGap;
|
||||
} else if (uni.getSystemInfoSync().platform === 'ios') {
|
||||
navBarHeight = 44;
|
||||
|
|
|
|||
|
|
@ -0,0 +1,88 @@
|
|||
import {
|
||||
defineStore
|
||||
} from 'pinia';
|
||||
import {
|
||||
ref
|
||||
} from 'vue';
|
||||
import {
|
||||
APIcustomlogin
|
||||
} from '@/common/api/api.js'
|
||||
|
||||
export const Storelogin = defineStore('login', {
|
||||
state: () => ({
|
||||
token: '',
|
||||
miniAppOpenId: '',
|
||||
userInfo: ''
|
||||
}),
|
||||
actions: {
|
||||
actionslogin() {
|
||||
return new Promise((resolve, reject) => {
|
||||
// #ifdef MP-WEIXIN
|
||||
uni.login({
|
||||
provider: 'weixin',
|
||||
success: (data) => {
|
||||
// 微信小程序环境
|
||||
uni.getUserInfo({
|
||||
provider: 'weixin',
|
||||
success: async (infoRes) => {
|
||||
let res = await APIcustomlogin({
|
||||
code: data.code, //临时登录凭证
|
||||
rawData: infoRes.rawData,
|
||||
source: 'wechat'
|
||||
})
|
||||
if (res.code == 0) {
|
||||
this.token = res.data.token
|
||||
this.miniAppOpenId = res.data.userInfo
|
||||
.miniAppOpenId
|
||||
this.userInfo = res.data.userInfo
|
||||
uni.cache.set('token', res.data.token);
|
||||
uni.cache.set('miniAppOpenId', res.data
|
||||
.userInfo
|
||||
.miniAppOpenId)
|
||||
uni.cache.set('userInfo', res.data
|
||||
.userInfo);
|
||||
}
|
||||
resolve(true);
|
||||
},
|
||||
fail: (err) => {
|
||||
reject(false);
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
// #endif
|
||||
// #ifdef MP-ALIPAY
|
||||
my.getAuthCode({
|
||||
scopes: 'auth_base',
|
||||
success: async (data) => {
|
||||
console.log(data)
|
||||
// 支付宝小程序环境
|
||||
// my.getAuthUserInfo({
|
||||
// success: async (infoRes) => {
|
||||
let res = await APIcustomlogin({
|
||||
code: data.authCode, //临时登录凭证
|
||||
// rawData: JSON.stringify(infoRes),
|
||||
source: 'alipay'
|
||||
})
|
||||
if (res.code == 0) {
|
||||
this.token = res.data.token
|
||||
this.miniAppOpenId = res.data.userInfo.miniAppOpenId
|
||||
this.userInfo = res.data.userInfo
|
||||
uni.cache.set('token', res.data.token);
|
||||
uni.cache.set('miniAppOpenId', res.data.userInfo
|
||||
.miniAppOpenId)
|
||||
uni.cache.set('userInfo', res.data.userInfo);
|
||||
resolve(true);
|
||||
}
|
||||
},
|
||||
fail: (err) => {
|
||||
reject(false);
|
||||
}
|
||||
});
|
||||
}
|
||||
});
|
||||
// #endif
|
||||
}).catch((e) => {});
|
||||
}
|
||||
}
|
||||
});
|
||||
Loading…
Reference in New Issue