5 Commits
wwz_d ... wwz

Author SHA1 Message Date
魏啾
8b68595e92 api type更改 2024-04-16 10:37:42 +08:00
魏啾
7a8617b7a7 更新openId 2024-04-15 18:20:00 +08:00
魏啾
45f8f23fcc 1 2024-04-09 09:55:04 +08:00
魏啾
6040e37da2 接口测试 2024-04-09 09:54:55 +08:00
魏啾
b30b8ffc30 微信码 2024-04-08 14:41:34 +08:00
265 changed files with 1655 additions and 59842 deletions

3
.gitignore vendored
View File

@@ -1,2 +1 @@
/unpackage
node_modules/
/unpackage

View File

@@ -1,27 +1,16 @@
{
// launch.json 配置了启动调试时相关设置configurations下节点名称可为 app-plus/h5/mp-weixin/mp-baidu/mp-alipay/mp-qq/mp-toutiao/mp-360/
// launchtype项可配置值为local或remote, local代表前端连本地云函数remote代表前端连云端云函数
"version" : "0.0",
"configurations" : [
{
"app-plus" : {
"launchtype" : "local"
},
"default" : {
"launchtype" : "local"
},
"mp-weixin" : {
"launchtype" : "local"
},
"type" : "uniCloud"
},
{
"playground" : "custom",
"type" : "uni-app:app-android"
},
{
"playground" : "standard",
"type" : "uni-app:app-ios"
}
{ // launch.json 配置了启动调试时相关设置configurations下节点名称可为 app-plus/h5/mp-weixin/mp-baidu/mp-alipay/mp-qq/mp-toutiao/mp-360/
// launchtype项可配置值为local或remote, local代表前端连本地云函数remote代表前端连云端云函数
"version": "0.0",
"configurations": [{
"default" :
{
"launchtype" : "local"
},
"mp-weixin" :
{
"launchtype" : "local"
},
"type" : "uniCloud"
}
]
}

24
App.vue
View File

@@ -1,29 +1,15 @@
<template>
<button v-show="false" open-type="getPhoneNumber" @getphonenumber="userlogin"> </button>
</template>
<script>
import useStorage from '@/utils/useStroage.js';
export default {
onLaunch: function() {
// #ifdef MP-WEIXIN
uni.cache.set('menuInfo', uni.getMenuButtonBoundingClientRect());
// #endif
uni.cache.set('NAME', '零点八零');
this.userlogin()
// console.log('App Launch');
useStorage.set('menuInfo', uni.getMenuButtonBoundingClientRect());
},
onLoad() {},
onShow: function() {
this.$store.dispatch("HeightActions"); //获取随时获取页面的高度
// console.log('App Show');
},
onHide: function() {
// console.log('App Hide');
},
methods: {
userlogin() {
if (!uni.cache.get('token')) {
this.$store.dispatch("loginEvent"); //获取shapid
}
}
}
};
</script>
@@ -84,7 +70,7 @@
}
page {
background-color: #F9F9F9;
background-color: #f2f2f2;
}
text {

View File

@@ -0,0 +1,35 @@
var crypto = require('crypto')
function WXBizDataCrypt(appId, sessionKey) {
this.appId = appId
this.sessionKey = sessionKey
}
WXBizDataCrypt.prototype.decryptData = function (encryptedData, iv) {
// base64 decode
var sessionKey = new Buffer(this.sessionKey, 'base64')
encryptedData = new Buffer(encryptedData, 'base64')
iv = new Buffer(iv, 'base64')
try {
// 解密
var decipher = crypto.createDecipheriv('aes-128-cbc', sessionKey, iv)
// 设置自动 padding 为 true删除填充补位
decipher.setAutoPadding(true)
var decoded = decipher.update(encryptedData, 'binary', 'utf8')
decoded += decipher.final('utf8')
decoded = JSON.parse(decoded)
} catch (err) {
throw new Error('Illegal Buffer')
}
if (decoded.watermark.appid !== this.appId) {
throw new Error('Illegal Buffer')
}
return decoded
}
module.exports = WXBizDataCrypt

View File

@@ -2,26 +2,8 @@ export default {
userwxlogin(data) { //登录
return uni.api.post("/login/wx/custom/login", data);
},
userwxlogins(data) { // 获取手机号
return uni.api.post("/login/getPhoneNumber", data);
},
loginapplogin(data) { //APP登录(登录即注册)
return uni.api.post("/login/app/login", data);
},
productqueryProduct(data) { //获取商品信息
return uni.api.post("/product/queryProduct", data, false);
},
// 下单详情
getproductorderConfirm(data) {
return uni.api.get("/product/orderConfirm", data);
},
// 会员支付
accountPay(data) {
return uni.api.get("/pay/accountPay", data);
},
// 下单
creatGroupOrder(data) {
return uni.api.post("/groupOrderInfo/creatGroupOrder", data);
return uni.api.post("/product/queryProduct", data);
},
cartadd(data) { //添加到购物车
return uni.api.post("/cart/add", data);
@@ -47,145 +29,22 @@ export default {
orderorderList(data) { //订单列表
return uni.api.get("/order/orderList", data);
},
// 团购订单列表
groupOrderInfo(data) { //订单列表
return uni.api.get("/groupOrderInfo/list", data);
},
orderorderInfo(data) { //订单回显
return uni.api.get("/order/orderInfo", data);
},
groupOrderInfoDetail(data) { //订单回显
return uni.api.get("/groupOrderInfo/get", data);
},
loginwxuserInfo(data) { //用户详情
return uni.api.get("/login/userInfo", data);
loginwxuserInfo(data) { //微信用户详情
return uni.api.get("/login/wx/userInfo", data);
},
paymemeberIn(data) { //充值
return uni.api.post("/pay/memeberIn", data);
},
// 支付
payOrderPay(data) {
return uni.api.post("/pay/groupOrderPay", data);
},
paymodfiyOrderInfo(data) { //查询订单支付状态
return uni.api.post("/pay/modfiyOrderInfo", data);
},
// 获取余额
shopUserInfo(data) {
return uni.api.get("/user/shopUserInfo", data);
},
// 优惠券数量
userCoupon(data) {
return uni.api.get("/user/userCoupon", data);
},
// 优惠加倍
yhqDouble(data) { //查询订单支付状态
return uni.api.post("/order/yhqDouble", data);
},
// 优惠卷详情
getYhqDouble(data) { //通过选中的商品规格查询价格
return uni.api.get("/order/getYhqDouble", data);
},
productqueryProductSku(data) { //通过选中的商品规格查询价格
return uni.api.get("/product/queryProductSku", data, false);
return uni.api.get("/product/queryProductSku", data);
},
logingetPhoneNumber(data) { //小程序获取手机号
return uni.api.post("/login/getPhoneNumber", data);
},
cashierServiceloginregister(data) { //用户注册
return uni.api.post("/cashierService/login/register", data);
},
cashierServiceloginregister(data) { //APP登录
return uni.api.post("/login/app/login", data);
},
phoneValidateCode(data) { //验证码
return uni.api.get("/phoneValidateCode", data);
},
homehomePageUp(data) { //首页上半部分
return uni.api.post("/home/homePageUp", data);
},
home(data) { //首页上半部分
return uni.api.post("/home", data, false);
},
locationdistrict(data) { //获取行政区域(区,街道)
return uni.api.get("/location/district", data);
},
queryMemberAccount(data) { //获取行政区域(区,街道)
return uni.api.get("/pay/queryMemberAccount", data);
},
ordermineCoupons(data) { //我的优惠券
return uni.api.get("/order/mineCoupons", data, false);
},
ordergetYhqPara(data) { //获取优惠券参数列表
return uni.api.get("/order/getYhqPara", data);
},
orderfindCoupons(data) { //系统优惠券
return uni.api.get("/order/findCoupons", data);
},
tbPlatformDict(data) { //获取菜单
return uni.api.get("/tbPlatformDict", data);
},
distirictsubShopList(data) { //预约到店(店铺列表)
return uni.api.get("/distirict/subShopList", data);
},
distiricttopCommon(data) { //获取top部分(店铺列表)
return uni.api.get("/distirict/topCommon", data);
},
orderfindWiningUser(data) { //获取免单订单
return uni.api.get("/order/findWiningUser", data);
},
// 获取自己的免单订单
ordermineWinner(data) {
return uni.api.get("/order/mineWinner", data);
},
indexlist(data) { //商品列表(今日上新/热榜/咖啡饮品)
return uni.api.get("/distirict/productCate", data, false);
},
productproductInfo(data) { //商品详情
return uni.api.get("/product/productInfo", data);
},
distirictcomShopList(data) { //通用门店列表
return uni.api.get("/distirict/comShopList", data);
},
loginOut(data) { //退出登录
return uni.api.post("/login/loginOut", data);
},
productqueryShopIdByTableCode(data) { //通过桌码获取shopId
return uni.api.get("/product/queryShopIdByTableCode", data);
},
geocodelocation(data) { //根据经纬度获取信息
return uni.api.get("/location/geocode", data);
},
// 修改头像和昵称
upUserInfo(data) {
return uni.api.post("/login/upUserInfo", data);
},
loginresetPwd(data) { // 重置资金密码
return uni.api.post("/login/resetPwd", data);
},
paygetActive(data) { // 获取充值活动
return uni.api.get("/pay/getActive", data);
},
paygetShopByMember(data) { // 获取会员店铺信息
return uni.api.get("/pay/getShopByMember", data, false);
},
loginmpdifyPwd(data) { // 修改资金密码
return uni.api.get("/login/mpdifyPwd", data);
},
cashierServicesong(data) { // 获取所有歌曲,支持搜索及分页
return uni.api.get("/song", data, false);
},
cashierServicerecord(data) { // 点歌记录
return uni.api.get("/song/record", data);
},
cashierServicesongpost(data) { // 点歌
return uni.api.post("/song", data);
},
businessopenId(data) { // 获取openId
return uni.api.get("/login/wx/business/openId", data);
},
songsinging(data) { // 获取正在演唱的歌曲
return uni.api.get("/song/singing", data, false);
},
}

File diff suppressed because it is too large Load Diff

74
common/js/lange.js Normal file
View File

@@ -0,0 +1,74 @@
const env = {
aliyunServerURL: 'https://czg-qr-order.oss-cn-beijing.aliyuncs.com',
accessid: 'LTAI5tMLHwnM1zYYAFuRa1fK',
AccessKeySecret: 'jS1h2STq1vcODczDNFQkjcU6ODyYAj',
timeout: 100000
}
const Base64 = require('./Base64.js');
require('./hmac.js');
require('./sha1.js');
const Crypto = require('./crypto.js');
const uploadFile = function(filePath, key = new Date().getTime()) {
return new Promise((resolve, reject) => {
// const aliyunFileKey = `${new Date().getTime()}_${userId}`;
const aliyunServerURL = env.aliyunServerURL;
const accessid = env.accessid;
const policyBase64 = getPolicyBase64();
const signature = getSignature(policyBase64);
wx.uploadFile({
url: aliyunServerURL, //仅为示例,非真实的接口地址
filePath: filePath,
name: 'file',
formData: {
'key': 'headportrait/' + key,
'OSSAccessKeyId': accessid,
'policy': policyBase64,
'Signature': signature,
'success_action_status': '200',
},
success: function(res) {
if (res.statusCode != 200) {
reject('上传错误:' + JSON.stringify(res))
return;
}
resolve(`https://czh5.sxczgkj.cn/headportrait/${key}`)
},
fail: function(err) {
reject('上传错误:' + JSON.stringify(err))
}
})
})
}
const getPolicyBase64 = function() {
let date = new Date();
date.setHours(date.getHours() + env.timeout);
let srcT = date.toISOString();
const policyText = {
"expiration": srcT, //设置该Policy的失效时间超过这个失效时间之后就没有办法通过这个policy上传文件了 指定了Post请求必须发生在2020年01月01日12点之前("2020-01-01T12:00:00.000Z")。
"conditions": [
["content-length-range", 0, 20 * 1024 * 1024] // 设置上传文件的大小限制,1048576000=1000mb
]
};
const policyBase64 = Base64.encode(JSON.stringify(policyText));
return policyBase64;
}
const getSignature = function(policyBase64) {
const accesskey = env.AccessKeySecret;
const bytes = Crypto.HMAC(Crypto.SHA1, policyBase64, accesskey, {
asBytes: true
});
const signature = Crypto.util.bytesToBase64(bytes);
return signature;
}
module.exports = uploadFile;

View File

@@ -1,161 +1,148 @@
class webSocketUtils {
constructor(url, time, params) {
this.socketTask = null;
this.is_open_socket = false; //避免重复连接
this.url = url;
this.params = params ? params : null; ////是否初始化请求
this.connectNum = 1; // 重连次数
//这个参数是防止重连失败之后onClose方法会重复执行reconnect方法导致重连定时器出问题
//连接并打开之后可重连,且只执行重连方法一次
this.canReconnect = false; // 是否可以重连
//心跳检测
this.timeout = time ? time : 5000; //多少秒执行检测
this.heartbeatInterval = null; //检测服务器端是否还活着
this.reconnectTimeOut = null; //重连之后多久再次重连
try {
return this.connectSocketInit({
data: this.params,
type: 'connectSocketInit',
});
} catch (e) {
console.log('catch');
this.reconnect();
}
}
// 进入这个页面的时候创建websocket连接【整个页面随时使用】
connectSocketInit(data) {
this.data = data;
this.socketTask = uni.connectSocket({
url: this.url,
success: () => {
// console.log('正准备建立websocket中...');
// uni.hideLoading();
// 返回实例
return this.socketTask;
},
});
this.socketTask.onOpen((res) => {
uni.hideLoading()
this.connectNum = 1;
// console.log('WebSocket连接正常');
if (this.params) { //是否初始化请求
this.send(this.params);
}
clearInterval(this.reconnectTimeOut);
clearInterval(this.heartbeatInterval);
this.is_open_socket = true;
this.canReconnect = true;
this.start();
// 注:只有连接正常打开中 ,才能正常收到消息
this.socketTask.onMessage((e) => {
// 字符串转json
let res = JSON.parse(e.data);
uni.$emit('message', res)
// 普通socket信息处理 TODO
});
});
// 监听连接失败这里代码我注释掉的原因是因为如果服务器关闭后和下面的onclose方法一起发起重连操作这样会导致重复连接
uni.onSocketError((res) => {
console.log('网络断开,请检查!');
this.socketTask = null;
this.is_open_socket = false;
// this.Close()
this.canReconnect = true;
clearInterval(this.heartbeatInterval);
clearInterval(this.reconnectTimeOut);
try {
if (this.connectNum <= 10) {
// uni.showLoading({
// title: `网络连接失败,正尝试第${this.connectNum}次连接`,
// mask: true
// })
uni.$emit('message', 1) //进行重连
uni.showToast({
title: `网络连接失败,正尝试第${this.connectNum}次连接`,
icon: 'none',
});
this.reconnect();
this.connectNum += 1;
} else {
// uni.$emit('connectError');
uni.showToast({
title: `网络连接失败,请检查网络!`,
icon: 'none',
});
this.connectNum = 1;
this.canReconnect = false;
this.Close()
setTimeout(res => {
uni.switchTab({
url: '/pages/index/index'
})
uni.hideLoading()
}, 1000)
}
} catch (e) {
//TODO handle the exception
}
});
// 这里仅是事件监听【如果socket关闭了会执行】
this.socketTask.onClose(() => {
this.socketTask = null;
clearInterval(this.heartbeatInterval);
clearInterval(this.reconnectTimeOut);
this.is_open_socket = false;
if (this.canReconnect) {
this.reconnect();
this.canReconnect = false;
}
});
}
// 主动关闭socket连接
Close() {
this.is_open_socket = true;
this.canReconnect = false;
if (this.socketTask) {
this.socketTask.close({
success(res) {
console.log('手动关闭成功');
},
});
}
}
//发送消息
send(data) {
// console.log("发送消息---------->", data);
// 注:只有连接正常打开中 ,才能正常成功发送消息
if (this.socketTask) {
this.socketTask.send({
data: JSON.stringify(data),
async success() {
// console.log("消息发送成功");
},
});
}
}
//开启心跳检测
start(data) {
// console.log('开启心跳检测', data)
this.heartbeatInterval = setInterval(() => {
this.send({
data: '心跳检测',
type: 'heartbeat',
});
}, this.timeout);
}
//重新连接
reconnect() {
//停止发送心跳
clearInterval(this.heartbeatInterval);
//如果不是人为关闭的话,进行重连
if (!this.is_open_socket) {
console.log('进行重连');
this.canReconnect = true;
this.reconnectTimeOut = setInterval(() => {
this.connectSocketInit(this.data);
}, this.timeout);
}
}
constructor(url, time, params) {
this.socketTask = null;
this.is_open_socket = false; //避免重复连接
this.url = url;
this.params = params ? params : null;////是否初始化请求
this.connectNum = 1; // 重连次数
//这个参数是防止重连失败之后onClose方法会重复执行reconnect方法导致重连定时器出问题
//连接并打开之后可重连,且只执行重连方法一次
this.canReconnect = false; // 是否可以重连
//心跳检测
this.timeout = time ? time : 5000; //多少秒执行检测
this.heartbeatInterval = null; //检测服务器端是否还活着
this.reconnectTimeOut = null; //重连之后多久再次重连
try {
return this.connectSocketInit({
data: this.params,
type: 'connectSocketInit',
});
} catch (e) {
console.log('catch');
this.reconnect();
}
}
// 进入这个页面的时候创建websocket连接【整个页面随时使用】
connectSocketInit (data) {
console.log(data,"初始化")
this.data = data;
// console.log('this.url==', this.url);
// console.log('this.params==', this.params);
this.socketTask = uni.connectSocket({
url: this.url,
success: () => {
console.log('正准备建立websocket中...');
uni.hideLoading();
// 返回实例
return this.socketTask;
},
});
this.socketTask.onOpen((res) => {
this.connectNum = 1;
console.log('WebSocket连接正常');
if(this.params){//是否初始化请求
this.send(this.params);
}
clearInterval(this.reconnectTimeOut);
clearInterval(this.heartbeatInterval);
this.is_open_socket = true;
this.canReconnect = true;
this.start();
// 注:只有连接正常打开中 ,才能正常收到消息
this.socketTask.onMessage((e) => {
// 字符串转json
let res = JSON.parse(e.data);
uni.$emit('message', res)
// 普通socket信息处理 TODO
});
});
// 监听连接失败这里代码我注释掉的原因是因为如果服务器关闭后和下面的onclose方法一起发起重连操作这样会导致重复连接
uni.onSocketError((res) => {
console.log('网络断开,请检查!');
this.socketTask = null;
this.is_open_socket = false;
this.canReconnect = true;
clearInterval(this.heartbeatInterval);
clearInterval(this.reconnectTimeOut);
if (this.connectNum <= 10) {
uni.showToast({
title: `网络连接失败,正尝试第${this.connectNum}次连接`,
icon: 'none',
});
this.reconnect();
this.connectNum += 1;
} else {
// uni.$emit('connectError');
uni.showToast({
title: `网络连接失败,请检查网络!`,
icon: 'none',
});
this.connectNum = 1;
this.canReconnect = false;
}
});
// 这里仅是事件监听【如果socket关闭了会执行】
this.socketTask.onClose(() => {
this.socketTask = null;
clearInterval(this.heartbeatInterval);
clearInterval(this.reconnectTimeOut);
this.is_open_socket = false;
if (this.canReconnect) {
this.reconnect();
this.canReconnect = false;
}
});
}
// 主动关闭socket连接
Close () {
this.is_open_socket = true;
this.canReconnect = false;
if(this.socketTask){
this.socketTask.close({
success(res) {
console.log('手动关闭成功');
},
});
}
}
//发送消息
send(data) {
console.log("发送消息---------->", data);
// 注:只有连接正常打开中 ,才能正常成功发送消息
if (this.socketTask) {
this.socketTask.send({
data: JSON.stringify(data),
async success() {
console.log("消息发送成功");
},
});
}
}
//开启心跳检测
start(data) {
console.log('开启心跳检测',data)
// this.heartbeatInterval = setInterval(() => {
// this.send({
// data: '心跳检测',
// type: 'jc',
// });
// }, this.timeout);
}
//重新连接
reconnect() {
//停止发送心跳
clearInterval(this.heartbeatInterval);
//如果不是人为关闭的话,进行重连
if (!this.is_open_socket) {
console.log('进行重连');
// this.canReconnect = true;
this.reconnectTimeOut = setInterval(() => {
this.connectSocketInit(this.data);
}, this.timeout);
}
}
}
module.exports = webSocketUtils;

View File

@@ -1,155 +0,0 @@
<template>
<view>
<view class="swiperPanel" @touchstart="startMove" @touchend="endMove">
<view class="swiperItem" v-for="(item, index) in swiperList" :key="index"
:style="{transform: itemStyle[index].transform, zIndex: itemStyle[index].zIndex, opacity: itemStyle[index].opacity}">
<view class="children">
<image class="pic" :src="item.logo"></image>
</view>
</view>
</view>
<!-- <swiper class="swiperItem" circular v-for="(item, index) in swiperList" :key="index"
:style="{transform: itemStyle[index].transform, zIndex: itemStyle[index].zIndex, opacity: itemStyle[index].opacity}">
<swiper-item class="children">
<image class="pic" :src="item.logo"></image>
</swiper-item>
</swiper> -->
</view>
</template>
<script>
export default {
props: {
swiperList: {
type: Array,
default () {
return []
}
},
timersetnteritem: {
type: String,
default: '0'
}
},
data() {
return {
timersetInterval: null,
slideNote: {
x: 0,
y: 0
},
screenWidth: 0,
itemStyle: [
{
transform:''
}
]
};
},
watch: {
timersetnteritem(newVal,oldVal) {
if (newVal == 1) {
clearTimeout(this.timersetInterval);
this.timersetInterval = null;
}
}
},
mounted() {
var macInfo = uni.getSystemInfoSync();
this.screenWidth = macInfo.screenWidth;
// 计算swiper样式
this.swiperList.forEach((item, index) => {
this.itemStyle.push(this.getStyle(index))
})
// this.timersetInterval = setInterval(() => {
// this.endMove()
// }, 2000);
},
methods: {
getStyle(e) {
if (e > this.swiperList.length / 2) {
var right = this.swiperList.length - e
return {
transform: 'scale(' + (1) + ') translate(-' + (right * 20) + '%,0px)',
zIndex: 9999 - right,
opacity: 1
}
} else {
return {
transform: 'scale(' + (1) + ') translate(' + (e * 20) + '%,0px)',
zIndex: 9999 - e,
opacity: 1
}
}
// if (e > this.swiperList.length / 2) {
// var right = this.swiperList.length - e
// return {
// transform: 'scale(' + (1 - right / 10) + ') translate(-' + (right * 9) + '%,0px)',
// zIndex: 9999 - right,
// opacity: 0.8 / right
// }
// } else {
// return {
// transform: 'scale(' + (1 - e / 10) + ') translate(' + (e * 9) + '%,0px)',
// zIndex: 9999 - e,
// opacity: 0.8 / e
// }
// }
},
startMove(e) {
this.slideNote.x = e.changedTouches[0] ? e.changedTouches[0].pageX : 0;
this.slideNote.y = e.changedTouches[0] ? e.changedTouches[0].pageY : 0;
},
endMove(e) {
var newList = JSON.parse(JSON.stringify(this.itemStyle))
// if ((e.changedTouches[0].pageX - this.slideNote.x) < 0) {
// 向左滑动
var last = [newList.pop()]
newList = last.concat(newList)
// } else {
// 向右滑动
// newList.push(newList[0])
// newList.splice(0, 1)
// }
this.itemStyle = newList
}
}
}
</script>
<style lang="scss">
.swiperPanel {
height: 28rpx;
width: 100%;
overflow: hidden;
position: relative;
.swiperItem {
height: 100%;
width: 100%;
position: absolute;
top: 0;
left: 0;
transition: all .5s;
/* 定义一个动画关键帧 */
.children {
height: 100%;
width: 25%;
// margin: 2rpx auto;
/* 应用动画,设置动画时长、循环次数和速度曲线 */
.pic {
height: 100%;
width: 100%;
border-radius: 50%;
// box-shadow: 0 0 10px #333;
}
}
}
}
</style>

View File

@@ -1,5 +1,5 @@
<template>
<u-image :src="src" :radius="radius" :width="width" :height="height" :fade="false" :lazy-load="true" slot="loading"></u-image>
<u-image :src="src" :radius="radius" :width="width" :height="height" :fade="false"></u-image>
</template>
<script>

View File

@@ -1,192 +0,0 @@
<template>
<view class="uni-countdown">
<text v-if="showDay" class="uni-countdown__number">{{ d }}</text>
<text v-if="showDay" class="uni-countdown__splitor"></text>
<text class="uni-countdown__number">{{ h }}</text>
<text class="uni-countdown__splitor">{{ showColon ? ':' : '时' }}</text>
<text class="uni-countdown__number">{{ i }}</text>
<text class="uni-countdown__splitor">{{ showColon ? ':' : '分' }}</text>
<text class="uni-countdown__number">{{ s }}</text>
<text v-if="!showColon" class="uni-countdown__splitor"></text>
</view>
</template>
<script>
/**
* Countdown 倒计时
* @description 倒计时组件
* @tutorial https://ext.dcloud.net.cn/plugin?id=25
* @property {String} backgroundColor 背景色
* @property {String} color 文字颜色
* @property {Number} day 天数
* @property {Number} hour 小时
* @property {Number} minute 分钟
* @property {Number} second 秒
* @property {Boolean} showDay = [true|false] 是否显示天数
* @property {Boolean} showColon = [true|false] 是否以冒号为分隔符
* @property {String} splitorColor 分割符号颜色
* @event {Function} timeup 倒计时时间到触发事件
* @example <uni-countdown :day="1" :hour="1" :minute="12" :second="40"></uni-countdown>
*/
export default {
name: 'UniCountdown',
props: {
showDay: {
type: Boolean,
default: true
},
showColon: {
type: Boolean,
default: true
},
backgroundColor: {
type: String,
default: '#FFFFFF'
},
borderColor: {
type: String,
default: '#000000'
},
color: {
type: String,
default: '#000000'
},
splitorColor: {
type: String,
default: '#000000'
},
indexs: {
type: Number,
default: 0
},
day: {
type: Number,
default: 0
},
hour: {
type: Number,
default: 0
},
minute: {
type: Number,
default: 0
},
second: {
type: Number,
default: 0
}
},
data() {
return {
timer: null,
syncFlag: false,
d: '00',
h: '00',
i: '00',
s: '00',
leftTime: 0,
seconds: 0
}
},
watch: {
day(val) {
this.changeFlag()
},
hour(val) {
this.changeFlag()
},
minute(val) {
this.changeFlag()
},
second(val) {
this.changeFlag()
}
},
created: function(e) {
this.startData();
},
beforeDestroy() {
clearInterval(this.timer)
},
methods: {
toSeconds(day, hours, minutes, seconds) {
return day * 60 * 60 * 24 + hours * 60 * 60 + minutes * 60 + seconds
},
timeUp() {
console.log(1)
clearInterval(this.timer)
this.$emit('timeup',this.indexs)
},
countDown() {
let seconds = this.seconds
let [day, hour, minute, second] = [0, 0, 0, 0]
if (seconds > 0) {
day = Math.floor(seconds / (60 * 60 * 24))
hour = Math.floor(seconds / (60 * 60)) - (day * 24)
minute = Math.floor(seconds / 60) - (day * 24 * 60) - (hour * 60)
second = Math.floor(seconds) - (day * 24 * 60 * 60) - (hour * 60 * 60) - (minute * 60)
} else {
this.timeUp()
}
if (day < 10) {
day = '0' + day
}
if (hour < 10) {
hour = '0' + hour
}
if (minute < 10) {
minute = '0' + minute
}
if (second < 10) {
second = '0' + second
}
this.d = day
this.h = hour
this.i = minute
this.s = second
},
startData() {
this.seconds = this.toSeconds(this.day, this.hour, this.minute, this.second)
if (this.seconds <= 0) {
return
}
this.countDown()
this.timer = setInterval(() => {
this.seconds--
if (this.seconds < 0) {
this.timeUp()
return
}
this.countDown()
}, 1000)
},
changeFlag() {
console.log(this.syncFlag,111111)
if (!this.syncFlag) {
this.seconds = this.toSeconds(this.day, this.hour, this.minute, this.second)
this.startData();
this.syncFlag = true;
}
}
}
}
</script>
<style scoped>
.uni-countdown {
display: flex;
flex-direction: row;
justify-content: flex-start;
}
.uni-countdown__splitor {
display: flex;
justify-content: center;
font-size: 22rpx;
}
.uni-countdown__number {
display: flex;
justify-content: center;
align-items: center;
text-align: center;
}
</style>

View File

@@ -1,267 +0,0 @@
<template>
<view class='keyboard' @click.stop='_handleKeyPress'>
<view class='key-row'>
<view class='key-cell cell_b' data-num='7'>7</view>
<view class='key-cell cell_b' data-num='8'>8</view>
<view class='key-cell cell_b' data-num='9'>9</view>
<view class='key-cell cell_b' data-num='-1'></view>
</view>
<view class='key-row'>
<view class='key-cell cell_b' data-num='4'>4</view>
<view class='key-cell cell_b' data-num='5'>5</view>
<view class='key-cell cell_b' data-num='6'>6</view>
<view class='key-cell cell_b' data-num='-1'></view>
</view>
<view class='key-row'>
<view class='key-cell cell_b' data-num='1'>1</view>
<view class='key-cell cell_b' data-num='2'>2</view>
<view class='key-cell cell_b' data-num='3'>3</view>
<view class='key-cell cell_b' data-num='-1'></view>
</view>
<view class="key-zero-and-point">
<view class="a cell_b zero" data-num='0'>0</view>
<view class="a cell_b point" data-num='.'>.</view>
</view>
<view @touchstart="touchstart" @touchend="touchend" data-num='D' class="key-confirm2">
<text data-num='D'>C</text>
</view>
<view class='key-confirm' :style="{'background':btnColor}" data-num='S'>
<view data-num='S' class="">
<view data-num='S' class="title">{{title}}</view>
</view>
</view>
</view>
</template>
<script>
export default{
name:"keyBoard",
props:{
title:{
default:'确认',
type:String
},
btnColor:{
default:'green',
}
},
data(){
return {
money:'',
Cdel:'',
Time:''
}
},
watch:{
money(val){
this.$emit('update:money',val);
}
},
methods : {
touchstart(){
this.Time=setInterval(()=>{
console.log(this.money);
if(this.money==''){
clearInterval();
}
this.money = this.money.substring(0,this.money.length - 1);
},200)
},
touchend(){
clearInterval(this.Time);
},
//处理按键
_handleKeyPress(e) {
console.log('点击传e',e.target.dataset.num);
let num = e.target.dataset.num;
//不同按键处理逻辑
// -1 代表无效按键,直接返回
if (num == -1) return false;
switch (String(num)) {
//小数点
case '.':
this._handleDecimalPoint();
break;
//删除键
case 'D':
this._handleDeleteKey();
break;
//清空键
case 'C':
this._handleClearKey();
break;
//确认键
case 'S':
this._handleConfirmKey();
break;
default:
this._handleNumberKey(num);
break;
}
},
//处理小数点函数
_handleDecimalPoint() {
//如果包含小数点,直接返回
if (this.money.indexOf('.') > -1) return false;
//如果小数点是第一位补0
if (!this.money.length)
this.money = '0.';
//如果不是,添加一个小数点
else
this.money = this.money + '.';
},
//处理删除键
_handleDeleteKey() {
let S = this.money;
//如果没有输入,直接返回
if (!S.length) return false;
//否则删除最后一个
this.money = S.substring(0, S.length - 1);
},
//处理清空键
_handleClearKey() {
this.money = '';
},
//处理数字
_handleNumberKey(num) {
if(this.money.length==10){
return
}
let S = this.money;
//如果有小数点且小数点位数不小于2
if ( S.indexOf('.') > -1 && S.substring(S.indexOf('.') + 1).length < 2)
this.money = S + num;
//没有小数点
if (!(S.indexOf('.') > -1)) {
//如果第一位是0只能输入小数点
if (num == 0 && S.length == 0)
this.money = '0.';
else {
if (S.length && Number(S.charAt(0)) === 0) return;
this.money = S + num;
}
}
},
//提交
_handleConfirmKey() {
let S = this.money;
//未输入
if (!S.length||S==0){
uni.showToast({
title: '请输入正确的数值',
icon:'none',
duration: 1000
});
return false;
}
//将 8. 这种转换成 8.00
if (S.indexOf('.') > -1 && S.indexOf('.') == (S.length - 1))
S = Number(S.substring(0, S.length - 1)).toFixed(2);
//保留两位
S = Number(S).toFixed(2);
this.$emit('confirmEvent',S); //提交参数
}
}
}
</script>
<style lang="less" scoped>
.cell_b{
border-right: 1px solid #d5d5d6;
border-bottom: 1px solid #d5d5d6;
}
.key-container {
width: 100%;
display: flex;
flex-direction: column;
}
.keyboard {
flex: 1;
position: fixed;
bottom: 0;
left: 0;
height: 40vh;
width: 100%;
background: #FFFFFF;
}
.keyboard .key-row {
display: flex;
display: -webkit-flex;
position: relative;
height: 10vh;
line-height: 10vh;
}
.keyboard .key-cell {
flex: 1;
-webkit-box-flex: 1;
font-size: 60upx;
display: flex;
justify-content: center;
align-items: center;
}
.keyboard .key-confirm {
position: absolute;
text-align: center;
height: 30vh;
width: 25%;
line-height: 30vh;
color: #FFFFFF;
z-index: 5;
right: 0;
bottom: 0;
display:flex;
justify-content: center;
align-items: center;
}
.keyboard .key-confirm2 {
position: absolute;
height: 10vh;
width: 25%;
line-height: 10vh;
z-index: 9999;
right: 0;
top: 0;
display: flex;
justify-content: center;
align-items: center;
}
.key-zero-and-point{
display: flex;height: 10vh;justify-content: center;align-items: center;width:75%;font-size: 60upx;
.zero{
display: flex;justify-content: center;align-items: center;width: 66.66%;font-size: 60upx;text-align: center;height: 100%;
}
.point{
display: flex;justify-content: center;align-items: center;width: 33.33%;font-size: 60upx;text-align: center;height: 100%;
}
}
.key-cell:active{
color: white;
background: black; //黑色
opacity: 0.1; //这里重要,就是通过这个透明度来设置
}
.a:active,.key-confirm2:active{
color: white;
background: black; //黑色
opacity: 0.1; //这里重要,就是通过这个透明度来设置
}
</style>

View File

@@ -1,301 +0,0 @@
<template>
<view class='keyboard' @click.stop='_handleKeyPress'>
<view class='key-row'>
<view class='key-cell cell_b' data-num='1'>1</view>
<view class='key-cell cell_b' data-num='2'>2</view>
<view class='key-cell cell_b' data-num='3'>3</view>
</view>
<view class='key-row'>
<view class='key-cell cell_b' data-num='4'>4</view>
<view class='key-cell cell_b' data-num='5'>5</view>
<view class='key-cell cell_b' data-num='6'>6</view>
</view>
<view class='key-row'>
<view class='key-cell cell_b' data-num='7'>7</view>
<view class='key-cell cell_b' data-num='8'>8</view>
<view class='key-cell cell_b' data-num='9'>9</view>
</view>
<view class='key-row'>
<view class='key-cell cell_b' data-num='.'></view>
<view class='key-cell cell_b' data-num='0'>0</view>
<view class='key-cell cell_b' data-num='D' style="background: #F9F9F9;" @touchstart="touchstart"
@touchend="touchend">
<image data-num='D' style="width: 47.49rpx; height: 25.59rpx;"
src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/user/x.png" mode="aspectFill"></image>
</view>
</view>
<!-- <view class="key-zero-and-point">
<view class="a cell_b zero" data-num='0'>0</view>
<view class="a cell_b point" data-num='.'>.</view>
</view> -->
<!-- <view class='key-confirm' :style="{'background':btnColor}" data-num='S'>
<view data-num='S' class="">
<view data-num='S' class="title">{{title}}</view>
</view>
</view> -->
</view>
</template>
<script>
export default {
name: "keyBoard",
props: {
title: {
default: '确认',
type: String
},
btnColor: {
default: 'green',
}
},
data() {
return {
money: '',
Cdel: '',
Time: ''
}
},
watch: {
money(val) {
this.$emit('update:money', val);
}
},
methods: {
touchstart() {
this.Time = setInterval(() => {
console.log(this.money);
if (this.money == '') {
clearInterval();
}
this.money = this.money.substring(0, this.money.length - 1);
}, 200)
},
touchend() {
clearInterval(this.Time);
},
//处理按键
_handleKeyPress(e) {
console.log('点击传e', e.target.dataset.num);
let num = e.target.dataset.num;
//不同按键处理逻辑
// -1 代表无效按键,直接返回
if (num == -1) return false;
switch (String(num)) {
//小数点
case '.':
// uni.showToast({
// title: '不可以设置.',
// icon: 'none'
// });
// this._handleDecimalPoint();
break;
//删除键
case 'D':
this._handleDeleteKey();
break;
//清空键
case 'C':
this._handleClearKey();
break;
//确认键
case 'S':
this._handleConfirmKey();
break;
default:
this._handleNumberKey(num);
break;
}
},
//处理小数点函数
_handleDecimalPoint() {
//如果包含小数点,直接返回
if (this.money.indexOf('.') > -1) return false;
//如果小数点是第一位补0
if (!this.money.length)
this.money = '0.';
//如果不是,添加一个小数点
else
this.money = this.money + '.';
},
//处理删除键
_handleDeleteKey() {
let S = this.money;
//如果没有输入,直接返回
if (!S.length) return false;
//否则删除最后一个
this.money = S.substring(0, S.length - 1);
},
//处理清空键
_handleClearKey() {
this.money = '';
},
//处理数字
_handleNumberKey(num) {
if (this.money.length == 6) {
return
}
let S = this.money;
//如果有小数点且小数点位数不小于2
// if (S.indexOf('.') > -1 && S.substring(S.indexOf('.') + 1).length < 2)
this.money = S + num;
//没有小数点
// if (!(S.indexOf('.') > -1)) {
// //如果第一位是0只能输入小数点
// if (num == 0 && S.length == 0)
// this.money = '0';
// else {
// if (S.length && Number(S.charAt(0)) === 0) return;
// this.money = S + num;
// }
// }
},
//提交
_handleConfirmKey() {
let S = this.money;
//未输入
if (!S.length || S == 0) {
uni.showToast({
title: '请输入正确的数值',
icon: 'none',
duration: 1000
});
return false;
}
//将 8. 这种转换成 8.00
if (S.indexOf('.') > -1 && S.indexOf('.') == (S.length - 1))
S = Number(S.substring(0, S.length - 1)).toFixed(2);
//保留两位
S = Number(S).toFixed(2);
this.$emit('confirmEvent', S); //提交参数
}
}
}
</script>
<style lang="less" scoped>
.cell_b {
border-right: 1px solid #DBDBDB;
border-bottom: 1px solid #DBDBDB;
}
.key-container {
width: 100%;
display: flex;
flex-direction: column;
}
.keyboard {
flex: 1;
position: fixed;
bottom: 0;
left: 0;
height: 32vh;
width: 100%;
z-index: 999;
border-top: 1rpx solid #DBDBDB;
padding-bottom: calc(24rpx + constant(safe-area-inset-bottom));
padding-bottom: calc(24rpx + env(safe-area-inset-bottom));
background: #FFFFFF;
}
.keyboard .key-row {
display: flex;
display: -webkit-flex;
position: relative;
height: 8vh;
line-height: 8vh;
}
.keyboard .key-cell {
flex: 1;
-webkit-box-flex: 1;
font-family: Roboto, Roboto;
font-weight: 400;
font-size: 36rpx;
color: #333333;
display: flex;
justify-content: center;
align-items: center;
}
.keyboard .key-confirm {
position: absolute;
text-align: center;
height: 30vh;
width: 25%;
line-height: 30vh;
color: #FFFFFF;
z-index: 5;
right: 0;
bottom: 0;
display: flex;
justify-content: center;
align-items: center;
}
.keyboard .key-confirm2 {
position: absolute;
height: 8vh;
width: 25%;
line-height: 8vh;
z-index: 9999;
right: 0;
top: 0;
display: flex;
justify-content: center;
align-items: center;
}
.key-zero-and-point {
display: flex;
height: 8vh;
justify-content: center;
align-items: center;
width: 75%;
font-size: 60upx;
.zero {
display: flex;
justify-content: center;
align-items: center;
width: 66.66%;
font-size: 60upx;
text-align: center;
height: 100%;
}
.point {
display: flex;
justify-content: center;
align-items: center;
width: 33.33%;
font-size: 60upx;
text-align: center;
height: 100%;
}
}
.key-cell:active {
color: white;
background: black; //黑色
opacity: 0.1; //这里重要,就是通过这个透明度来设置
}
.a:active,
.key-confirm2:active {
color: white;
background: black; //黑色
opacity: 0.1; //这里重要,就是通过这个透明度来设置
}
</style>

View File

@@ -1,181 +0,0 @@
<template>
<view class="l-barrage">
<block v-for="(item,index) in items" :key="index">
<!-- #ifdef H5 -->
<text v-if="item.display" class="aon" :style="{top: `${item.top}%`,color: item.color}">
{{item.text}}
</text>
<!-- #endif -->
<!-- #ifndef H5 -->
<!-- <text v-if="item.display" class="aon"
:style="{top: `${item.top}%`,color: item.color,
animation: `mymove ${Number(item.time)}s linear forwards`
}"
>
{{item.text}}
</text> -->
<view v-if="item.display" class="aon"
style=" display: flex;justify-content: center;align-items: center; background-color: #000; padding:10rpx; border-radius: 10rpx;"
:style="{top: `${item.top}%`,
animation: `mymove ${Number(item.time)}s linear forwards`
}">
<image style="width: 50rpx; height: 50rpx;border-radius: 50%;" :src="avatar"
mode="aspectFill"></image>
<text style="color: #fff;">
{{item.text}}
</text>
</view>
<!-- #endif -->
</block>
</view>
</template>
<script>
let cycle;
// 弹幕字体颜色
function getRandomColor() {
let rgb = []
for (let i = 0; i < 3; ++i) {
let color = Math.floor(Math.random() * 256).toString(16)
color = color.length == 1 ? '0' + color : color
rgb.push(color)
}
return '#' + rgb.join('')
}
export default {
name: 'l-barrage',
props: {
minTime: {
type: Number,
default: 4
},
maxTime: {
type: Number,
default: 9
},
minTop: {
type: Number,
default: 8
},
maxTop: {
type: Number,
default: 16
},
avatar:{
type:String,
default:'@/static/1.gif'
}
},
data() {
return {
items: [],
userInfo: uni.cache.get('userInfo'), //个人信息
}
},
methods: {
add(text = '', time = Math.ceil(Math.floor(Math.random() * (this.maxTime - this.minTime + 1) + this
.minTime))) {
this.items.push({
text,
time,
top: Math.ceil(Math.random() * (this.maxTop - this.minTop + 1) + this.minTop),
color: getRandomColor(),
display: 1,
});
},
start(items = []) {
this.items = [];
cycle && (clearInterval(cycle));
let i = 0,
len = items.length;
cycle = setInterval(() => {
let time = 5;
// #ifndef H5
time = Math.ceil(Math.floor(Math.random() * (this.maxTime - this.minTime + 1) + this.minTime));
// #endif
if (i < len) {
this.add(items[i], time);
i++;
} else {
clearInterval(cycle);
setTimeout(() => {
this.$emit("end", {});
}, time * 1000)
}
}, 500)
}
}
}
</script>
<style>
.aon {
position: fixed;
white-space: nowrap;
animation: mymove 5s linear forwards;
animation-timing-function: linear;
-webkit-animation-timing-function: linear;
animation-fill-mode: forwards;
}
.l-barrage {
z-index: 99;
width: 100%;
position: fixed;
}
@keyframes mymove {
from {
left: 100%;
}
to {
left: -200%;
}
}
@-moz-keyframes mymove
/* Firefox */
{
from {
left: 100%;
}
to {
left: -200%;
}
}
@-webkit-keyframes mymove
/* Safari and Chrome */
{
from {
left: 100%;
}
to {
left: -200%;
}
}
@-o-keyframes mymove
/* Opera */
{
from {
left: 100%;
}
to {
left: -200%;
}
}
</style>

View File

@@ -1,181 +0,0 @@
<template>
<view class="content">
<view class="contentone flex-center">
<image class="contentoneimage" src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/drder/ewm.png" mode="aspectFill"></image>
<text class="contentonetext">精选推荐</text>
</view>
<view class="contenttow flex-between">
<view class="contenttowitem" v-for="(item,index) in list" :key="index" @click="clickproduct(item)">
<image class="contenttowitemimage" :src="item.image" mode="aspectFill"></image>
<view class="contenttowitemtiter">
{{item.shopName}}|{{item.productName}}
</view>
<view class="contenttowitemone flex-between">
<view class="contenttowitemone_dingwei flex-start">
<image class="contenttowitemone_dingweiimage"
:src="item.image" mode="aspectFill"></image>
<view class="contenttowitemone_dingweinumer">
{{item.distances}}
</view>
</view>
<view class="contenttowitemone_text">
已售{{item.realSalesNumber}}
</view>
</view>
<view class="contenttowitemtow flex-start">
<view class="contenttowitemtow_one">
券后¥{{item.salePrice}}
</view>
<view class="contenttowitemtow_tow">
{{item.discount}}
</view>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {};
},
props: {
list: {
type: Array,
default () {
return []
}
},
opacity: {
type: Boolean,
default: false
},
titleshow: {
type: Boolean,
default: false
},
},
computed: {
HeighT() { //手机类型的尺寸
return this.$store.getters.is_BarHeight
},
},
methods: {
clickproduct(item) {
uni.pro.navigateTo('product/index', {
id:item.id
})
},
clicknavigateBack() {
uni.navigateBack()
}
}
};
</script>
<style scoped lang="scss">
page {
background: #F9F9F9;
}
.content {
padding: 0 32rpx;
.contentone {
.contentoneimage {
width: 32.12rpx;
height: 36.13rpx;
}
.contentonetext {
margin-left: 12rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 32rpx;
color: #000000;
}
}
.contenttow {
width: 100%;
.contenttowitem {
margin-top: 32rpx;
width: 316rpx;
background: #FFFFFF;
border-radius: 20rpx 20rpx 20rpx 20rpx;
.contenttowitemimage {
width: 100%;
height: 220rpx;
background: #FFFFFF;
border-radius: 20rpx 20rpx 0rpx 0rpx;
}
.contenttowitemtiter {
padding: 0 20rpx;
margin-top: 8rpx;
width: 100%;
height: 72rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 24rpx;
color: #000000;
}
.contenttowitemone {
padding: 0 20rpx;
.contenttowitemone_dingwei {
margin-top: 6rpx;
.contenttowitemone_dingweiimage {
width: 17.9rpx;
height: 21.65rpx;
}
.contenttowitemone_dingweinumer {
margin-left: 12rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 20rpx;
color: #666666;
}
}
.contenttowitemone_text {
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 20rpx;
color: #666666;
}
}
.contenttowitemtow {
padding: 0 20rpx 8rpx 20rpx;
.contenttowitemtow_one {
margin-top: 6rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: bold;
font-size: 28rpx;
color: #FF4C11;
}
.contenttowitemtow_tow {
margin-top: 6rpx;
margin-left: 6rpx;
padding: 2rpx 14rpx;
background: #FFFFFF;
border-radius: 8rpx 8rpx 8rpx 8rpx;
border: 2rpx solid #FF4C11;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 20rpx;
color: #FF4C11;
}
}
}
}
}
</style>

View File

@@ -1,176 +0,0 @@
<template>
<view class="content">
<!-- 导航栏 -->
<view class="navbar" :class="{active:opacity}">
<!-- #ifndef APP-PLUS || MP-WEIXIN -->
<view class="status-bar"></view>
<view class="navbar_tow flex-between"
:style="{'height':HeighT.customBar+'px','padding-right':HeighT.custwidth + 'px'}">
<!-- #endif -->
<!-- #ifdef APP-PLUS -->
<view class="status-bar"></view>
<view class="navbar_tow flex-between">
<!-- #endif -->
<!-- #ifdef MP-WEIXIN -->
<view class="navbar_tow flex-between"
:style="{'height':HeighT.customBar+'px','marginTop':HeighT.heightBar+'px','padding-right':HeighT.custwidth + 'px'}">
<!-- #endif -->
<!-- 标题搜索框 -->
<view class="flex-between">
<view class="navbar_tow_one flex-start">
<u-icon style="margin-left: 8rpx;" name="arrow-down-fill" color="#333333"
size="16"></u-icon>
</view>
<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>
</view>
</view>
</template>
<script>
export default {
data() {
return {
keyword: '',
opacity: false,
};
},
onPageScroll(e) {
if (e.scrollTop <= 44) { //搜索导航栏
this.opacity = false
} else {
this.opacity = true
}
},
computed: {
HeighT() { //手机类型的尺寸
return this.$store.getters.is_BarHeight
},
},
methods: {}
};
</script>
<style scoped lang="scss">
page {
background: #F9F9F9;
}
.content {
position: -webkit-sticky;
position: sticky;
top: 0;
.active {
background: rgba(249, 249, 249, 1);
}
.status-bar {
// #ifdef APP-PLUS
height: calc(var(--status-bar-height) / 2);
// #endif
// #ifdef MP-WEIXIN
height: var(--status-bar-height);
// #endif
}
// #ifdef APP-PLUS
.statusbarmargin {
margin-top: var(--status-bar-height);
}
// #endif
.navbar {
position: fixed;
top: 0;
width: 100%;
z-index: 99;
.navbar_tow {
width: 100%;
position: relative;
font-size: 36rpx;
.flex-between {
// #ifdef APP-PLUS || H5
margin: 28rpx;
// #endif
// #ifdef MP-WEIXIN
margin-left: 28rpx;
// #endif
width: 100%;
flex-wrap: nowrap;
height: 100%;
line-height: 100%;
.navbar_tow_one {
height: 100%;
line-height: 100%;
text:nth-child(1) {
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: bold;
font-size: 28rpx;
color: #333333;
}
text:nth-child(2) {
margin-left: 16rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 28rpx;
color: #333333;
}
}
.navbar_tow_tow {
position: relative;
height: 100%;
line-height: 100%;
flex: 1;
margin-left: 10rpx;
.navbar_tow_towview {
position: absolute;
right: 4rpx;
top: 50%;
transform: translate(0, -50%);
text-align: center;
background: #FEE06A;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 500;
font-size: 28rpx;
color: #333333;
width: 116rpx;
height: 56rpx;
line-height: 56rpx;
border-radius: 34rpx 34rpx 34rpx 34rpx;
}
.navbar_tow_towinput {
padding-left: 32rpx;
padding-right: 116rpx;
height: 100%;
flex: auto;
background: #FFFFFF;
border-radius: 34rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 28rpx;
color: #999999;
overflow: hidden; //超出的文本隐藏
text-overflow: ellipsis; //溢出用省略号显示
white-space: nowrap; //溢出不换行
}
}
}
}
}
}
</style>

View File

@@ -1,193 +0,0 @@
<template>
<view class="navbarcontent">
<!-- 导航栏 -->
<view class="navbar" :class="{active:opacity}">
<!-- #ifndef APP-PLUS || MP-WEIXIN -->
<view class="status-bar"></view>
<view class="navbar_tow flex-between"
:style="{'height':HeighT.customBar+'px','padding-right':HeighT.custwidth + 'px'}">
<!-- #endif -->
<!-- #ifdef APP-PLUS -->
<view class="navbar_tow flex-between" :style="{'marginTop':HeighT.heightBar /2+'px'}">
<!-- #endif -->
<!-- #ifdef MP-WEIXIN -->
<view class="navbar_tow flex-between"
:style="{'height':HeighT.customBar+'px','marginTop':HeighT.heightBar+'px','padding-right':HeighT.custwidth + 'px'}">
<!-- #endif -->
<!-- 标题搜索框 -->
<view class="flex-between" @click="clicknavigateBack">
<view class="navbar_tow_one flex-start" v-if="iconshow">
<u-icon name="arrow-left" :color="iconcolor" size="40"></u-icon>
</view>
<!-- #ifndef MP-WEIXIN -->
<view class="navbar_tow_tow" v-if="opacity || titleshow" :style="{color: namecolor}">
<!-- #endif -->
<!-- #ifdef MP-WEIXIN -->
<view class="navbar_tow_tow" v-if="opacity || titleshow"
:style="{'padding-left':HeighT.custwidth-14 + 'px',color: namecolor}">
<!-- #endif -->
{{title}}
</view>
</view>
</view>
</view>
<view class="" v-if="heightshow" :style="{height:Topdistance +'px'}">
</view>
</view>
</template>
<script>
export default {
data() {
return {
Topdistance: ''
};
},
props: {
title: {
type: String,
default: ''
},
namecolor: {
type: String,
default: '#333333'
},
opacity: {
type: Boolean,
default: false
},
titleshow: {//标题是否显示
type: Boolean,
default: false
},
heightshow: {//是否要占位高度
type: Boolean,
default: false
},
iconshow: {//返回键是否显示
type: Boolean,
default: true
},
iconcolor:{//返回键颜色
type: String,
default: '#000'
}
},
computed: {
HeighT() { //手机类型的尺寸
return this.$store.getters.is_BarHeight
},
},
mounted() {
this.$nextTick(() => {
this.GetTop()
});
// 当组件挂载完成后获取距离
},
methods: {
GetTop() {
this.$u.getRect('.navbar').then(res => {
this.Topdistance = res.height //滚动距离
this.$emit('Topdistance', res.height)
})
},
clicknavigateBack() {
uni.navigateBack()
}
}
};
</script>
<style scoped lang="scss">
page {
background: #F9F9F9;
}
.navbarcontent {
position: relative;
top: 0;
left: 0;
width: 100%;
z-index: 9999;
.active {
background: rgba(249, 249, 249, 1);
}
.status-bar {
// #ifdef APP-PLUS
height: calc(var(--status-bar-height) / 2);
// #endif
// #ifdef MP-WEIXIN
height: var(--status-bar-height);
// #endif
}
// #ifdef APP-PLUS
.statusbarmargin {
margin-top: var(--status-bar-height);
}
// #endif
.navbar {
position: fixed;
top: 0;
left: 0;
width: 100%;
z-index: 99;
.navbar_tow {
width: 100%;
position: relative;
font-size: 36rpx;
.flex-between {
// #ifdef APP-PLUS || H5
margin: 28rpx;
// #endif
// #ifdef MP-WEIXIN
margin-left: 28rpx;
// #endif
width: 100%;
flex-wrap: nowrap;
height: 100%;
line-height: 100%;
.navbar_tow_one {
height: 100%;
line-height: 100%;
text:nth-child(1) {
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: bold;
font-size: 28rpx;
color: #333333;
}
text:nth-child(2) {
margin-left: 16rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 28rpx;
color: #333333;
}
}
.navbar_tow_tow {
text-align: center;
flex: auto;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 28rpx;
}
}
}
}
}
</style>

View File

@@ -1,191 +0,0 @@
<template>
<view class="page">
<view>
<view class="pay-title">
<text>请输入6位支付密码</text>
</view>
<view class="pay-password" @click="onPayUp">
<view class="list">
<text v-show="passwordArr.length >= 1"></text>
</view>
<view class="list">
<text v-show="passwordArr.length >= 2"></text>
</view>
<view class="list">
<text v-show="passwordArr.length >= 3"></text>
</view>
<view class="list">
<text v-show="passwordArr.length >= 4"></text>
</view>
<view class="list">
<text v-show="passwordArr.length >= 5"></text>
</view>
<view class="list">
<text v-show="passwordArr.length >= 6"></text>
</view>
</view>
<view class="hint" @click="gopaypassword">
<text>忘记支付密码</text>
</view>
</view>
<!-- ref:唯一ref passwrdType密码样式pay keyInfo密码输入返回事件 -->
<cc-defineKeyboard ref="CodeKeyboard" passwrdType="pay" @KeyInfo="KeyInfo"></cc-defineKeyboard>
</view>
</template>
<script>
export default {
components: {
},
data() {
return {
// AffirmStatus: 1,
passwordArr: [],
oldPasswordArr: [],
newPasswordArr: [],
afPasswordArr: [],
};
},
onLoad() {
},
methods: {
// 忘记支付密码
gopaypassword() {
uni.pro.navigateTo('/pages/user/repairpassword')
},
/**
* 唤起键盘
*/
onPayUp() {
this.$refs.CodeKeyboard.show();
},
/**
* 支付键盘回调
* @param {Object} val
*/
KeyInfo(val) {
if (val.index >= 6) {
return;
}
// 判断是否输入的是删除键
if (val.keyCode === 8) {
// 删除最后一位
this.passwordArr.splice(val.index + 1, 1)
}
// 判断是否输入的是.
else if (val.keyCode == 190) {
// 输入.无效
} else {
this.passwordArr.push(val.key);
}
// uni.showModal({
// title: '温馨提示',
// content: '输入密码是 = ' + JSON.stringify(this.passwordArr)
// })
// 判断是否等于6
if (this.passwordArr.length === 6) {
// this.AffirmStatus = this.AffirmStatus + 1;
let str = ''
this.passwordArr.forEach(res => {
str += res
})
this.$emit('accountPayevent', str)
this.passwordArr = [];
}
// 判断到哪一步了
// if (this.AffirmStatus === 1) {
// this.oldPasswordArr = this.passwordArr;
// } else if (this.AffirmStatus === 2) {
// this.newPasswordArr = this.passwordArr;
// } else if (this.AffirmStatus === 3) {
// this.afPasswordArr = this.passwordArr;
// } else if (this.AffirmStatus === 4) {
// console.log(this.oldPasswordArr.join(''));
// console.log(this.newPasswordArr.join(''));
// console.log(this.afPasswordArr.join(''));
// uni.showToast({
// title: '修改成功',
// icon: 'none'
// })
// setTimeout(() => {
// uni.navigateBack();
// }, 2000)
// }
this.$forceUpdate();
}
}
}
</script>
<style scoped lang="scss">
$base: #555; // 基础颜色
.page {
position: fixed;
left: 0;
top: 0;
width: 100%;
height: 100%;
background-color: #FFFFFF;
z-index: 999;
}
.pay-title {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 200rpx;
text {
font-size: 28rpx;
color: #555555;
}
}
.pay-password {
display: flex;
align-items: center;
width: 90%;
height: 80rpx;
margin: 20rpx auto;
border: 2rpx solid $base;
.list {
display: flex;
align-items: center;
justify-content: center;
width: 16.666%;
height: 100%;
border-right: 2rpx solid #EEEEEE;
text {
font-size: 32rpx;
}
}
.list:nth-child(6) {
border-right: none;
}
}
.hint {
display: flex;
align-items: center;
justify-content: center;
width: 100%;
height: 100rpx;
text {
font-size: 28rpx;
color: $base;
}
}
</style>

View File

@@ -1,137 +0,0 @@
<template>
<picker mode="multiSelector"
:value="multiIndex"
:range="multiArray"
@change="handleValueChange"
@columnchange="handleColumnChange">
<slot></slot>
</picker>
</template>
<script>
const CHINA_REGIONS = require('./regions.json')
export default {
props:{
defaultRegions:{
type:Array,
default(){
return []
}
},
defaultRegionCode:{
type:String
},
defaultRegion:[String,Array]
},
data() {
return {
cityArr:CHINA_REGIONS[0].childs,
districtArr:CHINA_REGIONS[0].childs[0].childs,
multiIndex: [0, 0, 0],
isInitMultiArray:true,
}
},
watch:{
defaultRegion:{
handler(region,oldRegion){
if(Array.isArray(region)){
// 避免传的是字面量的时候重复触发
oldRegion = oldRegion || []
if(region.join('')!==oldRegion.join('')){
this.handleDefaultRegion(region)
}
}else if(region&&region.length == 6){
this.handleDefaultRegion(region)
}else{
console.warn('defaultRegion非有效格式')
}
},
immediate:true,
}
},
computed:{
multiArray(){
return this.pickedArr.map(arr=>arr.map(item=>item.name))
},
pickedArr(){
// 进行初始化
if(this.isInitMultiArray){
return [
CHINA_REGIONS,
CHINA_REGIONS[0].childs,
CHINA_REGIONS[0].childs[0].childs
]
}
return [CHINA_REGIONS,this.cityArr,this.districtArr];
}
},
methods: {
handleColumnChange(e){
// console.log(e);
this.isInitMultiArray = false;
const that = this;
let col = e.detail.column;
let row = e.detail.value;
that.multiIndex[col] = row;
try{
switch(col){
case 0:
if(CHINA_REGIONS[that.multiIndex[0]].childs.length==0){
that.cityArr = that.districtArr = [CHINA_REGIONS[that.multiIndex[0]]]
break;
}
that.cityArr = CHINA_REGIONS[that.multiIndex[0]].childs
that.districtArr = CHINA_REGIONS[that.multiIndex[0]].childs[that.multiIndex[1]].childs
break;
case 1:
that.districtArr = CHINA_REGIONS[that.multiIndex[0]].childs[that.multiIndex[1]].childs
break;
case 2:
break;
}
}catch(e){
// console.log(e);
that.districtArr = CHINA_REGIONS[that.multiIndex[0]].childs[0].childs
}
},
handleValueChange(e){
// 结构赋值
let [index0,index1,index2] = e.detail.value;
let [arr0,arr1,arr2] = this.pickedArr;
let address = [arr0[index0],arr1[index1],arr2[index2]];
// console.log(address);
this.$emit('getRegion',address)
},
handleDefaultRegion(region){
const isCode = !Array.isArray(region)
this.isInitMultiArray = false;
let children = CHINA_REGIONS
for(let i=0;i<3;i++){
for(let j=0;j<children.length;j++){
let condition = isCode?children[j].code==region.slice(0,(i+1)*2):children[j].name.includes(region[i]);
if(condition){
// 匹配成功进行赋值
// console.log(i,j,children.length-1);
children = children[j].childs;
if(i==0){
this.cityArr = children
}else if(i==1){
this.districtArr = children
}
this.$set(this.multiIndex,i,j)
// console.log(this.multiIndex);
break;
}else{
// 首次匹配失败就用默认的初始化
// console.log(i,j,children.length-1);
if(i==0 && j==(children.length-1)){
this.isInitMultiArray = true;
}
}
}
}
}
},
}
</script>

File diff suppressed because one or more lines are too long

View File

@@ -1,210 +0,0 @@
<template>
<view class="nav">
<view class="nav-left">
<scroll-view scroll-y>
<view class="nav-left-item" v-for="(item, index) in categoryList"
@click="categoryClickMain(item, index)" :key="index"
:style="index == categoryActive ? 'color:' + activeTextColor + ';background-color:' + activeBackgroundColor : ''">
{{ item[label] }}
</view>
</scroll-view>
</view>
<view class="nav-right" v-if="!subCategoryList.length == 0">
<scroll-view scroll-y :scroll-top="scrollTop" @scroll="scroll" @scrolltolower="loadMore"
scroll-with-animation>
<view class="nav-right-item" v-for="(item, index2) in subCategoryList" :key="index2"
@click="categoryClickSub(item)">
<view>{{ item[label] }}</view>
</view>
</scroll-view>
</view>
</view>
</template>
<script>
export default {
name: 'category',
data() {
return {
h: null,
namelang: '',
keyword: '请输入相关行业',
height: 0,
scrollTop: 0,
scrollHeight: 0,
categoryActive: 0,
activeStyle: {
color: this.activeTextColor,
backgroundColor: this.activeBackgroundColor
}
};
},
props: {
//主分类激活索引
merchant: {
type: Number,
default: 1
},
defaultActive: {
type: Number,
default: 0
},
//主分类List
categoryList: {
type: Array,
default: () => {
return null;
}
},
//侧边分类List
subCategoryList: {
type: Array,
default: () => {
return null;
}
},
activeTextColor: {
type: String,
default: '#FF981E'
},
activeBackgroundColor: {
type: String,
default: 'rgba(0,0,0,0)'
},
label: {
type: String,
default: 'name'
},
imgSrc: {
type: String,
default: 'logo'
},
//主分类点击事件
categoryMainClick: {},
//子分类点击事件
categorySubClick: {}
},
methods: {
async computed_h() {
//获取div宽度
let content_Icon = await uni.utils.info_distance('Box_top');
let content_top_box = await uni.utils.info_distance('Box_text');
let system_info = await uni.getSystemInfo();
var h_ = system_info.windowHeight + 'px';
this.h = {
height: h_
};
},
scroll(e) {
this.scrollHeight = e.detail.scrollHeight;
},
categoryClickMain(category, index) {
this.namelang = category.name
this.$emit('categoryMainClick', {
'category': category,
'index': index
});
this.categoryActive = index;
this.scrollTop = -this.scrollHeight * index;
},
loadMore(e) {
console.log(e)
this.$emit('loadMores');
},
categoryClickSub(category) {
this.$emit('categorySubClick', category);
},
searchkeyword() {
this.$emit('searchkeyword', this.keyword)
},
},
mounted() {
this.categoryActive = this.defaultActive;
this.computed_h();
// uni.getSystemInfo({
// success: res => {
// console.log(res);
// this.height = res.windowHeight;
// }
// });
},
watch: {
subCategoryList(newValue, oldValue) {}
}
};
</script>
<style scoped>
.Box_top {
padding: 32rpx 28rpx;
}
.Box_text {
background: #f1f0f5;
padding: 10rpx 28rpx;
font-size: 28rpx;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
font-weight: 400;
color: #999999;
}
.Box_texttext {
margin-left: 16rpx;
font-size: 28rpx;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
color: #333333;
}
.nav {
display: flex;
width: 100%;
}
.nav-left {
max-height: 600rpx;
width: 30%;
overflow: auto;
}
.nav-left-item {
padding: 10rpx 0;
font-size: 28rpx;
display: flex;
align-items: center;
justify-content: center;
color: #666;
}
.nav-right {
width: 70%;
max-height: 600rpx;
overflow: auto;
}
.nav-right-item {
width: 100%;
border-left: solid 1px #e0e0e0;
/* height: 100px; */
text-align: left;
padding: 24rpx 32rpx;
font-size: 13px;
}
.nav-right-item image {
width: 50px;
height: 50px;
}
.active {
color: #f24544;
}
.padding {
height: var(--status-bar-height);
width: 100%;
top: 0;
position: fixed;
background-color: #f24544;
}
</style>

File diff suppressed because it is too large Load Diff

View File

@@ -1,210 +0,0 @@
<template xlang="wxml" minapp="mpvue">
<view class="tki-qrcode">
<!-- #ifndef MP-ALIPAY -->
<canvas class="tki-qrcode-canvas" :canvas-id="cid" :style="{width:cpSize+'px',height:cpSize+'px'}" />
<!-- #endif -->
<!-- #ifdef MP-ALIPAY -->
<canvas :id="cid" :width="cpSize" :height="cpSize" class="tki-qrcode-canvas" />
<!-- #endif -->
<image v-show="show" :src="result" :style="{width:cpSize+'px',height:cpSize+'px'}" />
</view>
</template>
<script>
import QRCode from "./qrcode.js"
let qrcode
export default {
name: "tki-qrcode",
props: {
cid: {
type: String,
default: 'tki-qrcode-canvas'
},
size: {
type: Number,
default: 200
},
unit: {
type: String,
default: 'upx'
},
show: {
type: Boolean,
default: true
},
val: {
type: String,
default: ''
},
background: {
type: String,
default: '#ffffff'
},
foreground: {
type: String,
default: '#000000'
},
pdground: {
type: String,
default: '#000000'
},
icon: {
type: String,
default: ''
},
iconSize: {
type: Number,
default: 40
},
lv: {
type: Number,
default: 3
},
onval: {
type: Boolean,
default: false
},
loadMake: {
type: Boolean,
default: false
},
usingComponents: {
type: Boolean,
default: true
},
showLoading: {
type: Boolean,
default: true
},
loadingText: {
type: String,
default: '二维码生成中'
},
},
data() {
return {
result: '',
}
},
methods: {
_makeCode() {
let that = this
if (!this._empty(this.val)) {
qrcode = new QRCode({
context: that, // 上下文环境
canvasId:that.cid, // canvas-id
usingComponents: that.usingComponents, // 是否是自定义组件
showLoading: that.showLoading, // 是否显示loading
loadingText: that.loadingText, // loading文字
text: that.val, // 生成内容
size: that.cpSize, // 二维码大小
background: that.background, // 背景色
foreground: that.foreground, // 前景色
pdground: that.pdground, // 定位角点颜色
correctLevel: that.lv, // 容错级别
image: that.icon, // 二维码图标
imageSize: that.iconSize,// 二维码图标大小
cbResult: function (res) { // 生成二维码的回调
that._result(res)
},
});
} else {
uni.showToast({
title: '二维码内容不能为空',
icon: 'none',
duration: 2000
});
}
},
_clearCode() {
this._result('')
qrcode.clear()
},
_saveCode() {
let that = this;
if (this.result != "") {
uni.saveImageToPhotosAlbum({
filePath: that.result,
success: function () {
uni.showToast({
title: '二维码保存成功',
icon: 'success',
duration: 2000
});
}
});
}
},
_result(res) {
this.result = res;
this.$emit('result', res)
},
_empty(v) {
let tp = typeof v,
rt = false;
if (tp == "number" && String(v) == "") {
rt = true
} else if (tp == "undefined") {
rt = true
} else if (tp == "object") {
if (JSON.stringify(v) == "{}" || JSON.stringify(v) == "[]" || v == null) rt = true
} else if (tp == "string") {
if (v == "" || v == "undefined" || v == "null" || v == "{}" || v == "[]") rt = true
} else if (tp == "function") {
rt = false
}
return rt
}
},
watch: {
size: function (n, o) {
if (n != o && !this._empty(n)) {
this.cSize = n
if (!this._empty(this.val)) {
setTimeout(() => {
this._makeCode()
}, 100);
}
}
},
val: function (n, o) {
if (this.onval) {
if (n != o && !this._empty(n)) {
setTimeout(() => {
this._makeCode()
}, 0);
}
}
}
},
computed: {
cpSize() {
if(this.unit == "upx"){
return uni.upx2px(this.size)
}else{
return this.size
}
}
},
mounted: function () {
if (this.loadMake) {
if (!this._empty(this.val)) {
setTimeout(() => {
this._makeCode()
}, 0);
}
}
},
}
</script>
<style>
.tki-qrcode {
position: relative;
}
.tki-qrcode-canvas {
position: fixed;
top: -99999upx;
left: -99999upx;
z-index: -99999;
}
</style>

View File

@@ -1,86 +0,0 @@
<template>
<view>
<view class="scroll_box">
<swiper class="swiper" circular="true" vertical="true" display-multiple-items="4" :autoplay="autoplay"
:interval="interval" :duration="duration">
<swiper-item v-for="(item,index) in list" :key="index">
<view class="swiper-item">
<view class="line1">{{item.nickName}}</view>
<view class="line2">
<text>抽到</text>
<text class="line2-amount">{{item.value}}</text>
</view>
</view>
</swiper-item>
</swiper>
</view>
</view>
</template>
<script>
export default {
name: '',
props: {
autoplay: {
type: Boolean,
default: true
},
interval: {
type: Number,
default: 1000
},
duration: {
type: Number,
default: 1000
},
datalist: {
type: Array,
default: []
},
},
data() {
return {
list: [],
}
},
watch: {
datalist: {
immediate: true,
handler(val) {
this.list = val
}
}
}
}
</script>
<style scoped lang="scss">
.scroll_box {
background: #FFFFFF;
border-radius: 10rpx;
.swiper {
height: 400rpx;
}
}
.swiper-item::after {
content: '';
clear: both;
}
.swiper-item {
overflow: auto;
}
.swiper-item .line1 {
float: left;
}
.swiper-item .line2 {
float: right;
}
.swiper-item .line2 .line2-amount {
color: #EF4A4A;
}
</style>

View File

@@ -1,32 +1,22 @@
const debug = process.env.NODE_ENV == 'development' ? true : false;
const debug = true;
// #ifdef H5
const proxyApi = "/api"
// #endif
// #ifdef MP-WEIXIN || APP
// const proxyApi = 'http://192.168.2.42:9889/cashierService' // 王伟
// const proxyApi = 'http://192.168.2.74:9888/cashierService' // 帆哥
// const proxyApiwws = 'ws://192.168.2.74:9888/cashierService' // 测试
const proxyApi = 'https://wxcashiertest.sxczgkj.cn/cashierService' // 测试
const proxyApiwws = 'wss://wxcashiertest.sxczgkj.cn/netty' // 测试
// #endif
// #ifdef MP-WEIXIN || MP-ALIPAY
const baseUrl = 'https://cashier.sxczgkj.cn/cashierService' // 线上
const baseUrlwws = 'wss://cashier.sxczgkj.cn/cashierService' // 线上
// const baseUrl = "https://wxcashiertest.sxczgkj.cn/cashierService" //测试
// const baseUrlwws = 'wss://wxcashiertest.sxczgkj.cn/cashierService' // 测试
// #endif
// #ifdef H5
const baseUrl = debug ? proxyApi + '/cashierService' : "https://cashier.sxczgkj.cn/cashierService"
const baseUrlwws = 'ws://cashier.sxczgkj.cn/cashierService'
const baseUrl = debug ? proxyApi : 'http://192.168.2.161:9889/cashierService/' // 线上
// #endif
// #ifdef APP || MP-WEIXIN
const baseUrl = debug ? proxyApi : 'https://cashier.sxczgkj.cn/cashierService' // 线上
const baseUrlwws = debug ? proxyApiwws : 'wss://cashier.sxczgkj.cn/netty' // 线上
// const baseUrl = 'https://cashier.sxczgkj.cn/cashierService' // 线上
// const baseUrlwws = 'wss://cashier.sxczgkj.cn/netty' // 线上/
// #endif
// import VConsole from "./vConsole.js"
// if (debug) {
// new VConsole()
// // new VConsole()
// }
const version = '100'
const version = '109'
const autoRemoveCache = {
count: 100000,
size: 100000

View File

@@ -10,26 +10,26 @@ let transformRequest = obj => {
let query = ''
let name, value, fullSubName, subName, subValue, innerObj, i
for (name in obj) {
for(name in obj) {
value = obj[name]
if (value instanceof Array) {
for (i = 0; i < value.length; ++i) {
if(value instanceof Array) {
for(i = 0; i < value.length; ++i) {
subValue = value[i]
fullSubName = name + '[' + i + ']'
innerObj = {}
innerObj[fullSubName] = subValue
query += transformRequest(innerObj) + '&'
}
} else if (value instanceof Object) {
for (subName in value) {
} else if(value instanceof Object) {
for(subName in value) {
subValue = value[subName]
fullSubName = name + '[' + subName + ']'
innerObj = {}
innerObj[fullSubName] = subValue
query += transformRequest(innerObj) + '&'
}
} else if (value !== undefined && value !== null) {
} else if(value !== undefined && value !== null) {
query += encodeURIComponent(name) + '=' +
encodeURIComponent(value) + '&'
}
@@ -44,7 +44,7 @@ let timestamp = function() {
let isNavigating = false
let isNavigate = () => {
if (isNavigating) {
if(isNavigating) {
return true
} else {
isNavigating = true
@@ -62,11 +62,11 @@ let guid = (function() {
let guid = new Date().getTime().toString(32),
i
for (i = 0; i < 5; i++) {
for(i = 0; i < 5; i++) {
guid += Math.floor(Math.random() * 65535).toString(32)
}
return (prefix || '') + guid + (counter++).toString(32)
return(prefix || '') + guid + (counter++).toString(32)
}
}())
@@ -75,7 +75,7 @@ let sortTransform = (obj) => {
objKeys = objKeys.sort()
var ret = {}
for (var i = 0; i < objKeys.length; i++) {
for(var i = 0; i < objKeys.length; i++) {
let objVal = obj[objKeys[i]]
ret[objKeys[i]] = objVal
}
@@ -95,8 +95,8 @@ function isEmptyObject(v) {
return Object.keys(v).length == 0
}
function sleep(time) {
return new Promise((resolve) => setTimeout(resolve, time))
function sleep (time) {
return new Promise((resolve) => setTimeout(resolve, time))
}
const throttle = function(func, wait = 200, options) {
@@ -110,7 +110,7 @@ const throttle = function(func, wait = 200, options) {
var context, args, result
var timeout = null
var previous = 0
if (!options) options = {
if(!options) options = {
leading: true,
trailing: false
}
@@ -118,26 +118,26 @@ const throttle = function(func, wait = 200, options) {
previous = options.leading === false ? 0 : new Date().getTime()
timeout = null
result = func.apply(context, args)
if (!timeout) context = args = null
if(!timeout) context = args = null
}
return function() {
var now = new Date().getTime()
if (!previous && options.leading === false) previous = now
if(!previous && options.leading === false) previous = now
// 计算剩余时间
var remaining = wait - (now - previous)
context = this
args = arguments
// 当到达wait指定的时间间隔则调用func函数
if (remaining <= 0 || remaining > wait) {
if(remaining <= 0 || remaining > wait) {
// 由于setTimeout存在最小时间精度问题因此会存在到达wait的时间间隔但之前设置的setTimeout操作还没被执行因此为保险起见这里先清理setTimeout操作
if (timeout) {
if(timeout) {
clearTimeout(timeout)
timeout = null
}
previous = now
result = func.apply(context, args)
if (!timeout) context = args = null
} else if (!timeout && options.trailing !== false) {
if(!timeout) context = args = null
} else if(!timeout && options.trailing !== false) {
// options.trailing=true时延时执行func函数
timeout = setTimeout(later, remaining)
}
@@ -153,13 +153,13 @@ const debounce = function(func, wait, immediate) {
// 当wait指定的时间间隔期间多次调用_.debounce返回的函数则会不断更新timestamp的值导致last < wait && last >= 0一直为true从而不断启动新的计时器延时执行func
var last = new Date().getTime() - timestamp
if (last < wait && last >= 0) {
if(last < wait && last >= 0) {
timeout = setTimeout(later, wait - last)
} else {
timeout = null
if (!immediate) {
if(!immediate) {
result = func.apply(context, args)
if (!timeout) context = args = null
if(!timeout) context = args = null
}
}
}
@@ -171,8 +171,8 @@ const debounce = function(func, wait, immediate) {
// 第一次调用该方法时且immediate为true则调用func函数
var callNow = immediate && !timeout
// 在wait指定的时间间隔内首次调用该方法则启动计时器定时调用func函数
if (!timeout) timeout = setTimeout(later, wait)
if (callNow) {
if(!timeout) timeout = setTimeout(later, wait)
if(callNow) {
result = func.apply(context, args)
context = args = null
}
@@ -181,14 +181,12 @@ const debounce = function(func, wait, immediate) {
}
}
Promise.prototype.finally = function(callback) {
let P = this.constructor
return this.then(
value => P.resolve(callback()).then(() => value),
reason => P.resolve(callback()).then(() => {
throw reason
})
)
Promise.prototype.finally = function (callback) {
let P = this.constructor
return this.then(
value => P.resolve(callback()).then(() => value),
reason => P.resolve(callback()).then(() => { throw reason })
)
}
const info_distance = function(e) { //获取元素位置
return new Promise((resolve, reject) => {
@@ -206,37 +204,6 @@ const getCurrentRoute = function() {
return '/' + getCurrentPage().route
}
const pluschooseImage = function() {
// #ifdef APP
if (plus.os.name == 'Android' && plus.navigator.checkPermission('android.permission.CAMERA') ===
'undetermined') {
//未授权
uni.showModal({
title: '权限说明',
content: '便于您使用该功能上传您的照片/图片等,请您确认授权相机与相册,否则无法使用该功能',
confirmText: "去设置",
success: (res) => {
if (res.confirm) {
uni.openAppAuthorizeSetting({
success(res) {
console.log(res);
}
});
}
if (res.cancel) {
console.log('用户点击取消');
}
}
});
} else {
return true
}
// #endif
// #ifdef MP-WEIXIN
return true
// #endif
}
uni.utils = {
md5,
transformRequest,
@@ -252,6 +219,5 @@ uni.utils = {
throttle,
debounce,
getCurrentPage,
getCurrentRoute,
pluschooseImage
}
getCurrentRoute
}

View File

@@ -1,7 +1,7 @@
import {
fill
} from "lodash"
import store from "../store"
const preCacheKeyClearFetch = 'storage:clear:fetch:'
uni.pro.interceptor('request', {
@@ -44,22 +44,9 @@ function requestrequest(options) {
}
async function request(options) {
let networkType = ''
uni.getNetworkType({
success: (res) => {
networkType = res.networkType
}
});
if (networkType == 'none') {
uni.showToast({
title: '网络异常,请检查网络',
icon: 'none'
})
return false;
}
try {
if (options.toast) {
// #ifdef MP-WEIXIN || APP-PLUS
// #ifdef MP-WEIXIN || MP-ALIPAY
uni.showLoading({
title: '加载中',
mask: true
@@ -74,27 +61,14 @@ async function request(options) {
}
if (options.type == 1) {
options.header = {
version: uni.conf.version,
type: uni.getSystemInfoSync().platform,
// #ifdef APP-PLUS
environment: 'app',
// #endif
// #ifdef H5
environment: 'wx',
// #endif
// #ifdef MP-WEIXIN
environment: 'wx',
// #endif
token: uni.cache.get('token'),
openId: uni.cache.get('miniAppOpenId'),
openId: uni.cache.get('userInfo').miniAppOpenId,
id: uni.cache.get('userInfo').id,
loginName: "",
clientType: ''
}
} else {
}
// #ifdef MP-WEIXIN || APP-PLUS
// #ifdef MP-WEIXIN || MP-ALIPAY
options.url = uni.conf.baseUrl + options.url
let res = await requestrequest(options);
// #endif
@@ -102,15 +76,15 @@ async function request(options) {
let res = await uni.pro.request(options);
// #endif
if (res.code != 0) {
if (res.code == -4) {
if (res.code == 401) {
uni.showToast({
title: '',
// title: res.message || res.msg,
title: res.message || res.msg,
icon: "none",
success: () => {
setTimeout(res => {
store.dispatch("loginEvent"); //获取shapid
}, 1000)
uni.cache.clear();
uni.redirectTo({
url: '/pages/login/login'
});
}
})
} else if (res.code == 482) {
@@ -127,6 +101,7 @@ async function request(options) {
setTimeout(res => {
if (options.toast) {
// #ifdef MP-WEIXIN
uni.hideLoading()
// #endif
// #ifndef MP-WEIXIN
uni.pro.hideLoading()
@@ -136,7 +111,6 @@ async function request(options) {
}
})
}
return res
}
} else {
uni.hideLoading()

View File

@@ -4,15 +4,12 @@ import useStorage from '@/utils/useStroage.js'
import './framework/bootstrap'
import Api from "./common/js/api.js"
import Shop from "./common/js/shop.js"
import store from './store'
// #ifndef VUE3
import Vue from 'vue'
import './uni.promisify.adaptor'
Vue.config.productionTip = false
Vue.prototype.$store = store
App.mpType = 'app'
const app = new Vue({
store,
...App
})
app.$mount()

View File

@@ -1,111 +1,98 @@
{
"name" : "cashier_weapp",
"appid" : "__UNI__8092421",
"description" : "",
"versionName" : "1.0.0",
"versionCode" : "100",
"transformPx" : false,
/* 5+App */
"app-plus" : {
"usingComponents" : true,
"nvueStyleCompiler" : "uni-app",
"compilerVersion" : 3,
"splashscreen" : {
"alwaysShowBeforeRender" : true,
"waiting" : true,
"autoclose" : true,
"delay" : 0
},
/* */
"modules" : {
"Barcode" : {}
},
/* */
"distribute" : {
/* android */
"android" : {
"permissions" : [
"<uses-permission android:name=\"android.permission.CHANGE_NETWORK_STATE\"/>",
"<uses-permission android:name=\"android.permission.MOUNT_UNMOUNT_FILESYSTEMS\"/>",
"<uses-permission android:name=\"android.permission.VIBRATE\"/>",
"<uses-permission android:name=\"android.permission.READ_LOGS\"/>",
"<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>",
"<uses-feature android:name=\"android.hardware.camera.autofocus\"/>",
"<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>",
"<uses-permission android:name=\"android.permission.CAMERA\"/>",
"<uses-permission android:name=\"android.permission.GET_ACCOUNTS\"/>",
"<uses-permission android:name=\"android.permission.READ_PHONE_STATE\"/>",
"<uses-permission android:name=\"android.permission.CHANGE_WIFI_STATE\"/>",
"<uses-permission android:name=\"android.permission.WAKE_LOCK\"/>",
"<uses-permission android:name=\"android.permission.FLASHLIGHT\"/>",
"<uses-feature android:name=\"android.hardware.camera\"/>",
"<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>"
]
},
/* ios */
"ios" : {
"dSYMs" : false
},
/* SDK */
"sdkConfigs" : {
"ad" : {}
}
}
},
/* */
"quickapp" : {},
/* */
"mp-weixin" : {
"appid" : "wxd88fffa983758a30",
"setting" : {
"urlCheck" : false,
"minified" : true,
"es6" : true,
"postcss" : true
},
"usingComponents" : true,
"libVersion" : "latest",
"permission" : {
"scope.userLocation" : {
"desc" : "你的位置信息将用于小程序位置接口的效果展示"
}
},
"requiredPrivateInfos" : [ "getLocation", "onLocationChange", "chooseLocation", "chooseAddress" ]
},
"h5" : {
"devServer" : {
"https" : false,
"disableHostCheck" : false,
"proxy" : {
"/api" : {
"target" : "https://wxcashiertest.sxczgkj.cn",
// "target" : "https://ky.sxczgkj.cn",
"ws" : false,
"changeOrigin" : true, //是否跨域
"secure" : false, // 设置支持https协议的代理
"pathRewrite" : {
"^/api" : "" //需要rewrite重写的,
}
}
}
},
"template" : "template.h5.html",
"router" : {
"mode" : "history",
"base" : "/h5/"
}
},
"mp-alipay" : {
"usingComponents" : true
},
"mp-baidu" : {
"usingComponents" : true
},
"mp-toutiao" : {
"usingComponents" : true
},
"uniStatistics" : {
"enable" : false
},
"vueVersion" : "2"
}
"name": "cashier_weapp",
"appid": "__UNI__8092421",
"description": "",
"versionName": "1.0.0",
"versionCode": "100",
"transformPx": false,
/* 5+App */
"app-plus": {
"usingComponents": true,
"nvueStyleCompiler": "uni-app",
"compilerVersion": 3,
"splashscreen": {
"alwaysShowBeforeRender": true,
"waiting": true,
"autoclose": true,
"delay": 0
},
/* */
"modules": {
"Barcode": {}
},
/* */
"distribute": {
/* android */
"android": {
"permissions": [
"<uses-permission android:name=\"android.permission.CHANGE_NETWORK_STATE\"/>",
"<uses-permission android:name=\"android.permission.MOUNT_UNMOUNT_FILESYSTEMS\"/>",
"<uses-permission android:name=\"android.permission.VIBRATE\"/>",
"<uses-permission android:name=\"android.permission.READ_LOGS\"/>",
"<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>",
"<uses-feature android:name=\"android.hardware.camera.autofocus\"/>",
"<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>",
"<uses-permission android:name=\"android.permission.CAMERA\"/>",
"<uses-permission android:name=\"android.permission.GET_ACCOUNTS\"/>",
"<uses-permission android:name=\"android.permission.READ_PHONE_STATE\"/>",
"<uses-permission android:name=\"android.permission.CHANGE_WIFI_STATE\"/>",
"<uses-permission android:name=\"android.permission.WAKE_LOCK\"/>",
"<uses-permission android:name=\"android.permission.FLASHLIGHT\"/>",
"<uses-feature android:name=\"android.hardware.camera\"/>",
"<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>"
]
},
/* ios */
"ios": {},
/* SDK */
"sdkConfigs": {}
}
},
/* */
"quickapp": {},
/* */
"mp-weixin": {
"appid": "wxd88fffa983758a30",
"setting": {
"urlCheck": false
},
"usingComponents": true,
"libVersion": "latest"
},
"h5": {
"devServer": {
"https": false,
"disableHostCheck": false,
"proxy": {
"/api": {
"target": "https://p40312246f.goho.co/cashierService/",
// "target" : "https://ky.sxczgkj.cn",
"ws": false,
"changeOrigin": true, //是否跨域
"secure": false, // 设置支持https协议的代理
"pathRewrite": {
"^/api": "" //需要rewrite重写的,
}
}
}
},
"template": "template.h5.html",
"router": {
"mode": "history",
"base": "/h5/"
}
},
"mp-alipay": {
"usingComponents": true
},
"mp-baidu": {
"usingComponents": true
},
"mp-toutiao": {
"usingComponents": true
},
"uniStatistics": {
"enable": false
},
"vueVersion": "2"
}

9
package.json Normal file
View File

@@ -0,0 +1,9 @@
{
"devDependencies": {
"sass": "^1.69.5",
"sass-loader": "^13.3.2"
},
"dependencies": {
"lodash": "^4.17.21"
}
}

View File

@@ -3,90 +3,19 @@
{
"path": "pages/index/index",
"style": {
"navigationStyle": "custom",
"navigationBarTextStyle": "white"
}
},
{
"path": "pages/index/jtoday",
"style": {
"navigationBarTitleText": "每日上新",
"navigationStyle": "custom"
}
},
{
"path": "pages/index/freedaily",
"style": {
"navigationBarTitleText": "每日免单",
"navigationStyle": "custom"
}
},
{
"path": "pages/index/tothestore",
"style": {
"navigationBarTitleText": "预约到店",
"navigationStyle": "custom"
}
},
{
"path": "pages/index/coupons/index",
"style": {
"navigationBarTitleText": "红包中心"
}
},
{
"path": "pages/index/drinks",
"style": {
"navigationBarTitleText": "咖啡饮品",
"navigationStyle": "custom"
}
},
{
"path": "pages/index/hotlist",
"style": {
"navigationBarTitleText": "热榜推荐",
"navigationStyle": "custom"
}
},
{
"path": "pages/index/uindexlist",
"style": {
"navigationBarTitleText": "选择城市"
}
},
{
"path": "pages/product/index",
"style": {
"navigationBarTitleText": "商品详情",
"navigationStyle": "custom"
}
},
{
"path": "pages/product/generalstore",
"style": {
"navigationBarTitleText": "通用门店"
}
},
{
"path": "pages/login/login",
"style": {
"navigationBarTitleText": "登录",
"enablePullDownRefresh": false,
"disableScroll": true
}
},
{
"path": "pages/login/register",
"style": {
"navigationBarTitleText": "注册"
"navigationBarTitleText": "用户授权"
}
},
{
"path": "pages/order/order",
"style": {
"navigationBarTitleText": "订单列表",
"navigationBarBackgroundColor": "#FFD158",
"navigationBarTextStyle": "white"
"navigationBarTitleText": "订单列表"
}
},
{
@@ -95,19 +24,6 @@
"navigationBarTitleText": "订单详情"
}
},
{
"path": "pages/order_detail/indexs",
"style": {
"navigationBarTitleText": "订单详情"
}
},
{
"path": "pages/order/successful",
"style": {
"navigationBarTitleText": "支付成功",
"navigationStyle": "custom"
}
},
{
"path": "pages/member/index",
"style": {
@@ -115,11 +31,6 @@
}
},
{
"path": "pages/member/list",
"style": {
"navigationBarTitleText": "会员列表"
}
}, {
"path": "pages/make/make",
"style": {
"navigationBarTitleText": "在线预定"
@@ -128,16 +39,7 @@
{
"path": "pages/user/user",
"style": {
"navigationBarTitleText": "个人中心",
"navigationBarBackgroundColor": "#FFD158",
"navigationStyle": "custom"
}
}, {
"path": "pages/user/repairpassword",
"style": {
"navigationBarTitleText": "设置安全密码",
"navigationBarBackgroundColor": "#ffffff",
"navigationBarTextStyle": "black"
"navigationBarTitleText": "个人中心"
}
},
{
@@ -159,20 +61,6 @@
"navigationBarTextStyle": "white"
}
},
{
"path": "pages/order_food/goodsList_scroll",
"style": {
"navigationStyle": "custom",
"navigationBarTextStyle": "white"
}
},
{
"path": "pages/order_food/goodsList_swiper",
"style": {
"navigationStyle": "custom",
"navigationBarTextStyle": "white"
}
},
{
"path": "pages/make/list",
"style": {
@@ -182,117 +70,13 @@
{
"path": "pages/user/coupon",
"style": {
"navigationBarTitleText": "优惠"
}
},
{
"path": "pages/user/information",
"style": {
"navigationBarTitleText": "完善信息",
"navigationStyle": "custom"
}
},
// {
// "path": "pages/user/shop/index",
// "style": {
// "navigationBarTitleText": "积分商城",
// "navigationStyle": "custom",
// "navigationBarTextStyle": "black"
// }
// },
// {
// "path": "pages/user/shop/detail",
// "style": {
// "navigationBarTitleText": "积分明细",
// "navigationStyle": "custom",
// "navigationBarTextStyle": "black"
// }
// },
// {
// "path": "pages/user/shop/shopinfo",
// "style": {
// "navigationBarTitleText": "商品详情",
// "navigationBarTextStyle": "black"
// }
// },
{
"path": "pages/chooseasong/index",
"style": {
"navigationBarTitleText": "歌曲列表",
"navigationBarTextStyle": "white",
"navigationStyle": "custom"
}
},
{
"path": "pages/chooseasong/record",
"style": {
"navigationBarTitleText": "点单记录",
"navigationBarTextStyle": "white",
"navigationStyle": "custom"
}
},
{
"path": "pages/user/address/index",
"style": {
"navigationBarTitleText": "地址列表",
"navigationBarTextStyle": "black"
}
},
{
"path": "pages/user/address/edit",
"style": {
"navigationBarTitleText": "添加地址",
"navigationBarTextStyle": "black"
}
},
{
"path": "pages/user/shop/confirm",
"style": {
"navigationBarTitleText": "确认订单",
"navigationBarTextStyle": "black"
}
},
{
"path": "pages/group_order/order_groupdetail",
"style": {
"navigationBarTitleText": "订单详情"
}
},
{
"path": "pages/product/placeOrder",
"style": {
"navigationBarTitleText": "提交订单"
}
},
{
"path": "pages/group_order/refund",
"style": {
"navigationBarTitleText": "订单详情"
}
},
{
"path": "pages/member/memberdetails",
"style": {
"navigationBarTitleText": "会员卡"
}
},
{
"path": "pages/member/billDetails",
"style": {
"navigationBarTitleText": "账单明细"
}
},
{
"path" : "pages/member/activatedmemberone",
"style" :
{
"navigationBarTitleText" : "会员卡"
"navigationBarTitleText": "我的优惠"
}
}
],
"globalStyle": {
"navigationBarTextStyle": "black",
"navigationBarTitleText": "零点八零",
"navigationBarTitleText": "银收客",
"navigationBarBackgroundColor": "#ffffff",
"backgroundColor": "#F2F2F2"
},
@@ -314,6 +98,12 @@
"pagePath": "pages/order/order",
"text": "订单"
},
{
"iconPath": "static/tabbar/3.png",
"selectedIconPath": "static/tabbar/3-1.png",
"pagePath": "pages/make/make",
"text": "预约"
},
{
"iconPath": "static/tabbar/4.png",
"selectedIconPath": "static/tabbar/4-1.png",

View File

@@ -1,639 +0,0 @@
<template>
<view class="content">
<!-- 占位符导航栏 -->
<navseat :opacity='false' :title='"歌曲列表"' :titleshow='true' :heightshow='true' :namecolor='"#fff"'
:iconshow='false'></navseat>
<view class="search flex-between">
<view class="searchinput flex-between">
<input type="text" class="searchinput_input" placeholder-style="color:#FFFFFF" @input="onInput"
v-model="keyWord" placeholder="搜索" />
<u-icon name="search" @click="init_fn" color="#fff" size="48"></u-icon>
</view>
</view>
<scroll-view scroll-y="true" id="demo" style="width:100%;" :style="{'height':Height}" @scroll="handleScroll"
show-scrollbar="false" @scrolltolower="lower">
<view class="contentclass">
<view class="contentclassbox">
<view class="contentclassboxitem flex-between" v-for="(item,index) in list" :key="index">
<view class="contentclassboxleft flex-start">
<view class="onecontentclassboxleft flex-colum-start">
<text class="onecontentclassboxleft_one">{{item.name}}</text>
<text class="onecontentclassboxleft_tow">{{item.originSinger}}</text>
</view>
</view>
<view class="contentclassboxright" @click="clicshowpopupk(item)">
点歌
</view>
</view>
</view>
<!-- <image style="margin:100rpx auto 32rpx auto;"
src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/chooseasong/nomore.png" v-if="is_end"
mode="aspectFill"></image> -->
<u-loadmore :status="form.status" loadmore-text="上滑加载更多" @loadmore="loadmorelang" fontSize="28"
color="#999" iconSize="28" />
</view>
</scroll-view>
<view class="positionfixed">
<view class="positionfixedimage flex-colum">
<image class="positionfixedimage_image"
:src="songimg?songimg:'https://czg-qr-order.oss-cn-beijing.aliyuncs.com/chooseasong/mei.png'"
mode="aspectFill">
</image>
</view>
<view class="positionfixedbox flex-between">
<view class="positionfixedbox_item flex-colum">
<image src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/chooseasong/yue.png" mode="aspectFill">
</image>
<view class="positionfixedbox_itemtexto">
<u-notice-bar style="width: 100rpx;" :text="songName" :iconshow='false'
color='rgba(255, 255, 255, 0.73)' speed='40' fontSize='24'
bgColor='transparent'></u-notice-bar>
<!-- <text class="">{{songName || '暂无人点歌,快来...'}}</text> -->
</view>
</view>
<view class="positionfixedbox_item flex-colum" @click="clickrecord">
<image src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/chooseasong/yidian.png"
mode="aspectFill"></image>
<text>已点</text>
</view>
</view>
</view>
<u-popup :show="showpopup" @close="showpopup = false" mode="center" :round="24" bgColor="transparent">
<view class="contentu-popup">
<view class="contentuPopupOne">
点歌
</view>
<view class="contentuPopupitem flex-between">
<view class="contentuPopupitemone">
点歌人昵称
</view>
<view class="contentuPopupiteminput">
<input type="text" v-model="fromName" placeholder="您的称呼" />
</view>
</view>
<view class="contentuPopupitem flex-between">
<view class="contentuPopupitemone">
你想点给谁
</view>
<view class="contentuPopupiteminput">
<input type="text" v-model="toName" placeholder="TA的称呼" />
</view>
</view>
<view class="contentuPopupitem flex-between">
<view class="contentuPopupitemone">
您的祝福语
</view>
<view class="contentuPopupiteminput">
<input type="text" v-model="note" placeholder=" " />
</view>
<!-- <view class="contentuPopupiteminput">
<u--textarea style="font-size: 24rpx;" v-model="note" placeholder=" "></u--textarea>
</view> -->
</view>
<view class="contentupopupboutton flex-between">
<view class="contentupopupbouttonO" @click="showpopup = false">
取消
</view>
<view class="contentupopupbouttonT" @tap="$u.debounce(clickervicesongpost, 500)">
立刻支付
</view>
</view>
</view>
</u-popup>
</view>
</template>
<script>
import navseat from '@/components/navseat.vue'
import _ from 'lodash'
export default {
components: {
navseat
},
data() {
return {
Height: '',
songId: '',
fromName: '',
toName: '',
note: '',
showpopup: false,
list: [],
is_end: false,
keyWord: '',
form: {
page: 1,
size: 12,
status: 'loadmore',
},
shopId: "11",
songName: '', //正在播放歌曲名字
songimg: '',
timer: null //定时器
};
},
onLoad(e) {
// 隐藏首页按钮
if (e.q) {
this.shopId = this.getQueryString(decodeURIComponent(e.q), 'shopId')
}
uni.hideHomeButton();
},
computed: {},
mounted() {},
onShow() {
if (!uni.cache.get('miniAppOpenId')) {
uni.login({
provider: 'weixin',
success: async (data) => {
try {
let res = await this.api.businessopenId({
code: data.code, //临时登录凭证
})
if (res.code == 0) {
console.log(res)
uni.cache.set('miniAppOpenId', res.data)
this.init_fn()
// uni.cache.set('userInfo', res.data.userInfo);
}
} catch (e) {}
}
});
} else {
this.init_fn()
}
this.createTimer() //单独每20秒请求一次
},
onUnload() {
clearInterval(this.timer)
},
onHide() {
clearInterval(this.timer)
},
// onReachBottom() {
// this.cashierService()
// },
mounted() {
setTimeout(() => {
this.GetTop()
}, 200)
},
methods: {
handleScroll(e) {
console.log(e.detail.scrollTop)
},
lower() {
console.log('触底加载')
this.cashierService()
},
createTimer() {
this.timer = setInterval(() => {
this.apisongsinging()
}, 20000)
},
async apisongsinging() { //查看现在是否有人点歌
let {
data
} = await this.api.songsinging()
console.log(data)
this.songName = data.songName ? data.songName : '暂无人点歌,快来...'
this.songimg = data.img
},
getQueryString(url, name) { //解码
var reg = new RegExp('(^|&|/?)' + name + '=([^&|/?]*)(&|/?|$)', 'i')
var r = url.substr(1).match(reg)
if (r != null) {
return r[2]
}
return null;
},
onInput(e) {
this.handleClick();
},
handleClick: _.debounce(function() {
this.init_fn();
// 函数执行内容
}, 600),
init_fn() {
this.list = []
this.is_end = false
this.form.page = 1
this.form.size = 12
this.form.status = 'loadmore'
this.cashierService()
this.apisongsinging()
},
// 列表
async cashierService() {
let res = await this.api.cashierServicesong({
keyWord: this.keyWord,
size: this.form.size,
page: this.form.page,
shopId: this.shopId,
})
if (res.data.pages < this.form.page) {
this.form.status = 'nomore'
if (this.form.page == 1 && res.data.list.length == 0) {
this.list = []
this.is_end = true
}
return false;
} else {
this.form.status = 'loading';
this.form.page = ++this.form.page;
setTimeout(() => {
if (this.form.page == 1) {
this.list = res.data.list
} else {
this.list = [...this.list, ...res.data.list];
}
if (this.form.page > res.data.pages) {
this.form.status = 'nomore';
} else {
this.form.status = 'loading';
}
}, 1000)
}
},
// 唤起弹框
clicshowpopupk(item) {
this.fromName = ''
this.toName = ''
this.note = ''
this.showpopup = true
this.songId = item.id
},
async clickervicesongpost(item) {
let res = await this.api.cashierServicesongpost({
songId: this.songId,
fromName: this.fromName,
toName: this.toName,
note: this.note,
shopId: this.shopId,
})
if (res.code == 0) {
uni.showLoading({
title: '加载中',
mask: true
})
// #ifdef MP-WEIXIN
uni.requestPayment({
provider: 'wxpay', //支付类型-固定值
partnerid: res.data.appId, // 微信支付商户号
timeStamp: res.data.timeStamp, // 时间戳(单位:秒)
nonceStr: res.data.nonceStr, // 随机字符串
package: res.data.package, // 固定值
signType: res.data.signType, //固定值
paySign: res.data.paySign, //签名
success: (res) => {
this.showpopup = false
uni.showToast({
title: "支付成功"
})
setTimeout(res => {
uni.hideLoading()
uni.navigateTo({
url: '/pages/chooseasong/record?shopId=' + this.shopId
})
// uni.switchTab({
// url: '/pages/order/order'
// });
}, 1000)
},
fail: (err) => {
uni.showToast({
icon: 'none',
title: '支付失败'
})
setTimeout(res => {
this.showpopup = false
uni.hideLoading()
// uni.switchTab({
// url: '/pages/order/order'
// });
}, 500)
}
});
// #endif
}
},
//获取元素距离顶部的距离
GetTop() {
uni.getSystemInfo({
success: (data) => {
console.log(data)
var screenHeight = data.safeArea.height
let query = uni.createSelectorQuery().in(this);
query.select('#demo').boundingClientRect(res => {
console.log(res)
this.Height = screenHeight - res.top - 10 + 'px'
}).exec();
this.$u.getRect('.contentclass').then(res => {
console.log(res, 111)
// this.Height = screenHeight - res.top + 'px'
// console.log(this.Height)
})
}
})
},
clickrecord() {
uni.navigateTo({
url: '/pages/chooseasong/record?shopId=' + this.shopId
})
}
}
};
</script>
<style lang="scss">
// page {
// }
:deep(.u-notice__left-icon) {
display: none;
}
.content {
width: 100%;
height: 100vh;
background: url(https://czg-qr-order.oss-cn-beijing.aliyuncs.com/chooseasong/background.png);
background-size: 100% 100%;
.search {
width: 100%;
padding: 12rpx 28rpx;
.searchinput {
padding: 0rpx 32rpx;
width: 100%;
height: 70rpx;
background: rgba(255, 255, 255, 0.3);
border-radius: 36rpx 36rpx 36rpx 36rpx;
.searchinput_input {
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 28rpx;
color: #FFFFFF;
flex: auto;
}
.searchinputu-icon {
background: #000;
padding: 10rpx 24rpx;
background: #333333;
border-radius: 24rpx 24rpx 24rpx 24rpx;
}
}
.searchimage {
margin-left: 40rpx;
width: 45.25rpx;
height: 50.12rpx;
}
}
.contentclass {
padding: 0rpx 28rpx 215rpx 28rpx;
overflow: auto;
.contentclassbox {
width: 100%;
padding: 12rpx 24rpx;
// background: #FFFFFF;
.contentclassboxitem {
margin-top: 32rpx;
.contentclassboxleft {
.contentclassboxleftimage {
width: 92rpx;
height: 92rpx;
border-radius: 16rpx;
}
.onecontentclassboxleft {
margin-left: 16rpx;
.onecontentclassboxleft_one {
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 32rpx;
color: #FFFFFF;
}
.onecontentclassboxleft_tow {
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 26rpx;
color: rgba(255, 255, 255, 0.5);
}
}
}
.contentclassboxright {
padding: 8rpx 24rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 26rpx;
color: #FFF6FF;
border-radius: 28rpx 28rpx 28rpx 28rpx;
border: 2rpx solid #FCF4FF;
}
}
}
}
.positionfixed {
position: fixed;
width: 95%;
height: 166rpx;
bottom: 0;
left: 50%;
padding: 0 16rpx;
transform: translate(-50%, 0);
border-radius: 80rpx 80rpx 0 0;
background: rgba(129, 125, 207, 0.2);
backdrop-filter: blur(20px);
// .positionfixedimage::before {
// content: "";
// position: absolute;
// width: 50px;
// height: 50px;
// top: 100rpx;
// left: -50px;
// background: radial-gradient(circle at 0 0, transparent 50px, rgba(129, 125, 207, 0.2) 50px);
// backdrop-filter: blur(20px);
// }
// .positionfixedimage::after {
// content: "";
// width: 180%;
// height: 100%;
// position: absolute;
// left: 50%;
// transform: translate(-50%, 0);
// top: 0;
// z-index: -1;
// content: '';
// border-radius: 0 0 50% 50%; //顶部圆弧,底部圆弧: 0 0 50% 50%
// background: #000000;
// }
.positionfixedimage {
position: absolute;
top: -70rpx;
left: 50%;
transform: translate(-50%, 0);
width: 160rpx;
height: 160rpx;
border-radius: 50%;
background: #000000;
z-index: 9;
.positionfixedimage_image {
width: 120rpx;
height: 120rpx;
border-radius: 50%;
animation: rotate 5s linear infinite;
}
@keyframes rotate {
from {
transform: rotate(0deg);
/* 动画开始时旋转0度 */
}
to {
transform: rotate(360deg);
/* 动画结束时旋转360度 */
}
}
}
.positionfixedbox {
padding: 44rpx 74rpx 42rpx 74rpx;
.positionfixedbox_item {
image {
width: 40rpx;
height: 40rpx;
}
text {
margin-top: 10rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 24rpx;
color: #FFFFFF;
}
.positionfixedbox_itemtexto {
width: 100rpx;
padding: 0 0;
overflow: hidden; //超出的文本隐藏
text-overflow: ellipsis; //溢出用省略号显示
white-space: nowrap; //溢出不换行
// animation: aniMove 5s linear infinite;
}
@keyframes aniMove {
0% {
transform: translateX(50%);
}
100% {
transform: translateX(-50%);
}
}
}
}
}
.contentu-popup {
width: 694rpx;
padding: 32rpx 24rpx 32rpx 24rpx;
border-radius: 24rpx;
background: rgba(129, 125, 207, 0.2);
backdrop-filter: blur(20px);
.contentuPopupOne {
width: 100%;
text-align: center;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 32rpx;
color: #fff;
}
.contentuPopupitem {
margin-top: 32rpx;
.contentuPopupitemone {
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 28rpx;
color: #FFFFFF;
}
.contentuPopupiteminput {
margin-left: 16rpx;
flex: auto;
padding-bottom: 8rpx;
border-bottom: 2rpx solid rgba(255, 255, 255, 0.5);
input {
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 24rpx;
color: rgba(255, 255, 255, 0.5);
}
}
}
.contentupopupboutton {
padding: 50rpx 70rpx 0 70rpx;
.contentupopupbouttonO {
width: 196rpx;
height: 56rpx;
line-height: 56rpx;
background: #FFFFFF;
border-radius: 16rpx 16rpx 16rpx 16rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 28rpx;
color: #333333;
text-align: center;
}
.contentupopupbouttonT {
width: 196rpx;
height: 56rpx;
background: linear-gradient(180deg, #8864EB 0%, #B349CC 100%);
border-radius: 16rpx 16rpx 16rpx 16rpx;
line-height: 56rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 28rpx;
color: #FFFFFF;
text-align: center;
}
}
}
}
</style>

View File

@@ -1,264 +0,0 @@
<template>
<view class="">
<!-- 占位符导航栏 -->
<navseat :opacity='false' :title='"点单记录"' :titleshow='true' :heightshow='true' :namecolor='"#fff"'
iconcolor="#fff" @Topdistance='Topdistance'>
</navseat>
<view class="content" :style="{'height':Height}">
<scroll-view scroll-y="true" style="width:100%;" :style="{'height':Height}" show-scrollbar="false"
@scrolltolower="lower">
<view class="scrollview" :style="{'height':Height}">
<view class="contentbox" v-for="(item,index) in list" :key="index">
<view class="contentboxtop flex-between">
<text class="contentboxtopname">{{item.name}}</text>
<text v-if="item.state == '-1'" class="contentboxtopname_weizhifu">未支付</text>
<text v-if="item.state == '0'">已取消</text>
<view class="contentboxtopone" v-if="item.state == '1'">
<text class="contentboxtopone_one">前面还有{{item.preCount}}</text>
<text class="contentboxtopone_tow">已支付</text>
</view>
<text class="contentboxtopnametow" v-if="item.state == '2'">演唱中</text>
<text class="contentboxtopnametowthere" v-if="item.state == '3'">已演唱</text>
</view>
<view class="contentboxtopO">
¥{{item.price}}
</view>
<view class="contentboxtopT">
下单时间{{$u.timeFormat(item.create_time,'yyyy-mm-dd hh:MM') || '无'}}
</view>
<image class="contentboxafter" src="" mode=""></image>
</view>
<!-- <image style="margin:100rpx auto 32rpx auto;"
src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/chooseasong/nomore.png" v-if="is_end"
mode="aspectFill"></image> -->
<view style="padding: 32rpx 0;">
<u-loadmore :status="form.status" fontSize="28" color="#999" iconSize="28" />
</view>
</view>
</scroll-view>
</view>
</view>
</template>
<script>
import navseat from '@/components/navseat.vue'
export default {
components: {
navseat
},
data() {
return {
Height: '',
list: [],
is_end: false,
form: {
page: 1,
size: 10,
status: 'loadmore',
},
shopId: '10'
};
},
onLoad(e) {
this.shopId = e.shopId
},
mounted() {
setTimeout(() => {
// this.Topdistance()
}, 500)
},
onShow() {
this.cashierService()
},
methods: {
Topdistance(res) {
// console.log(res,111)
var resdata = res
uni.getSystemInfo({
success: (data) => {
console.log(data)
this.Height = data.screenHeight - 32 - resdata + 'px'
// console.log(this.Height)
// console.log(this.Height)
}
})
},
lower() {
console.log('触底加载')
this.cashierService()
},
async cashierService() {
let res = await this.api.cashierServicerecord({
size: this.form.size,
page: this.form.page,
state: '', //-1 未支付 0 已取消 1 已支付 2 演唱中 3 已演唱
shopId: this.shopId
})
if (res.data.pages < this.form.page) {
this.form.status = 'nomore'
if (this.form.page == 1 && res.data.list.length == 0) {
this.list = []
this.is_end = true
}
return false;
} else {
this.form.status = 'loading';
this.form.page = ++this.form.page;
setTimeout(() => {
if (this.form.page == 1) {
this.list = res.data.list
} else {
this.list = [...this.list, ...res.data.list];
}
this.form.status = 'loading';
if (this.form.page > res.data.pages) {
this.form.status = 'nomore';
} else {
this.form.status = 'loading';
}
}, 500)
}
},
//获取元素距离顶部的距离
GetTop() {
uni.getSystemInfo({
success: (data) => {
console.log(data)
this.$u.getRect('.content').then(res => {
console.log(res, 111)
this.Height = data.safeArea.height - 32 + 'px'
// console.log(this.Height)
})
// console.log(this.Height)
}
})
},
}
};
</script>
<style lang="scss">
page {
width: 100%;
height: 100%;
background: url(https://czg-qr-order.oss-cn-beijing.aliyuncs.com/chooseasong/background.png);
background-size: 100% 100%;
}
.content {
position: relative;
z-index: 99;
padding: 32rpx 28rpx 0rpx 28rpx;
overflow: auto;
.scrollview {
overflow: auto;
.contentbox:nth-child(1) {
margin-top: 0;
}
.contentbox {
position: relative;
margin-top: 48rpx;
width: 100%;
background: rgba(129, 125, 207, 0.2);
border: 2px solid #828282;
backdrop-filter: blur(20px);
border-radius: 24rpx 24rpx 24rpx 24rpx;
.contentboxafter {
position: absolute;
bottom: 0;
width: 482rpx;
height: 14rpx;
background: url(https://czg-qr-order.oss-cn-beijing.aliyuncs.com/chooseasong/dibuyin.png);
background-size: 100% 100%;
left: 50%;
transform: translate(-50%, 0);
}
.contentboxtop {
padding: 16rpx 24rpx;
border-bottom: 2rpx solid #F6F6F6;
.contentboxtopname {
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 500;
font-size: 32rpx;
color: #fff;
}
.contentboxtopone {
display: flex;
justify-content: flex-start;
align-items: center;
.contentboxtopone_one {
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 24rpx;
color: #F9DDF9;
}
.contentboxtopone_tow {
margin-left: 16rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 28rpx;
color: #32AA52;
text-shadow: 0px 6px 6px rgba(50, 170, 82, 0.55);
}
}
.contentboxtopnametow {
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 500;
font-size: 28rpx;
color: #FF9C39;
text-shadow: 0px 4px 4px rgba(255, 156, 57, 0.37);
}
.contentboxtopname_weizhifu {
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 500;
font-size: 28rpx;
color: rgba(255, 255, 255, 0.5);
text-shadow: 0px 4px 4px rgba(255, 255, 255, 0.37);
}
.contentboxtopnametowthere {
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 500;
font-size: 28rpx;
color: #FFFFFF;
text-shadow: 0px 4px 4px rgba(255, 255, 255, 0.37);
}
}
.contentboxtopO {
padding: 0 24rpx;
margin-top: 10rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 28rpx;
color: #999999;
}
.contentboxtopT {
padding: 0rpx 24rpx 32rpx 24rpx;
margin-top: 16rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 24rpx;
color: #999999;
}
}
}
}
</style>

View File

@@ -1,110 +0,0 @@
<template>
<view class="Box">
<view class="fontStyle">
<image src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/drder/Meituanquan.png"
style="width: 39.46rpx;height: 40rpx;" mode=""></image>
<text>优惠券</text>
</view>
<view class="content">
{{info.expDate}}
</view>
<button v-if="info.refundAble=='1'" class="buttonStyle" @click="makephone(info.phone)">申请退款</button>
<view style="height: 2rpx;width: 100%;background-color: #EFEFEF;margin-top: 16rpx;"> </view>
<view class="rightStyle" v-for="(item,i) in info.coupons">
<text :class="[item.isRefund==1?'tdl':'' ]">
{{item.couponNo}}
</text>
<image src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/drder/QRcode.png" v-if="info.status=='unused'"
style="width: 39.46rpx;height: 40rpx;margin-right: 50rpx;" mode="" @click="openQR"></image>
<text v-else>已退款</text>
</view>
</view>
</template>
<script>
export default {
props: ['info'],
data() {
return {
}
},
methods: {
makephone(e) {
uni.makePhoneCall({
phoneNumber: e
});
// uni.pro.navigateTo('group_order/refund',{})
},
openQR() {
this.$emit('clickEvent')
}
}
}
</script>
<style lang="less" scoped>
.Box {
width: 750rpx;
background: #FFFFFF;
border-radius: 16rpx 16rpx 16rpx 16rpx;
padding: 32rpx 64rpx;
margin-top: 32rpx;
position: relative;
.fontStyle {
.df;
>text {
font-weight: 500;
font-size: 28rpx;
color: #333333;
margin-left: 12rpx
}
}
.content {
font-weight: 400;
font-size: 24rpx;
color: #999999;
margin-top: 16rpx;
}
.buttonStyle {
position: absolute;
right: 58rpx;
top: 56rpx;
width: 180rpx;
height: 70rpx;
line-height: 70rpx;
background: #FFFFFF;
border-radius: 10rpx 10rpx 10rpx 10rpx;
border: 2rpx solid #E8E8E8;
font-size: 28rpx;
color: #000;
}
.rightStyle {
.df(space-between);
margin-top: 16rpx;
font-weight: bold;
font-size: 28rpx;
color: #333333;
}
}
.ml-20 {
margin-left: 20rpx;
}
.df(@start: flex-start, @position: center) {
display: flex;
justify-content: @start;
align-items: @position;
}
.tdl {
color: #999;
text-decoration: line-through
}
</style>

View File

@@ -1,103 +0,0 @@
<template>
<view class="Box">
<view class="fontStyle">
<image src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/drder/shangdian.png"
style="width: 40rpx;height: 36.44rpx;" mode=""></image>
<text>商家信息</text>
</view>
<view class="content">
{{info.shopName}}
</view>
<view class="addreeStyle">
<image src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/drder/dingwei.png"
style="width: 17.9rpx;height: 22rpx;margin-right: 6rpx;" mode=""></image>{{info.distances}} |
{{info.address}}
</view>
<view class="rightStyle">
<image src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/drder/dianhua.png" @click="makephone(info.phone)"
style="width: 39.46rpx;height: 40rpx;margin-right: 50rpx;" mode=""></image>
</view>
</view>
</template>
<script>
export default {
props: ['info'],
data() {
return {
}
},
methods: {
makephone(e) {
uni.makePhoneCall({
phoneNumber: e
});
}
}
}
</script>
<style lang="less" scoped>
.Box {
width: 750rpx;
background: #FFFFFF;
border-radius: 16rpx 16rpx 16rpx 16rpx;
padding: 32rpx 64rpx;
margin-top: 32rpx;
position: relative;
.fontStyle {
.df;
>text {
font-weight: 500;
font-size: 28rpx;
color: #333333;
margin-left: 12rpx
}
}
.content {
font-weight: 400;
font-size: 28rpx;
color: #333333;
margin-top: 32rpx;
}
.buttonStyle {
width: 158rpx;
height: 56rpx;
background: #FFFFFF;
border-radius: 10rpx 10rpx 10rpx 10rpx;
border: 2rpx solid #E8E8E8;
position: absolute;
right: 58rpx;
top: 56rpx;
}
.addreeStyle {
font-weight: 400;
font-size: 24rpx;
color: #999999;
margin-top: 22rpx;
.df;
}
.rightStyle {
position: absolute;
right: 30rpx;
top: 126rpx;
}
}
.ml-20 {
margin-left: 20rpx;
}
.df(@start: flex-start, @position: center) {
display: flex;
justify-content: @start;
align-items: @position;
}
</style>

View File

@@ -1,127 +0,0 @@
<template>
<view class="Box">
<view class="fontStyle">
<image src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/drder/sfmoney.png"
style="width: 28.29rpx;height: 31.93rpx;" mode=""></image>
<text>订单信息</text>
</view>
<view class="content">
<view>
<text></text> <text></text> <text>:</text>
</view>
<text>{{info.orderNo}}</text>
</view>
<view class="content">
<view>
<text></text> <text></text> <text>:</text>
</view>
<text>{{info.phone}}</text>
</view>
<view class="content">
<view>
<text></text> <text></text> <text></text> <text>:</text>
</view>
<text>{{info.payTime==null?'':info.payTime}}</text>
</view>
<view class="content">
<view>
<text></text> <text>:</text>
</view>
<text>{{info.number}}</text>
</view>
<view class="content">
<view>
<text></text> <text>:</text>
</view>
<text>{{info.orderAmount}}</text>
</view>
<view class="content">
<view>
<text></text> <text></text> <text></text> <text>:</text>
</view>
<text style="color: #FF4C11;">{{info.saveAmount}}</text>
</view>
<view class="content">
<view>
<text></text><text></text> <text>:</text>
</view>
<text>{{info.payAmount}}</text>
</view>
</view>
</template>
<script>
export default {
props: ['info'],
data() {
return {}
},
methods: {
}
}
</script>
<style lang="less" scoped>
.Box {
width: 750rpx;
background: #FFFFFF;
border-radius: 16rpx 16rpx 16rpx 16rpx;
padding: 32rpx 64rpx;
margin-top: 32rpx;
position: relative;
.fontStyle {
.df;
>text {
font-weight: 500;
font-size: 28rpx;
color: #333333;
margin-left: 12rpx
}
}
.content {
.df(flex-start, stretch);
margin-top: 16rpx;
margin-left: 40rpx;
>view {
>text {
font-weight: 400;
font-size: 24rpx;
color: #666666;
}
font-weight: 400;
font-size: 24rpx;
color: #666666;
margin-right: 50rpx;
width: 120rpx;
.df(space-between)
}
>text {
font-weight: 400;
font-size: 24rpx;
color: #333333;
}
}
}
.ml-20 {
margin-left: 20rpx;
}
.df(@start: flex-start, @position: center) {
display: flex;
justify-content: @start;
align-items: @position;
}
</style>

View File

@@ -1,130 +0,0 @@
<template>
<view class="Box">
<view class="fontStyle">
<image src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/drder/sfmoney.png"
style="width: 28.29rpx;height: 31.93rpx;" mode=""></image>
<text>实付金额</text>
<text>{{info.payAmount}}</text>
</view>
<view class="content">
<view>
<text></text> <text></text> <text>:</text>
</view>
<text>{{info.orderNo}}</text>
</view>
<view class="content">
<view>
<text></text> <text></text> <text>:</text>
</view>
<text>{{info.phone}}</text>
</view>
<view class="content">
<view>
<text></text> <text></text> <text></text> <text>:</text>
</view>
<text>{{info.payTime}}</text>
</view>
<view class="content">
<view>
<text></text> <text>:</text>
</view>
<text>{{info.number}}</text>
</view>
<view class="content">
<view>
<text></text> <text>:</text>
</view>
<text>{{info.orderAmount}}</text>
</view>
<view class="content">
<view>
<text></text> <text>:</text>
</view>
<text>{{info.payAmount}}</text>
</view>
</view>
</template>
<script>
export default {
props: ['info'],
data() {
return {}
},
methods: {
}
}
</script>
<style lang="less" scoped>
.Box {
width: 750rpx;
background: #FFFFFF;
border-radius: 16rpx 16rpx 16rpx 16rpx;
padding: 32rpx 64rpx;
margin-top: 32rpx;
position: relative;
.fontStyle {
.df;
>text {
font-weight: 500;
font-size: 28rpx;
color: #333333;
margin-left: 12rpx
}
}
.content {
.df(flex-start, stretch);
margin-top: 16rpx;
margin-left: 40rpx;
>view {
>text {
font-weight: 400;
font-size: 24rpx;
color: #666666;
}
font-weight: 400;
font-size: 24rpx;
color: #666666;
margin-right: 50rpx;
width: 120rpx;
.df(space-between)
}
>text {
font-weight: 400;
font-size: 24rpx;
color: #333333;
}
}
}
.ml-20 {
margin-left: 20rpx;
}
.df(@start: flex-start, @position: center) {
display: flex;
justify-content: @start;
align-items: @position;
}
</style>

View File

@@ -1,152 +0,0 @@
<template>
<view class="Box">
<view class="fontStyle">
<image src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/drder/dengpao.png"
style="width: 33.19rpx;height: 43.92rpx;" mode=""></image>
<text>温馨提示</text>
</view>
<view class="content">
<view>
有效期:
</view>
<text>{{info.notice.dateUsed}}</text>
</view>
<view class="content">
<view>
使用时间:
</view>
<text>{{info.notice.availableTime}}</text>
</view>
<view class="content">
<view>
使用规则:
</view>
<text>{{info.notice.invoiceInfo}}</text>
</view>
<view @click="clickEvent" class="lookstyle" v-if="islook">
查看更多<u-icon name="arrow-down" color="#575B66" size="28"></u-icon>
</view>
<view class="More" v-else>
<u-parse :content="info.notice.usageRules"></u-parse>
</view>
</view>
</template>
<script>
export default {
props: ['info'],
data() {
return {
islook: true
}
},
methods: {
clickEvent() {
this.islook = false
}
}
}
</script>
<style lang="less" scoped>
.Box {
width: 750rpx;
background: #FFFFFF;
border-radius: 16rpx 16rpx 16rpx 16rpx;
padding: 32rpx 64rpx;
margin-top: 32rpx;
position: relative;
.fontStyle {
.df;
>text {
font-weight: 500;
font-size: 28rpx;
color: #333333;
margin-left: 12rpx
}
}
.content {
.df(flex-start, stretch);
margin-top: 16rpx;
>view {
font-weight: 400;
font-size: 24rpx;
color: #999999;
width: 120rpx;
}
>text {
font-weight: 400;
font-size: 24rpx;
color: #666666;
}
}
.More {
margin-left: 119rpx;
font-weight: 400;
font-size: 24rpx;
color: #666666;
}
.buttonStyle {
width: 158rpx;
height: 56rpx;
background: #FFFFFF;
border-radius: 10rpx 10rpx 10rpx 10rpx;
border: 2rpx solid #E8E8E8;
position: absolute;
right: 58rpx;
top: 56rpx;
}
.addreeStyle {
font-weight: 400;
font-size: 24rpx;
color: #999999;
margin-top: 22rpx;
.df;
}
.rightStyle {
margin-top: 16rpx;
font-weight: 400;
font-size: 24rpx;
color: #333;
.df(space-between);
>view>text {
margin-left: 8rpx;
color: #999999;
font-size: 24rpx;
}
}
.lookstyle {
width: 100%;
font-weight: 400;
font-size: 28rpx;
color: #333333;
.df(center);
}
}
.ml-20 {
margin-left: 20rpx;
}
.df(@start: flex-start, @position: center) {
display: flex;
justify-content: @start;
align-items: @position;
}
</style>

View File

@@ -1,110 +0,0 @@
<template>
<view class="Box">
<view class="fontStyle">
<image src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/drder/canyin.png"
style="width: 40rpx;height: 36.44rpx;" mode=""></image>
<text>到店吃套餐</text>
</view>
<view style="margin-left: 52rpx;" v-for="(item ,i ) in info.tagVos" :key="i">
<view class="content">
{{item.title}} {{item.goods.length}} {{item.number}}
</view>
<view class="rightStyle" v-for="(ele,index) in item.goods" :key="index">
<view>
{{ele.name}} <text>({{ele.groupNum}}{{ele.unitName}})</text>
</view>
<text>{{ele.lowPrice}}</text>
</view>
</view>
</view>
</template>
<script>
export default {
props: ['info'],
data() {
return {
}
},
methods: {
makephone(e) {
uni.makePhoneCall({
phoneNumber: e
});
}
}
}
</script>
<style lang="less" scoped>
.Box {
width: 750rpx;
background: #FFFFFF;
border-radius: 16rpx 16rpx 16rpx 16rpx;
padding: 32rpx 64rpx;
margin-top: 32rpx;
position: relative;
.fontStyle {
.df;
>text {
font-weight: 500;
font-size: 28rpx;
color: #333333;
margin-left: 12rpx
}
}
.content {
margin-top: 20rpx;
font-weight: 400;
font-size: 24rpx;
color: #999999;
}
.buttonStyle {
width: 158rpx;
height: 56rpx;
background: #FFFFFF;
border-radius: 10rpx 10rpx 10rpx 10rpx;
border: 2rpx solid #E8E8E8;
position: absolute;
right: 58rpx;
top: 56rpx;
}
.addreeStyle {
font-weight: 400;
font-size: 24rpx;
color: #999999;
margin-top: 22rpx;
.df;
}
.rightStyle {
margin-top: 16rpx;
font-weight: 400;
font-size: 24rpx;
color: #333;
.df(space-between);
>view>text {
margin-left: 8rpx;
color: #999999;
font-size: 24rpx;
}
}
}
.ml-20 {
margin-left: 20rpx;
}
.df(@start: flex-start, @position: center) {
display: flex;
justify-content: @start;
align-items: @position;
}
</style>

View File

@@ -1,88 +0,0 @@
<template>
<view class="title">
<text class="fontStyle">{{info.proName}}</text>
<view class="titleBox">
<image :src="info.proImg" mode=""
style="width: 102rpx;height: 102rpx;border-radius: 12rpx 12rpx 12rpx 12rpx;"></image>
<view class="ml-20 rightText">
<view>
{{info.avaTime}}
</view>
<view style="margin-top: 8rpx;">{{info.proDetail}}</view>
</view>
</view>
<view class="moneyStyle" @click="fivecontentclick(info.proId)">
<text class="moneys">{{info.orderAmount}}</text>
<u-icon name="arrow-right" color="#000" size="28"></u-icon>
</view>
</view>
</template>
<script>
export default {
props: ['info'],
data() {
return {
}
},
methods: {
fivecontentclick(proId) {
uni.pro.navigateTo('product/index', {
id: proId
})
},
}
}
</script>
<style lang="less">
.title {
width: 750rpx;
height: 206rpx;
background: #FFFFFF;
border-radius: 16rpx 16rpx 16rpx 16rpx;
padding: 32rpx 64rpx;
margin-top: 32rpx;
position: relative;
.fontStyle {
font-weight: 400;
font-size: 28rpx;
color: #333333;
}
.titleBox {
.df();
.rightText {
font-weight: 400;
font-size: 24rpx;
color: #999999;
}
}
.moneyStyle {
position: absolute;
right: 30rpx;
top: 80rpx;
.df();
.moneys {
font-weight: bold;
font-size: 32rpx;
color: #333333;
}
}
}
.ml-20 {
margin-left: 20rpx;
}
.df(@start: flex-start, @position: center) {
display: flex;
justify-content: @start;
align-items: @position;
}
</style>

View File

@@ -1,207 +0,0 @@
<template>
<!-- 团购订单详情 -->
<view>
<!-- 头部 -->
<groupTitle :info="listinfo"></groupTitle>
<!--
if (e == 'closed') return '已完成'
else if (e == 'unpaid') return '待付款'
else if (e == 'unused') return '待使用'
else if (e == 'refund') return '已退款'
else if (e == 'cancelled') return '已取消'
else return "1"
-->
<groupCoupons :info="listinfo" @clickEvent='clickEvent'
v-if="listinfo.status=='unused'||listinfo.status=='refund'"></groupCoupons>
<!-- 商家信息 -->
<groupMerchants :info="listinfo"></groupMerchants>
<!-- 到店 -->
<groupStore :info="listinfo"></groupStore>
<!-- 提示 -->
<groupPrompt :info="listinfo"></groupPrompt>
<!-- 实付 -->
<groupPay :info="listinfo" v-if="listinfo.status=='unused'||listinfo.status=='refund'"></groupPay>
<!-- 订单信息 -->
<groupOrderInfo :info="listinfo" v-else></groupOrderInfo>
<view class="customerService" @click="makephone(listinfo.phone)">
<image src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/drder/kefu.png"
style="width: 40rpx;height: 43.21rpx;" mode=""></image>
联系客服
</view>
<view style="height: 100rpx;" v-if="listinfo.status == 'unpaid'"> </view>
<!-- 待支付按钮 -->
<view class="payBox" v-if="listinfo.status == 'unpaid'">
<button @click="payEvent" class="payStyle">立即支付</button>
</view>
<!-- 二维码展示 -->
<view class="qrimg" v-if="isQrimg" @click="clickEvent">
<tki-qrcode ref="qrcode" size="400" :val="qrValue" :loadMake="true" @result="qrR" />
</view>
</view>
</template>
<script>
/**
* 只有两个有变动,美团券和实付金额、订单信息
* 1.支付完成/已退款/有美团券、
* 待支付/已完成没有美团券
* 2.支付完成、已退款有实付金额
* 待支付、已完成有订单信息没有实付金额
**/
import groupTitle from './components/groupTitle.vue'
import groupCoupons from './components/groupCoupons.vue'
import groupMerchants from './components/groupMerchants.vue'
import groupStore from './components/groupStore.vue'
import groupPrompt from './components/groupPrompt.vue'
import groupPay from './components/groupPay.vue'
import groupOrderInfo from './components/groupOrderInfo.vue'
import tkiQrcode from "@/components/tki-qrcode/tki-qrcode.vue"
export default {
components: {
groupTitle,
groupCoupons,
groupMerchants,
groupStore,
groupPrompt,
groupPay,
tkiQrcode,
groupOrderInfo
},
onLoad(e) {
this.orderId = e.orderId
this.orderorderInfo()
},
data() {
return {
orderId: "",
listinfo: null,
isQrimg: false,
qrValue: ""
}
},
methods: {
async payEvent() {
let res = await this.api.payOrderPay({
payType: 'wechatPay',
orderId: this.listinfo.id,
orderType: 'group'
})
if (res) {
uni.requestPayment({
provider: 'wxpay', //支付类型-固定值
partnerid: res.data.appId, // 微信支付商户号
timeStamp: res.data.timeStamp, // 时间戳(单位:秒)
nonceStr: res.data.nonceStr, // 随机字符串
package: res.data.package, // 固定值
signType: res.data.signType, //固定值
paySign: res.data.paySign, //签名
success: (res) => {
uni.showToast({
title: "支付成功"
})
uni.navigateBack()
},
fail: (err) => {
setTimeout(res => {
uni.showToast({
icon: 'none',
title: '支付失败'
})
uni.hideLoading()
}, 2000)
}
});
}
},
clickEvent() {
this.qrValue =this.listinfo.coupons[0].couponNo
console.log(this.listinfo.coupons[0].couponNo)
// this.qrValue = this.qrEvent()
this.isQrimg = !this.isQrimg
},
qrR(e) {
console.log(112312)
},
// 拼接code值
qrEvent() {
let str = ''
this.listinfo.coupons.forEach(res => {
if (res.couponNo) {
str += res.couponNo + ','
}
})
return str
},
orderorderInfo() {
let _this = this
uni.getStorage({
key: "getLocationstorage",
success: async function(data) {
let {
lat,
lng
} = data.data
let res = await _this.api.groupOrderInfoDetail({
id: _this.orderId,
lat,
lng
})
if (res.code == 0) {
_this.listinfo = res.data
}
}
});
},
makephone(e) {
uni.makePhoneCall({
phoneNumber: e
});
}
}
}
</script>
<style lang="less" scoped>
.qrimg {
width: 100vw;
height: 100vh;
background-color: rgba(0, 0, 0, .6);
display: flex;
justify-content: center;
align-items: center;
position: fixed;
top: 0%;
left: 0%;
}
.payBox {
width: 100vw;
height: 140rpx;
background-color: #fff;
position: fixed;
bottom: 0%;
left: 50%;
transform: translate(-50%);
.payStyle {
background-color: #fe7620;
color: #fff;
width: 90%;
border: 10rpx solid #fff;
}
}
.customerService {
font-weight: 400;
font-size: 28rpx;
color: #333333;
width: 100%;
padding: 78rpx 0;
display: flex;
align-items: center;
justify-content: center;
}
</style>

View File

@@ -1,323 +0,0 @@
<template>
<!-- 退款 -->
<view class="refund">
<view class="refundBox">
<view class="refundBoxA">
<image src="../../static/avatar.png"
style="width: 86rpx;height: 86rpx;border-radius: 12rpx 12rpx 12rpx 12rpx;" mode=""></image>
<view>
辣与不辣随心选汉堡3选1MT19
</view>
</view>
<view style="width: 100%;height: 2rpx;background-color: #E6E6E6;margin-top: 18rpx;"> </view>
<view class="refundBoxB">
<view>
退款数量
</view>
<view>
最多可退1张
</view>
<!-- 计步器 -->
<u-number-box class="Unumber" v-model="Unumbervalue" style="position: absolute;right: 20rpx;"
:disabled="true"></u-number-box>
</view>
<view style="width: 100%;height: 2rpx;background-color: #E6E6E6;margin-top: 32rpx;"> </view>
<view class="refundBoxC">
<view>
退款金额
</view>
<view>
1-3 个工作日退还至原支付方以实际退款金额为准
</view>
<view>$9.9</view>
</view>
<view style="width: 100%;height: 2rpx;background-color: #E6E6E6;margin-top: 32rpx;"> </view>
<view class="refundBoxD">
<view>退款原因 <text style="color: #FF4C11;">*</text> </view>
<view class="as-input" @click="openFood">
<view class="placeholder" v-if="fruitName==undefined||fruitName==''">请至少选择一项</view>
<view class="as-content" v-else>{{fruitName}}</view>
<!-- <uni-icons type="forward" size="16" color="#c0c4cc" class="customer-icon"></uni-icons> -->
<u-icon name="arrow-right" color="#666666" size="16"></u-icon>
</view>
</view>
<view style="width: 100%;height: 2rpx;background-color: #E6E6E6;margin-top: 32rpx;"> </view>
<view class="refundBoxE">
<view>退款说明 </view>
<textarea placeholder-style="font-size: 24rpx;color: #999999;" @input="sumfontnum" :value='tareaValue'
placeholder="请输入退款说明,我们将用心倾听你的任何不满" name="" id="" maxlength="200" cols="30" rows="10"
style="padding: 16rpx 26rpx;margin-top: 16rpx;border: solid 2rpx #999;border-radius: 18rpx 18rpx 18rpx 18rpx;"></textarea>
<view class="Unumberxz"><text>{{fontNum}}</text>/200</view>
</view>
</view>
<view class="buttonBox">
<button class="buttonStyle">
提交订单
</button>
</view>
<niceui-popup-select ref="showFruit" :columns="foods" :selectValue="fruitId" :is-search="false"
:option="{label:'name', value:'id'}" @confirm="confirmFruit"></niceui-popup-select>
</view>
</template>
<script>
import '../../uni_modules/uni-icons/components/uni-icons/uni-icons.vue'
export default {
data() {
return {
Unumbervalue: 1,
tareaValue: '',
fontNum: 0,
foods: [{
id: '1',
name: '计划有变没时间消费'
},
{
id: '2',
name: '买多了/买错了'
},
{
id: '3',
name: '担心安全问题(天气等)'
}, {
id: '3',
name: '担心安全问题(天气等)'
}, {
id: '3',
name: '担心安全问题(天气等)'
}, {
id: '3',
name: '担心安全问题(天气等)'
}, {
id: '3',
name: '担心安全问题(天气等)'
},
],
fruitId: [],
fruitName:''
}
},
methods: {
// 限制文本框字数
sumfontnum(e) {
console.log(e)
this.fontNum = e.detail.value.length
},
confirmFruit(value, data) {
this.fruitId = value
this.fruitName = data.map(it => it.name)
this.$refs.showFruit.closePopup()
},
openFood() {
this.$refs.showFruit.showPopup()
},
}
}
</script>
<style lang="less" scoped>
.refundBox {
background-color: #fff;
padding: 32rpx 64rpx;
.refundBoxA {
.df(flex-start, stretch);
>view {
font-weight: 400;
font-size: 28rpx;
color: #333333;
}
}
.refundBoxB {
position: relative;
>view:first-child {
font-weight: 500;
font-size: 28rpx;
color: #333333;
margin-top: 16rpx;
}
>view:nth-child(2) {
font-weight: 400;
font-size: 24rpx;
color: #999999;
margin-top: 16rpx;
}
.Unumber {
// transform: translateY(-50%);
}
}
.refundBoxC {
position: relative;
>view:first-child {
font-weight: 500;
font-size: 28rpx;
color: #333333;
margin-top: 16rpx;
}
>view:nth-child(2) {
font-weight: 400;
font-size: 24rpx;
color: #999999;
margin-top: 16rpx;
}
>view:last-child {
position: absolute;
right: 0rpx;
top: 20rpx;
font-weight: 500;
font-size: 28rpx;
color: #FF4C11;
}
}
.refundBoxD {
.df(space-between);
// margin-top: 32rpx;
padding-top: 32rpx;
>view:first-child {
.df;
width: 160rpx;
font-weight: 500;
font-size: 28rpx;
}
>view:last-child {
// .df();
font-weight: 400;
font-size: 24rpx;
color: #333333;
}
}
.refundBoxE {
margin-top: 32rpx;
font-weight: 500;
font-size: 28rpx;
color: #333333;
position: relative;
.Unumberxz {
position: absolute;
right: 40rpx;
bottom: 14rpx;
font-weight: 400;
font-size: 24rpx;
color: #999999;
>text {
font-weight: 400;
font-size: 24rpx;
color: #999999;
}
}
}
}
.buttonBox {
width: 100%;
height: 136rpx;
background: #FFFFFF;
position: fixed;
bottom: 0;
left: 0;
// .df(center,center);
.buttonStyle {
margin-left: 50%;
margin-top: 40rpx;
transform: translateX(-50%);
width: 712rpx;
height: 72rpx;
line-height: 72rpx;
text-align: center;
background: linear-gradient(110deg, #F1A666 0%, #FF4C11 100%);
border-radius: 48rpx 48rpx 48rpx 48rpx;
font-weight: bold;
font-size: 36rpx;
color: #FFFFFF;
}
}
.df(@start: flex-start, @position: center) {
// @start: flex-start(默认) space-between(两端对齐) space-around(间隔相等)
// @position:stretch(默认) center(垂直居中)
display: flex;
align-items: @position;
justify-content: @start;
}
</style>
<style>
/deep/ .u-number-box {
position: absolute;
right: 0;
top: 30%;
}
radio-group,
checkbox-group {
width: 92%;
}
</style>
<style lang="scss" scoped>
.content {
background-color: #f7f7f7;
width: 100vw;
height: 100vh;
}
.uni-title {
font-size: 33rpx;
font-weight: bold;
padding: 20rpx 20rpx;
}
.uni-list-cell {
background-color: #fff;
display: flex;
justify-content: space-between;
align-items: center;
padding: 20rpx 20rpx;
.uni-list-cell-left {
font-size: 35rpx;
}
}
.uni-list-cell-db {
flex: 1
}
.as-input {
width: 100%;
display: flex;
align-items: center;
justify-content: flex-end;
.customer-icon {
padding: 0 0 0 5rpx;
}
.placeholder {
font-size: 33rpx;
color: #999;
}
.as-content {
color: #333;
font-size: 33rpx;
}
}
</style>

View File

@@ -1,257 +0,0 @@
<template>
<view class="onecontent flex-between">
<view class="onecontentleft">
现有<text style="color: #FC851E;font-size: 24rpx;">
{{bannervo.coupons==null?116:bannervo.coupons}}
</text>
已免单
</view>
<view class="onecontentright flex-start">
<view class="onecontentrightimage">
<view class="swiperPanel" @touchstart="startMove" @touchend="endMove">
<view class="swiperItem" v-for="(item, index) in bannervo.counponsInfo" :key="index"
:style="{transform: itemStyle[index].transform, zIndex: itemStyle[index].zIndex, opacity: itemStyle[index].opacity}">
<view class="children">
<image class="pic" :src="item.logo"></image>
</view>
</view>
</view>
</view>
<view class="onecontentrighttext">
<swiper class="swiper" circular :autoplay="true" :vertical='true' :interval="2000">
<swiper-item class="swiperitem" v-for="(item,index) in bannervo.counponsInfo" :key="index">
{{item.name}}已省{{item.money}}元钱
</swiper-item>
</swiper>
</view>
</view>
<!-- 小内切圆 -->
<view class="after"></view>
</view>
</template>
<script>
import customSwiper from '@/components/blackmonth-swiper/index'
export default {
components: {
customSwiper
},
data() {
return {
isScroll: false,
minCount: 0,
fontColor: 'black',
timersetInterval: '0', //定时器
slideNote: {
x: 0,
y: 0
},
screenWidth: 0
};
},
props: {
bannervo: {
type: Object,
default () {
return {
counponsInfo: []
}
}
},
itemStyle: {
type: Array,
default () {
return []
}
},
title: {
type: String,
default: '每日特价'
},
timersetnteritem: {
type: String,
default: '0'
}
},
watch: {
timersetnteritem(newVal, oldVal) {
// console.log(newVal, oldVal)
if (newVal == 1) {
clearTimeout(this.timersetInterval);
this.timersetInterval = null;
} else {
this.timersetIntervalnewVal()
}
}
},
mounted() {
this.timersetIntervalnewVal()
},
methods: {
timersetIntervalnewVal() {
this.timersetInterval = setInterval(() => {
this.endMove()
}, 2000);
},
startMove(e) {
this.slideNote.x = e.changedTouches[0] ? e.changedTouches[0].pageX : 0;
this.slideNote.y = e.changedTouches[0] ? e.changedTouches[0].pageY : 0;
},
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 last = [newList.pop()]
newList = last.concat(newList)
// } else {
// 向右滑动
// newList.push(newList[0])
// newList.splice(0, 1)
// }
this.$emit('changeValue', newList);
this.$forceUpdate();
}
}
};
</script>
<style scoped lang="scss">
.onecontent {
position: relative;
margin-top: -34rpx;
padding: 14rpx 28rpx 44rpx 28rpx;
width: 100%;
background: linear-gradient(92deg, #FCECAA 0%, #fff 100%);
border-radius: 40rpx 0rpx 0rpx 0rpx;
.onecontentleft {
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 700;
font-size: 24rpx;
color: #333333;
display: flex;
align-items: center;
justify-content: center;
text {
color: #FC851E;
}
}
.onecontentright {
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 24rpx;
color: #333333;
display: flex;
align-items: center;
justify-content: center;
.onecontentrightimage {
width: 65rpx;
position: relative;
overflow: hidden;
height: 28rpx;
margin-right: 10rpx;
.swiperPanel {
height: 28rpx;
width: 100rpx;
overflow: hidden;
position: relative;
.swiperItem {
height: 100%;
width: 100%;
position: absolute;
top: 0;
left: 0;
transition: all .5s;
/* 定义一个动画关键帧 */
.children {
height: 100%;
width: 25%;
// margin: 2rpx auto;
/* 应用动画,设置动画时长、循环次数和速度曲线 */
.pic {
height: 100%;
width: 100%;
border-radius: 50%;
// box-shadow: 0 0 10px #333;
}
}
}
}
.onecontentrightimageabsolute {
width: 100%;
left: 0;
top: 0;
position: absolute;
z-index: 9;
height: 28rpx;
}
.onecontentrightimageabsolutetow {
width: 100%;
left: 14rpx;
top: 0;
position: absolute;
z-index: 10;
}
// .onecontentrightswiper {
// border: 50%;
// width: 28rpx;
// height: 28rpx;
// background: red;
// }
}
.onecontentrighttext {
width: 232rpx;
.swiper {
height: 28rpx;
// width: 232rpx;
.swiperitem {
width: 100rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 20rpx;
color: #333333;
overflow: hidden; //超出的文本隐藏
text-overflow: ellipsis; //溢出用省略号显示
white-space: nowrap; //溢出不换行
}
}
}
}
.after {
position: absolute;
top: -40rpx;
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);
}
}
</style>

View File

@@ -1,115 +0,0 @@
<template>
<view class="fourcontent flex-between">
<view class="fourcontent_item flex-start" v-for="(item,index) in menu" :key="index"
@click="viewHistorycategoryss(item,index)"
:class="!item.isChild && viewHistoryindex == index ? 'fourcontent_itemactev':''">
<text>{{item.name}}</text>
</view>
</view>
</template>
<script>
export default {
data() {
return {};
},
props: {
menu: {
type: Array,
default () {
return []
}
},
title: {
type: String,
default: '每日特价'
},
viewHistoryindex: {
type: String,
default: ''
},
},
methods: {
viewHistorycategoryss(item, index) {
console.log(item, index)
uni.$emit('viewHistory', {
item:item,
index:index
});
},
clickdistrict(item) {
switch (item.jumpType) {
case 'absolute':
uni.pro.navigateTo('webview/webview', {
url: item.absUrl
});
break;
case 'relative':
uni.pro.navigateTo(item.absUrl, item);
break;
case 'scan':
if (!uni.utils.pluschooseImage()) {
return false
}
// #ifdef H5
if (this.wxSdk) {
wx.scanQRCode({
needResult: 1, // 默认为0扫描结果由微信处理1则直接返回扫描结果
scanType: ['qrCode', 'barCode'], // 可以指定扫二维码还是一维码,默认二者都有
success: res => {
// 当needResult 为 1 时,扫码返回的结果
console.log(res.resultStr, res)
}
});
} else {
uni.showModal({
title: '注意',
content: '微信sdk初始化失败请重新加载',
success: res => {
window.location.reload();
}
});
}
// #endif
// #ifdef APP || MP-WEIXIN
uni.scanCode({
success: res => {
console.log(res.result, res)
}
});
// #endif
break;
}
}
}
};
</script>
<style scoped lang="scss">
.fourcontent {
padding: 32rpx 28rpx 32rpx 28rpx;
overflow-x: auto;
flex-wrap: nowrap;
.fourcontent_item {
flex-wrap: nowrap;
margin-left: 22rpx;
padding: 4rpx 14rpx;
background: #FFFFFF;
border-radius: 8rpx 8rpx 8rpx 8rpx;
text {
width: max-content;
}
}
.fourcontent_itemactev {
background: #fee06a;
}
.fourcontent_item:nth-child(1) {
margin-left: 0;
}
}
</style>

View File

@@ -1,115 +0,0 @@
<template>
<view class="towcontent flex-between">
<view class="towcontent_item flex-colum" v-for="(item,index) in district" :key="index"
@click="clickdistrict(item,index)">
<image :src="item.coverImg" mode="aspectFill"></image>
<text>{{item.name}}</text>
</view>
</view>
</template>
<script>
export default {
data() {
return {};
},
props: {
district: {
type: Array,
default () {
return []
}
},
title: {
type: String,
default: '每日特价'
},
img: {
type: String,
default: ''
},
},
methods: {
clickdistrict(item) {
console.log(item,'调试')
switch (item.jumpType) {
case 'absolute':
uni.pro.navigateTo('webview/webview', {
url: item.absUrl
});
break;
case 'scan_applet':
uni.navigateToMiniProgram(JSON.parse(item.value))
break;
case 'relative':
uni.setStorage({
key: 'itemData',
data: item,
});
uni.pro.navigateTo(item.absUrl, item.name);
break;
case 'scan':
if (!uni.utils.pluschooseImage()) {
return false
}
// #ifdef APP || MP-WEIXIN
uni.scanCode({
success: (res) => {
let tableCode = this.getQueryString(decodeURIComponent(res.result), 'code')
uni.cache.set('tableCode', tableCode)
if (tableCode) {
uni.pro.navigateTo('order_food/order_food')
}
}
});
// #endif
break;
}
},
getQueryString(url, name) { //解码
var reg = new RegExp('(^|&|/?)' + name + '=([^&|/?]*)(&|/?|$)', 'i')
var r = url.substr(1).match(reg)
if (r != null) {
return r[2]
}
return null;
},
}
};
</script>
<style scoped lang="scss">
.towcontent {
position: relative;
margin-top: -32rpx;
padding: 32rpx 40rpx;
width: 100%;
background: #F9F9F9;
border-radius: 48rpx 48rpx 0rpx 0rpx;
overflow-x: auto;
flex-wrap: nowrap;
.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;
font-weight: 400;
font-size: 28rpx;
color: #333333;
white-space: nowrap;
}
}
.towcontent_item:nth-child(1) {
margin-left: 0rpx;
}
}
</style>

View File

@@ -1,309 +0,0 @@
<template>
<!-- #ifndef APP-PLUS || MP-WEIXIN -->
<view class="fivecontent">
<!-- #endif -->
<!-- #ifdef MP-WEIXIN -->
<view class="fivecontent" :style="isFixedTop?`margin-top:${HeighT.heightBar}px`:''">
<!-- #endif -->
<!-- #ifdef APP-PLUS -->
<view class="fivecontent" :class="{statusbarmargin:isFixedTop}">
<!-- #endif -->
<view class="fivecontent_item" v-for="(item,index) in 12" :key="index">
<view class="fivecontent_item_nav flex-start">
<image src="@/static/avatar.png" mode="aspectFill"></image>
<view class="fivecontent_item_nav_left">
<view class="fivecontent_item_nav_lefttop flex-between">
<view>
幸运咖啡荣民时代广场店
</view>
<view>
龙首.151m
</view>
</view>
<view class="fivecontent_item_nav_leftlang flex-start">
<image src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/index/hong_h.png"
mode="aspectFill"></image>
<text>人气连锁品牌</text>
</view>
</view>
</view>
<view class="fivecontent_item_box">
<view class="fivecontent_item_boxitem flex-between">
<image src="@/static/avatar.png" mode=""></image>
<view class="fivecontent_item_boxitemleft flex-colum-start">
<view class="fivecontent_item_boxitemleftone flex-between">
<view>全场饮品任选</view>
<text>已抢15789份</text>
</view>
<view class="fivecontent_item_boxitemlefttow flex-start">
<image src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/index/hong_h.png"
mode="aspectFill"></image>
<text>人气连锁品牌</text>
</view>
<view class="indexboxitemleftthere flex-colum-start">
<view class="indexboxitemleftthereabsolute">
马上抢
</view>
<view class="indexboxitemlefttheretext flex-start">
<view class="indexboxitemlefttheretextone">
<text>¥</text>
<text>1444</text>
</view>
<view class="indexboxitemlefttheretexttow">
¥111
</view>
</view>
<view class="indexboxitemleftthere_countdown flex-between">
<text class="indexboxitemleftthere_countdowntext">共省4元</text>
<view class="indexboxitemleftthere_countdowntexts">
<uni-countdown :show-day="false" :day="1" :hour="1" :minute="12"
:second="40" color="#FFFFFF" border-color="#00B26A"
splitorColor="#FFFFFF" :font-size="8"></uni-countdown>
</view>
</view>
</view>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
isFixedTop: false, //吸顶是否显示
Topdistance: 3000, //吸顶初始距离
keyword: '',
current: 0,
opacity: false,
};
},
onPageScroll(e) {
if (e.scrollTop <= 44) { //搜索导航栏
this.opacity = false
} else {
this.opacity = true
}
if (e.scrollTop >= this.Topdistance) { //类别导航栏
this.isFixedTop = true
} else {
this.isFixedTop = false
}
},
computed: {
HeighT() { //手机类型的尺寸
return this.$store.getters.is_BarHeight
},
},
onLoad() {
setTimeout(() => {
this.GetTop()
}, 1000)
},
onShow() {},
methods: {
GetTop() {
//获取元素距离顶部的距离
this.$u.getRect('.fourcontent').then(res => {
this.Topdistance = res.top - this.HeighT.heightBar
})
},
viewHistory() {
//移动高度=滚动高度 + 距离上面的位置 - 导航条 - 状态栏高度
uni.pageScrollTo({
scrollTop: this.Topdistance + 1,
duration: 300
});
},
}
};
</script>
<style scoped lang="scss">
.fivecontent {
padding: 0 28rpx;
.fivecontent_item {
margin-top: 32rpx;
padding: 24rpx 32rpx;
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_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;
}
}
.indexboxitemleftthere {
position: relative;
margin-top: 30rpx;
padding-left: 16rpx;
width: 100%;
height: 88rpx;
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 {
.indexboxitemlefttheretextone {
text {
font-family: SourceHanSansCN-Bold, SourceHanSansCN-Bold;
font-weight: normal;
color: #FF5053;
}
text:nth-child(2) {
font-weight: bold;
font-size: 34rpx;
}
text:nth-child(1) {
font-size: 24rpx;
}
}
.indexboxitemlefttheretexttow {
margin-left: 12rpx;
font-size: 20rpx;
font-family: SourceHanSansCN-Regular, SourceHanSansCN-Regular;
font-weight: normal;
color: #999999;
text-decoration: line-through;
}
}
.indexboxitemleftthere_countdown {
width: 100%;
.indexboxitemleftthere_countdowntext {
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 24rpx;
color: #999999;
}
.indexboxitemleftthere_countdowntexts {
font-family: Roboto, Roboto;
font-weight: 400;
color: #333333;
margin-left: 16rpx;
font-size: 22rpx;
}
}
}
}
}
}
}
}
</style>

View File

@@ -1,75 +0,0 @@
<template>
<view class="viewswiper">
<u-swiper :list="carousel" keyName="coverImg" @change="e => current = e.current" indicatorStyle="right: 20px" height='484'>
<view slot="indicator" class="indicator">
<view class="indicator__dot" v-for="(item, index) in carousel" :key="index"
:class="[index === current && 'indicator__dot--active']"
:style="[index === current && {'width':16+'px'}]">
</view>
</view>
</u-swiper>
</view>
</template>
<script>
export default {
data() {
return {
current: 0
};
},
props: {
carousel: {
type: Array,
default () {
return []
}
},
title: {
type: String,
default: '每日特价'
},
img: {
type: String,
default: ''
},
},
};
</script>
<style scoped lang="scss">
.viewswiper {
.indicator {
margin-bottom: 46rpx;
@include flex(row);
justify-content: center;
&__dot {
height: 6px;
width: 6px;
border-radius: 100px;
background-color: rgba(255, 255, 255, 0.35);
margin: 0 5px;
transition: background-color 0.3s;
&--active {
background-color: #ffffff;
}
}
}
.indicator-num {
padding: 2px 0;
background-color: rgba(0, 0, 0, 0.35);
border-radius: 100px;
width: 35px;
@include flex;
justify-content: center;
&__text {
color: #FFFFFF;
font-size: 12px;
}
}
}
</style>

View File

@@ -1,262 +0,0 @@
<template>
<view class="therecontent flex-between">
<view class="therecontent_box_item">
<view class="therecontent_box_imge flex-between" @click="jrtoday(0)">
<view class="therecontent_box_imge_text">
{{todayList.name}}
</view>
<view class="therecontent_box_imge_right flex-start">
<view>
{{todayList.date}}
</view>
<u-icon name="arrow-right" color="#666666" size="16"></u-icon>
</view>
</view>
<view class="therecontent_box_itembox">
<view class="therecontent_box_itembox_item flex-between" v-for="(item,index) in todayList.todayList"
:key="index" @click="clickproduct(item)">
<image :src="`${item.image}?x-oss-process=image/resize,m_lfit,w_114,h_136`" mode="aspectFill"></image>
<view class="therecontent_box_itembox_itemview flex-colum-start">
<view class="therecontent_box_itembox_itemviewone">
<text
style="margin-left: 0;">{{item.productName.length>5?item.productName.substring(0,5)+'...':item.productName}}</text>
</view>
<view class="therecontent_box_itembox_itemviewtow flex-around">
<image src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/index/xia.png" mode="widthFix">
</image>
<view>
{{item.discount || '1'}}
</view>
</view>
<view class="therecontent_box_itembox_itemviewthere ">
<text>{{item.salePrice}}</text>
<text>{{item.originPrice}}</text>
</view>
</view>
</view>
</view>
</view>
<view class="therecontent_box_item">
<view class="therecontent_box_imge flex-between"
style="background: url(https://czg-qr-order.oss-cn-beijing.aliyuncs.com/index/towcontent_box2.png) no-repeat; background-size: cover;"
@click="jrtoday(1)">
<view class="therecontent_box_imge_text">
{{salesList.name}}
</view>
<view class="therecontent_box_imge_right flex-start">
<view>
{{salesList.date}}
</view>
<u-icon name="arrow-right" color="#666666" size="16"></u-icon>
</view>
</view>
<view class="therecontent_box_itembox">
<view class="therecontent_box_itembox_item flex-between" v-for="(item,index) in salesList.hotList"
:key="index" @click="clickproduct(item)">
<image :src="`${item.image}?x-oss-process=image/resize,m_lfit,w_114,h_136`" mode="aspectFill"></image>
<view class="therecontent_box_itembox_itemview flex-colum-start">
<view class="therecontent_box_itembox_itemviewone flex-start">
<view class="therecontent_box_itembox_itemviewoneafter">
TOP.{{index + 1}}
</view>
<text>{{ item.productName.length>5?item.productName.substring(0,5)+'...':item.productName }}</text>
</view>
<view class="therecontent_box_itembox_itemviewtowdiscount flex-around">
已抢{{item.realSalesNumber}}
</view>
<view class="therecontent_box_itembox_itemviewthere ">
<text>{{item.salePrice}}</text>
<text>{{item.originPrice}}</text>
</view>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {};
},
props: {
salesList: {
type: Object,
default () {
return {
salesList: []
}
}
},
todayList: {
type: Object,
default () {
return {
todayList: []
}
}
},
title: {
type: String,
default: '每日特价'
}
},
methods: {
clickproduct(item) {
uni.pro.navigateTo('product/index', {
id: item.id
})
},
jrtoday(e) {
if (e == 0) {
uni.pro.navigateTo('index/jtoday')
} else {
uni.pro.navigateTo('index/hotlist')
}
}
}
};
</script>
<style scoped lang="scss">
.therecontent {
padding: 0 28rpx;
.therecontent_box_item {
width: 336rpx;
border-radius: 18rpx;
background: #FFFFFF;
height: 396rpx;
.therecontent_box_itembox {
padding: 10rpx 18rpx 24rpx 24rpx;
.therecontent_box_itembox_item {
margin-top: 20rpx;
flex-wrap: nowrap;
image {
width: 114rpx;
height: 136rpx;
border-radius: 10rpx;
}
.therecontent_box_itembox_itemview {
margin-left: 12rpx;
.therecontent_box_itembox_itemviewone {
width: 168rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 24rpx;
color: #333333;
text {
margin-left: 4rpx;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 2;
}
.therecontent_box_itembox_itemviewoneafter {
width: 48rpx;
height: 24rpx;
line-height: 24rpx;
text-align: center;
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;
}
}
.therecontent_box_itembox_itemviewtow {
margin-top: 8rpx;
width: 60rpx;
// padding: 4rpx 10rpx;
background: #FFFFFF;
border-radius: 4rpx;
border: 2rpx solid #FF7127;
image {
width: 9.74rpx;
height: 13.51rpx;
}
view {
padding-right: 2rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: bold;
font-size: 16rpx;
color: #FF7127;
}
}
.therecontent_box_itembox_itemviewtowdiscount {
margin-top: 10rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 500;
font-size: 16rpx;
color: #FF7127;
}
.therecontent_box_itembox_itemviewthere {
// margin-top: 4rpx;
// align-items: flex-end;
display: flex;
align-items: center;
justify-content: center;
text:nth-child(1) {
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: Bold;
font-size: 24rpx;
color: #FF7127;
}
text:nth-child(2) {
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 500;
font-size: 16rpx;
color: #999999;
text-decoration-line: line-through;
margin-top: 4rpx;
}
}
}
}
.therecontent_box_itembox_item:nth-child(1) {
margin-top: 0;
}
}
.therecontent_box_imge {
padding: 24rpx 16rpx 6rpx 24rpx;
background: url(https://czg-qr-order.oss-cn-beijing.aliyuncs.com/index/towcontent_box1.png) no-repeat;
width: 100%;
height: 70rpx;
background-size: cover;
.therecontent_box_imge_text {
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: bold;
font-size: 28rpx;
color: #333333;
}
.therecontent_box_imge_right {
font-family: Source Han Sans CN, Source Han Sans CN;
// font-weight: 500;
font-size: 24rpx;
color: #666666;
}
}
}
}
</style>

View File

@@ -1,553 +0,0 @@
<template>
<view class="container">
<view class="containertop">
<view class="containertopbox">
<view class="containertopboxone flex-start">
<view>可使用红包</view>
<text>{{totalnumber}}</text>
</view>
<view class="containertopboxitem flex-start" v-for="(item,index) in 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="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 orderlist" :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">
<u-icon v-if="item1.id == item1id" name="checkmark-circle" color="#F1CB66"
size="45"></u-icon>
<text v-else class="theretext"></text>
<view :class="item1.id == item1id?'c':'b'">
<text :class="item1.id == item1id?'c':'b'"
style="font-size:20rpx ;">¥</text>{{item1.couponsPrice}}/
</view>
</view>
</view>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
totalnumber: '',
list: [],
orderlist: [{
listdata: {},
}], //获取优惠券参数列表
item1id: '',
form: {
page: 1, //页数
size: 10, //页容量
status: 'loadmore'
},
orderfood: '', //等于0扫码点餐下单
amount: '' //下单金额传来的值
};
},
onLoad(e) {
try {
this.orderfood = e.orderfood //等于0扫码点餐下单
this.amount = e.amount
} catch (e) {
//TODO handle the exception
}
},
onShow() {
this.ordermineCouponsthis()
this.ordergetYhqParass()
},
methods: {
clickicon(e) { //团购优惠卷
this.item1id = e.id
e.clickiconone = 1
let data = e
if (this.orderfood == 0) { //等于0扫码点餐下单
if (this.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.orderfood == 0) { //等于0扫码点餐下单
if (this.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.orderlist = res.data
for (let i = 0; i <= res.data.length; i++) {
this.orderfindCouponses(i, this.orderlist[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.orderlist[i].listdata = res.data.list
console.log(this.orderlist)
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.totalnumber = res.data.total
this.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>

View File

@@ -1,673 +0,0 @@
<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=""></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>

View File

@@ -1,377 +0,0 @@
<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.cache.get('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>

View File

@@ -1,577 +0,0 @@
<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=" "></image>
<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(item,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 class="towcontentlistxitembt flex-start">
<view class="towcontentlistxitembtitem"
:class="index==xitembtitemindex?'towcontentlistxitembtitemaktev':''"
v-for="(item,index) in xitembtitem" :key="index" @click="clickxitembtitemindex(item,index)">
{{item.name}}
</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_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">
<view class="fivecontent_item_boxitemleftone_t"><text
class="fivecontent_item_boxitemleftone_o">热销TOP.{{index + 1}}</text>{{item.productName}}
</view>
</view>
<view class="fivecontent_item_boxitemlefttow flex-between">
<view class="fivecontent_item_boxitemlefttow_o flex-start">
<image src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/dw.png" mode="">
</image>
<view> {{item.productName}}</view>
</view>
<text class="fivecontent_item_boxitemlefttow_t">{{item.distances}}</text>
</view>
<view class="fivecontent_item_boxitemlefthere 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="fivecontent_item_boxitemlefour flex-start">
<image src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/index/H.png" mode="">
</image>
<text>已抢{{item.realSalesNumber}}</text>
</view>
<view class="fivecontent_item_boxitemlefive">
马上抢
</view>
</view>
</view>
</view>
</view><u-loadmore height='40' :status="form.status" iconSize='24' fontSize='24' />
<!-- </scroll-view> -->
</view>
</view>
<!-- 小内切圆 -->
<!-- <view class="after"></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: [{
name: '全部'
},
{
name: '美食正餐'
},
{
name: '饮品小吃'
}
],
xitembtitemindex: 0,
xitembtitem: [{
name: '2小时销量飙升榜',
dateType: 1
},
{
name: '今日热榜',
dateType: 0
}
],
form: {},
};
},
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() {
this.distiricttopCommon()
setTimeout(() => {
this.GetTop()
}, 1000)
},
onShow() {
this.init_fn()
},
computed: {
HeighT() { //手机类型的尺寸
return this.$store.getters.is_BarHeight
},
},
methods: {
//飙升榜
clickxitembtitemindex(item, index) {
this.xitembtitemindex = index
this.list = []
this.form.dateType = item.dateType
this.form.page = 1
this.form.size = 10
this.form.status = 'loadmore'
this.onLoadlist()
},
towcontentclick(item, index) {
this.towcontentclickindex = index
this.list = []
this.form.type = item.value
this.form.page = 1
this.form.size = 10
this.form.status = 'loadmore'
this.onLoadlist()
},
// 下面初始数据
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: '', //品类
orderBy: 4, //0.今日上新 1.离我最近 2.销量优先 3.价格优先 4.热榜推荐
other: '', //附近1KM 1选中 0不选中
page: 1, //页数
size: 10, //页容量
dateType: 1,
status: 'loadmore'
}
this.onLoadlist()
},
//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)
})
}
})
},
async distiricttopCommon() {
let res = await this.api.distiricttopCommon({
type: '', //团购卷品类Id/subShop-预约到店
orderBy: 4
})
console.log(res.data)
if (res.code == 0) {
this.toplist = res.data.carousel[0]
this.listbox = res.data.menu
}
},
clickproduct(item) {
uni.pro.navigateTo('product/index', {
id:item.id
})
},
async onLoadlist() {
try {
let res = await this.api.indexlist(this.form)
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) {}
},
}
};
</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;
}
.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 24rpx 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: 32rpx 24rpx;
width: 100%;
background: #FFFFFF;
border-radius: 18rpx 18rpx 18rpx 18rpx;
.fivecontent_item_box {
.fivecontent_item_boxitem {
image {
width: 208rpx;
height: 208rpx;
border-radius: 12rpx;
}
.fivecontent_item_boxitemleft {
margin-left: 24rpx;
flex: 1;
justify-content: flex-start;
position: relative;
.fivecontent_item_boxitemleftone {
width: 100%;
.fivecontent_item_boxitemleftone_t {
.fivecontent_item_boxitemleftone_o {
margin-right: 10rpx;
display: inline-block;
font-family: Roboto, Roboto;
font-weight: 500;
font-size: 16rpx;
color: #FFFFFF;
padding: 2rpx 6rpx;
text-align: center;
background: linear-gradient(116deg, #FF9D2B 0%, #FF4805 100%);
border-radius: 4rpx 4rpx 4rpx 4rpx;
}
font-family: Source Han Sans CN,
Source Han Sans CN;
font-weight: 400;
font-size: 28rpx;
color: #333333;
overflow:hidden;
text-overflow:ellipsis;
display:-webkit-box;
-webkit-box-orient:vertical;
-webkit-line-clamp:2;
}
}
.fivecontent_item_boxitemlefttow {
width: 100%;
margin-top: 14rpx;
.fivecontent_item_boxitemlefttow_o {
image {
width: 24rpx;
height: 24rpx;
}
view {
margin-left: 10rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 24rpx;
color: #999999;
}
}
.fivecontent_item_boxitemlefttow_t {
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 24rpx;
color: #999999;
}
}
.fivecontent_item_boxitemlefthere {
width: 100%;
margin-top: 12rpx;
align-items: flex-end;
.fivecontent_item_boxitemlefthere_one {
align-items: flex-end;
.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;
}
}
.fivecontent_item_boxitemlefour {
margin-top: 12rpx;
background: #FFEEE9;
border-radius: 4rpx 4rpx 4rpx 4rpx;
padding: 4rpx 12rpx;
image {
width: 10.82rpx;
height: 14.06rpx;
}
text {
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 500;
font-size: 16rpx;
color: #FF5053;
}
}
.fivecontent_item_boxitemlefive{
position: absolute;
padding: 8rpx 12rpx;
background: #FEE06A;
bottom: 32rpx;
right: 0;
border-radius: 24rpx 24rpx 24rpx 24rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: bold;
font-size: 24rpx;
color: #333333;
}
}
}
}
}
}
}
.after {
position: absolute;
top: -40rpx;
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);
}
}
</style>

File diff suppressed because it is too large Load Diff

View File

@@ -1,283 +0,0 @@
<template>
<view>
<!-- <u-swiper :list="banners" height="460" radius="0" :indicator="banners.length > 1" imgMode="widthFix"></u-swiper> -->
<view class="container">
<view class="after"></view>
<view class="onecontent flex-between">
<view class="onecontentone flex-start">
<image :src="userInfo.headImg" mode="aspectFill">
<text>{{userInfo.nickName || '无'}}</text>
</view>
<view class="onecontenttow flex-start">
<view class="onecontenttowring flex-colum" @click="memberindex(0)">
<text class="onecontenttowringone">{{usershopUserinfo.amount || '0.00'}}</text>
<text class="onecontenttowringtow">余额</text>
</view>
<!-- <view class="onecontenttowring flex-colum">
<text class="onecontenttowringone">282</text>
<text class="onecontenttowringtow">积分</text>
</view> -->
<view class="onecontenttowring flex-colum" @click="memberindex(1)">
<image class="onecontenttowringone image"
src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/index/rwm.png" mode="aspectFill">
</image>
<text class="onecontenttowringtow">会员码</text>
</view>
</view>
</view>
<view class="towcontent flex-between">
<view class="towcontentitem flex-colum" @click="scanCodehandle(0)">
<image src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/index/Instore.png" mode="widthFix"
style="width: 86.88rpx; height: 140.94rpx;"></image>
<text class="towcontentitemtext">店内就餐</text>
</view>
<view class="towcontentitem flex-colum" @click="scanCodehandle(1)">
<image src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/index/takeaway.png" mode="widthFix"
style="width: 164rpx; height: 164rpx"></image>
<text class="towcontentitemtext">会员充值</text>
</view>
</view>
<view class="footer-banner">
<!-- <u-swiper :list="footerBanners" radius="20" height="274" :indicator="banners.length > 1"
imgMode="widthFix"></u-swiper> -->
</view>
</view>
</view>
</template>
<script>
import uploadImage from "@/js_sdk/yushijie-ossutil/ossutil/uploadFile.js";
export default {
data() {
return {
banners: ['https://czg-qr-order.oss-cn-beijing.aliyuncs.com/index/banner1.png'],
footerBanners: ['https://czg-qr-order.oss-cn-beijing.aliyuncs.com/index/footer_banner1.png'],
};
},
props: {
usershopUserinfo: {
type: Object,
default () {
return {
amount: '',
shopName: ""
}
}
},
userInfo: {
type: Object,
default () {
return {}
}
},
},
methods: {
scanCodehandle(i) {
if (i == 0) {
uni.scanCode({
success: (res) => {
let tableCode = this.getQueryString(decodeURIComponent(res.result), 'code')
uni.cache.set('tableCode', tableCode)
if (tableCode) {
uni.pro.navigateTo('order_food/order_food')
}
// let tableCode = this.getQueryString(decodeURIComponent(res.result), 'code')
// if (tableCode) {
// uni.pro.navigateTo('order_food/order_food', {
// tableCode: tableCode,
// })
// }
}
})
// uni.navigateTo({
// url:'/pages/order_food/order_food'
// })
} else {
// uni.pro.navigateTo('pay_code/pay_code?shopInfo=', {
// shopName: this.usershopUserinfo.shopName,
// amount: this.usershopUserinfo.amount,
// shopId: uni.cache.get('shopUser')
// })
uni.pro.navigateTo('member/memberdetails', {
shopId_id: uni.cache.get('shopUser'),
})
}
},
memberindex(i) {
if (i == 0) {
uni.pro.navigateTo('member/memberdetails', {
shopId_id: uni.cache.get('shopUser'),
})
} else {
// uni.pro.navigateTo('pay_code/pay_code?shopInfo=', {
// shopName: this.usershopUserinfo.shopName,
// amount: this.usershopUserinfo.amount,
// shopId: uni.cache.get('shopUser')
// })
let data = {
shopName: this.usershopUserinfo.shopName,
amount: this.usershopUserinfo.amount,
shopId: uni.cache.get('shopUser')
}
uni.navigateTo({
url: '/pages/pay_code/pay_code?shopInfo=' + JSON.stringify(data)
})
}
},
getQueryString(url, name) { //解码
var reg = new RegExp('(^|&|/?)' + name + '=([^&|/?]*)(&|/?|$)', 'i')
var r = url.substr(1).match(reg)
if (r != null) {
return r[2]
}
return null;
},
// / 更换头像
onChooseAvatar(e) {
uni.showLoading({
title: '上传中',
mask: true
})
console.log(e.detail.avatarUrl)
let file = e.detail.avatarUrl;
uploadImage(file, 'avatar',
result => {
//将上传后的图片以对象官方要求的格式的形式存入uni-file-picker的value值imageValueimageValue值的结构为数组包对象用于图片回显
// let objAge = {
// 'url': result,
// 'extname': 'png',
// 'name': 'imgss.png'
// };
// this.userlist.avatar.push(objAge)
this.userInfo.avatar = result
console.log(this.userInfo.avatar)
uni.hideLoading()
}, result => {
uni.hideLoading()
})
},
}
};
</script>
<style scoped lang="scss">
page {
background: #F6F8FA;
}
.container {
border-radius: 0 0 0 40rpx;
position: relative;
padding: 0 28rpx;
.after {
position: absolute;
top: 46rpx;
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);
}
.onecontent {
width: 100%;
margin-top: -86rpx;
position: relative;
height: 172rpx;
background: #FFFFFF;
box-shadow: 0rpx 6rpx 12rpx 2rpx rgba(0, 0, 0, 0.16);
border-radius: 14rpx;
padding: 0 30rpx;
.onecontentone {
image {
width: 108rpx;
height: 108rpx;
background: #FFFFFF;
border: 2rpx solid #707070;
border-radius: 50%;
}
text {
margin-left: 12rpx;
width: 146rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 28rpx;
color: #333333;
}
}
.onecontenttow {
.onecontenttowring {
margin-left: 32rpx;
height: 110rpx;
justify-content: flex-end;
.onecontenttowringone {
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 500;
font-size: 32rpx;
color: #333333;
}
.image {
width: 42rpx;
height: 42rpx;
}
.onecontenttowringtow {
margin-top: 20rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 24rpx;
color: #666666;
}
}
}
}
.towcontent {
margin-top: 48rpx;
position: relative;
width: 100%;
background: #FFFFFF;
box-shadow: 0rpx 6rpx 12rpx 2rpx rgba(0, 0, 0, 0.16);
border-radius: 14rpx 14rpx 14rpx 14rpx;
height: 314rpx;
padding: 0 90rpx 0 120rpx;
&::after {
position: absolute;
content: '';
display: inline-block;
height: 188rpx;
width: 2rpx;
left: 50%;
margin-left: -1rpx;
background: #D8D8D8;
}
.towcontentitem {
.towcontentitemtext {
margin-top: 26rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: bold;
font-size: 32rpx;
color: #333333;
}
}
}
.footer-banner {
margin-top: 48upx;
}
}
</style>

View File

@@ -1,234 +0,0 @@
<template>
<view class="content">
<view class="contentbox">
<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">
</image>
<text class="contentboxitemlefttextone">点餐</text>
<text class="contentboxitemlefttexttow">在线点不排队</text>
</view>
<view class="contentboxitemright">
<view class="contentboxitemright_item flex-between" @click="scanCodehandle(1)">
<image src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/indexs/Xvip.png" mode="aspectFill">
</image>
<view class="contentboxitemright_itembox flex-colum">
<text>会员</text>
<text>入会享权益</text>
</view>
</view>
<view class="contentboxitemright_item flex-between" @click="memberindex(0)">
<image src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/indexs/Xchong.png"
mode="aspectFill"></image>
<view class="contentboxitemright_itembox flex-colum">
<text>充值</text>
<text>充值享更多优惠</text>
</view>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {};
},
props: {
usershopUserinfo: {
type: Object,
default () {
return {
amount: '',
shopName: ""
}
}
},
userInfo: {
type: Object,
default () {
return {}
}
},
},
methods: {
scanCodehandle(i) {
if (i == 0) {
uni.scanCode({
success: (res) => {
let tableCode = this.getQueryString(decodeURIComponent(res.result), 'code')
uni.cache.set('tableCode', tableCode)
if (tableCode) {
uni.pro.navigateTo('order_food/order_food')
}
}
})
} else {
if (this.usershopUserinfo.isVip == 0) {
// 跳转到开通页面
uni.navigateTo({
url: '/pages/member/activatedmemberone?shopId=' + uni.cache.get('shopUser')
})
} else {
uni.pro.navigateTo('member/memberdetails', {
shopId_id: uni.cache.get('shopUser'),
})
}
}
},
memberindex(i) {
if (i == 0) {
if (this.usershopUserinfo.isVip == 0) {
// 跳转到开通页面
uni.navigateTo({
url: '/pages/member/activatedmemberone?shopId=' + uni.cache.get('shopUser')
})
} else {
uni.pro.navigateTo('member/memberdetails', {
shopId_id: uni.cache.get('shopUser'),
})
}
} else {
let data = {
shopName: this.usershopUserinfo.shopName,
amount: this.usershopUserinfo.amount,
shopId: uni.cache.get('shopUser')
}
uni.navigateTo({
url: '/pages/pay_code/pay_code?shopInfo=' + JSON.stringify(data)
})
}
},
getQueryString(url, name) { //解码
var reg = new RegExp('(^|&|/?)' + name + '=([^&|/?]*)(&|/?|$)', 'i')
var r = url.substr(1).match(reg)
if (r != null) {
return r[2]
}
return null;
},
// / 更换头像
onChooseAvatar(e) {
uni.showLoading({
title: '上传中',
mask: true
})
console.log(e.detail.avatarUrl)
let file = e.detail.avatarUrl;
uploadImage(file, 'avatar',
result => {
//将上传后的图片以对象官方要求的格式的形式存入uni-file-picker的value值imageValueimageValue值的结构为数组包对象用于图片回显
// let objAge = {
// 'url': result,
// 'extname': 'png',
// 'name': 'imgss.png'
// };
// this.userlist.avatar.push(objAge)
this.userInfo.avatar = result
console.log(this.userInfo.avatar)
uni.hideLoading()
}, result => {
uni.hideLoading()
})
},
}
};
</script>
<style scoped lang="scss">
page {
background: #F6F8FA;
}
.content {
.contentbox {
position: relative;
width: 100%;
height: 1046rpx;
background: url(https://czg-qr-order.oss-cn-beijing.aliyuncs.com/indexs/shuangbackground.png) no-repeat;
background-size: 100% 100%;
padding: 0 24rpx;
.contentboxitem {
position: absolute;
bottom: 0;
width: 90%;
left: 50%;
transform: translate(-50%, 50%);
padding: 38rpx 0 26rpx 0;
background: rgba(255, 255, 255, 0.98);
box-shadow: 0rpx 6rpx 12rpx 2rpx rgba(0, 0, 0, 0.16);
border-radius: 20rpx 20rpx 20rpx 20rpx;
.contentboxitemleft {
width: 50%;
border-right: 2rpx solid #623618;
image {
width: 134rpx;
height: 134rpx;
}
.contentboxitemlefttextone {
margin-top: 10rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 32rpx;
color: #333333;
}
.contentboxitemlefttexttow {
margin-top: 2rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 24rpx;
color: #999999;
}
}
.contentboxitemright {
width: 50%;
padding: 0 34rpx;
.contentboxitemright_item:nth-child(2) {
margin-top: 30rpx;
}
.contentboxitemright_item {
image {
width: 96rpx;
height: 96rpx;
}
.contentboxitemright_itembox {
width: 170rpx;
text:nth-child(1) {
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 32rpx;
color: #333333;
}
text:nth-child(2) {
margin-top: 2rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 24rpx;
color: #999999;
}
}
}
}
}
}
}
</style>

View File

@@ -1,515 +0,0 @@
<template>
<view class="content">
<!-- 占位符导航栏 -->
<navseat :opacity='opacity' :title='toplist.name' :titleshow='false'></navseat>
<view class="onecontent">
<image class="onecontentimage" :src="toplist.coverImg" mode=""></image>
<view class="onecontentabsolute">
<view class="onecontentabsoluteitem flex-between">
<image src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/index/today/l.png" mode=""></image>
<input :disabled="true" type="text" placeholder="订阅提醒,每日爆品上线不错过" />
<view class="onecontentabsoluteitembotton">
订阅提醒
</view>
</view>
</view>
</view>
<view class="towcontent">
<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 style="margin-top: 20rpx;">
{{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="10"></uni-countdown>
</view>
</view>
</view>
</view>
</view>
</view>
</view>
<u-loadmore height='40' :status="form.status" iconSize='24' fontSize='24' />
</view>
<!-- 小内切圆 -->
<!-- <view class="after"></view> -->
</view>
</template>
<script>
import navseat from '@/components/navseat.vue'
export default {
components: {
navseat
},
data() {
return {
titlename: '今日上新',
opacity: false,
list: [],
toplist: {},
form: {
address: uni.cache.get('getLocationstorage').address, //地址
lng: uni.cache.get('getLocationstorage').lng,
lat: uni.cache.get('getLocationstorage').lat,
type: '', //品类
orderBy: 0, //1.理我最近 2.销量优先 3.价格优先
other: '', //附近1KM 1选中 0不选中
page: 1, //页数
size: 10, //页容量
status: 'loadmore'
},
};
},
onPageScroll(e) {
if (e.scrollTop <= 44) { //搜索导航栏
this.opacity = false
} else {
this.opacity = true
}
},
onLoad(e) {
this.distiricttopCommon()
},
onShow() {
this.onLoadlist()
},
methods: {
async distiricttopCommon() {
let res = await this.api.distiricttopCommon({
type: '', //团购卷品类Id/subShop-预约到店
orderBy: 0
})
console.log(res.data)
if (res.code == 0) {
this.toplist = res.data.carousel[0]
}
},
clickproduct(item) {
uni.pro.navigateTo('product/index',{
id:item.id
})
},
async onLoadlist() {
try {
this.form = {
address: uni.cache.get('getLocationstorage').address, //地址
lng: uni.cache.get('getLocationstorage').lng,
lat: uni.cache.get('getLocationstorage').lat,
type: '', //团购卷品类Id
distanceInKm: '', //默认10 以经纬度为中心 多大范围以内 单位km
orderBy: 0, //0.今日上新 1.离我最近 2.销量优先/热榜推荐 3.价格优先
page: 1, //页数
size: 10, //页容量
status: 'loadmore',
}
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
}
})
console.log(res.data.list)
if (res.data.pages < this.form.page) {
this.form.status = 'nomore'
// if (res.data.pageNum == 1) {
// this.is_end = true
// }
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) {}
},
}
};
</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;
background: url(https://czg-qr-order.oss-cn-beijing.aliyuncs.com/index/today/nav.png) no-repeat;
background-size: cover;
}
.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 {
padding: 0 28rpx;
position: relative;
margin-top: -32rpx;
.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 {
.fivecontent_item_navimage {
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_lefttopstart {
margin-top: 8rpx;
.fivecontent_item_nav_leftlang {
margin-left: 12rpx;
width: max-content;
padding: 4rpx 10rpx;
background: #FFF9E1;
border-radius: 4rpx 4rpx 4rpx 4rpx;
.fivecontent_item_nav_leftlangtext {
margin-left: 6rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 16rpx;
color: #F9A511;
}
.fivecontent_item_nav_leftlangimage {
width: 10.82rpx;
height: 14.06rpx;
}
}
.fivecontent_item_nav_leftlang:nth-child(1) {
margin-left: 0;
}
}
}
}
.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;
}
}
.flexstartboxfttow {
.fivecontent_item_boxitemlefttow {
margin-left: 16rpx;
margin-top: 8rpx;
width: max-content;
padding: 4rpx 10rpx;
background: #FFF9E1;
border-radius: 4rpx 4rpx 4rpx 4rpx;
.fivecontent_item_boxitemlefttowtext {
margin-left: 6rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 16rpx;
color: #F9A511;
}
.fivecontent_item_boxitemlefttowimage {
width: 10.82rpx;
height: 14.06rpx;
}
}
.fivecontent_item_boxitemlefttow:nth-child(1) {
margin-left: 0;
background: #FFD6D7;
border-radius: 4rpx 4rpx 4rpx 4rpx;
}
}
.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;
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;
}
}
}
}
}
}
}
}
.after {
position: absolute;
top: -40rpx;
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);
}
}
</style>

View File

@@ -1,308 +0,0 @@
<template>
<view class="content">
<!-- 占位符导航栏 -->
<navseat :opacity='opacity' :title='toplist.name' :titleshow='false'></navseat>
<view class="onecontent">
<image class="onecontentimage" :src="toplist.coverImg" mode=""></image>
<view class="onecontentabsolute">
</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>
<u-loadmore height='40' :status="form.status" iconSize='24' fontSize='24' />
</view>
<!-- 小内切圆 -->
<!-- <view class="after"></view> -->
</view>
</template>
<script>
import navseat from '@/components/navseat.vue'
export default {
components: {
navseat
},
data() {
return {
titlename: '今日上新',
opacity: false,
list: {},
toplist: {},
form: {
address: '', //地址
type: '', //品类
orderBy: '', //1.理我最近 2.销量优先 3.价格优先
other: '', //附近1KM 1选中 0不选中
page: 1, //页数
size: 10, //页容量
status: 'loadmore'
},
};
},
onPageScroll(e) {
if (e.scrollTop <= 44) { //搜索导航栏
this.opacity = false
} else {
this.opacity = true
}
},
onReachBottom() {
this.onLoadhome()
},
onShow() {
this.init_fn()
this.distiricttopCommon()
},
methods: {
goMap(d) {
uni.openLocation({
longitude: (d.lng * 1),
latitude: (d.lat * 1)
})
// uni.openLocation({
// longitude: uni.cache.get('getLocationstorage').lng,
// latitude: uni.cache.get('getLocationstorage').lat
// })
},
init_fn(e) {
this.list = []
this.form.page = 1 //页数
this.form.size = 10 //页数
this.form.status = 'loadmore' //页数
this.distirictsubShopList()
},
makePhoneCall(item) {
uni.makePhoneCall({
phoneNumber: item.phone //仅为示例
});
},
async distiricttopCommon() {
let res = await this.api.distiricttopCommon({
type: 'subShop', //团购卷品类Id/subShop-预约到店
orderBy: ''
})
if (res.code == 0) {
this.toplist = res.data.carousel[0]
}
},
async distirictsubShopList() {
let res = await this.api.distirictsubShopList({
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: this.form.page, //页数
size: this.form.size, //页容量
})
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)
}
}
}
};
</script>
<style scoped lang="scss">
page {
background: #F9F9F9;
}
.content {
.onecontent {
width: 100%;
height: 460rpx;
position: relative;
.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 24rpx 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;
}
}
}
.after {
position: absolute;
top: -40rpx;
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);
}
}
</style>

View File

@@ -1,89 +0,0 @@
<template>
<view class="content">
<view class="container">
<!-- 建议放在外层 -->
<view class="contentnav">
当前城市
</view>
<!-- 不建议放在层层嵌套的view中除非您清楚知道自己为什么需要这么做 -->
</view>
<u-index-list class="container" :index-list="indexList" style="height: 100%;" @select='clickSelect'
:scrollTop="scrollTop">
<view v-for="(item, index) in itemArr" :key="index" style="height: 100%;">
<!-- #ifdef APP-NVUE -->
<u-index-anchor :id="item.id" :index="item.id" :text="indexList[index]"></u-index-anchor>
<!-- #endif -->
<u-index-item style="height: 100%;">
<!-- #ifndef APP-NVUE -->
<u-index-anchor :id="item.id" :index="item.id" :text="indexList[index]"></u-index-anchor>
<!-- #endif -->
<!-- <view class="list-cell">
{{item.cities}}
</view> -->
<view class="list-cell" v-for="(cell,index1) in item.cities" :key="index1">
{{cell.name}}
</view>
</u-index-item>
</view>
</u-index-list>
</view>
</template>
<script>
import city from '@/common/js/city.json'
export default {
data() {
return {
scrollTop: 0,
indexList: city.alphabet,
itemArr: city.cityList
}
},
methods: {
clickSelect(e) {
//从当前位置到达目标位置
console.log(">>>当前节点", e, this.scrollTop)
try {
uni.createSelectorQuery().select('#' + e).boundingClientRect((data) => {
console.log(">>data", data)
//目标位置的节点类或者id
uni.createSelectorQuery().select('.container').boundingClientRect((res) => {
console.log(data, res)
console.log(">>res.top", res.top)
//最外层盒子的节点类或者id
this.$nextTick(() => {
uni.pageScrollTo({
scrollTop: data.top - res.top,
// selector: '#' + e,
duration: 100 //app端这个必须设置成0
})
})
})
.exec()
})
.exec()
} catch (e) {
}
}
}
}
</script>
<style lang="scss" scoped>
/* 使用>>>来穿透组件边界 */
.content {
.list-cell {
display: flex;
box-sizing: border-box;
width: 100%;
padding: 10px 24rpx;
overflow: hidden;
color: #323233;
font-size: 14px;
line-height: 24px;
background-color: #fff;
}
}
</style>

View File

@@ -1,11 +1,31 @@
<template>
<view class="container">
<view class="box flex-center">
<image src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/drder/Logo" mode=""></image>
</view>
<view class="top_box">
<button class="toLogin" open-type="getPhoneNumber" @getphonenumber="userlogin">快速登录 </button>
<view class="containerbox flex-colum">
<view class="containerimage_logo">
<image class="input_itemone" src="https://ointmentweapp.oss-cn-beijing.aliyuncs.com/manage/login2.png"
mode=""></image>
</view>
<view class="containertext">
微信昵称
</view>
<view class="containerbottom">
<view class="containerbottom_text flex-colum-start">
<text>该程序获得以下授权</text>
<text>获得您的手机号</text>
</view>
<view class="containerbottom_item flex-between">
<navigator class="containerbottomone" open-type="exit" target="miniProgram"><button
class="containerbottomone" open-type="launchApp" app-parameter="wechat"
binderror="launchAppError">
暂不授权
</button></navigator>
<button class="containerbottomtow" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">
确认授权
</button>
</view>
</view>
</view>
</view>
</template>
@@ -13,170 +33,272 @@
export default {
data() {
return {
h: null, //动态高度
types: '', //判断是否是微信扫码点餐进来
};
phone: ''
}
},
mounted() {
this.computed_h();
this.userlogin() // 静默登录
onLoad() {
uni.cache.clear();
},
methods: {
// 静默登录
// userlogin(reslange) {
// uni.login({
// provider: 'weixin',
// success: async (data) => {
// if (data.errMsg == "login:ok") {
// console.log(data.code, '调试-code')
// let res = await this.api.userwxlogins({
// code: data.code,
// // rawData: infoRes.rawData,
// // signature: infoRes.signature,
// // iv: reslange.detail.iv,
// // encryptedData: resdataa.detail.encryptedData
// })
// if (res.code == 0) {}
// // if (uni.cache.get('types') == 'types') {
// // uni.reLaunch({
// // url: '/pages/order_food/order_food'
// // });
// // } else {
// // uni.pro.switchTab('index/index')
// // }
// }
// }
// })
// },
// 正常登录
async userlogin(reslange) {
var resdataa = reslange
// if (resdataa.detail.iv) {
uni.login({
async userlogin() {
// #ifdef MP-WEIXIN || MP-ALIPAY
uni.login({ //alipay weixin
// #ifdef MP-ALIPAY
provider: 'alipay',
// #endif
// #ifdef MP-WEIXIN
provider: 'weixin',
// #endif
success: async (data) => {
try {
uni.getUserInfo({
provider: 'weixin',
success: async (infoRes) => {
console.log(infoRes, 81);
uni.cache.set('weixincode', data.code);
let res = await this.api.userwxlogin({
code: uni.cache.get('weixincode'), //临时登录凭证
encryptedData: infoRes
.encryptedData, // 用户非敏感信息
rawData: infoRes.rawData,
// signature: infoRes.signature,
// iv: infoRes.detail.iv,
// encryptedData: infoRes.detail
// .encryptedData
signature: infoRes.signature,
iv: infoRes.iv,
phone: this.phone
})
if (res.code == 0) {
console.log(res, 88)
uni.cache.set('token', res.data.token);
uni.cache.set('miniAppOpenId', res.data.userInfo
.miniAppOpenId)
uni.cache.set('userInfo', res.data.userInfo);
if (uni.cache.get('types') == 'types') {
uni.reLaunch({
url: '/pages/order_food/order_food'
});
} else {
uni.pro.switchTab('index/index')
}
uni.cache.set('shopUser', res.data.shopUser);
uni.pro.switchTab('index/index')
}
},
fail: (err) => {}
fail: (err) => {
console.log(err)
}
});
} catch (e) {}
// uni.pro.navigateTo('pay_code/pay_code', {
// nickName:userInfo.nickName,
// nickName:userInfo.nickName
// })
// uni.getUserInfo({
// provider: 'weixin',
// success: async (infoRes) => {
// console.log(infoRes, 81);
// // let res = await this.api.userwxlogin({
// // code: uni.cache.get('weixincode'), //临时登录凭证
// // rawData: '', // 用户非敏感信息
// // rawData: '' // 签名
// // })
// // if (res) {
// // console.log(res, 88)
// // }
// },
// fail: (err) => {
// console.log(err)
// }
// });
} catch (e) {
console.log(e)
}
}
});
// } else {
// uni.showToast({
// title: '获取手机号失败!请重新获取',
// icon: 'none'
// });
// }
// #endif
},
async computed_h() {
//获取div宽度
let content_Icon = await uni.utils.info_distance('box');
let system_info = await uni.getSystemInfo();
let h = null;
h = system_info.windowHeight - content_Icon.height + 'px';
this.h = {
height: h
};
},
}
};
</script>
async getPhoneNumber(res) { // 获取手机号
var resdataa = res
console.log(res)
// #ifdef MP-WEIXIN
uni.login({
provider: 'weixin',
success: async (data) => {
let resdata = await this.api.logingetPhoneNumber({
code: data.code,
iv: resdataa.detail.iv,
encryptedData: resdataa.detail.encryptedData
})
console.log(resdata)
if (resdata.data) {
this.phone = resdata.data
this.userlogin()
}
// this.userlogin()
}
});
// #endif
// #ifdef MP-WEIXIN
// #endif
},
},
}
</script>
<style lang="scss">
page {
width: 100%;
height: 100%;
background: #FFFFFF;
background: #F9F9F9;
}
button {}
.container {
// position: relative;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100vh;
overflow: hidden;
position: relative;
.box {
// padding-top: 110rpx;
position: fixed;
top: 110rpx;
left: 50%;
z-index: 22;
transform: translateX(-50%);
image {
width: 128rpx;
height: 128rpx;
}
}
.top_box::after {
position: absolute;
// content: url(@/static/icon.png);
width: 282rpx;
height: 280rpx;
top: -240rpx;
right: 32rpx;
z-index: 2;
}
.top_box {
z-index: 9;
padding: 0 64rpx;
box-sizing: border-box;
.containerbox {
position: relative;
width: 100%;
position: fixed;
display: flex;
flex-direction: column;
align-items: center;
background: #ffffff;
border-radius: 40rpx 40rpx 0px 0px;
top: 220rpx;
.toLogin {
margin-top: 212rpx;
width: 100%;
background: #F1CB66;
border-radius: 12rpx 12rpx 12rpx 12rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 500;
font-size: 32rpx;
color: #333333;
height: 84rpx;
line-height: 84rpx;
text-align: center;
border: none;
.containerimage_logo {
margin-top: 66rpx;
border-radius: 50%;
width: 120rpx;
height: 120rpx;
image {
width: 100%;
height: 100%;
}
}
.containertext {
margin-top: 32rpx;
font-size: 28rpx;
}
.containerbottom {
margin-top: 40rpx;
border-top: 1px solid #ccc;
width: 100%;
padding: 0 28rpx;
.containerbottom_text {
margin-top: 32rpx;
text:nth-child(1) {
font-size: 28rpx;
}
text:nth-child(2) {
font-size: 24rpx;
color: #847f7f;
}
}
.containerbottom_item {
margin-top: 60rpx;
.containerbottomone {
padding: 10rpx 60rpx;
font-size: 24rpx;
}
.containerbottomone::after {
background: none;
border: 1px solid #000;
}
.containerbottomtow {
font-size: 24rpx;
background: #baf505;
border: none;
padding: 10rpx 60rpx;
}
.containerbottomtow::after {
background: none;
border: none;
}
}
}
}
.wrapper {
position: relative;
top: -118rpx;
z-index: 90;
padding: 0 28rpx;
.wrapper_box {
width: 100%;
background: #FFFFFF;
border-radius: 32rpx;
padding: 16rpx 30rpx;
.input_content {
.input_item {
margin-top: 32rpx;
.input_itemone {
width: 49.68rpx;
height: 49.68rpx;
}
.input_itemtow {
position: relative;
flex: auto;
margin-left: 16rpx;
.input_itemtowicon {
position: absolute;
right: 0;
bottom: 20rpx;
z-index: 999;
}
.tit {
font-size: 32rpx;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
color: #333333;
}
input {
width: 100%;
padding: 10rpx 0;
border-bottom: 2rpx solid rgba(229, 229, 229, 0.7);
font-size: 28rpx;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
color: #999999;
}
}
}
}
.agreement {
margin-top: 24rpx;
font-size: 20rpx;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
color: #7c8e97;
.agreement-Item {
color: #4ca1fc;
}
}
.confirm-button {
margin: 40rpx auto 50rpx auto;
width: 90%;
background: #2F87FD;
padding: 28rpx 0;
border-radius: 50rpx;
text-align: center;
box-shadow: 0px 6rpx 12rpx 2rpx rgba(0, 0, 0, 0.16);
font-size: 36rpx;
font-family: Source Han Sans CN-Bold, Source Han Sans CN;
font-weight: bold;
color: #FFFFFF;
}
}
}
}

View File

@@ -1,280 +0,0 @@
<template>
<view class="container">
<view class="containerbox flex-colum">
<view class="containerimage_logo">
<image class="input_itemone" src="https://ointmentweapp.oss-cn-beijing.aliyuncs.com/manage/login2.png"
mode=""></image>
</view>
<view class="containertext">
微信昵称
</view>
<view class="containerbottom">
<view class="containerbottom_text flex-colum-start">
<text>该程序获得以下授权</text>
<text>获得您的手机号</text>
</view>
<view class="containerbottom_item flex-between">
<navigator class="containerbottomone" open-type="exit" target="miniProgram"><button
class="containerbottomone" open-type="launchApp" app-parameter="wechat"
binderror="launchAppError">
暂不授权
</button></navigator>
<button class="containerbottomtow" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">
确认授权
</button>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
phone: ''
}
},
onLoad() {
uni.cache.clear();
},
methods: {
async userlogin() {
// #ifdef MP-WEIXIN || MP-ALIPAY
uni.login({ //alipay weixin
// #ifdef MP-ALIPAY
provider: 'alipay',
// #endif
// #ifdef MP-WEIXIN
provider: 'weixin',
// #endif
success: async (data) => {
try {
uni.getUserInfo({
provider: 'weixin',
success: async (infoRes) => {
console.log(infoRes, 81);
uni.cache.set('weixincode', data.code);
let res = await this.api.userwxlogin({
code: uni.cache.get('weixincode'), //临时登录凭证
encryptedData: infoRes
.encryptedData, // 用户非敏感信息
rawData: infoRes.rawData,
signature: infoRes.signature,
iv: infoRes.iv,
phone: this.phone
})
if (res.code == 0) {
console.log(res, 88)
uni.cache.set('token', res.data.token);
uni.cache.set('miniAppOpenId', res.data.userInfo
.miniAppOpenId)
uni.cache.set('userInfo', res.data.userInfo);
uni.pro.switchTab('index/index')
}
},
fail: (err) => {
console.log(err)
}
});
} catch (e) {
console.log(e)
}
}
});
// #endif
},
async getPhoneNumber(res) { // 获取手机号
var resdataa = res
console.log(res)
// #ifdef MP-WEIXIN
uni.login({
provider: 'weixin',
success: async (data) => {
let resdata = await this.api.logingetPhoneNumber({
code: data.code,
iv: resdataa.detail.iv,
encryptedData: resdataa.detail.encryptedData
})
console.log(resdata)
if (resdata.data) {
this.phone = resdata.data
this.userlogin()
}
// this.userlogin()
}
});
// #endif
// #ifdef MP-WEIXIN
// #endif
},
},
}
</script>
<style lang="scss">
page {
background: #F9F9F9;
}
button {}
.container {
position: relative;
.containerbox {
position: relative;
width: 100%;
.containerimage_logo {
margin-top: 66rpx;
border-radius: 50%;
width: 120rpx;
height: 120rpx;
image {
width: 100%;
height: 100%;
}
}
.containertext {
margin-top: 32rpx;
font-size: 28rpx;
}
.containerbottom {
margin-top: 40rpx;
border-top: 1px solid #ccc;
width: 100%;
padding: 0 28rpx;
.containerbottom_text {
margin-top: 32rpx;
text:nth-child(1) {
font-size: 28rpx;
}
text:nth-child(2) {
font-size: 24rpx;
color: #847f7f;
}
}
.containerbottom_item {
margin-top: 60rpx;
.containerbottomone {
padding: 10rpx 80rpx;
font-size: 24rpx;
}
.containerbottomone::after {
background: none;
border: 1px solid #000;
}
.containerbottomtow {
font-size: 24rpx;
background: #baf505;
border: none;
padding: 10rpx 80rpx;
}
.containerbottomtow::after {
background: none;
border: none;
}
}
}
}
.wrapper {
position: relative;
top: -118rpx;
z-index: 90;
padding: 0 28rpx;
.wrapper_box {
width: 100%;
background: #FFFFFF;
border-radius: 32rpx;
padding: 16rpx 30rpx;
.input_content {
.input_item {
margin-top: 32rpx;
.input_itemone {
width: 49.68rpx;
height: 49.68rpx;
}
.input_itemtow {
position: relative;
flex: auto;
margin-left: 16rpx;
.input_itemtowicon {
position: absolute;
right: 0;
bottom: 20rpx;
z-index: 999;
}
.tit {
font-size: 32rpx;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
color: #333333;
}
input {
width: 100%;
padding: 10rpx 0;
border-bottom: 2rpx solid rgba(229, 229, 229, 0.7);
font-size: 28rpx;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
color: #999999;
}
}
}
}
.agreement {
margin-top: 24rpx;
font-size: 20rpx;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
color: #7c8e97;
.agreement-Item {
color: #4ca1fc;
}
}
.confirm-button {
margin: 40rpx auto 50rpx auto;
width: 90%;
background: #2F87FD;
padding: 28rpx 0;
border-radius: 50rpx;
text-align: center;
box-shadow: 0px 6rpx 12rpx 2rpx rgba(0, 0, 0, 0.16);
font-size: 36rpx;
font-family: Source Han Sans CN-Bold, Source Han Sans CN;
font-weight: bold;
color: #FFFFFF;
}
}
}
}
</style>

View File

@@ -1,375 +0,0 @@
<template>
<view class="container">
<view class="box flex-colum-start">
<text>您好</text>
<text>欢迎使用零点八零</text>
</view>
<view class="top_box" :style="h">
<view class="top_box_one">
<text class="top_box_one_text">用户昵称</text>
<input type="text" v-model="form.nickName" placeholder="请输入用户昵称" data-key="mobile" />
</view>
<view class="top_box_one">
<text class="top_box_one_text">手机号码</text>
<input type="text" v-model="form.telephone" placeholder="请输入手机号码" data-key="mobile" />
</view>
<view class="top_box_one">
<text class="top_box_one_text">密码</text>
<input type="mobile" v-model="form.password" placeholder="8-16位密码" maxlength="16"
:password="!showPassword" />
<view class="repeat" @click="display">
<u-icon name="eye" v-if="showPassword"></u-icon>
<u-icon v-else name="eye-off"></u-icon>
</view>
</view>
<view class="top_box_one">
<text class="top_box_one_text">验证码</text>
<input type="mobile" v-model="form.code" placeholder="请输入短信验证码" maxlength="6" />
<view class="repeats">
<view v-if="showText == true" class="yzm"
style="padding: 8rpx 16rpx 6rpx 16rpx; background: #288efb; border-radius: 15rpx"
@click="CodeRegister">
{{ Recapture }}
</view>
<view v-else
style="color: #ccc; background-color: #f9f9f9; padding: 8rpx 16rpx 6rpx 16rpx; border-radius: 15rpx">
{{ second }}s重新发送</view>
</view>
</view>
<!-- <view class="top_box_one">
<text class="top_box_one_text" @click="showTips">
邀请码选填
<uni-icons type="help" size="18"></uni-icons>
</text>
<input type="mobile" v-model="form.inviteCode" placeholder="请输入邀请人邀请码" />
</view> -->
<view class="Register" @click="Register">注册</view>
<view class="agreement flex-start">
<u-checkbox-group><u-checkbox shape="circle" @change="radioChange"
size="12"></u-checkbox></u-checkbox-group>
<text>阅读并同意银收客</text>
<view class="agreement-Item" @click="Privacy(1)">用户协议</view>
<view class="agreement-Item" @click="Privacy(3)">隐私政策</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
radioChangeItem: false, //单选框
h: null,
showPassword: false,
// 注册定时器 初始值
second: 60,
showText: true,
Recapture: '发送验证码',
form: {
nickName: '',
telephone: '',
password: '',
code: '',
inviteCode: ''
}
};
},
mounted() {
this.computed_h();
},
onLoad() {},
methods: {
showTips() {
uni.showModal({
title: '注意',
content: '若该邀请码的用户无推广权限,将自动绑定到其上级名下',
showCancel: false
});
},
leftClick() {
uni.navigateBack();
},
async CodeRegister() {
//发起验证码
if (this.form.telephone == null || this.form.telephone == '') {
uni.showToast({
title: '请输入电话号码',
icon: 'none'
});
return false;
}
const res = await this.api.phoneValidateCode({
// post 手机验证码
phone: this.form.telephone
});
console.log(res);
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);
}
},
radioChange(n) {
//是否同意
console.log(n);
this.radioChangeItem = n;
},
display() {
// 切换密码显示隐藏
this.showPassword = !this.showPassword;
},
async Privacy(e) {
if (e == 1) {
//用户协议
let res = await this.api.agreementgetAgreementOne({
discern: 0
});
uni.pro.navigateTo('my/about/agreement', {
discern: 0,
list: res.data.content
});
} else {
let res3 = await this.api.agreementgetAgreementOne({
discern: 3
});
uni.pro.navigateTo('my/about/agreement', {
discern: 3,
list: res3.data.content
});
}
},
async computed_h() {
//获取div宽度
let content_Icon = await uni.utils.info_distance('box');
let content_top_box = await uni.utils.info_distance('top_box');
let system_info = await uni.getSystemInfo();
var h_ = null;
if (content_Icon.height + content_top_box.height > system_info.windowHeight) {
console.log(135);
h_ = content_top_box.height + 30 + 'px';
} else {
h_ = system_info.windowHeight - content_Icon.height + 'px';
}
this.h = {
height: h_
};
},
async Register() {
//注册
if (this.form.nickName == null || this.form.nickName == '') {
uni.showToast({
title: '请输入用户昵称',
icon: 'none'
});
return false;
}
if (this.form.telephone == null || this.form.telephone == '') {
uni.showToast({
title: '请输入电话号码',
icon: 'none'
});
return false;
}
if (this.form.password == null || this.form.password == '' || uni.$u.trim(this.form.password, 'all') ==
'') {
uni.showToast({
title: '请输入密码或密码不能输入空格',
icon: 'none'
});
return false;
}
if (this.form.code == null || this.form.code == '') {
uni.showToast({
title: '请输入验证码',
icon: 'none'
});
return false;
}
if (this.radioChangeItem == false) {
uni.showToast({
icon: 'none',
title: '请先阅读《用户协议》和《隐私政策》'
});
return;
}
let res = await this.api.cashierServiceloginregister({
telephone: this.form.telephone,
nickName: this.form.nickName,
password: this.form.password,
code: this.form.code,
// inviteCode: this.form.inviteCode,
source: 'promoter'
});
if (res) {
setTimeout((res) => {
uni.showToast({
title: '注册成功',
icon: 'none',
success: () => {
uni.navigateTo({
url: '../login/login'
});
}
});
}, 1500);
// uni.cache.set('storage:authorization', res.data.auth_token);
// this.$store.commit('set_login', true);
// uni.pro.switchTab('index/index');
}
// if (result.status === 1) {
// this.login(result.data);
// uni.navigateBack();
// } else {
// this.$api.msg(result.msg);
// this.logining = false;
// }
}
}
};
</script>
<style lang="scss">
page {
width: 100%;
background: linear-gradient(104deg, #4679ff 0%, #2868e8 47%, #2a94fc 100%);
}
.container {
position: relative;
.top {
position: absolute;
left: 64rpx;
.u-navbar--fixed {
top: 88rpx;
}
}
.box {
padding-top: 228rpx;
padding-left: 64rpx;
padding-bottom: 144rpx;
text {
font-size: 40rpx;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
color: #ffffff;
}
}
.top_box::after {
position: absolute;
// content: url(@/static/icon.png);
width: 282rpx;
height: 280rpx;
top: -240rpx;
right: 32rpx;
z-index: 2;
}
.top_box {
position: relative;
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
align-items: center;
background: #ffffff;
border-radius: 40rpx 40rpx 0px 0px;
.top_box_one {
position: relative;
width: 85%;
margin-top: 64rpx;
border-bottom: 6rpx solid #e5e5e5;
.top_box_one_text {
display: flex;
align-items: center;
font-size: 36rpx;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
color: #333333;
}
input {
padding: 18rpx 0 20rpx 0;
}
.repeat {
position: absolute;
bottom: 26rpx;
right: 0;
width: 25rpx;
height: 17rpx;
}
.repeats {
position: absolute;
bottom: 26rpx;
right: 0;
font-size: 24rpx;
z-index: 9;
font-family: $uni_family;
font-weight: 400;
color: #ffffff;
border-radius: 12rpx;
}
}
.top_box_tow {
width: 85%;
text {
margin-top: 34rpx;
font-size: 24rpx;
font-family: $uni_family;
font-weight: 400;
color: #666666;
}
}
.Register {
width: 75%;
margin-top: 112rpx;
padding: 10rpx 0;
text-align: center;
background: #288efb;
border-radius: 40rpx 40rpx 40rpx 40rpx;
font-size: 36rpx;
font-family: $uni_family;
font-weight: 400;
color: #ffffff;
}
.agreement {
margin-top: 14rpx;
font-size: 20rpx;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
color: #7c8e97;
.agreement-Item {
color: #4ca1fc;
}
}
}
}
</style>

View File

@@ -14,7 +14,7 @@
</view>
<view class="item" @click="goMap">
<text class="t" style="margin-right: 12upx">门店地址{{shopInfo.address || '无'}}</text>
<!-- <u-icon :name="require('@/static/icon_address.png')"></u-icon> -->
<u-icon :name="require('@/static/icon_address.png')"></u-icon>
</view>
<!-- <view class="item">
<text class="t undline">点击查看近期预约</text>
@@ -27,6 +27,7 @@
export default {
data() {
return {
shopUser: {},
userInfo: {},
shopInfo:{}
};
@@ -61,11 +62,16 @@
},
async loginwxuserInfo() {
let res = await this.api.loginwxuserInfo({
userId: uni.cache.get('userInfo').id
userId: uni.cache.get('userInfo').id,
shopId: uni.cache.get('shopUser').shopId
})
if (res.code == 0) {
uni.cache.set('userInfo', res.data);
uni.cache.set('userInfo', res.data.userInfo);
uni.cache.set('shopUser', res.data.shopUser);
uni.cache.set('shopInfo', res.data.shopInfo);
this.shopUser = uni.cache.get('shopUser')
this.userInfo = uni.cache.get('userInfo')
this.shopInfo = uni.cache.get('shopInfo')
}
},
makePhoneCall(e) {

View File

@@ -1,79 +0,0 @@
<template>
<view>
<image src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/wkthuiyuanbg.png" class="imgstyle" mode=""></image>
<button class="btnclass" open-type="getPhoneNumber" @getphonenumber="sumbit">立即开通 </button>
</view>
</template>
<script>
export default {
data() {
return {
shopId: "",
switchdata: true, // 绑定后
}
},
onLoad(e) {
this.shopId = e.shopId
},
onUnload() {
if (this.switchdata) {
uni.navigateBack()
}
},
methods: {
sumbit(d) {
if (d.detail.iv) {
uni.login({
provider: 'weixin',
success: async (data) => {
let res = await this.api.userwxlogins({
code: data.code,
encryptedData: d.detail.encryptedData,
iv: d.detail.iv,
shopId: this.shopId
})
if (res.code == 0) {
let resdata = await this.api.loginwxuserInfo({
userId: uni.cache.get('userInfo').id
})
if (resdata.code == 0) {
this.switchdata = false
uni.cache.set('userInfo', resdata .data);
uni.pro.redirectTo('/pages/member/index', {
shopId: uni.cache.get('shopUser')
})
}
}
}
})
}
}
}
}
</script>
<style scoped lang="less">
.imgstyle {
width: 694rpx;
height: 414rpx;
margin: 70rpx auto;
}
.btnclass {
width: 694rpx;
height: 90rpx;
line-height: 90rpx;
background: #6D89A4;
border-radius: 12rpx 12rpx 12rpx 12rpx;
text-align: center;
margin: auto;
font-family: PingFang SC, PingFang SC;
font-weight: bold;
font-size: 36rpx;
color: #FFFFFF;
}
</style>

View File

@@ -1,180 +0,0 @@
<template>
<!-- 账单明细 -->
<view>
<view class="bild">
<view class="bildLeft">
<text>我的余额</text>
<view>{{info.amount}}</view>
</view>
<view class="bildRight">
<text>我的积分</text>
<view>{{info.levelConsume}}</view>
</view>
</view>
<view class="navTop">
<view @click="clickEvent(1)" :class="[active==1?'fonts':'']">
余额明细
<view :class="[active==1?'xian':'']" style="left: 36rpx;"> </view>
</view>
<view @click="clickEvent(2)" :class="[active==2?'fonts':'']">
积分明细
<view :class="[active==2?'xian':'']" style="left: 36rpx;"> </view>
</view>
</view>
<view class="listStyle" v-for="(item,i) in list" :key="i">
<!-- <image :src="require('')" style="width: 76rpx;height: 76rpx;float: left;" mode=""></image> -->
<view class="listrigth">
<view>{{item.biz_name}}</view>
<view :class="[item.type == '+'?'colorStyle':'']">{{item.type}}{{item.amount}}
</view>
</view>
<view class="listrigth2">
<view>{{$u.timeFormat(item.create_time, 'yyyy-mm-dd hh:MM:ss')}}</view>
<view>余额:{{item.balance}}</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
active: 1,
list: [],
form: {
page: 1,
pageSize: 10,
memberId: null
},
info: null
}
},
onLoad(e) {
this.info = e
this.form.memberId = e.memberId
this.getlist()
},
onReachBottom() {
this.getlist()
},
methods: {
// 检测是否包含In
checkIn(str) {
let reg = RegExp(/In/)
return str.match(reg)
},
async getlist() {
if (this.active == 1) {
let res = await this.api.queryMemberAccount(this.form)
if (res.code == 0) {
if (this.form.page == 1) {
this.list = res.data.list
} else {
this.form.page++
this.list.push(res.data.list)
}
}
} else {
this.list = []
}
},
clickEvent(i) {
this.active = i
this.getlist()
}
}
}
</script>
<style scoped lang="less">
.bild {
height: 320rpx;
background-image: url('https://czg-qr-order.oss-cn-beijing.aliyuncs.com/drder/czmxbg.png');
background-size: 750rpx 320rpx;
display: flex;
justify-content: space-around;
align-items: center;
.bildLeft,
.bildRight {
font-weight: 400;
font-size: 32rpx;
>view,
>text {
text-align: center;
color: #333;
}
>view {
margin-top: 34rpx;
font-weight: bold;
}
}
}
.navTop {
display: flex;
justify-content: space-around;
align-items: center;
color: #333;
margin-top: -60rpx;
padding: 0 120rpx;
.fonts {
font-size: 34rpx;
}
>view {
position: relative;
.xian {
width: 58rpx;
height: 6rpx;
background: #FFAA62;
border-radius: 2rpx 2rpx 2rpx 2rpx;
position: absolute;
bottom: -16rpx;
}
}
}
.listStyle {
padding: 28rpx;
padding-top: 50rpx;
width: 100%;
.listrigth,
.listrigth2 {
display: flex;
justify-content: space-between;
align-items: center;
// padding-left: 32rpx;
}
.listrigth {
.colorStyle {
color: #FF7127;
}
>view {
font-weight: bold;
font-size: 32rpx;
color: #333333;
}
}
.listrigth2 {
margin-top: 6rpx;
>view {
font-weight: 500;
font-size: 24rpx;
color: #666666;
}
}
}
</style>

View File

@@ -1,169 +0,0 @@
<template>
<view class="towcontentitem">
<view class="towcontentitemone flex-start">
<image class="towcontentitemoneimage" :src="userInfo.logo" mode="aspectFill"></image>
<view class="towcontentitemonetext flex-colum-start">
<text class="towcontentitemonetextone">{{userInfo.shopName || '暂无昵称'}}</text>
</view>
</view>
<view class="towcontentitemthere flex-start">
余额<text class="towcontentitemtheretext">{{userInfo.amount || '0.00'}}</text>
</view>
<view class="towcontentitemtow flex-between">
<text class="towcontentitemtowetext">VIP{{userInfo.code || '无'}}</text>
</view>
<view class="towcontentitevip">
VIP{{userInfo.isVip||''}}
</view>
<image src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/drder/erweima.png" class="imgStyle" mode=""
@click="clickEvent"></image>
</view>
</template>
<script>
export default {
props: ['userInfo'],
data() {
return {}
},
mounted() {
console.log(this.userInfo, '调试1113')
},
methods: {
clickEvent() {
if (this.userInfo.amount) {
uni.navigateTo({
url: '/pages/pay_code/pay_code?shopInfo=' + JSON.stringify(this.userInfo)
})
}
}
}
}
</script>
<style lang="scss" scoped>
.towcontentitem {
width: 100%;
position: relative;
padding: 32rpx;
border-radius: 12rpx;
background: linear-gradient(126deg, #FFFBF2 0%, #F2D093 100%);
border-radius: 12rpx 12rpx 12rpx 12rpx;
&::after {
position: absolute;
bottom: 0;
right: 68rpx;
content: '';
display: inline-block;
width: 240rpx;
height: 232rpx;
background: url(https://czg-qr-order.oss-cn-beijing.aliyuncs.com/member.png) no-repeat;
background-size: 100% 100%;
}
.towcontentitemimage {
top: 0;
left: 0;
position: absolute;
width: 100%;
height: 100%;
border-radius: 12rpx;
z-index: 5;
}
.towcontentitemone {
width: 100%;
position: relative;
z-index: 9;
.towcontentitemoneimage {
width: 76rpx;
height: 76rpx;
border-radius: 50%;
}
.towcontentitemonetext {
height: 76rpx;
margin-left: 16rpx;
.towcontentitemonetextone {
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 500;
font-size: 36rpx;
color: #333333;
}
.towcontentitemonetexttow {
font-size: 24rpx;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
font-weight: 400;
color: #422A07;
}
}
}
.towcontentitemprogressa {
padding: 8rpx 44rpx;
z-index: 10;
position: relative;
margin-top: 54rpx;
}
.towcontentitemtow {
margin-top: 84rpx;
z-index: 10;
font-size: 24rpx;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
font-weight: 400;
color: #422A07;
}
.towcontentitevip {
position: absolute;
right: 0;
top: 0;
width: 92rpx;
height: 40rpx;
font-size: 20rpx;
background: #F4C380;
border-radius: 0rpx 12rpx 0rpx 12rpx;
text-align: center;
line-height: 40rpx;
color: #fff;
font-family: Source Han Sans CN-Medium;
font-weight: Medium;
}
.towcontentitemthere {
margin-left: 92rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: Medium;
font-size: 24rpx;
color: #333333;
display: flex;
align-items: center;
.towcontentitemtheretext {
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: bold;
font-size: 36rpx;
color: #333333;
}
}
}
.imgStyle {
width: 54rpx;
height: 52rpx;
position: absolute;
right: 50rpx;
bottom: 30rpx;
// border: 2px solid #fff;
z-index: 666;
}
</style>

View File

@@ -1,6 +1,26 @@
<template>
<view class="content">
<card :userInfo="userInfo"></card>
<view class="towcontentitem">
<image class="towcontentitemimage" src="@/static/recharges.png" mode="widthFix"></image>
<view class="towcontentitemone flex-start">
<image class="towcontentitemoneimage" :src="userInfo.avatar" mode="aspectFill"></image>
<view class="towcontentitemonetext flex-colum-start">
<text class="towcontentitemonetextone">{{userInfo.nickName || '暂无昵称'}}</text>
</view>
</view>
<view class="towcontentitemprogress">
<!-- 可用余额:{{memberlist.money || '0.00'}}
<text style="font-size: 16rpx; color:#000 ; margin-left: 10rpx;">冻结金额:{{memberlist.freeze_money}}</text>
<view class="towcontentitemoneabsolute">
加购
</view> -->
</view>
<view class="towcontentitemtow flex-between">
<text class="towcontentitemtowetext">{{memberlist.vip_number}}</text>
<!-- <text class="towcontentitemtowetext" style="color: #fff;">保洁清洗卡</text> -->
</view>
</view>
<view class="therecontent">
<input type="number" v-model="amount" placeholder="自定义金额">
</view>
@@ -8,65 +28,47 @@
<view class="fourcontentlnage" v-for="(item,index) in listdata" :key="index">
<view class="flex-colum" :class="index == inputshow?'fourcontentitems':'fourcontentitem'"
@click="clickinput(item,index)">
<text>{{item.minNum}}</text>
<text style="margin-top: 10rpx;">{{item.minNum}}{{item.handselNum}}</text>
<text>{{item.amount}}</text>
<!-- <text style="margin-top: 10rpx;">{{item.deliver}}</text> -->
</view>
</view>
</view>
<view class="fivecontent" @tap="$u.debounce(userbalancerechangesub, 500)">
<view class="fivecontent" @click="userbalancerechangesub">
立即充值
</view>
</view>
</template>
<script>
import card from './components/card.vue'
export default {
components: {
card
},
data() {
return {
inputshow: 0,
listdata: [],
memberlist: {},
listdata: [{
amount: 100
},{
amount: 200
},{
amount:300
},{
amount:400
},{
amount:500
},{
amount:1000
}
],
amount: '',
userInfo: {},
shopId: ''
shopUser: {},
userInfo: {}
}
},
onLoad(e) {
this.shopId = e.shopId
if (e.type == 'list') { //从列表进来的
this.paygetShopByMember(e.shopId)
} else {
this.paygetShopByMember(e.shopId)
}
this.paygetActive(e.shopId) //列表
this.shopUser = uni.cache.get('shopUser')
this.userInfo = uni.cache.get('userInfo')
},
methods: {
async paygetShopByMember(w) {
let res = await this.api.paygetShopByMember({
page: 1,
pageSize: 10,
userId: uni.cache.get('userInfo').id,
shopId: this.shopId
})
this.userInfo = res.data.list[0]
},
async paygetActive() {
let res = await this.api.paygetActive({
shopId: this.shopId,
page: 1,
pageSize: 10
})
try {
this.listdata = res.data.list
this.amount = res.data.list[0].minNum
} catch (e) {
//TODO handle the exception
}
},
async userbalancerechangesub() {
if (this.amount == null || this.amount == '') {
uni.showToast({
@@ -76,44 +78,47 @@
return false;
}
let res = await this.api.paymemeberIn({
shopId: this.shopId, // 判断显示哪家的作品,
shopId: uni.cache.get('shopUser').shopId, // 判断显示哪家的作品,
amount: this.amount // 判断显示哪家的作品,
})
if (res.code == 0) {
uni.showLoading({
title: '加载中',
mask: true
})
if (res) {
// #ifdef MP-WEIXIN
uni.requestPayment({
provider: 'wxpay', //支付类型-固定值
partnerid: res.data.appId, // 微信支付商户号
timeStamp: res.data.timeStamp, // 时间戳(单位:秒)
nonceStr: res.data.nonceStr, // 随机字符串
package: res.data.package, // 固定值
signType: res.data.signType, //固定值
partnerid: res.data.payAppId, // 微信支付商户号
timeStamp: res.data.payTimeStamp, // 时间戳(单位:秒)
nonceStr: res.data.paynonceStr, // 随机字符串
package: res.data.payPackage, // 固定值
signType: res.data.paySignType, //固定值
paySign: res.data.paySign, //签名
success: (res) => {
uni.showToast({
title: "支付成功"
})
uni.hideLoading()
setTimeout(res => {
uni.navigateBack()
}, 500)
uni.navigateBack()
},
fail: (res) => {
uni.hideLoading()
fail: (err) => {
setTimeout(res => {
uni.showToast({
icon: 'none',
title: '支付失败'
})
uni.hideLoading()
}, 2000)
}
});
uni.hideLoading()
// #endif
}
},
clickinput(a, b) {
console.log(a, b)
this.inputshow = b
this.amount = a.minNum
this.amount = a.amount
},
eeInfo(e) {
uni.pro.navigateTo('my/member/memberinfo', {
id: e,
})
},
}
}
@@ -132,19 +137,21 @@
position: relative;
padding: 32rpx;
border-radius: 12rpx;
background: linear-gradient(126deg, #FFFBF2 0%, #F2D093 100%);
border-radius: 12rpx 12rpx 12rpx 12rpx;
&::after {
.fourcontentitemabsolute {
z-index: 9;
position: absolute;
bottom: 0;
right: 68rpx;
content: '';
display: inline-block;
width: 240rpx;
height: 232rpx;
background: url(https://czg-qr-order.oss-cn-beijing.aliyuncs.com/member.png) no-repeat;
background-size: 100% 100%;
right: 0;
top: 0;
padding: 6rpx 28rpx;
font-size: 20rpx;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
color: #FFFFFF;
text-shadow: 0px 6rpx 12rpx rgba(255, 255, 255, 0.19);
background: linear-gradient(NaNdeg, #4A4A4A 0%, #919191 100%);
border-radius: 0px 12rpx 0px 12rpx;
opacity: 1;
}
.towcontentitemimage {
@@ -158,6 +165,7 @@
}
.towcontentitemone {
margin-top: 42rpx;
width: 100%;
position: relative;
z-index: 9;
@@ -175,10 +183,10 @@
margin-left: 16rpx;
.towcontentitemonetextone {
font-family: Source Han Sans CN, Source Han Sans CN;
font-size: 32rpx;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
font-size: 36rpx;
color: #333333;
color: #422A07;
}
.towcontentitemonetexttow {
@@ -198,46 +206,44 @@
margin-top: 54rpx;
}
.towcontentitemtow {
margin-top: 84rpx;
.towcontentitemprogress {
z-index: 10;
position: relative;
margin-top: 24rpx;
border-radius: 28rpx;
font-size: 32rpx;
height: 56rpx;
line-height: 56rpx;
font-family: Source Han Sans CN-Bold, Source Han Sans CN;
font-weight: bold;
color: #333;
.towcontentitemoneabsolute {
position: absolute;
padding: 0 44rpx;
height: 56rpx;
line-height: 56rpx;
top: 0;
right: 0;
font-size: 28rpx;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
color: #FFFFFF;
background: linear-gradient(130deg, #F4AE46 0%, #EE9437 100%);
box-shadow: 0px 4rpx 8rpx 2rpx rgba(243, 169, 67, 0.37);
border-radius: 28rpx;
}
}
.towcontentitemtow {
z-index: 10;
position: relative;
margin-top: 42rpx;
font-size: 24rpx;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
font-weight: 400;
color: #422A07;
}
.towcontentitevip {
position: absolute;
right: 0;
top: 0;
width: 92rpx;
height: 40rpx;
font-size: 20rpx;
background: #F4C380;
border-radius: 0rpx 12rpx 0rpx 12rpx;
text-align: center;
line-height: 40rpx;
color: #fff;
font-family: Source Han Sans CN-Medium;
font-weight: Medium;
}
.towcontentitemthere {
margin-left: 92rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: Medium;
font-size: 24rpx;
color: #333333;
.towcontentitemtheretext {
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: bold;
font-size: 36rpx;
color: #333333;
}
}
}
.therecontent {
@@ -283,7 +289,7 @@
text-align: center;
background: #FFFFFF;
border-radius: 8rpx;
// border: 1rpx solid #333333;
border: 1rpx solid #333333;
font-size: 28rpx;
font-family: Roboto-Medium, Roboto;
font-weight: 500;
@@ -308,8 +314,6 @@
}
.fivecontent {
position: relative;
bottom: 44rpx;
margin-top: 62rpx;
padding: 20rpx 0;
text-align: center;

View File

@@ -1,188 +0,0 @@
<template>
<view class="content">
<view class="onecontentone">
我的会员卡<text v-if="list.length!=0">({{list.length}})</text>
</view>
<view class="flex-colum">
<view class="towcontentitem" v-if="list.length>0" v-for="(item,index) in list" :key="index"
@click="eeInfo(item)">
<image class="towcontentitemimage"
src="https://ointmentweapp.oss-cn-beijing.aliyuncs.com/my/recharge.png" mode="aspectFill"></image>
<view class="towcontentitemone flex-start">
<image class="towcontentitemoneimage" :src="item.logo" mode="aspectFill"></image>
<text class="towcontentitemonetext" style="color: #333333;">{{item.chainName}}</text>
<!-- 余额<text class="towcontentitemtheretext">{{userInfo.amount || '0.00'}}</text> -->
</view>
<view class="towcontentitemtow flex-between">
<text class="towcontentitemtowetext" style="color:#333333;">余额:{{item.amount}}</text>
<text>{{item.shopName}}</text>
</view>
</view>
</view>
<view v-if="list.length== 0 && is_end == true" class="flex-colum">
<image :src="bgnothave" mode="aspectFill">
</image>
</view>
<u-loadmore :status="form.status" iconSize='24' fontSize='24' height='40' />
</view>
</template>
<script>
export default {
data() {
return {
bgnothave: uni.getStorageSync('bgnothave'),
list: [],
is_end: false,
nickname: uni.cache.get('userInfo').nickName,
form: {
page: 1, //页数
size: 10, //页容量
status: 'loadmore',
},
userId: uni.cache.get('userInfo').id
}
},
onShow() {
this.list = []
this.form = {
page: 1, //页数
size: 10, //页容量
status: 'loadmore',
},
this.paygetShopByMember()
},
onReachBottom() {
this.paygetShopByMember()
},
computed: {},
methods: {
async paygetShopByMember() {
let res = await this.api.paygetShopByMember({
page: this.form.page,
pageSize: this.form.size,
userId: uni.cache.get('userInfo').id,
shopId: ''
})
if (res.data.pages < this.form.page) {
this.form.status = 'nomore'
if (this.form.page == 1 && res.data.list == 0) {
this.is_end = true
}
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)
}
},
eeInfo(item) {
uni.pro.navigateTo('member/memberdetails', {
shopId_id: item.shopId
})
},
}
}
</script>
<style lang="scss">
page {
background: #FFFFFF;
}
.content {
border-top: 16rpx solid #f7f7f7;
padding: 28rpx;
padding-bottom: 40rpx;
.flex-colum_image {
display: flex;
align-items: center;
justify-content: center;
height: 100%;
text {
margin-top: 30rpx;
font-size: 32rpx;
font-family: PingFang SC-Bold, PingFang SC;
font-weight: bold;
color: #666666;
}
}
.onecontentone {
font-size: 32rpx;
font-family: PingFang SC-Bold, PingFang SC;
font-weight: bold;
color: #333333;
}
.flex-colum {
.towcontentitem {
margin-top: 22rpx;
width: 96%;
position: relative;
height: 224rpx;
padding: 32rpx;
border-radius: 12rpx;
.towcontentitemimage {
top: 0;
left: 0;
position: absolute;
width: 100%;
height: 100%;
border-radius: 12rpx;
z-index: 9;
}
.towcontentitemone {
position: relative;
z-index: 10;
.towcontentitemoneimage {
width: 76rpx;
height: 76rpx;
border-radius: 50%;
}
.towcontentitemonetext {
width: 60%;
margin-left: 16rpx;
font-size: 32rpx;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
color: #422A07;
}
}
.towcontentitemtow {
z-index: 10;
position: absolute;
width: 100%;
left: 0;
bottom: 18rpx;
padding: 0 32rpx;
// margin-top: 52rpx;
font-size: 24rpx;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
font-weight: 400;
color: #422A07;
}
}
}
}
</style>

View File

@@ -1,304 +0,0 @@
<template>
<!-- 会员详情 -->
<view class="content">
<card :userInfo="userInfo"></card>
<view class="memberdetailsStyle">
<text>会员详情</text>
<view @click="goUrl('member/billDetails')">
<text>账单明细</text>
<uni-icons type="right" style="color: #333;" size="20"></uni-icons>
</view>
<view @click="goUrlinfo('member/index')">
<text>会员充值</text>
<uni-icons type="right" style="color: #333;" size="20"></uni-icons>
</view>
</view>
</view>
</template>
<script>
import card from './components/card.vue'
export default {
components: {
card
},
data() {
return {
shopId_id: null,
inputshow: 0,
memberlist: {},
listdata: [],
amount: '',
userInfo: {},
}
},
onLoad(e) {
console.log(e)
this.shopId_id = e.shopId_id
},
onShow() {
this.paygetShopByMember(this.shopId_id)
},
methods: {
async paygetShopByMember(w) {
let res = await this.api.paygetShopByMember({
page: 1,
pageSize: 10,
userId: uni.cache.get('userInfo').id,
shopId: w
})
this.userInfo = res.data.list[0]
},
clickinput(a, b) {
console.log(a, b)
this.inputshow = b
this.amount = a.minNum
},
goUrl(url) {
uni.pro.navigateTo(url, this.userInfo)
},
goUrlinfo(url) {
uni.pro.navigateTo(url, {
shopId: this.shopId_id,
type: 'list'
})
}
}
}
</script>
<style lang="scss">
page {
background: #F9F9F9;
}
.content {
padding: 0 28rpx;
.towcontentitem {
width: 100%;
position: relative;
padding: 32rpx;
border-radius: 12rpx;
background: linear-gradient(126deg, #FFFBF2 0%, #F2D093 100%);
border-radius: 12rpx 12rpx 12rpx 12rpx;
&::after {
position: absolute;
bottom: 0;
right: 68rpx;
content: '';
display: inline-block;
width: 240rpx;
height: 232rpx;
background: url(https://czg-qr-order.oss-cn-beijing.aliyuncs.com/member.png) no-repeat;
background-size: 100% 100%;
}
.towcontentitemimage {
top: 0;
left: 0;
position: absolute;
width: 100%;
height: 100%;
border-radius: 12rpx;
z-index: 5;
}
.towcontentitemone {
width: 100%;
position: relative;
z-index: 9;
.towcontentitemoneimage {
width: 76rpx;
height: 76rpx;
border-radius: 50%;
}
.towcontentitemonetext {
height: 76rpx;
margin-left: 16rpx;
.towcontentitemonetextone {
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 500;
font-size: 36rpx;
color: #333333;
}
.towcontentitemonetexttow {
font-size: 24rpx;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
font-weight: 400;
color: #422A07;
}
}
}
.towcontentitemprogressa {
padding: 8rpx 44rpx;
z-index: 10;
position: relative;
margin-top: 54rpx;
}
.towcontentitemtow {
margin-top: 84rpx;
z-index: 10;
font-size: 24rpx;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
font-weight: 400;
color: #422A07;
}
.towcontentitevip {
position: absolute;
right: 0;
top: 0;
width: 92rpx;
height: 40rpx;
font-size: 20rpx;
background: #F4C380;
border-radius: 0rpx 12rpx 0rpx 12rpx;
text-align: center;
line-height: 40rpx;
color: #fff;
font-family: Source Han Sans CN-Medium;
font-weight: Medium;
}
.towcontentitemthere {
margin-left: 92rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: Medium;
font-size: 24rpx;
color: #333333;
.towcontentitemtheretext {
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: bold;
font-size: 36rpx;
color: #333333;
}
}
}
.therecontent {
margin-top: 32rpx;
position: relative;
padding: 22rpx 32rpx;
width: 100%;
background: #FFFFFF;
border-radius: 8rpx;
input {
padding-left: 30rpx;
text-align: right;
font-size: 28rpx;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
color: #666666;
}
}
.therecontent::after {
position: absolute;
top: 50%;
left: 32rpx;
transform: translateY(-50%);
content: '¥';
display: inline-block;
width: 28rpx;
height: 40rpx;
font-size: 28rpx;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
font-weight: 400;
color: #333333;
}
.fourcontent {
.fourcontentlnage {
width: 33.33%;
.fourcontentitem {
margin: 24rpx 10rpx;
padding: 16rpx 0;
text-align: center;
background: #FFFFFF;
border-radius: 8rpx;
border: 1rpx solid #333333;
font-size: 28rpx;
font-family: Roboto-Medium, Roboto;
font-weight: 500;
color: #333333;
}
.fourcontentitems {
margin: 24rpx 10rpx;
padding: 16rpx 0;
text-align: center;
border-radius: 8rpx;
background: #F1CB66;
border-radius: 8rpx 8rpx 8rpx 8rpx;
border: 2rpx solid #F1CB66;
font-size: 28rpx;
font-family: Roboto-Medium, Roboto;
font-weight: 500;
color: #FFFFFF;
}
}
}
.fivecontent {
position: relative;
bottom: 44rpx;
margin-top: 62rpx;
padding: 20rpx 0;
text-align: center;
width: 100%;
font-size: 36rpx;
font-family: PingFang SC-Bold, PingFang SC;
font-weight: bold;
color: #FFFFFF;
border-radius: 8rpx;
background: #F1CB66;
}
// 会员详情
.memberdetailsStyle {
margin-top: 32rpx;
border-radius: 24rpx 24rpx 24rpx 24rpx;
background-color: #fff;
padding: 32rpx;
height: 252rpx;
display: flex;
justify-content: space-between;
flex-direction: column;
>text {
font-weight: bold;
font-size: 32rpx;
color: #333333;
}
>view {
font-weight: 400;
font-size: 28rpx;
color: #333333;
display: flex;
justify-content: space-between;
align-items: center;
}
}
}
</style>

View File

@@ -1,399 +0,0 @@
<template>
<view class="content">
<view class="towcontentitem">
<image class="towcontentitemimage" :src="data.img" mode="aspectFill"></image>
<view class="fourcontentitemabsolute">
<!-- 年卡会员 -->
</view>
<view class="towcontentitemone flex-start">
<image class="towcontentitemoneimage" :src="data.store_avatar" mode="aspectFill"></image>
<view class="towcontentitemonetext flex-colum-start">
<text class="towcontentitemonetextone">{{data.title}}</text>
<text class="towcontentitemonetexttow">{{data.show}}</text>
</view>
<view class="towcontentitemoneabsolute" @click="overlayshow = true">
加购
</view>
</view>
<view class="towcontentitemprogress">
{{Number(data.user_sec_y_frequ)}}/{{Number(data.user_sec_z_frequ)}}
</view>
<view class="towcontentitemtow flex-between">
<text class="towcontentitemtowetext">{{data.vip_number || ''}}</text>
<text class="towcontentitemtowetext">{{data.end_time}}</text>
</view>
</view>
<view class="therecontentitem">
<view class="therecontentitemtext">
会员详情
</view>
<view class="therecontentitemone">
<!-- <view class="therecontentitemoneiten flex-between" @click="order">
<text class="therecontentitemoneitentetxt">账单明细</text>
<u-icon name="arrow-right" color="#808080" size="18"></u-icon>
</view> -->
<view class="therecontentitemoneiten flex-between" @click="overlayshow = true">
<text class="therecontentitemoneitentetxt">订单明细</text>
<u-icon name="arrow-right" color="#808080" size="18"></u-icon>
</view>
</view>
</view>
<u-overlay :show="overlayshow" @click="overlayshow = false">
<view class="warp">
<view class="rect" @tap.stop>
<view class="onerect flex-center">
<view>{{data.store_title}}</view>
<u-icon @click="overlayshow = false" class="onerecticon" name="backspace" color="#000000"
size="28"></u-icon>
</view>
<view class="towrect">
商品
</view>
<view class="thererect flex-between">
<view class="thererectone">
{{data.title}}
</view>
<view class="thererecttow">
<text></text>{{data.price}}
</view>
</view>
<view class="fourrect flex-between">
<view class="fourrectone">
<text>共计:</text>{{data.price}}
</view>
<view class="fourrecttow" @tap="$u.debounce(showpopupclick,1000)">
立即购买
</view>
</view>
</view>
</view>
</u-overlay>
</view>
</template>
<script>
export default {
data() {
return {
overlayshow: false,
numberbox: "",
data: {}
}
},
async onLoad(e) {
console.log(e)
let res = await this.api.reservationvipdetail({
id: e.id
})
this.data = res
console.log(this.data)
},
methods: {
async showpopupclick() {
try {
let res = await this.api.useropenuserseccrd({
id: this.data.id
}) //判断是否支付成功
if (res) {
// #ifdef MP-WEIXIN
uni.requestPayment({
provider: 'wxpay', //支付类型-固定值
partnerid: res.payAppId, // 微信支付商户号
timeStamp: res.payTimeStamp, // 时间戳(单位:秒)
nonceStr: res.paynonceStr, // 随机字符串
package: res.payPackage, // 固定值
signType: res.paySignType, //固定值
paySign: res.paySign, //签名
success: (res) => {
uni.showToast({
title: "支付成功"
})
uni.redirectTo({
url: "/my/member/index?e=" + 1,
});
},
fail: (err) => {
setTimeout(res => {
uni.showToast({
icon: 'none',
title: '支付失败'
})
uni.hideLoading()
}, 2000)
uni.redirectTo({
url: "/my/member/index?e=" + 1,
});
}
});
// #endif
}
} catch (e) {
//TODO handle the exception
}
},
order(e) {
uni.pro.navigateTo('my/order/index', {
e: 0
})
}
}
}
</script>
<style lang="scss">
page {
background: #F9F9F9;
}
.content {
padding: 32rpx 28rpx;
.towcontentitem {
margin-top: 22rpx;
width: 100%;
position: relative;
padding: 32rpx;
border-radius: 12rpx;
.fourcontentitemabsolute {
z-index: 9;
position: absolute;
right: 0;
top: 0;
padding: 6rpx 28rpx;
font-size: 20rpx;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
color: #FFFFFF;
text-shadow: 0px 6rpx 12rpx rgba(255, 255, 255, 0.19);
background: linear-gradient(NaNdeg, #4A4A4A 0%, #919191 100%);
border-radius: 0px 12rpx 0px 12rpx;
opacity: 1;
}
.towcontentitemimage {
top: 0;
left: 0;
position: absolute;
width: 100%;
height: 100%;
border-radius: 12rpx;
z-index: 0;
}
.towcontentitemone {
width: 100%;
position: relative;
z-index: 9;
.towcontentitemoneimage {
width: 76rpx;
height: 76rpx;
border-radius: 50%;
}
.towcontentitemoneabsolute {
position: absolute;
padding: 8rpx 44rpx;
right: 0;
font-size: 28rpx;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
color: #FFFFFF;
background: linear-gradient(130deg, #F4AE46 0%, #EE9437 100%);
box-shadow: 0px 4rpx 8rpx 2rpx rgba(243, 169, 67, 0.37);
border-radius: 28rpx;
}
.towcontentitemonetext {
width: 80%;
height: 76rpx;
margin-left: 16rpx;
.towcontentitemonetextone {
width: 80%;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
font-size: 32rpx;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
color: #422A07;
}
.towcontentitemonetexttow {
width: 80%;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
width:400rpx;
font-size: 24rpx;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
font-weight: 400;
color: #422A07;
}
}
}
.towcontentitemprogressa {
padding: 8rpx 44rpx;
width: 50%;
z-index: 10;
position: relative;
margin-top: 54rpx;
}
.towcontentitemprogress {
position: relative;
z-index: 99;
margin-top: 24rpx;
border-radius: 28rpx;
font-size: 28rpx;
font-family: Source Han Sans CN-Bold, Source Han Sans CN;
font-weight: bold;
color: #000;
}
.towcontentitemtow {
z-index: 10;
position: relative;
margin-top: 68rpx;
font-size: 24rpx;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
font-weight: 400;
color: #422A07;
}
}
.therecontentitem {
margin-top: 32rpx;
width: 100%;
padding: 32rpx 32rpx 0 32rpx;
background: #FFFFFF;
border-radius: 24rpx;
.therecontentitemtext {
font-size: 32rpx;
font-family: PingFang SC-Bold, PingFang SC;
font-weight: bold;
color: #333333;
}
.therecontentitemone {
.therecontentitemoneiten:nth-child(1) {
border-top: none !important;
}
.therecontentitemoneiten {
padding: 32rpx 0;
border-top: 1px solid #F7F7F7;
.therecontentitemoneitentetxt {
font-size: 28rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #333333;
}
}
}
}
.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: 48rpx;
image {
width: 124rpx;
height: 124rpx;
}
view {
margin-left: 16rpx;
font-size: 32rpx;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
color: #1A1A1A;
}
.onerecticon {
position: absolute;
top: 0;
right: 0;
}
}
.towrect {
font-size: 32rpx;
font-family: PingFang SC-Bold, PingFang SC;
font-weight: bold;
color: #333333;
}
.thererect {
margin-top: 16rpx;
.thererectone {
font-size: 28rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #333333;
}
.thererecttow {
text {
font-size: 16rpx;
}
font-size: 32rpx;
font-family: PingFang SC-Heavy,
PingFang SC;
font-weight: 800;
color: #333333;
}
}
.fourrect {
margin-top: 44rpx;
.fourrectone {
text {
font-size: 24rpx;
color: #333333;
}
font-size: 40rpx;
font-family: PingFang SC-Bold,
PingFang SC;
font-weight: bold;
color: #FC5F69;
}
.fourrecttow {
background: linear-gradient(143deg, #8689AF 0%, #494A5F 100%);
border-radius: 34rpx;
padding: 10rpx 44rpx;
font-size: 32rpx;
font-family: PingFang SC-Bold, PingFang SC;
font-weight: bold;
color: #FFFFFF;
}
}
}
}
}
</style>

View File

@@ -1,600 +0,0 @@
<template>
<view class="content" :style="[theme]">
<view class="towcontentitem">
<image class="towcontentitemimage" :src="data.img" mode="aspectFill"></image>
<view class="towcontentitemone flex-start">
<view class="towcontentitemonetext flex-colum-start">
<text class="towcontentitemonetextone" style="color: #fff;">{{data.title}}</text>
<text class="towcontentitemonetexttow" style="color: #fff;">{{data.show}}</text>
</view>
</view>
<view class="towcontentitemtow flex-between">
<text class="towcontentitemtowetext" style="color: #fff;">{{data.price}}<text
class="towcontentitemtowetexts" style="color: #fff;">/{{data.frequ}}</text></text>
<text class="towcontentitemtowetext_s" style="color: #fff;">{{data.end_time}}</text>
</view>
</view>
<view class="therecontentitem">
<view class="therecontentitemtext">
商品
</view>
<view class="therecontentitemtextitem flex-between">
<view class="therecontentitemtextitem_left">
{{data.title}}
</view>
<view class="therecontentitemtextitem_right">
{{data.price}}
</view>
</view>
<view class="therecontentitemtextitemt_one">
{{data.show}}
</view>
<view class="therecontentitemtext" style="margin-top: 14rpx;">
权益
</view>
<view class="therecontentitemtextitemt_one">
<text style="color: #333333;">{{data.frequ}}</text>{{data.show}}
</view>
</view>
<view class="therecontentitem">
<view class="therecontentitem_tow flex-start">
手机号码<text>{{data.mobile}}</text>
</view>
<view class="therecontentitem_tows">
该号码不会提供给商家仅用于接收平台通知信息
</view>
</view>
<view class="therecontentitem">
<view class="therecontentitemtext">
使用说明
</view>
<view class="therecontentitemtextthere" style="margin-top: 14rpx;margin-bottom: 30rpx;"
v-html="data.notice">
</view>
</view>
<view class="fixedview flex-between">
<view class="fixedview_one flex-start">
<view class="fixedview_oneone">
应付金额
</view>
<view class="fixedview_onetow flex-colum-start">
<text>{{data.price}}</text>
</view>
</view>
<view v-if="mobile" class="fixedview_tow" @tap="$u.debounce(showpopupclick,1000)">
立即付款
</view>
<view v-else class="fixedview_tow">
<button open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">
立即付款
</button>
</view>
</view>
<u-overlay :show="overlayshow" @click="overlayshow = false">
<view class="warp">
<view class="rect" @tap.stop>
<view class="onerect flex-center">
<view>洗剪吹新娘造型</view>
<u-icon @click="overlayshow = false" class="onerecticon" name="backspace" color="#000000"
size="28"></u-icon>
</view>
<view class="towrect">
商品
</view>
<view class="thererect flex-between">
<view class="thererectone">
年卡会员
</view>
<view class="thererecttow">
<text></text>300
</view>
</view>
<view class="fourrect flex-between">
<view class="fourrectone">
<text>共计:</text>300
</view>
<view class="fourrecttow">
立即购买
</view>
</view>
</view>
</view>
</u-overlay>
</view>
</template>
<script>
export default {
data() {
return {
mobile: uni.cache.get('loginuser').userinfo.mobile,
overlayshow: false,
numberbox: "",
data: {
mobile: ''
}
}
},
computed: {
theme() {
return this.$store.getters.theme
},
},
async onLoad(e) {
console.log(e)
let res = await this.api.reservationvipdetail({
id: e.id
})
try {
this.data = res
this.data.notice = res.notice.replace(/\<img/g, '<img style="max-width:100%;height:auto" ');
this.data.mobile = uni.cache.get('loginuser').userinfo.mobile
} catch (e) {
//TODO handle the exception
}
},
async onShow() {
this.$store.dispatch('storeuseruserinfo')
},
mounted() {
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();
},
methods: {
async getPhoneNumber(res) { // 获取手机号
var resdataa = res
// #ifdef MP-WEIXIN
uni.login({
provider: 'weixin',
success: async (data) => {
let resdata = await this.api.usergetwechatphone({
code: data.code,
iv: resdataa.detail.iv,
encryptedData: resdataa.detail.encryptedData
})
try {
this.mobile = resdata.mobile
} catch (e) {
uni.showToast({
title: '获取失败'
})
}
}
});
// #endif
},
async showpopupclick() {
try {
let res = await this.api.useropenuserseccrd({
id: this.data.id
}) //判断是否支付成功
if (res) {
// #ifdef MP-WEIXIN
uni.requestPayment({
provider: 'wxpay', //支付类型-固定值
partnerid: res.payAppId, // 微信支付商户号
timeStamp: res.payTimeStamp, // 时间戳(单位:秒)
nonceStr: res.paynonceStr, // 随机字符串
package: res.payPackage, // 固定值
signType: res.paySignType, //固定值
paySign: res.paySign, //签名
success: (res) => {
uni.showToast({
title: "支付成功"
})
uni.redirectTo({
url: "/my/member/index?e=" + 1,
});
},
fail: (err) => {
setTimeout(res => {
uni.showToast({
icon: 'none',
title: '支付失败'
})
uni.hideLoading()
}, 2000)
uni.redirectTo({
url: "/my/member/index?e=" + 1,
});
}
});
// #endif
}
} catch (e) {
//TODO handle the exception
}
},
order(e) {
uni.pro.navigateTo('my/order/index', {
e: 0
})
}
}
}
</script>
<style lang="scss">
page {
background: #F9F9F9;
}
.content {
padding: 32rpx 28rpx;
.towcontentitem {
margin-top: 22rpx;
width: 100%;
position: relative;
padding: 32rpx;
border-radius: 12rpx;
.fourcontentitemabsolute {
z-index: 9;
position: absolute;
right: 0;
top: 0;
padding: 6rpx 28rpx;
font-size: 20rpx;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
color: #FFFFFF;
text-shadow: 0px 6rpx 12rpx rgba(255, 255, 255, 0.19);
background: linear-gradient(NaNdeg, #4A4A4A 0%, #919191 100%);
border-radius: 0px 12rpx 0px 12rpx;
opacity: 1;
}
.towcontentitemimage {
top: 0;
left: 0;
position: absolute;
width: 100%;
height: 100%;
border-radius: 12rpx;
z-index: 5;
}
.towcontentitemone {
width: 100%;
position: relative;
z-index: 9;
.towcontentitemoneimage {
width: 76rpx;
height: 76rpx;
}
.towcontentitemoneabsolute {
position: absolute;
padding: 8rpx 44rpx;
right: 0;
font-size: 28rpx;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
color: #FFFFFF;
background: linear-gradient(130deg, #F4AE46 0%, #EE9437 100%);
box-shadow: 0px 4rpx 8rpx 2rpx rgba(243, 169, 67, 0.37);
border-radius: 28rpx;
}
.towcontentitemonetext {
margin-left: 16rpx;
.towcontentitemonetextone {
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: #422A07;
}
.towcontentitemonetexttow {
width: 100%;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
margin-top: 16rpx;
font-size: 24rpx;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
font-weight: 400;
color: #422A07;
}
}
}
.towcontentitemprogressa {
padding: 8rpx 44rpx;
width: 50%;
z-index: 10;
position: relative;
margin-top: 54rpx;
}
.towcontentitemprogress {
margin-top: 24rpx;
background: linear-gradient(318deg, #6E6E6E 0%, #404040 100%);
box-shadow: 0px 4rpx 8rpx 2rpx #8D8D8D;
border-radius: 28rpx;
font-size: 28rpx;
font-family: Source Han Sans CN-Bold, Source Han Sans CN;
font-weight: bold;
color: #FFFFFF;
}
.towcontentitemtow {
z-index: 10;
position: relative;
margin-top: 68rpx;
font-size: 24rpx;
.towcontentitemtowetext {
font-size: 30rpx;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: bold;
color: #333333;
.towcontentitemtowetexts {
font-size: 20rpx;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
color: #333333;
}
}
.towcontentitemtowetext_s {
font-size: 24rpx;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
color: #333333;
}
}
}
.therecontentitem {
margin-top: 32rpx;
width: 100%;
padding: 32rpx 32rpx 0 32rpx;
background: #FFFFFF;
border-radius: 12rpx;
.therecontentitem_tow {
font-size: 32rpx;
font-family: PingFang SC-Bold, PingFang SC;
font-weight: bold;
color: #999999;
text {
margin-left: 20rpx;
font-size: 32rpx;
font-family: PingFang SC-Bold, PingFang SC;
font-weight: bold;
color: #333333;
}
}
.therecontentitem_tows {
margin-top: 16rpx;
font-size: 24rpx;
font-family: PingFang SC-Bold, PingFang SC;
font-weight: bold;
color: #999999;
padding-bottom: 30rpx;
}
.therecontentitemtext {
font-size: 32rpx;
font-family: PingFang SC-Bold, PingFang SC;
font-weight: bold;
color: #333333;
}
.therecontentitemtextthere {
font-size: 24rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #666666;
}
.therecontentitemtextitem {
margin-top: 24rpx;
.therecontentitemtextitem_left {
font-size: 28rpx;
font-family: PingFang SC-Bold, PingFang SC;
font-weight: bold;
color: #333333;
}
.therecontentitemtextitem_right {
font-size: 32rpx;
font-family: Roboto-Bold, Roboto;
font-weight: bold;
color: #333333;
}
}
.therecontentitemtextitemt_one {
margin-top: 6rpx;
font-size: 24rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #999999;
padding-bottom: 16rpx;
border-bottom: 1rpx dashed #F7F7F7;
}
}
.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;
button::after {
border-radius: 34rpx;
padding: 0 !important;
margin: 0 !important;
}
button {
background-color: var(--bg-color-button) !important;
padding: 0 !important;
line-height: inherit !important;
margin: 0 !important;
width: auto !important;
font-weight: 500 !important;
border-radius: none !important;
color: #FFFFFF;
}
}
}
.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: 48rpx;
image {
width: 124rpx;
height: 124rpx;
}
view {
margin-left: 16rpx;
font-size: 32rpx;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
color: #1A1A1A;
}
.onerecticon {
position: absolute;
top: 0;
right: 0;
}
}
.towrect {
font-size: 32rpx;
font-family: PingFang SC-Bold, PingFang SC;
font-weight: bold;
color: #333333;
}
.thererect {
margin-top: 16rpx;
.thererectone {
font-size: 28rpx;
font-family: PingFang SC-Regular, PingFang SC;
font-weight: 400;
color: #333333;
}
.thererecttow {
text {
font-size: 16rpx;
}
font-size: 32rpx;
font-family: PingFang SC-Heavy,
PingFang SC;
font-weight: 800;
color: #333333;
}
}
.fourrect {
margin-top: 44rpx;
.fourrectone {
text {
font-size: 24rpx;
color: #333333;
}
font-size: 40rpx;
font-family: PingFang SC-Bold,
PingFang SC;
font-weight: bold;
color: #FC5F69;
}
.fourrecttow {
background: linear-gradient(143deg, #8689AF 0%, #494A5F 100%);
border-radius: 34rpx;
padding: 10rpx 44rpx;
font-size: 32rpx;
font-family: PingFang SC-Bold, PingFang SC;
font-weight: bold;
color: #FFFFFF;
}
}
}
}
}
</style>

View File

@@ -1,339 +0,0 @@
<template>
<view class="content" :style="[theme]">
<view class="towcontentitem">
<image class="towcontentitemimage" src="https://ointmentweapp.oss-cn-beijing.aliyuncs.com/my/recharges.png"
mode="widthFix"></image>
<!-- <view class="fourcontentitemabsolute">
{{memberlist.store_title}}
</view> -->
<view class="towcontentitemone flex-start">
<image class="towcontentitemoneimage" :src="memberlist.store_avatar" mode="aspectFill"></image>
<view class="towcontentitemonetext flex-colum-start">
<text class="towcontentitemonetextone">{{nickname || '暂无昵称'}}</text>
</view>
</view>
<view class="towcontentitemprogress">
可用余额:{{memberlist.money || '0.00'}}
<!-- <text style="font-size: 16rpx; color:#000 ; margin-left: 10rpx;">冻结金额:{{memberlist.freeze_money}}</text> -->
<!-- <view class="towcontentitemoneabsolute">
加购
</view> -->
</view>
<view class="towcontentitemtow flex-between">
<text class="towcontentitemtowetext">{{memberlist.vip_number}}</text>
<!-- <text class="towcontentitemtowetext" style="color: #fff;">保洁清洗卡</text> -->
</view>
</view>
<view class="therecontent">
<input type="number" v-model="amount" placeholder="自定义金额">
</view>
<view class="fourcontent flex-start">
<view class="fourcontentlnage" v-for="(item,index) in listdata" :key="index">
<view class="flex-colum" :class="index == inputshow?'fourcontentitems':'fourcontentitem'"
@click="clickinput(item,index)">
<text>{{item.amount}}</text>
<text style="margin-top: 10rpx;">{{item.deliver}}</text>
</view>
</view>
</view>
<view class="fivecontent" @click="userbalancerechangesub">
立即充值
</view>
</view>
</template>
<script>
export default {
data() {
return {
nickname: uni.cache.get('loginuser').userinfo.nickname,
inputshow: 0,
memberlist: {},
listdata: [],
amount: '',
}
},
onLoad(e) {
// console.log(e)
// this.memberlist = e
this.useruserbalance()
},
onShow() {
this.userbalancerechange()
},
computed: {
theme() {
return this.$store.getters.theme
},
},
methods: {
async useruserbalance(){
let res = await this.api.useruserbalance({
store_id: uni.cache.get('store_id') // 判断显示哪家的作品,
})
this.memberlist = res
},
async userbalancerechange() {
let res = await this.api.userbalancerechange({
store_id: uni.cache.get('store_id') // 判断显示哪家的作品,
})
this.listdata = res
this.amount = res[0].amount
},
async userbalancerechangesub() {
if (this.amount == null || this.amount == '') {
uni.showToast({
title: '金额不能为空',
icon: 'none'
});
return false;
}
let res = await this.api.userbalancerechangesub({
amount: this.amount,
store_id: this.memberlist.store_id
})
if (res) {
// #ifdef MP-WEIXIN
uni.requestPayment({
provider: 'wxpay', //支付类型-固定值
partnerid: res.payAppId, // 微信支付商户号
timeStamp: res.payTimeStamp, // 时间戳(单位:秒)
nonceStr: res.paynonceStr, // 随机字符串
package: res.payPackage, // 固定值
signType: res.paySignType, //固定值
paySign: res.paySign, //签名
success: (res) => {
uni.showToast({
title: "支付成功"
})
uni.navigateBack()
},
fail: (err) => {
setTimeout(res => {
uni.showToast({
icon: 'none',
title: '支付失败'
})
uni.hideLoading()
}, 2000)
}
});
// #endif
}
},
clickinput(a, b) {
console.log(a, b)
this.inputshow = b
this.amount = a.amount
},
eeInfo(e) {
uni.pro.navigateTo('my/member/memberinfo', {
id: e,
})
},
}
}
</script>
<style lang="scss">
page {
background: #F9F9F9;
}
.content {
padding: 0 28rpx;
.towcontentitem {
width: 100%;
position: relative;
padding: 32rpx;
border-radius: 12rpx;
.fourcontentitemabsolute {
z-index: 9;
position: absolute;
right: 0;
top: 0;
padding: 6rpx 28rpx;
font-size: 20rpx;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
color: #FFFFFF;
text-shadow: 0px 6rpx 12rpx rgba(255, 255, 255, 0.19);
background: linear-gradient(NaNdeg, #4A4A4A 0%, #919191 100%);
border-radius: 0px 12rpx 0px 12rpx;
opacity: 1;
}
.towcontentitemimage {
top: 0;
left: 0;
position: absolute;
width: 100%;
height: 100%;
border-radius: 12rpx;
z-index: 5;
}
.towcontentitemone {
margin-top: 42rpx;
width: 100%;
position: relative;
z-index: 9;
.towcontentitemoneimage {
width: 76rpx;
height: 76rpx;
border-radius: 50%;
}
.towcontentitemonetext {
height: 76rpx;
margin-left: 16rpx;
.towcontentitemonetextone {
font-size: 32rpx;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
color: #422A07;
}
.towcontentitemonetexttow {
font-size: 24rpx;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
font-weight: 400;
color: #422A07;
}
}
}
.towcontentitemprogressa {
padding: 8rpx 44rpx;
z-index: 10;
position: relative;
margin-top: 54rpx;
}
.towcontentitemprogress {
z-index: 10;
position: relative;
margin-top: 24rpx;
border-radius: 28rpx;
font-size: 32rpx;
height: 56rpx;
line-height: 56rpx;
font-family: Source Han Sans CN-Bold, Source Han Sans CN;
font-weight: bold;
color: #333;
.towcontentitemoneabsolute {
position: absolute;
padding: 0 44rpx;
height: 56rpx;
line-height: 56rpx;
top: 0;
right: 0;
font-size: 28rpx;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
color: #FFFFFF;
background: linear-gradient(130deg, #F4AE46 0%, #EE9437 100%);
box-shadow: 0px 4rpx 8rpx 2rpx rgba(243, 169, 67, 0.37);
border-radius: 28rpx;
}
}
.towcontentitemtow {
z-index: 10;
position: relative;
margin-top: 42rpx;
font-size: 24rpx;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
font-weight: 400;
color: #422A07;
}
}
.therecontent {
margin-top: 32rpx;
position: relative;
padding: 22rpx 32rpx;
width: 100%;
background: #FFFFFF;
border-radius: 8rpx;
input {
padding-left: 30rpx;
text-align: right;
font-size: 28rpx;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
color: #666666;
}
}
.therecontent::after {
position: absolute;
top: 50%;
left: 32rpx;
transform: translateY(-50%);
content: '¥';
display: inline-block;
width: 28rpx;
height: 40rpx;
font-size: 28rpx;
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
font-weight: 400;
color: #333333;
}
.fourcontent {
.fourcontentlnage {
width: 33.33%;
.fourcontentitem {
margin: 24rpx 10rpx;
padding: 16rpx 0;
text-align: center;
background: #FFFFFF;
border-radius: 8rpx;
border: 1rpx solid #333333;
font-size: 28rpx;
font-family: Roboto-Medium, Roboto;
font-weight: 500;
color: #333333;
}
.fourcontentitems {
margin: 24rpx 10rpx;
padding: 16rpx 0;
text-align: center;
border-radius: 8rpx;
background: var(--bg-color-button);
font-size: 28rpx;
font-family: Roboto-Medium, Roboto;
font-weight: 500;
color: #FFFFFF;
}
}
}
.fivecontent {
margin-top: 62rpx;
padding: 20rpx 0;
text-align: center;
width: 100%;
font-size: 36rpx;
font-family: PingFang SC-Bold, PingFang SC;
font-weight: bold;
color: #FFFFFF;
border-radius: 8rpx;
background: var(--bg-color-button);
}
}
</style>

View File

@@ -1,40 +1,17 @@
<template>
<view>
<view class="navtab flex-center">
<view class="navtabpost flex-center">
<view :class="navtabindex == 0 ? 'navtabone':'navtabtow'" @click="navtabclick(0)">
到店订单
</view>
<view :class="navtabindex == 1 ? 'navtabone':'navtabtow'" @click="navtabclick(1)">
团购订单
</view>
</view>
</view>
<u-sticky bgColor="#fff">
<view class="tab-wrap">
<block v-if="navtabindex==1">
<view class="item" v-for="(item, index) in tabs2" :key="index" @click="orderswitch(item,index)">
<text>{{ item.name }}</text>
</view>
</block>
<block v-if="navtabindex==0">
<view class="item" v-for="(item, index) in tabs" :key="index" @click="orderswitch(item,index)">
<text>{{ item.name }}</text>
</view>
</block>
<view class="item" v-for="(item, index) in tabs" :key="index" @click="orderswitch(item,index)">
<text>{{ item.name }}</text>
</view>
<view class="line-wrap"
:style="{ left: `${(100 / tabs.length) * active}%`, width: `${100 / tabs.length}%` }">
<view class="line">
<image style="width:40rpx; height: 10rpx;"
src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/index/today/dgs.png"
mode="aspectFill">
</image>
</view>
<view class="line"></view>
</view>
</view>
</u-sticky>
<view class="list-wrap" v-if="navtabindex == 0">
<view class="list-wrap">
<view class="item" v-for="(item,index) in list" :key="index" @click="orderinfo(item)">
<view class="header-wrap">
<text v-if="item.sendType == 'post'">快递</text>
@@ -60,7 +37,7 @@
<text>退单</text>
</text>
<text class="status" v-if="item.status == 'cancelled'">
<text>取消</text>
<text>取消订单</text>
</text>
<text class="status" v-if="item.status == 'merge'">
<text>合台</text>
@@ -69,18 +46,19 @@
<view class="content">
<view class="shop-info">
<view class="shop-item">
<view class="cover flex-start" v-for="(item1,index1) in item.detailList" :key="index1">
<view class="cover flex-start" v-for="(item1,index1) in item.detailList"
:key="index1">
<!-- <image :src="item1.productImg" style="width: 200rpx;height: 200rpx; border-radius: 20rpx;" mode="widthFix"></image> -->
<c-image width="200" height="200" radius="20" :src="item1.productImg"></c-image>
</view>
<!-- <view class="info">
<text class="name">美味大宅蟹</text>
<text class="num">数量1</text>
</view> -->
<text class="name">美味大宅蟹</text>
<text class="num">数量1</text>
</view> -->
</view>
</view>
<view class="total" v-if="item.status != 'cancelled'">
<text class="t">{{item.description}}</text>
<view class="total">
<text class="t">需付款</text>
<text class="i"></text>
<text class="num">{{item.orderAmount}}</text>
</view>
@@ -96,32 +74,6 @@
</view>
</view>
</view>
<!-- 新订单 -->
<view class="orderList" v-if="navtabindex == 1">
<view class="listBox" v-for="(item,i) in groupList" :key="i" @click="orderinfoTo(item)">
<view class="df">
<view style="display: flex;">
<text>{{item.proName.length>10?item.proName.substring(0,10)+'...':item.proName}}</text><u-icon
name="arrow-right" color="#000" size="28"></u-icon>
</view>
<text
:class="[item.status=='unpaid'||item.status=='unused'?'state':'state2']">{{item.status|statusFirter}}</text>
</view>
<view class="df" style="justify-content: flex-start;margin-top: 32rpx;">
<image style="width:120rpx; height: 120rpx;border-radius: 12rpx 12rpx 12rpx 12rpx;"
:src="item.proImg" mode="aspectFill">
</image>
<view class="ml-20 fontStyle">
<view>数量{{item.number}}</view>
<view>实付<text style="color: #FF4C11;">{{item.payAmount}}</text></view>
</view>
</view>
<button v-if="item.status=='unused'" type="primary" class="buttonStyle">查看券码</button>
<button v-if="item.status=='unpaid'" type="primary" class="buttonStyle">去付款</button>
</view>
</view>
<image style="margin:32rpx auto;" src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/nomore.png"
v-if="is_end" mode="aspectFill"></image>
<u-loadmore :status="form.status" fontSize="28" color="#999" iconSize="28" />
</view>
</template>
@@ -132,7 +84,6 @@
data() {
return {
active: 0,
navtabindex: 0,
tabs: [{
name: '全部',
type: 1,
@@ -148,7 +99,6 @@
type: 3,
status: 'unsend'
},
{
name: '已完成',
type: 4,
@@ -158,37 +108,9 @@
name: '退款',
type: 5,
status: 'refund'
},
],
tabs2: [{
name: '全部',
type: 1,
status: ''
},
{
name: '待支付',
type: 2,
status: 'unpaid'
},
{
name: '待使用',
type: 3,
status: 'unused'
},
{
name: '已完成',
type: 4,
status: 'closed'
},
{
name: '退款',
type: 5,
status: 'refund'
},
}
],
list: [],
groupList: [],
is_end: false,
swiperCurrent: '',
form: {
@@ -207,42 +129,24 @@
} else {
this.active = (this.tabs.findIndex((item) => item.type == this.useStorage.get('orderType')));
}
this.swiperCurrent = ''
this.init_fn()
},
onReachBottom() {
if (this.navtabindex == 1) {
// 获取团购订单
this.getorderList()
} else {
this.orderorderList()
}
},
filters: {
statusFirter(e) {
// 状态: unpaid-待付款;unused-待使用;closed-已完成;refunding-退款中;refund-已退款;cancelled-已取消;
if (e == 'closed') return '已完成'
else if (e == 'paying') return '支付中'
else if (e == 'unpaid') return '待付款'
else if (e == 'unused') return '待使用'
else if (e == 'refunding') return '退款中'
else if (e == 'refund') return '已退款'
else if (e == 'cancelled') return '已取消'
}
this.orderorderList()
},
methods: {
// 切换导航栏
navtabclick(i) {
this.navtabindex = i
this.init_fn()
},
async loginwxuserInfo() {
let res = await this.api.loginwxuserInfo({
userId: uni.cache.get('userInfo').id
userId: uni.cache.get('userInfo').id,
shopId: uni.cache.get('shopUser').shopId
})
if (res.code == 0) {
uni.cache.set('userInfo', res.data);
uni.cache.set('userInfo', res.data.userInfo);
uni.cache.set('shopUser', res.data.shopUser);
uni.cache.set('shopInfo', res.data.shopInfo);
this.shopUser = uni.cache.get('shopUser')
this.userInfo = uni.cache.get('userInfo')
this.shopInfo = uni.cache.get('shopInfo')
}
},
orderinfo(e) {
@@ -250,24 +154,12 @@
orderId: e.id
})
},
orderinfoTo(e) {
uni.pro.navigateTo('group_order/order_groupdetail', {
orderId: e.id
})
},
init_fn() {
// this.list = []
this.groupList = []
this.list = []
this.is_end = false
this.form.page = 1
this.form.size = 10
this.form.status = 'loadmore'
if (this.navtabindex == 1) {
// 获取团购订单
this.getorderList()
} else {
this.orderorderList()
}
this.orderorderList()
},
orderswitch(e, a) {
this.active = a
@@ -285,60 +177,24 @@
userId: uni.cache.get('userInfo').id, //userId
status: this.swiperCurrent
})
if (res.data.pages < this.form.page) {
if (res.data.length == 0) {
this.is_end = true
this.form.status = 'nomore'
if (this.form.page == 1 && res.data.list.length == 0) {
this.list = []
this.is_end = true
}
return false;
} else {
this.form.status = 'loading';
setTimeout(() => {
if (this.form.page == 1) {
console.log(111)
this.list = res.data.list
} else {
console.log(222)
this.list = [...this.list, ...res.data.list];
}
this.form.page = ++this.form.page;
if (this.form.page > res.data.pages) {
this.form.status = 'nomore';
} else {
this.form.status = 'loading';
}
}, 500)
}
},
async getorderList() {
let res = await this.api.groupOrderInfo({
page: this.form.page,
size: this.form.size,
userId: uni.cache.get('userInfo').id, //userId
status: this.swiperCurrent
})
if (res.data.pages < this.form.page) {
this.form.status = 'nomore'
if (this.form.page == 1 && res.data.list == 0) {
this.is_end = true
}
return false;
} else {
this.form.status = 'loading';
this.form.page = ++this.form.page;
setTimeout(() => {
this.groupList = [...this.groupList, ...res.data.list];
this.form.status = 'loading';
if (res.data.pageNum == res.data.pages) {
this.form.status = 'nomore';
} else {
this.list = [...this.list, ...res.data];
if (res.data.length == 10) {
this.form.status = 'loading';
} else {
this.is_end = true;
this.form.status = 'nomore';
}
}, 500)
}
}
},
}
};
</script>
@@ -347,57 +203,10 @@
$tabH: 80upx;
$color: #ff411d;
page {
background: #f6f6f6;
}
.navtab {
width: 100%;
height: 56rpx;
background: #ffd158;
.navtabpost {
position: relative;
background: #FFFFFF;
border-radius: 12rpx;
padding: 0 10rpx;
.navtabone {
// margin-left: -10rpx;
width: 166rpx;
height: 36rpx;
background: #FFEAB1;
border-radius: 12rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 500;
font-size: 28rpx;
color: #333333;
line-height: 36rpx;
text-align: center;
z-index: 10;
}
.navtabtow {
// margin-left: -10rpx;
z-index: 9;
width: 146rpx;
height: 56rpx;
line-height: 56rpx;
text-align: center;
// border-radius: 0 12rpx 12rpx 0;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 24rpx;
color: #666666;
}
}
}
.tab-wrap {
display: flex;
height: $tabH;
position: relative;
background: #ffd158;
padding: 48rpx 0 72rpx 0;
.item {
flex: 1;
@@ -406,15 +215,11 @@
justify-content: center;
position: relative;
z-index: 2;
text {
color: #fff;
}
}
.line-wrap {
position: absolute;
bottom: 48rpx;
bottom: 0;
display: flex;
justify-content: center;
padding-bottom: 8upx;
@@ -422,22 +227,16 @@
.line {
$h: 6upx;
margin-top: 6rpx;
// width: 30%;
// height: $h;
width: 30%;
height: $h;
border-radius: $h;
// background-color: $color;
background-color: $color;
}
}
}
.list-wrap {
padding: $paddingSize;
position: relative;
margin-top: -24rpx;
z-index: 99999;
background: #f6f6f6;
border-radius: 24rpx 24rpx 0rpx 0rpx;
.item {
border-radius: 20upx;
@@ -540,60 +339,4 @@
}
}
}
.orderList {
display: flex;
justify-content: center;
align-items: center;
flex-direction: column;
.listBox {
padding: 16rpx 18rpx;
margin-top: 48rpx;
font-size: 32rpx;
width: 694rpx;
height: 248rpx;
background: #FFFFFF;
border-radius: 24rpx 24rpx 24rpx 24rpx;
position: relative;
.buttonStyle {
position: absolute;
right: 20rpx;
bottom: 50rpx;
font-size: 28rpx;
width: 170rpx;
height: 64rpx;
background: #FFD100;
border-radius: 32rpx 32rpx 32rpx 32rpx;
border: none;
color: #000;
}
.state {
color: #FF4C11;
}
.state2 {
color: #999;
}
.fontStyle {
font-size: 28rpx;
font-weight: 400;
color: #666666;
}
}
}
.df {
display: flex;
align-items: center;
justify-content: space-between;
}
.ml-20 {
margin-left: 20rpx;
}
</style>

View File

@@ -1,605 +0,0 @@
<template>
<view class="container">
<view class="card">
<view class="head">
<text class="title">
<text>{{listinfo.name}}</text>
</text>
<text class="status" v-if="listinfo.status == 'unpaid' || listinfo.status == 'paying'">
<text> 待支付 </text>
</text>
<text class="status" v-if="listinfo.status == 'unsend'">
<text>待发货</text>
</text>
<text class="status" v-if="listinfo.status == 'closed'">
<text>订单完成</text>
</text>
<text class="status" v-if="listinfo.status == 'send'">
<text> 已发</text>
</text>
<text class="status" v-if="listinfo.status == 'refunding'">
<text>申请退单</text>
</text>
<text class="status" v-if="listinfo.status == 'refund'">
<text>退单</text>
</text>
<text class="status" v-if="listinfo.status == 'cancelled'">
<text>已取消</text>
</text>
<text class="status" v-if="listinfo.status == 'merge'">
<text>合台</text>
</text>
</view>
<view class="tag-wrap">
<text class="tag" v-if="listinfo.sendType == 'post'">快递</text>
<text class="tag" v-if="listinfo.sendType == 'takeaway'">外卖</text>
<text class="tag" v-if="listinfo.sendType == 'takeself'">自提</text>
<text class="tag" v-if="listinfo.sendType == 'table'">堂食</text>
</view>
<view v-if="listinfo.tableName">
桌号{{listinfo.tableName}}
</view>
<view class="number-wrap" style="margin-top: 20rpx;"
v-if="listinfo.status != 'unpaid' && listinfo.status != 'paying'&& listinfo.status != 'cancelled'">
<text class="t">取餐号</text>
<text class="number">{{listinfo.outNumber}}</text>
</view>
</view>
<view class="card">
<view class="head border" style="position: relative;">
<text class="title">
<text>点单详情</text>
</text>
<view style="display: flex;align-items: center;"
v-if="listinfo.status == 'unpaid' || listinfo.status == 'paying'">
<!-- <text style="font-size:24rpx;">支付时间:</text> -->
<uni-countdown :show-day="false" color="#ff0000" border-color="#00B26A" splitorColor="#000"
:font-size="14" :hour="0" :minute="listinfo.expiredMinutes" :second="listinfo.expiredSeconds" />
</view>
</view>
<view class="shop-info">
<view class="item" v-for="(item,index) in listinfo.details" :key="index">
<view class="cover">
<c-image width="120" height="120" radius="16" :src='item.productImg'></c-image>
</view>
<view class="info">
<text>{{item.productName}}</text>
<text class="n" v-if="item.productSkuName">{{item.productSkuName}}</text>
<text class="n">x{{item.num}}</text>
</view>
<view class="price">
<text class="i"></text>
<text class="num">{{item.priceAmount}}</text>
</view>
</view>
</view>
<view class="total-wrap">
<view class="price">
<text>合计</text>
<text class="i"></text>
<text class="num">{{listinfo.payAmount}}</text>
</view>
</view>
</view>
<view class="card">
<view class="head border">
<text class="title">订单信息</text>
</view>
<view class="order-info">
<view class="row" @click="copyHandle(listinfo.orderNo)">
<text class="t">订单信息</text>
<text class="info">{{listinfo.orderNo}}点击复制</text>
</view>
<view class="row">
<text class="t">创建时间</text>
<text class="info">{{$u.timeFormat(listinfo.time, 'yyyy-mm-dd hh:MM:ss')}}</text>
</view>
</view>
</view>
<view class="card" style="padding-bottom: 20rpx;" v-if="listinfo.shopQrcode">
<image :src="listinfo.shopQrcode" show-menu-by-longpress="true" style="width: 100%;" mode="widthFix">
</image>
</view>
<view class="payType" v-if="listinfo.status == 'unpaid' || listinfo.status == 'paying'">
<view class="">
支付方式
</view>
<view class="">
<u-radio-group v-model="radiovalue" iconPlacement="right" @change="groupChange" :size="28"
placement="column">
<u-radio activeColor="#ffd158" name="1">
<view class="dfs">
<image style="width:44rpx;height:44rpx"
src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/drder/balance.png" mode="">
</image>
<text style="font-size: 28rpx;margin-left: 16rpx;">
微信支付
</text>
</view>
</u-radio>
<view style="margin: 22rpx 0;width: 100%;height: 2rpx;background-color: #E5E5E5;">
</view>
<u-radio activeColor="#ffd158" name="2">
<view class="dfs">
<image style="width:44rpx;height:44rpx"
src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/drder/wechat.png" mode="">
</image>
<text style="font-size: 28rpx;margin-left: 16rpx;">
会员卡支付</text>
</view>
</u-radio>
</u-radio-group>
<view style="font-weight: 400;font-size: 24rpx;color: #333333;margin-left: 60rpx;">
会员卡余额{{ amountVIP?amountVIP.amount:0}} <text
style="font-weight: 500;font-size: 28rpx;margin-left: 16rpx;color: #FF4C11;"
@click="goRecharge">去充值</text>
</view>
</view>
</view>
<view :style="{height:height}">
</view>
<view class="fixedview">
<view class="flex-between" v-if="listinfo.status == 'unpaid' || listinfo.status == 'paying'">
<view class="fixedview_one flex-start">
<view class="fixedview_oneone">
实付金额
</view>
<view class="fixedview_onetow">
<text>¥</text>{{listinfo.payAmount}}
</view>
</view>
<view class="fixedview_tow" @tap="$u.debounce(showpopupclickddes,500)">
立即付款
</view>
</view>
</view>
<!-- 支付密码 -->
<payPassword ref="payPwd" @accountPayevent="accountPayevent" v-if="ispws"></payPassword>
</view>
</template>
<script>
import payPassword from '@/components/payPassword.vue'
export default {
components: {
payPassword
},
data() {
return {
height: '',
pay_type: 1,
orderId: '',
listinfo: {},
radiovalue: '1', //选择支付方式
ispws: false,
srcimge: 'https://czg-qr-order.oss-cn-beijing.aliyuncs.com/wx.jpg'
};
},
async onLoad(e) {
console.log(e)
this.orderId = e.orderId
},
onShow() {
this.orderorderInfo()
},
onUnload() {
uni.switchTab({
url: '/pages/order/order'
})
},
methods: {
groupChange(n) { //选择支付方式
this.radiovalue = n
},
mountedcreateSelectorQuery() {
//#ifdef MP-WEIXIN || H5
var query = uni.createSelectorQuery().in(this).select('.fixedview')
query.boundingClientRect(ele => {
var that = this;
console.log(ele, 111)
that.height = (ele.height) + "px"
that = null;
// uni.getSystemInfo({
// success(res) {
// }
// })
}).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
},
async paymodfiyOrderInfo() {
let res = await this.api.paymodfiyOrderInfo({
orderId: this.listinfo.orderId,
})
},
showpopupclickddes() {
// radiovalue为1是微信支付
if (this.radiovalue == 1) {
this.showpopupclick() //微信支付
} else {
// 先判断是否设置支付密码。0是没设置。没设置的情况下跳转到设置页面。有的话输入支付密码
// console.log(isPwd,'是否设置了支付密码')
if (uni.cache.get('userInfo').isPwd == 0) {
uni.pro.navigateTo('/pages/user/repairpassword', {
shopId_id: uni.cache.get('shopUser')
})
} else {
this.ispws = true
this.$nextTick(() => {
this.$refs.payPwd.onPayUp();
})
}
}
},
async showpopupclick() {
let res = await this.api.payorderPay({
orderId: this.orderId,
}) //判断是否支付成功
if (res.code == 0) {
uni.showLoading({
title: '加载中',
mask: true
})
// #ifdef MP-WEIXIN
uni.requestPayment({
provider: 'wxpay', //支付类型-固定值
partnerid: res.data.appId, // 微信支付商户号
timeStamp: res.data.timeStamp, // 时间戳(单位:秒)
nonceStr: res.data.nonceStr, // 随机字符串
package: res.data.package, // 固定值
signType: res.data.signType, //固定值
paySign: res.data.paySign, //签名
success: (res) => {
uni.showToast({
title: "支付成功"
})
setTimeout(res => {
uni.hideLoading()
uni.switchTab({
url: '/pages/order/order'
});
}, 500)
this.paymodfiyOrderInfo()
},
fail: (err) => {
uni.showToast({
icon: 'none',
title: '支付失败'
})
setTimeout(res => {
uni.hideLoading()
uni.switchTab({
url: '/pages/order/order'
});
}, 500)
}
});
// #endif
}
},
// 余额支付
async accountPayevent(pwd) {
this.ispws = false
let res = await this.api.accountPay({
orderId: this.listinfoid,
memberId: this.amountVIP.id,
// remark: this.remark,
pwd
})
if (res.code == 0) {
// data ->1 支付成功
// ->2 余额不足
// ->3 未设置支付密码,
// ->4 不是会员,
if (res.data == 1) {
this.showToastUppop('支付成功')
let _this = this
uni.requestSubscribeMessage({
tmplIds: ['z0fUG7-jhSfYCrw6poOvSRzh4_hgnPkm_5C7E5s5bCQ'],
complete() {
uni.redirectTo({
url: '/pages/order/order_detail?orderId=' + _this
.listinfoid
});
},
})
} else if (res.data == 2) {
this.showToastUppop('余额不足')
setTimeout(() => {
// 去充值
this.goRecharge()
}, 1500)
} else if (res.data == 3) {
this.showToastUppop('未设置支付密码')
setTimeout(() => {
uni.pro.navigateTo('/pages/user/repairpassword', {
shopId_id: uni.cache.get('shopUser')
})
}, 1500)
} else if (res.data == 4) {
this.showToastUppop('非会员请充值')
setTimeout(() => {
// 去充值
this.goRecharge()
}, 1500)
}
}
},
showToastUppop(title) {
uni.showToast({
icon: 'none',
title,
success: () => {
}
})
},
async orderorderInfo() {
let res = await this.api.orderorderInfo({
orderId: this.orderId
})
if (res.code == 0) {
this.listinfo = res.data
this.mountedcreateSelectorQuery()
}
},
copyHandle(e) {
uni.setClipboardData({
data: e,
success() {
uni.showToast({
title: '复制成功',
icon: 'none'
});
}
});
},
clickselect(b) {
this.pay_type = b
},
},
};
</script>
<style scoped lang="scss">
.container {
padding: 28upx;
}
.payType {
padding: 32rpx 34rpx;
margin-top: 48rpx;
background-color: #fff;
>view:first-child {
font-weight: 500;
font-size: 28rpx;
color: #333333;
}
>view:last-child {
margin-top: 32rpx;
}
.dfs {
display: flex;
align-items: center;
}
}
.card {
background-color: #fff;
border-radius: 20upx;
padding: 28upx;
margin-bottom: 28upx;
.head {
display: flex;
justify-content: space-between;
&.border {
padding-bottom: 28upx;
border-bottom: 1upx solid #fafafa;
}
.status {
color: #ff0000;
}
}
.tag-wrap {
padding: 20upx 0;
display: flex;
.tag {
display: flex;
align-items: center;
justify-content: center;
padding: 0 10upx;
color: $color-priamry;
border: 1px solid $color-priamry;
font-size: 24upx;
}
}
.number-wrap {
background-color: #fafafa;
border-radius: 16upx;
padding: 28upx 0;
display: flex;
flex-direction: column;
align-items: center;
.number {
font-size: 42upx;
font-weight: bold;
}
}
.price {
.i {
font-size: 20upx;
}
.num {
font-size: 38upx;
}
}
.shop-info {
padding: 28upx 0;
.item:nth-child(1) {
margin-top: 0;
}
.item {
margin-top: 16rpx;
display: flex;
.info {
flex: 1;
display: flex;
flex-direction: column;
justify-content: space-between;
padding-left: 28upx;
.n {
font-size: 24upx;
color: #999;
}
}
}
}
.total-wrap {
display: flex;
justify-content: flex-end;
padding-top: 28upx;
border-top: 1upx solid #fafafa;
}
.order-info {
.row {
display: flex;
justify-content: space-between;
padding-top: 28upx;
.t {
font-size: 24upx;
color: #999;
}
.info {
font-size: 24upx;
}
}
}
}
.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;
}
}
}
}
}
.fixedview {
position: fixed;
bottom: 0;
left: 0;
width: 100%;
.flex-between {
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: red;
border-radius: 34rpx;
padding: 10rpx 44rpx;
font-size: 32rpx;
font-family: PingFang SC-Bold, PingFang SC;
font-weight: bold;
color: #FFFFFF;
}
}
}
</style>

View File

@@ -6,7 +6,7 @@
<text>{{listinfo.name}}</text>
</text>
<text class="status" v-if="listinfo.status == 'unpaid' || listinfo.status == 'paying'">
<text> 待支付 </text>
<text>待支付</text>
</text>
<text class="status" v-if="listinfo.status == 'unsend'">
<text>待发货</text>
@@ -24,12 +24,11 @@
<text>退单</text>
</text>
<text class="status" v-if="listinfo.status == 'cancelled'">
<text>取消</text>
<text>取消订单</text>
</text>
<text class="status" v-if="listinfo.status == 'merge'">
<text>合台</text>
</text>
</view>
<view class="tag-wrap">
<text class="tag" v-if="listinfo.sendType == 'post'">快递</text>
@@ -37,27 +36,16 @@
<text class="tag" v-if="listinfo.sendType == 'takeself'">自提</text>
<text class="tag" v-if="listinfo.sendType == 'table'">堂食</text>
</view>
<view v-if="listinfo.tableName">
桌号{{listinfo.tableName}}
</view>
<view class="number-wrap" style="margin-top: 20rpx;"
v-if="listinfo.status != 'unpaid' && listinfo.status != 'paying'&& listinfo.status != 'cancelled'">
<view class="number-wrap" v-if="listinfo.status != 'unpaid' || listinfo.status != 'paying'">
<text class="t">取餐号</text>
<text class="number">{{listinfo.outNumber}}</text>
<text class="number">{{listinfo.tableName}}</text>
</view>
</view>
<view class="card">
<view class="head border" style="position: relative;">
<view class="head border">
<text class="title">
<text>点单详情</text>
</text>
<view style="display: flex;align-items: center;"
v-if="listinfo.status == 'unpaid' || listinfo.status == 'paying'">
<!-- <text style="font-size:24rpx;">支付时间:</text> -->
<uni-countdown :show-day="false" color="#ff0000" border-color="#00B26A" splitorColor="#000"
:font-size="14" :hour="0" :minute="listinfo.expiredMinutes" :second="listinfo.expiredSeconds" />
</view>
</view>
<view class="shop-info">
<view class="item" v-for="(item,index) in listinfo.details" :key="index">
@@ -66,10 +54,8 @@
</view>
<view class="info">
<text>{{item.productName}}</text>
<text class="n" v-if="item.productSkuName">{{item.productSkuName}}</text>
<text class="n">x{{item.num}}</text>
</view>
<view class="price">
<text class="i"></text>
<text class="num">{{item.priceAmount}}</text>
@@ -101,8 +87,7 @@
</view>
<view class="card" style="padding-bottom: 20rpx;" v-if="listinfo.shopQrcode">
<image :src="listinfo.shopQrcode" show-menu-by-longpress="true" style="width: 100%;" mode="widthFix">
</image>
<image :src="listinfo.shopQrcode" show-menu-by-longpress="true" style="width: 100%;" mode="widthFix"></image>
</view>
<view :style="{height:height}">
@@ -135,20 +120,18 @@
pay_type: 1,
orderId: '',
listinfo: {},
srcimge: 'https://czg-qr-order.oss-cn-beijing.aliyuncs.com/wx.jpg'
srcimge:'https://czg-qr-order.oss-cn-beijing.aliyuncs.com/wx.jpg'
};
},
async onLoad(e) {
console.log(e)
this.orderId = e.orderId
},
onShow() {
this.orderorderInfo()
},
onUnload() {
uni.switchTab({
url: '/pages/order/order'
})
onShow() {
if (this.orderId) {
this.orderorderInfo()
}
},
methods: {
mountedcreateSelectorQuery() {
@@ -192,35 +175,40 @@
// #ifdef MP-WEIXIN
uni.requestPayment({
provider: 'wxpay', //支付类型-固定值
partnerid: res.data.appId, // 微信支付商户号
timeStamp: res.data.timeStamp, // 时间戳(单位:秒)
nonceStr: res.data.nonceStr, // 随机字符串
package: res.data.package, // 固定值
signType: res.data.signType, //固定值
partnerid: res.data.payAppId, // 微信支付商户号
timeStamp: res.data.payTimeStamp, // 时间戳(单位:秒)
nonceStr: res.data.paynonceStr, // 随机字符串
package: res.data.payPackage, // 固定值
signType: res.data.paySignType, //固定值
paySign: res.data.paySign, //签名
success: (res) => {
uni.hideLoading()
uni.showToast({
title: "支付成功"
})
setTimeout(res => {
uni.hideLoading()
uni.switchTab({
url: '/pages/order/order'
});
}, 500)
}, 2000)
this.paymodfiyOrderInfo()
// uni.redirectTo({
// url: "/pages/mall/order/ordersuccess?id=" + datareslane.data
// .order_id,
// });
},
fail: (err) => {
uni.hideLoading()
uni.showToast({
icon: 'none',
title: '支付失败'
})
setTimeout(res => {
uni.hideLoading()
uni.switchTab({
url: '/pages/order/order'
});
}, 500)
}, 2000)
}
});
@@ -280,7 +268,7 @@
}
.tag-wrap {
padding: 20upx 0;
padding: 28upx 0;
display: flex;
.tag {

View File

@@ -1,336 +0,0 @@
<template>
<view>
<u-sticky bgColor="#fff">
<view class="tab-wrap">
<view class="item" v-for="(item, index) in tabs" :key="index" @click="orderswitch(item,index)">
<text>{{ item.name }}</text>
</view>
<view class="line-wrap"
:style="{ left: `${(100 / tabs.length) * active}%`, width: `${100 / tabs.length}%` }">
<view class="line"></view>
</view>
</view>
</u-sticky>
<view class="list-wrap">
<view class="item" v-for="(item,index) in list" :key="index" @click="orderinfo(item)">
<view class="header-wrap">
<text v-if="item.sendType == 'post'">快递</text>
<text v-if="item.sendType == 'takeaway'">外卖</text>
<text v-if="item.sendType == 'takeself'">自提</text>
<text v-if="item.sendType == 'table'">堂食</text>
<text class="status" v-if="item.status == 'unpaid' || item.status == 'paying'">
<text>待支付</text>
</text>
<text class="status" v-if="item.status == 'unsend'">
<text>待发货</text>
</text>
<text class="status" v-if="item.status == 'closed'">
<text>订单完成</text>
</text>
<text class="status" v-if="item.status == 'send'">
<text> 已发</text>
</text>
<text class="status" v-if="item.status == 'refunding'">
<text>申请退单</text>
</text>
<text class="status" v-if="item.status == 'refund'">
<text>退单</text>
</text>
<text class="status" v-if="item.status == 'cancelled'">
<text>取消订单</text>
</text>
<text class="status" v-if="item.status == 'merge'">
<text>合台</text>
</text>
</view>
<view class="content">
<view class="shop-info">
<view class="shop-item">
<view class="cover flex-start" v-for="(item1,index1) in item.detailList" :key="index1">
<!-- <image :src="item1.productImg" style="width: 200rpx;height: 200rpx; border-radius: 20rpx;" mode="widthFix"></image> -->
<c-image width="200" height="200" radius="20" :src="item1.productImg"></c-image>
</view>
<!-- <view class="info">
<text class="name">美味大宅蟹</text>
<text class="num">数量1</text>
</view> -->
</view>
</view>
<view class="total">
<text class="t">需付款</text>
<text class="i"></text>
<text class="num">{{item.orderAmount}}</text>
</view>
<view class="intro-wrap">
<text class="time">下单日期{{$u.timeFormat(item.createdAt, 'yyyy-mm-dd hh:MM')}}</text>
<text class="intro num">{{item.totalNumber}}件商品 合计{{item.orderAmount}}</text>
</view>
</view>
<view class="footer-wrap">
<view class="btn">
<text>查看详情</text>
</view>
</view>
</view>
</view>
<u-loadmore :status="form.status" fontSize="28" color="#999" iconSize="28" />
</view>
</template>
<script>
import list from '../../uni_modules/uview-ui/libs/config/props/list';
export default {
data() {
return {
active: 0,
tabs: [{
name: '全部',
type: 1,
status: ''
},
{
name: '待支付',
type: 2,
status: 'unpaid'
},
{
name: '待发货',
type: 3,
status: 'unsend'
},
{
name: '已完成',
type: 4,
status: 'closed'
},
{
name: '退款',
type: 5,
status: 'refund'
}
],
list: [],
is_end: false,
swiperCurrent: '',
form: {
page: 1,
size: 10,
status: 'loadmore',
},
};
},
onShow() {
if (uni.cache.get('token')) {
this.loginwxuserInfo()
}
if (this.tabs.findIndex((item) => item.type == this.useStorage.get('orderType')) == -1) {
this.active = 0
} else {
this.active = (this.tabs.findIndex((item) => item.type == this.useStorage.get('orderType')));
}
this.init_fn()
},
onReachBottom() {
this.orderorderList()
},
methods: {
async loginwxuserInfo() {
let res = await this.api.loginwxuserInfo({
userId: uni.cache.get('userInfo').id
})
if (res.code == 0) {
uni.cache.set('userInfo', res.data);
this.userInfo = uni.cache.get('userInfo')
}
},
orderinfo(e) {
uni.pro.navigateTo('order/order_detail', {
orderId: e.id
})
},
init_fn() {
this.list = []
this.is_end = false
this.form.page = 1
this.form.status = 'loadmore'
this.orderorderList()
},
orderswitch(e, a) {
this.active = a
if (e.type == 1) {
this.swiperCurrent = ''
} else {
this.swiperCurrent = e.status
}
this.init_fn()
},
async orderorderList() {
let res = await this.api.orderorderList({
page: this.form.page,
size: this.form.size,
userId: uni.cache.get('userInfo').id, //userId
status: this.swiperCurrent
})
if (res.data.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.data];
if (res.data.length == 10) {
this.form.status = 'loading';
} else {
this.is_end = true;
this.form.status = 'nomore';
}
}, 500)
}
},
}
};
</script>
<style scoped lang="scss">
$tabH: 80upx;
$color: #ff411d;
.tab-wrap {
display: flex;
height: $tabH;
position: relative;
.item {
flex: 1;
display: flex;
align-items: center;
justify-content: center;
position: relative;
z-index: 2;
}
.line-wrap {
position: absolute;
bottom: 0;
display: flex;
justify-content: center;
padding-bottom: 8upx;
transition: all 0.3s ease-in-out;
.line {
$h: 6upx;
width: 30%;
height: $h;
border-radius: $h;
background-color: $color;
}
}
}
.list-wrap {
padding: $paddingSize;
.item {
border-radius: 20upx;
background-color: #fff;
&:not(:first-child) {
margin-top: $paddingSize;
}
.header-wrap {
padding: $paddingSize;
border-bottom: 1upx solid #ececec;
display: flex;
justify-content: space-between;
.status {
color: $color;
}
}
.content {
padding: $paddingSize;
.shop-info {
.shop-item {
display: flex;
overflow: hidden;
overflow-x: scroll;
.cover:nth-child(1) {
margin-left: 0rpx;
}
.cover {
// white-space: nowrap;
margin-left: 10rpx;
}
.info {
flex: 1;
display: flex;
flex-direction: column;
justify-content: space-around;
padding-left: 20upx;
}
}
}
.total {
display: flex;
align-items: flex-end;
justify-content: flex-end;
.t {
font-weight: bold;
font-size: 32upx;
}
.i {
font-size: 24upx;
}
.num {
font-size: 38upx;
position: relative;
top: 8upx;
}
}
.intro-wrap {
display: flex;
justify-content: space-between;
padding-top: $paddingSize;
.time {
color: #999;
font-size: 24upx;
}
.intro {
font-size: 24upx;
}
}
}
.footer-wrap {
display: flex;
justify-content: flex-end;
border-top: 1upx solid #ececec;
padding: $paddingSize;
.btn {
padding: 8upx 24upx;
border-radius: 100upx;
border: 1px solid #333;
display: flex;
align-items: center;
}
}
}
}
</style>

View File

@@ -1,413 +0,0 @@
<template>
<view class="content">
<!-- 占位符导航栏 -->
<navseat class="navbar" :opacity='opacitys' :title='titlename' :titleshow='false'></navseat>
<view class="onecontent">
<view :style="[{'padding-top':HeighT.customBar +44+'px'}]"></view>
<view class="onecontentabsolute flex-center">
<image class="onecontentabsoluteimage"
src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/drder/dui.png" mode="aspectFill"></image>
<view class="onecontentabsolutebox flex-colum-start">
<text>支付成功</text>
<text style="margin-top: 16rpx;font-size: 24rpx;">感谢您的购买</text>
</view>
</view>
</view>
<view class="towcontent">
<view class="towcontentone">
{{orderInfo.orderAmount}}
</view>
<view class="towcontentow flex-between">
<view class="towcontentow_O">
订单编号
</view>
<view class="towcontentow_T">
{{orderInfo.orderNo}}
</view>
</view>
<view class="towcontentow flex-between">
<view class="towcontentow_O">
下单时间
</view>
<view class="towcontentow_T">
{{orderInfo.createdAt|createdAtfiter}}
</view>
</view>
<view class="towcontentow flex-between">
<view class="towcontentow_O">
支付方式
</view>
<view class="towcontentow_T">
{{paytype==1?'微信支付':'余额支付'}}
</view>
</view>
<view class="towcontenthere flex-colum" v-if="orderinfo">
<view class="towcontentherebox flex-center">
<image src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/drder/yhj.png" mode=""></image>
<text>恭喜获得优惠券</text>
</view>
<view class="towcontenthereimage flex-colum">
<view class="towcontenthereimageone">
<text style="font-size:28rpx; color: #FF7C0D;"></text>
{{orderinfo.couponsAmount}}
</view>
<view class="towcontenthereimagetow">
通用红包券
</view>
<view class="towcontenthereimagethere">
有效至 {{orderinfo.endTime}}
</view>
<view class="towcontenthereimagefour">
限时红包变大 快来领取
</view>
<view class="towcontenthereimagefive flex-between">
<view class="towcontenthereimagefiveone" @click="wantEvent">
我在想想
</view>
<view class="towcontenthereimagefivetow" @click="DoublingEvent">
马上翻倍
</view>
</view>
</view>
</view>
</view>
</view>
</template>
<script>
import navseat from '@/components/navseat.vue'
export default {
components: {
navseat
},
filters: {
createdAtfiter(d) {
const timestamp = d; // 待转换的时间戳
const date = new Date(timestamp); // 根据时间戳创建Date对象
const year = date.getFullYear(); // 获取年份
const month = date.getMonth() + 1; // 获取月份需要加1
const day = date.getDate(); // 获取日期
const hour = date.getHours(); // 获取小时
const minute = date.getMinutes(); // 获取分钟
const second = date.getSeconds(); // 获取秒数
const formattedDate =
`${year}-${month}-${day} ${hour<10? '0'+hour:hour}:${minute<10? '0'+minute:minute}:${second<10? '0'+second:second}`; // 拼接成格式化后的日期字符串
return formattedDate
}
},
data() {
return {
paytype: 1,
titlename: '支付详情',
orderId: "",
opacitys: false,
towcontentclickindex: 0,
windowHeight: '',
seighT: '',
customheighttop: '', //top高度
isFixedTop: false,
Topdistance: 3000, //吸顶初始距离
listbox: [{
name: '全部'
},
{
name: '美食正餐'
},
{
name: '饮品小吃'
}
],
orderinfo: null,
form: {
address: '', //地址
type: '', //品类
orderBy: '', //1.理我最近 2.销量优先 3.价格优先
distance: '', //附近1KM 1选中 0不选中
page: 1, //页数
size: 10, //页容量
status: 'loadmore'
},
orderInfo: null
};
},
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) {
console.log(e,'调试1')
this.paytype = e.radiovalue1
this.orderId = e.orderId
setTimeout(() => {
this.GetTop()
}, 1000)
this.getinfo(e.orderId)
this.orderInfo = JSON.parse(e.orderInfo)
},
computed: {
HeighT() { //手机类型的尺寸
return this.$store.getters.is_BarHeight
},
},
methods: {
async getinfo(id) {
let res = await this.api.getYhqDouble({
orderId: id
})
if (res.code == 0) {
this.orderinfo = res.data
}
},
wantEvent() {
uni.redirectTo({
url: '/pages/order/order_detail?orderId=' + this.orderId
});
},
async DoublingEvent() {
let res = await this.api.yhqDouble({
conponsId: this.orderinfo.id
})
if (res.code == 0) {
this.wantEvent()
}
},
//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 {}
.content {
.onecontent {
position: relative;
z-index: 99;
width: 100%;
// #ifdef APP-PLUS || H5
height: 498.1rpx;
background: url(https://czg-qr-order.oss-cn-beijing.aliyuncs.com/successful.png) no-repeat;
// #endif
// #ifdef MP-WEIXIN
background: url(https://czg-qr-order.oss-cn-beijing.aliyuncs.com/drder/successfules.png) no-repeat;
height: 586rpx;
// #endif
background-size: cover;
.onecontentabsolute {
position: absolute;
width: 100%;
margin-top: 50rpx;
.onecontentabsoluteimage {
width: 98.53rpx;
height: 93.63rpx;
}
.onecontentabsolutebox {
margin-left: 42rpx;
text {
font-family: PingFang SC, PingFang SC;
font-weight: bold;
font-size: 32rpx;
color: #FFFFFF;
}
}
}
}
.towcontent {
position: relative;
z-index: 100;
top: -148rpx;
margin: 0 auto;
width: 630rpx;
background: #FFFFFF;
border-radius: 0rpx 0rpx 24rpx 24rpx;
padding: 0 24rpx;
.towcontentone {
padding-top: 26rpx;
width: 100%;
text-align: center;
font-family: Roboto, Roboto;
font-weight: bold;
font-size: 44rpx;
color: #333333;
}
.towcontentow {
margin-top: 16rpx;
.towcontentow_O {
font-family: PingFang SC, PingFang SC;
font-weight: 500;
font-size: 24rpx;
color: #999999;
}
.towcontentow_T {
font-family: PingFang SC, PingFang SC;
font-weight: bold;
font-size: 24rpx;
color: #333333;
}
}
.towcontenthere {
margin-top: 32rpx;
border-top: 1rpx dashed #E5E5E5;
.towcontentherebox {
margin-top: 48rpx;
image {
width: 38.48rpx;
height: 38.42rpx;
}
text {
margin-left: 16rpx;
font-family: PingFang SC, PingFang SC;
font-weight: bold;
font-size: 28rpx;
color: #333333;
}
}
.towcontenthereimage {
margin-top: 48rpx;
width: 540rpx;
height: 498rpx;
background: url(https://czg-qr-order.oss-cn-beijing.aliyuncs.com/drder/yhjs.png) no-repeat;
background-size: cover;
justify-content: flex-start;
.towcontenthereimageone {
margin-top: 54rpx;
font-family: Roboto, Roboto;
font-weight: bold;
font-size: 48rpx;
color: #FF7C0D;
}
.towcontenthereimagetow {
margin-top: 28rpx;
width: 184rpx;
height: 40rpx;
line-height: 40rpx;
text-align: center;
background: rgba(255, 219, 151, 0.33);
border-radius: 12rpx 12rpx 12rpx 12rpx;
font-family: PingFang SC, PingFang SC;
font-weight: bold;
font-size: 24rpx;
color: #C7620E;
}
.towcontenthereimagethere {
margin-top: 8rpx;
font-family: PingFang SC, PingFang SC;
font-weight: bold;
font-size: 20rpx;
color: #333333;
}
.towcontenthereimagefour {
margin-top: 74rpx;
font-family: PingFang SC, PingFang SC;
font-weight: bold;
font-size: 28rpx;
color: #FFFFFF;
}
.towcontenthereimagefive {
margin-top: 40rpx;
.towcontenthereimagefiveone {
padding: 12rpx 28rpx;
background: #FFF6D8;
border-radius: 46rpx 46rpx 46rpx 46rpx;
border: 2rpx solid #FFE18F;
font-family: PingFang SC, PingFang SC;
font-weight: bold;
font-size: 28rpx;
color: #333333;
}
.towcontenthereimagefivetow {
margin-left: 16rpx;
padding: 12rpx 28rpx;
font-family: PingFang SC, PingFang SC;
font-weight: bold;
font-size: 28rpx;
color: #FFFFFF;
background: linear-gradient(178deg, #FFFF81 0%, rgba(255, 76, 59, 0.56) 100%);
box-shadow: 0rpx 4rpx 6rpx 2rpx rgba(222, 91, 43, 0.65);
border-radius: 46rpx 46rpx 46rpx 46rpx;
}
}
}
}
}
.towcontent::after {
content: '';
position: absolute;
top: -14rpx;
left: -32rpx;
width: 694rpx;
height: 14rpx;
background: #FFA556;
border-radius: 12rpx 12rpx 12rpx 12rpx;
}
}
</style>

View File

@@ -1,543 +0,0 @@
<template>
<view class="container">
<view class="card">
<view class="shop-info">
<view class="item" v-for="(item,index) in cartLists.data" :key="index">
<view class="cover">
<c-image width="120" height="120" radius="16" :src='item.coverImg'></c-image>
</view>
<view class="info">
<text>{{item.name}}</text>
<text class="n">{{item.skuName}}</text>
<text class="n">x{{item.number}}</text>
</view>
<view class="price">
<text class="i"></text>
<text class="num">{{item.salePrice}}</text>
</view>
</view>
</view>
</view>
<!-- 支付密码 -->
<payPassword ref="payPwd" @accountPayevent="accountPayevent" v-if="ispws"></payPassword>
</view>
</template>
<script>
// import {object} from 'prop-types';
import webSocketUtils from '@/common/js/websocket.js'
import payPassword from '@/components/payPassword.vue'
export default {
components: {
payPassword
},
data() {
return {
height: '',
pay_type: 1,
remark: '',
listinfo: {
detailList: [],
amount: '',
amounts: ''
},
emitorderfoodform: {
clickiconone: ''
},
orderInfo: '',
// 可用优惠券数据
couponAmount: 0,
// 输入支付密码 123
ispws: false,
listinfoid: ''
};
},
props: {
cartLists: {
type: Object,
default () {
return {
amount: '0.00',
data: []
}
}
},
radiovalue: {
type: String,
default: '1'
},
amountVIP: {
type: Object,
default () {
return {
}
}
}
},
onUnload() {
this.ispws = false
},
methods: {
groupChange(n) {
this.radiovalue = n
},
async getAount() {
let res = await this.api.shopUserInfo({
"shopId": uni.cache.get('shopUser'),
"userId": uni.cache.get('userInfo').id,
})
if (res.code == 0) {
this.amountVIP = res.data
}
},
orderfoodindex() { //优惠劵
uni.pro.navigateTo('index/coupons/index', {
orderfood: 0,
orderId: this.listinfoid,
amount: this.listinfo.amounts
})
},
copyHandle(e) {
uni.setClipboardData({
data: e,
success() {
uni.showToast({
title: '复制成功',
icon: 'none'
});
}
});
},
async paymodfiyOrderInfo() { //支付完成后请求
let res = await this.api.paymodfiyOrderInfo({
orderId: this.listinfoid,
})
},
goRecharge() { // 去充值
uni.pro.navigateTo('/pages/member/index', {
shopId: uni.cache.get('shopUser')
})
},
showpopupclickddes(ID) {
// radiovalue为1是微信支付
this.listinfoid = ID
if (this.radiovalue == 1) {
this.showpopupclickdds() //微信支付
} else {
// 先判断是否设置支付密码。0是没设置。没设置的情况下跳转到设置页面。有的话输入支付密码
// console.log(isPwd,'是否设置了支付密码')
if (uni.cache.get('userInfo').isPwd == 0) {
uni.pro.navigateTo('/pages/user/repairpassword', {
shopId_id: uni.cache.get('shopUser')
})
} else {
this.ispws = true
this.$nextTick(() => {
this.$refs.payPwd.onPayUp();
})
}
}
},
// 微信支付
async showpopupclickdds() {
let res = await this.api.payorderPay({
orderId: this.listinfoid
}) //判断是否支付成功
if (res.code == 0) {
uni.showLoading({
title: '加载中',
mask: true
})
// #ifdef MP-WEIXIN
// 微信支付还是余额支付
uni.requestPayment({
provider: 'wxpay', //支付类型-固定值
partnerid: res.data.appId, // 微信支付商户号
timeStamp: res.data.timeStamp, // 时间戳(单位:秒)
nonceStr: res.data.nonceStr, // 随机字符串
package: res.data.package, // 固定值
signType: res.data.signType, //固定值
paySign: res.data.paySign, //签名
success: (res) => {
let _this = this
uni.requestSubscribeMessage({
tmplIds: ['z0fUG7-jhSfYCrw6poOvSRzh4_hgnPkm_5C7E5s5bCQ'],
complete() {
uni.showToast({
title: "支付成功"
})
// uni.cache.set('shopUser', '') //删除shopUser
_this.paymodfiyOrderInfo()
uni.redirectTo({
url: '/pages/order/order_detail?orderId=' + _this
.listinfoid
});
},
})
},
fail: () => {
uni.hideLoading()
}
});
// #endif
uni.hideLoading()
}
},
// 余额支付
async accountPayevent(pwd) {
this.ispws = false
let res = await this.api.accountPay({
orderId: this.listinfoid,
memberId: this.amountVIP.id,
// remark: this.remark,
pwd
})
if (res.code == 0) {
// data ->1 支付成功
// ->2 余额不足
// ->3 未设置支付密码,
// ->4 不是会员,
if (res.data == 1) {
this.showToastUppop('支付成功')
let _this = this
uni.requestSubscribeMessage({
tmplIds: ['z0fUG7-jhSfYCrw6poOvSRzh4_hgnPkm_5C7E5s5bCQ'],
complete() {
uni.redirectTo({
url: '/pages/order/order_detail?orderId=' + _this
.listinfoid
});
},
})
} else if (res.data == 2) {
this.showToastUppop('余额不足')
setTimeout(() => {
// 去充值
this.goRecharge()
}, 1500)
} else if (res.data == 3) {
this.showToastUppop('未设置支付密码')
setTimeout(() => {
uni.pro.navigateTo('/pages/user/repairpassword', {
shopId_id: uni.cache.get('shopUser')
})
}, 1500)
} else if (res.data == 4) {
this.showToastUppop('非会员请充值')
setTimeout(() => {
// 去充值
this.goRecharge()
}, 1500)
}
}
},
showToastUppop(title) {
uni.showToast({
icon: 'none',
title,
success: () => {
}
})
},
},
async mounted() {
uni.getSystemInfo({
success: (data) => {
this.height = (data.windowHeight / 2) + "px";
console.log(this.height, 1111);
}
})
// //#ifdef MP-WEIXIN || H5
// var query = uni.createSelectorQuery().in(this).select('.fixedview')
// query.boundingClientRect(ele => {
// var that = this;
// 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 scoped lang="scss">
.container {
padding: 0 28upx 28upx 28upx 28upx;
max-height: 600px;
overflow: auto;
}
.card {
background-color: #fff;
border-radius: 20upx;
padding: 28upx;
margin-bottom: 48rpx;
.head {
display: flex;
justify-content: space-between;
&.border {
padding-bottom: 28upx;
border-bottom: 1upx solid #fafafa;
}
.status {
color: #ff0000;
}
}
.tag-wrap {
padding: 28upx 0;
display: flex;
.tag {
display: flex;
align-items: center;
justify-content: center;
padding: 0 10upx;
color: $color-priamry;
border: 1px solid $color-priamry;
font-size: 24upx;
}
}
.number-wrap {
background-color: #fafafa;
border-radius: 16upx;
padding: 28upx 0;
display: flex;
flex-direction: column;
align-items: center;
.number {
font-size: 42upx;
font-weight: bold;
}
}
.price {
.i {
font-size: 20upx;
}
.num {
font-size: 38upx;
}
}
.shop-info {
padding: 28upx 0;
.item:nth-child(1) {
margin-top: 0;
}
.item {
margin-top: 16rpx;
display: flex;
.info {
flex: 1;
display: flex;
flex-direction: column;
justify-content: space-between;
padding-left: 28upx;
.n {
font-size: 24upx;
color: #999;
}
}
}
}
.total-wrap {
display: flex;
justify-content: flex-end;
padding-top: 28upx;
border-top: 1upx solid #fafafa;
}
.order-info {
.row {
display: flex;
justify-content: space-between;
padding-top: 28upx;
.t {
font-size: 24upx;
color: #999;
}
.info {
font-size: 24upx;
}
}
}
}
.sixcontent {
width: 100%;
background: #FFFFFF;
padding: 32rpx;
margin-top: 32rpx;
border-radius: 12rpx;
.sixcontentone {
padding-bottom: 28rpx;
border-bottom: 1px solid #F7F7F7;
font-size: 28rpx;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
color: #333333;
.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;
}
}
}
}
}
.redMoney {
display: flex;
align-items: center;
justify-content: space-between;
margin-top: 30rpx;
background-color: #fff;
padding: 18rpx 14rpx;
>view:first-child {
display: flex;
align-items: center;
font-weight: 400;
font-size: 28rpx;
color: #333333;
}
>view:last-child {
background: #FFE9E9;
border-radius: 16rpx 16rpx 16rpx 16rpx;
font-weight: 400;
font-size: 28rpx;
color: #FF3333;
text-align: center;
padding: 9rpx 13rpx;
}
}
.payType {
padding: 32rpx 34rpx;
margin-top: 48rpx;
background-color: #fff;
>view:first-child {
font-weight: 500;
font-size: 28rpx;
color: #333333;
}
>view:last-child {
margin-top: 32rpx;
}
.dfs {
display: flex;
align-items: center;
}
}
.fixedview {
position: fixed;
bottom: 0;
left: 0;
width: 100%;
height: 180rpx;
padding: 16rpx 34rpx;
.flex-between {
width: 100%;
padding: 24rpx 28rpx;
background: #FFFFFF;
flex-wrap: nowrap;
.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_onethere {
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 24rpx;
color: #999999;
}
}
.fixedview_tow {
background: red;
border-radius: 34rpx;
padding: 10rpx 44rpx;
font-size: 32rpx;
font-family: PingFang SC-Bold, PingFang SC;
font-weight: bold;
color: #FFFFFF;
}
}
}
</style>

View File

@@ -1,813 +0,0 @@
<template>
<view class="container">
<view class="card" v-if="listinfo.tableName">
<view class="head">
<text class="title">
<text>{{listinfo.tableName || '空'}}</text>
</text>
<text class="status" v-if="listinfo.status == 'unpaid'">
<text>待支付</text>
</text>
<text class="status" v-if="listinfo.status == 'unsend'">
<text>待发货</text>
</text>
<text class="status" v-if="listinfo.status == 'closed'">
<text>订单完成</text>
</text>
<text class="status" v-if="listinfo.status == 'send'">
<text>已发</text>
</text>
<text class="status" v-if="listinfo.status == 'refunding'">
<text>申请退单</text>
</text>
<text class="status" v-if="listinfo.status == 'refund'">
<text>退单</text>
</text>
<text class="status" v-if="listinfo.status == 'cancelled'">
<text>取消订单</text>
</text>
<text class="status" v-if="listinfo.status == 'merge'">
<text>合台</text>
</text>
</view>
<view class="tag-wrap">
<text class="tag" v-if="listinfo.sendType == 'post'">快递</text>
<text class="tag" v-if="listinfo.sendType == 'takeaway'">外卖</text>
<text class="tag" v-if="listinfo.sendType == 'takeself'">自提</text>
<text class="tag" v-if="listinfo.sendType == 'table'">堂食</text>
</view>
<view class="number-wrap"
v-if="listinfo.status != 'unpaid' && listinfo.status != 'paying'&& listinfo.status != 'cancelled'">
<text class="t">取餐号</text>
<text class="number">{{listinfo.outNumber || '空'}}</text>
</view>
</view>
<view class="card" v-if="listinfoid && listinfo">
<view class="head border">
<text class="title">
<text>点单详情</text>
</text>
</view>
<view class="shop-info">
<view class="item" v-for="(item,index) in listinfo.details" :key="index">
<view class="cover">
<c-image width="120" height="120" radius="16" :src='item.productImg'></c-image>
</view>
<view class="info">
<text>{{item.productName}}</text>
<text class="n" v-if="item.productSkuName">{{item.productSkuName}}</text>
<text class="n">x{{item.num}}</text>
</view>
<view class="price">
<text class="i"></text>
<text class="num">{{item.price}}</text>
</view>
</view>
</view>
<view class="total-wrap">
<view class="price">
<text>合计</text>
<text class="i"></text>
<text class="num">{{listinfo.payAmount}}</text>
</view>
</view>
</view>
<view class="card" v-else>
<view class="shop-info">
<view class="item" v-for="(item,index) in cartLists.data" :key="index">
<view class="cover">
<c-image width="120" height="120" radius="16" :src='item.coverImg'></c-image>
</view>
<view class="info">
<text>{{item.name}}</text>
<text class="n">{{item.skuName}}</text>
<text class="n">x{{item.number}}</text>
</view>
<view class="price">
<text class="i"></text>
<text class="num">{{item.salePrice}}</text>
</view>
</view>
</view>
</view>
<!-- <view class="sixcontent">
<view class="sixcontentone flex-between" style="padding: 0 0;" @click="orderfoodindex">
<view class="sixcontent_one" style="padding: 0 0;">
优惠券
</view>
<text style="color: red;">{{emitorderfoodform.couponsPrice}}</text>
</view>
</view> -->
<!-- <view class="redMoney">
<view>
<image src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/drder/hongbao.png"
style="width: 30rpx;height: 30.24rpx;;" mode=""></image>
红包/抵用券
</view>
<view @click="orderfoodindex">
可用优惠券{{couponAmount}}
</view>
</view> -->
<view style="padding: 0 20rpx;">
<u--textarea v-model="remark" placeholder="备注"></u--textarea>
</view>
<!-- 支付方式 -->
<view class="payType">
<view class="">
支付方式
</view>
<view class="">
<u-radio-group v-model="radiovalue" iconPlacement="right" @change="groupChange" :size="28"
placement="column">
<u-radio activeColor="#ffd158" name="1">
<view class="dfs">
<image style="width:44rpx;height:44rpx"
src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/drder/balance.png" mode="">
</image>
<text style="font-size: 28rpx;margin-left: 16rpx;">
微信支付
</text>
</view>
</u-radio>
<view style="margin: 22rpx 0;width: 100%;height: 2rpx;background-color: #E5E5E5;">
</view>
<u-radio activeColor="#ffd158" name="2">
<view class="dfs">
<image style="width:44rpx;height:44rpx"
src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/drder/wechat.png" mode="">
</image>
<text style="font-size: 28rpx;margin-left: 16rpx;">
会员卡支付</text>
</view>
</u-radio>
</u-radio-group>
<view style="font-weight: 400;font-size: 24rpx;color: #333333;margin-left: 60rpx;">
会员卡余额{{ amountVIP?amountVIP.amount:0}} <text
style="font-weight: 500;font-size: 28rpx;margin-left: 16rpx;color: #FF4C11;"
@click="goRecharge">去充值</text>
</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">
<u-icon name="weixin-fill" color="#999999" size="32"></u-icon>
<text class="sixcontenttowitemonetext">微信支付</text>
</view>
<view class="flex-start">
<u-icon v-if="pay_type == 1" name="checkmark-circle-fill" color="#333333" size="26"></u-icon>
<u-icon v-else name="checkmark-circle-fill" color="#999999" size="26"></u-icon>
</view>
</view>
<view class="sixcontenttowitem flex-between" @click="clickselect(2)">
<view class="sixcontenttowitemone flex-start">
<u-icon name="zhifubao" color="#999999" size="26"></u-icon>
<text class="sixcontenttowitemonetext">余额支付</text>
</view>
<view class="flex-start">
<u-icon v-if="pay_type == 2" name="checkmark-circle-fill" color="#333333" size="26"></u-icon>
<u-icon v-else name="checkmark-circle-fill" color="#999999" size="26"></u-icon>
</view>
</view>
</view>
</view> -->
<view :style="{height:height}">
</view>
<view class="fixedview">
<view class="flex-between">
<view class="fixedview_one flex-start">
<view class="fixedview_oneone">
实付金额
</view>
<view class="fixedview_onetow" v-if="listinfoid && listinfo">
<text>¥</text>{{listinfo.payAmount}}
</view>
<view class="fixedview_onetow" v-else>
<text>¥</text>{{cartLists.amount}}
</view>
<!-- <view class="fixedview_onethere" v-if="emitorderfoodform.couponsPrice">
以优惠¥{{emitorderfoodform.couponsPrice}}
</view> -->
</view>
<view class="fixedview_tow" @tap="$u.debounce(showpopupclickdd, 500)" v-if="listinfoid && listinfo">
立即付款
</view>
<view class="fixedview_tow" @tap="$u.debounce(orderdetail, 500)" v-else>
立即付款
</view>
</view>
</view>
<!-- 支付密码 -->
<payPassword ref="payPwd" @accountPayevent="accountPayevent" v-if="ispws"></payPassword>
<!-- 弹幕 -->
<l-barrage ref="lBarrage" @end="onEnd" :minTop='0' :maxTop='16'></l-barrage>
</view>
</template>
<script>
// import {object} from 'prop-types';
import webSocketUtils from '@/common/js/websocket.js'
import payPassword from '@/components/payPassword.vue'
import lBarrage from '@/components/l-barrage/l-barrage.vue'
export default {
components: {
payPassword,
lBarrage
},
data() {
return {
userInfo: uni.cache.get('userInfo'), //个人信息
cartLists: {},
height: '',
pay_type: 1,
remark: '',
listinfo: {
detailList: [],
amount: '',
amounts: ''
},
emitorderfoodform: {
clickiconone: ''
},
orderInfo: '',
// 可用优惠券数据
couponAmount: 0,
// 输入支付密码 123
ispws: false,
listinfoid: null,
radiovalue: '1',
amountVIP: null
};
},
onUnload() {
this.socketTicket.Close()
uni.$off('getMessage')
this.ispws = false
},
onHide() {
this.socketTicket.Close()
uni.$off('getMessage')
},
onShow() {
uni.$on('message', this.getMessage)
if (this.listinfoid) {
this.orderorderInfo()
} else {
this.handlemessage()
}
// 获取余额
this.getAount()
},
methods: {
getMessage(msg) {
if (msg == 1) { // 网络在连接
return false
}
if (msg.type == 'heartbeat') { //后台心跳 处理返回 不然控制台一直报错
return false
}
if (msg.status != 'success') {
uni.showToast({
title: msg.msg,
icon: "none",
})
return false;
} else {
switch (msg.type) {
case 'createOrder':
console.log(msg.data)
this.listinfoid = msg.data.id
uni.$off('getMessage')
this.orderorderInfo(1)
break;
case 'addCart':
this.cartLists = msg
break;
case 'order':
uni.navigateBack()
setTimeout(() => {
uni.showToast({
title: '您的小伙伴已下单了哦~~'
})
}, 1000)
break;
case 'addcart':
/*插入一条弹幕*/
this.$refs.lBarrage.add(
`${msg.reqData.nickName?msg.reqData.nickName:'微信用户'}${msg.reqData.num==-1?'取消了':'添加了'}${msg.reqData.name}(${msg.reqData.num})`
);
break;
}
this.$set(this, 'cartLists', msg)
}
},
handlemessage() {
this.socketTicket ? this.socketTicket.Close() : null //调用前先判断是否有socket正在进行 先关闭后链接
this.socketTicket = new webSocketUtils(`${uni.conf.baseUrlwws}`, 5000, {
tableId: uni.cache.get('tableCode'),
shopId: uni.cache.get('shopUser'),
userId: uni.cache.get('userInfo').id,
"type": "connect",
})
},
// 数据处理
socketSendMsg(data) {
if (this.socketTicket) {
this.socketTicket.send(data);
}
},
onEnd() { //回调弹幕
console.log('一波结束')
},
// 查询订单信息
async orderorderInfo(i) {
let res = await this.api.orderorderInfo({
orderId: this.listinfoid
})
if (res.code == 0) {
this.listinfo = res.data
if (i == 1) { //请求完了详情在去调支付
this.showpopupclickdd()
}
}
},
groupChange(n) {
this.radiovalue = n
},
async getAount() {
let res = await this.api.shopUserInfo({
"shopId": uni.cache.get('shopUser'),
"userId": uni.cache.get('userInfo').id,
})
if (res.code == 0) {
this.amountVIP = res.data
}
},
orderfoodindex() { //优惠劵
uni.pro.navigateTo('index/coupons/index', {
orderfood: 0,
orderId: this.listinfoid,
amount: this.listinfo.amounts
})
},
copyHandle(e) {
uni.setClipboardData({
data: e,
success() {
uni.showToast({
title: '复制成功',
icon: 'none'
});
}
});
},
async paymodfiyOrderInfo() { //支付完成后请求
let res = await this.api.paymodfiyOrderInfo({
orderId: this.listinfoid,
})
},
goRecharge() { // 去充值
// 判断是否绑定手机,只有下单时候有,会员列表肯定有
// console.log(this.amountVIP.isVip, '调试1')
if (this.amountVIP.isVip == 0) {
// 跳转到开通页面
uni.navigateTo({
url: '/pages/member/activatedmemberone?shopId=' + uni.cache.get('shopUser')
})
} else {
uni.pro.navigateTo('/pages/member/index', {
shopId: uni.cache.get('shopUser')
})
}
},
orderdetail() { // 直接生成订单
let data = {
"skuId": '',
"num": '', //数量
"type": "createOrder", //“addcart:添加购物车create0rder:生成订单clearCart:庆康购物车”,
"remark": this.remark,
"couponsId": '', //优惠券ID,
"isYhq": 0, // 是否使用优惠券( 1 使用, 0 不使用),
"isBuyYhq": 0, // 是否购买优惠券( 1 购买, 0 不够买)
"productId": '', //商品id
"shopId": uni.cache.get('shopUser'),
"userId": uni.cache.get('userInfo').id,
}
uni.$u.debounce(this.socketSendMsg(data), 500)
},
showpopupclickdd() {
uni.showLoading({
title: '加载中',
mask: true
})
// radiovalue为1是微信支付
if (this.radiovalue == 1) {
this.showpopupclickdds() //微信支付
} else {
// 先判断是否设置支付密码。0是没设置。没设置的情况下跳转到设置页面。有的话输入支付密码
// console.log(isPwd,'是否设置了支付密码')
if (uni.cache.get('userInfo').isPwd == 0) {
uni.pro.navigateTo('/pages/user/repairpassword', {
shopId_id: uni.cache.get('shopUser')
})
} else {
uni.hideLoading()
this.ispws = true
this.$nextTick(() => {
this.$refs.payPwd.onPayUp();
})
}
}
},
// 微信支付
async showpopupclickdds() {
let res = await this.api.payorderPay({
orderId: this.listinfoid
}) //判断是否支付成功
if (res.code == 0) {
// #ifdef MP-WEIXIN
// 微信支付还是余额支付
uni.requestPayment({
provider: 'wxpay', //支付类型-固定值
partnerid: res.data.appId, // 微信支付商户号
timeStamp: res.data.timeStamp, // 时间戳(单位:秒)
nonceStr: res.data.nonceStr, // 随机字符串
package: res.data.package, // 固定值
signType: res.data.signType, //固定值
paySign: res.data.paySign, //签名
success: (res) => {
let _this = this
uni.requestSubscribeMessage({
tmplIds: ['z0fUG7-jhSfYCrw6poOvSRzh4_hgnPkm_5C7E5s5bCQ'],
complete() {
uni.showToast({
title: "支付成功"
})
// uni.cache.set('shopUser', '') //删除shopUser
_this.paymodfiyOrderInfo()
uni.redirectTo({
url: '/pages/order/order_detail?orderId=' + _this
.listinfoid
});
},
})
},
fail: () => {
uni.hideLoading()
}
});
// #endif
uni.hideLoading()
}
},
// 余额支付
async accountPayevent(pwd) {
this.ispws = false
let res = await this.api.accountPay({
orderId: this.listinfoid,
memberId: this.amountVIP.id,
pwd: pwd
})
if (res.code == 0) {
// data ->1 支付成功
// ->2 余额不足
// ->3 未设置支付密码,
// ->4 不是会员,
if (res.data == 1) {
this.showToastUppop('支付成功')
let _this = this
uni.requestSubscribeMessage({
tmplIds: ['z0fUG7-jhSfYCrw6poOvSRzh4_hgnPkm_5C7E5s5bCQ'],
complete() {
uni.redirectTo({
url: '/pages/order/order_detail?orderId=' + _this
.listinfoid
});
},
})
} else if (res.data == 2) {
this.showToastUppop('余额不足')
setTimeout(() => {
// 去充值
this.goRecharge()
}, 1500)
} else if (res.data == 3) {
this.showToastUppop('未设置支付密码')
setTimeout(() => {
uni.pro.navigateTo('/pages/user/repairpassword', {
shopId_id: uni.cache.get('shopUser')
})
}, 1500)
} else if (res.data == 4) {
this.showToastUppop('非会员请充值')
setTimeout(() => {
// 去充值
this.goRecharge()
}, 1500)
}
}
},
showToastUppop(title) {
uni.showToast({
icon: 'none',
title,
success: () => {
}
})
},
},
async mounted() {
let rectInfo = await this.$u.getRect('.fixedview');
console.log(rectInfo);
this.height = rectInfo.height + "px"
},
};
</script>
<style scoped lang="scss">
.container {
padding: 0 28upx 28upx 28upx 28upx;
overflow: auto;
}
.card {
background-color: #fff;
border-radius: 20upx;
padding: 28upx;
margin-bottom: 48rpx;
.head {
display: flex;
justify-content: space-between;
&.border {
padding-bottom: 28upx;
border-bottom: 1upx solid #fafafa;
}
.status {
color: #ff0000;
}
}
.tag-wrap {
padding: 28upx 0;
display: flex;
.tag {
display: flex;
align-items: center;
justify-content: center;
padding: 0 10upx;
color: $color-priamry;
border: 1px solid $color-priamry;
font-size: 24upx;
}
}
.number-wrap {
background-color: #fafafa;
border-radius: 16upx;
padding: 28upx 0;
display: flex;
flex-direction: column;
align-items: center;
.number {
font-size: 42upx;
font-weight: bold;
}
}
.price {
.i {
font-size: 20upx;
}
.num {
font-size: 38upx;
}
}
.shop-info {
padding: 28upx 0;
.item:nth-child(1) {
margin-top: 0;
}
.item {
margin-top: 16rpx;
display: flex;
.info {
flex: 1;
display: flex;
flex-direction: column;
justify-content: space-between;
padding-left: 28upx;
.n {
font-size: 24upx;
color: #999;
}
}
}
}
.total-wrap {
display: flex;
justify-content: flex-end;
padding-top: 28upx;
border-top: 1upx solid #fafafa;
}
.order-info {
.row {
display: flex;
justify-content: space-between;
padding-top: 28upx;
.t {
font-size: 24upx;
color: #999;
}
.info {
font-size: 24upx;
}
}
}
}
.sixcontent {
width: 100%;
background: #FFFFFF;
padding: 32rpx;
margin-top: 32rpx;
border-radius: 12rpx;
.sixcontentone {
padding-bottom: 28rpx;
border-bottom: 1px solid #F7F7F7;
font-size: 28rpx;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
color: #333333;
.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;
}
}
}
}
}
.redMoney {
display: flex;
align-items: center;
justify-content: space-between;
margin-top: 30rpx;
background-color: #fff;
padding: 18rpx 14rpx;
>view:first-child {
display: flex;
align-items: center;
font-weight: 400;
font-size: 28rpx;
color: #333333;
}
>view:last-child {
background: #FFE9E9;
border-radius: 16rpx 16rpx 16rpx 16rpx;
font-weight: 400;
font-size: 28rpx;
color: #FF3333;
text-align: center;
padding: 9rpx 13rpx;
}
}
.payType {
padding: 32rpx 34rpx;
margin-top: 48rpx;
background-color: #fff;
>view:first-child {
font-weight: 500;
font-size: 28rpx;
color: #333333;
}
>view:last-child {
margin-top: 32rpx;
}
.dfs {
display: flex;
align-items: center;
}
}
.fixedview {
position: fixed;
bottom: 0;
left: 0;
width: 100%;
height: 180rpx;
padding: 16rpx 34rpx;
background: #FFFFFF;
.flex-between {
width: 100%;
padding: 24rpx 28rpx;
flex-wrap: nowrap;
.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_onethere {
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 24rpx;
color: #999999;
}
}
.fixedview_tow {
background: red;
border-radius: 34rpx;
padding: 10rpx 44rpx;
font-size: 32rpx;
font-family: PingFang SC-Bold, PingFang SC;
font-weight: bold;
color: #FFFFFF;
}
}
}
</style>

View File

@@ -1,9 +1,9 @@
<template>
<view class="container">
<view class="card" v-if="listinfo.tableName">
<view class="card">
<view class="head">
<text class="title">
桌号<text>{{listinfo.tableName || '空'}}</text>
<text>{{listinfo.tableName || '空'}}</text>
</text>
<text class="status" v-if="listinfo.status == 'unpaid'">
<text>待支付</text>
@@ -15,7 +15,7 @@
<text>订单完成</text>
</text>
<text class="status" v-if="listinfo.status == 'send'">
<text>已发</text>
<text> 已发</text>
</text>
<text class="status" v-if="listinfo.status == 'refunding'">
<text>申请退单</text>
@@ -36,10 +36,9 @@
<text class="tag" v-if="listinfo.sendType == 'takeself'">自提</text>
<text class="tag" v-if="listinfo.sendType == 'table'">堂食</text>
</view>
<view class="number-wrap"
v-if="listinfo.status != 'unpaid' && listinfo.status != 'paying'&& listinfo.status != 'cancelled'">
<view class="number-wrap" v-if="listinfo.status != 'unpaid'">
<text class="t">取餐号</text>
<text class="number">{{listinfo.outNumber || '空'}}</text>
<text class="number">{{listinfo.tableName || '空'}}</text>
</view>
</view>
<view class="card">
@@ -55,7 +54,6 @@
</view>
<view class="info">
<text>{{item.productName}}</text>
<text class="n" v-if="item.productSkuName">{{item.productSkuName}}</text>
<text class="n">x{{item.num}}</text>
</view>
<view class="price">
@@ -72,63 +70,7 @@
</view>
</view>
</view>
<!-- <view class="sixcontent">
<view class="sixcontentone flex-between" style="padding: 0 0;" @click="orderfoodindex">
<view class="sixcontent_one" style="padding: 0 0;">
优惠券
</view>
<text style="color: red;">{{emitorderfoodform.couponsPrice}}</text>
</view>
</view> -->
<!-- <view class="redMoney">
<view>
<image src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/drder/hongbao.png"
style="width: 30rpx;height: 30.24rpx;;" mode=""></image>
红包/抵用券
</view>
<view @click="orderfoodindex">
可用优惠券{{couponAmount}}
</view>
</view> -->
<!-- <u--textarea v-model="remark" placeholder="订单备注" ></u--textarea> -->
<!-- 支付方式 -->
<view class="payType">
<view class="">
支付方式
</view>
<view class="">
<u-radio-group v-model="radiovalue1" iconPlacement="right" @change="groupChange" :size="28"
placement="column">
<u-radio activeColor="#ffd158" name="1">
<view class="dfs">
<image style="width:44rpx;height:44rpx"
src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/drder/balance.png" mode="">
</image>
<text style="font-size: 28rpx;margin-left: 16rpx;">
微信支付
</text>
</view>
</u-radio>
<view style="margin: 22rpx 0;width: 100%;height: 2rpx;background-color: #E5E5E5;">
</view>
<u-radio activeColor="#ffd158" name="2">
<view class="dfs">
<image style="width:44rpx;height:44rpx"
src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/drder/wechat.png" mode="">
</image>
<text style="font-size: 28rpx;margin-left: 16rpx;">
会员卡支付</text>
</view>
</u-radio>
</u-radio-group>
<view style="font-weight: 400;font-size: 24rpx;color: #333333;margin-left: 60rpx;">
会员卡余额{{ amountVIP?amountVIP.amount:0}} <text
style="font-weight: 500;font-size: 28rpx;margin-left: 16rpx;color: #FF4C11;"
@click="goRecharge">去充值</text>
</view>
</view>
</view>
<!-- <view class="sixcontent" >
<view class="sixcontent" v-if="listinfo.status == 'unpaid'">
<view class="sixcontentone flex-between">
<view class="sixcontent_one">
支付方式
@@ -146,7 +88,7 @@
</view>
</view>
<view class="sixcontenttowitem flex-between" @click="clickselect(2)">
<!-- <view class="sixcontenttowitem flex-between" @click="clickselect(2)">
<view class="sixcontenttowitemone flex-start">
<u-icon name="zhifubao" color="#999999" size="26"></u-icon>
<text class="sixcontenttowitemonetext">余额支付</text>
@@ -155,9 +97,9 @@
<u-icon v-if="pay_type == 2" name="checkmark-circle-fill" color="#333333" size="26"></u-icon>
<u-icon v-else name="checkmark-circle-fill" color="#999999" size="26"></u-icon>
</view>
</view>
</view>
</view> -->
</view> -->
</view>
</view>
<view :style="{height:height}">
</view>
@@ -170,109 +112,58 @@
<view class="fixedview_onetow">
<text>¥</text>{{listinfo.amount}}
</view>
<view class="fixedview_onethere" v-if="emitorderfoodform.couponsPrice">
以优惠¥{{emitorderfoodform.couponsPrice}}
</view>
</view>
<!-- <view class="fixedview_tow" @tap="showpopupclickdd"> -->
<view class="fixedview_tow" @tap="$u.debounce(showpopupclickdd, 500)">
<view class="fixedview_tow" @tap="$u.debounce(showpopupclick,1000)">
立即付款
</view>
</view>
</view>
<!-- 支付密码 -->
<payPassword ref="payPwd" @accountPayevent="accountPayevent" v-if="ispws"></payPassword>
</view>
</template>
<script>
import webSocketUtils from '@/common/js/websocket.js'
import payPassword from '@/components/payPassword.vue'
export default {
components: {
payPassword
},
data() {
return {
height: '',
pay_type: 1,
remark: '',
listinfoid: '',
listinfo: {
detailList: [],
amount: '',
amounts: ''
},
emitorderfoodform: {
clickiconone: ''
},
amountVIP: null,
radiovalue1: '1',
orderInfo: '',
// 可用优惠券数据
couponAmount: 0,
// 输入支付密码 123
ispws: false,
info: {},
listinfo: {}
};
},
onUnload() {
uni.$off('getMessage')
this.ispws = false
},
// onUnload() {
// uni.$off('createOrdermessage')
// },
onLoad(e) {
this.listinfo = JSON.parse(e.tablelist)
console.log(e,140)
let res = JSON.parse(e.tableId)
console.log(res)
this.listinfo = res
// uni.$on('createOrdermessage', res => {
// console.log(1111111)
// console.log(res)
// this.listinfo = res
// })
// uni.$on('createOrdermessage', this.getMessagess)
},
onShow() {
// 获取余额
this.getAount()
// uni.$on('createOrdermessage', res => {
// console.log(1111111)
// console.log(res)
// this.listinfo = res
// })
},
methods: {
groupChange(n) {
this.radiovalue1 = n
},
async getcoupon() {
let res = await this.api.userCoupon({
"orderNum": this.listinfo.amount,
"userId": uni.cache.get('userInfo').id,
})
if (res.code == 0) {
this.couponAmount = res.data
}
},
async getAount() {
let res = await this.api.shopUserInfo({
"shopId": uni.cache.get('shopUser'),
"userId": uni.cache.get('userInfo').id,
})
if (res.code == 0) {
this.amountVIP = res.data
}
},
getMessage(msg) {
if (msg.status != 'success') {
uni.showToast({
title: msg.msg,
icon: "none",
})
this.socketTicket.Close()
uni.$off('getMessage')
} else if (msg.type == 'createOrder') {
this.listinfoid = msg.data.id //下单需要的id
this.orderInfo = msg.data
if (this.radiovalue1 == 1) {
// this.showpopupclickdds() //微信支付
}
}
},
orderfoodindex() { //优惠劵
uni.pro.navigateTo('index/coupons/index', {
orderfood: 0,
orderId: this.listinfo.id,
amount: this.listinfo.amounts
async ordercreatOrder() {
let res = await this.api.ordercreatOrder({
tableId: this.info.tableId,
shopId: this.info.shopId,
userId: this.info.userId
})
this.listinfo = res.data
},
copyHandle(e) {
uni.setClipboardData({
@@ -285,42 +176,22 @@
}
});
},
async paymodfiyOrderInfo() { //支付完成后请求
async paymodfiyOrderInfo() {
let res = await this.api.paymodfiyOrderInfo({
orderId: this.listinfo.id,
})
},
goRecharge() { // 去充值
uni.pro.navigateTo('/pages/member/index', {
shopId: uni.cache.get('shopUser')
})
},
showpopupclickdd() {
// radiovalue1为1是微信支付
if (this.radiovalue1 == 1) {
this.showpopupclickdds() //微信支付
} else {
// 先判断是否设置支付密码。0是没设置。没设置的情况下跳转到设置页面。有的话输入支付密码
let {
isPwd
} = uni.cache.get('userInfo')
// console.log(isPwd,'是否设置了支付密码')
if (isPwd == 0) {
uni.pro.navigateTo('/pages/user/repairpassword', {
shopId_id: uni.cache.get('shopUser')
})
} else {
this.ispws = true
this.$nextTick(() => {
this.$refs.payPwd.onPayUp();
})
}
}
},
// 微信支付
async showpopupclickdds() {
let res = await this.api.payorderPay({
orderId: this.listinfo.id
})
},
async showpopupclick() {
// const data = { //定义socket数据传参
// "skuId": res.data.id,
// "num": a == '-' ? Number(b) - 1 : Number(b) + 1, //数量
// "type": "addcart", //“addcart:添加购物车create0rder:生成订单clearCart:庆康购物车”,
// "productId": item.id, //商品id
// "shopId": uni.cache.get('shopUser').shopId,
// "userId": uni.cache.get('userInfo').id
// };
let res = await this.api.payorderPay({
orderId: this.listinfo.id,
}) //判断是否支付成功
if (res.code == 0) {
uni.showLoading({
@@ -328,107 +199,49 @@
mask: true
})
// #ifdef MP-WEIXIN
// 微信支付还是余额支付
uni.requestPayment({
provider: 'wxpay', //支付类型-固定值
partnerid: res.data.appId, // 微信支付商户号
timeStamp: res.data.timeStamp, // 时间戳(单位:秒)
nonceStr: res.data.nonceStr, // 随机字符串
package: res.data.package, // 固定值
signType: res.data.signType, //固定值
partnerid: res.data.payAppId, // 微信支付商户号
timeStamp: res.data.payTimeStamp, // 时间戳(单位:秒)
nonceStr: res.data.paynonceStr, // 随机字符串
package: res.data.payPackage, // 固定值
signType: res.data.paySignType, //固定值
paySign: res.data.paySign, //签名
success: (res) => {
let _this = this
uni.requestSubscribeMessage({
tmplIds: ['z0fUG7-jhSfYCrw6poOvSRzh4_hgnPkm_5C7E5s5bCQ'],
complete() {
uni.showToast({
title: "支付成功"
})
// uni.cache.set('shopUser', '') //删除shopUser
_this.paymodfiyOrderInfo()
uni.redirectTo({
url: '/pages/order/order_detail?orderId=' +
_this
.listinfo.id
});
},
uni.showToast({
title: "支付成功"
})
setTimeout(res => {
uni.redirectTo({
url: '/pages/order/order_detail?orderId=' + this
.listinfo.id
});
}, 1000)
this.paymodfiyOrderInfo()
// uni.redirectTo({
// url: "/pages/mall/order/ordersuccess?id=" + datareslane.data
// .order_id,
// });
},
fail: () => {
uni.hideLoading()
fail: (err) => {
setTimeout(res => {
uni.showToast({
icon: 'none',
title: '支付失败'
})
uni.hideLoading()
}, 2000)
uni.redirectTo({
url: '/pages/order/order_detail?orderId=' + this.listinfo.id
});
}
});
// #endif
uni.hideLoading()
}
},
// 余额支付
async accountPayevent(pwd) {
this.ispws = false
let res = await this.api.accountPay({
orderId: this.listinfo.id,
memberId: this.amountVIP.id,
// remark: this.remark,
pwd
})
if (res.code == 0) {
// data ->1 支付成功
// ->2 余额不足
// ->3 未设置支付密码,
// ->4 不是会员,
if (res.data == 1) {
this.showToastUppop('支付成功')
let _this = this
uni.requestSubscribeMessage({
tmplIds: ['z0fUG7-jhSfYCrw6poOvSRzh4_hgnPkm_5C7E5s5bCQ'],
complete() {
uni.redirectTo({
url: '/pages/order/order_detail?orderId=' + _this
.listinfo.id
});
},
})
} else if (res.data == 2) {
this.showToastUppop('余额不足')
setTimeout(() => {
// 去充值
this.goRecharge()
}, 1500)
} else if (res.data == 3) {
this.showToastUppop('未设置支付密码')
setTimeout(() => {
uni.pro.navigateTo('/pages/user/repairpassword', {
shopId_id: uni.cache.get('shopUser')
})
}, 1500)
} else if (res.data == 4) {
this.showToastUppop('非会员请充值')
setTimeout(() => {
// 去充值
this.goRecharge()
}, 1500)
}
}
},
showToastUppop(title) {
uni.showToast({
icon: 'none',
title,
success: () => {
}
})
},
clickselect(b) {
this.pay_type = b
},
},
mounted() {
//#ifdef MP-WEIXIN || H5
@@ -437,6 +250,11 @@
var that = this;
that.height = (ele.height) + "px";
that = null;
// uni.getSystemInfo({
// success(res) {
// }
// })
}).exec();
//#endif
//#ifdef MP-ALIPAY
@@ -460,7 +278,7 @@
background-color: #fff;
border-radius: 20upx;
padding: 28upx;
margin-bottom: 48rpx;
margin-bottom: 28upx;
.head {
display: flex;
@@ -576,10 +394,6 @@
.sixcontentone {
padding-bottom: 28rpx;
border-bottom: 1px solid #F7F7F7;
font-size: 28rpx;
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
font-weight: 500;
color: #333333;
.sixcontent_one {
font-size: 28rpx;
@@ -612,68 +426,16 @@
}
}
.redMoney {
display: flex;
align-items: center;
justify-content: space-between;
margin-top: 30rpx;
background-color: #fff;
padding: 18rpx 14rpx;
>view:first-child {
display: flex;
align-items: center;
font-weight: 400;
font-size: 28rpx;
color: #333333;
}
>view:last-child {
background: #FFE9E9;
border-radius: 16rpx 16rpx 16rpx 16rpx;
font-weight: 400;
font-size: 28rpx;
color: #FF3333;
text-align: center;
padding: 9rpx 13rpx;
}
}
.payType {
padding: 32rpx 34rpx;
margin-top: 48rpx;
background-color: #fff;
>view:first-child {
font-weight: 500;
font-size: 28rpx;
color: #333333;
}
>view:last-child {
margin-top: 32rpx;
}
.dfs {
display: flex;
align-items: center;
}
}
.fixedview {
position: fixed;
bottom: 0;
left: 0;
width: 100%;
height: 180rpx;
padding: 16rpx 34rpx;
.flex-between {
width: 100%;
padding: 24rpx 28rpx;
background: #FFFFFF;
flex-wrap: nowrap;
.fixedview_one {
.fixedview_oneone {
@@ -694,13 +456,6 @@
font-size: 28rpx;
}
}
.fixedview_onethere {
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 24rpx;
color: #999999;
}
}
.fixedview_tow {

View File

@@ -1,92 +0,0 @@
<template>
<view>
<view class="t1">点击下方链接体验</view>
<navigator url="goodsList_scroll" hover-class="hover">
<view class="title">
<text>滚动式联动</text>
<text class="link">立即体验</text></view>
<view class="content">
<view>
优点滚动流畅度很好全平台兼容
</view>
<view>
缺点因为需要计算高度的原因需要在页面初始化时将所有商品信息返回若是有大量的数据不太建议这样做会影响到打开时的加载速度
</view>
</view>
</navigator>
<navigator url="goodsList_swiper" hover-class="hover">
<view class="title">
<text>轮播式联动</text>
<text class="link">立即体验</text>
</view>
<view class="content">
<view>
优点左侧导航与主内容区域联动性好且可以随意调整右侧内容的高度
</view>
<view>
缺点因H5平台浏览器众多体验欠佳不建议在H5平台使用
<text style="color: red;">双向联动有BUG仅支持左侧联动</text>
</view>
</view>
</navigator>
<view class="t2">
<view>因数据不可控的原因请各位开发者们选择适合自己的模板使用各有优缺点选择适合自己的才是最好的</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
}
},
methods: {
}
}
</script>
<style lang="scss">
.t1{
padding-top: 30rpx;
text-align: center;
font-size: 36rpx;
color: #e50000;
}
.t2{
padding: 30rpx;
font-size: 24rpx;
color: #ee0000;
>view{
margin-bottom: 10rpx;
}
}
navigator{
font-size: 28rpx;
margin: 30rpx;
padding: 20rpx;
background-color: #fff;
border:#e5e5e5 solid 1px;
.title{
padding-bottom: 20rpx;
margin-bottom: 20rpx;
border-bottom:#e5e5e5 solid 1px;
color:#333;
font-size: 32rpx;
.link{
color: #09f;
float: right;
}
}
.content{
line-height: 48rpx;
color:#999;
}
}
</style>

View File

@@ -1,378 +0,0 @@
<template>
<view class="container">
<!-- 顶部面板 -->
<view class="top--panel">
<!-- 顶部面板可添加所需要放在页面顶部的内容代码比如banner图 -->
<view style="background-color: #ffaa00;text-align: center;font-size: 28rpx;padding: 10px 0;color: #fff;">
<view>这里顶部内容占位区域不需要则删除</view>
<view>可添加需放在页面顶部的内容比如banner图</view>
</view>
</view>
<!-- 滚动区域 -->
<view class="scroll-panel" id="scroll-panel">
<view class="list-box">
<view class="left">
<scroll-view :scroll-y="!isFixed" :style="{ 'height':scrollHeight + 'px' }"
:scroll-into-view="leftIntoView" :scroll-with-animation="false">
<view class="item" v-for="(item,index) in leftArray" :key="index"
:class="{ 'active':index==leftIndex }" :id="'left-'+index" :data-index="index"
@tap="leftTap">{{item}}</view>
</scroll-view>
</view>
<view class="main">
<scroll-view :scroll-y="!isFixed" :style="{ 'height':scrollHeight + 'px' }" @scroll="mainScroll"
:scroll-into-view="scrollInto" :scroll-with-animation="false">
<view class="item main-item" v-for="(item,index) in mainArray" :key="index" :id="'item-'+index">
<view class="title">
<view>{{item.title}}</view>
</view>
<view class="goods" v-for="(item2,index2) in item.list" :key="index2">
<image src="@/static/1.gif" mode=""></image>
<view>
<view>{{index2+1}}个商品标题</view>
<view class="describe">{{index2+1}}个商品的描述内容</view>
<view class="money">{{index2+1}}个商品的价格</view>
</view>
</view>
</view>
<view class="fill-last" :style="{ 'height':fillHeight + 'px' }"></view>
</scroll-view>
</view>
</view>
</view>
<!-- 底部面板 底部面板可添加所需要放在页面底部的内容代码比如购物车栏目 -->
<!-- <view class="bottom-panel">
<view style="background-color: #ffaa00;text-align: center;font-size: 28rpx;padding: 10px 0;color: #fff;">
<view>这里底部内容占位区域不需要则删除</view>
<view>可添加需放在页面底部的内容比如购物车栏目</view>
</view>
</view> -->
</view>
</template>
<script>
export default {
data() {
return {
scrollHeight: 400,
scrollTopSize: 0, //距离顶部的高度
fillHeight: 0, // 填充高度,用于最后一项低于滚动区域时使用
leftArray: [],
mainArray: [],
topArr: [],
leftIndex: 0,
scrollInto: '',
isFixed: true
}
},
onPageScroll(e) {
console.log(e)
if (e.scrollTop >= this.scrollTopSize) { //控制大图层
this.isFixed = false;
} else {
this.isFixed = true;
}
},
computed: {
/* 计算左侧滚动位置定位 */
leftIntoView() {
return `left-${this.leftIndex > 3 ? (this.leftIndex-3):0}`;
}
},
onReady() {
/* 在非H5平台nextTick回调后有概率获取到错误的元素高度则添加200ms的延迟来减少BUG的产生 */
setTimeout(() => {
/* 等待滚动区域初始化完成 */
this.initScrollView().then(() => {
/* 获取列表数据,你的代码从此处开始 */
this.getListData();
})
}, 100);
},
methods: {
/* 初始化滚动区域 */
initScrollView() {
return new Promise((resolve, reject) => {
let view = uni.createSelectorQuery().select('#scroll-panel');
view.boundingClientRect(res => {
this.scrollTopSize = res.top;
this.scrollHeight = 812;
console.log(res, res.top, res.height)
setTimeout(() => {
resolve();
}, 100);
}).exec();
});
},
/* 获取列表数据 */
getListData() {
// Promise 为 ES6 新增的API ,有疑问的请自行学习该方法的使用。
new Promise((resolve, reject) => {
/* 因无真实数据,当前方法模拟数据。正式项目中将此处替换为 数据请求即可 */
uni.showLoading();
// 模拟数据
let mockData = () => {
let [left, main] = [
[],
[]
];
let size = Math.floor(Math.random() * 40);
size = size < 20 ? 20 : size;
for (let i = 0; i < size; i++) {
left.push(`${i+1}类商品`);
let list = [];
let r = Math.floor(Math.random() * 10);
r = r < 5 ? 5 : r;
for (let j = 0; j < r; j++) {
list.push(j);
}
main.push({
title: `${i+1}类商品标题`,
list
})
}
return {
left,
main
}
}
setTimeout(() => {
let res = mockData();
let {
left,
main
} = res;
// 将请求接口返回的数据传递给 Promise 对象的 then 函数。
resolve({
left,
main
});
}, 1000);
}).then((res) => {
console.log('-----------请求接口返回数据示例-------------');
console.log(res);
uni.hideLoading();
this.leftArray = res.left;
this.mainArray = res.main;
// DOM 挂载后 再调用 getElementTop 获取高度的方法。
setTimeout(() => {
this.getElementTop();
}, 100);
});
},
/* 获取元素顶部信息 */
getElementTop() {
new Promise((resolve, reject) => {
let view = uni.createSelectorQuery().selectAll('.main-item');
view.boundingClientRect(data => {
resolve(data);
}).exec();
}).then((res) => {
let topArr = res.map((item) => {
return item.top - this.scrollTopSize; /* 减去滚动容器距离顶部的距离 */
});
this.topArr = topArr;
/* 获取最后一项的高度,设置填充高度。判断和填充时做了 +-20 的操作,是为了滚动时更好的定位 */
let last = res[res.length - 1].height;
if (last - 20 < this.scrollHeight) {
this.fillHeight = this.scrollHeight - last + 20;
}
});
},
/* 主区域滚动监听 */
mainScroll(e) {
// 节流方法
clearTimeout(this.mainThrottle);
this.mainThrottle = setTimeout(() => {
scrollFn();
}, 10);
let scrollFn = () => {
let top = e.detail.scrollTop;
let index = 0;
/* 查找当前滚动距离 */
for (let i = (this.topArr.length - 1); i >= 0; i--) {
/* 在部分安卓设备上因手机逻辑分辨率与rpx单位计算不是整数滚动距离与有误差增加2px来完善该问题 */
if ((top + 2) >= this.topArr[i]) {
index = i;
break;
}
}
this.leftIndex = (index < 0 ? 0 : index);
}
},
/* 左侧导航点击 */
leftTap(e) {
let index = e.currentTarget.dataset.index;
this.scrollInto = `item-${index}`;
}
}
}
</script>
<style lang="scss">
page {
height: 100vh;
}
.container {
height: 100%;
}
/* 容器 */
.container {
display: flex;
flex-direction: column;
flex-wrap: nowrap;
justify-content: flex-start;
align-items: flex-start;
align-content: flex-start;
&>view {
width: 100%;
}
.scroll-panel {
flex-grow: 1;
// height: 0;
// overflow: hidden;
}
.bottom-panel {
padding-bottom: 0;
padding-bottom: constant(safe-area-inset-bottom);
padding-bottom: env(safe-area-inset-bottom);
}
}
.list-box {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: flex-start;
align-items: flex-start;
align-content: flex-start;
font-size: 28rpx;
position: relative;
.left {
width: 200rpx;
background-color: #f6f6f6;
line-height: normal;
box-sizing: border-box;
font-size: 32rpx;
.item {
padding: 30rpx;
position: relative;
&+.item {
margin-top: 1px;
&::after {
content: '';
display: block;
height: 0;
border-top: #d6d6d6 solid 1px;
width: 620upx;
position: absolute;
top: -1px;
right: 0;
transform: scaleY(0.5);
/* 1px像素 */
}
}
&.active {
color: #42b983;
background-color: #fff;
position: relative;
&::before {
content: '';
display: block;
position: absolute;
top: 0;
left: 0;
border-left: #42b983 solid 4px;
height: 100%;
width: 0;
}
}
}
.fill-last {
height: 0;
width: 100%;
background: none;
}
}
.main {
background-color: #fff;
padding-left: 20rpx;
width: 0;
flex-grow: 1;
box-sizing: border-box;
position: relative;
.title {
line-height: normal;
padding: 30rpx 0;
font-size: 24rpx;
font-weight: bold;
color: #666;
background-color: #fff;
position: sticky;
top: 0;
z-index: 19;
}
.item {
padding-bottom: 16rpx;
border-bottom: #eee solid 1px;
}
.goods {
display: flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: flex-start;
align-items: center;
align-content: center;
&+.goods {
margin-top: 16rpx;
}
&>image {
width: 120rpx;
height: 120rpx;
margin-right: 16rpx;
margin-left: 2px;
}
.describe {
font-size: 24rpx;
color: #999;
}
.money {
font-size: 24rpx;
color: #efba21;
}
}
}
}
</style>

View File

@@ -1,323 +0,0 @@
<template>
<view class="container">
<!-- 顶部面板 -->
<view class="top--panel">
<!-- 顶部面板可添加所需要放在页面顶部的内容代码比如banner图 -->
<view style="background-color: #ffaa00;text-align: center;font-size: 28rpx;padding: 10px 0;color: #fff;">
<view>这里顶部内容占位区域不需要则删除</view>
<view>可添加需放在页面顶部的内容比如banner图</view>
</view>
</view>
<!-- 滚动区域 -->
<view class="scroll-panel" id="scroll-panel">
<view class="list-box">
<view class="left">
<scroll-view scroll-y="true"
:style="{ 'height':scrollHeight }"
:scroll-into-view="leftIntoView"
:scroll-with-animation="true"
>
<view class="item"
v-for="(item,index) in leftArray"
:key="index"
:class="{ 'active':index==leftIndex }"
:id="'left-'+index"
:data-index="index"
@tap="leftTap"
>{{item}}</view>
</scroll-view>
</view>
<view class="main">
<swiper class="swiper" :style="{ 'height':scrollHeight }"
:current="leftIndex" @change="swiperChange"
:vertical="true" duration="200" :disable-touch="true">
<swiper-item v-for="(item,index) in mainArray" :key="index">
<scroll-view scroll-y="true" :style="{ 'height':scrollHeight }">
<view class="item">
<view class="title">
<view>{{item.title}}</view>
</view>
<view class="goods" v-for="(item2,index2) in item.list" :key="index2">
<image src="/static/logo.png" mode=""></image>
<view>
<view>{{index2+1}}个商品标题</view>
<view class="describe">{{index2+1}}个商品的描述内容</view>
<view class="money">{{index2+1}}个商品的价格</view>
</view>
</view>
</view>
</scroll-view>
</swiper-item>
</swiper>
</view>
</view>
</view>
<!-- 底部面板 -->
<view class="bottom-panel">
<!-- 底部面板可添加所需要放在页面底部的内容代码比如购物车栏目 -->
<view style="background-color: #ffaa00;text-align: center;font-size: 28rpx;padding: 10px 0;color: #fff;">
<view>这里底部内容占位区域不需要则删除</view>
<view>可添加需放在页面底部的内容比如购物车栏目</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
scrollHeight:'400px',
leftArray:[],
mainArray:[],
leftIndex:0
}
},
computed:{
/* 计算左侧滚动位置定位 */
leftIntoView(){
return `left-${this.leftIndex > 5 ? (this.leftIndex-5):0}`;
}
},
onReady(){
/* 在非H5平台nextTick回调后有概率获取到错误的元素高度则添加200ms的延迟来减少BUG的产生 */
setTimeout(()=>{
/* 等待滚动区域初始化完成 */
this.initScrollView().then(()=>{
/* 获取列表数据,你的代码从此处开始 */
this.getListData();
})
},100);
},
methods: {
/* 初始化滚动区域 */
initScrollView(){
return new Promise((resolve, reject)=>{
let view = uni.createSelectorQuery().select('#scroll-panel');
view.boundingClientRect(res => {
this.scrollHeight = `${res.height}px`;
setTimeout(()=>{
resolve();
},100);
}).exec();
});
},
/* 获取列表数据 */
getListData(){
// Promise 为 ES6 新增的API ,有疑问的请自行学习该方法的使用。
new Promise((resolve,reject)=>{
/* 因无真实数据,当前方法模拟数据。正式项目中将此处替换为 数据请求即可 */
uni.showLoading();
setTimeout(()=>{
/* 因无真实数据,当前方法模拟数据。正式项目中将此处替换为 数据请求即可 */
uni.showLoading();
// 模拟数据
let mockData = ()=>{
let [left,main]=[[],[]];
let size = Math.floor(Math.random()*40);
size = size < 20 ? 20 : size;
for(let i=0;i<size;i++){
left.push(`${i+1}类商品`);
let list=[];
let r = Math.floor(Math.random()*10);
r = r < 20 ? 20 : r;
for(let j=0;j<r;j++){
list.push(j);
}
main.push({
title:`${i+1}类商品标题`,
list
})
}
return {
left,
main
}
}
setTimeout(()=>{
let res = mockData();
let {left,main} = res;
// 将请求接口返回的数据传递给 Promise 对象的 then 函数。
resolve({left,main});
},1000);
},1000);
}).then((res)=>{
console.log('-----------请求接口返回数据示例-------------');
console.log(res);
uni.hideLoading();
this.leftArray=res.left;
this.mainArray=res.main;
});
},
/* 左侧导航点击 */
leftTap(e){
let index=e.currentTarget.dataset.index;
this.leftIndex=Number(index);
},
/* 轮播图切换 */
swiperChange(e){
let index=e.detail.current;
this.leftIndex=Number(index);
}
}
}
</script>
<style lang="scss">
page{
height: 100vh;
}
.container{
height: 100%;
}
/* 容器 */
.container{
display: flex;
flex-direction: column;
flex-wrap: nowrap;
justify-content: flex-start;
align-items: flex-start;
align-content: flex-start;
&>view{
width: 100%;
}
.scroll-panel{
flex-grow: 1;
height: 0;
overflow: hidden;
}
.bottom-panel{
padding-bottom: 0;
padding-bottom: constant(safe-area-inset-bottom);
padding-bottom: env(safe-area-inset-bottom);
}
}
.list-box{
display: flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: flex-start;
align-items: flex-start;
align-content: flex-start;
font-size: 28rpx;
.left{
width: 200rpx;
background-color: #f6f6f6;
line-height: normal;
box-sizing: border-box;
font-size: 32rpx;
.item{
padding: 30rpx;
position: relative;
& + .item{
margin-top: 1px;
&::after {
content: '';
display: block;
height: 0;
border-top: #d6d6d6 solid 1px;
width: 620upx;
position: absolute;
top: -1px;
right: 0;
transform:scaleY(0.5); /* 1px像素 */
}
}
&.active{
color: #42b983;
background-color: #fff;
position: relative;
&::before{
content: '';
display: block;
position: absolute;
top: 0;
left: 0;
border-left: #42b983 solid 4px;
height: 100%;
width: 0;
}
}
}
.fill-last{
height: 0;
width: 100%;
background: none;
}
}
.main{
background-color: #fff;
padding-left: 20rpx;
width: 0;
flex-grow: 1;
box-sizing: border-box;
.title{
line-height: normal;
padding: 30rpx 0;
font-size: 24rpx;
font-weight: bold;
color: #666;
background-color: #fff;
position: sticky;
top: 0;
z-index: 19;
}
.item{
padding-bottom: 16rpx;
border-bottom: #eee solid 1px;
}
.goods{
display: flex;
flex-direction: row;
flex-wrap: nowrap;
justify-content: flex-start;
align-items: center;
align-content: center;
& + .goods{
margin-top: 16rpx;
}
& > image{
width: 120rpx;
height: 120rpx;
margin-right: 16rpx;
margin-left: 2px;
}
.describe{
font-size: 24rpx;
color: #999;
}
.money{
font-size: 24rpx;
color: #efba21;
}
}
}
}
</style>

File diff suppressed because it is too large Load Diff

View File

@@ -1,22 +1,16 @@
<template>
<view id="wrapper">
<view v-if="fixedtrue"
style="height: 100vh; width: 100%; position: fixed; z-index: 999; top: 0; left: 0; background-color: #fff; display: flex; justify-content: center; align-items: center;">
<image style="width: 140rpx; height: 140rpx;" src="@/static/1.gif" mode="aspectFill"></image>
<text style="margin-left10rpx;font-size: 40rpx;color: #7d7d76;">加载中</text>
<!-- <u-loadmore status="loading" fontSize="50" iconSize="30"/> -->
</view>
<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="28"></u-icon>
<u-icon name="arrow-left" :color="isFixed ? '#333' : '#fff'" size="38"></u-icon>
</view>
<view class="btn" :style="{ width: `${menuInfo.height}px`, height: `${menuInfo.height}px` }"
@click="navClickHandle(2)">
<u-icon name="kefu-ermai" :color="isFixed ? '#333' : '#fff'" size="28"></u-icon>
<u-icon name="kefu-ermai" :color="isFixed ? '#333' : '#fff'" size="38"></u-icon>
</view>
</view>
</view>
@@ -65,22 +59,13 @@
</view>
<view class="shop-item" v-for="(item1,index1) in item.products" :key="item1.id">
<view class="cover langcover" style="width:180rpx; height: 180rpx;"
@click.stop="clickspecifications(item1,index,index1)">
<!-- <c-image style="position: absolute;z-index:2;"
:src="`${item1.coverImg}?x-oss-process=image/resize,m_lfit,w_90,h_90`" width="180"
height="180"></c-image> -->
<image style="position: absolute;z-index:2;width: 180rpx; height: 180rpx;"
:src="`${item1.coverImg}?x-oss-process=image/resize,m_lfit,w_90,h_90`"
:lazy-load='true'></image>
<view class="cover" style="width:180rpx; height: 180rpx;">
<c-image :src="item1.coverImg" width="180" height="180"></c-image>
</view>
<view class="info" style="display: flex;flex-direction: column;justify-content: center;">
<view class="info " style="display: flex;flex-direction: column;justify-content: center;">
<view class="name">
{{ item1.name }}
</view>
<view class="namess" v-if="item1.suit>1">
起售{{ item1.suit }}
</view>
<view class="price-wrap">
<view class="price">
<text class="i"></text>
@@ -88,19 +73,19 @@
<text class="i"></text>
</view>
<view class="sku-wrap" v-if="item1.productSkuResult != null"
@click.stop="clickspecifications(item1,index,index1)">
@click="clickspecifications(item1,index,index1)">
<text class="t">选规格</text>
<text class="dot num" v-if="item1.cartNumber != '0'">{{item1.cartNumber}}</text>
</view>
<view class="operation-wrap" v-else>
<view class="btn" v-if="item1.cartNumber != '0'"
@click.stop="cartadd(item1,index,index1,'-',item1.productSkuResult == null ? '单规格':'')">
<u-icon :name="require('@/static/icon_sub.png')" size="36"></u-icon>
@click="cartadd(item1,index,index1,'-',item1.cartNumber,item1.productSkuResult == null ? '单规格':'')">
<u-icon :name="require('@/static/icon_sub.png')" size="34"></u-icon>
</view>
<text class="num">{{ item1.cartNumber }}</text>
<view class="btn"
@click.stop="cartadd(item1,index,index1,'+',item1.productSkuResult == null ? '单规格':'')">
<u-icon :name="require('@/static/icon_add.png')" size="36"></u-icon>
@click="cartadd(item1,index,index1,'+',item1.cartNumber,item1.productSkuResult == null ? '单规格':'')">
<u-icon :name="require('@/static/icon_add.png')" size="34"></u-icon>
</view>
</view>
</view>
@@ -110,24 +95,23 @@
</view>
</view>
</view>
<view class="cart-wrap" v-if="cartListsdatashow">
<view class="cart-wrap">
<view class="cart-content">
<view class="left">
<image class="icon" src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/drder/icon_cart.png"
mode="aspectFit" @click="showCart = !showCart">
<image class="icon" src="../../static/icon_cart.png" mode="aspectFit" @click="showCart = !showCart">
</image>
<text class="i"></text>
<text class="num">{{cartLists.amount||'0.00'}}</text>
<text class="num">{{cartLists.amount}}</text>
</view>
<view class="btn" @tap="$u.debounce(orderdetail, 500)">
<text class="t">提交订单</text>
<text class="t">去结算</text>
</view>
</view>
</view>
<u-popup :show="showCart" :round="20" :zIndex="98" :overlayStyle="{ zIndex: 98 }" @close="showCart = false">
<view class="cart-list-wrap">
<view class="cart-header">
<view class="clear" @click="cartclear">
<view class="cart-header" @click="cartclear">
<view class="clear">
<u-icon name="trash" color="#999"></u-icon>
<text class="t">清空购物车</text>
</view>
@@ -177,7 +161,7 @@
<view class="col">
<text class="t">{{ shopList.storeInfo.businessTime }}</text>
</view>
<view class="col" @click="makePhoneCall(shopList.storeInfo.phone)">
<view class="col">
<text class="t">{{ shopList.storeInfo.phone }}</text>
</view>
<view class="col">
@@ -193,17 +177,12 @@
<u-popup :show="showShopsku" :round="20" mode="center" @close="showShopsku = false"
:safeAreaInsetBottom='false'>
<view class="shop_sku">
<view class="positionabsolute">
<u-icon name="close-circle-fill" @click="showShopsku = false" color="#a3aaa3" size="60"></u-icon>
</view>
<image class="shop_skucimage" :src="specifications.coverImg" mode="widthFix"></image>
<view class="shop_sku_name">
{{specifications.name}}
</view>
<view class="shop_sku_box" v-for="(item,index) in specifications.tagSnap" :key="index"
v-if="specifications.tagSnap">
<view class="shop_sku_box" v-for="(item,index) in specifications.tagSnap" :key="index">
<view class="shop_sku_box_name">
{{item.name}}
<!-- 温度 -->{{item.name}}
</view>
<view class="flex-start">
<view class="shop_sku_box_item" v-for="(item1,index1) in item.children" :key="index1"
@@ -213,7 +192,7 @@
</view>
</view>
</view>
<view class="shop_skuselect flex-start" v-if="specifications.tagSnap">
<view class="shop_skuselect flex-start">
已选规格<view class="shop_skuselectname">{{skuidname.toString()}}</view>
</view>
<view class="shop_bottom flex-between">
@@ -224,41 +203,29 @@
</view>
<view class="operation-wrap">
<view class="btn"
@click="cartadd(specifications,specifications.indexa,specifications.indexb,'-',specifications.tagSnap == null ? '单规格':'')">
@click="cartadd(specifications,specifications.indexa,specifications.indexb,'-',specifications.cartNumber)">
<u-icon :name="require('@/static/icon_sub.png')" size="34"></u-icon>
</view>
<text class="num">{{amountcartNumber}}</text>
<view class="btn"
@click="cartadd(specifications,specifications.indexa,specifications.indexb,'+',specifications.tagSnap == null ? '单规格':'')">
@click="cartadd(specifications,specifications.indexa,specifications.indexb,'+',specifications.cartNumber)">
<u-icon :name="require('@/static/icon_add.png')" size="34"></u-icon>
</view>
</view>
</view>
</view>
</u-popup>
<l-barrage ref="lBarrage" @end="onEnd" :minTop='8' :maxTop='20' :avatar='barrageavatar'></l-barrage>
</view>
</template>
<script>
import _ from 'lodash';
import webSocketUtils from '@/common/js/websocket.js';
import orderdetail from '@/pages/order_detail/index';
import lBarrage from '@/components/l-barrage/l-barrage.vue'
import navbar from '../../uni_modules/uview-ui/libs/config/props/navbar';
import webSocketUtils from '@/common/js/websocket.js'
export default {
components: {
orderdetail,
lBarrage
},
data() {
return {
userInfo: uni.cache.get('userInfo'), //个人信息
// #ifndef MP-WEIXIN
menuInfo: uni.getSystemInfo(),
// #endif
// #ifdef MP-WEIXIN
menuInfo: uni.getMenuButtonBoundingClientRect(),
// #endif
paddingBtmSize: 6,
tabHeadHeight: 50,
isFixed: false,
@@ -272,18 +239,11 @@
tableCode: '', //code
specifications: {},
skuidname: [],
cartLists: {}, //购物车
orderdetailcartLists: {}, //提交订单
cartLists: {},
socketTicket: null,
amountcartNumber: 0,
skuidsearch: '', //
salePrice: '', //钱数
fixedtrue: true,
datasocket: {}, //储存传参数据
radiovalue: '1', //选择支付方式
amountVIP: null, //余额
barrageavatar: '', //弹幕头像
cartListsdatashow: false //是否显示购物车
salePrice: '' //钱数
};
},
onPageScroll(e) {
@@ -303,170 +263,102 @@
this.countScrollTitle(e.scrollTop);
},
onLoad(e) {
uni.$on('message', this.getMessage)
// this.tableCode = e.tableCode
// this.scanCodehandle(e.tableCode)
if (e.q) {
this.tableCode = this.getQueryString(decodeURIComponent(e.q), 'code')
this.scanCodehandle(e.q)
} else {
this.tableCode = e.tableCode
uni.cache.set('tableCode', this.tableCode)
this.handlemessage()
}
uni.cache.set('types', 'types');
this.$nextTick(() => {
this.countTitleTopNum(); //导航栏
this.countTitleTopNum();
});
},
onUnload() {
this.socketTicket.Close()
uni.$off('message')
},
onHide() {
this.socketTicket.Close()
uni.$off('message')
this.fixedtrue = true
},
onShow() {
if (!uni.cache.get('token')) {
uni.login({
provider: 'weixin',
success: async (data) => {
try {
uni.getUserInfo({
provider: 'weixin',
success: async (infoRes) => {
uni.cache.set('weixincode', data.code);
let res = await this.api.userwxlogin({
code: uni.cache.get('weixincode'), //临时登录凭证
rawData: infoRes.rawData
})
if (res.code == 0) {
uni.cache.set('token', res.data.token);
uni.cache.set('miniAppOpenId', res.data.userInfo
.miniAppOpenId)
uni.cache.set('userInfo', res.data.userInfo);
uni.$on('message', this.getMessage)
this.productqueryShopIdByTableCode() //获取shop User id
}
},
fail: (err) => {}
});
} catch (e) {}
}
});
} else {
uni.$on('message', this.getMessage)
this.productqueryShopIdByTableCode() //获取shop User id
}
},
methods: {
onEnd() { //回调弹幕
console.log('一波结束')
},
// 单独获取他的shopUserid
async productqueryShopIdByTableCode() {
let res = await this.api.productqueryShopIdByTableCode({
code: uni.cache.get('tableCode')
})
if (res.code == 0) {
uni.cache.set('shopUser', res.data)
this.handlemessage() //监听websocket返回
// this.productqueryProduct() //list 数据
getMessage(msg) {
if (msg.status != 'success') {
uni.showToast({
title: msg.msg,
icon: "none",
})
if (msg.msg == '桌码不存在') { //卓码不存在直接退出
this.socketTicket.Close()
uni.$off('message')
uni.navigateBack()
return false;
}
} else {
setTimeout(() => {
uni.pro.switchTab('index/index')
}, 1000)
}
},
getMessage(msg) { //wss 回显数据
if (msg == 1) { // 网络在连接
this.fixedtrue = true
return false
}
this.fixedtrue = false
if (msg.type == 'heartbeat') { //后台心跳 处理返回 不然控制台一直报错
return false
}
try {
if (msg.status != 'success') {
uni.showToast({
title: msg.msg,
icon: "none",
})
if (msg.msg == '桌码不存在') { //卓码不存在直接退出
this.socketTicket.Close()
uni.$off('message')
uni.navigateBack()
return false;
}
} else {
switch (msg.type) {
case 'sku': // sku 数量 查询这个商品的价格和数量
this.$set(this, 'amountcartNumber', msg.amount)
this.productqueryProduct() //list 数据
break;
case 'clearCart':
this.cartLists = msg
this.productqueryProduct() //list 数据
this.skuidname = []
this.showCart = false
setTimeout(() => {
uni.showToast({
title: msg.msg,
icon: "none",
})
}, 500)
break;
case 'order':
this.skuidname = []
this.showCart = false
this.cartLists = msg
this.productqueryProduct() //list 数据
break;
case 'addCart': //初始化add
this.cartLists = msg
this.productqueryProduct() //list 数据
break;
case 'addcart':
this.cartLists = msg
console.log(msg, 1111)
this.productqueryProduct() //list 数据
try {
if (msg.data.length != 0) {
let nums = 0
msg.data.forEach((item, index, arr) => { //初始化skuidname的数据 选择第一个
if (item.skuId == this.skuidsearch) {
nums = item.number
}
})
this.$set(this, 'amountcartNumber', nums)
switch (msg.type) {
case 'sku': // sku 数量
this.$set(this, 'amountcartNumber', msg.amount)
this.productqueryProduct() //list 数据
break;
case 'clearCart':
console.log('clearCart')
this.specifications.duoguge = ''
this.skuidname = []
this.showCart = false
setTimeout(() => {
uni.showToast({
title: '清空购物车成功',
icon: "none",
})
}, 1000)
this.cartLists = msg
this.productqueryProduct() //list 数据
break;
case 'order':
console.log('clearCart')
this.specifications.duoguge = ''
this.skuidname = []
this.showCart = false
this.cartLists = msg
this.productqueryProduct() //list 数据
break;
case 'createOrder': //去结算
// uni.$emit('createOrdermessage', msg.data)
let item = JSON.stringify(msg.data)
uni.redirectTo({
url: '/pages/order_detail/order_detail?tableId=' + item
});
break;
case 'addcart':
console.log('addcart', 315)
this.cartLists = msg
if (msg.data.length != 0) {
msg.data.forEach((item, index, arr) => { //初始化skuidname的数据 选择第一个
console.log(item.skuId, 111111, this.skuidsearch)
if (item.skuId == this.skuidsearch) {
this.$set(this, 'amountcartNumber', item.number)
} else {
this.$set(this, 'amountcartNumber', 0)
}
} catch (e) {
//TODO handle the exception
}
try {
this.barrageavatar = msg.reqData.headImg
/*插入一条弹幕*/
this.$refs.lBarrage.add(
`${msg.reqData.nickName?msg.reqData.nickName:'微信用户'}${msg.reqData.num==-1?'取消了':'添加了'}${msg.reqData.name}(${msg.reqData.num})`
);
} catch (e) {
//TODO handle the exception
}
break;
}
console.log(this.cartLists.data, 1111111)
this.cartListsdatashow = this.cartLists.data.length == 0 ? false : true
})
} else {
this.$set(this, 'amountcartNumber', 0)
}
this.productqueryProduct() //list 数据
break;
default:
console.log('default', 320)
this.cartLists = msg
this.productqueryProduct() //list 数据
}
} catch (e) {
//TODO handle the exception
}
},
handlemessage() {
this.socketTicket ? this.socketTicket.Close() : null //调用前先判断是否有socket正在进行 先关闭后链接
this.socketTicket = new webSocketUtils(`${uni.conf.baseUrlwws}`, 5000, {
tableId: uni.cache.get('tableCode'),
shopId: uni.cache.get('shopUser'),
userId: uni.cache.get('userInfo').id,
"type": "connect",
})
this.socketTicket = new webSocketUtils(
`${uni.conf.baseUrlwws}/websocket/table/${this.tableCode}/${uni.cache.get('shopUser').shopId}/${uni.cache.get('userInfo').id}`,
5000)
},
// 数据处理
socketSendMsg(data) {
@@ -474,6 +366,48 @@
this.socketTicket.send(data);
}
},
scanCodehandle(e) {
this.tableCode = this.getQueryString(decodeURIComponent(e), 'code')
uni.cache.set('tableCode', this.tableCode)
// #ifdef MP-WEIXIN || MP-ALIPAY
uni.login({ //alipay weixin
provider: 'weixin',
success: async (data) => {
try {
uni.getUserInfo({
provider: 'weixin',
success: async (infoRes) => {
console.log(infoRes, 81);
uni.cache.set('weixincode', data.code);
let res = await this.api.userwxlogin({
code: uni.cache.get('weixincode'), //临时登录凭证
encryptedData: infoRes.encryptedData, // 用户非敏感信息
rawData: infoRes.rawData,
signature: infoRes.signature,
iv: infoRes.iv,
qrCode: uni.cache.get('tableCode')
})
if (res.code == 0) {
uni.cache.set('token', res.data.token);
uni.cache.set('miniAppOpenId', res.data.userInfo
.miniAppOpenId)
uni.cache.set('userInfo', res.data.userInfo);
uni.cache.set('shopUser', res.data.shopUser);
this.handlemessage()
}
},
fail: (err) => {
console.log(err)
}
});
} catch (e) {
console.log(e)
}
}
});
// #endif
},
getQueryString(url, name) { //解码
var reg = new RegExp('(^|&|/?)' + name + '=([^&|/?]*)(&|/?|$)', 'i')
var r = url.substr(1).match(reg)
@@ -482,32 +416,34 @@
}
return null;
},
async cartadd(item, index, index1, a, b) { //列表添加 a传参加减号 b是判断单规格多规格
if (b == '单规格') { //没有规格为空
async cartadd(item, index, index1, a, b, guge) { //列表添加
console.log(item, index, index1, a, b, guge)
if (guge == '单规格') { //没有规格为空
this.specifications.duoguge = ''
this.skuidname = []
}
this.hodgepodge(item, 1, a) //获取skuid /1添加购物车
this.hodgepodge(item, 1, a) //获取skuid
},
async cartListadd(item, index, a) { //购物车加减
async cartListadd(item, index, a) {
console.log(item, index, a)
try {
const data = { //定义socket数据传参
"name": item.name,
"skuId": item.skuId,
"num": a == '-' ? -1 : 1, //skuId
"type": "addcart", //“addcart:添加购物车create0rder:生成订单clearCart:清空购物车”,
"productId": item.productId, //商品id
"shopId": uni.cache.get('shopUser'),
"productId": item.id, //商品id
"shopId": uni.cache.get('shopUser').shopId,
"userId": uni.cache.get('userInfo').id
};
this.datasocket = data
uni.$u.debounce(this.socketSendMsg(data), 500)
} catch (e) {
//TODO handle the exception
}
},
async productqueryProduct() { //list 数据
let res = await this.api.productqueryProduct({
code: uni.cache.get('tableCode'),
code: this.tableCode,
productGroupId: ''
})
if (res.code == 0) {
@@ -517,45 +453,50 @@
});
}
},
clickspecifications(item1, index, index1) {
clickspecifications(e, a, b, d) {
console.log(e, a, b)
this.skuidname = []
this.specifications = item1
this.specifications.indexa = index
this.specifications.indexb = index1
try {
if (item1.productSkuResult == null) {
// 但但单个规格弹框的处理
this.hodgepodge(this.specifications, 2) //获取skuid /2查找价格和数量
} else {
// 多规格数据处理
this.specifications.tagSnap = JSON.parse(item1.productSkuResult.tagSnap).map((item) => {
let res = {
id: item1.id, //商品id
name: item.name,
start: 0,
children: item.value.split(",")
}
return res
})
this.specifications.tagSnap.forEach((val, index, arr) => { //初始化skuidname的数据 选择第一个
this.skuidname.push(val.children[0])
})
this.hodgepodge(this.specifications.tagSnap[0], 2) //获取skuid /2查找价格和数量
this.specifications = e
this.specifications.indexa = a
this.specifications.indexb = b
this.specifications.duoguge = 'duoguge'
if (e.productSkuResult.tagSnap == null) {
uni.showToast({
title: '暂无规格',
icon: "none",
})
return false
}
this.specifications.tagSnap = JSON.parse(e.productSkuResult.tagSnap).map((item) => {
let res = {
id: e.id, //商品id
name: item.name,
start: 0,
children: item.value.split(",")
}
return res
})
this.specifications.tagSnap.forEach((val, index, arr) => { //初始化skuidname的数据 选择第一个
this.skuidname.push(val.children[0])
})
try {
this.hodgepodge(this.specifications.tagSnap[0], 2)
} catch (e) {
//TODO handle the exception
}
if (d != '更新数据') {
this.showShopsku = true
}
},
async morloe(e, index, index1, item) {
this.specifications.tagSnap[index]['start'] = index1
this.skuidname.splice(index, 1, e) //替换skuidname的数据
this.hodgepodge(item, 2)
},
async hodgepodge(item, a, c) { //此接口去获取商品id !!!赋值库存 数量 价格
async hodgepodge(item, a, c) { //去获取商品id 库存
try {
let res = await this.api.productqueryProductSku({
shopId: uni.cache.get('shopUser'),
shopId: uni.cache.get('shopUser').shopId,
productId: item.id, //商品id
spec_tag: this.skuidname.join(",")
})
@@ -566,84 +507,69 @@
})
} else {
this.skuidsearch = res.data.id // 储存skuid 用于筛选数量
this.salePrice = res.data.salePrice // 价格
this.salePrice = res.data.salePrice // 储存skuid 用于筛选数量
let data = null
if (a == 1) { //1添加购物车 2是websocket返回这个商品的价格(应为不同的多规格商品返回不同的价格)
if (a == 1) {
data = { //定义socket数据传参
"nickName": this.userInfo.nickName,
"barrageavatar": this.userInfo.headImg,
'name': item.name,
"skuId": res.data.id,
"num": c == '-' ? -1 : 1, //数量
"type": "addcart", //“addcart:添加购物车create0rder:生成订单clearCart:庆康购物车”,
"productId": item.id, //商品id
"shopId": uni.cache.get('shopUser'),
"shopId": uni.cache.get('shopUser').shopId,
"userId": uni.cache.get('userInfo').id
};
} else {
data = { //查询这个商品的价格
"name": item.name,
data = { //定义socket数据传参
"skuId": res.data.id,
"num": '', //数量
"type": "sku", //“addcart:添加购物车create0rder:生成订单clearCart:庆康购物车”,
"productId": item.id, //商品id
"shopId": uni.cache.get('shopUser'),
"shopId": uni.cache.get('shopUser').shopId,
"userId": uni.cache.get('userInfo').id
};
this.showShopsku = true //打开弹框
}
this.datasocket = data
uni.$u.debounce(this.socketSendMsg(data), 500)
}
} catch (e) {}
},
orderdetail() { // 直接生成订单
if (this.cartLists.data.length == 0) {
} catch (e) {
uni.showToast({
title: '请先添加商品',
icon: 'none'
title: '获取失败',
icon: "none",
})
return false
}
uni.navigateTo({
url: '/pages/order_detail/indexs?tableId=' + JSON.stringify(this.cartLists)
});
// let data = {
// "skuId": '',
// "num": '', //数量
// "type": "createOrder", //“addcart:添加购物车create0rder:生成订单clearCart:庆康购物车”,
// "couponsId": '', //优惠券ID,
// "isYhq": 0, // 是否使用优惠券( 1 使用, 0 不使用),
// "isBuyYhq": 0, // 是否购买优惠券( 1 购买, 0 不够买)
// "productId": '', //商品id
// "shopId": uni.cache.get('shopUser'),
// "userId": uni.cache.get('userInfo').id,
// }
// this.datasocket = data
// uni.$u.debounce(this.socketSendMsg(data), 500)
},
async cartclear() { //清空购物车
orderdetail() {
let data = { //定义socket数据传参
"skuId": '',
"num": '', //数量
"type": "createOrder", //“addcart:添加购物车create0rder:生成订单clearCart:庆康购物车”,
"productId": '', //商品id
"shopId": uni.cache.get('shopUser').shopId,
"userId": uni.cache.get('userInfo').id
}
uni.$u.debounce(this.socketSendMsg(data), 500)
},
async cartclear() {
try {
const data = { //定义socket数据传参
"skuId": '',
"num": '', //skuId
"type": "clearCart", //“addcart:添加购物车create0rder:生成订单clearCart:清空购物车”,
"productId": '', //商品id
"shopId": uni.cache.get('shopUser'),
"shopId": uni.cache.get('shopUser').shopId,
"userId": uni.cache.get('userInfo').id
};
this.datasocket = data
uni.$u.debounce(this.socketSendMsg(data), 500)
} catch (e) {
//TODO handle the exception
}
},
// 导航栏点击
navClickHandle(t) {
switch (t) {
case 1:
// 返回
this.socketTicket.Close()
uni.switchTab({
url: '/pages/index/index'
})
@@ -656,12 +582,6 @@
break;
}
},
//打电话
makePhoneCall(phone) {
uni.makePhoneCall({
phoneNumber: phone //仅为示例
});
},
// 点击菜单商品滚动到指定为止
titleClickHandle(id) {
uni.createSelectorQuery()
@@ -711,7 +631,7 @@
.exec();
}
this.titleTopNums = topNums;
},
}
}
};
</script>
@@ -741,7 +661,7 @@
display: flex;
align-items: center;
justify-content: center;
// margin-right: $paddingSize;
margin-right: $paddingSize;
}
}
}
@@ -797,7 +717,6 @@
height: $h;
margin-top: -40upx;
background: #999;
position: relative;
.img {
width: 100%;
@@ -850,7 +769,6 @@
.left-wrap {
width: $tabLeft;
background-color: $bg;
padding: 0 0 $paddingSize * 3 + $cartH 0;
.left {
width: $tabLeft;
@@ -860,8 +778,7 @@
height: $itemH;
display: flex;
align-items: center;
padding: 0 $paddingSize;
justify-content: center;
padding-left: $paddingSize;
&.active {
background-color: #fff;
@@ -894,25 +811,6 @@
display: flex;
padding-bottom: $paddingSize;
.langcover {
position: relative;
}
.langcover::after {
content: '加载中..';
position: absolute;
top: 0;
left: 0;
height: 100%;
width: 100%;
background-color: #e8e8e8;
color: #6b6b6b;
border-radius: 10rpx;
text-align: center;
line-height: 180rpx;
z-index: 1;
}
.info {
flex: 1;
padding-left: 20upx;
@@ -923,13 +821,6 @@
font-weight: bold;
}
.namess {
margin-top: 16rpx;
font-size: 24upx;
font-weight: 300;
color: #a5a5a5;
}
.select-sku-wrap {
.t {
color: #999;
@@ -938,7 +829,7 @@
}
.price-wrap {
margin-top: 16rpx;
padding-top: $paddingSize;
display: flex;
align-items: center;
justify-content: space-between;
@@ -1004,23 +895,12 @@
}
.btn {
position: relative;
padding: 6upx 10upx;
background-color: $color-priamry;
border-radius: 12upx;
display: flex;
align-items: center;
justify-content: center;
&::after {
content: "";
position: absolute;
left: -10px;
top: -10px;
right: -10px;
bottom: -10px;
}
}
}
}
@@ -1031,7 +911,7 @@
width: 100%;
padding: $paddingSize;
position: fixed;
bottom: $paddingSize;
bottom: $paddingSize * 2;
left: 0;
z-index: 99;
@@ -1088,7 +968,7 @@
.cart-list-wrap {
.cart-header {
display: flex;
justify-content: space-between;
justify-content: flex-end;
background-color: #f4eddf;
padding: 20upx $paddingSize;
border-radius: 20upx 20upx 0 0;
@@ -1115,23 +995,10 @@
}
.shop_sku {
position: relative;
width: 700rpx;
border-radius: 20rpx;
background: #fff;
.positionabsolute {
position: absolute;
top: 10rpx;
left: 10rpx;
}
.shop_skucimage {
width: 100%;
height: 440rpx;
border-radius: 20rpx 20rpx 0 0;
}
.shop_sku_name {
padding: 0 $paddingSize;
margin-top: 20rpx;
@@ -1225,106 +1092,12 @@
}
.btn {
position: relative;
padding: 16upx 20upx;
padding: 6upx 10upx;
background-color: $color-priamry;
border-radius: 12upx;
display: flex;
align-items: center;
justify-content: center;
&::after {
content: "";
position: absolute;
left: -10px;
top: -10px;
right: -10px;
bottom: -10px;
}
}
}
}
}
.classorderdetailshow {
position: relative;
.orderdetailuicon {
position: absolute;
top: 10rpx;
left: 10rpx;
}
.payType {
padding: 32rpx 34rpx;
margin-top: 48rpx;
background-color: #fff;
>view:first-child {
font-weight: 500;
font-size: 28rpx;
color: #333333;
}
>view:last-child {
margin-top: 32rpx;
}
.dfs {
display: flex;
align-items: center;
}
}
.fixedview {
position: relative;
width: 100%;
.flex-between {
width: 100%;
padding: 24rpx 28rpx;
background: #FFFFFF;
flex-wrap: nowrap;
.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_onethere {
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 24rpx;
color: #999999;
}
}
.fixedview_tow {
background: red;
border-radius: 34rpx;
padding: 10rpx 44rpx;
font-size: 32rpx;
font-family: PingFang SC-Bold, PingFang SC;
font-weight: bold;
color: #FFFFFF;
}
}
}

View File

@@ -1,21 +1,21 @@
<template>
<view class="container">
<view class="header">
<text class="t"></text>
<text class="t">{{shopUser.nickName}}</text>
</view>
<view class="code-wrap">
<view class="num-wrap">
<text class="t">账户余额</text>
<text class="num">{{shopInfo.amount || '--'}}</text>
<text class="num">{{shopUser.amount}}</text>
</view>
<view class="line-code">
<tki-barcode ref="tkiBarcode" show :opations="tkiOptions"></tki-barcode>
<tki-barcode ref="tkiBarcode" show :opations="tkiOptions"></tki-barcode>
</view>
<view class="ewm-wrap">
<uqrcode ref="uqrcode" canvas-id="qrcode" :value="createcardNo"></uqrcode>
</view>
<view class="name">
<text>使用门店{{shopInfo.shopName || '--'}}</text>
<text>使用门店{{shopUser.name}}</text>
</view>
<view class="line"></view>
</view>
@@ -35,22 +35,20 @@
fontSize: 28,
textMargin: 14
},
createcardNo: '',
shopInfo: null
shopUser: {},
createcardNo: ''
};
},
onLoad(e) {
this.shopInfo = JSON.parse(e.shopInfo)
onLoad() {
this.shopUser = uni.cache.get('shopUser')
this.logincreateCardNo();
},
methods: {
async logincreateCardNo() {
let res = await this.api.logincreateCardNo({
"shopId": this.shopInfo.shopId
})
let res = await this.api.logincreateCardNo()
if (res.code == 0) {
this.createcardNo = res.data
this.$refs.tkiBarcode.setval(this.createcardNo) //操作属性
this.$refs.tkiBarcode.setval(this.createcardNo)//操作属性
}
}
}

View File

@@ -1,140 +0,0 @@
<template>
<view class="content">
<view class="contentitem" v-for="(item,index) in list" :key="index">
<view class="contentitemone flex-between">
<view class="contentitemone_o">
{{item.shopName}}{{(item.chainName)}}
</view>
<u-icon name="phone-fill" color="#333333" size="50" @click="clickphone(item.phone)"></u-icon>
</view>
<view class="contentitemtow">
营业时间{{item.businessTime}}
</view>
<view class="contentitemthere flex-start">
<view class="contentitemthere_o" v-if="index == 0">
最近
</view>
<image class="contentitemthere_image"
src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/product/d.png" mode="aspectFill"></image>
<view class="contentitemthere_t">
距您{{item.distances}}<text v-if="item.address">,{{item.address}}</text>
</view>
<u-icon name="arrow-right" color="#999999" size="28"></u-icon>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
shopName: '',
list:[]
};
},
onLoad(e) {
this.shopName = JSON.parse(decodeURIComponent(e.name));
console.log(this.shopName)
this.distirictcomShopList()
},
onShow() {},
methods: {
//打电话
clickphone(e) {
uni.makePhoneCall({
phoneNumber: e
});
},
async distirictcomShopList() {
let res = await this.api.distirictcomShopList({
lng: uni.cache.get('getLocationstorage').lng,
lat: uni.cache.get('getLocationstorage').lat,
address: uni.cache.get('getLocationstorage').address,
distanceInKm: '',
page: 1,
size: 10,
shopName: this.shopName
})
if (res.code == 0) {
this.list = res.data
}
},
clickproduct(item) {
uni.pro.navigateTo('product/index',{
id:item.id
})
},
}
};
</script>
<style scoped lang="scss">
page {
background: #fff;
}
.content {
padding: 0 24rpx;
.contentitem:nth-child(1) {
border-top: none;
}
.contentitem {
padding: 32rpx 0;
width: 100%;
border-top: 2rpx solid #E5E5E5;
.contentitemone {
.contentitemone_o {
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 32rpx;
color: #333333;
}
}
.contentitemtow {
margin-top: 16rpx;
font-family: PingFang SC, PingFang SC;
font-weight: bold;
font-size: 24rpx;
color: #999999;
}
.contentitemthere {
margin-top: 16rpx;
.contentitemthere_o {
padding: 2rpx 12rpx;
background: #FFF9E1;
border-radius: 4rpx 4rpx 4rpx 4rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 500;
font-size: 16rpx;
color: #FF9125;
}
.contentitemthere_image {
width: 24rpx;
height: 24rpx;
}
.contentitemthere_t {
margin-left: 8rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 24rpx;
color: #999999;
text{
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 24rpx;
color: #999999;
}
}
}
}
}
</style>

File diff suppressed because it is too large Load Diff

View File

@@ -1,460 +0,0 @@
<template>
<view class="placeOrder">
<view class="placetop">
<view class="placetopone">
<view style="display: flex;">
<image :src="info.proImg"
style="width: 102rpx;height: 102rpx;border-radius: 50%;margin-left: 28rpx;" mode=""></image>
<view class="placetopInfo">
<view>{{info.proName.length>12?info.proName.substring(0,12)+'...':info.proName}} </view>
<view>{{info.avaTime}} </view>
<view>{{info.proDetail}} </view>
</view>
</view>
<view class="placetopmoney">
<view>
<text>{{info.originPrice}}</text>
<text>{{info.salePrice}}</text>
</view>
<u-number-box v-model="Quantity">
<view slot="minus" class="minus">
<u-icon name="minus" color="#CCCCCC" bold size="30"></u-icon>
</view>
<text slot="input" style="width: 20px;text-align: center;">{{Quantity}}</text>
<view slot="plus" class="plus">
<u-icon name="plus" color="#FF4B10" bold size="30"></u-icon>
</view>
</u-number-box>
</view>
</view>
<view class="redMoney" v-if="false">
<view>
<image src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/drder/hongbao.png"
style="width: 30rpx;height: 30.24rpx;;" mode=""></image>
红包/抵用券
</view>
<view>
{{info.couponDetail.name}}
</view>
</view>
<view style="background-color: #F6F6F6;height: 2rpx;width: 100%;margin: 16rpx 0;"></view>
<view class="jiesuanmoney">
<text>
优惠<text style="color: #FF4C11;font-weight: 500;">{{calculateEvent(info.save)}}</text>
</text>
<text>
小计<text style="color: #FF4C11;font-weight: 500;">{{calculateEvent(info.salePrice) }}</text>
</text>
</view>
</view>
<!-- 支付方式 -->
<view class="payType">
<view class="">
支付方式
</view>
<view class="">
<u-radio-group v-model="radiovalue1" iconPlacement="right" :size="28" placement="column">
<u-radio activeColor="#ffd158" name="1">
<view class="dfs">
<image style="width:44rpx;height:44rpx"
src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/drder/balance.png" mode="">
</image>
<text style="font-size: 28rpx;margin-left: 16rpx;">
微信支付
</text>
</view>
</u-radio>
<view style="margin: 22rpx 0;width: 100%;height: 2rpx;background-color: #E5E5E5;"
v-if="info.isUseVip==1"> </view>
<u-radio activeColor="#ffd158" name="2" v-if="info.isUseVip==1">
<view class="dfs">
<image style="width:44rpx;height:44rpx"
src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/drder/wechat.png" mode="">
</image>
<text style="font-size: 28rpx;margin-left: 16rpx;">
会员卡支付</text>
</view>
</u-radio>
</u-radio-group>
<view style="font-weight: 400;font-size: 24rpx;color: #333333;margin-left: 60rpx;"
v-if="info.isUseVip==1">
会员卡余额{{ amountVIP.amount}} <text
style="font-weight: 500;font-size: 28rpx;margin-left: 16rpx;color: #FF4C11;"
@click="goRecharge">去充值</text>
</view>
</view>
</view>
<view class="placeBottom">
<view class="">
<text style="font-size: 24rpx;font-weight: bold;"> 合计 </text><text
style="font-size: 32rpx;font-weight: bold;color:#FF4C11"> {{calculateEvent(info.salePrice)}}
</text>
<text style="font-size: 24rpx;font-weight: 400;color: # 999;">含优惠卷包0</text>
</view>
<view class="">
{{Quantity}} 已优惠{{calculateEvent(info.save) }}
</view>
<button class="btnStyle" @click="fangdouevent">提交订单</button>
</view>
<payPassword ref="payPwd" @accountPayevent="accountPayevent" v-show="ispws"></payPassword>
</view>
</template>
<script>
import payPassword from '@/components/payPassword.vue'
export default {
components: {
payPassword
},
onLoad(e) {
this.$store.dispatch("set_shopid"); //获取shapid
this.getInfo(e.id)
this.orderIds = e.id
this.amount = uni.cache.get('userInfo').amount
this.vipId = uni.cache.get('userInfo').id
},
data() {
return {
info: null,
Quantity: 1,
radiovalue1: '1',
amount: 0,
orderIds: null,
vipId: null,
ispws: false,
amountVIP: null,
listinfoid: null
}
},
methods: {
async getAount(shopUser) {
let res = await this.api.shopUserInfo({
// shopId:店铺ID
"shopId": shopUser,
"userId": uni.cache.get('userInfo').id
})
if (res.code == 0) {
this.amountVIP = res.data
}
},
// 余额支付
async accountPayevent(pwd) {
this.ispws = false
let res = await this.api.payOrderPay({
orderId: this.listinfoid.id,
payType: "deposit",
pwd
})
if (res.code == 0) {
let orderInfo = {
createdAt: this.listinfoid.createTime,
orderNo: this.listinfoid.orderNo,
orderAmount: this.calculateEvent(this.info.salePrice)
}
uni.showToast({
icon: 'none',
title: '支付成功',
success: () => {
setTimeout(res => {
uni.redirectTo({
url: '/pages/order/successful?orderId=' + this
.listinfoid.id + '&orderInfo=' + JSON.stringify(
orderInfo) + '&radiovalue1=' + this.radiovalue1
});
}, 1000)
}
})
} else if (res.data == 1) {
setTimeout(() => {
// 去充值
this.goRecharge()
}, 2000)
}
},
calculateEvent(d) {
return (d * 1000 * this.Quantity) / 1000
},
goRecharge() {
uni.pro.navigateTo('/pages/member/index', {
shopId: this.info.shopId
})
},
fangdouevent() {
this.$u.debounce(() => {
this.sumbitFrom()
}, 1000)
},
async sumbitFrom() {
let payMoney = this.info.salePrice * this.Quantity
let res = await this.api.creatGroupOrder({
num: this.Quantity,
proId: this.info.proId,
shopId: this.info.shopId,
payAmount: payMoney,
orderAmount: payMoney
})
if (res.code == 0) {
this.listinfoid = res.data
// radiovalue1:为1的时候微信支付,为2是会员卡,需要输入支付密码
if (this.radiovalue1 == 1) {
// 调用支付接口
this.payEvent(res.data.id)
} else {
// 先判断是否设置支付密码。0是没设置。没设置的情况下跳转到设置页面。有的话输入支付密码
let isVip = uni.cache.get('userInfo').isPwd
if (isVip == 0) {
uni.pro.navigateTo('/pages/user/repairpassword', {
shopId_id: uni.cache.get('shopUser')
})
} else {
this.ispws = true
this.$nextTick(() => {
this.$refs.payPwd.onPayUp();
})
}
}
}
},
async payEvent(id) {
let res = await this.api.payOrderPay({
payType: 'wechatPay',
orderId: id,
orderType: 'group'
})
if (res) {
uni.requestPayment({
provider: 'wxpay', //支付类型-固定值
partnerid: res.data.appId, // 微信支付商户号
timeStamp: res.data.timeStamp, // 时间戳(单位:秒)
nonceStr: res.data.nonceStr, // 随机字符串
package: res.data.package, // 固定值
signType: res.data.signType, //固定值
paySign: res.data.paySign, //签名
success: (res) => {
uni.showToast({
title: "支付成功"
})
uni.navigateBack()
},
fail: (err) => {
setTimeout(res => {
uni.showToast({
icon: 'none',
title: '支付失败'
})
uni.hideLoading()
}, 2000)
}
});
}
},
async getInfo(id) {
let res = await this.api.getproductorderConfirm({
productId: id,
})
if (res.code == 0) {
this.info = res.data
// 获取余额
this.getAount(res.data.shopId)
}
}
}
}
</script>
<style lang="less" scoped>
.placeOrder {
.placetop {
width: 750rpx;
background: #FFFFFF;
border-radius: 16rpx 16rpx 16rpx 16rpx;
padding: 20rpx 30rpx;
.placetopone {
.df(space-between);
.placetopInfo {
margin-left: 18rpx;
>view:first-child {
font-weight: 400;
font-size: 32rpx;
color: #333333;
}
>view:nth-child(2),
>view:last-child {
font-weight: 400;
font-size: 24rpx;
color: #666666;
}
}
.placetopmoney {
>view:first-child {
margin-bottom: 20rpx;
>text:first-child {
text-decoration: line-through;
color: #999;
font-weight: 400;
font-size: 24rpx;
}
>text:last-child {
font-weight: bold;
font-size: 28rpx;
color: #333333;
}
}
}
}
.redMoney {
.df(space-between);
margin-top: 30rpx;
.m(30rpx);
>view:first-child {
.df;
font-weight: 400;
font-size: 28rpx;
color: #333333;
}
>view:last-child {
background: #FFE9E9;
border-radius: 16rpx 16rpx 16rpx 16rpx;
font-weight: 400;
font-size: 28rpx;
color: #FF3333;
text-align: center;
padding: 9rpx 13rpx;
}
}
.jiesuanmoney {
// height: 50rpx;
// line-height: 50rpx;
text-align: right;
>text:first-child {
font-size: 24rpx;
}
>text:last-child {
font-size: 32rpx;
margin-left: 20rpx;
}
}
}
.payType {
padding: 32rpx 34rpx;
margin-top: 48rpx;
background-color: #fff;
>view:first-child {
font-weight: 500;
font-size: 28rpx;
color: #333333;
}
>view:last-child {
margin-top: 32rpx;
}
.dfs {
display: flex;
align-items: center;
}
}
.placeBottom {
position: fixed;
bottom: 0%;
left: 0;
width: 100%;
height: 180rpx;
background-color: #fff;
padding: 16rpx 34rpx;
>view:last-child {
margin-top: 16rpx;
font-weight: 400;
font-size: 24rpx;
color: #666666;
}
.btnStyle {
width: 302rpx;
height: 72rpx;
line-height: 72rpx;
text-align: center;
background: linear-gradient(110deg, #F1A666 0%, #FF4C11 100%);
border-radius: 48rpx 48rpx 48rpx 48rpx;
font-weight: bold;
font-size: 36rpx;
color: #FFFFFF;
position: absolute;
right: 58rpx;
top: 30rpx;
}
}
}
.dfs {
display: flex;
align-items: center;
}
.m(@top, @right: 0, @bottom: 0, @left: 0) {
margin: @top, @right, @bottom, @left
}
.df(@start: flex-start, @position: center) {
display: flex;
align-items: @position;
justify-content: @start;
}
</style>
<style lang="scss">
.minus {
width: 22px;
height: 22px;
border-width: 1px;
border-color: #F0F0F0;
border-style: solid;
border-top-left-radius: 100px;
border-top-right-radius: 100px;
border-bottom-left-radius: 100px;
border-bottom-right-radius: 100px;
@include flex;
justify-content: center;
align-items: center;
}
.plus {
width: 22px;
height: 22px;
background-color: #FFF1EC;
border-radius: 50%;
/* #ifndef APP-NVUE */
display: flex;
/* #endif */
justify-content: center;
align-items: center;
}
</style>

View File

@@ -1,321 +0,0 @@
<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>

View File

@@ -1,244 +0,0 @@
<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>

View File

@@ -1,353 +1,49 @@
<template>
<view class="container">
<view class="towcontent">
<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,item)">
<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 class="header">
<navigator class="t" hover-class="none">历史记录</navigator>
<navigator class="t" hover-class="none">管理</navigator>
</view>
<view class="containertop">
<view class="containertopbox">
<view class="containertopboxitem flex-start" v-for="(item,index) in list" :key="index">
<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'">
{{item.status == 0 ? '兑换积分':'已过期'}}
</view>
</view>
</view>
<image style="margin:32rpx auto;" src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/nomore.png"
v-if="is_end" mode="aspectFill"></image>
<u-loadmore :status="form.status" iconSize='24' fontSize='24' height='40' />
</view>
<view class="list">
<view class="item" v-for="item in 5" :key="item"></view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
listbox: [{
name: '全部',
type: ''
},
{
name: '未使用',
type: '0'
},
{
name: '已过期',
type: '1'
}
],
towcontentclickindex: 0,
list: [],
is_end:false,
form: {
page: 1, //页数
size: 10, //页容量
status: 'loadmore',
statuses: ''
},
};
},
onLoad() {
this.ordermineCouponsthis()
},
onReachBottom() {
this.ordermineCouponsthis()
},
methods: {
init_fn(e) {
this.list = []
this.form = {
page: 1, //页数
size: 10, //页容量
status: 'loadmore',
statuses: ''
}
try {
if (e) {
this.form.statuses = e
}
} catch (e) {
//TODO handle the exception
}
this.ordermineCouponsthis()
},
async ordermineCouponsthis() {
try {
let res = await this.api.ordermineCoupons({
userId: uni.cache.get('userInfo').id,
status: this.form.statuses,
page: this.form.page,
size: this.form.size,
orderId:""
})
if (res.data.pages < this.form.page) {
this.form.status = 'nomore'
if (this.form.page == 1 && res.data.list == 0) {
this.is_end = true
}
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) {
//TODO handle the exception
}
},
towcontentclick(index, item) {
this.towcontentclickindex = index
this.form.statuses = item.type
this.init_fn(item.type)
}
}
};
export default {
data() {
return {};
}
};
</script>
<style scoped lang="scss">
page {
background: #fff;
$height: 40px;
.header {
width: 100%;
height: $height;
background-color: #fff;
position: fixed;
top: 0;
left: 0;
z-index: 99;
display: flex;
align-items: center;
justify-content: flex-end;
padding: 0 $paddingSize;
.t {
margin-left: $paddingSize;
color: #999;
}
.container {
.towcontent {
padding: 0 28rpx;
border-top: 16rpx solid #F9F9F9;
.towcontentlistxitem {
width: 100%;
margin-top: 32rpx;
.towcontentlistxitembox {
width: 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 {
width: 33%;
font-family: PingFang SC, PingFang SC;
font-weight: bold;
font-size: 32rpx;
color: #333333;
image {
width: 38.83rpx;
height: 8.62rpx;
}
}
}
}
.containertop {
padding: 40rpx 32rpx;
.containertopbox {
.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-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;
}
}
}
}
}
}
.list {
padding: $height $paddingSize $paddingSize;
.item {
border-radius: 20upx;
height: 100px;
background-color: #fff;
margin-top: $paddingSize;
}
</style>
}
</style>

View File

@@ -1,276 +0,0 @@
<template>
<view class="content">
<!-- 占位符导航栏 -->
<navseat :opacity='opacity' :title='titlename' :titleshow='true'></navseat>
<view class="onecontent">
<view :style="[{'padding-top':HeighT.customBar +44+'px'}]"></view>
<view class="onecontentbox">
<!-- <button open-type="chooseAvatar" @chooseavatar="uploadImg">
<image class="onecontentboximage" :src="userHeadImg" mode=""></image>
</button> -->
<!-- <image class="onecontentboximage" :src="userHeadImg" mode="" @click="uploadImg"></image> -->
<button type="default" class="btn" open-type="chooseAvatar" @chooseavatar="uploadImg">
<view class="" :style="'background-image:url('+userHeadImg+');'"
style="width: 180rxp;height: 180rpx; background-position: center;"></view>
</button>
<view class="onecontentboxitem flex-between">
<view class="onecontentboxitemtext">
昵称
</view>
<input class="onecontentboxiteminput" v-model="nickName" type="nickname" @blur="bindblur"
placeholder="请输入昵称" @input="bindinput" />
</view>
<view class="onecontentboxitem flex-between" style="border-top: 1rpx dotted #333333;">
<view class="onecontentboxitemtext">
手机号
</view>
<button class="onecontentboxiteminput buttonstyle"
style="background-color: #fff;border: none;!important" open-type="getPhoneNumber"
@getphonenumber="getPhone">{{phonetitle}} </button>
<!-- <input class="onecontentboxiteminput" disabled v-model="phonetitle" type="text"
placeholder="请输入手机号"> -->
</view>
</view>
<view class="onecontentboxitemnamber" @click="sumbit">
保存
</view>
</view>
</view>
</template>
<script>
import navseat from '@/components/navseat.vue'
export default {
components: {
navseat
},
data() {
return {
titlename: '完善信息',
opacity: false,
form: {
address: '', //地址
type: '', //品类
orderBy: '', //1.理我最近 2.销量优先 3.价格优先
other: '', //附近1KM 1选中 0不选中
page: 1, //页数
size: 10, //页容量
status: 'loadmore',
},
userInfo: uni.cache.get('userInfo'),
userHeadImg: "",
nickName: '',
phonetitle: ""
};
},
onLoad() {
this.userInfo = uni.cache.get('userInfo')
this.nickName = this.userInfo.nickName
this.userHeadImg = this.userInfo.headImg
this.phonetitle = this.userInfo.telephone ? this.userInfo.telephone : '请授权手机号'
},
onPageScroll(e) {
if (e.scrollTop <= 44) { //搜索导航栏
this.opacitys = false
} else {
this.opacitys = true
}
},
methods: {
async getPhone(d) {
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,
})
this.phonetitle = res.data
}
})
}
},
bindblur(e) {
console.log(e, 11)
this.nickName = e.detail.value; // 获取微信昵称
},
bindinput(e) {
console.log(e, 22)
this.nickName = e.detail.value; // 获取微信昵称
},
// uploadImg() {
// let _this = this
// uni.chooseImage({
// crop: {
// width: 200,
// height: 200
// },
// success: (chooseImageRes) => {
// const tempFilePaths = chooseImageRes.tempFilePaths;
// uni.uploadFile({
// url: uni.conf.baseUrl + '/common/upload',
// filePath: tempFilePaths[0],
// header: {
// environment: 'app',
// type: 'android',
// version: '1.7.3',
// },
// name: "file",
// formData: {
// file: chooseImageRes.tempFiles[0],
// },
// success: (uploadFileRes) => {
// let {
// data
// } = JSON.parse(uploadFileRes.data)
// this.userHeadImg = data
// },
// });
// },
// })
// },
uploadImg(e) {
const {
avatarUrl
} = e.detail
console.log(e)
console.log(e.detail)
// this.userHeadImg = avatarUrl
uni.uploadFile({
url: 'https://wxcashiertest.sxczgkj.cn/cashierService/common/upload',
// url: uni.conf.baseUrl + '/common/upload',
filePath: avatarUrl,
header: {
environment: 'app',
type: 'android',
version: '1.7.3',
},
name: "file",
formData: {
file: avatarUrl,
},
success: (uploadFileRes) => {
let {
data
} = JSON.parse(uploadFileRes.data)
this.userHeadImg = data
},
});
},
async sumbit() {
let res = await this.api.upUserInfo({
headImg: this.userHeadImg,
nickName: this.nickName,
telephone: this.phonetitle == '请授权手机号' ? '' : this.phonetitle
})
if (res.code == 0) {
uni.navigateBack()
}
}
},
computed: {
HeighT() { //手机类型的尺寸
return this.$store.getters.is_BarHeight
},
},
};
</script>
<style scoped lang="scss">
page {
background: #F9F9F9;
}
.content {
.onecontent {
padding: 0 28rpx;
width: 100%;
height: 446rpx;
background: linear-gradient(180deg, #FFD158 0%, #F9F9F9 100%);
.onecontentbox {
position: relative;
margin-top: 116rpx;
width: 100%;
background: #FFFFFF;
border-radius: 24rpx 24rpx 24rpx 24rpx;
padding: 75rpx 32rpx 0rpx 32rpx;
.onecontentboximage {
position: absolute;
left: 50%;
top: -60rpx;
width: 120rpx;
height: 120rpx;
border-radius: 50%;
transform: translateX(-50%);
}
.onecontentboxitem {
padding: 24rpx 0;
.onecontentboxitemtext {
font-family: PingFang SC, PingFang SC;
font-weight: bold;
font-size: 32rpx;
color: #333333;
}
.onecontentboxiteminput {
text-align: right;
flex: auto;
font-family: PingFang SC, PingFang SC;
font-weight: 400;
font-size: 24rpx;
color: #999999;
height: 100%;
}
.buttonstyle {
.buttonstyle:after {
border: none;
}
}
}
}
.onecontentboxitemnamber {
margin-top: 84rpx;
text-align: center;
width: 100%;
padding: 20rpx 0;
background: #FFD158;
border-radius: 46rpx 46rpx 46rpx 46rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 500;
font-size: 36rpx;
color: #333333;
}
}
}
.btn {
width: 180rpx;
height: 180rpx;
border-radius: 100%;
padding: 0;
>view {
border-radius: 100%;
}
}
</style>
<style>
.buttonstyle:after {
border: none;
}
</style>

View File

@@ -1,227 +0,0 @@
<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: '',
showoverlay: true
};
},
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.cache.get('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>

View File

@@ -1,223 +0,0 @@
<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.cache.get('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>

View File

@@ -1,254 +0,0 @@
<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.cache.get('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>

View File

@@ -1,692 +0,0 @@
<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>

View File

@@ -1,342 +0,0 @@
<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';
import webSocketUtils from '@/common/js/websocket.js'
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>

View File

@@ -1,419 +0,0 @@
<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';
import webSocketUtils from '@/common/js/websocket.js'
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>

View File

@@ -1,560 +0,0 @@
<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>

View File

@@ -1,236 +1,117 @@
<template>
<view class="container">
<!-- <view class="user-info-wrap" @click="clickinformation">
<view style="width: 108rpx; height: 108rpx;border-radius: 50%;">
<image style="width: 108rpx; height: 108rpx; border-radius: 50%;" v-if="userInfo.headImg"
:src="userInfo.headImg" mode="aspectFill">
</image>
<image style="width: 108rpx; height: 108rpx; border-radius: 50%;" v-else src="@/static/avatar.png"
mode="aspectFill">
</image>
<view class="user-info-wrap">
<view style="width: 36px; height: 36px;border-radius: 10rpx;">
<button open-type="chooseAvatar" @chooseavatar='onChooseAvatar'
style="padding: 0;margin: 0; width: 36px; height: 36px;border-radius: 10rpx;">
<image style="width: 36px; height: 36px;" v-if="userInfo.avatar" :src="userInfo.avatar" mode="aspectFill">
</image>
<image style="width: 36px; height: 36px;" v-else src="@/static/avatar.png" mode="aspectFill">
</image>
</button>
</view>
<view class="info flex-colum-start">
<text class="phone">{{userInfo.nickName || '无'}}</text>
<!-- <view class="name"><input type="nickname" @blur="blurname"
v-model="userInfo.nickName" placeholder="请输入昵称"></view> -->
<text class="phone">{{userInfo.telephone || '无'}}</text>
<!-- <text class="phone">1882177889</text> -->
</view>
</view>
<view class="card">
<view class="header-wrap">
<view class="header">
<text class="title">我的订单</text>
<view class="more" @click="orderHandle(1)">
<text class="t">全部订单</text>
<u-icon name="arrow-right" color="#999" size="24"></u-icon>
</view>
</view>
</view>
<view class="order-menu">
<view class="item" @click="orderHandle(2)">
<image class="icon" src="@/static/user_icon1.png" mode="aspectFit"></image>
<text class="t">待付款</text>
</view>
<view class="item" @click="orderHandle(3)">
<image class="icon" src="@/static/user_icon2.png" mode="aspectFit"></image>
<text class="t">待发货</text>
</view>
<view class="item" @click="orderHandle(4)">
<image class="icon" src="@/static/user_icon3.png" mode="aspectFit"></image>
<text class="t">已完成</text>
</view>
<view class="item" @click="orderHandle(5)">
<image class="icon" src="@/static/user_icon4.png" mode="aspectFit"></image>
<text class="t">退款</text>
</view>
</view>
</view>
<!-- <view class="card">
<view class="header-wrap">
<view class="header">
<text class="title">更多服务</text>
</view>
</view>
<view class="order-menu">
<navigator class="item" hover-class="none" url="/pages/user/coupon">
<image class="icon" src="@/static/user_icon5.png" mode="aspectFit"></image>
<text class="t">优惠券</text>
</navigator>
<view class="item">
<image class="icon" src="@/static/user_icon6.png" mode="aspectFit"></image>
<text class="t">寄存记录</text>
</view>
<view class="item">
<image class="icon" src="@/static/user_icon7.png" mode="aspectFit"></image>
<text class="t">储值明细</text>
</view>
<view class="item">
<image class="icon" src="@/static/user_icon8.png" mode="aspectFit"></image>
<text class="t">设置</text>
</view>
</view>
</view> -->
<navseat :opacity='opacity' class="navseat" title='个人中心' :iconshow="false" :titleshow='true'></navseat>
<view class="boxtop">
<!-- #ifndef MP-WEIXIN -->
<view :style="{'height':Topdistance+'px'}"></view>
<!-- #endif -->
<!-- #ifdef MP-WEIXIN -->
<view :style="{'height':HeighT.customBar+HeighT.heightBar+'px'}"></view>
<!-- #endif -->
<view class="boxtop_top flex-between">
<view class="boxtop_topleft">
<view class="flex-start" v-if="userInfo" @click="clickinformation">
<image style="width: 108rpx; height: 108rpx; border-radius: 50%;" v-if="userInfo.headImg"
:src="userInfo.headImg" mode="aspectFill">
</image>
<text>{{userInfo.nickName || '无'}}</text>
</view>
<view class="flex-start" v-else @click="loginClick">
<text>去登录</text>
</view>
</view>
<image style="width: 44rpx; height: 42.26rpx;" @click="clickphone()"
src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/user/kf.png" mode="aspectFill">
</view>
<image @click="memberlist" class="boxtop_botton"
src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/user/member.png" mode="aspectFit"></image>
<view class="version-wrap">
<!-- <text class="t">版本号2.0.0</text> -->
<text class="t">陕西超掌柜科技有限公司</text>
</view>
<view class="userinfoone" v-if="teblist.length!=0">
<view class="userinfoonebox">
<view class="userinfooneboxitem flex-between" @click="clickinfo(item,index)"
v-for="(item,index) in teblist" :key="index">
<view class="userinfooneboxitemleft flex-start">
<image :src="item.shareImg" mode="aspectFill"></image>
<text>{{item.name}}</text>
</view>
<u-icon name="arrow-right" color="#575B66" size="28"></u-icon>
</view>
</view>
</view>
<listitem :list='list' v-if="list.length!=0"></listitem>
</view>
</template>
<script>
import uploadImage from "@/js_sdk/yushijie-ossutil/ossutil/uploadFile.js";
import listitem from "@/components/listitem.vue";
import navseat from '@/components/navseat.vue'
export default {
components: {
listitem,
navseat
},
data() {
return {
titlename: '个人中心',
opacity: false,
shopUser: {},
userInfo: {},
teblist: [],
list: [],
Topdistance: '',
shopInfo:{}
};
},
onLoad() {},
computed: {
HeighT() { //手机类型的尺寸
return this.$store.getters.is_BarHeight
},
},
mounted() {
setTimeout(() => {
this.$nextTick(() => {
this.GetTop()
});
}, 1000)
// 当组件挂载完成后获取距离
},
onPageScroll(e) {
if (e.scrollTop <= 44) { //搜索导航栏
this.opacity = false
} else {
this.opacity = true
}
},
onShow() {
if (uni.cache.get('token')) {
this.init_fn()
this.loginwxuserInfo()
this.tbPlatformDict()
}
},
methods: {
clickphone() {
uni.makePhoneCall({
phoneNumber: uni.cache.get('userInfo').custPhone
});
},
clickinformation() {
uni.pro.navigateTo('user/information')
},
//获取元素距离顶部的距离
GetTop() {
this.$u.getRect('.content').then(res => {
console.log(1111, res)
this.Topdistance = res.height //滚动距离
})
},
memberlist() {
if (uni.cache.get('token')) {
uni.pro.navigateTo('member/list')
} else {
this.loginClick()
}
},
//退出登录
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'
});
}
}
});
},
loginClick() {
uni.cache.clear();
uni.reLaunch({
url: '/pages/login/login'
});
},
// 精选推荐
// 下面初始数据
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: '', //品类
orderBy: 5, //0.今日上新 1.离我最近 2.销量优先 3.价格优先 4.热榜推荐
other: '', //附近1KM 1选中 0不选中
page: 1, //页数
size: 10, //页容量
dateType: '',
status: 'loadmore'
}
this.onLoadlist()
},
async onLoadlist() {
try {
let res = await this.api.indexlist(this.form)
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) {}
},
clickinfo(item, index) {
switch (item.jumpType) {
case 'scan': //特殊处理点击
switch (item.value) {
case 'loginOut':
this.boxClick()
break;
}
break;
case 'scan_applet':
uni.navigateToMiniProgram(JSON.parse(item.value))
break
case 'relative': //内部页面
uni.pro.navigateTo(item.absUrl)
break;
case 'absolute': //外链url
uni.navigateTo({
url: `/pages/webview/webview?url=${item.menuUrl}`
});
break;
}
blurname(e) {
console.log(e);
this.userlist.nickname = e.detail.value
},
async loginwxuserInfo() {
let res = await this.api.loginwxuserInfo({
userId: uni.cache.get('userInfo').id
userId: uni.cache.get('userInfo').id,
shopId: uni.cache.get('shopUser').shopId
})
if (res.code == 0) {
uni.cache.set('userInfo', res.data);
uni.cache.set('userInfo', res.data.userInfo);
uni.cache.set('shopUser', res.data.shopUser);
uni.cache.set('shopInfo', res.data.shopInfo);
this.shopUser = uni.cache.get('shopUser')
this.userInfo = uni.cache.get('userInfo')
}
},
async tbPlatformDict() {
let res = await this.api.tbPlatformDict({
type: 'ownMenu'
})
// console.log(res)
if (res.code == 0) {
this.teblist = res.data
this.shopInfo = uni.cache.get('shopInfo')
}
},
// / 更换头像
@@ -268,14 +149,22 @@
</script>
<style scoped lang="scss">
.container {
padding: 0 $paddingSize;
}
.user-info-wrap {
position: relative;
padding: 48rpx 32rpx 88rpx 32rpx;
padding: $paddingSize + 20upx $paddingSize;
display: flex;
align-items: center;
width: 750rpx;
background: #FFD158;
border-radius: 0rpx 0rpx 40rpx 0rpx;
.avatar {
$size: 120upx;
width: $size;
height: $size;
border-radius: 50%;
border: 2px solid #fff;
}
.info {
flex: 1;
@@ -296,89 +185,63 @@
}
}
.user-info-wrap::after {
position: absolute;
content: '';
bottom: 40rpx;
right: 0;
width: 40rpx;
height: 40rpx;
line-height: 40rpx;
text-align: center;
background-image: radial-gradient(40rpx at 0px 0px, rgba(0, 0, 0, 0) 40rpx, #fff 40rpx);
}
.card {
border-radius: 20upx;
background-color: #fff;
margin-bottom: $paddingSize;
.boxtop {
width: 100%;
height: 542rpx;
background: url(https://czg-qr-order.oss-cn-beijing.aliyuncs.com/user/user.png) no-repeat;
background-size: 100% 100%;
position: relative;
.header-wrap {
padding: 0 $paddingSize;
}
.boxtop_top {
padding: 0 32rpx;
margin-top: 52rpx;
.header {
padding: 38upx 0;
display: flex;
justify-content: space-between;
border-bottom: 1upx solid #f2f2f2;
.boxtop_topleft {
.flex-start {
text {
margin-left: 18rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 500;
font-size: 36rpx;
color: #333333;
}
.more {
display: flex;
align-items: center;
.t {
color: #999;
margin-right: 8upx;
}
}
}
.boxtop_botton {
position: absolute;
left: 50%;
bottom: 0;
transform: translatex(-50%);
width: 654rpx;
height: 160rpx;
.order-menu {
display: flex;
.item {
flex: 1;
padding: 38upx 0;
display: flex;
flex-direction: column;
align-items: center;
.icon {
$size: 68upx;
width: $size;
height: $size;
}
.t {
padding-top: 20upx;
}
}
}
}
.userinfoone {
position: relative;
padding: 48rpx 28rpx;
width: 100%;
// top: -40rpx;
background: #F6F6F6;
// border-radius: 40rpx 0 0rpx 0rpx;
.version-wrap {
padding: 100upx 0;
display: flex;
flex-direction: column;
align-items: center;
.userinfoonebox {
padding: 32rpx 20rpx 32rpx 52rpx;
border-radius: 22rpx;
background: #FFFFFF;
width: 100%;
.userinfooneboxitem {
width: 100%;
margin-top: 32rpx;
.userinfooneboxitemleft {
image {
width: 41.33rpx;
height: 36.9rpx;
}
text {
margin-left: 32rpx;
font-family: Source Han Sans CN, Source Han Sans CN;
font-weight: 400;
font-size: 28rpx;
color: #333333;
}
}
}
.userinfooneboxitem:nth-child(1) {
margin-top: 0;
}
.t {
color: #999;
}
}
</style>

Some files were not shown because too many files have changed in this diff Show More