Compare commits
5 Commits
| Author | SHA1 | Date | |
|---|---|---|---|
|
|
8b68595e92 | ||
|
|
7a8617b7a7 | ||
|
|
45f8f23fcc | ||
|
|
6040e37da2 | ||
|
|
b30b8ffc30 |
1
.gitignore
vendored
1
.gitignore
vendored
@@ -1,2 +1 @@
|
|||||||
/unpackage
|
/unpackage
|
||||||
node_modules/
|
|
||||||
@@ -1,27 +1,16 @@
|
|||||||
{
|
{ // launch.json 配置了启动调试时相关设置,configurations下节点名称可为 app-plus/h5/mp-weixin/mp-baidu/mp-alipay/mp-qq/mp-toutiao/mp-360/
|
||||||
// launch.json 配置了启动调试时相关设置,configurations下节点名称可为 app-plus/h5/mp-weixin/mp-baidu/mp-alipay/mp-qq/mp-toutiao/mp-360/
|
|
||||||
// launchtype项可配置值为local或remote, local代表前端连本地云函数,remote代表前端连云端云函数
|
// launchtype项可配置值为local或remote, local代表前端连本地云函数,remote代表前端连云端云函数
|
||||||
"version": "0.0",
|
"version": "0.0",
|
||||||
"configurations" : [
|
"configurations": [{
|
||||||
|
"default" :
|
||||||
{
|
{
|
||||||
"app-plus" : {
|
|
||||||
"launchtype" : "local"
|
"launchtype" : "local"
|
||||||
},
|
},
|
||||||
"default" : {
|
"mp-weixin" :
|
||||||
"launchtype" : "local"
|
{
|
||||||
},
|
|
||||||
"mp-weixin" : {
|
|
||||||
"launchtype" : "local"
|
"launchtype" : "local"
|
||||||
},
|
},
|
||||||
"type" : "uniCloud"
|
"type" : "uniCloud"
|
||||||
},
|
|
||||||
{
|
|
||||||
"playground" : "custom",
|
|
||||||
"type" : "uni-app:app-android"
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"playground" : "standard",
|
|
||||||
"type" : "uni-app:app-ios"
|
|
||||||
}
|
}
|
||||||
]
|
]
|
||||||
}
|
}
|
||||||
|
|||||||
24
App.vue
24
App.vue
@@ -1,29 +1,15 @@
|
|||||||
<template>
|
|
||||||
<button v-show="false" open-type="getPhoneNumber" @getphonenumber="userlogin"> </button>
|
|
||||||
</template>
|
|
||||||
<script>
|
<script>
|
||||||
|
import useStorage from '@/utils/useStroage.js';
|
||||||
export default {
|
export default {
|
||||||
onLaunch: function() {
|
onLaunch: function() {
|
||||||
// #ifdef MP-WEIXIN
|
// console.log('App Launch');
|
||||||
uni.cache.set('menuInfo', uni.getMenuButtonBoundingClientRect());
|
useStorage.set('menuInfo', uni.getMenuButtonBoundingClientRect());
|
||||||
// #endif
|
|
||||||
uni.cache.set('NAME', '零点八零');
|
|
||||||
this.userlogin()
|
|
||||||
},
|
},
|
||||||
onLoad() {},
|
|
||||||
onShow: function() {
|
onShow: function() {
|
||||||
this.$store.dispatch("HeightActions"); //获取随时获取页面的高度
|
// console.log('App Show');
|
||||||
|
|
||||||
},
|
},
|
||||||
onHide: function() {
|
onHide: function() {
|
||||||
// console.log('App Hide');
|
// console.log('App Hide');
|
||||||
},
|
|
||||||
methods: {
|
|
||||||
userlogin() {
|
|
||||||
if (!uni.cache.get('token')) {
|
|
||||||
this.$store.dispatch("loginEvent"); //获取shapid
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
@@ -84,7 +70,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
page {
|
page {
|
||||||
background-color: #F9F9F9;
|
background-color: #f2f2f2;
|
||||||
}
|
}
|
||||||
|
|
||||||
text {
|
text {
|
||||||
|
|||||||
35
common/js/WXBizDataCrypt.js
Normal file
35
common/js/WXBizDataCrypt.js
Normal 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
|
||||||
149
common/js/api.js
149
common/js/api.js
@@ -2,26 +2,8 @@ export default {
|
|||||||
userwxlogin(data) { //登录
|
userwxlogin(data) { //登录
|
||||||
return uni.api.post("/login/wx/custom/login", 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) { //获取商品信息
|
productqueryProduct(data) { //获取商品信息
|
||||||
return uni.api.post("/product/queryProduct", data, false);
|
return uni.api.post("/product/queryProduct", data);
|
||||||
},
|
|
||||||
// 下单详情
|
|
||||||
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);
|
|
||||||
},
|
},
|
||||||
cartadd(data) { //添加到购物车
|
cartadd(data) { //添加到购物车
|
||||||
return uni.api.post("/cart/add", data);
|
return uni.api.post("/cart/add", data);
|
||||||
@@ -47,145 +29,22 @@ export default {
|
|||||||
orderorderList(data) { //订单列表
|
orderorderList(data) { //订单列表
|
||||||
return uni.api.get("/order/orderList", data);
|
return uni.api.get("/order/orderList", data);
|
||||||
},
|
},
|
||||||
// 团购订单列表
|
|
||||||
groupOrderInfo(data) { //订单列表
|
|
||||||
return uni.api.get("/groupOrderInfo/list", data);
|
|
||||||
},
|
|
||||||
orderorderInfo(data) { //订单回显
|
orderorderInfo(data) { //订单回显
|
||||||
return uni.api.get("/order/orderInfo", data);
|
return uni.api.get("/order/orderInfo", data);
|
||||||
},
|
},
|
||||||
groupOrderInfoDetail(data) { //订单回显
|
loginwxuserInfo(data) { //微信用户详情
|
||||||
return uni.api.get("/groupOrderInfo/get", data);
|
return uni.api.get("/login/wx/userInfo", data);
|
||||||
},
|
|
||||||
loginwxuserInfo(data) { //用户详情
|
|
||||||
return uni.api.get("/login/userInfo", data);
|
|
||||||
},
|
},
|
||||||
paymemeberIn(data) { //充值
|
paymemeberIn(data) { //充值
|
||||||
return uni.api.post("/pay/memeberIn", data);
|
return uni.api.post("/pay/memeberIn", data);
|
||||||
},
|
},
|
||||||
// 支付
|
|
||||||
payOrderPay(data) {
|
|
||||||
return uni.api.post("/pay/groupOrderPay", data);
|
|
||||||
},
|
|
||||||
paymodfiyOrderInfo(data) { //查询订单支付状态
|
paymodfiyOrderInfo(data) { //查询订单支付状态
|
||||||
return uni.api.post("/pay/modfiyOrderInfo", 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) { //通过选中的商品规格查询价格
|
productqueryProductSku(data) { //通过选中的商品规格查询价格
|
||||||
return uni.api.get("/product/queryProductSku", data, false);
|
return uni.api.get("/product/queryProductSku", data);
|
||||||
},
|
},
|
||||||
logingetPhoneNumber(data) { //小程序获取手机号
|
logingetPhoneNumber(data) { //小程序获取手机号
|
||||||
return uni.api.post("/login/getPhoneNumber", 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);
|
|
||||||
},
|
|
||||||
|
|
||||||
}
|
}
|
||||||
15879
common/js/city.json
15879
common/js/city.json
File diff suppressed because it is too large
Load Diff
74
common/js/lange.js
Normal file
74
common/js/lange.js
Normal 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;
|
||||||
@@ -24,23 +24,26 @@ class webSocketUtils {
|
|||||||
}
|
}
|
||||||
// 进入这个页面的时候创建websocket连接【整个页面随时使用】
|
// 进入这个页面的时候创建websocket连接【整个页面随时使用】
|
||||||
connectSocketInit (data) {
|
connectSocketInit (data) {
|
||||||
|
console.log(data,"初始化")
|
||||||
this.data = data;
|
this.data = data;
|
||||||
|
// console.log('this.url==', this.url);
|
||||||
|
// console.log('this.params==', this.params);
|
||||||
this.socketTask = uni.connectSocket({
|
this.socketTask = uni.connectSocket({
|
||||||
url: this.url,
|
url: this.url,
|
||||||
success: () => {
|
success: () => {
|
||||||
// console.log('正准备建立websocket中...');
|
console.log('正准备建立websocket中...');
|
||||||
// uni.hideLoading();
|
uni.hideLoading();
|
||||||
// 返回实例
|
// 返回实例
|
||||||
return this.socketTask;
|
return this.socketTask;
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
this.socketTask.onOpen((res) => {
|
this.socketTask.onOpen((res) => {
|
||||||
uni.hideLoading()
|
|
||||||
this.connectNum = 1;
|
this.connectNum = 1;
|
||||||
// console.log('WebSocket连接正常!');
|
console.log('WebSocket连接正常!');
|
||||||
if(this.params){//是否初始化请求
|
if(this.params){//是否初始化请求
|
||||||
this.send(this.params);
|
this.send(this.params);
|
||||||
}
|
}
|
||||||
|
|
||||||
clearInterval(this.reconnectTimeOut);
|
clearInterval(this.reconnectTimeOut);
|
||||||
clearInterval(this.heartbeatInterval);
|
clearInterval(this.heartbeatInterval);
|
||||||
this.is_open_socket = true;
|
this.is_open_socket = true;
|
||||||
@@ -52,6 +55,7 @@ class webSocketUtils {
|
|||||||
let res = JSON.parse(e.data);
|
let res = JSON.parse(e.data);
|
||||||
uni.$emit('message', res)
|
uni.$emit('message', res)
|
||||||
// 普通socket信息处理 TODO
|
// 普通socket信息处理 TODO
|
||||||
|
|
||||||
});
|
});
|
||||||
});
|
});
|
||||||
// 监听连接失败,这里代码我注释掉的原因是因为如果服务器关闭后,和下面的onclose方法一起发起重连操作,这样会导致重复连接
|
// 监听连接失败,这里代码我注释掉的原因是因为如果服务器关闭后,和下面的onclose方法一起发起重连操作,这样会导致重复连接
|
||||||
@@ -59,17 +63,10 @@ class webSocketUtils {
|
|||||||
console.log('网络断开,请检查!');
|
console.log('网络断开,请检查!');
|
||||||
this.socketTask = null;
|
this.socketTask = null;
|
||||||
this.is_open_socket = false;
|
this.is_open_socket = false;
|
||||||
// this.Close()
|
|
||||||
this.canReconnect = true;
|
this.canReconnect = true;
|
||||||
clearInterval(this.heartbeatInterval);
|
clearInterval(this.heartbeatInterval);
|
||||||
clearInterval(this.reconnectTimeOut);
|
clearInterval(this.reconnectTimeOut);
|
||||||
try {
|
|
||||||
if (this.connectNum <= 10) {
|
if (this.connectNum <= 10) {
|
||||||
// uni.showLoading({
|
|
||||||
// title: `网络连接失败,正尝试第${this.connectNum}次连接`,
|
|
||||||
// mask: true
|
|
||||||
// })
|
|
||||||
uni.$emit('message', 1) //进行重连
|
|
||||||
uni.showToast({
|
uni.showToast({
|
||||||
title: `网络连接失败,正尝试第${this.connectNum}次连接`,
|
title: `网络连接失败,正尝试第${this.connectNum}次连接`,
|
||||||
icon: 'none',
|
icon: 'none',
|
||||||
@@ -84,16 +81,6 @@ class webSocketUtils {
|
|||||||
});
|
});
|
||||||
this.connectNum = 1;
|
this.connectNum = 1;
|
||||||
this.canReconnect = false;
|
this.canReconnect = false;
|
||||||
this.Close()
|
|
||||||
setTimeout(res => {
|
|
||||||
uni.switchTab({
|
|
||||||
url: '/pages/index/index'
|
|
||||||
})
|
|
||||||
uni.hideLoading()
|
|
||||||
}, 1000)
|
|
||||||
}
|
|
||||||
} catch (e) {
|
|
||||||
//TODO handle the exception
|
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
// 这里仅是事件监听【如果socket关闭了会执行】
|
// 这里仅是事件监听【如果socket关闭了会执行】
|
||||||
@@ -123,26 +110,26 @@ class webSocketUtils {
|
|||||||
}
|
}
|
||||||
//发送消息
|
//发送消息
|
||||||
send(data) {
|
send(data) {
|
||||||
// console.log("发送消息---------->", data);
|
console.log("发送消息---------->", data);
|
||||||
// 注:只有连接正常打开中 ,才能正常成功发送消息
|
// 注:只有连接正常打开中 ,才能正常成功发送消息
|
||||||
if (this.socketTask) {
|
if (this.socketTask) {
|
||||||
this.socketTask.send({
|
this.socketTask.send({
|
||||||
data: JSON.stringify(data),
|
data: JSON.stringify(data),
|
||||||
async success() {
|
async success() {
|
||||||
// console.log("消息发送成功");
|
console.log("消息发送成功");
|
||||||
},
|
},
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
//开启心跳检测
|
//开启心跳检测
|
||||||
start(data) {
|
start(data) {
|
||||||
// console.log('开启心跳检测', data)
|
console.log('开启心跳检测',data)
|
||||||
this.heartbeatInterval = setInterval(() => {
|
// this.heartbeatInterval = setInterval(() => {
|
||||||
this.send({
|
// this.send({
|
||||||
data: '心跳检测',
|
// data: '心跳检测',
|
||||||
type: 'heartbeat',
|
// type: 'jc',
|
||||||
});
|
// });
|
||||||
}, this.timeout);
|
// }, this.timeout);
|
||||||
}
|
}
|
||||||
//重新连接
|
//重新连接
|
||||||
reconnect() {
|
reconnect() {
|
||||||
@@ -151,7 +138,7 @@ class webSocketUtils {
|
|||||||
//如果不是人为关闭的话,进行重连
|
//如果不是人为关闭的话,进行重连
|
||||||
if (!this.is_open_socket) {
|
if (!this.is_open_socket) {
|
||||||
console.log('进行重连');
|
console.log('进行重连');
|
||||||
this.canReconnect = true;
|
// this.canReconnect = true;
|
||||||
this.reconnectTimeOut = setInterval(() => {
|
this.reconnectTimeOut = setInterval(() => {
|
||||||
this.connectSocketInit(this.data);
|
this.connectSocketInit(this.data);
|
||||||
}, this.timeout);
|
}, this.timeout);
|
||||||
|
|||||||
@@ -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>
|
|
||||||
@@ -1,5 +1,5 @@
|
|||||||
<template>
|
<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>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
|
|||||||
@@ -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>
|
|
||||||
@@ -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>
|
|
||||||
@@ -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>
|
|
||||||
@@ -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>
|
|
||||||
@@ -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>
|
|
||||||
@@ -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>
|
|
||||||
@@ -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>
|
|
||||||
@@ -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>
|
|
||||||
@@ -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&®ion.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
@@ -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
@@ -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>
|
|
||||||
@@ -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>
|
|
||||||
@@ -1,32 +1,22 @@
|
|||||||
const debug = process.env.NODE_ENV == 'development' ? true : false;
|
const debug = true;
|
||||||
// #ifdef H5
|
// #ifdef H5
|
||||||
const proxyApi = "/api"
|
const proxyApi = "/api"
|
||||||
// #endif
|
// #endif
|
||||||
// #ifdef MP-WEIXIN || APP
|
// #ifdef MP-WEIXIN || MP-ALIPAY
|
||||||
// const proxyApi = 'http://192.168.2.42:9889/cashierService' // 王伟
|
const baseUrl = 'https://cashier.sxczgkj.cn/cashierService' // 线上
|
||||||
// const proxyApi = 'http://192.168.2.74:9888/cashierService' // 帆哥
|
const baseUrlwws = 'wss://cashier.sxczgkj.cn/cashierService' // 线上
|
||||||
// const proxyApiwws = 'ws://192.168.2.74:9888/cashierService' // 测试
|
// const baseUrl = "https://wxcashiertest.sxczgkj.cn/cashierService" //测试
|
||||||
const proxyApi = 'https://wxcashiertest.sxczgkj.cn/cashierService' // 测试
|
// const baseUrlwws = 'wss://wxcashiertest.sxczgkj.cn/cashierService' // 测试
|
||||||
const proxyApiwws = 'wss://wxcashiertest.sxczgkj.cn/netty' // 测试
|
|
||||||
// #endif
|
|
||||||
|
|
||||||
|
// #endif
|
||||||
// #ifdef H5
|
// #ifdef H5
|
||||||
const baseUrl = debug ? proxyApi + '/cashierService' : "https://cashier.sxczgkj.cn/cashierService"
|
const baseUrl = debug ? proxyApi : 'http://192.168.2.161:9889/cashierService/' // 线上
|
||||||
const baseUrlwws = 'ws://cashier.sxczgkj.cn/cashierService'
|
|
||||||
// #endif
|
// #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"
|
// import VConsole from "./vConsole.js"
|
||||||
// if (debug) {
|
// if (debug) {
|
||||||
// new VConsole()
|
// // new VConsole()
|
||||||
// }
|
// }
|
||||||
const version = '100'
|
const version = '109'
|
||||||
const autoRemoveCache = {
|
const autoRemoveCache = {
|
||||||
count: 100000,
|
count: 100000,
|
||||||
size: 100000
|
size: 100000
|
||||||
|
|||||||
@@ -185,9 +185,7 @@ Promise.prototype.finally = function(callback) {
|
|||||||
let P = this.constructor
|
let P = this.constructor
|
||||||
return this.then(
|
return this.then(
|
||||||
value => P.resolve(callback()).then(() => value),
|
value => P.resolve(callback()).then(() => value),
|
||||||
reason => P.resolve(callback()).then(() => {
|
reason => P.resolve(callback()).then(() => { throw reason })
|
||||||
throw reason
|
|
||||||
})
|
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
const info_distance = function(e) { //获取元素位置
|
const info_distance = function(e) { //获取元素位置
|
||||||
@@ -206,37 +204,6 @@ const getCurrentRoute = function() {
|
|||||||
return '/' + getCurrentPage().route
|
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 = {
|
uni.utils = {
|
||||||
md5,
|
md5,
|
||||||
transformRequest,
|
transformRequest,
|
||||||
@@ -252,6 +219,5 @@ uni.utils = {
|
|||||||
throttle,
|
throttle,
|
||||||
debounce,
|
debounce,
|
||||||
getCurrentPage,
|
getCurrentPage,
|
||||||
getCurrentRoute,
|
getCurrentRoute
|
||||||
pluschooseImage
|
|
||||||
}
|
}
|
||||||
@@ -1,7 +1,7 @@
|
|||||||
import {
|
import {
|
||||||
fill
|
fill
|
||||||
} from "lodash"
|
} from "lodash"
|
||||||
import store from "../store"
|
|
||||||
const preCacheKeyClearFetch = 'storage:clear:fetch:'
|
const preCacheKeyClearFetch = 'storage:clear:fetch:'
|
||||||
|
|
||||||
uni.pro.interceptor('request', {
|
uni.pro.interceptor('request', {
|
||||||
@@ -44,22 +44,9 @@ function requestrequest(options) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
async function request(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 {
|
try {
|
||||||
if (options.toast) {
|
if (options.toast) {
|
||||||
// #ifdef MP-WEIXIN || APP-PLUS
|
// #ifdef MP-WEIXIN || MP-ALIPAY
|
||||||
uni.showLoading({
|
uni.showLoading({
|
||||||
title: '加载中',
|
title: '加载中',
|
||||||
mask: true
|
mask: true
|
||||||
@@ -74,27 +61,14 @@ async function request(options) {
|
|||||||
}
|
}
|
||||||
if (options.type == 1) {
|
if (options.type == 1) {
|
||||||
options.header = {
|
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'),
|
token: uni.cache.get('token'),
|
||||||
openId: uni.cache.get('miniAppOpenId'),
|
openId: uni.cache.get('userInfo').miniAppOpenId,
|
||||||
id: uni.cache.get('userInfo').id,
|
id: uni.cache.get('userInfo').id,
|
||||||
loginName: "",
|
|
||||||
clientType: ''
|
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
|
|
||||||
}
|
}
|
||||||
// #ifdef MP-WEIXIN || APP-PLUS
|
// #ifdef MP-WEIXIN || MP-ALIPAY
|
||||||
options.url = uni.conf.baseUrl + options.url
|
options.url = uni.conf.baseUrl + options.url
|
||||||
let res = await requestrequest(options);
|
let res = await requestrequest(options);
|
||||||
// #endif
|
// #endif
|
||||||
@@ -102,15 +76,15 @@ async function request(options) {
|
|||||||
let res = await uni.pro.request(options);
|
let res = await uni.pro.request(options);
|
||||||
// #endif
|
// #endif
|
||||||
if (res.code != 0) {
|
if (res.code != 0) {
|
||||||
if (res.code == -4) {
|
if (res.code == 401) {
|
||||||
uni.showToast({
|
uni.showToast({
|
||||||
title: '',
|
title: res.message || res.msg,
|
||||||
// title: res.message || res.msg,
|
|
||||||
icon: "none",
|
icon: "none",
|
||||||
success: () => {
|
success: () => {
|
||||||
setTimeout(res => {
|
uni.cache.clear();
|
||||||
store.dispatch("loginEvent"); //获取shapid
|
uni.redirectTo({
|
||||||
}, 1000)
|
url: '/pages/login/login'
|
||||||
|
});
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
} else if (res.code == 482) {
|
} else if (res.code == 482) {
|
||||||
@@ -127,6 +101,7 @@ async function request(options) {
|
|||||||
setTimeout(res => {
|
setTimeout(res => {
|
||||||
if (options.toast) {
|
if (options.toast) {
|
||||||
// #ifdef MP-WEIXIN
|
// #ifdef MP-WEIXIN
|
||||||
|
uni.hideLoading()
|
||||||
// #endif
|
// #endif
|
||||||
// #ifndef MP-WEIXIN
|
// #ifndef MP-WEIXIN
|
||||||
uni.pro.hideLoading()
|
uni.pro.hideLoading()
|
||||||
@@ -136,7 +111,6 @@ async function request(options) {
|
|||||||
}
|
}
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
return res
|
|
||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
uni.hideLoading()
|
uni.hideLoading()
|
||||||
|
|||||||
3
main.js
3
main.js
@@ -4,15 +4,12 @@ import useStorage from '@/utils/useStroage.js'
|
|||||||
import './framework/bootstrap'
|
import './framework/bootstrap'
|
||||||
import Api from "./common/js/api.js"
|
import Api from "./common/js/api.js"
|
||||||
import Shop from "./common/js/shop.js"
|
import Shop from "./common/js/shop.js"
|
||||||
import store from './store'
|
|
||||||
// #ifndef VUE3
|
// #ifndef VUE3
|
||||||
import Vue from 'vue'
|
import Vue from 'vue'
|
||||||
import './uni.promisify.adaptor'
|
import './uni.promisify.adaptor'
|
||||||
Vue.config.productionTip = false
|
Vue.config.productionTip = false
|
||||||
Vue.prototype.$store = store
|
|
||||||
App.mpType = 'app'
|
App.mpType = 'app'
|
||||||
const app = new Vue({
|
const app = new Vue({
|
||||||
store,
|
|
||||||
...App
|
...App
|
||||||
})
|
})
|
||||||
app.$mount()
|
app.$mount()
|
||||||
|
|||||||
@@ -43,13 +43,9 @@
|
|||||||
]
|
]
|
||||||
},
|
},
|
||||||
/* ios打包配置 */
|
/* ios打包配置 */
|
||||||
"ios" : {
|
"ios": {},
|
||||||
"dSYMs" : false
|
|
||||||
},
|
|
||||||
/* SDK配置 */
|
/* SDK配置 */
|
||||||
"sdkConfigs" : {
|
"sdkConfigs": {}
|
||||||
"ad" : {}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
/* 快应用特有相关 */
|
/* 快应用特有相关 */
|
||||||
@@ -58,19 +54,10 @@
|
|||||||
"mp-weixin": {
|
"mp-weixin": {
|
||||||
"appid": "wxd88fffa983758a30",
|
"appid": "wxd88fffa983758a30",
|
||||||
"setting": {
|
"setting": {
|
||||||
"urlCheck" : false,
|
"urlCheck": false
|
||||||
"minified" : true,
|
|
||||||
"es6" : true,
|
|
||||||
"postcss" : true
|
|
||||||
},
|
},
|
||||||
"usingComponents": true,
|
"usingComponents": true,
|
||||||
"libVersion" : "latest",
|
"libVersion": "latest"
|
||||||
"permission" : {
|
|
||||||
"scope.userLocation" : {
|
|
||||||
"desc" : "你的位置信息将用于小程序位置接口的效果展示"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
"requiredPrivateInfos" : [ "getLocation", "onLocationChange", "chooseLocation", "chooseAddress" ]
|
|
||||||
},
|
},
|
||||||
"h5": {
|
"h5": {
|
||||||
"devServer": {
|
"devServer": {
|
||||||
@@ -78,7 +65,7 @@
|
|||||||
"disableHostCheck": false,
|
"disableHostCheck": false,
|
||||||
"proxy": {
|
"proxy": {
|
||||||
"/api": {
|
"/api": {
|
||||||
"target" : "https://wxcashiertest.sxczgkj.cn",
|
"target": "https://p40312246f.goho.co/cashierService/",
|
||||||
// "target" : "https://ky.sxczgkj.cn",
|
// "target" : "https://ky.sxczgkj.cn",
|
||||||
"ws": false,
|
"ws": false,
|
||||||
"changeOrigin": true, //是否跨域
|
"changeOrigin": true, //是否跨域
|
||||||
|
|||||||
9
package.json
Normal file
9
package.json
Normal file
@@ -0,0 +1,9 @@
|
|||||||
|
{
|
||||||
|
"devDependencies": {
|
||||||
|
"sass": "^1.69.5",
|
||||||
|
"sass-loader": "^13.3.2"
|
||||||
|
},
|
||||||
|
"dependencies": {
|
||||||
|
"lodash": "^4.17.21"
|
||||||
|
}
|
||||||
|
}
|
||||||
232
pages.json
232
pages.json
@@ -3,90 +3,19 @@
|
|||||||
{
|
{
|
||||||
"path": "pages/index/index",
|
"path": "pages/index/index",
|
||||||
"style": {
|
"style": {
|
||||||
"navigationStyle": "custom",
|
|
||||||
"navigationBarTextStyle": "white"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"path": "pages/index/jtoday",
|
|
||||||
"style": {
|
|
||||||
"navigationBarTitleText": "每日上新",
|
|
||||||
"navigationStyle": "custom"
|
"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",
|
"path": "pages/login/login",
|
||||||
"style": {
|
"style": {
|
||||||
"navigationBarTitleText": "登录",
|
"navigationBarTitleText": "用户授权"
|
||||||
"enablePullDownRefresh": false,
|
|
||||||
"disableScroll": true
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"path": "pages/login/register",
|
|
||||||
"style": {
|
|
||||||
"navigationBarTitleText": "注册"
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"path": "pages/order/order",
|
"path": "pages/order/order",
|
||||||
"style": {
|
"style": {
|
||||||
"navigationBarTitleText": "订单列表",
|
"navigationBarTitleText": "订单列表"
|
||||||
"navigationBarBackgroundColor": "#FFD158",
|
|
||||||
"navigationBarTextStyle": "white"
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
@@ -95,19 +24,6 @@
|
|||||||
"navigationBarTitleText": "订单详情"
|
"navigationBarTitleText": "订单详情"
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
|
||||||
"path": "pages/order_detail/indexs",
|
|
||||||
"style": {
|
|
||||||
"navigationBarTitleText": "订单详情"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
|
||||||
"path": "pages/order/successful",
|
|
||||||
"style": {
|
|
||||||
"navigationBarTitleText": "支付成功",
|
|
||||||
"navigationStyle": "custom"
|
|
||||||
}
|
|
||||||
},
|
|
||||||
{
|
{
|
||||||
"path": "pages/member/index",
|
"path": "pages/member/index",
|
||||||
"style": {
|
"style": {
|
||||||
@@ -115,11 +31,6 @@
|
|||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
"path": "pages/member/list",
|
|
||||||
"style": {
|
|
||||||
"navigationBarTitleText": "会员列表"
|
|
||||||
}
|
|
||||||
}, {
|
|
||||||
"path": "pages/make/make",
|
"path": "pages/make/make",
|
||||||
"style": {
|
"style": {
|
||||||
"navigationBarTitleText": "在线预定"
|
"navigationBarTitleText": "在线预定"
|
||||||
@@ -128,16 +39,7 @@
|
|||||||
{
|
{
|
||||||
"path": "pages/user/user",
|
"path": "pages/user/user",
|
||||||
"style": {
|
"style": {
|
||||||
"navigationBarTitleText": "个人中心",
|
"navigationBarTitleText": "个人中心"
|
||||||
"navigationBarBackgroundColor": "#FFD158",
|
|
||||||
"navigationStyle": "custom"
|
|
||||||
}
|
|
||||||
}, {
|
|
||||||
"path": "pages/user/repairpassword",
|
|
||||||
"style": {
|
|
||||||
"navigationBarTitleText": "设置安全密码",
|
|
||||||
"navigationBarBackgroundColor": "#ffffff",
|
|
||||||
"navigationBarTextStyle": "black"
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
@@ -159,20 +61,6 @@
|
|||||||
"navigationBarTextStyle": "white"
|
"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",
|
"path": "pages/make/list",
|
||||||
"style": {
|
"style": {
|
||||||
@@ -182,117 +70,13 @@
|
|||||||
{
|
{
|
||||||
"path": "pages/user/coupon",
|
"path": "pages/user/coupon",
|
||||||
"style": {
|
"style": {
|
||||||
"navigationBarTitleText": "优惠券"
|
"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" : "会员卡"
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
],
|
],
|
||||||
"globalStyle": {
|
"globalStyle": {
|
||||||
"navigationBarTextStyle": "black",
|
"navigationBarTextStyle": "black",
|
||||||
"navigationBarTitleText": "零点八零",
|
"navigationBarTitleText": "银收客",
|
||||||
"navigationBarBackgroundColor": "#ffffff",
|
"navigationBarBackgroundColor": "#ffffff",
|
||||||
"backgroundColor": "#F2F2F2"
|
"backgroundColor": "#F2F2F2"
|
||||||
},
|
},
|
||||||
@@ -314,6 +98,12 @@
|
|||||||
"pagePath": "pages/order/order",
|
"pagePath": "pages/order/order",
|
||||||
"text": "订单"
|
"text": "订单"
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
"iconPath": "static/tabbar/3.png",
|
||||||
|
"selectedIconPath": "static/tabbar/3-1.png",
|
||||||
|
"pagePath": "pages/make/make",
|
||||||
|
"text": "预约"
|
||||||
|
},
|
||||||
{
|
{
|
||||||
"iconPath": "static/tabbar/4.png",
|
"iconPath": "static/tabbar/4.png",
|
||||||
"selectedIconPath": "static/tabbar/4-1.png",
|
"selectedIconPath": "static/tabbar/4-1.png",
|
||||||
|
|||||||
@@ -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>
|
|
||||||
@@ -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>
|
|
||||||
@@ -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>
|
|
||||||
@@ -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>
|
|
||||||
@@ -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>
|
|
||||||
@@ -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>
|
|
||||||
@@ -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>
|
|
||||||
@@ -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>
|
|
||||||
@@ -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>
|
|
||||||
@@ -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>
|
|
||||||
@@ -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>
|
|
||||||
@@ -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>
|
|
||||||
@@ -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>
|
|
||||||
@@ -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>
|
|
||||||
@@ -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>
|
|
||||||
@@ -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>
|
|
||||||
@@ -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>
|
|
||||||
@@ -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>
|
|
||||||
@@ -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>
|
|
||||||
@@ -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>
|
|
||||||
@@ -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
@@ -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值imageValue(imageValue值的结构为数组包对象)用于图片回显
|
|
||||||
// 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>
|
|
||||||
@@ -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值imageValue(imageValue值的结构为数组包对象)用于图片回显
|
|
||||||
// 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>
|
|
||||||
@@ -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>
|
|
||||||
@@ -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>
|
|
||||||
@@ -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>
|
|
||||||
@@ -1,11 +1,31 @@
|
|||||||
<template>
|
<template>
|
||||||
<view class="container">
|
<view class="container">
|
||||||
<view class="box flex-center">
|
<view class="containerbox flex-colum">
|
||||||
<image src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/drder/Logo" mode=""></image>
|
<view class="containerimage_logo">
|
||||||
|
<image class="input_itemone" src="https://ointmentweapp.oss-cn-beijing.aliyuncs.com/manage/login2.png"
|
||||||
|
mode=""></image>
|
||||||
</view>
|
</view>
|
||||||
<view class="top_box">
|
<view class="containertext">
|
||||||
<button class="toLogin" open-type="getPhoneNumber" @getphonenumber="userlogin">快速登录 </button>
|
微信昵称
|
||||||
</view>
|
</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>
|
</view>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
@@ -13,170 +33,272 @@
|
|||||||
export default {
|
export default {
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
h: null, //动态高度
|
phone: ''
|
||||||
types: '', //判断是否是微信扫码点餐进来
|
}
|
||||||
};
|
|
||||||
},
|
},
|
||||||
mounted() {
|
onLoad() {
|
||||||
this.computed_h();
|
uni.cache.clear();
|
||||||
this.userlogin() // 静默登录
|
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
// 静默登录
|
async userlogin() {
|
||||||
// userlogin(reslange) {
|
// #ifdef MP-WEIXIN || MP-ALIPAY
|
||||||
// uni.login({
|
uni.login({ //alipay weixin
|
||||||
// provider: 'weixin',
|
// #ifdef MP-ALIPAY
|
||||||
// success: async (data) => {
|
provider: 'alipay',
|
||||||
// if (data.errMsg == "login:ok") {
|
// #endif
|
||||||
// console.log(data.code, '调试-code')
|
// #ifdef MP-WEIXIN
|
||||||
// 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({
|
|
||||||
provider: 'weixin',
|
provider: 'weixin',
|
||||||
|
// #endif
|
||||||
success: async (data) => {
|
success: async (data) => {
|
||||||
try {
|
try {
|
||||||
uni.getUserInfo({
|
uni.getUserInfo({
|
||||||
provider: 'weixin',
|
provider: 'weixin',
|
||||||
success: async (infoRes) => {
|
success: async (infoRes) => {
|
||||||
|
console.log(infoRes, 81);
|
||||||
uni.cache.set('weixincode', data.code);
|
uni.cache.set('weixincode', data.code);
|
||||||
let res = await this.api.userwxlogin({
|
let res = await this.api.userwxlogin({
|
||||||
code: uni.cache.get('weixincode'), //临时登录凭证
|
code: uni.cache.get('weixincode'), //临时登录凭证
|
||||||
|
encryptedData: infoRes
|
||||||
|
.encryptedData, // 用户非敏感信息
|
||||||
rawData: infoRes.rawData,
|
rawData: infoRes.rawData,
|
||||||
// signature: infoRes.signature,
|
signature: infoRes.signature,
|
||||||
// iv: infoRes.detail.iv,
|
iv: infoRes.iv,
|
||||||
// encryptedData: infoRes.detail
|
phone: this.phone
|
||||||
// .encryptedData
|
|
||||||
})
|
})
|
||||||
if (res.code == 0) {
|
if (res.code == 0) {
|
||||||
|
console.log(res, 88)
|
||||||
uni.cache.set('token', res.data.token);
|
uni.cache.set('token', res.data.token);
|
||||||
uni.cache.set('miniAppOpenId', res.data.userInfo
|
uni.cache.set('miniAppOpenId', res.data.userInfo
|
||||||
.miniAppOpenId)
|
.miniAppOpenId)
|
||||||
uni.cache.set('userInfo', res.data.userInfo);
|
uni.cache.set('userInfo', res.data.userInfo);
|
||||||
if (uni.cache.get('types') == 'types') {
|
uni.cache.set('shopUser', res.data.shopUser);
|
||||||
uni.reLaunch({
|
|
||||||
url: '/pages/order_food/order_food'
|
|
||||||
});
|
|
||||||
} else {
|
|
||||||
uni.pro.switchTab('index/index')
|
uni.pro.switchTab('index/index')
|
||||||
}
|
}
|
||||||
}
|
|
||||||
},
|
},
|
||||||
fail: (err) => {}
|
fail: (err) => {
|
||||||
});
|
console.log(err)
|
||||||
} catch (e) {}
|
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
// } else {
|
|
||||||
// uni.showToast({
|
|
||||||
// title: '获取手机号失败!请重新获取',
|
|
||||||
// icon: 'none'
|
|
||||||
// });
|
|
||||||
// }
|
|
||||||
},
|
|
||||||
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>
|
|
||||||
|
|
||||||
|
// 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)
|
||||||
|
}
|
||||||
|
}
|
||||||
|
});
|
||||||
|
// #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">
|
<style lang="scss">
|
||||||
page {
|
page {
|
||||||
width: 100%;
|
background: #F9F9F9;
|
||||||
height: 100%;
|
|
||||||
background: #FFFFFF;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
button {}
|
||||||
|
|
||||||
.container {
|
.container {
|
||||||
// position: relative;
|
position: relative;
|
||||||
position: fixed;
|
|
||||||
top: 0;
|
|
||||||
left: 0;
|
|
||||||
width: 100%;
|
|
||||||
height: 100vh;
|
|
||||||
overflow: hidden;
|
|
||||||
|
|
||||||
.box {
|
.containerbox {
|
||||||
// padding-top: 110rpx;
|
position: relative;
|
||||||
position: fixed;
|
width: 100%;
|
||||||
top: 110rpx;
|
|
||||||
left: 50%;
|
.containerimage_logo {
|
||||||
z-index: 22;
|
margin-top: 66rpx;
|
||||||
transform: translateX(-50%);
|
border-radius: 50%;
|
||||||
|
width: 120rpx;
|
||||||
|
height: 120rpx;
|
||||||
|
|
||||||
image {
|
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;
|
|
||||||
width: 100%;
|
width: 100%;
|
||||||
position: fixed;
|
height: 100%;
|
||||||
display: flex;
|
}
|
||||||
flex-direction: column;
|
}
|
||||||
align-items: center;
|
|
||||||
background: #ffffff;
|
|
||||||
border-radius: 40rpx 40rpx 0px 0px;
|
|
||||||
top: 220rpx;
|
|
||||||
|
|
||||||
.toLogin {
|
.containertext {
|
||||||
margin-top: 212rpx;
|
margin-top: 32rpx;
|
||||||
|
font-size: 28rpx;
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
.containerbottom {
|
||||||
|
margin-top: 40rpx;
|
||||||
|
border-top: 1px solid #ccc;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
background: #F1CB66;
|
padding: 0 28rpx;
|
||||||
border-radius: 12rpx 12rpx 12rpx 12rpx;
|
|
||||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
.containerbottom_text {
|
||||||
font-weight: 500;
|
margin-top: 32rpx;
|
||||||
font-size: 32rpx;
|
|
||||||
color: #333333;
|
text:nth-child(1) {
|
||||||
height: 84rpx;
|
font-size: 28rpx;
|
||||||
line-height: 84rpx;
|
}
|
||||||
text-align: center;
|
|
||||||
|
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;
|
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;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -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>
|
|
||||||
@@ -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>
|
|
||||||
@@ -14,7 +14,7 @@
|
|||||||
</view>
|
</view>
|
||||||
<view class="item" @click="goMap">
|
<view class="item" @click="goMap">
|
||||||
<text class="t" style="margin-right: 12upx">门店地址:{{shopInfo.address || '无'}}</text>
|
<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>
|
||||||
<!-- <view class="item">
|
<!-- <view class="item">
|
||||||
<text class="t undline">点击查看近期预约</text>
|
<text class="t undline">点击查看近期预约</text>
|
||||||
@@ -27,6 +27,7 @@
|
|||||||
export default {
|
export default {
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
|
shopUser: {},
|
||||||
userInfo: {},
|
userInfo: {},
|
||||||
shopInfo:{}
|
shopInfo:{}
|
||||||
};
|
};
|
||||||
@@ -61,11 +62,16 @@
|
|||||||
},
|
},
|
||||||
async loginwxuserInfo() {
|
async loginwxuserInfo() {
|
||||||
let res = await this.api.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) {
|
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.userInfo = uni.cache.get('userInfo')
|
||||||
|
this.shopInfo = uni.cache.get('shopInfo')
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
makePhoneCall(e) {
|
makePhoneCall(e) {
|
||||||
|
|||||||
@@ -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>
|
|
||||||
@@ -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>
|
|
||||||
@@ -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>
|
|
||||||
@@ -1,6 +1,26 @@
|
|||||||
<template>
|
<template>
|
||||||
<view class="content">
|
<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">
|
<view class="therecontent">
|
||||||
<input type="number" v-model="amount" placeholder="自定义金额">
|
<input type="number" v-model="amount" placeholder="自定义金额">
|
||||||
</view>
|
</view>
|
||||||
@@ -8,65 +28,47 @@
|
|||||||
<view class="fourcontentlnage" v-for="(item,index) in listdata" :key="index">
|
<view class="fourcontentlnage" v-for="(item,index) in listdata" :key="index">
|
||||||
<view class="flex-colum" :class="index == inputshow?'fourcontentitems':'fourcontentitem'"
|
<view class="flex-colum" :class="index == inputshow?'fourcontentitems':'fourcontentitem'"
|
||||||
@click="clickinput(item,index)">
|
@click="clickinput(item,index)">
|
||||||
<text>{{item.minNum}}元</text>
|
<text>充{{item.amount}}元</text>
|
||||||
<text style="margin-top: 10rpx;">充{{item.minNum}}送{{item.handselNum}}</text>
|
<!-- <text style="margin-top: 10rpx;">送{{item.deliver}}</text> -->
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="fivecontent" @tap="$u.debounce(userbalancerechangesub, 500)">
|
<view class="fivecontent" @click="userbalancerechangesub">
|
||||||
立即充值
|
立即充值
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import card from './components/card.vue'
|
|
||||||
export default {
|
export default {
|
||||||
components: {
|
|
||||||
card
|
|
||||||
},
|
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
inputshow: 0,
|
inputshow: 0,
|
||||||
listdata: [],
|
memberlist: {},
|
||||||
|
listdata: [{
|
||||||
|
amount: 100
|
||||||
|
},{
|
||||||
|
amount: 200
|
||||||
|
},{
|
||||||
|
amount:300
|
||||||
|
},{
|
||||||
|
amount:400
|
||||||
|
},{
|
||||||
|
amount:500
|
||||||
|
},{
|
||||||
|
amount:1000
|
||||||
|
}
|
||||||
|
],
|
||||||
amount: '',
|
amount: '',
|
||||||
userInfo: {},
|
shopUser: {},
|
||||||
shopId: ''
|
userInfo: {}
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
onLoad(e) {
|
onLoad(e) {
|
||||||
this.shopId = e.shopId
|
this.shopUser = uni.cache.get('shopUser')
|
||||||
if (e.type == 'list') { //从列表进来的
|
this.userInfo = uni.cache.get('userInfo')
|
||||||
this.paygetShopByMember(e.shopId)
|
|
||||||
} else {
|
|
||||||
this.paygetShopByMember(e.shopId)
|
|
||||||
}
|
|
||||||
this.paygetActive(e.shopId) //列表
|
|
||||||
|
|
||||||
},
|
},
|
||||||
methods: {
|
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() {
|
async userbalancerechangesub() {
|
||||||
if (this.amount == null || this.amount == '') {
|
if (this.amount == null || this.amount == '') {
|
||||||
uni.showToast({
|
uni.showToast({
|
||||||
@@ -76,44 +78,47 @@
|
|||||||
return false;
|
return false;
|
||||||
}
|
}
|
||||||
let res = await this.api.paymemeberIn({
|
let res = await this.api.paymemeberIn({
|
||||||
shopId: this.shopId, // 判断显示哪家的作品,
|
shopId: uni.cache.get('shopUser').shopId, // 判断显示哪家的作品,
|
||||||
amount: this.amount // 判断显示哪家的作品,
|
amount: this.amount // 判断显示哪家的作品,
|
||||||
})
|
})
|
||||||
if (res.code == 0) {
|
if (res) {
|
||||||
uni.showLoading({
|
|
||||||
title: '加载中',
|
|
||||||
mask: true
|
|
||||||
})
|
|
||||||
// #ifdef MP-WEIXIN
|
// #ifdef MP-WEIXIN
|
||||||
uni.requestPayment({
|
uni.requestPayment({
|
||||||
provider: 'wxpay', //支付类型-固定值
|
provider: 'wxpay', //支付类型-固定值
|
||||||
partnerid: res.data.appId, // 微信支付商户号
|
partnerid: res.data.payAppId, // 微信支付商户号
|
||||||
timeStamp: res.data.timeStamp, // 时间戳(单位:秒)
|
timeStamp: res.data.payTimeStamp, // 时间戳(单位:秒)
|
||||||
nonceStr: res.data.nonceStr, // 随机字符串
|
nonceStr: res.data.paynonceStr, // 随机字符串
|
||||||
package: res.data.package, // 固定值
|
package: res.data.payPackage, // 固定值
|
||||||
signType: res.data.signType, //固定值
|
signType: res.data.paySignType, //固定值
|
||||||
paySign: res.data.paySign, //签名
|
paySign: res.data.paySign, //签名
|
||||||
success: (res) => {
|
success: (res) => {
|
||||||
uni.showToast({
|
uni.showToast({
|
||||||
title: "支付成功"
|
title: "支付成功"
|
||||||
})
|
})
|
||||||
uni.hideLoading()
|
|
||||||
setTimeout(res => {
|
|
||||||
uni.navigateBack()
|
uni.navigateBack()
|
||||||
}, 500)
|
|
||||||
},
|
},
|
||||||
fail: (res) => {
|
fail: (err) => {
|
||||||
|
setTimeout(res => {
|
||||||
|
uni.showToast({
|
||||||
|
icon: 'none',
|
||||||
|
title: '支付失败'
|
||||||
|
})
|
||||||
uni.hideLoading()
|
uni.hideLoading()
|
||||||
|
}, 2000)
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
uni.hideLoading()
|
|
||||||
// #endif
|
// #endif
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
clickinput(a, b) {
|
clickinput(a, b) {
|
||||||
console.log(a, b)
|
console.log(a, b)
|
||||||
this.inputshow = 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;
|
position: relative;
|
||||||
padding: 32rpx;
|
padding: 32rpx;
|
||||||
border-radius: 12rpx;
|
border-radius: 12rpx;
|
||||||
background: linear-gradient(126deg, #FFFBF2 0%, #F2D093 100%);
|
|
||||||
border-radius: 12rpx 12rpx 12rpx 12rpx;
|
|
||||||
|
|
||||||
&::after {
|
.fourcontentitemabsolute {
|
||||||
|
z-index: 9;
|
||||||
position: absolute;
|
position: absolute;
|
||||||
bottom: 0;
|
right: 0;
|
||||||
right: 68rpx;
|
top: 0;
|
||||||
content: '';
|
padding: 6rpx 28rpx;
|
||||||
display: inline-block;
|
font-size: 20rpx;
|
||||||
width: 240rpx;
|
font-family: Source Han Sans CN-Medium, Source Han Sans CN;
|
||||||
height: 232rpx;
|
font-weight: 500;
|
||||||
background: url(https://czg-qr-order.oss-cn-beijing.aliyuncs.com/member.png) no-repeat;
|
color: #FFFFFF;
|
||||||
background-size: 100% 100%;
|
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 {
|
.towcontentitemimage {
|
||||||
@@ -158,6 +165,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.towcontentitemone {
|
.towcontentitemone {
|
||||||
|
margin-top: 42rpx;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
position: relative;
|
position: relative;
|
||||||
z-index: 9;
|
z-index: 9;
|
||||||
@@ -175,10 +183,10 @@
|
|||||||
margin-left: 16rpx;
|
margin-left: 16rpx;
|
||||||
|
|
||||||
.towcontentitemonetextone {
|
.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-weight: 500;
|
||||||
font-size: 36rpx;
|
color: #422A07;
|
||||||
color: #333333;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.towcontentitemonetexttow {
|
.towcontentitemonetexttow {
|
||||||
@@ -198,46 +206,44 @@
|
|||||||
margin-top: 54rpx;
|
margin-top: 54rpx;
|
||||||
}
|
}
|
||||||
|
|
||||||
.towcontentitemtow {
|
.towcontentitemprogress {
|
||||||
margin-top: 84rpx;
|
|
||||||
z-index: 10;
|
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-size: 24rpx;
|
||||||
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
|
font-family: Source Han Sans CN-Regular, Source Han Sans CN;
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
color: #422A07;
|
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 {
|
.therecontent {
|
||||||
@@ -283,7 +289,7 @@
|
|||||||
text-align: center;
|
text-align: center;
|
||||||
background: #FFFFFF;
|
background: #FFFFFF;
|
||||||
border-radius: 8rpx;
|
border-radius: 8rpx;
|
||||||
// border: 1rpx solid #333333;
|
border: 1rpx solid #333333;
|
||||||
font-size: 28rpx;
|
font-size: 28rpx;
|
||||||
font-family: Roboto-Medium, Roboto;
|
font-family: Roboto-Medium, Roboto;
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
@@ -308,8 +314,6 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.fivecontent {
|
.fivecontent {
|
||||||
position: relative;
|
|
||||||
bottom: 44rpx;
|
|
||||||
margin-top: 62rpx;
|
margin-top: 62rpx;
|
||||||
padding: 20rpx 0;
|
padding: 20rpx 0;
|
||||||
text-align: center;
|
text-align: center;
|
||||||
|
|||||||
@@ -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>
|
|
||||||
@@ -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>
|
|
||||||
@@ -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>
|
|
||||||
@@ -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>
|
|
||||||
@@ -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>
|
|
||||||
@@ -1,40 +1,17 @@
|
|||||||
<template>
|
<template>
|
||||||
<view>
|
<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">
|
<u-sticky bgColor="#fff">
|
||||||
<view class="tab-wrap">
|
<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)">
|
<view class="item" v-for="(item, index) in tabs" :key="index" @click="orderswitch(item,index)">
|
||||||
<text>{{ item.name }}</text>
|
<text>{{ item.name }}</text>
|
||||||
</view>
|
</view>
|
||||||
</block>
|
|
||||||
<view class="line-wrap"
|
<view class="line-wrap"
|
||||||
:style="{ left: `${(100 / tabs.length) * active}%`, width: `${100 / tabs.length}%` }">
|
:style="{ left: `${(100 / tabs.length) * active}%`, width: `${100 / tabs.length}%` }">
|
||||||
<view class="line">
|
<view class="line"></view>
|
||||||
<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>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</u-sticky>
|
</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="item" v-for="(item,index) in list" :key="index" @click="orderinfo(item)">
|
||||||
<view class="header-wrap">
|
<view class="header-wrap">
|
||||||
<text v-if="item.sendType == 'post'">快递</text>
|
<text v-if="item.sendType == 'post'">快递</text>
|
||||||
@@ -60,7 +37,7 @@
|
|||||||
<text>退单</text>
|
<text>退单</text>
|
||||||
</text>
|
</text>
|
||||||
<text class="status" v-if="item.status == 'cancelled'">
|
<text class="status" v-if="item.status == 'cancelled'">
|
||||||
<text>已取消</text>
|
<text>取消订单</text>
|
||||||
</text>
|
</text>
|
||||||
<text class="status" v-if="item.status == 'merge'">
|
<text class="status" v-if="item.status == 'merge'">
|
||||||
<text>合台</text>
|
<text>合台</text>
|
||||||
@@ -69,7 +46,8 @@
|
|||||||
<view class="content">
|
<view class="content">
|
||||||
<view class="shop-info">
|
<view class="shop-info">
|
||||||
<view class="shop-item">
|
<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> -->
|
<!-- <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>
|
<c-image width="200" height="200" radius="20" :src="item1.productImg"></c-image>
|
||||||
</view>
|
</view>
|
||||||
@@ -79,8 +57,8 @@
|
|||||||
</view> -->
|
</view> -->
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="total" v-if="item.status != 'cancelled'">
|
<view class="total">
|
||||||
<text class="t">{{item.description}}</text>
|
<text class="t">需付款</text>
|
||||||
<text class="i">¥</text>
|
<text class="i">¥</text>
|
||||||
<text class="num">{{item.orderAmount}}</text>
|
<text class="num">{{item.orderAmount}}</text>
|
||||||
</view>
|
</view>
|
||||||
@@ -96,32 +74,6 @@
|
|||||||
</view>
|
</view>
|
||||||
</view>
|
</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" />
|
<u-loadmore :status="form.status" fontSize="28" color="#999" iconSize="28" />
|
||||||
</view>
|
</view>
|
||||||
</template>
|
</template>
|
||||||
@@ -132,7 +84,6 @@
|
|||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
active: 0,
|
active: 0,
|
||||||
navtabindex: 0,
|
|
||||||
tabs: [{
|
tabs: [{
|
||||||
name: '全部',
|
name: '全部',
|
||||||
type: 1,
|
type: 1,
|
||||||
@@ -148,7 +99,6 @@
|
|||||||
type: 3,
|
type: 3,
|
||||||
status: 'unsend'
|
status: 'unsend'
|
||||||
},
|
},
|
||||||
|
|
||||||
{
|
{
|
||||||
name: '已完成',
|
name: '已完成',
|
||||||
type: 4,
|
type: 4,
|
||||||
@@ -158,37 +108,9 @@
|
|||||||
name: '退款',
|
name: '退款',
|
||||||
type: 5,
|
type: 5,
|
||||||
status: 'refund'
|
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: [],
|
list: [],
|
||||||
groupList: [],
|
|
||||||
is_end: false,
|
is_end: false,
|
||||||
swiperCurrent: '',
|
swiperCurrent: '',
|
||||||
form: {
|
form: {
|
||||||
@@ -207,42 +129,24 @@
|
|||||||
} else {
|
} else {
|
||||||
this.active = (this.tabs.findIndex((item) => item.type == this.useStorage.get('orderType')));
|
this.active = (this.tabs.findIndex((item) => item.type == this.useStorage.get('orderType')));
|
||||||
}
|
}
|
||||||
this.swiperCurrent = ''
|
|
||||||
this.init_fn()
|
this.init_fn()
|
||||||
},
|
},
|
||||||
onReachBottom() {
|
onReachBottom() {
|
||||||
if (this.navtabindex == 1) {
|
|
||||||
// 获取团购订单
|
|
||||||
this.getorderList()
|
|
||||||
} else {
|
|
||||||
this.orderorderList()
|
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 '已取消'
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
// 切换导航栏
|
|
||||||
navtabclick(i) {
|
|
||||||
this.navtabindex = i
|
|
||||||
this.init_fn()
|
|
||||||
},
|
|
||||||
async loginwxuserInfo() {
|
async loginwxuserInfo() {
|
||||||
let res = await this.api.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) {
|
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.userInfo = uni.cache.get('userInfo')
|
||||||
|
this.shopInfo = uni.cache.get('shopInfo')
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
orderinfo(e) {
|
orderinfo(e) {
|
||||||
@@ -250,24 +154,12 @@
|
|||||||
orderId: e.id
|
orderId: e.id
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
orderinfoTo(e) {
|
|
||||||
uni.pro.navigateTo('group_order/order_groupdetail', {
|
|
||||||
orderId: e.id
|
|
||||||
})
|
|
||||||
},
|
|
||||||
init_fn() {
|
init_fn() {
|
||||||
// this.list = []
|
this.list = []
|
||||||
this.groupList = []
|
|
||||||
this.is_end = false
|
this.is_end = false
|
||||||
this.form.page = 1
|
this.form.page = 1
|
||||||
this.form.size = 10
|
|
||||||
this.form.status = 'loadmore'
|
this.form.status = 'loadmore'
|
||||||
if (this.navtabindex == 1) {
|
|
||||||
// 获取团购订单
|
|
||||||
this.getorderList()
|
|
||||||
} else {
|
|
||||||
this.orderorderList()
|
this.orderorderList()
|
||||||
}
|
|
||||||
},
|
},
|
||||||
orderswitch(e, a) {
|
orderswitch(e, a) {
|
||||||
this.active = a
|
this.active = a
|
||||||
@@ -285,60 +177,24 @@
|
|||||||
userId: uni.cache.get('userInfo').id, //userId
|
userId: uni.cache.get('userInfo').id, //userId
|
||||||
status: this.swiperCurrent
|
status: this.swiperCurrent
|
||||||
})
|
})
|
||||||
if (res.data.pages < this.form.page) {
|
if (res.data.length == 0) {
|
||||||
this.form.status = 'nomore'
|
|
||||||
if (this.form.page == 1 && res.data.list.length == 0) {
|
|
||||||
this.list = []
|
|
||||||
this.is_end = true
|
this.is_end = true
|
||||||
}
|
this.form.status = 'nomore'
|
||||||
return false;
|
return false;
|
||||||
} else {
|
} else {
|
||||||
this.form.status = 'loading';
|
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;
|
this.form.page = ++this.form.page;
|
||||||
if (this.form.page > res.data.pages) {
|
setTimeout(() => {
|
||||||
this.form.status = 'nomore';
|
this.list = [...this.list, ...res.data];
|
||||||
} else {
|
if (res.data.length == 10) {
|
||||||
this.form.status = 'loading';
|
this.form.status = 'loading';
|
||||||
|
} else {
|
||||||
|
this.is_end = true;
|
||||||
|
this.form.status = 'nomore';
|
||||||
}
|
}
|
||||||
}, 500)
|
}, 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.form.status = 'loading';
|
|
||||||
}
|
|
||||||
}, 500)
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
@@ -347,57 +203,10 @@
|
|||||||
$tabH: 80upx;
|
$tabH: 80upx;
|
||||||
$color: #ff411d;
|
$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 {
|
.tab-wrap {
|
||||||
display: flex;
|
display: flex;
|
||||||
|
height: $tabH;
|
||||||
position: relative;
|
position: relative;
|
||||||
background: #ffd158;
|
|
||||||
padding: 48rpx 0 72rpx 0;
|
|
||||||
|
|
||||||
.item {
|
.item {
|
||||||
flex: 1;
|
flex: 1;
|
||||||
@@ -406,15 +215,11 @@
|
|||||||
justify-content: center;
|
justify-content: center;
|
||||||
position: relative;
|
position: relative;
|
||||||
z-index: 2;
|
z-index: 2;
|
||||||
|
|
||||||
text {
|
|
||||||
color: #fff;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.line-wrap {
|
.line-wrap {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
bottom: 48rpx;
|
bottom: 0;
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
padding-bottom: 8upx;
|
padding-bottom: 8upx;
|
||||||
@@ -422,22 +227,16 @@
|
|||||||
|
|
||||||
.line {
|
.line {
|
||||||
$h: 6upx;
|
$h: 6upx;
|
||||||
margin-top: 6rpx;
|
width: 30%;
|
||||||
// width: 30%;
|
height: $h;
|
||||||
// height: $h;
|
|
||||||
border-radius: $h;
|
border-radius: $h;
|
||||||
// background-color: $color;
|
background-color: $color;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.list-wrap {
|
.list-wrap {
|
||||||
padding: $paddingSize;
|
padding: $paddingSize;
|
||||||
position: relative;
|
|
||||||
margin-top: -24rpx;
|
|
||||||
z-index: 99999;
|
|
||||||
background: #f6f6f6;
|
|
||||||
border-radius: 24rpx 24rpx 0rpx 0rpx;
|
|
||||||
|
|
||||||
.item {
|
.item {
|
||||||
border-radius: 20upx;
|
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>
|
</style>
|
||||||
@@ -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>
|
|
||||||
@@ -24,12 +24,11 @@
|
|||||||
<text>退单</text>
|
<text>退单</text>
|
||||||
</text>
|
</text>
|
||||||
<text class="status" v-if="listinfo.status == 'cancelled'">
|
<text class="status" v-if="listinfo.status == 'cancelled'">
|
||||||
<text>已取消</text>
|
<text>取消订单</text>
|
||||||
</text>
|
</text>
|
||||||
<text class="status" v-if="listinfo.status == 'merge'">
|
<text class="status" v-if="listinfo.status == 'merge'">
|
||||||
<text>合台</text>
|
<text>合台</text>
|
||||||
</text>
|
</text>
|
||||||
|
|
||||||
</view>
|
</view>
|
||||||
<view class="tag-wrap">
|
<view class="tag-wrap">
|
||||||
<text class="tag" v-if="listinfo.sendType == 'post'">快递</text>
|
<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 == 'takeself'">自提</text>
|
||||||
<text class="tag" v-if="listinfo.sendType == 'table'">堂食</text>
|
<text class="tag" v-if="listinfo.sendType == 'table'">堂食</text>
|
||||||
</view>
|
</view>
|
||||||
<view v-if="listinfo.tableName">
|
<view class="number-wrap" v-if="listinfo.status != 'unpaid' || listinfo.status != 'paying'">
|
||||||
桌号:{{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="t">取餐号</text>
|
||||||
<text class="number">{{listinfo.outNumber}}</text>
|
<text class="number">{{listinfo.tableName}}</text>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="card">
|
<view class="card">
|
||||||
<view class="head border" style="position: relative;">
|
<view class="head border">
|
||||||
<text class="title">
|
<text class="title">
|
||||||
<text>点单详情</text>
|
<text>点单详情</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>
|
||||||
<view class="shop-info">
|
<view class="shop-info">
|
||||||
<view class="item" v-for="(item,index) in listinfo.details" :key="index">
|
<view class="item" v-for="(item,index) in listinfo.details" :key="index">
|
||||||
@@ -66,10 +54,8 @@
|
|||||||
</view>
|
</view>
|
||||||
<view class="info">
|
<view class="info">
|
||||||
<text>{{item.productName}}</text>
|
<text>{{item.productName}}</text>
|
||||||
<text class="n" v-if="item.productSkuName">{{item.productSkuName}}</text>
|
|
||||||
<text class="n">x{{item.num}}</text>
|
<text class="n">x{{item.num}}</text>
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
<view class="price">
|
<view class="price">
|
||||||
<text class="i">¥</text>
|
<text class="i">¥</text>
|
||||||
<text class="num">{{item.priceAmount}}</text>
|
<text class="num">{{item.priceAmount}}</text>
|
||||||
@@ -101,8 +87,7 @@
|
|||||||
</view>
|
</view>
|
||||||
|
|
||||||
<view class="card" style="padding-bottom: 20rpx;" v-if="listinfo.shopQrcode">
|
<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 :src="listinfo.shopQrcode" show-menu-by-longpress="true" style="width: 100%;" mode="widthFix"></image>
|
||||||
</image>
|
|
||||||
</view>
|
</view>
|
||||||
|
|
||||||
<view :style="{height:height}">
|
<view :style="{height:height}">
|
||||||
@@ -141,14 +126,12 @@
|
|||||||
async onLoad(e) {
|
async onLoad(e) {
|
||||||
console.log(e)
|
console.log(e)
|
||||||
this.orderId = e.orderId
|
this.orderId = e.orderId
|
||||||
},
|
|
||||||
onShow() {
|
|
||||||
this.orderorderInfo()
|
this.orderorderInfo()
|
||||||
},
|
},
|
||||||
onUnload() {
|
onShow() {
|
||||||
uni.switchTab({
|
if (this.orderId) {
|
||||||
url: '/pages/order/order'
|
this.orderorderInfo()
|
||||||
})
|
}
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
mountedcreateSelectorQuery() {
|
mountedcreateSelectorQuery() {
|
||||||
@@ -192,35 +175,40 @@
|
|||||||
// #ifdef MP-WEIXIN
|
// #ifdef MP-WEIXIN
|
||||||
uni.requestPayment({
|
uni.requestPayment({
|
||||||
provider: 'wxpay', //支付类型-固定值
|
provider: 'wxpay', //支付类型-固定值
|
||||||
partnerid: res.data.appId, // 微信支付商户号
|
partnerid: res.data.payAppId, // 微信支付商户号
|
||||||
timeStamp: res.data.timeStamp, // 时间戳(单位:秒)
|
timeStamp: res.data.payTimeStamp, // 时间戳(单位:秒)
|
||||||
nonceStr: res.data.nonceStr, // 随机字符串
|
nonceStr: res.data.paynonceStr, // 随机字符串
|
||||||
package: res.data.package, // 固定值
|
package: res.data.payPackage, // 固定值
|
||||||
signType: res.data.signType, //固定值
|
signType: res.data.paySignType, //固定值
|
||||||
paySign: res.data.paySign, //签名
|
paySign: res.data.paySign, //签名
|
||||||
success: (res) => {
|
success: (res) => {
|
||||||
|
uni.hideLoading()
|
||||||
uni.showToast({
|
uni.showToast({
|
||||||
title: "支付成功"
|
title: "支付成功"
|
||||||
})
|
})
|
||||||
setTimeout(res => {
|
setTimeout(res => {
|
||||||
uni.hideLoading()
|
|
||||||
uni.switchTab({
|
uni.switchTab({
|
||||||
url: '/pages/order/order'
|
url: '/pages/order/order'
|
||||||
});
|
});
|
||||||
}, 500)
|
}, 2000)
|
||||||
this.paymodfiyOrderInfo()
|
this.paymodfiyOrderInfo()
|
||||||
|
// uni.redirectTo({
|
||||||
|
// url: "/pages/mall/order/ordersuccess?id=" + datareslane.data
|
||||||
|
// .order_id,
|
||||||
|
// });
|
||||||
},
|
},
|
||||||
fail: (err) => {
|
fail: (err) => {
|
||||||
|
uni.hideLoading()
|
||||||
uni.showToast({
|
uni.showToast({
|
||||||
icon: 'none',
|
icon: 'none',
|
||||||
title: '支付失败'
|
title: '支付失败'
|
||||||
})
|
})
|
||||||
|
|
||||||
setTimeout(res => {
|
setTimeout(res => {
|
||||||
uni.hideLoading()
|
|
||||||
uni.switchTab({
|
uni.switchTab({
|
||||||
url: '/pages/order/order'
|
url: '/pages/order/order'
|
||||||
});
|
});
|
||||||
}, 500)
|
}, 2000)
|
||||||
|
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
@@ -280,7 +268,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.tag-wrap {
|
.tag-wrap {
|
||||||
padding: 20upx 0;
|
padding: 28upx 0;
|
||||||
display: flex;
|
display: flex;
|
||||||
|
|
||||||
.tag {
|
.tag {
|
||||||
|
|||||||
@@ -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>
|
|
||||||
@@ -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>
|
|
||||||
@@ -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>
|
|
||||||
@@ -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>
|
|
||||||
@@ -1,9 +1,9 @@
|
|||||||
<template>
|
<template>
|
||||||
<view class="container">
|
<view class="container">
|
||||||
<view class="card" v-if="listinfo.tableName">
|
<view class="card">
|
||||||
<view class="head">
|
<view class="head">
|
||||||
<text class="title">
|
<text class="title">
|
||||||
桌号:<text>{{listinfo.tableName || '空'}}</text>
|
<text>{{listinfo.tableName || '空'}}</text>
|
||||||
</text>
|
</text>
|
||||||
<text class="status" v-if="listinfo.status == 'unpaid'">
|
<text class="status" v-if="listinfo.status == 'unpaid'">
|
||||||
<text>待支付</text>
|
<text>待支付</text>
|
||||||
@@ -36,10 +36,9 @@
|
|||||||
<text class="tag" v-if="listinfo.sendType == 'takeself'">自提</text>
|
<text class="tag" v-if="listinfo.sendType == 'takeself'">自提</text>
|
||||||
<text class="tag" v-if="listinfo.sendType == 'table'">堂食</text>
|
<text class="tag" v-if="listinfo.sendType == 'table'">堂食</text>
|
||||||
</view>
|
</view>
|
||||||
<view class="number-wrap"
|
<view class="number-wrap" v-if="listinfo.status != 'unpaid'">
|
||||||
v-if="listinfo.status != 'unpaid' && listinfo.status != 'paying'&& listinfo.status != 'cancelled'">
|
|
||||||
<text class="t">取餐号</text>
|
<text class="t">取餐号</text>
|
||||||
<text class="number">{{listinfo.outNumber || '空'}}</text>
|
<text class="number">{{listinfo.tableName || '空'}}</text>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="card">
|
<view class="card">
|
||||||
@@ -55,7 +54,6 @@
|
|||||||
</view>
|
</view>
|
||||||
<view class="info">
|
<view class="info">
|
||||||
<text>{{item.productName}}</text>
|
<text>{{item.productName}}</text>
|
||||||
<text class="n" v-if="item.productSkuName">{{item.productSkuName}}</text>
|
|
||||||
<text class="n">x{{item.num}}</text>
|
<text class="n">x{{item.num}}</text>
|
||||||
</view>
|
</view>
|
||||||
<view class="price">
|
<view class="price">
|
||||||
@@ -72,63 +70,7 @@
|
|||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<!-- <view class="sixcontent">
|
<view class="sixcontent" v-if="listinfo.status == 'unpaid'">
|
||||||
<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="sixcontentone flex-between">
|
<view class="sixcontentone flex-between">
|
||||||
<view class="sixcontent_one">
|
<view class="sixcontent_one">
|
||||||
支付方式
|
支付方式
|
||||||
@@ -146,7 +88,7 @@
|
|||||||
|
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="sixcontenttowitem flex-between" @click="clickselect(2)">
|
<!-- <view class="sixcontenttowitem flex-between" @click="clickselect(2)">
|
||||||
<view class="sixcontenttowitemone flex-start">
|
<view class="sixcontenttowitemone flex-start">
|
||||||
<u-icon name="zhifubao" color="#999999" size="26"></u-icon>
|
<u-icon name="zhifubao" color="#999999" size="26"></u-icon>
|
||||||
<text class="sixcontenttowitemonetext">余额支付</text>
|
<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-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>
|
<u-icon v-else name="checkmark-circle-fill" color="#999999" size="26"></u-icon>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
|
||||||
</view>
|
|
||||||
</view> -->
|
</view> -->
|
||||||
|
</view>
|
||||||
|
</view>
|
||||||
<view :style="{height:height}">
|
<view :style="{height:height}">
|
||||||
|
|
||||||
</view>
|
</view>
|
||||||
@@ -170,109 +112,58 @@
|
|||||||
<view class="fixedview_onetow">
|
<view class="fixedview_onetow">
|
||||||
<text>¥</text>{{listinfo.amount}}
|
<text>¥</text>{{listinfo.amount}}
|
||||||
</view>
|
</view>
|
||||||
<view class="fixedview_onethere" v-if="emitorderfoodform.couponsPrice">
|
|
||||||
以优惠¥{{emitorderfoodform.couponsPrice}}
|
|
||||||
</view>
|
</view>
|
||||||
</view>
|
<view class="fixedview_tow" @tap="$u.debounce(showpopupclick,1000)">
|
||||||
<!-- <view class="fixedview_tow" @tap="showpopupclickdd"> -->
|
|
||||||
<view class="fixedview_tow" @tap="$u.debounce(showpopupclickdd, 500)">
|
|
||||||
立即付款
|
立即付款
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<!-- 支付密码 -->
|
|
||||||
<payPassword ref="payPwd" @accountPayevent="accountPayevent" v-if="ispws"></payPassword>
|
|
||||||
</view>
|
</view>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import webSocketUtils from '@/common/js/websocket.js'
|
import webSocketUtils from '@/common/js/websocket.js'
|
||||||
import payPassword from '@/components/payPassword.vue'
|
|
||||||
export default {
|
export default {
|
||||||
components: {
|
|
||||||
payPassword
|
|
||||||
},
|
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
height: '',
|
height: '',
|
||||||
pay_type: 1,
|
pay_type: 1,
|
||||||
remark: '',
|
info: {},
|
||||||
listinfoid: '',
|
listinfo: {}
|
||||||
listinfo: {
|
|
||||||
detailList: [],
|
|
||||||
amount: '',
|
|
||||||
amounts: ''
|
|
||||||
},
|
|
||||||
emitorderfoodform: {
|
|
||||||
clickiconone: ''
|
|
||||||
},
|
|
||||||
amountVIP: null,
|
|
||||||
radiovalue1: '1',
|
|
||||||
orderInfo: '',
|
|
||||||
// 可用优惠券数据
|
|
||||||
couponAmount: 0,
|
|
||||||
// 输入支付密码 123
|
|
||||||
ispws: false,
|
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
|
|
||||||
onUnload() {
|
// onUnload() {
|
||||||
uni.$off('getMessage')
|
// uni.$off('createOrdermessage')
|
||||||
this.ispws = false
|
// },
|
||||||
},
|
|
||||||
onLoad(e) {
|
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() {
|
onShow() {
|
||||||
// 获取余额
|
// uni.$on('createOrdermessage', res => {
|
||||||
this.getAount()
|
// console.log(1111111)
|
||||||
|
// console.log(res)
|
||||||
|
// this.listinfo = res
|
||||||
|
// })
|
||||||
},
|
},
|
||||||
methods: {
|
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') {
|
async ordercreatOrder() {
|
||||||
this.listinfoid = msg.data.id //下单需要的id
|
let res = await this.api.ordercreatOrder({
|
||||||
this.orderInfo = msg.data
|
tableId: this.info.tableId,
|
||||||
if (this.radiovalue1 == 1) {
|
shopId: this.info.shopId,
|
||||||
// this.showpopupclickdds() //微信支付
|
userId: this.info.userId
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
},
|
|
||||||
orderfoodindex() { //优惠劵
|
|
||||||
uni.pro.navigateTo('index/coupons/index', {
|
|
||||||
orderfood: 0,
|
|
||||||
orderId: this.listinfo.id,
|
|
||||||
amount: this.listinfo.amounts
|
|
||||||
})
|
})
|
||||||
|
this.listinfo = res.data
|
||||||
},
|
},
|
||||||
copyHandle(e) {
|
copyHandle(e) {
|
||||||
uni.setClipboardData({
|
uni.setClipboardData({
|
||||||
@@ -285,42 +176,22 @@
|
|||||||
}
|
}
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
async paymodfiyOrderInfo() { //支付完成后请求
|
async paymodfiyOrderInfo() {
|
||||||
let res = await this.api.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
|
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) {
|
if (res.code == 0) {
|
||||||
uni.showLoading({
|
uni.showLoading({
|
||||||
@@ -328,107 +199,49 @@
|
|||||||
mask: true
|
mask: true
|
||||||
})
|
})
|
||||||
// #ifdef MP-WEIXIN
|
// #ifdef MP-WEIXIN
|
||||||
// 微信支付还是余额支付
|
|
||||||
uni.requestPayment({
|
uni.requestPayment({
|
||||||
provider: 'wxpay', //支付类型-固定值
|
provider: 'wxpay', //支付类型-固定值
|
||||||
partnerid: res.data.appId, // 微信支付商户号
|
partnerid: res.data.payAppId, // 微信支付商户号
|
||||||
timeStamp: res.data.timeStamp, // 时间戳(单位:秒)
|
timeStamp: res.data.payTimeStamp, // 时间戳(单位:秒)
|
||||||
nonceStr: res.data.nonceStr, // 随机字符串
|
nonceStr: res.data.paynonceStr, // 随机字符串
|
||||||
package: res.data.package, // 固定值
|
package: res.data.payPackage, // 固定值
|
||||||
signType: res.data.signType, //固定值
|
signType: res.data.paySignType, //固定值
|
||||||
paySign: res.data.paySign, //签名
|
paySign: res.data.paySign, //签名
|
||||||
success: (res) => {
|
success: (res) => {
|
||||||
let _this = this
|
|
||||||
uni.requestSubscribeMessage({
|
|
||||||
tmplIds: ['z0fUG7-jhSfYCrw6poOvSRzh4_hgnPkm_5C7E5s5bCQ'],
|
|
||||||
complete() {
|
|
||||||
uni.showToast({
|
uni.showToast({
|
||||||
title: "支付成功"
|
title: "支付成功"
|
||||||
})
|
})
|
||||||
// uni.cache.set('shopUser', '') //删除shopUser
|
setTimeout(res => {
|
||||||
_this.paymodfiyOrderInfo()
|
|
||||||
uni.redirectTo({
|
uni.redirectTo({
|
||||||
url: '/pages/order/order_detail?orderId=' +
|
url: '/pages/order/order_detail?orderId=' + this
|
||||||
_this
|
|
||||||
.listinfo.id
|
.listinfo.id
|
||||||
});
|
});
|
||||||
|
}, 1000)
|
||||||
|
this.paymodfiyOrderInfo()
|
||||||
|
// uni.redirectTo({
|
||||||
|
// url: "/pages/mall/order/ordersuccess?id=" + datareslane.data
|
||||||
|
// .order_id,
|
||||||
|
// });
|
||||||
},
|
},
|
||||||
|
fail: (err) => {
|
||||||
|
setTimeout(res => {
|
||||||
|
uni.showToast({
|
||||||
|
icon: 'none',
|
||||||
|
title: '支付失败'
|
||||||
})
|
})
|
||||||
},
|
|
||||||
fail: () => {
|
|
||||||
uni.hideLoading()
|
uni.hideLoading()
|
||||||
|
}, 2000)
|
||||||
|
uni.redirectTo({
|
||||||
|
url: '/pages/order/order_detail?orderId=' + this.listinfo.id
|
||||||
|
});
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
// #endif
|
// #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) {
|
clickselect(b) {
|
||||||
this.pay_type = b
|
this.pay_type = b
|
||||||
},
|
},
|
||||||
|
|
||||||
},
|
},
|
||||||
mounted() {
|
mounted() {
|
||||||
//#ifdef MP-WEIXIN || H5
|
//#ifdef MP-WEIXIN || H5
|
||||||
@@ -437,6 +250,11 @@
|
|||||||
var that = this;
|
var that = this;
|
||||||
that.height = (ele.height) + "px";
|
that.height = (ele.height) + "px";
|
||||||
that = null;
|
that = null;
|
||||||
|
// uni.getSystemInfo({
|
||||||
|
// success(res) {
|
||||||
|
|
||||||
|
// }
|
||||||
|
// })
|
||||||
}).exec();
|
}).exec();
|
||||||
//#endif
|
//#endif
|
||||||
//#ifdef MP-ALIPAY
|
//#ifdef MP-ALIPAY
|
||||||
@@ -460,7 +278,7 @@
|
|||||||
background-color: #fff;
|
background-color: #fff;
|
||||||
border-radius: 20upx;
|
border-radius: 20upx;
|
||||||
padding: 28upx;
|
padding: 28upx;
|
||||||
margin-bottom: 48rpx;
|
margin-bottom: 28upx;
|
||||||
|
|
||||||
.head {
|
.head {
|
||||||
display: flex;
|
display: flex;
|
||||||
@@ -576,10 +394,6 @@
|
|||||||
.sixcontentone {
|
.sixcontentone {
|
||||||
padding-bottom: 28rpx;
|
padding-bottom: 28rpx;
|
||||||
border-bottom: 1px solid #F7F7F7;
|
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 {
|
.sixcontent_one {
|
||||||
font-size: 28rpx;
|
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 {
|
.fixedview {
|
||||||
position: fixed;
|
position: fixed;
|
||||||
bottom: 0;
|
bottom: 0;
|
||||||
left: 0;
|
left: 0;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
height: 180rpx;
|
|
||||||
padding: 16rpx 34rpx;
|
|
||||||
|
|
||||||
.flex-between {
|
.flex-between {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
padding: 24rpx 28rpx;
|
padding: 24rpx 28rpx;
|
||||||
background: #FFFFFF;
|
background: #FFFFFF;
|
||||||
flex-wrap: nowrap;
|
|
||||||
|
|
||||||
.fixedview_one {
|
.fixedview_one {
|
||||||
.fixedview_oneone {
|
.fixedview_oneone {
|
||||||
@@ -694,13 +456,6 @@
|
|||||||
font-size: 28rpx;
|
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 {
|
.fixedview_tow {
|
||||||
|
|||||||
@@ -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>
|
|
||||||
@@ -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>
|
|
||||||
@@ -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
@@ -1,22 +1,16 @@
|
|||||||
<template>
|
<template>
|
||||||
<view id="wrapper">
|
<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 }"
|
<view class="nav-wrap" :class="{ 'is-fixed': isFixed }"
|
||||||
:style="{ paddingTop: `${menuInfo.top}px`, paddingBottom: `${paddingBtmSize}px` }">
|
:style="{ paddingTop: `${menuInfo.top}px`, paddingBottom: `${paddingBtmSize}px` }">
|
||||||
<view class="content" :style="{ height: `${menuInfo.height}px`, paddingLeft: `${paddingBtmSize}px` }">
|
<view class="content" :style="{ height: `${menuInfo.height}px`, paddingLeft: `${paddingBtmSize}px` }">
|
||||||
<view class="left-btn">
|
<view class="left-btn">
|
||||||
<view class="btn" :style="{ width: `${menuInfo.height}px`, height: `${menuInfo.height}px` }"
|
<view class="btn" :style="{ width: `${menuInfo.height}px`, height: `${menuInfo.height}px` }"
|
||||||
@click="navClickHandle(1)">
|
@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>
|
||||||
<view class="btn" :style="{ width: `${menuInfo.height}px`, height: `${menuInfo.height}px` }"
|
<view class="btn" :style="{ width: `${menuInfo.height}px`, height: `${menuInfo.height}px` }"
|
||||||
@click="navClickHandle(2)">
|
@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>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
@@ -65,22 +59,13 @@
|
|||||||
空
|
空
|
||||||
</view>
|
</view>
|
||||||
<view class="shop-item" v-for="(item1,index1) in item.products" :key="item1.id">
|
<view class="shop-item" v-for="(item1,index1) in item.products" :key="item1.id">
|
||||||
<view class="cover langcover" style="width:180rpx; height: 180rpx;"
|
<view class="cover" style="width:180rpx; height: 180rpx;">
|
||||||
@click.stop="clickspecifications(item1,index,index1)">
|
<c-image :src="item1.coverImg" width="180" height="180"></c-image>
|
||||||
<!-- <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>
|
</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">
|
<view class="name">
|
||||||
{{ item1.name }}
|
{{ item1.name }}
|
||||||
</view>
|
</view>
|
||||||
<view class="namess" v-if="item1.suit>1">
|
|
||||||
起售:{{ item1.suit }}
|
|
||||||
</view>
|
|
||||||
<view class="price-wrap">
|
<view class="price-wrap">
|
||||||
<view class="price">
|
<view class="price">
|
||||||
<text class="i">¥</text>
|
<text class="i">¥</text>
|
||||||
@@ -88,19 +73,19 @@
|
|||||||
<text class="i">起</text>
|
<text class="i">起</text>
|
||||||
</view>
|
</view>
|
||||||
<view class="sku-wrap" v-if="item1.productSkuResult != null"
|
<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="t">选规格</text>
|
||||||
<text class="dot num" v-if="item1.cartNumber != '0'">{{item1.cartNumber}}</text>
|
<text class="dot num" v-if="item1.cartNumber != '0'">{{item1.cartNumber}}</text>
|
||||||
</view>
|
</view>
|
||||||
<view class="operation-wrap" v-else>
|
<view class="operation-wrap" v-else>
|
||||||
<view class="btn" v-if="item1.cartNumber != '0'"
|
<view class="btn" v-if="item1.cartNumber != '0'"
|
||||||
@click.stop="cartadd(item1,index,index1,'-',item1.productSkuResult == null ? '单规格':'')">
|
@click="cartadd(item1,index,index1,'-',item1.cartNumber,item1.productSkuResult == null ? '单规格':'')">
|
||||||
<u-icon :name="require('@/static/icon_sub.png')" size="36"></u-icon>
|
<u-icon :name="require('@/static/icon_sub.png')" size="34"></u-icon>
|
||||||
</view>
|
</view>
|
||||||
<text class="num">{{ item1.cartNumber }}</text>
|
<text class="num">{{ item1.cartNumber }}</text>
|
||||||
<view class="btn"
|
<view class="btn"
|
||||||
@click.stop="cartadd(item1,index,index1,'+',item1.productSkuResult == null ? '单规格':'')">
|
@click="cartadd(item1,index,index1,'+',item1.cartNumber,item1.productSkuResult == null ? '单规格':'')">
|
||||||
<u-icon :name="require('@/static/icon_add.png')" size="36"></u-icon>
|
<u-icon :name="require('@/static/icon_add.png')" size="34"></u-icon>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
@@ -110,24 +95,23 @@
|
|||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="cart-wrap" v-if="cartListsdatashow">
|
<view class="cart-wrap">
|
||||||
<view class="cart-content">
|
<view class="cart-content">
|
||||||
<view class="left">
|
<view class="left">
|
||||||
<image class="icon" src="https://czg-qr-order.oss-cn-beijing.aliyuncs.com/drder/icon_cart.png"
|
<image class="icon" src="../../static/icon_cart.png" mode="aspectFit" @click="showCart = !showCart">
|
||||||
mode="aspectFit" @click="showCart = !showCart">
|
|
||||||
</image>
|
</image>
|
||||||
<text class="i">¥</text>
|
<text class="i">¥</text>
|
||||||
<text class="num">{{cartLists.amount||'0.00'}}</text>
|
<text class="num">{{cartLists.amount}}</text>
|
||||||
</view>
|
</view>
|
||||||
<view class="btn" @tap="$u.debounce(orderdetail, 500)">
|
<view class="btn" @tap="$u.debounce(orderdetail, 500)">
|
||||||
<text class="t">提交订单</text>
|
<text class="t">去结算</text>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
<u-popup :show="showCart" :round="20" :zIndex="98" :overlayStyle="{ zIndex: 98 }" @close="showCart = false">
|
<u-popup :show="showCart" :round="20" :zIndex="98" :overlayStyle="{ zIndex: 98 }" @close="showCart = false">
|
||||||
<view class="cart-list-wrap">
|
<view class="cart-list-wrap">
|
||||||
<view class="cart-header">
|
<view class="cart-header" @click="cartclear">
|
||||||
<view class="clear" @click="cartclear">
|
<view class="clear">
|
||||||
<u-icon name="trash" color="#999"></u-icon>
|
<u-icon name="trash" color="#999"></u-icon>
|
||||||
<text class="t">清空购物车</text>
|
<text class="t">清空购物车</text>
|
||||||
</view>
|
</view>
|
||||||
@@ -177,7 +161,7 @@
|
|||||||
<view class="col">
|
<view class="col">
|
||||||
<text class="t">{{ shopList.storeInfo.businessTime }}</text>
|
<text class="t">{{ shopList.storeInfo.businessTime }}</text>
|
||||||
</view>
|
</view>
|
||||||
<view class="col" @click="makePhoneCall(shopList.storeInfo.phone)">
|
<view class="col">
|
||||||
<text class="t">{{ shopList.storeInfo.phone }}</text>
|
<text class="t">{{ shopList.storeInfo.phone }}</text>
|
||||||
</view>
|
</view>
|
||||||
<view class="col">
|
<view class="col">
|
||||||
@@ -193,17 +177,12 @@
|
|||||||
<u-popup :show="showShopsku" :round="20" mode="center" @close="showShopsku = false"
|
<u-popup :show="showShopsku" :round="20" mode="center" @close="showShopsku = false"
|
||||||
:safeAreaInsetBottom='false'>
|
:safeAreaInsetBottom='false'>
|
||||||
<view class="shop_sku">
|
<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">
|
<view class="shop_sku_name">
|
||||||
{{specifications.name}}
|
{{specifications.name}}
|
||||||
</view>
|
</view>
|
||||||
<view class="shop_sku_box" v-for="(item,index) in specifications.tagSnap" :key="index"
|
<view class="shop_sku_box" v-for="(item,index) in specifications.tagSnap" :key="index">
|
||||||
v-if="specifications.tagSnap">
|
|
||||||
<view class="shop_sku_box_name">
|
<view class="shop_sku_box_name">
|
||||||
{{item.name}}
|
<!-- 温度 -->{{item.name}}
|
||||||
</view>
|
</view>
|
||||||
<view class="flex-start">
|
<view class="flex-start">
|
||||||
<view class="shop_sku_box_item" v-for="(item1,index1) in item.children" :key="index1"
|
<view class="shop_sku_box_item" v-for="(item1,index1) in item.children" :key="index1"
|
||||||
@@ -213,7 +192,7 @@
|
|||||||
</view>
|
</view>
|
||||||
</view>
|
</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 class="shop_skuselectname">{{skuidname.toString()}}</view>
|
||||||
</view>
|
</view>
|
||||||
<view class="shop_bottom flex-between">
|
<view class="shop_bottom flex-between">
|
||||||
@@ -224,41 +203,29 @@
|
|||||||
</view>
|
</view>
|
||||||
<view class="operation-wrap">
|
<view class="operation-wrap">
|
||||||
<view class="btn"
|
<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>
|
<u-icon :name="require('@/static/icon_sub.png')" size="34"></u-icon>
|
||||||
</view>
|
</view>
|
||||||
<text class="num">{{amountcartNumber}}</text>
|
<text class="num">{{amountcartNumber}}</text>
|
||||||
<view class="btn"
|
<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>
|
<u-icon :name="require('@/static/icon_add.png')" size="34"></u-icon>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</u-popup>
|
</u-popup>
|
||||||
<l-barrage ref="lBarrage" @end="onEnd" :minTop='8' :maxTop='20' :avatar='barrageavatar'></l-barrage>
|
|
||||||
</view>
|
</view>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import _ from 'lodash';
|
import _ from 'lodash';
|
||||||
import webSocketUtils from '@/common/js/websocket.js';
|
import navbar from '../../uni_modules/uview-ui/libs/config/props/navbar';
|
||||||
import orderdetail from '@/pages/order_detail/index';
|
import webSocketUtils from '@/common/js/websocket.js'
|
||||||
import lBarrage from '@/components/l-barrage/l-barrage.vue'
|
|
||||||
export default {
|
export default {
|
||||||
components: {
|
|
||||||
orderdetail,
|
|
||||||
lBarrage
|
|
||||||
},
|
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
userInfo: uni.cache.get('userInfo'), //个人信息
|
|
||||||
// #ifndef MP-WEIXIN
|
|
||||||
menuInfo: uni.getSystemInfo(),
|
|
||||||
// #endif
|
|
||||||
// #ifdef MP-WEIXIN
|
|
||||||
menuInfo: uni.getMenuButtonBoundingClientRect(),
|
menuInfo: uni.getMenuButtonBoundingClientRect(),
|
||||||
// #endif
|
|
||||||
paddingBtmSize: 6,
|
paddingBtmSize: 6,
|
||||||
tabHeadHeight: 50,
|
tabHeadHeight: 50,
|
||||||
isFixed: false,
|
isFixed: false,
|
||||||
@@ -272,18 +239,11 @@
|
|||||||
tableCode: '', //code,
|
tableCode: '', //code,
|
||||||
specifications: {},
|
specifications: {},
|
||||||
skuidname: [],
|
skuidname: [],
|
||||||
cartLists: {}, //购物车
|
cartLists: {},
|
||||||
orderdetailcartLists: {}, //提交订单
|
|
||||||
socketTicket: null,
|
socketTicket: null,
|
||||||
amountcartNumber: 0,
|
amountcartNumber: 0,
|
||||||
skuidsearch: '', //
|
skuidsearch: '', //
|
||||||
salePrice: '', //钱数
|
salePrice: '' //钱数
|
||||||
fixedtrue: true,
|
|
||||||
datasocket: {}, //储存传参数据
|
|
||||||
radiovalue: '1', //选择支付方式
|
|
||||||
amountVIP: null, //余额
|
|
||||||
barrageavatar: '', //弹幕头像
|
|
||||||
cartListsdatashow: false //是否显示购物车
|
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
onPageScroll(e) {
|
onPageScroll(e) {
|
||||||
@@ -303,86 +263,26 @@
|
|||||||
this.countScrollTitle(e.scrollTop);
|
this.countScrollTitle(e.scrollTop);
|
||||||
},
|
},
|
||||||
onLoad(e) {
|
onLoad(e) {
|
||||||
|
uni.$on('message', this.getMessage)
|
||||||
|
// this.tableCode = e.tableCode
|
||||||
|
// this.scanCodehandle(e.tableCode)
|
||||||
if (e.q) {
|
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)
|
uni.cache.set('tableCode', this.tableCode)
|
||||||
|
this.handlemessage()
|
||||||
}
|
}
|
||||||
uni.cache.set('types', 'types');
|
|
||||||
this.$nextTick(() => {
|
this.$nextTick(() => {
|
||||||
this.countTitleTopNum(); //导航栏
|
this.countTitleTopNum();
|
||||||
});
|
});
|
||||||
},
|
},
|
||||||
onUnload() {
|
onUnload() {
|
||||||
this.socketTicket.Close()
|
this.socketTicket.Close()
|
||||||
uni.$off('message')
|
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: {
|
methods: {
|
||||||
onEnd() { //回调弹幕
|
getMessage(msg) {
|
||||||
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 数据
|
|
||||||
} 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') {
|
if (msg.status != 'success') {
|
||||||
uni.showToast({
|
uni.showToast({
|
||||||
title: msg.msg,
|
title: msg.msg,
|
||||||
@@ -396,77 +296,69 @@
|
|||||||
}
|
}
|
||||||
} else {
|
} else {
|
||||||
switch (msg.type) {
|
switch (msg.type) {
|
||||||
case 'sku': // sku 数量 查询这个商品的价格和数量
|
case 'sku': // sku 数量
|
||||||
this.$set(this, 'amountcartNumber', msg.amount)
|
this.$set(this, 'amountcartNumber', msg.amount)
|
||||||
this.productqueryProduct() //list 数据
|
this.productqueryProduct() //list 数据
|
||||||
break;
|
break;
|
||||||
case 'clearCart':
|
case 'clearCart':
|
||||||
this.cartLists = msg
|
console.log('clearCart')
|
||||||
this.productqueryProduct() //list 数据
|
this.specifications.duoguge = ''
|
||||||
this.skuidname = []
|
this.skuidname = []
|
||||||
this.showCart = false
|
this.showCart = false
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
uni.showToast({
|
uni.showToast({
|
||||||
title: msg.msg,
|
title: '清空购物车成功',
|
||||||
icon: "none",
|
icon: "none",
|
||||||
})
|
})
|
||||||
}, 500)
|
}, 1000)
|
||||||
|
this.cartLists = msg
|
||||||
|
this.productqueryProduct() //list 数据
|
||||||
break;
|
break;
|
||||||
case 'order':
|
case 'order':
|
||||||
|
console.log('clearCart')
|
||||||
|
this.specifications.duoguge = ''
|
||||||
this.skuidname = []
|
this.skuidname = []
|
||||||
this.showCart = false
|
this.showCart = false
|
||||||
this.cartLists = msg
|
this.cartLists = msg
|
||||||
this.productqueryProduct() //list 数据
|
this.productqueryProduct() //list 数据
|
||||||
break;
|
break;
|
||||||
case 'addCart': //初始化add
|
case 'createOrder': //去结算
|
||||||
this.cartLists = msg
|
// uni.$emit('createOrdermessage', msg.data)
|
||||||
this.productqueryProduct() //list 数据
|
let item = JSON.stringify(msg.data)
|
||||||
|
uni.redirectTo({
|
||||||
|
url: '/pages/order_detail/order_detail?tableId=' + item
|
||||||
|
});
|
||||||
break;
|
break;
|
||||||
case 'addcart':
|
case 'addcart':
|
||||||
|
console.log('addcart', 315)
|
||||||
this.cartLists = msg
|
this.cartLists = msg
|
||||||
console.log(msg, 1111)
|
|
||||||
this.productqueryProduct() //list 数据
|
|
||||||
try {
|
|
||||||
if (msg.data.length != 0) {
|
if (msg.data.length != 0) {
|
||||||
let nums = 0
|
|
||||||
msg.data.forEach((item, index, arr) => { //初始化skuidname的数据 选择第一个
|
msg.data.forEach((item, index, arr) => { //初始化skuidname的数据 选择第一个
|
||||||
|
console.log(item.skuId, 111111, this.skuidsearch)
|
||||||
if (item.skuId == this.skuidsearch) {
|
if (item.skuId == this.skuidsearch) {
|
||||||
nums = item.number
|
this.$set(this, 'amountcartNumber', item.number)
|
||||||
}
|
|
||||||
})
|
|
||||||
this.$set(this, 'amountcartNumber', nums)
|
|
||||||
} else {
|
} else {
|
||||||
this.$set(this, 'amountcartNumber', 0)
|
this.$set(this, 'amountcartNumber', 0)
|
||||||
}
|
}
|
||||||
} catch (e) {
|
})
|
||||||
//TODO handle the exception
|
} else {
|
||||||
}
|
this.$set(this, 'amountcartNumber', 0)
|
||||||
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
|
|
||||||
}
|
}
|
||||||
|
this.productqueryProduct() //list 数据
|
||||||
break;
|
break;
|
||||||
|
default:
|
||||||
|
console.log('default', 320)
|
||||||
|
this.cartLists = msg
|
||||||
|
this.productqueryProduct() //list 数据
|
||||||
}
|
}
|
||||||
console.log(this.cartLists.data, 1111111)
|
|
||||||
this.cartListsdatashow = this.cartLists.data.length == 0 ? false : true
|
|
||||||
}
|
|
||||||
} catch (e) {
|
|
||||||
//TODO handle the exception
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
handlemessage() {
|
handlemessage() {
|
||||||
this.socketTicket ? this.socketTicket.Close() : null //调用前先判断是否有socket正在进行 先关闭后链接
|
this.socketTicket ? this.socketTicket.Close() : null //调用前先判断是否有socket正在进行 先关闭后链接
|
||||||
this.socketTicket = new webSocketUtils(`${uni.conf.baseUrlwws}`, 5000, {
|
this.socketTicket = new webSocketUtils(
|
||||||
tableId: uni.cache.get('tableCode'),
|
`${uni.conf.baseUrlwws}/websocket/table/${this.tableCode}/${uni.cache.get('shopUser').shopId}/${uni.cache.get('userInfo').id}`,
|
||||||
shopId: uni.cache.get('shopUser'),
|
5000)
|
||||||
userId: uni.cache.get('userInfo').id,
|
|
||||||
"type": "connect",
|
|
||||||
})
|
|
||||||
},
|
},
|
||||||
// 数据处理
|
// 数据处理
|
||||||
socketSendMsg(data) {
|
socketSendMsg(data) {
|
||||||
@@ -474,6 +366,48 @@
|
|||||||
this.socketTicket.send(data);
|
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) { //解码
|
getQueryString(url, name) { //解码
|
||||||
var reg = new RegExp('(^|&|/?)' + name + '=([^&|/?]*)(&|/?|$)', 'i')
|
var reg = new RegExp('(^|&|/?)' + name + '=([^&|/?]*)(&|/?|$)', 'i')
|
||||||
var r = url.substr(1).match(reg)
|
var r = url.substr(1).match(reg)
|
||||||
@@ -482,32 +416,34 @@
|
|||||||
}
|
}
|
||||||
return null;
|
return null;
|
||||||
},
|
},
|
||||||
async cartadd(item, index, index1, a, b) { //列表添加 a传参加减号 b是判断单规格多规格
|
async cartadd(item, index, index1, a, b, guge) { //列表添加
|
||||||
if (b == '单规格') { //没有规格为空
|
console.log(item, index, index1, a, b, guge)
|
||||||
|
if (guge == '单规格') { //没有规格为空
|
||||||
|
this.specifications.duoguge = ''
|
||||||
this.skuidname = []
|
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 {
|
try {
|
||||||
const data = { //定义socket数据传参
|
const data = { //定义socket数据传参
|
||||||
"name": item.name,
|
|
||||||
"skuId": item.skuId,
|
"skuId": item.skuId,
|
||||||
"num": a == '-' ? -1 : 1, //skuId
|
"num": a == '-' ? -1 : 1, //skuId
|
||||||
"type": "addcart", //“addcart:添加购物车,create0rder:生成订单,clearCart:清空购物车”,
|
"type": "addcart", //“addcart:添加购物车,create0rder:生成订单,clearCart:清空购物车”,
|
||||||
"productId": item.productId, //商品id
|
"productId": item.id, //商品id
|
||||||
"shopId": uni.cache.get('shopUser'),
|
"shopId": uni.cache.get('shopUser').shopId,
|
||||||
"userId": uni.cache.get('userInfo').id
|
"userId": uni.cache.get('userInfo').id
|
||||||
};
|
};
|
||||||
this.datasocket = data
|
|
||||||
uni.$u.debounce(this.socketSendMsg(data), 500)
|
uni.$u.debounce(this.socketSendMsg(data), 500)
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
//TODO handle the exception
|
//TODO handle the exception
|
||||||
}
|
}
|
||||||
|
|
||||||
},
|
},
|
||||||
async productqueryProduct() { //list 数据
|
async productqueryProduct() { //list 数据
|
||||||
let res = await this.api.productqueryProduct({
|
let res = await this.api.productqueryProduct({
|
||||||
code: uni.cache.get('tableCode'),
|
code: this.tableCode,
|
||||||
productGroupId: ''
|
productGroupId: ''
|
||||||
})
|
})
|
||||||
if (res.code == 0) {
|
if (res.code == 0) {
|
||||||
@@ -517,20 +453,23 @@
|
|||||||
});
|
});
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
clickspecifications(item1, index, index1) {
|
clickspecifications(e, a, b, d) {
|
||||||
|
console.log(e, a, b)
|
||||||
this.skuidname = []
|
this.skuidname = []
|
||||||
this.specifications = item1
|
this.specifications = e
|
||||||
this.specifications.indexa = index
|
this.specifications.indexa = a
|
||||||
this.specifications.indexb = index1
|
this.specifications.indexb = b
|
||||||
try {
|
this.specifications.duoguge = 'duoguge'
|
||||||
if (item1.productSkuResult == null) {
|
if (e.productSkuResult.tagSnap == null) {
|
||||||
// 但但单个规格弹框的处理
|
uni.showToast({
|
||||||
this.hodgepodge(this.specifications, 2) //获取skuid /2查找价格和数量
|
title: '暂无规格',
|
||||||
} else {
|
icon: "none",
|
||||||
// 多规格数据处理
|
})
|
||||||
this.specifications.tagSnap = JSON.parse(item1.productSkuResult.tagSnap).map((item) => {
|
return false
|
||||||
|
}
|
||||||
|
this.specifications.tagSnap = JSON.parse(e.productSkuResult.tagSnap).map((item) => {
|
||||||
let res = {
|
let res = {
|
||||||
id: item1.id, //商品id
|
id: e.id, //商品id
|
||||||
name: item.name,
|
name: item.name,
|
||||||
start: 0,
|
start: 0,
|
||||||
children: item.value.split(",")
|
children: item.value.split(",")
|
||||||
@@ -540,22 +479,24 @@
|
|||||||
this.specifications.tagSnap.forEach((val, index, arr) => { //初始化skuidname的数据 选择第一个
|
this.specifications.tagSnap.forEach((val, index, arr) => { //初始化skuidname的数据 选择第一个
|
||||||
this.skuidname.push(val.children[0])
|
this.skuidname.push(val.children[0])
|
||||||
})
|
})
|
||||||
this.hodgepodge(this.specifications.tagSnap[0], 2) //获取skuid /2查找价格和数量
|
try {
|
||||||
}
|
this.hodgepodge(this.specifications.tagSnap[0], 2)
|
||||||
|
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
//TODO handle the exception
|
//TODO handle the exception
|
||||||
}
|
}
|
||||||
|
if (d != '更新数据') {
|
||||||
|
this.showShopsku = true
|
||||||
|
}
|
||||||
},
|
},
|
||||||
async morloe(e, index, index1, item) {
|
async morloe(e, index, index1, item) {
|
||||||
this.specifications.tagSnap[index]['start'] = index1
|
this.specifications.tagSnap[index]['start'] = index1
|
||||||
this.skuidname.splice(index, 1, e) //替换skuidname的数据
|
this.skuidname.splice(index, 1, e) //替换skuidname的数据
|
||||||
this.hodgepodge(item, 2)
|
this.hodgepodge(item, 2)
|
||||||
},
|
},
|
||||||
async hodgepodge(item, a, c) { //此接口去获取商品id !!!赋值库存 数量 价格等
|
async hodgepodge(item, a, c) { //去获取商品id 库存等
|
||||||
try {
|
try {
|
||||||
let res = await this.api.productqueryProductSku({
|
let res = await this.api.productqueryProductSku({
|
||||||
shopId: uni.cache.get('shopUser'),
|
shopId: uni.cache.get('shopUser').shopId,
|
||||||
productId: item.id, //商品id
|
productId: item.id, //商品id
|
||||||
spec_tag: this.skuidname.join(",")
|
spec_tag: this.skuidname.join(",")
|
||||||
})
|
})
|
||||||
@@ -566,84 +507,69 @@
|
|||||||
})
|
})
|
||||||
} else {
|
} else {
|
||||||
this.skuidsearch = res.data.id // 储存skuid 用于筛选数量
|
this.skuidsearch = res.data.id // 储存skuid 用于筛选数量
|
||||||
this.salePrice = res.data.salePrice // 价格
|
this.salePrice = res.data.salePrice // 储存skuid 用于筛选数量
|
||||||
let data = null
|
let data = null
|
||||||
if (a == 1) { //1添加购物车 2是websocket返回这个商品的价格(应为不同的多规格商品返回不同的价格)
|
if (a == 1) {
|
||||||
data = { //定义socket数据传参
|
data = { //定义socket数据传参
|
||||||
"nickName": this.userInfo.nickName,
|
|
||||||
"barrageavatar": this.userInfo.headImg,
|
|
||||||
'name': item.name,
|
|
||||||
"skuId": res.data.id,
|
"skuId": res.data.id,
|
||||||
"num": c == '-' ? -1 : 1, //数量
|
"num": c == '-' ? -1 : 1, //数量
|
||||||
"type": "addcart", //“addcart:添加购物车,create0rder:生成订单,clearCart:庆康购物车”,
|
"type": "addcart", //“addcart:添加购物车,create0rder:生成订单,clearCart:庆康购物车”,
|
||||||
"productId": item.id, //商品id
|
"productId": item.id, //商品id
|
||||||
"shopId": uni.cache.get('shopUser'),
|
"shopId": uni.cache.get('shopUser').shopId,
|
||||||
"userId": uni.cache.get('userInfo').id
|
"userId": uni.cache.get('userInfo').id
|
||||||
};
|
};
|
||||||
} else {
|
} else {
|
||||||
data = { //查询这个商品的价格
|
data = { //定义socket数据传参
|
||||||
"name": item.name,
|
|
||||||
"skuId": res.data.id,
|
"skuId": res.data.id,
|
||||||
"num": '', //数量
|
"num": '', //数量
|
||||||
"type": "sku", //“addcart:添加购物车,create0rder:生成订单,clearCart:庆康购物车”,
|
"type": "sku", //“addcart:添加购物车,create0rder:生成订单,clearCart:庆康购物车”,
|
||||||
"productId": item.id, //商品id
|
"productId": item.id, //商品id
|
||||||
"shopId": uni.cache.get('shopUser'),
|
"shopId": uni.cache.get('shopUser').shopId,
|
||||||
"userId": uni.cache.get('userInfo').id
|
"userId": uni.cache.get('userInfo').id
|
||||||
};
|
};
|
||||||
this.showShopsku = true //打开弹框
|
|
||||||
}
|
}
|
||||||
this.datasocket = data
|
|
||||||
uni.$u.debounce(this.socketSendMsg(data), 500)
|
uni.$u.debounce(this.socketSendMsg(data), 500)
|
||||||
}
|
}
|
||||||
} catch (e) {}
|
} catch (e) {
|
||||||
},
|
|
||||||
orderdetail() { // 直接生成订单
|
|
||||||
if (this.cartLists.data.length == 0) {
|
|
||||||
uni.showToast({
|
uni.showToast({
|
||||||
title: '请先添加商品',
|
title: '获取失败',
|
||||||
icon: 'none'
|
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 {
|
try {
|
||||||
const data = { //定义socket数据传参
|
const data = { //定义socket数据传参
|
||||||
"skuId": '',
|
"skuId": '',
|
||||||
"num": '', //skuId
|
"num": '', //skuId
|
||||||
"type": "clearCart", //“addcart:添加购物车,create0rder:生成订单,clearCart:清空购物车”,
|
"type": "clearCart", //“addcart:添加购物车,create0rder:生成订单,clearCart:清空购物车”,
|
||||||
"productId": '', //商品id
|
"productId": '', //商品id
|
||||||
"shopId": uni.cache.get('shopUser'),
|
"shopId": uni.cache.get('shopUser').shopId,
|
||||||
"userId": uni.cache.get('userInfo').id
|
"userId": uni.cache.get('userInfo').id
|
||||||
};
|
};
|
||||||
this.datasocket = data
|
|
||||||
uni.$u.debounce(this.socketSendMsg(data), 500)
|
uni.$u.debounce(this.socketSendMsg(data), 500)
|
||||||
} catch (e) {
|
} catch (e) {
|
||||||
//TODO handle the exception
|
//TODO handle the exception
|
||||||
}
|
}
|
||||||
|
|
||||||
},
|
},
|
||||||
// 导航栏点击
|
// 导航栏点击
|
||||||
navClickHandle(t) {
|
navClickHandle(t) {
|
||||||
switch (t) {
|
switch (t) {
|
||||||
case 1:
|
case 1:
|
||||||
// 返回
|
// 返回
|
||||||
this.socketTicket.Close()
|
|
||||||
uni.switchTab({
|
uni.switchTab({
|
||||||
url: '/pages/index/index'
|
url: '/pages/index/index'
|
||||||
})
|
})
|
||||||
@@ -656,12 +582,6 @@
|
|||||||
break;
|
break;
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
//打电话
|
|
||||||
makePhoneCall(phone) {
|
|
||||||
uni.makePhoneCall({
|
|
||||||
phoneNumber: phone //仅为示例
|
|
||||||
});
|
|
||||||
},
|
|
||||||
// 点击菜单商品滚动到指定为止
|
// 点击菜单商品滚动到指定为止
|
||||||
titleClickHandle(id) {
|
titleClickHandle(id) {
|
||||||
uni.createSelectorQuery()
|
uni.createSelectorQuery()
|
||||||
@@ -711,7 +631,7 @@
|
|||||||
.exec();
|
.exec();
|
||||||
}
|
}
|
||||||
this.titleTopNums = topNums;
|
this.titleTopNums = topNums;
|
||||||
},
|
}
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
@@ -741,7 +661,7 @@
|
|||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
// margin-right: $paddingSize;
|
margin-right: $paddingSize;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -797,7 +717,6 @@
|
|||||||
height: $h;
|
height: $h;
|
||||||
margin-top: -40upx;
|
margin-top: -40upx;
|
||||||
background: #999;
|
background: #999;
|
||||||
position: relative;
|
|
||||||
|
|
||||||
.img {
|
.img {
|
||||||
width: 100%;
|
width: 100%;
|
||||||
@@ -850,7 +769,6 @@
|
|||||||
.left-wrap {
|
.left-wrap {
|
||||||
width: $tabLeft;
|
width: $tabLeft;
|
||||||
background-color: $bg;
|
background-color: $bg;
|
||||||
padding: 0 0 $paddingSize * 3 + $cartH 0;
|
|
||||||
|
|
||||||
.left {
|
.left {
|
||||||
width: $tabLeft;
|
width: $tabLeft;
|
||||||
@@ -860,8 +778,7 @@
|
|||||||
height: $itemH;
|
height: $itemH;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
padding: 0 $paddingSize;
|
padding-left: $paddingSize;
|
||||||
justify-content: center;
|
|
||||||
|
|
||||||
&.active {
|
&.active {
|
||||||
background-color: #fff;
|
background-color: #fff;
|
||||||
@@ -894,25 +811,6 @@
|
|||||||
display: flex;
|
display: flex;
|
||||||
padding-bottom: $paddingSize;
|
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 {
|
.info {
|
||||||
flex: 1;
|
flex: 1;
|
||||||
padding-left: 20upx;
|
padding-left: 20upx;
|
||||||
@@ -923,13 +821,6 @@
|
|||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
}
|
}
|
||||||
|
|
||||||
.namess {
|
|
||||||
margin-top: 16rpx;
|
|
||||||
font-size: 24upx;
|
|
||||||
font-weight: 300;
|
|
||||||
color: #a5a5a5;
|
|
||||||
}
|
|
||||||
|
|
||||||
.select-sku-wrap {
|
.select-sku-wrap {
|
||||||
.t {
|
.t {
|
||||||
color: #999;
|
color: #999;
|
||||||
@@ -938,7 +829,7 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.price-wrap {
|
.price-wrap {
|
||||||
margin-top: 16rpx;
|
padding-top: $paddingSize;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
@@ -1004,23 +895,12 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.btn {
|
.btn {
|
||||||
position: relative;
|
|
||||||
padding: 6upx 10upx;
|
padding: 6upx 10upx;
|
||||||
background-color: $color-priamry;
|
background-color: $color-priamry;
|
||||||
border-radius: 12upx;
|
border-radius: 12upx;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: center;
|
justify-content: center;
|
||||||
|
|
||||||
&::after {
|
|
||||||
content: "";
|
|
||||||
position: absolute;
|
|
||||||
left: -10px;
|
|
||||||
top: -10px;
|
|
||||||
right: -10px;
|
|
||||||
bottom: -10px;
|
|
||||||
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
@@ -1031,7 +911,7 @@
|
|||||||
width: 100%;
|
width: 100%;
|
||||||
padding: $paddingSize;
|
padding: $paddingSize;
|
||||||
position: fixed;
|
position: fixed;
|
||||||
bottom: $paddingSize;
|
bottom: $paddingSize * 2;
|
||||||
left: 0;
|
left: 0;
|
||||||
z-index: 99;
|
z-index: 99;
|
||||||
|
|
||||||
@@ -1088,7 +968,7 @@
|
|||||||
.cart-list-wrap {
|
.cart-list-wrap {
|
||||||
.cart-header {
|
.cart-header {
|
||||||
display: flex;
|
display: flex;
|
||||||
justify-content: space-between;
|
justify-content: flex-end;
|
||||||
background-color: #f4eddf;
|
background-color: #f4eddf;
|
||||||
padding: 20upx $paddingSize;
|
padding: 20upx $paddingSize;
|
||||||
border-radius: 20upx 20upx 0 0;
|
border-radius: 20upx 20upx 0 0;
|
||||||
@@ -1115,23 +995,10 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.shop_sku {
|
.shop_sku {
|
||||||
position: relative;
|
|
||||||
width: 700rpx;
|
width: 700rpx;
|
||||||
border-radius: 20rpx;
|
border-radius: 20rpx;
|
||||||
background: #fff;
|
background: #fff;
|
||||||
|
|
||||||
.positionabsolute {
|
|
||||||
position: absolute;
|
|
||||||
top: 10rpx;
|
|
||||||
left: 10rpx;
|
|
||||||
}
|
|
||||||
|
|
||||||
.shop_skucimage {
|
|
||||||
width: 100%;
|
|
||||||
height: 440rpx;
|
|
||||||
border-radius: 20rpx 20rpx 0 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.shop_sku_name {
|
.shop_sku_name {
|
||||||
padding: 0 $paddingSize;
|
padding: 0 $paddingSize;
|
||||||
margin-top: 20rpx;
|
margin-top: 20rpx;
|
||||||
@@ -1225,106 +1092,12 @@
|
|||||||
}
|
}
|
||||||
|
|
||||||
.btn {
|
.btn {
|
||||||
position: relative;
|
padding: 6upx 10upx;
|
||||||
padding: 16upx 20upx;
|
|
||||||
background-color: $color-priamry;
|
background-color: $color-priamry;
|
||||||
border-radius: 12upx;
|
border-radius: 12upx;
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: 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;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -1,12 +1,12 @@
|
|||||||
<template>
|
<template>
|
||||||
<view class="container">
|
<view class="container">
|
||||||
<view class="header">
|
<view class="header">
|
||||||
<text class="t"></text>
|
<text class="t">{{shopUser.nickName}}</text>
|
||||||
</view>
|
</view>
|
||||||
<view class="code-wrap">
|
<view class="code-wrap">
|
||||||
<view class="num-wrap">
|
<view class="num-wrap">
|
||||||
<text class="t">账户余额:</text>
|
<text class="t">账户余额:</text>
|
||||||
<text class="num">{{shopInfo.amount || '--'}}</text>
|
<text class="num">{{shopUser.amount}}</text>
|
||||||
</view>
|
</view>
|
||||||
<view class="line-code">
|
<view class="line-code">
|
||||||
<tki-barcode ref="tkiBarcode" show :opations="tkiOptions"></tki-barcode>
|
<tki-barcode ref="tkiBarcode" show :opations="tkiOptions"></tki-barcode>
|
||||||
@@ -15,7 +15,7 @@
|
|||||||
<uqrcode ref="uqrcode" canvas-id="qrcode" :value="createcardNo"></uqrcode>
|
<uqrcode ref="uqrcode" canvas-id="qrcode" :value="createcardNo"></uqrcode>
|
||||||
</view>
|
</view>
|
||||||
<view class="name">
|
<view class="name">
|
||||||
<text>使用门店:{{shopInfo.shopName || '--'}}</text>
|
<text>使用门店:{{shopUser.name}}</text>
|
||||||
</view>
|
</view>
|
||||||
<view class="line"></view>
|
<view class="line"></view>
|
||||||
</view>
|
</view>
|
||||||
@@ -35,19 +35,17 @@
|
|||||||
fontSize: 28,
|
fontSize: 28,
|
||||||
textMargin: 14
|
textMargin: 14
|
||||||
},
|
},
|
||||||
createcardNo: '',
|
shopUser: {},
|
||||||
shopInfo: null
|
createcardNo: ''
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
onLoad(e) {
|
onLoad() {
|
||||||
this.shopInfo = JSON.parse(e.shopInfo)
|
this.shopUser = uni.cache.get('shopUser')
|
||||||
this.logincreateCardNo();
|
this.logincreateCardNo();
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
async logincreateCardNo() {
|
async logincreateCardNo() {
|
||||||
let res = await this.api.logincreateCardNo({
|
let res = await this.api.logincreateCardNo()
|
||||||
"shopId": this.shopInfo.shopId
|
|
||||||
})
|
|
||||||
if (res.code == 0) {
|
if (res.code == 0) {
|
||||||
this.createcardNo = res.data
|
this.createcardNo = res.data
|
||||||
this.$refs.tkiBarcode.setval(this.createcardNo)//操作属性
|
this.$refs.tkiBarcode.setval(this.createcardNo)//操作属性
|
||||||
|
|||||||
@@ -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
@@ -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>
|
|
||||||
@@ -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>
|
|
||||||
@@ -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>
|
|
||||||
@@ -1,52 +1,11 @@
|
|||||||
<template>
|
<template>
|
||||||
<view class="container">
|
<view class="container">
|
||||||
<view class="towcontent">
|
<view class="header">
|
||||||
<view class="towcontentlistxitem flex-start">
|
<navigator class="t" hover-class="none">历史记录</navigator>
|
||||||
<view class="towcontentlistxitembox flex-colum"
|
<navigator class="t" hover-class="none">管理</navigator>
|
||||||
: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>
|
|
||||||
<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>
|
||||||
|
<view class="list">
|
||||||
|
<view class="item" v-for="item in 5" :key="item"></view>
|
||||||
</view>
|
</view>
|
||||||
</view>
|
</view>
|
||||||
</template>
|
</template>
|
||||||
@@ -54,300 +13,37 @@
|
|||||||
<script>
|
<script>
|
||||||
export default {
|
export default {
|
||||||
data() {
|
data() {
|
||||||
return {
|
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)
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
page {
|
$height: 40px;
|
||||||
background: #fff;
|
.header {
|
||||||
}
|
|
||||||
|
|
||||||
.container {
|
|
||||||
.towcontent {
|
|
||||||
padding: 0 28rpx;
|
|
||||||
border-top: 16rpx solid #F9F9F9;
|
|
||||||
|
|
||||||
.towcontentlistxitem {
|
|
||||||
width: 100%;
|
width: 100%;
|
||||||
margin-top: 32rpx;
|
height: $height;
|
||||||
|
background-color: #fff;
|
||||||
.towcontentlistxitembox {
|
position: fixed;
|
||||||
width: 33%;
|
top: 0;
|
||||||
font-family: PingFang SC, PingFang SC;
|
left: 0;
|
||||||
font-weight: 500;
|
z-index: 99;
|
||||||
font-size: 28rpx;
|
display: flex;
|
||||||
color: #333333;
|
align-items: center;
|
||||||
|
justify-content: flex-end;
|
||||||
image {
|
padding: 0 $paddingSize;
|
||||||
margin-top: 6rpx;
|
.t {
|
||||||
width: 38.83rpx;
|
margin-left: $paddingSize;
|
||||||
height: 8.62rpx;
|
color: #999;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
.list {
|
||||||
.towcontentlistxitemboxopacity {
|
padding: $height $paddingSize $paddingSize;
|
||||||
width: 33%;
|
.item {
|
||||||
font-family: PingFang SC, PingFang SC;
|
border-radius: 20upx;
|
||||||
font-weight: bold;
|
height: 100px;
|
||||||
font-size: 32rpx;
|
background-color: #fff;
|
||||||
color: #333333;
|
margin-top: $paddingSize;
|
||||||
|
|
||||||
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;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
}
|
|
||||||
</style>
|
</style>
|
||||||
@@ -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>
|
|
||||||
@@ -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>
|
|
||||||
@@ -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>
|
|
||||||
@@ -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>
|
|
||||||
@@ -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>
|
|
||||||
@@ -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>
|
|
||||||
@@ -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>
|
|
||||||
@@ -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>
|
|
||||||
@@ -1,236 +1,117 @@
|
|||||||
<template>
|
<template>
|
||||||
<view class="container">
|
<view class="container">
|
||||||
<!-- <view class="user-info-wrap" @click="clickinformation">
|
<view class="user-info-wrap">
|
||||||
<view style="width: 108rpx; height: 108rpx;border-radius: 50%;">
|
<view style="width: 36px; height: 36px;border-radius: 10rpx;">
|
||||||
<image style="width: 108rpx; height: 108rpx; border-radius: 50%;" v-if="userInfo.headImg"
|
<button open-type="chooseAvatar" @chooseavatar='onChooseAvatar'
|
||||||
:src="userInfo.headImg" mode="aspectFill">
|
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>
|
||||||
<image style="width: 108rpx; height: 108rpx; border-radius: 50%;" v-else src="@/static/avatar.png"
|
<image style="width: 36px; height: 36px;" v-else src="@/static/avatar.png" mode="aspectFill">
|
||||||
mode="aspectFill">
|
|
||||||
</image>
|
</image>
|
||||||
|
</button>
|
||||||
</view>
|
</view>
|
||||||
<view class="info flex-colum-start">
|
<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>
|
||||||
</view> -->
|
</view> -->
|
||||||
<navseat :opacity='opacity' class="navseat" title='个人中心' :iconshow="false" :titleshow='true'></navseat>
|
<view class="version-wrap">
|
||||||
<view class="boxtop">
|
<!-- <text class="t">版本号:2.0.0</text> -->
|
||||||
<!-- #ifndef MP-WEIXIN -->
|
<text class="t">陕西超掌柜科技有限公司</text>
|
||||||
<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>
|
||||||
<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>
|
|
||||||
<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>
|
</view>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import uploadImage from "@/js_sdk/yushijie-ossutil/ossutil/uploadFile.js";
|
import uploadImage from "@/js_sdk/yushijie-ossutil/ossutil/uploadFile.js";
|
||||||
import listitem from "@/components/listitem.vue";
|
|
||||||
import navseat from '@/components/navseat.vue'
|
|
||||||
export default {
|
export default {
|
||||||
components: {
|
|
||||||
listitem,
|
|
||||||
navseat
|
|
||||||
},
|
|
||||||
data() {
|
data() {
|
||||||
return {
|
return {
|
||||||
titlename: '个人中心',
|
shopUser: {},
|
||||||
opacity: false,
|
|
||||||
userInfo: {},
|
userInfo: {},
|
||||||
teblist: [],
|
shopInfo:{}
|
||||||
list: [],
|
|
||||||
Topdistance: '',
|
|
||||||
};
|
};
|
||||||
},
|
},
|
||||||
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() {
|
onShow() {
|
||||||
if (uni.cache.get('token')) {
|
if (uni.cache.get('token')) {
|
||||||
this.init_fn()
|
|
||||||
this.loginwxuserInfo()
|
this.loginwxuserInfo()
|
||||||
this.tbPlatformDict()
|
|
||||||
}
|
}
|
||||||
|
|
||||||
},
|
},
|
||||||
methods: {
|
methods: {
|
||||||
clickphone() {
|
blurname(e) {
|
||||||
uni.makePhoneCall({
|
console.log(e);
|
||||||
phoneNumber: uni.cache.get('userInfo').custPhone
|
this.userlist.nickname = e.detail.value
|
||||||
});
|
|
||||||
},
|
|
||||||
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;
|
|
||||||
}
|
|
||||||
},
|
},
|
||||||
async loginwxuserInfo() {
|
async loginwxuserInfo() {
|
||||||
let res = await this.api.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) {
|
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.userInfo = uni.cache.get('userInfo')
|
||||||
}
|
this.shopInfo = uni.cache.get('shopInfo')
|
||||||
},
|
|
||||||
async tbPlatformDict() {
|
|
||||||
let res = await this.api.tbPlatformDict({
|
|
||||||
type: 'ownMenu'
|
|
||||||
})
|
|
||||||
// console.log(res)
|
|
||||||
if (res.code == 0) {
|
|
||||||
this.teblist = res.data
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
// / 更换头像
|
// / 更换头像
|
||||||
@@ -268,14 +149,22 @@
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<style scoped lang="scss">
|
<style scoped lang="scss">
|
||||||
|
.container {
|
||||||
|
padding: 0 $paddingSize;
|
||||||
|
}
|
||||||
|
|
||||||
.user-info-wrap {
|
.user-info-wrap {
|
||||||
position: relative;
|
padding: $paddingSize + 20upx $paddingSize;
|
||||||
padding: 48rpx 32rpx 88rpx 32rpx;
|
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
width: 750rpx;
|
|
||||||
background: #FFD158;
|
.avatar {
|
||||||
border-radius: 0rpx 0rpx 40rpx 0rpx;
|
$size: 120upx;
|
||||||
|
width: $size;
|
||||||
|
height: $size;
|
||||||
|
border-radius: 50%;
|
||||||
|
border: 2px solid #fff;
|
||||||
|
}
|
||||||
|
|
||||||
.info {
|
.info {
|
||||||
flex: 1;
|
flex: 1;
|
||||||
@@ -296,89 +185,63 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.user-info-wrap::after {
|
.card {
|
||||||
position: absolute;
|
border-radius: 20upx;
|
||||||
content: '';
|
background-color: #fff;
|
||||||
bottom: 40rpx;
|
margin-bottom: $paddingSize;
|
||||||
right: 0;
|
|
||||||
width: 40rpx;
|
.header-wrap {
|
||||||
height: 40rpx;
|
padding: 0 $paddingSize;
|
||||||
line-height: 40rpx;
|
|
||||||
text-align: center;
|
|
||||||
background-image: radial-gradient(40rpx at 0px 0px, rgba(0, 0, 0, 0) 40rpx, #fff 40rpx);
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.boxtop {
|
.header {
|
||||||
width: 100%;
|
padding: 38upx 0;
|
||||||
height: 542rpx;
|
display: flex;
|
||||||
background: url(https://czg-qr-order.oss-cn-beijing.aliyuncs.com/user/user.png) no-repeat;
|
justify-content: space-between;
|
||||||
background-size: 100% 100%;
|
border-bottom: 1upx solid #f2f2f2;
|
||||||
position: relative;
|
|
||||||
|
|
||||||
.boxtop_top {
|
.more {
|
||||||
padding: 0 32rpx;
|
display: flex;
|
||||||
margin-top: 52rpx;
|
align-items: center;
|
||||||
|
|
||||||
.boxtop_topleft {
|
.t {
|
||||||
.flex-start {
|
color: #999;
|
||||||
text {
|
margin-right: 8upx;
|
||||||
margin-left: 18rpx;
|
}
|
||||||
font-family: Source Han Sans CN, Source Han Sans CN;
|
}
|
||||||
font-weight: 500;
|
}
|
||||||
font-size: 36rpx;
|
|
||||||
color: #333333;
|
.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;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.boxtop_botton {
|
.version-wrap {
|
||||||
position: absolute;
|
padding: 100upx 0;
|
||||||
left: 50%;
|
display: flex;
|
||||||
bottom: 0;
|
flex-direction: column;
|
||||||
transform: translatex(-50%);
|
align-items: center;
|
||||||
width: 654rpx;
|
|
||||||
height: 160rpx;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.userinfoone {
|
.t {
|
||||||
position: relative;
|
color: #999;
|
||||||
padding: 48rpx 28rpx;
|
|
||||||
width: 100%;
|
|
||||||
// top: -40rpx;
|
|
||||||
background: #F6F6F6;
|
|
||||||
// border-radius: 40rpx 0 0rpx 0rpx;
|
|
||||||
|
|
||||||
.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;
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user