myTest383
5 months ago
539 changed files with 98442 additions and 0 deletions
@ -0,0 +1,131 @@ |
|||
# ---> Node |
|||
# Logs |
|||
logs |
|||
*.log |
|||
npm-debug.log* |
|||
yarn-debug.log* |
|||
yarn-error.log* |
|||
lerna-debug.log* |
|||
.pnpm-debug.log* |
|||
|
|||
# Diagnostic reports (https://nodejs.org/api/report.html) |
|||
report.[0-9]*.[0-9]*.[0-9]*.[0-9]*.json |
|||
|
|||
# Runtime data |
|||
pids |
|||
*.pid |
|||
*.seed |
|||
*.pid.lock |
|||
|
|||
# Directory for instrumented libs generated by jscoverage/JSCover |
|||
lib-cov |
|||
|
|||
# Coverage directory used by tools like istanbul |
|||
coverage |
|||
*.lcov |
|||
|
|||
# nyc test coverage |
|||
.nyc_output |
|||
|
|||
# Grunt intermediate storage (https://gruntjs.com/creating-plugins#storing-task-files) |
|||
.grunt |
|||
|
|||
# Bower dependency directory (https://bower.io/) |
|||
bower_components |
|||
|
|||
# node-waf configuration |
|||
.lock-wscript |
|||
|
|||
# Compiled binary addons (https://nodejs.org/api/addons.html) |
|||
build/Release |
|||
|
|||
# Dependency directories |
|||
node_modules/ |
|||
jspm_packages/ |
|||
|
|||
# Snowpack dependency directory (https://snowpack.dev/) |
|||
web_modules/ |
|||
|
|||
# TypeScript cache |
|||
*.tsbuildinfo |
|||
|
|||
# Optional npm cache directory |
|||
.npm |
|||
|
|||
# Optional eslint cache |
|||
.eslintcache |
|||
|
|||
# Microbundle cache |
|||
.rpt2_cache/ |
|||
.rts2_cache_cjs/ |
|||
.rts2_cache_es/ |
|||
.rts2_cache_umd/ |
|||
|
|||
# Optional REPL history |
|||
.node_repl_history |
|||
|
|||
# Output of 'npm pack' |
|||
*.tgz |
|||
|
|||
# Yarn Integrity file |
|||
.yarn-integrity |
|||
|
|||
# dotenv environment variables file |
|||
.env |
|||
.env.test |
|||
.env.production |
|||
|
|||
# parcel-bundler cache (https://parceljs.org/) |
|||
.cache |
|||
.parcel-cache |
|||
|
|||
# Next.js build output |
|||
.next |
|||
out |
|||
|
|||
# Nuxt.js build / generate output |
|||
.nuxt |
|||
dist |
|||
|
|||
# Gatsby files |
|||
.cache/ |
|||
# Comment in the public line in if your project uses Gatsby and not Next.js |
|||
# https://nextjs.org/blog/next-9-1#public-directory-support |
|||
# public |
|||
|
|||
# vuepress build output |
|||
.vuepress/dist |
|||
|
|||
# Serverless directories |
|||
.serverless/ |
|||
|
|||
# FuseBox cache |
|||
.fusebox/ |
|||
|
|||
# DynamoDB Local files |
|||
.dynamodb/ |
|||
|
|||
# TernJS port file |
|||
.tern-port |
|||
|
|||
# Stores VSCode versions used for testing VSCode extensions |
|||
.vscode-test |
|||
|
|||
# yarn v2 |
|||
.yarn/cache |
|||
.yarn/unplugged |
|||
.yarn/build-state.yml |
|||
.yarn/install-state.gz |
|||
.pnp.* |
|||
|
|||
**/.idea/ |
|||
**/target/ |
|||
*.iml |
|||
*.ipr |
|||
*.iws |
|||
*.log |
|||
|
|||
### VS Code ### |
|||
.vscode/ |
|||
.hbuilderx/ |
|||
unpackage/ |
|||
@ -0,0 +1,102 @@ |
|||
<script> |
|||
import config from "common/config.js"; |
|||
import { |
|||
navParams |
|||
} from "common/nav-calc-utils.js"; |
|||
export default { |
|||
globalData: { |
|||
wxSilentLoginURL: config.baseUrl + "/lpkcustomer/wxSilentLogin", |
|||
sid: "", |
|||
token: "", |
|||
mobile: "", |
|||
isNewUser: "", //是否新人 0 否 1 是 邀请新人助力 |
|||
isPurchase: "", //是否购买过 1否 0是 首页新人礼包弹框 |
|||
navInfo: { |
|||
|
|||
} |
|||
}, |
|||
onLaunch: function() { |
|||
|
|||
wx.hideTabBar() |
|||
|
|||
const updateManager = uni.getUpdateManager(); |
|||
|
|||
updateManager.onCheckForUpdate(function(res) { |
|||
// 请求完新版本信息的回调 |
|||
console.log(res.hasUpdate); |
|||
}); |
|||
|
|||
updateManager.onUpdateReady(function(res) { |
|||
uni.showModal({ |
|||
title: '更新提示', |
|||
content: '新版本已经准备好，是否重启应用？', |
|||
success(res) { |
|||
if (res.confirm) { |
|||
// 新的版本已经下载好，调用 applyUpdate 应用新版本并重启 |
|||
updateManager.applyUpdate(); |
|||
} |
|||
} |
|||
}); |
|||
|
|||
}); |
|||
|
|||
updateManager.onUpdateFailed(function(res) { |
|||
// 新的版本下载失败 |
|||
}); |
|||
|
|||
|
|||
this.globalData.navInfo = navParams() |
|||
|
|||
// let _this = this; |
|||
// wx.login({ |
|||
// success: function(res) { |
|||
// uni.request({ |
|||
// // 组装请求地址 |
|||
// url:_this.globalData.wxSilentLoginURL + "?wxCode=" + res.code, |
|||
// method: "GET", |
|||
// header: { |
|||
// 'content-type': "application/x-www-form-urlencoded" |
|||
// }, |
|||
// data: { |
|||
// "wxCode": res.code |
|||
// }, |
|||
// success: res => { |
|||
// if (res.statusCode == 200) { |
|||
// if (!res.data.success) { |
|||
// if (res.data.code == "110") { |
|||
// // 需要绑定手机号 |
|||
// uni.reLaunch({ |
|||
// url: '/pages/index/BindPhone?openid=' + |
|||
// res.data.data.wxMpOpenid |
|||
// }) |
|||
// } else { |
|||
// // _this.status = 'more' |
|||
// } |
|||
// } else { |
|||
// // 成功后跳转主页 |
|||
// _this.globalData.sid = res.data.data.sid |
|||
// console.log("用户sid",_this.globalData.sid) |
|||
// } |
|||
// } else { |
|||
// } |
|||
// }, |
|||
// fail: (err) => { |
|||
// } |
|||
// }); |
|||
// }, |
|||
// fail: function(res) { |
|||
// } |
|||
// }); |
|||
}, |
|||
onShow: function() { |
|||
console.log('App Show') |
|||
}, |
|||
onHide: function() { |
|||
console.log('App Hide') |
|||
}, |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
/*每个页面公共css */ |
|||
</style> |
|||
@ -0,0 +1,201 @@ |
|||
const timeText = (time, format) => { |
|||
|
|||
if (format == null) { |
|||
format = "yyyy-MM-dd HH:mm:ss" |
|||
} |
|||
|
|||
let timeStr = ""; |
|||
|
|||
let todayEndTime = getTodayEndTime(); |
|||
let todayStartTime = getTodayStartTime(); |
|||
let thisWeekStartTime = getThisWeekStartTime(); |
|||
|
|||
console.log("kaishi" + todayStartTime) |
|||
console.log("jieshu" + thisWeekStartTime) |
|||
|
|||
|
|||
// 今天23:59:59:999之后
|
|||
if (time > todayEndTime) { |
|||
// 显示年月日
|
|||
timeStr = timeFormat(time, format) |
|||
} else if (thisWeekStartTime > time) { |
|||
// 此周前（本周星期一之前）
|
|||
|
|||
let i = format.indexOf(" "); |
|||
let formatStyle = format.substring(i + 1); |
|||
let formatNew = timeFormat(time, formatStyle); |
|||
|
|||
if (time > todayStartTime - 86399999 && time < todayStartTime) { |
|||
// 显示昨天
|
|||
timeStr = "昨天 " + formatNew; |
|||
} else { |
|||
timeStr = timeFormat(time, format) |
|||
} |
|||
|
|||
} else { |
|||
// 显示星期 时分
|
|||
let i = format.indexOf(" "); |
|||
let formatStyle = format.substring(i + 1); |
|||
let formatNew = timeFormat(time, formatStyle); |
|||
|
|||
if (todayStartTime - 86399999 > time) { |
|||
// 显示星期
|
|||
timeStr = getWeekStr(time) + " " + formatNew |
|||
} else if (time > todayStartTime - 86399999 && time < todayStartTime) { |
|||
// 显示昨天
|
|||
timeStr = "昨天 " + formatNew; |
|||
} else { |
|||
// 显示
|
|||
timeStr = formatNew; |
|||
} |
|||
} |
|||
|
|||
return timeStr |
|||
} |
|||
|
|||
/** |
|||
* 获取本周开始时间 |
|||
*/ |
|||
const getThisWeekStartTime = () => { |
|||
|
|||
let todayEndTime = getTodayEndTime(); |
|||
|
|||
var date = new Date(); |
|||
var weekDays = date.getDay(); |
|||
var weeks = new Array("星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六"); |
|||
var week = weeks[weekDays]; |
|||
|
|||
return todayEndTime + 1 - weekDays * 86400000; |
|||
} |
|||
|
|||
/** |
|||
* 获取今天是周几 |
|||
*/ |
|||
const getWeekStr = (time) => { |
|||
|
|||
|
|||
if (time instanceof Date) { |
|||
|
|||
} else { |
|||
let temp = new Date(time); |
|||
time = temp; |
|||
} |
|||
|
|||
let todayEndTime = getTodayEndTime(); |
|||
|
|||
var weekDays = time.getDay(); |
|||
var weeks = new Array("星期日", "星期一", "星期二", "星期三", "星期四", "星期五", "星期六"); |
|||
var week = weeks[weekDays]; |
|||
|
|||
return week; |
|||
} |
|||
|
|||
/** |
|||
* 获取今天开始时间 |
|||
*/ |
|||
const getTodayStartTime = () => { |
|||
|
|||
let startTime = 0; |
|||
|
|||
let myDate = new Date(); |
|||
|
|||
let current = myDate.getTime(); |
|||
|
|||
try { |
|||
|
|||
let format = timeFormat(myDate); |
|||
let split = format.split(" "); |
|||
let time = split[1].split(":"); |
|||
|
|||
startTime = current - time[0] * 60 * 60 * 1000 - time[1] * 60 * 1000 - time[2] * 1000 - time[3] |
|||
|
|||
} catch (e) { |
|||
console.log(e) |
|||
} |
|||
|
|||
return startTime; |
|||
} |
|||
|
|||
/** |
|||
* 获取今天结束时间 |
|||
*/ |
|||
const getTodayEndTime = () => { |
|||
|
|||
let endTime = 0; |
|||
|
|||
let myDate = new Date(); |
|||
|
|||
let current = myDate.getTime(); |
|||
|
|||
try { |
|||
|
|||
let format = timeFormat(myDate); |
|||
let split = format.split(" "); |
|||
let time = split[1].split(":"); |
|||
|
|||
let startTime = current - time[0] * 60 * 60 * 1000 - time[1] * 60 * 1000 - time[2] * 1000 - time[3] |
|||
endTime = startTime + 86399999; |
|||
|
|||
} catch (e) { |
|||
console.log(e) |
|||
} |
|||
|
|||
return endTime; |
|||
} |
|||
|
|||
/** |
|||
* 格式化时间 |
|||
* 支持时间戳 以及 date类型 |
|||
*/ |
|||
const timeFormat = (date, formoat) => { |
|||
|
|||
if (date == undefined || date == null) { |
|||
return ""; |
|||
} |
|||
|
|||
if (date instanceof Date) { |
|||
console.log("正确") |
|||
} else { |
|||
let temp = new Date(Number(date)); |
|||
date = temp; |
|||
} |
|||
|
|||
let fmt = formoat; |
|||
|
|||
if (fmt == null) { |
|||
fmt = "yyyy-MM-dd HH:mm:ss:SSS" |
|||
} |
|||
|
|||
|
|||
let ret; |
|||
const opt = { |
|||
"y+": date.getFullYear().toString(), // 年
|
|||
"M+": (date.getMonth() + 1).toString(), // 月
|
|||
"d+": date.getDate().toString(), // 日
|
|||
"H+": date.getHours().toString(), // 时
|
|||
"m+": date.getMinutes().toString(), // 分
|
|||
"s+": date.getSeconds().toString(), // 秒
|
|||
"S+": date.getMilliseconds().toString() |
|||
|
|||
}; |
|||
for (let k in opt) { |
|||
ret = new RegExp("(" + k + ")").exec(fmt); |
|||
if (ret) { |
|||
fmt = fmt.replace(ret[1], (ret[1].length == 1) ? (opt[k]) : (opt[k].padStart(ret[1].length, "0"))) |
|||
}; |
|||
}; |
|||
return fmt; |
|||
} |
|||
|
|||
const currentMillions = () => { |
|||
let current = new Date().getTime(); |
|||
return current; |
|||
} |
|||
|
|||
export { |
|||
timeText, |
|||
timeFormat, |
|||
currentMillions, |
|||
getWeekStr, |
|||
getTodayEndTime |
|||
} |
|||
@ -0,0 +1,130 @@ |
|||
/** |
|||
* 这里是uni-app内置的常用样式变量 |
|||
* |
|||
* uni-app 官方扩展插件及插件市场（https://ext.dcloud.net.cn）上很多三方插件均使用了这些样式变量 |
|||
* 如果你是插件开发者，建议你使用scss预处理，并在插件代码中直接使用这些变量（无需 import 这个文件），方便用户通过搭积木的方式开发整体风格一致的App |
|||
* |
|||
*/ |
|||
|
|||
/** |
|||
* 如果你是App开发者（插件使用者），你可以通过修改这些变量来定制自己的插件主题，实现自定义主题功能 |
|||
* |
|||
* 如果你的项目同样使用了scss预处理，你也可以直接在你的 scss 代码中使用如下变量，同时无需 import 这个文件 |
|||
*/ |
|||
|
|||
/* 颜色变量 */ |
|||
|
|||
/* 行为相关颜色 */ |
|||
$uni-color-primary: #007aff; |
|||
$uni-color-success: #4cd964; |
|||
$uni-color-warning: #f0ad4e; |
|||
$uni-color-error: #dd524d; |
|||
|
|||
/* 文字基本颜色 */ |
|||
$uni-text-color: #333; //基本色 |
|||
$uni-text-color-inverse: #fff; //反色 |
|||
$uni-text-color-grey: #999; //辅助灰色，如加载更多的提示信息 |
|||
$uni-text-color-placeholder: #808080; |
|||
$uni-text-color-disable: #c0c0c0; |
|||
|
|||
/* 背景颜色 */ |
|||
$uni-bg-color: #ffffff; |
|||
$uni-bg-color-grey: #f8f8f8; |
|||
$uni-bg-color-hover: #f1f1f1; //点击状态颜色 |
|||
$uni-bg-color-mask: rgba(0, 0, 0, 0.4); //遮罩颜色 |
|||
|
|||
/* 边框颜色 */ |
|||
$uni-border-color: #c8c7cc; |
|||
|
|||
/* 尺寸变量 */ |
|||
|
|||
/* 文字尺寸 */ |
|||
$uni-font-size-sm: 12px; |
|||
$uni-font-size-base: 14px; |
|||
$uni-font-size-lg: 16; |
|||
|
|||
/* 图片尺寸 */ |
|||
$uni-img-size-sm: 20px; |
|||
$uni-img-size-base: 26px; |
|||
$uni-img-size-lg: 40px; |
|||
|
|||
/* Border Radius */ |
|||
$uni-border-radius-sm: 2px; |
|||
$uni-border-radius-base: 3px; |
|||
$uni-border-radius-lg: 6px; |
|||
$uni-border-radius-circle: 50%; |
|||
|
|||
/* 水平间距 */ |
|||
$uni-spacing-row-sm: 5px; |
|||
$uni-spacing-row-base: 10px; |
|||
$uni-spacing-row-lg: 15px; |
|||
|
|||
/* 垂直间距 */ |
|||
$uni-spacing-col-sm: 4px; |
|||
$uni-spacing-col-base: 8px; |
|||
$uni-spacing-col-lg: 12px; |
|||
|
|||
/* 透明度 */ |
|||
$uni-opacity-disabled: 0.3; // 组件禁用态的透明度 |
|||
|
|||
/* 文章场景相关 */ |
|||
$uni-color-title: #2c405a; // 文章标题颜色 |
|||
$uni-font-size-title: 20px; |
|||
$uni-color-subtitle: #555555; // 二级标题颜色 |
|||
$uni-font-size-subtitle: 26px; |
|||
$uni-color-paragraph: #3f536e; // 文章段落颜色 |
|||
$uni-font-size-paragraph: 15px; |
|||
|
|||
/** |
|||
* 下面为当前APP自己定义的公共样式 |
|||
*/ |
|||
.app-container { |
|||
padding: 20px; |
|||
font-size: 14px; |
|||
line-height: 24px; |
|||
} |
|||
|
|||
.u-block { |
|||
padding: 14px; |
|||
&__section { |
|||
margin-bottom: 10px; |
|||
} |
|||
&__title { |
|||
margin-top: 10px; |
|||
font-size: 15px; |
|||
color: $u-content-color; |
|||
margin-bottom: 10px; |
|||
} |
|||
&__flex { |
|||
/* #ifndef APP-NVUE */ |
|||
display: flex; |
|||
/* #endif */ |
|||
} |
|||
} |
|||
|
|||
// 使用了cell组件的icon图片样式 |
|||
.u-cell-icon { |
|||
width: 36rpx; |
|||
height: 36rpx; |
|||
margin-right: 8rpx; |
|||
} |
|||
|
|||
.u-page { |
|||
padding: 15px 15px 40px 15px; |
|||
} |
|||
|
|||
.u-demo-block { |
|||
flex: 1; |
|||
margin-bottom: 23px; |
|||
|
|||
&__content { |
|||
@include flex(column); |
|||
} |
|||
|
|||
&__title { |
|||
font-size: 14px; |
|||
color: rgb(143, 156, 162); |
|||
margin-bottom: 8px; |
|||
@include flex; |
|||
} |
|||
} |
|||
@ -0,0 +1,3 @@ |
|||
import Vue from 'vue' |
|||
const bus = new Vue() |
|||
export default bus |
|||
@ -0,0 +1,17 @@ |
|||
/** |
|||
* config 配置项说明 |
|||
* baseUrl = "", // 接口的根地址
|
|||
* tokenName = "Authorization", // 请求头中token的名字，与服务器端对应
|
|||
* loginTimeoutCode : "5000", // 登录超时或失效的情况下，服务器端返回的错误码
|
|||
* loginTimeoutPage = "/pages/login/index", // 登录超时或失效的情况下，跳转到的登录页面
|
|||
*/ |
|||
module.exports = { |
|||
// baseUrl: 'http://uv32vz.natappfree.cc', // 本地
|
|||
// baseUrl: 'http://192.168.0.105:7211', // 本地
|
|||
// baseUrl: 'https://39.104.100.138/lpkapi', // 测试服务器
|
|||
// baseUrl: 'https://lpk.yyundong.com/mallapi', // 测试服务器
|
|||
baseUrl: 'https://supervise.yxtsoft.com/lpkapi', // 正式服务器
|
|||
// tokenName: "Authorization", // 请求头中token的名字，与服务器端对应
|
|||
loginTimeoutCode: "5001", // 登录超时或失效的情况下，服务器端返回的错误码
|
|||
loginTimeoutPage: "/pages/login/index", // 登录超时或失效的情况下，跳转到的登录页面
|
|||
} |
|||
@ -0,0 +1,12 @@ |
|||
function stringIsEmpty(str) { |
|||
return str === undefined || str === null || str === '' |
|||
} |
|||
|
|||
function stringIsNotEmpty(str) { |
|||
return !stringIsEmpty(str) |
|||
} |
|||
|
|||
export { |
|||
stringIsEmpty, |
|||
stringIsNotEmpty |
|||
} |
|||
@ -0,0 +1,22 @@ |
|||
/** |
|||
* getQueryString 二维码参数转换提取 |
|||
* 参数 |
|||
* url 二维码参数 |
|||
* name 需要提取的参数 |
|||
*/ |
|||
function getQueryString(url, name) { |
|||
let reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)",'i'); |
|||
var r = url.substr(1).match(reg) |
|||
|
|||
if (r != null) { |
|||
|
|||
return r[2] |
|||
|
|||
} |
|||
|
|||
return null; |
|||
} |
|||
|
|||
export { |
|||
getQueryString |
|||
} |
|||
@ -0,0 +1,7 @@ |
|||
export default { |
|||
data() { |
|||
return { |
|||
|
|||
} |
|||
} |
|||
} |
|||
@ -0,0 +1,84 @@ |
|||
function navParams() { |
|||
|
|||
let params = { |
|||
// 是否支持自定义导航栏(小程序 pc版 false)
|
|||
supportCustomBar: true, |
|||
// 胶囊
|
|||
menuButton: { |
|||
width: 0, |
|||
height: 0 |
|||
}, |
|||
// 导航栏
|
|||
// 可自定义，wx小程序会强制更改
|
|||
navBar: { |
|||
height: 0, |
|||
// 导航栏字体大小 wx小程序 ios：13，Android：17
|
|||
fontSize: 0, |
|||
// 导航栏样式 wx小程序时：ios：center，Android：left
|
|||
style: '', |
|||
// 导航栏可用宽度 wx小程序时 ios，Android：屏幕宽-胶囊
|
|||
enableWidth: 0, |
|||
// 导航栏不可用宽度 wx小程序时 ios，Android：胶囊+胶囊距离屏幕右侧边界的距离
|
|||
disableWidth: 0 |
|||
}, |
|||
window: { |
|||
width: 0, |
|||
height: 0 |
|||
}, |
|||
os: { |
|||
osName: '' |
|||
}, |
|||
// 导航栏+状态栏高度
|
|||
navStatusHeight: '0px', |
|||
// 状态栏高度
|
|||
statusBarHeight: 0, |
|||
unit: 'px' |
|||
} |
|||
|
|||
// 同步获取信息
|
|||
let info = uni.getSystemInfoSync(); |
|||
|
|||
// 状态栏高度
|
|||
params.statusBarHeight = info.statusBarHeight; |
|||
params.window.width = info.screenWidth |
|||
params.window.height = info.screenHeight |
|||
params.os.osName = info.osName |
|||
|
|||
// 获取胶囊相关内容
|
|||
// #ifdef MP-WEIXIN
|
|||
let menuButton = uni.getMenuButtonBoundingClientRect(); |
|||
params.menuButton.width = menuButton.width; |
|||
params.menuButton.height = menuButton.height; |
|||
let paddingTop = menuButton.top - params.statusBarHeight; |
|||
let paddingBottom = 0; |
|||
if (params.os.osName === 'ios') { |
|||
paddingBottom = paddingTop * 2; |
|||
params.navBar.fontSize = 13; |
|||
params.navBar.style = 'center'; |
|||
} else if (params.os.osName === 'android') { |
|||
paddingBottom = paddingTop; |
|||
params.navBar.fontSize = 17; |
|||
params.navBar.style = 'left'; |
|||
} else if (params.os.osName === 'windows' || params.os.osName === 'mac') { |
|||
params.supportCustomBar = false; |
|||
} else { |
|||
// 未知系统按照Android处理
|
|||
paddingBottom = paddingTop; |
|||
params.navBar.fontSize = 17; |
|||
params.navBar.style = 'left'; |
|||
} |
|||
params.navBar.height = params.menuButton.height + paddingTop + paddingBottom; |
|||
// 导航栏可用宽度 屏幕左边界到胶囊左边界
|
|||
params.navBar.enableWidth = menuButton.left; |
|||
params.navBar.disableWidth = params.window.width - params.navBar.enableWidth; |
|||
// #endif
|
|||
|
|||
params.navStatusHeight = params.statusBarHeight + params.navBar.height |
|||
|
|||
console.log(params); |
|||
return params |
|||
} |
|||
|
|||
export { |
|||
navParams |
|||
} |
|||
@ -0,0 +1,15 @@ |
|||
// 10.00 10.60
|
|||
function convertPrice(str) { |
|||
if (str == undefined || str == null || str == '') |
|||
return '' |
|||
if (str.endsWith('.00')) { |
|||
return str.substring(0, str.length - 3) |
|||
} else if (str.endsWith('0') && str.includes('.')) { |
|||
return str.substring(0, str.length - 1) |
|||
} |
|||
|
|||
return str |
|||
} |
|||
export { |
|||
convertPrice |
|||
} |
|||
@ -0,0 +1,2 @@ |
|||
uni.$u.props.gap.bgColor = '#f3f4f6' |
|||
uni.$u.props.gap.height = '10' |
|||
@ -0,0 +1,16 @@ |
|||
const { |
|||
http |
|||
} = uni.$u |
|||
|
|||
export default { |
|||
login: (params, config = {}) => http.post('/login', params, { |
|||
custom: { |
|||
catchError: true, |
|||
showFailMessage: true |
|||
} |
|||
}), |
|||
sayhello: (params = {}) => http.get("/sayb", params), |
|||
|
|||
// 查看预警信息
|
|||
selectBusinessRiskInfo: (params = {}) => http.post("/v1/businessData/selectBusinessRiskInfo", params) |
|||
} |
|||
@ -0,0 +1,184 @@ |
|||
import request from '@/utils/requester.js' |
|||
import config from "@/common/config.js" |
|||
|
|||
export default { |
|||
login: (params = {}) => request.post("/wxmpapi/sysuser/login", params), |
|||
wxBindMobile: (params = {}) => request.post("/lpkcustomer/wxBindMobile", params), |
|||
// 不显示loading true
|
|||
// 提货卡列表
|
|||
cardList: (params = {}) => request.post("/lpkgiftcard/gifCardByCustomerSid", params, {}, {}, true), |
|||
// 福礼卡列表
|
|||
gifcardList: (params = {}) => request.post("/empcardgift/gifCardByCustomerSid", params, {}, {}, true), |
|||
// 企业卡列表
|
|||
empcardList: (params = {}) => request.post("/empcard/getEmpCardByCustomerSid", params, {}, {}, true), |
|||
// 提货卡详情
|
|||
cardDetail: (params = {}) => request.get("/lpkgiftcard/getGifCardBySid/" + params, params, {}, {}, true), |
|||
// 福礼卡详情
|
|||
gifcardDetail: (params = {}) => request.get("/empcardgift/getGifCardBySid/" + params, params, {}, {}, true), |
|||
// 企业卡详情
|
|||
empCardDetail: (params = {}) => request.get("/empcard/getEmpCardBySid/" + params, params, {}, {}, true), |
|||
// 福礼卡分享 改变卡状态
|
|||
shareEmpCard: (params = {}) => request.get("/empcardgift/shareEmpCard/" + params, params, {}, {}, true), |
|||
// 提货日期 周六日的日期组合
|
|||
isSaturAndSun: (params = {}) => request.get("/lpkgiftcard/isSaturAndSun/" + params, params, {}, {}, true), |
|||
// 提货日期 周六日的日期组合
|
|||
isSaturAndSun2: (params = {}) => request.get("/empcardgift/isSaturAndSun/" + params, params, {}, {}, true), |
|||
// 提货日期 周六日的日期组合
|
|||
isSaturAndSun3: (params = {}) => request.get("/empcard/isSaturAndSun/" + params, params, {}, {}, true), |
|||
// 提货卡预约初始化
|
|||
cardBooking: (params = {}) => request.get("/lpkgiftcard/getReservationBySid/" + params, params, {}, {}, true), |
|||
// 提货卡预约保存
|
|||
cardBookingSave: (params = {}) => request.post("/lpksreservoorder/submission", params), |
|||
// 提货卡转赠保存
|
|||
generateEmpCard: (params = {}) => request.post("/empcardgift/generateEmpCard", params), |
|||
// 福礼卡预约保存
|
|||
gifcardBookingSave: (params = {}) => request.post("/empsreservoorder/submission", params), |
|||
// 福利卡转赠保存
|
|||
generateEmpCardGift: (params = {}) => request.post("/empcardgift/generateEmpCardGift", params), |
|||
// 企业卡生成福利卡
|
|||
empcardSave: (params = {}) => request.post("/empcardgift/generateCard", params), |
|||
// 企业卡预约保存
|
|||
empcardBookingSave: (params = {}) => request.post("/empsreservoorder/submissionEmp", params), |
|||
// 绑定提货卡
|
|||
cardBind: (params = {}) => request.post("/lpkgiftcard/bindCard", params), |
|||
// 绑定企业卡
|
|||
empcardBind: (params = {}) => request.post("/empcard/bindCard", params), |
|||
// 单一提货卡预约记录
|
|||
orderByCardSid: (params = {}) => request.get("/lpksreservoorder/orderByCardSid/" + params, params, {}, {}, true), |
|||
// 订单记录
|
|||
orderListByUserSid: (params = {}) => request.post("/lpksreservoorder/orderListByUserSid", params, {}, {}, true), |
|||
// 订单详情
|
|||
orderDetails: (params = {}) => request.get("/lpksreservoorder/orderDetails/" + params, params, {}, {}, true), |
|||
// 订单退款
|
|||
orderRetrun: (params = {}) => request.post("/refund/createOrder", params, {}, {}, true), |
|||
// 商品详情
|
|||
goodsDetail: (params = {}) => request.get("/lpkgoods/goodsDetails/" + params.sid + "/" + params |
|||
.customerSid, {}, {}, {}, true), |
|||
// 提货点
|
|||
address: (params = {}) => request.post("/lpkstore/getAllStoreByQuery", params, {}, {}, true), |
|||
|
|||
|
|||
// 2024-1-13 新需求接口 所有卡数据整合到一个页面
|
|||
// 新提货卡列表
|
|||
pickUpCardList: (params = {}) => request.post("/lpkgiftcard/gifCardsByCustomerSid", params, {}, {}, true), |
|||
// 新绑定提货卡
|
|||
pickUpCardBind: (params = {}) => request.post("/lpkgiftcard/bindAllCard", params), |
|||
|
|||
// 云菜窖列表
|
|||
appletGiftBagList: (params = {}) => request.get("/appletgiftbag/appletGiftBagList", params), |
|||
// 云菜窖列表
|
|||
getGiftBagBySid: (params = {}) => request.get("/appletgiftbag/getGiftBagBySid/" + params, params), |
|||
// 自选菜窖 商品信息
|
|||
getAllGiftBag: (params = {}) => request.get("/lpkgoods/getAllGiftBag", params), |
|||
// 結算商品
|
|||
createOrder: (params = {}) => request.post("/empsreservoorder/createOrder", params), |
|||
// 预约记录
|
|||
orderListByUserSid: (params = {}) => request.post("/lpksreservoorder/orderListByUserSid", params, {}, {}), |
|||
// 取消预约记录
|
|||
cancelReservation: (params = {}) => request.get("/lpksreservoorders/cancelReservation/" + params, params, {}, {}), |
|||
// 转赠记录
|
|||
transferRecordsList: (params = {}) => request.post("/transferrecords/transferRecordsList", params, {}, {}), |
|||
|
|||
|
|||
// 我的
|
|||
// 获取头像 昵称
|
|||
getUserInfo: (params = {}) => request.get("/lpkcustomer/customerInfo/" + params, params), |
|||
// 用户基本信息
|
|||
getBaseInfo: (params = {}) => request.get("/lpkcustomer/getCustomerInfo/" + params, params, {}, {}, true), |
|||
// 修改头像
|
|||
uploadHandImage: (params = {}) => request.post("/lpkcustomer/uploadAvatar", params), |
|||
// 获取默认提菜信息
|
|||
getStoreBySid: (params = {}) => request.get("/customerstore/getStoreBySid/" + params, params), |
|||
// 推荐有礼
|
|||
myRecommend: (params = {}) => request.get("/newcomerrecorecord/recordList/" + params, params), |
|||
// 基本信息修改头像
|
|||
headerUpload: config.baseUrl + '/lpkcustomer/modifyHeadImage', |
|||
// 修改昵称
|
|||
changeNick: (params = {}) => request.formpost("/lpkcustomer/modifyUserNickName", params), |
|||
// 获取手机号
|
|||
getPhone: (params = {}) => request.formpost("/lpkcustomer/getPhoneNumber", params), |
|||
// 获取实名
|
|||
getRealInfo: (params = {}) => request.get("/lpkcustomer/getRealInfo/" + params, params, {}, {}, true), |
|||
// 保存实名
|
|||
saveRealInfo: (params = {}) => request.post("/lpkcustomer/saveRealInfo", params), |
|||
// 查询推荐支行
|
|||
searchTuiJianZhiHang: (params = {}) => request.get("/LpkCustomerBank/getBankList", params), |
|||
// 保存支行
|
|||
saveTuiJianZhiHang: (params = {}) => request.formpost("/lpkcustomer/updateCustomerBank", params), |
|||
// 我的 预约记录
|
|||
myOrderListByUserSid: (params = {}) => request.post("/lpksreservoorders/orderListByUserSid", params, {}, {}), |
|||
// 我的 订单列表
|
|||
ordersList: (params = {}) => request.post("/empsreservoorder/ordersList", params, {}, {}), |
|||
// 我的 订单详情
|
|||
orderDetails: (params = {}) => request.get("/empsreservoorder/OrderDetails/" + params, params, {}, {}, true), |
|||
// 我的 订单详情 修改订单状态
|
|||
changePayState: (params = {}) => request.get("/empsreservoorder/changePayState/" + params, params, {}, {}, true), |
|||
// 订单发票获取授权页链接
|
|||
wxElectronicInvoice: (params = {}) => request.post("/empsreservoorder/wxElectronicInvoice", params, {}, {}), |
|||
// 我的 失效商品
|
|||
vegeCellarInvalidList: (params = {}) => request.post("/lpkgoods/vegeCellarInvalidList", params, {}, {}), |
|||
|
|||
// 查询发票列表
|
|||
getInvoiceList: (params = {}) => request.get("/customerinvoice/listInvoice/" + params, params), |
|||
// 新增发票
|
|||
saveOrUpdateInvoice: (params = {}) => request.post("/customerinvoice/saveOrUpdate", params, {}, {}), |
|||
// 提交申请发票
|
|||
submitInvoice: (params = {}) => request.post("/invoicerecords/save", params, {}, {}), |
|||
// 我的 推荐有礼
|
|||
recommendNewUsers: (params = {}) => request.post("/newcomerrecorecord/recommendNewUsers", params, {}, {}), |
|||
// 新人助力
|
|||
recommendedAssistance: (params = {}) => request.post("/newcomerrecorecord/recommendedAssistance", params, {}, {}), |
|||
|
|||
|
|||
// 2024-1-15 新需求
|
|||
// 获取轮播图
|
|||
bannerList: (params = {}) => request.get("/wxapi/banner/list", params), |
|||
// 获取分类和品牌
|
|||
getGoodsTypeAndBrand: (params = {}) => request.get("/lpkgoods/getGoodsTypeAndBrand", {}, {}, {}, true), |
|||
// 判断企业菜窖是否认证
|
|||
isEnterprise: (params = {}) => request.get("/lpkgoods/isEnterprise/" + params.customerSid + "/" + params.brandId, + |
|||
params, {}, {}, {}, true, true), |
|||
// 保存企业认证
|
|||
saveAuthentication: (params = {}) => request.post("/enterprisecertification/save", params), |
|||
// 获取补充菜窖 商品分类列表
|
|||
getAllGoodsType: (params = {}) => request.get("/lpkgiftcard/getAllGoodsType/" + params, params), |
|||
// 获取补充菜窖 商品分类列表
|
|||
getGoodsByType: (params = {}) => request.post("/lpkgoods/getGoodsByType", params, {}, {}, true), |
|||
// 获取当前购物车总价及总斤数
|
|||
getGoodsWeight: (params = {}) => request.post("/shoppingcart/getGoodsWeight", params, {}, {}, true), |
|||
// 加入购物车
|
|||
addShoppingCart: (params = {}) => request.post("/shoppingcart/addShoppingCart", params), |
|||
// 购物车列表
|
|||
shoppingCartList: (params = {}) => request.post("/shoppingcart/shoppingCartList", params, {}, {}, true), |
|||
// 结算 跳过支付
|
|||
saveGoods: (params = {}) => request.post("/vegetablecellar/saveGoods", params), |
|||
// 正式结算 支付
|
|||
createVegeOrder: (params = {}) => request.post("/empsreservoorder/createVegeOrder", params), |
|||
|
|||
|
|||
// 我的菜窖 通知公告
|
|||
getNotices: (params = {}) => request.get("/appletnotice/getNotice", params), |
|||
// 我的菜窖 新人礼包列表
|
|||
newUserQuota: (params = {}) => request.post("/appletgiftbag/newUserQuota", params), |
|||
// 结算新人礼包 支付
|
|||
createNewUserBagOrder: (params = {}) => request.post("/empsreservoorder/createNewUserBagOrder", params), |
|||
// 我的菜窖 类型列表
|
|||
vegeCellarTypeList: (params = {}) => request.post("/lpkgoods/vegeCellarTypeList", params), |
|||
// 我的菜窖 商品列表
|
|||
vegeCellarList: (params = {}) => request.post("/lpkgoods/vegeCellarList", params), |
|||
// 我的菜窖 转赠亲友
|
|||
transSubmission: (params = {}) => request.post("/transferrecords/submission", params), |
|||
// 我的菜窖 获取转赠内容
|
|||
getTransferByCode: (params = {}) => request.post("/transferrecords/getTransferByCode/" + params, params), |
|||
// 我的菜窖 领取/绑定转赠菜窖
|
|||
receiveTransferGoods: (params = {}) => request.post("/vegetablecellar/receiveTransferGoods", params), |
|||
// 我的菜窖 绑定之前发出的礼品卡
|
|||
bindAllCard: (params = {}) => request.post("/lpkgiftcard/bindAllCard", params), |
|||
// 我的菜窖 预约提菜
|
|||
getStoreBySid: (params = {}) => request.get("/customerstore/getStoreBySid/" + params, params), |
|||
// 我的菜窖 预约提菜 选择时间范围
|
|||
getExtractSaturAndSun: (params = {}) => request.get("/customerstore/isSaturAndSun", params), |
|||
// 我的菜窖 保存预约提菜
|
|||
submissionExtract: (params = {}) => request.post("/lpksreservoorders/submission", params, {}, {}, true), |
|||
|
|||
} |
|||
@ -0,0 +1,20 @@ |
|||
function shortToast(str) { |
|||
uni.showToast({ |
|||
title: str, |
|||
icon: 'none', |
|||
duration: 2000 |
|||
}) |
|||
} |
|||
|
|||
function longToast(str) { |
|||
uni.showToast({ |
|||
title: str, |
|||
icon: 'none', |
|||
duration: 3500 |
|||
}) |
|||
} |
|||
|
|||
export { |
|||
shortToast, |
|||
longToast |
|||
} |
|||
@ -0,0 +1,240 @@ |
|||
<template> |
|||
|
|||
<view> |
|||
|
|||
<!-- 左侧布局 --> |
|||
<view v-if="navStyle==='left'" class="_navLayout" |
|||
:style="{'background': navBackground,'height':navStatusHeight}"> |
|||
<!-- 状态栏 --> |
|||
<view :style="{'height':statusBarHeight}"></view> |
|||
<!-- 导航栏,去掉了不可用的宽度 --> |
|||
<view class="_nav-real" |
|||
:style="{'height':navHeight,'width':'calc('+enableWidth+' - 9px)' ,'margin-left':'9px'}"> |
|||
<view class="_navIcon2"> |
|||
<image v-if="showIcon" src="../../static/wx_back.png" |
|||
style="width: 20px;height: 20px;padding-right: 6px;" @click="clickIcon"></image> |
|||
</view> |
|||
<!-- 标题布局 --> |
|||
<view class="_nav-title2" :style="{'height':navHeight,'line-height':navHeight,'font-size':fontSize}"> |
|||
{{navTitle}} |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<!-- 居中布局 --> |
|||
<!-- ②这里不使用props改用data --> |
|||
<view v-if="navStyle==='center'&&supportCustomBar" class="_navLayout" |
|||
:style="{'background': navBackground,'height':navStatusHeight}"> |
|||
<!-- 状态栏 --> |
|||
<view :style="{'height':statusBarHeight}"></view> |
|||
<!-- 导航栏,去掉了不可用的宽度 --> |
|||
<view class="_nav-real" :style="{'height':navHeight,'width':enableWidth}"> |
|||
<!-- 按键区域，占用为不可用的宽度 --> |
|||
<view class="_navIcon" :style="{'width':disableWidth,'height':navHeight}"> |
|||
<image v-if="showIcon" src="../../static/wx_back.png" style="width: 23px;height: 23px;" |
|||
@click="clickIcon"></image> |
|||
</view> |
|||
<!-- 标题布局 --> |
|||
<view class="_nav-title" :style="{'height':navHeight,'line-height':navHeight,'font-size':fontSize}"> |
|||
{{navTitle}} |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<!-- 占位的前提，必须支持自定义导航栏 --> |
|||
<view v-if="supportCustomBar"> |
|||
<view v-if="!supportChange" :style="{'height':navStatusHeight}"></view> |
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
/** |
|||
* 全局默认背景透明，supportChange= false 会对默认色变成不透明 |
|||
*/ |
|||
const defaultTransparentBg = "linear-gradient(89.26deg, rgba(254,144,56,0) 0.75%,rgba(255,177,118,0) 99.78%)"; |
|||
|
|||
export default { |
|||
name: "NavBar", |
|||
props: { |
|||
color: { |
|||
type: String, |
|||
default: "white" |
|||
}, |
|||
// 标题 |
|||
navTitle: { |
|||
type: String, |
|||
default: "" |
|||
}, |
|||
// 是否支持透明 |
|||
supportChange: { |
|||
type: Boolean, |
|||
default: true |
|||
}, |
|||
// 背景色 |
|||
// 默认橘色渐变全透明，如果supportChange=false，默认为橘色渐变不透明 |
|||
navBg: { |
|||
type: String, |
|||
default: defaultTransparentBg |
|||
}, |
|||
// 渐变开始的高度 0->1 |
|||
startChangeHeight: { |
|||
type: Number, |
|||
default: 0 |
|||
}, |
|||
// 渐变停止的高度 |
|||
// ->1 |
|||
endChangeHeight: { |
|||
type: Number, |
|||
default: 0 |
|||
}, |
|||
// 显示icon |
|||
showIcon: { |
|||
type: Boolean, |
|||
default: true |
|||
} |
|||
}, |
|||
data() { |
|||
return { |
|||
// ①用一个新的变量接收props属性 |
|||
navBackground: this.navBg, |
|||
navStatusHeight: 0, |
|||
statusBarHeight: 0, |
|||
navHeight: 0, |
|||
disableWidth: 0, |
|||
enableWidth: 0, |
|||
fontSize: 0, |
|||
navStyle: 'left', |
|||
supportCustomBar: true, |
|||
}; |
|||
}, |
|||
mounted() { |
|||
// mounted能拿到data值 |
|||
if (!this.supportChange) { |
|||
if (this.navBg === defaultTransparentBg) { |
|||
// 使用默认的时候由于是全透明，需要改成不透明 |
|||
// ③达到修改props属性的结果 |
|||
this.navBackground = defaultTransparentBg.replaceAll(",0)", ",1)") |
|||
} |
|||
} |
|||
// 赋值样式 |
|||
this.navStyle = getApp().globalData.navInfo.navBar.style |
|||
}, |
|||
created() { |
|||
// create阶段能拿取到了props的值,需要使用this.变量名 |
|||
// 但是拿不到data的值 |
|||
// 可以拿到script标签的全局属性,不要使用this，直接变量名就可以使用 |
|||
let navInfo = getApp().globalData.navInfo |
|||
// 总高度 |
|||
this.navStatusHeight = navInfo.navStatusHeight + navInfo.unit |
|||
this.statusBarHeight = navInfo.statusBarHeight + navInfo.unit |
|||
this.navHeight = navInfo.navBar.height + navInfo.unit |
|||
this.disableWidth = navInfo.navBar.disableWidth + navInfo.unit |
|||
this.enableWidth = navInfo.navBar.enableWidth + navInfo.unit |
|||
this.fontSize = navInfo.navBar.fontSize + navInfo.unit |
|||
this.supportCustomBar = navInfo.supportCustomBar |
|||
}, |
|||
methods: { |
|||
/** |
|||
* 自定义颜色渐变的值 |
|||
*/ |
|||
alpha(res) { |
|||
if (!this.supportChange) |
|||
return '1.0' |
|||
if (res.scrollTop > this.startChangeHeight) { |
|||
// 可以开始变化了 |
|||
if (res.scrollTop < this.endChangeHeight) { |
|||
return (1 - ((this.endChangeHeight - res.scrollTop) / 100)) + '' |
|||
} else { |
|||
// 保持长显示 |
|||
return '1.0' |
|||
} |
|||
} else { |
|||
// 保持无色 |
|||
return '0.0' |
|||
} |
|||
}, |
|||
/** |
|||
* 提供默认的颜色变化功能 |
|||
*/ |
|||
defaultColorBgAlpha(res) { |
|||
let x = this.alpha(res) |
|||
this.navBackground = "linear-gradient(89.26deg, rgba(254,144,56," + x + |
|||
") 0.75%,rgba(255,177,118," + x + ") 99.78%)" |
|||
}, |
|||
clickIcon() { |
|||
// uni.navigateBack() |
|||
|
|||
const pages = getCurrentPages() |
|||
// 有可返回的页面则直接返回，uni.navigateBack 默认返回失败之后会自动刷新页面 ，无法继续返回 |
|||
if (pages.length > 1) { |
|||
uni.navigateBack(1) |
|||
return; |
|||
} else { |
|||
uni.redirectTo({ |
|||
url: '/pages/login/login' |
|||
}) |
|||
} |
|||
|
|||
return; |
|||
|
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
._navLayout { |
|||
display: flex; |
|||
flex-direction: column; |
|||
width: 100%; |
|||
z-index: 999; |
|||
top: 0; |
|||
position: fixed; |
|||
} |
|||
|
|||
._nav-real { |
|||
display: flex; |
|||
flex-direction: row; |
|||
width: 100%; |
|||
align-items: center; |
|||
} |
|||
|
|||
._nav-title { |
|||
text-align: center; |
|||
text-overflow: ellipsis; |
|||
overflow: hidden; |
|||
word-break: break-all; |
|||
white-space: nowrap; |
|||
width: 100%; |
|||
color: white; |
|||
} |
|||
|
|||
._nav-title2 { |
|||
text-overflow: ellipsis; |
|||
overflow: hidden; |
|||
word-break: break-all; |
|||
white-space: nowrap; |
|||
width: 100%; |
|||
color: white; |
|||
padding-left: 5px; |
|||
flex: 1; |
|||
} |
|||
|
|||
._navIcon { |
|||
display: flex; |
|||
flex-direction: row; |
|||
align-items: center; |
|||
padding-left: 3px; |
|||
flex-shrink: 0; |
|||
} |
|||
|
|||
._navIcon2 { |
|||
display: flex; |
|||
flex-direction: row; |
|||
align-items: center; |
|||
flex-shrink: 0; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,101 @@ |
|||
<template> |
|||
|
|||
<view class="user-item-content" @click="click"> |
|||
<view class="user-item-left"> |
|||
<image :src="src" style="width: 40rpx;height: 40rpx;" mode="aspectFit"></image> |
|||
<text class="user-item-textBlack">{{text}}</text> |
|||
</view> |
|||
<view class="user-item-right"> |
|||
<text class="user-item-textBlack2">{{notes}}</text> |
|||
<image class="user-item-right_img" src="../../static/baseIcon/zy.png"></image> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
props: { |
|||
src: { |
|||
type: String, |
|||
default: "" |
|||
}, |
|||
text: { |
|||
type: String, |
|||
default: "" |
|||
}, |
|||
notes: { |
|||
type: String, |
|||
default: "" |
|||
}, |
|||
clickId: { |
|||
type: String, |
|||
default: "0" |
|||
} |
|||
}, |
|||
data() { |
|||
return { |
|||
|
|||
}; |
|||
}, |
|||
methods: { |
|||
click() { |
|||
var clickId = this.$props.clickId; |
|||
this.$emit("click", clickId) |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss"> |
|||
.user-item-content { |
|||
width: 100%; |
|||
height: 120rpx; |
|||
display: flex; |
|||
flex-direction: row; |
|||
align-items: center; |
|||
padding-left: 40rpx; |
|||
justify-content: space-between; |
|||
border-bottom: 1px solid #f5f5f5; |
|||
box-sizing: border-box; |
|||
|
|||
.user-item-left { |
|||
display: flex; |
|||
flex-direction: row; |
|||
height: 89rpx; |
|||
align-items: center; |
|||
flex: 1; |
|||
box-sizing: border-box; |
|||
|
|||
.user-item-textBlack { |
|||
color: #333333; |
|||
margin-left: 15px; |
|||
font-size: 30rpx; |
|||
height: 89rpx; |
|||
line-height: 89rpx; |
|||
} |
|||
} |
|||
|
|||
.user-item-right { |
|||
display: flex; |
|||
flex-direction: row; |
|||
height: 89rpx; |
|||
align-items: center; |
|||
|
|||
.user-item-right_img { |
|||
width: 30rpx; |
|||
height: 30rpx; |
|||
margin-right: 35rpx; |
|||
} |
|||
|
|||
.user-item-textBlack2 { |
|||
color: #ccc; |
|||
font-size: 25rpx; |
|||
height: 89rpx; |
|||
line-height: 89rpx; |
|||
} |
|||
} |
|||
|
|||
} |
|||
</style> |
|||
@ -0,0 +1,135 @@ |
|||
<template> |
|||
<picker mode="multiSelector" :value="multiIndex" :range="multiArray" @change="handleValueChange" |
|||
@columnchange="handleColumnChange"> |
|||
<slot></slot> |
|||
</picker> |
|||
</template> |
|||
|
|||
<script> |
|||
const CHINA_REGIONS = require('./regions.json') |
|||
export default { |
|||
props: { |
|||
defaultRegions: { |
|||
type: Array, |
|||
default () { |
|||
return [] |
|||
} |
|||
}, |
|||
defaultRegionCode: { |
|||
type: String |
|||
}, |
|||
defaultRegion: [String, Array] |
|||
}, |
|||
data() { |
|||
return { |
|||
cityArr: CHINA_REGIONS[0].childs, |
|||
districtArr: CHINA_REGIONS[0].childs[0].childs, |
|||
multiIndex: [0, 0, 0], |
|||
isInitMultiArray: true, |
|||
} |
|||
}, |
|||
watch: { |
|||
defaultRegion: { |
|||
handler(region, oldRegion) { |
|||
if (Array.isArray(region)) { |
|||
// 避免传的是字面量的时候重复触发 |
|||
oldRegion = oldRegion || [] |
|||
if (region.join('') !== oldRegion.join('')) { |
|||
this.handleDefaultRegion(region) |
|||
} |
|||
} else if (region && region.length == 6) { |
|||
this.handleDefaultRegion(region) |
|||
} else { |
|||
console.warn('defaultRegion非有效格式') |
|||
} |
|||
}, |
|||
immediate: true, |
|||
} |
|||
}, |
|||
computed: { |
|||
multiArray() { |
|||
return this.pickedArr.map(arr => arr.map(item => item.name)) |
|||
}, |
|||
pickedArr() { |
|||
// 进行初始化 |
|||
if (this.isInitMultiArray) { |
|||
return [ |
|||
CHINA_REGIONS, |
|||
CHINA_REGIONS[0].childs, |
|||
CHINA_REGIONS[0].childs[0].childs |
|||
] |
|||
} |
|||
return [CHINA_REGIONS, this.cityArr, this.districtArr]; |
|||
} |
|||
}, |
|||
methods: { |
|||
handleColumnChange(e) { |
|||
// console.log(e); |
|||
this.isInitMultiArray = false; |
|||
const that = this; |
|||
let col = e.detail.column; |
|||
let row = e.detail.value; |
|||
that.multiIndex[col] = row; |
|||
try { |
|||
switch (col) { |
|||
case 0: |
|||
if (CHINA_REGIONS[that.multiIndex[0]].childs.length == 0) { |
|||
that.cityArr = that.districtArr = [CHINA_REGIONS[that.multiIndex[0]]] |
|||
break; |
|||
} |
|||
that.cityArr = CHINA_REGIONS[that.multiIndex[0]].childs |
|||
that.districtArr = CHINA_REGIONS[that.multiIndex[0]].childs[that.multiIndex[1]].childs |
|||
break; |
|||
case 1: |
|||
that.districtArr = CHINA_REGIONS[that.multiIndex[0]].childs[that.multiIndex[1]].childs |
|||
break; |
|||
case 2: |
|||
break; |
|||
} |
|||
} catch (e) { |
|||
// console.log(e); |
|||
that.districtArr = CHINA_REGIONS[that.multiIndex[0]].childs[0].childs |
|||
} |
|||
|
|||
}, |
|||
handleValueChange(e) { |
|||
// 结构赋值 |
|||
let [index0, index1, index2] = e.detail.value; |
|||
let [arr0, arr1, arr2] = this.pickedArr; |
|||
let address = [arr0[index0], arr1[index1], arr2[index2]]; |
|||
// console.log(address); |
|||
this.$emit('getRegion', address) |
|||
}, |
|||
handleDefaultRegion(region) { |
|||
const isCode = !Array.isArray(region) |
|||
this.isInitMultiArray = false; |
|||
let children = CHINA_REGIONS |
|||
for (let i = 0; i < 3; i++) { |
|||
for (let j = 0; j < children.length; j++) { |
|||
let condition = isCode ? children[j].code == region.slice(0, (i + 1) * 2) : children[j].name |
|||
.includes(region[i]); |
|||
if (condition) { |
|||
// 匹配成功进行赋值 |
|||
// console.log(i,j,children.length-1); |
|||
children = children[j].childs; |
|||
if (i == 0) { |
|||
this.cityArr = children |
|||
} else if (i == 1) { |
|||
this.districtArr = children |
|||
} |
|||
this.$set(this.multiIndex, i, j) |
|||
// console.log(this.multiIndex); |
|||
break; |
|||
} else { |
|||
// 首次匹配失败就用默认的初始化 |
|||
// console.log(i,j,children.length-1); |
|||
if (i == 0 && j == (children.length - 1)) { |
|||
this.isInitMultiArray = true; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
} |
|||
}, |
|||
} |
|||
</script> |
|||
File diff suppressed because it is too large
|
After Width: | Height: | Size: 673 B |
@ -0,0 +1,505 @@ |
|||
<template> |
|||
<view class="main"> |
|||
<view class="input" @click="showModal"> |
|||
<input v-model="_value" :style="disabled ? 'color:#c0c4cc' : ''" :placeholder="placeholder" |
|||
placeholder-style="color: #828282;" placeholder-class="zqs-select-placeholder-class" disabled /> |
|||
<!-- <image |
|||
v-if="showArrow && !_value" |
|||
src="../../static/more.png" |
|||
class="selector-icon" |
|||
></image> --> |
|||
<image src="../../static/more.png" class="selector-icon"></image> |
|||
</view> |
|||
<view class="select-modal" :class="isShowModal ? 'show' : ''" @tap="hideModal"> |
|||
<view class="select-dialog" @tap.stop="" :style="{ backgroundColor: bgColor }"> |
|||
<view class="title-main"> |
|||
<text class="title-detail">{{ title }}</text> |
|||
<image src="../../static/close2.png" class="close-icon" @click="closePop"></image> |
|||
</view> |
|||
|
|||
<view v-if="showSearch" class="search-box"> |
|||
<input class="search-input" confirm-type="search" v-model="searchInput" placeholder="输入内容进行模糊查询" |
|||
placeholder-style="color:rgba(102, 102, 102, 0.25);" /> |
|||
<text v-if="showSearchBtn" class="search-text" @click="handleSearch"> |
|||
搜索 |
|||
</text> |
|||
</view> |
|||
<view class="select-content"> |
|||
<view class="select-item" v-for="(item, index) in list" :key="index" :style=" |
|||
valueIndexOf(item) |
|||
? 'color:' + |
|||
selectColor + |
|||
';background-color:' + |
|||
selectBgColor + |
|||
';' |
|||
: 'color:' + color + ';' |
|||
" @click="select(item)"> |
|||
<view class="title">{{ getLabelKeyValue(item) }}</view> |
|||
<text class="selectIcon icongou" v-if="valueIndexOf(item)"></text> |
|||
</view> |
|||
</view> |
|||
<view class="select-bar bg-white" v-if="multiple"> |
|||
<button plain="true" class="mini-btn action" type="default" size="default" @tap="empty"> |
|||
{{ emptyText }} |
|||
</button> |
|||
<button class="mini-btn action" type="primary" size="default" @tap="confirmClick"> |
|||
{{ confirmText }} |
|||
</button> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
name: 'zqsSelect', |
|||
data() { |
|||
return { |
|||
isShowModal: false, |
|||
searchInput: '', |
|||
options: [], |
|||
} |
|||
}, |
|||
props: { |
|||
showSearch: { |
|||
// 是否显示搜索框 |
|||
type: Boolean, |
|||
default: true, |
|||
}, |
|||
value: { |
|||
type: [Number, String, Array, Object], |
|||
default: null, |
|||
}, |
|||
placeholder: { |
|||
// 占位符 |
|||
default: '', |
|||
type: String, |
|||
}, |
|||
multiple: { |
|||
// 是否多选 |
|||
default: false, |
|||
type: Boolean, |
|||
}, |
|||
list: { |
|||
default: () => [], |
|||
type: Array, |
|||
}, |
|||
valueKey: { |
|||
// 指定list中valueKey的值作为下拉框绑定内容 |
|||
default: 'value', |
|||
type: String, |
|||
}, |
|||
labelKey: { |
|||
// 指定list中labelKey的值作为下拉框显示内容 |
|||
default: 'label', |
|||
type: String, |
|||
}, |
|||
disabled: { |
|||
default: false, |
|||
type: Boolean, |
|||
}, |
|||
clearable: { |
|||
default: false, |
|||
type: Boolean, |
|||
}, |
|||
emptyText: { |
|||
default: '重置', |
|||
type: String, |
|||
}, |
|||
title: { |
|||
default: '选择内容', |
|||
type: String, |
|||
}, |
|||
confirmText: { |
|||
default: '确定', |
|||
type: String, |
|||
}, |
|||
color: { |
|||
default: '#000000', |
|||
type: String, |
|||
}, |
|||
selectColor: { |
|||
default: '#0081ff', |
|||
type: String, |
|||
}, |
|||
bgColor: { |
|||
default: '#ffffff', |
|||
type: String, |
|||
}, |
|||
selectBgColor: { |
|||
default: '#FFFFFF', |
|||
type: String, |
|||
}, |
|||
valueType: { |
|||
default: 'single', |
|||
type: String, // single || all |
|||
}, |
|||
showSearchBtn: { |
|||
default: true, |
|||
type: Boolean, // single || all |
|||
}, |
|||
showArrow: { |
|||
type: Boolean, |
|||
default: true, |
|||
}, |
|||
}, |
|||
emits: ['openDeepScroll', 'closeDeepScroll'], |
|||
computed: { |
|||
_value: { |
|||
get() { |
|||
return this.get_value(this.value) |
|||
}, |
|||
set(val) { |
|||
this.$emit('input', val) |
|||
}, |
|||
}, |
|||
}, |
|||
created() {}, |
|||
methods: { |
|||
closePop(){ |
|||
this.hideModal() |
|||
}, |
|||
handleSearch() { |
|||
this.$emit('search', this.searchInput) |
|||
}, |
|||
get_value(val) { |
|||
// 将数组值转换为以,隔开的字符串 |
|||
if (val || val === 0) { |
|||
if (Array.isArray(val)) { |
|||
let chooseAttr = [] |
|||
val.forEach((item) => { |
|||
let choose = this.list.find((temp) => { |
|||
let val_val = this.getValueKeyValue(temp) |
|||
return item === val_val |
|||
}) |
|||
// 判断是否存在 |
|||
if (choose) { |
|||
chooseAttr.push(choose) |
|||
} |
|||
}) |
|||
let values = '' |
|||
if (chooseAttr.length > 0) { |
|||
values = chooseAttr |
|||
.map((temp) => this.getLabelKeyValue(temp)) |
|||
.join(',') |
|||
} |
|||
|
|||
return values |
|||
} else { |
|||
let choose = this.list.find((temp) => { |
|||
let val_val = this.getValueKeyValue(temp) |
|||
return val === val_val |
|||
}) |
|||
if (choose) { |
|||
return this.getLabelKeyValue(choose) |
|||
} else { |
|||
return val |
|||
} |
|||
} |
|||
} else { |
|||
return '' |
|||
} |
|||
}, |
|||
select(item) { |
|||
// 点击选项 |
|||
let val = this.getValueKeyValue(item) |
|||
if (this.multiple) { |
|||
let _value = this.value |
|||
let index = _value ? _value.indexOf(val) : -1 |
|||
if (index != -1) { |
|||
_value.splice(index, 1) |
|||
this.options.splice(index, 1) |
|||
this.$emit('input', _value) |
|||
} else { |
|||
_value.push(val) |
|||
this.options.push(item) |
|||
this.$emit('input', _value) |
|||
} |
|||
this.$emit('change', item) |
|||
} else { |
|||
let label = this.getLabelKeyValue(item) |
|||
if (this._value) { |
|||
if (label.indexOf(this._value) !== -1) { |
|||
this.$emit('input', '') |
|||
} else { |
|||
this.$emit('input', val) |
|||
} |
|||
} else { |
|||
this.$emit('input', val) |
|||
} |
|||
|
|||
// 单选选中的当前项所有 |
|||
this.$emit('change', item) |
|||
this.hideModal() |
|||
} |
|||
}, |
|||
valueIndexOf(item) { |
|||
let val = this.getValueKeyValue(item) |
|||
if (Array.isArray(this.value)) { |
|||
return this.value.indexOf(val) != -1 |
|||
} else { |
|||
return this.value === val |
|||
} |
|||
}, |
|||
getLabelKeyValue(item) { |
|||
// 获取label |
|||
return item[this.labelKey] |
|||
}, |
|||
getValueKeyValue(item) { |
|||
// 获取value |
|||
return item[this.valueKey] |
|||
}, |
|||
empty() { |
|||
// 清空 |
|||
if (this.multiple) { |
|||
this.$emit('change', []) |
|||
this.$emit('input', []) |
|||
} else { |
|||
this.$emit('change', '') |
|||
this.$emit('input', '') |
|||
} |
|||
}, |
|||
// cancelClick() { |
|||
// // 点击取消 |
|||
// this.$emit('cancel', this._value) |
|||
// this.hideModal() |
|||
// }, |
|||
confirmClick() { |
|||
// 点击确定 |
|||
if (this.valueType === 'all') { |
|||
this.$emit('confirm', this.options) |
|||
} else { |
|||
this.$emit('confirm', this._value) |
|||
} |
|||
this.hideModal() |
|||
}, |
|||
showModal() { |
|||
// 显示model |
|||
if (!this.disabled) { |
|||
this.isShowModal = true |
|||
// 打开禁止穿透滚动 |
|||
this.$emit('openDeepScroll') |
|||
} |
|||
}, |
|||
hideModal() { |
|||
// 隐藏model |
|||
this.isShowModal = false |
|||
// 关闭禁止穿透滚动 |
|||
this.$emit('closeDeepScroll') |
|||
}, |
|||
}, |
|||
watch: { |
|||
searchInput(val) { |
|||
if (!this.$props.showSearchBtn) this.$emit('search', val) |
|||
}, |
|||
}, |
|||
} |
|||
</script> |
|||
<style> |
|||
@font-face { |
|||
font-family: 'selectIcon'; |
|||
src: url('//at.alicdn.com/t/font_1833441_ycfzdhg2u3.eot?t=1590375117208'); |
|||
/* IE9 */ |
|||
src: url('//at.alicdn.com/t/font_1833441_ycfzdhg2u3.eot?t=1590375117208#iefix') format('embedded-opentype'), |
|||
/* IE6-IE8 */ |
|||
url('data:application/x-font-woff2;charset=utf-8;base64,d09GMgABAAAAAAMEAAsAAAAABvQAAAK4AAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHEIGVgCDBgqBRIFCATYCJAMMCwgABCAFhQUHNRsfBsg+QCa3uoO0oAJTMwhxVu965keqWBy1hkbwtfzWb2Z279/shRhJisKF6FApKLI7oyBbpAaHo3w24k+ca9EUJbDmjaeznUdZ/FOUlkWdJ33rizZY/Pw6J5Xw0qKYxHTMesePHVT6EFpaC4zV70sKi2bYgNPc1w0WHnDVC/e/UnNTgyP+4Jq6BBpIHoisgypLaIAFEtU0wgeaIG8Yu4nAIZwnUK1QgFfOT6nUUoBpgXjj2lqplTMpiuXtCW3N2iK+aPTS2/Qdnzny8d+5IEiaDMy99exklra//FrKnX48pChmgrq5QcYRQCEe17ruqgqLAKv8WntwqwhpLms/nB5yW/iHRxJEC0QOgT3NnfgF01NBKvOuIzNoZdh5gJuAeGrsozE8vOJ7u5D832oz55039W5G+S52K0H+zNf1TJz07k26kqoQybRfwVFV4rjDS/K8EXUyuF1cXnT3weKS9Rvdm/xe7h8oA1hLwOR18R+Y4n4zwpr4z5SU089Vc+cpfWL+mn5APmT3Z39jeOs/GbWjK+DnmsuL/u6ehMX4j4yedSVkAUUuPh3TY022MtKZUEOtPqCb8Bkvnr5XT6imU0gGrEJW7aAL/gw0OhegVV2F6pC7uTOppirKIA4MFQhTrpCM+AbZlDu64L/QmAkQWlMhQXU75D07O9Gtl0PUYjTBLyAzOLNQYtypIEEjvsXtBLQTooV2nrQrGEau2gKmZlR4L8gwnGtBJbUn1diCOOQUnEkTkRAOeci9KHOQxvFro+tx3ZcGAaeljstCSBNDJuArgIyBYyy6OdZxAhHIELu1IC9AtgShCVtLltEKrSff1XoHJo3RC33hM63o3j6pSNkmqmIWEAtxFHB2OwoRBAfyeqE3r2ogHeF42dBhs7gvf7CukH5MmlUGOCpHihxFfs6TehDyKCqVAA==') format('woff2'), |
|||
url('//at.alicdn.com/t/font_1833441_ycfzdhg2u3.woff?t=1590375117208') format('woff'), |
|||
url('//at.alicdn.com/t/font_1833441_ycfzdhg2u3.ttf?t=1590375117208') format('truetype'), |
|||
/* chrome, firefox, opera, Safari, Android, iOS 4.2+ */ |
|||
url('//at.alicdn.com/t/font_1833441_ycfzdhg2u3.svg?t=1590375117208#selectIcon') format('svg'); |
|||
/* iOS 4.1- */ |
|||
} |
|||
|
|||
.title-main { |
|||
display: flex; |
|||
justify-content: center; |
|||
width: 100%; |
|||
} |
|||
|
|||
.title-detail { |
|||
display: flex; |
|||
width: 88%; |
|||
justify-content: center; |
|||
padding: 30rpx 0; |
|||
/* border-bottom: 1rpx solid #e6e1e1; */ |
|||
} |
|||
.close-icon{ |
|||
width: 20px; |
|||
height: 20px; |
|||
padding: 30rpx 0; |
|||
margin-right: 10px; |
|||
} |
|||
|
|||
.selectIcon { |
|||
font-family: 'selectIcon' !important; |
|||
font-size: 16px; |
|||
font-style: normal; |
|||
-webkit-font-smoothing: antialiased; |
|||
-moz-osx-font-smoothing: grayscale; |
|||
} |
|||
|
|||
.icongou:before { |
|||
content: '\e61c'; |
|||
} |
|||
|
|||
.iconcross:before { |
|||
content: '\e61a'; |
|||
} |
|||
</style> |
|||
<style lang="scss" scoped> |
|||
.main { |
|||
font-size: 28rpx; |
|||
} |
|||
|
|||
.bg-white { |
|||
background-color: #ffffff; |
|||
} |
|||
|
|||
.input { |
|||
display: flex; |
|||
align-items: center; |
|||
// font-size: 28rpx; |
|||
// height: 60rpx; |
|||
// padding: 10rpx 20rpx; |
|||
// border-radius: 10rpx; |
|||
// border-style: solid; |
|||
// border-width: 1rpx; |
|||
// border-color: rgba(0, 0, 0, 0.1); |
|||
|
|||
input { |
|||
flex: 1; |
|||
text-align: right; |
|||
color: #828282; |
|||
} |
|||
|
|||
.selector-icon { |
|||
width: 35rpx; |
|||
height: 35rpx; |
|||
vertical-align: middle; |
|||
margin-left: 10rpx; |
|||
} |
|||
} |
|||
|
|||
.select-modal { |
|||
position: fixed; |
|||
top: 0; |
|||
right: 0; |
|||
bottom: 0; |
|||
left: 0; |
|||
z-index: 9999; |
|||
opacity: 0; |
|||
outline: 0; |
|||
text-align: center; |
|||
-ms-transform: scale(1.185); |
|||
transform: scale(1.185); |
|||
backface-visibility: hidden; |
|||
perspective: 2000rpx; |
|||
background: rgba(0, 0, 0, 0.6); |
|||
transition: all 0.3s ease-in-out 0s; |
|||
pointer-events: none; |
|||
margin-bottom: -1000rpx; |
|||
|
|||
|
|||
&::before { |
|||
content: '\200B'; |
|||
display: inline-block; |
|||
height: 100%; |
|||
vertical-align: bottom; |
|||
} |
|||
|
|||
.select-dialog { |
|||
position: absolute; |
|||
left: 0; |
|||
bottom: 0; |
|||
display: inline-block; |
|||
margin-left: auto; |
|||
margin-right: auto; |
|||
background-color: #f8f8f8; |
|||
overflow: hidden; |
|||
width: 100%; |
|||
border-radius: 0; |
|||
border-top-left-radius: 20rpx; |
|||
border-top-right-radius: 20rpx; |
|||
|
|||
.select-content { |
|||
// background-color: #F1F1F1; |
|||
height: 60vh; |
|||
overflow: auto; |
|||
|
|||
.select-item { |
|||
text-align: left; |
|||
padding: 20rpx 80rpx; |
|||
display: flex; |
|||
|
|||
::after { |
|||
content: ''; |
|||
width: 100%; |
|||
height: 1px; |
|||
display: block; |
|||
margin: 0 auto; |
|||
border-bottom: 2px solid #f5f2f2; |
|||
padding: 1px; |
|||
} |
|||
|
|||
.title { |
|||
flex: 1; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
} |
|||
|
|||
.select-modal.show { |
|||
opacity: 1; |
|||
transition-duration: 0.3s; |
|||
-ms-transform: scale(1); |
|||
transform: scale(1); |
|||
overflow-x: hidden; |
|||
overflow-y: auto; |
|||
pointer-events: auto; |
|||
margin-bottom: 0; |
|||
} |
|||
|
|||
.select-bar { |
|||
padding: 0 80rpx; |
|||
display: flex; |
|||
position: relative; |
|||
align-items: center; |
|||
min-height: 80rpx; |
|||
justify-content: space-between; |
|||
margin-bottom: 50rpx; |
|||
|
|||
.action { |
|||
display: flex; |
|||
align-items: center; |
|||
height: 78rpx; |
|||
justify-content: center; |
|||
max-width: 100%; |
|||
padding: 0 100rpx; |
|||
} |
|||
} |
|||
|
|||
.search-box { |
|||
display: flex; |
|||
margin: 10rpx 0; |
|||
align-items: center; |
|||
padding: 10rpx 40rpx; |
|||
} |
|||
|
|||
.search-input { |
|||
flex: 1; |
|||
text-align: start; |
|||
padding-left: 20px; |
|||
// width: 560rpx; |
|||
height: 67rpx; |
|||
line-height: 67rpx; |
|||
border-radius: 40rpx; |
|||
background: #f5f2f2; |
|||
|
|||
} |
|||
|
|||
.search-text { |
|||
padding-left: 30rpx; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,64 @@ |
|||
Component({ |
|||
data: { |
|||
selected: 0, |
|||
"color": "#FFEEE1", |
|||
"selectedColor": "#FFFFFF", |
|||
"backgroundColor": "#F69448", |
|||
list: [ |
|||
// {
|
|||
// "pagePath": "/pages/home/cloudCard",
|
|||
// "text": "补充菜窖",
|
|||
// "iconPath": "/static/bomicon/bom_notCloudCard.png",
|
|||
// "selectedIconPath": "/static/bomicon/bom_cloudCard.png"
|
|||
// },
|
|||
{ |
|||
"pagePath": "/pages/home/cloudCard2", |
|||
"text": "产品分类", |
|||
"iconPath": "/static/bomicon/bom_notCloudCard.png", |
|||
"selectedIconPath": "/static/bomicon/bom_cloudCard.png" |
|||
}, |
|||
// {
|
|||
// "pagePath": "/pages/home/pickUpCard",
|
|||
// "text": "选菜窖",
|
|||
// "iconPath": "/static/bomicon/bom_notPickUp.png",
|
|||
// "selectedIconPath": "/static/bomicon/bom_pickUp.png"
|
|||
// },
|
|||
{ |
|||
"pagePath": "/pages/home/myCellar", |
|||
"text": "我的订单", |
|||
"iconPath": "/static/bomicon/bom_notPickUp.png", |
|||
"selectedIconPath": "/static/bomicon/bom_pickUp.png" |
|||
}, |
|||
|
|||
// {
|
|||
// "pagePath": "/pages/home/recordList2",
|
|||
// "text": "预约记录",
|
|||
// "iconPath": "/static/bomicon/bom_notRecordNew.png",
|
|||
// "selectedIconPath": "/static/bomicon/bom_recordNew.png"
|
|||
// }
|
|||
// ,
|
|||
|
|||
{ |
|||
"pagePath": "/pages/home/myHome", |
|||
"text": "记录查询", |
|||
"iconPath": "/static/bomicon/bom_NotMy.png", |
|||
"selectedIconPath": "/static/bomicon/bom_my.png" |
|||
} |
|||
|
|||
] |
|||
}, |
|||
attached() {}, |
|||
methods: { |
|||
switchTab(e) { |
|||
const data = e.currentTarget.dataset |
|||
const url = data.path |
|||
// console.log("ssss0",data);
|
|||
wx.switchTab({ |
|||
url |
|||
}) |
|||
// this.setData({
|
|||
// selected: data.index
|
|||
// })
|
|||
} |
|||
} |
|||
}) |
|||
@ -0,0 +1,3 @@ |
|||
{ |
|||
"component": true |
|||
} |
|||
@ -0,0 +1,7 @@ |
|||
<cover-view class="tab-bar"> |
|||
<cover-view class="tab-bar-border"></cover-view> |
|||
<cover-view wx:for="{{list}}" wx:key="index" class="tab-bar-item" data-path="{{item.pagePath}}" data-index="{{index}}" bindtap="switchTab"> |
|||
<cover-image src="{{selected === index ? item.selectedIconPath : item.iconPath}}"></cover-image> |
|||
<cover-view style="color: {{selected === index ? selectedColor : color}}">{{item.text}}</cover-view> |
|||
</cover-view> |
|||
</cover-view> |
|||
@ -0,0 +1,46 @@ |
|||
.tab-bar { |
|||
pointer-events: auto; |
|||
position: absolute; |
|||
bottom: 0; |
|||
left: 0; |
|||
right: 0; |
|||
height: 50px; |
|||
/* background: #F69448; */ |
|||
display: flex; |
|||
padding-top: 5px; |
|||
padding-bottom: 5px; |
|||
/* 加载背景图 */ |
|||
background-image: url(https://supervise.yxtsoft.com/lpk/image/bom_navigation.png); |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
background-size: 100% 100%; |
|||
/* padding-bottom: env(safe-area-inset-bottom); */ |
|||
} |
|||
|
|||
.tab-bar-border { |
|||
background-color: rgba(246, 148, 72, 0.3); |
|||
position: absolute; |
|||
left: 0; |
|||
top: 0; |
|||
width: 100%; |
|||
height: 1px; |
|||
transform: scaleY(0.5); |
|||
} |
|||
|
|||
.tab-bar-item { |
|||
flex: 1; |
|||
text-align: center; |
|||
display: flex; |
|||
justify-content: center; |
|||
align-items: center; |
|||
flex-direction: column; |
|||
} |
|||
|
|||
.tab-bar-item cover-image { |
|||
width: 27px; |
|||
height: 27px; |
|||
} |
|||
|
|||
.tab-bar-item cover-view { |
|||
margin-top: 3px; |
|||
font-size: 10px; |
|||
} |
|||
@ -0,0 +1,20 @@ |
|||
<!DOCTYPE html> |
|||
<html lang="en"> |
|||
<head> |
|||
<meta charset="UTF-8" /> |
|||
<script> |
|||
var coverSupport = 'CSS' in window && typeof CSS.supports === 'function' && (CSS.supports('top: env(a)') || |
|||
CSS.supports('top: constant(a)')) |
|||
document.write( |
|||
'<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0' + |
|||
(coverSupport ? ', viewport-fit=cover' : '') + '" />') |
|||
</script> |
|||
<title></title> |
|||
<!--preload-links--> |
|||
<!--app-context--> |
|||
</head> |
|||
<body> |
|||
<div id="app"><!--app-html--></div> |
|||
<script type="module" src="/main.js"></script> |
|||
</body> |
|||
</html> |
|||
@ -0,0 +1,65 @@ |
|||
import App from './App' |
|||
import Vue from 'vue' |
|||
|
|||
// vuex
|
|||
import store from './store' |
|||
|
|||
import api from '@/common/request.api.js' |
|||
Vue.prototype.$api = api |
|||
|
|||
Vue.config.productionTip = false |
|||
App.mpType = 'app' |
|||
|
|||
import { |
|||
stringIsEmpty, |
|||
stringIsNotEmpty |
|||
} from "@/common/empty.js" |
|||
Vue.prototype.stringIsEmpty = stringIsEmpty |
|||
Vue.prototype.stringIsNotEmpty = stringIsNotEmpty |
|||
|
|||
import { |
|||
getQueryString, |
|||
} from "@/common/getQuery.js" |
|||
Vue.prototype.getQueryString = getQueryString |
|||
|
|||
import { |
|||
shortToast, |
|||
longToast |
|||
} from "@/common/toast.js" |
|||
Vue.prototype.shortToast = shortToast |
|||
Vue.prototype.longToast = longToast |
|||
|
|||
import { |
|||
timeText, |
|||
timeFormat, |
|||
currentMillions, |
|||
getWeekStr, |
|||
getTodayEndTime |
|||
} from "./common/Time.js" |
|||
Vue.prototype.TimeText = timeText |
|||
Vue.prototype.TimeFormat = timeFormat |
|||
Vue.prototype.GetWeekStr = getWeekStr |
|||
Vue.prototype.CurrentMillions = currentMillions |
|||
Vue.prototype.GetTodayEndTime = getTodayEndTime |
|||
|
|||
|
|||
import bus from './common/bus.js'; |
|||
|
|||
//挂载到this上
|
|||
Vue.prototype.$bus = bus; |
|||
|
|||
|
|||
import {pay} from './uni_modules/common-pay/utils/pay.js' |
|||
//挂载到this上
|
|||
Vue.prototype.$pay = pay; |
|||
|
|||
|
|||
import {convertPrice} from './common/price.js' |
|||
//挂载到this上
|
|||
Vue.prototype.convertPrice = convertPrice; |
|||
|
|||
const app = new Vue({ |
|||
store, |
|||
...App |
|||
}) |
|||
app.$mount() |
|||
@ -0,0 +1,75 @@ |
|||
{ |
|||
"name" : "yxt-yyth", |
|||
"appid" : "__UNI__1500881", |
|||
"description" : "", |
|||
"versionName" : "1.0.1", |
|||
"versionCode" : 101, |
|||
"transformPx" : false, |
|||
/* 5+App特有相关 */ |
|||
"app-plus" : { |
|||
"usingComponents" : true, |
|||
"nvueStyleCompiler" : "uni-app", |
|||
"compilerVersion" : 3, |
|||
"splashscreen" : { |
|||
"alwaysShowBeforeRender" : true, |
|||
"waiting" : true, |
|||
"autoclose" : true, |
|||
"delay" : 0 |
|||
}, |
|||
/* 模块配置 */ |
|||
"modules" : {}, |
|||
/* 应用发布信息 */ |
|||
"distribute" : { |
|||
/* android打包配置 */ |
|||
"android" : { |
|||
"permissions" : [ |
|||
"<uses-permission android:name=\"android.permission.CHANGE_NETWORK_STATE\"/>", |
|||
"<uses-permission android:name=\"android.permission.MOUNT_UNMOUNT_FILESYSTEMS\"/>", |
|||
"<uses-permission android:name=\"android.permission.VIBRATE\"/>", |
|||
"<uses-permission android:name=\"android.permission.READ_LOGS\"/>", |
|||
"<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>", |
|||
"<uses-feature android:name=\"android.hardware.camera.autofocus\"/>", |
|||
"<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>", |
|||
"<uses-permission android:name=\"android.permission.CAMERA\"/>", |
|||
"<uses-permission android:name=\"android.permission.GET_ACCOUNTS\"/>", |
|||
"<uses-permission android:name=\"android.permission.READ_PHONE_STATE\"/>", |
|||
"<uses-permission android:name=\"android.permission.CHANGE_WIFI_STATE\"/>", |
|||
"<uses-permission android:name=\"android.permission.WAKE_LOCK\"/>", |
|||
"<uses-permission android:name=\"android.permission.FLASHLIGHT\"/>", |
|||
"<uses-feature android:name=\"android.hardware.camera\"/>", |
|||
"<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>" |
|||
] |
|||
}, |
|||
/* ios打包配置 */ |
|||
"ios" : {}, |
|||
/* SDK配置 */ |
|||
"sdkConfigs" : {} |
|||
} |
|||
}, |
|||
/* 快应用特有相关 */ |
|||
"quickapp" : {}, |
|||
/* 小程序特有相关 */ |
|||
"mp-weixin" : { |
|||
"appid" : "wx4724e3a3c27f36b5", |
|||
"setting" : { |
|||
"urlCheck" : false, |
|||
"postcss" : true, |
|||
"minified" : true |
|||
}, |
|||
"usingComponents" : true, |
|||
"lazyCodeLoading" : "requiredComponents" |
|||
}, |
|||
"mp-alipay" : { |
|||
"usingComponents" : true |
|||
}, |
|||
"mp-baidu" : { |
|||
"usingComponents" : true |
|||
}, |
|||
"mp-toutiao" : { |
|||
"usingComponents" : true |
|||
}, |
|||
"uniStatistics" : { |
|||
"enable" : false |
|||
}, |
|||
"vueVersion" : "2" |
|||
} |
|||
@ -0,0 +1,488 @@ |
|||
{ |
|||
"pages": [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages |
|||
|
|||
{ |
|||
"path": "pages/login/login", |
|||
"style": { |
|||
"navigationBarTitleText": "", |
|||
"enablePullDownRefresh": false |
|||
} |
|||
}, |
|||
{ |
|||
"path": "pages/home/cloudCard", |
|||
"style": { |
|||
"navigationStyle": "custom" |
|||
} |
|||
}, |
|||
{ |
|||
"path": "pages/home/cloudCard2", |
|||
"style": { |
|||
"navigationStyle": "custom" |
|||
} |
|||
}, |
|||
{ |
|||
"path": "pages/card/card_detail", |
|||
"style": { |
|||
"navigationStyle": "custom" |
|||
} |
|||
}, |
|||
{ |
|||
"path": "pages/card/card_detail2", |
|||
"style": { |
|||
"navigationStyle": "custom" |
|||
} |
|||
}, |
|||
{ |
|||
"path": "pages/home/personCard", |
|||
"style": { |
|||
"navigationStyle": "custom" |
|||
|
|||
|
|||
} |
|||
}, |
|||
{ |
|||
"path": "pages/home/giftCard", |
|||
"style": { |
|||
"navigationStyle": "custom" |
|||
|
|||
|
|||
} |
|||
}, |
|||
{ |
|||
"path": "pages/home/pickUpCard", |
|||
"style": { |
|||
"navigationStyle": "custom" |
|||
|
|||
|
|||
} |
|||
}, |
|||
|
|||
|
|||
|
|||
|
|||
{ |
|||
"path": "pages/bind/bind_pickUpCard", |
|||
"style": { |
|||
"navigationStyle": "custom" |
|||
} |
|||
}, |
|||
{ |
|||
"path": "pages/bind/bind_pickUpCard2", |
|||
"style": { |
|||
"navigationStyle": "custom" |
|||
} |
|||
}, |
|||
|
|||
{ |
|||
"path": "pages/bind/bind_personCard", |
|||
"style": { |
|||
"navigationStyle": "custom" |
|||
} |
|||
}, |
|||
|
|||
// 扫码进入 |
|||
{ |
|||
"path": "pages/bind/bind_personCard2", |
|||
"style": { |
|||
"navigationStyle": "custom" |
|||
} |
|||
}, |
|||
|
|||
|
|||
{ |
|||
"path": "pages/bind/bind_giftCard", |
|||
"style": { |
|||
"navigationStyle": "custom" |
|||
} |
|||
}, |
|||
|
|||
// 扫码进入 |
|||
{ |
|||
"path": "pages/bind/bind_giftCard2", |
|||
"style": { |
|||
"navigationStyle": "custom" |
|||
} |
|||
}, |
|||
|
|||
{ |
|||
"path": "pages/bind/bind_enterpriseCard", |
|||
"style": { |
|||
"navigationStyle": "custom" |
|||
} |
|||
}, |
|||
{ |
|||
"path": "pages/bind/bind_enterpriseCard2", |
|||
"style": { |
|||
"navigationStyle": "custom" |
|||
} |
|||
}, |
|||
{ |
|||
"path": "pages/index/BindPhone", |
|||
"style": { |
|||
"navigationBarTitleText": "绑定账号", |
|||
"navigationStyle": "custom", |
|||
"app-plus": { |
|||
"scrollIndicator": false //禁用原生导航栏, |
|||
} |
|||
} |
|||
}, |
|||
|
|||
|
|||
{ |
|||
"path": "pages/home/recordList", |
|||
"style": { |
|||
"navigationBarTitleText": "预约记录" |
|||
} |
|||
}, |
|||
{ |
|||
"path": "pages/home/recordList2", |
|||
"style": { |
|||
"navigationBarTitleText": "预约记录" |
|||
} |
|||
}, |
|||
{ |
|||
"path": "pages/good/goodsDetail", |
|||
"style": { |
|||
"navigationBarTitleText": "产品详情", |
|||
"enablePullDownRefresh": false |
|||
|
|||
} |
|||
}, |
|||
{ |
|||
"path": "pages/good/goodsDetail2", |
|||
"style": { |
|||
"navigationBarTitleText": "产品详情", |
|||
"enablePullDownRefresh": false |
|||
|
|||
} |
|||
}, |
|||
{ |
|||
"path": "pages/SelectAddressActivity", |
|||
"style": { |
|||
"navigationBarTitleText": "提货点列表", |
|||
"enablePullDownRefresh": false |
|||
} |
|||
}, |
|||
{ |
|||
"path": "pages/home/corporateCard", |
|||
"style": { |
|||
"navigationStyle": "custom" |
|||
} |
|||
}, |
|||
{ |
|||
"path": "pages/enterprise/corporate_card_detail", |
|||
"style": { |
|||
"navigationStyle": "custom" |
|||
} |
|||
}, |
|||
{ |
|||
"path": "pages/enterprise/corporate_card_detail2", |
|||
"style": { |
|||
"navigationStyle": "custom" |
|||
} |
|||
}, |
|||
{ |
|||
"path": "pages/enterprise/welfare_card_detail", |
|||
"style": { |
|||
"navigationStyle": "custom" |
|||
} |
|||
}, |
|||
{ |
|||
"path": "pages/enterprise/welfare_card_detail2", |
|||
"style": { |
|||
"navigationStyle": "custom" |
|||
} |
|||
}, |
|||
|
|||
|
|||
{ |
|||
"path": "pages/detail/detail_affeection", |
|||
"style": { |
|||
"navigationStyle": "custom" |
|||
} |
|||
}, |
|||
{ |
|||
"path": "pages/detail/detail_affeection2", |
|||
"style": { |
|||
"navigationStyle": "custom" |
|||
} |
|||
}, |
|||
{ |
|||
"path": "pages/detail/detail_family", |
|||
"style": { |
|||
"navigationStyle": "custom" |
|||
} |
|||
}, |
|||
{ |
|||
"path": "pages/detail/detail_family2", |
|||
"style": { |
|||
"navigationStyle": "custom" |
|||
} |
|||
}, |
|||
{ |
|||
"path": "pages/detail/detail_enterprise", |
|||
"style": { |
|||
"navigationStyle": "custom" |
|||
} |
|||
}, |
|||
{ |
|||
"path": "pages/detail/detail_enterprise2", |
|||
"style": { |
|||
"navigationStyle": "custom" |
|||
} |
|||
}, |
|||
{ |
|||
"path": "pages/cloud/detail_cloudCard", |
|||
"style": { |
|||
"navigationStyle": "custom" |
|||
} |
|||
}, |
|||
{ |
|||
"path": "pages/cloud/optionalCard", |
|||
"style": { |
|||
"navigationStyle": "custom" |
|||
} |
|||
}, |
|||
{ |
|||
"path": "uni_modules/common-pay/pages/pay/pay", |
|||
"style": { |
|||
"navigationBarTitleText": "支付订单", |
|||
"backgroundColor": "#F8F8F8" |
|||
} |
|||
}, |
|||
|
|||
{ |
|||
"path": "uni_modules/common-pay/pages/success/success", |
|||
"style": { |
|||
"navigationBarTitleText": "支付完成", |
|||
"backgroundColor": "#F8F8F8" |
|||
} |
|||
}, |
|||
|
|||
{ |
|||
"path": "pages/home/myHome", |
|||
"style": { |
|||
"navigationStyle": "custom", |
|||
"disableScroll": true |
|||
} |
|||
}, |
|||
{ |
|||
"path": "pages/good/shoppCart", |
|||
"style": { |
|||
"navigationBarTitleText": "购菜车", |
|||
"enablePullDownRefresh": false |
|||
} |
|||
}, |
|||
{ |
|||
"path": "pages/home/myCellar", |
|||
"style": { |
|||
"navigationStyle": "custom" |
|||
} |
|||
}, { |
|||
"path": "pages/me/base_info", |
|||
"style": { |
|||
"navigationStyle": "custom", |
|||
"disableScroll": true |
|||
} |
|||
}, { |
|||
"path": "pages/me/RealInfo", |
|||
"style": { |
|||
"navigationStyle": "custom", |
|||
"disableScroll": true |
|||
} |
|||
}, |
|||
{ |
|||
"path": "pages/good/reservation", |
|||
"style": { |
|||
"navigationStyle": "custom", |
|||
"disableScroll": true |
|||
} |
|||
}, |
|||
{ |
|||
"path": "pages/good/changePersonnel", |
|||
"style": { |
|||
"navigationStyle": "custom" |
|||
} |
|||
}, |
|||
{ |
|||
"path": "pages/records/reservationRecords", |
|||
"style": { |
|||
"navigationBarTitleText": "预约记录", |
|||
"enablePullDownRefresh": false |
|||
} |
|||
}, |
|||
{ |
|||
"path": "pages/records/transferRecords", |
|||
"style": { |
|||
"navigationBarTitleText": "转赠记录", |
|||
"enablePullDownRefresh": false |
|||
} |
|||
}, |
|||
{ |
|||
"path": "pages/records/transferRecords2", |
|||
"style": { |
|||
"navigationBarTitleText": "转赠记录", |
|||
"enablePullDownRefresh": false |
|||
} |
|||
}, |
|||
{ |
|||
"path": "pages/records/reservationRecords2", |
|||
"style": { |
|||
"navigationBarTitleText": "预约记录", |
|||
"enablePullDownRefresh": false |
|||
} |
|||
}, |
|||
{ |
|||
|
|||
"path": "pages/records/reservationRecords3", |
|||
"style": { |
|||
"navigationBarTitleText": "预约记录", |
|||
"enablePullDownRefresh": false |
|||
} |
|||
}, |
|||
{ |
|||
|
|||
"path": "pages/records/reservationRecords4", |
|||
"style": { |
|||
"navigationBarTitleText": "预约记录", |
|||
"enablePullDownRefresh": false |
|||
} |
|||
}, |
|||
|
|||
{ |
|||
"path": "pages/bind/bind_cloudCard", |
|||
"style": { |
|||
"navigationStyle": "custom" |
|||
} |
|||
}, |
|||
{ |
|||
"path": "pages/records/orderRecords", |
|||
"style": { |
|||
"navigationBarTitleText": "我的订单", |
|||
"disableScroll": true |
|||
} |
|||
}, |
|||
{ |
|||
"path": "pages/records/orderDetail", |
|||
"style": { |
|||
"navigationBarTitleText": "订单详情" |
|||
} |
|||
}, |
|||
{ |
|||
"path": "pages/good/transfer", |
|||
"style": { |
|||
"navigationBarTitleText": "转赠亲友", |
|||
"disableScroll": true |
|||
} |
|||
}, |
|||
{ |
|||
"path": "pages/home/newUserPlay", |
|||
"style": { |
|||
"navigationStyle": "custom" |
|||
} |
|||
}, |
|||
{ |
|||
"path": "pages/records/recommendRecords", |
|||
"style": { |
|||
"navigationStyle": "custom", |
|||
"disableScroll": true |
|||
} |
|||
}, |
|||
{ |
|||
"path": "pages/me/authentication", |
|||
"style": { |
|||
"navigationStyle": "custom", |
|||
"disableScroll": true |
|||
} |
|||
}, { |
|||
"path": "pages/me/makeInvoice", |
|||
"style": { |
|||
"navigationBarTitleText": "开具发票", |
|||
"disableScroll": true |
|||
} |
|||
}, |
|||
{ |
|||
"path": "pages/me/addInvoice", |
|||
"style": { |
|||
"navigationBarTitleText": "新增发票", |
|||
"disableScroll": true |
|||
} |
|||
}, |
|||
{ |
|||
"path": "pages/me/applyRefund", |
|||
"style": { |
|||
"navigationBarTitleText": "申请退款", |
|||
"disableScroll": true |
|||
} |
|||
}, |
|||
{ |
|||
"path": "pages/me/refundDetail", |
|||
"style": { |
|||
"navigationBarTitleText": "退款详情", |
|||
"disableScroll": true |
|||
} |
|||
}, |
|||
{ |
|||
"path": "pages/records/invalidGoods", |
|||
"style": { |
|||
"navigationBarTitleText": "失效商品", |
|||
"enablePullDownRefresh": false |
|||
} |
|||
} |
|||
|
|||
|
|||
], |
|||
"globalStyle": { |
|||
"navigationBarTextStyle": "white", |
|||
"navigationBarTitleText": "惠享云菜窖", |
|||
"navigationBarBackgroundColor": "#FE9039", |
|||
"backgroundColor": "#FE9039" |
|||
}, |
|||
"tabBar": { |
|||
"custom": true, //自定义tabBar |
|||
"color": "#FFEEE1", |
|||
"selectedColor": "#191919", |
|||
"borderStyle": "white", |
|||
"backgroundColor": "#F69448", |
|||
"list": [ |
|||
// { |
|||
// "pagePath": "pages/home/cloudCard", |
|||
// "text": "补充菜窖", |
|||
// "iconPath": "static/bomicon/bom_notCloudCard.png", |
|||
// "selectedIconPath": "static/bomicon/bom_cloudCard.png" |
|||
// }, |
|||
{ |
|||
"pagePath": "pages/home/cloudCard2", |
|||
"text": "补充菜窖", |
|||
"iconPath": "static/bomicon/bom_notCloudCard.png", |
|||
"selectedIconPath": "static/bomicon/bom_cloudCard.png" |
|||
}, |
|||
// { |
|||
// "pagePath": "pages/home/pickUpCard", |
|||
// "text": "选菜窖", |
|||
// "iconPath": "static/bomicon/bom_notPickUp.png", |
|||
// "selectedIconPath": "static/bomicon/bom_pickUp.png" |
|||
// }, |
|||
{ |
|||
"pagePath": "pages/home/myCellar", |
|||
"text": "我的菜窖", |
|||
"iconPath": "static/bomicon/bom_notPickUp.png", |
|||
"selectedIconPath": "static/bomicon/bom_pickUp.png" |
|||
}, |
|||
// { |
|||
// "pagePath": "pages/home/recordList2", |
|||
// "text": "预约记录", |
|||
// "iconPath": "static/bomicon/bom_notRecordNew.png", |
|||
// "selectedIconPath": "static/bomicon/bom_recordNew.png" |
|||
// } |
|||
{ |
|||
"pagePath": "pages/home/myHome", |
|||
"text": "我的", |
|||
"iconPath": "static/bomicon/bom_NotMy.png", |
|||
"selectedIconPath": "static/bomicon/bom_my.png" |
|||
} |
|||
|
|||
] |
|||
}, |
|||
"uniIdRouter": {} |
|||
} |
|||
@ -0,0 +1,244 @@ |
|||
<template> |
|||
<view> |
|||
<view style="position: sticky;top: 0;background-color: #FE9039;"> |
|||
<view class="search-container"> |
|||
<!-- 搜索框 --> |
|||
<view class="search-container-bar"> |
|||
<!-- :cancelText="keyBoardPopup ? '取消' : '搜索'" --> |
|||
<uni-search-bar ref="searchBar" style="flex:1;margin-left: 20rpx;" radius="100" |
|||
v-model="associativeText" :focus="focus" :placeholder="hotWorld" clearButton="auto" |
|||
cancelButton="none" @clear="clear" /> |
|||
<view v-if="stringIsNotEmpty(associativeText) && associativeText!=page.key" @click="search" |
|||
style="margin-right: 10px; padding: 3px 8px; font-size: 18px; color: #fff;">搜索</view> |
|||
</view> |
|||
</view> |
|||
<!-- <view class="search-body"> |
|||
<view |
|||
style="font-size: 26rpx;padding-left: 50rpx;padding-right: 40rpx;padding-top: 10rpx;padding-bottom: 20rpx;color: #FED6B5;"> |
|||
输入关键字筛选提货点 |
|||
</view> |
|||
</view> --> |
|||
</view> |
|||
|
|||
|
|||
<loading-state ref="pageView" @request="request"> |
|||
<!-- 搜索联想 --> |
|||
<view style="display: flex;flex-direction: column;background: #FFFFFF; |
|||
border-top-left-radius: 30px;border-top-right-radius: 30px; padding:10px 20px;margin-top: 10px;box-sizing: border-box;padding-bottom: 0px;" |
|||
v-for="(item,index) in dataList" :key="index"> |
|||
<!-- |
|||
<view |
|||
style="display: flex;flex-direction: row;width: 100%;box-sizing: border-box;width: 100%;margin-top:10rpx ;align-items: center;"> |
|||
<image src="../static/address_name.png" style="width: 50rpx;height: 50rpx;flex-shrink: 0;"> |
|||
</image> |
|||
<text |
|||
style="font-size: 31.5rpx;margin-left: 18rpx;overflow: hidden;text-overflow:ellipsis;white-space: nowrap;">{{item.name}} |
|||
</text> |
|||
</view> |
|||
|
|||
<text |
|||
style="font-size: 24rpx;color: #999999;margin-top: 6rpx;box-sizing: border-box;width: 100%;display:inline-block;white-space: pre-wrap; word-wrap: break-word;height: auto;">营业时间：{{item.businessHours}}</text> |
|||
|
|||
<view style="display: flex;flex-direction: row;margin-top: 22rpx;"> |
|||
<image v-if="false" |
|||
style="width: 120rpx;height: 120rpx;border-radius: 20rpx;flex-shrink: 0;background-color: #fafafa;"> |
|||
</image> |
|||
<view style="display: flex;flex: 1;flex-direction: column;margin-left: 20rpx;margin-top: 10rpx;"> |
|||
<view style="display: flex;flex-direction: row;"> |
|||
<image src="../static/address_location.png" |
|||
style="width: 16px;height: 16px;flex-shrink: 0;margin-right: 3px;"> |
|||
</image> |
|||
<view style="color: #666666;font-size: 29.5rpx;">{{item.address}} |
|||
</view> |
|||
</view> |
|||
<view style="display: flex;flex-direction: row;margin-top: 22rpx;"> |
|||
<image src="../static/address_phone.png" |
|||
style="width: 16px;height: 16px;margin-right: 3px;flex-shrink: 0;"> |
|||
</image> |
|||
<view style="color: #5259D7;font-size: 29.5rpx;">{{item.phone}}</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
<view style="display: flex;flex-direction: row;margin-top: 38rpx;border-top: 1rpx #f1f2f3 solid;"> |
|||
<view style="flex: 1;"></view> |
|||
|
|||
<view class="btn" style="flex-shrink: 0;font-size: 30rpx;color: #191919;" |
|||
@click.stop="phone(item.phone)"> |
|||
<image src="../static/address_phone2.png" style="width: 18px;height: 18px;"></image> |
|||
<view style="font-size: 13px;margin-left: 6px;">电话</view> |
|||
</view> |
|||
<view class="btn" style="flex-shrink: 0;font-size: 30rpx;color: #191919;" |
|||
@click.stop="confirm(item)"> |
|||
<image src="../static/address_confirm.png" style="width: 18px;height: 18px;"></image> |
|||
<view style="font-size: 13px;margin-left: 6px;">确定</view> |
|||
</view> |
|||
</view> --> |
|||
|
|||
<text style="font-size: 18px;font-weight: 600;font-family: sans-serif;color: 333;">{{item.name}}</text> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 8px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/date.png" style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text style="margin-left: 5px;font-size: 12px; color: #999;">营业时间：{{item.businessHours}}</text> |
|||
</view> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 8px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/location.png" style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text style="margin-left: 5px;font-size: 12px; color: #999;flex: 1;">门店地址：{{item.address}}</text> |
|||
<!-- <image src="https://supervise.yxtsoft.com/lpk/image/navigation.png" |
|||
style="width: 20px;height: 20px; margin-right: 20px;"></image> --> |
|||
</view> |
|||
|
|||
<view style="display: flex;flex-direction: row;margin-top: 38rpx;border-top: 1rpx #f1f2f3 solid; justify-content: space-between; |
|||
padding-left: 30px;padding-right:30px;"> |
|||
|
|||
<view class="btn" @click.stop="phone(item.phone)"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/phone.png" style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text style="margin-left: 5px;font-size: 14px; color: #666;">电话咨询</text> |
|||
</view> |
|||
|
|||
<view class="btn" @click.stop="confirm(item)"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/user.png" style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text style="margin-left: 5px;font-size: 14px; color: #666;">预约自提</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</loading-state> |
|||
<view style="height: 20px;"></view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
page: { |
|||
key: '' |
|||
}, |
|||
associativeText: '', |
|||
hotWorld: '输入关键字搜索提货点', // 搜索热词，如果没有输入即回车，则搜索热词，但是不会加入搜索记录 |
|||
focus: true, // 是否自动聚焦 |
|||
dataList: [] |
|||
} |
|||
}, |
|||
created() { |
|||
// 首次请求 |
|||
this.request() |
|||
|
|||
// #ifdef APP-PLUS |
|||
uni.onKeyboardHeightChange((res) => { |
|||
this.keyBoardPopup = res.height !== 0; |
|||
}) |
|||
// #endif |
|||
}, |
|||
methods: { |
|||
search() { |
|||
this.page.key = this.associativeText |
|||
this.request() |
|||
}, |
|||
phone(num) { |
|||
uni.makePhoneCall({ |
|||
phoneNumber: num |
|||
}); |
|||
}, |
|||
confirm(item) { |
|||
uni.$emit('address', item) |
|||
uni.navigateBack() |
|||
}, |
|||
request() { |
|||
this.$nextTick(() => { |
|||
this.$refs.pageView.setLoadState(0) |
|||
}) |
|||
let _this = this |
|||
_this.$api.address({ |
|||
'name': this.page.key |
|||
}).then((resp) => { |
|||
_this.dataList = resp |
|||
if (resp.length == 0) { |
|||
_this.$nextTick(() => { |
|||
_this.$refs.pageView.setLoadState(100) |
|||
}) |
|||
} else { |
|||
_this.$nextTick(() => { |
|||
_this.$refs.pageView.setLoadState(2) |
|||
}) |
|||
} |
|||
}).catch(e => { |
|||
_this.$nextTick(() => { |
|||
_this.$refs.pageView.setLoadState(1) |
|||
}) |
|||
}) |
|||
}, |
|||
clear(res) { |
|||
this.page.key = '' |
|||
this.request() |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
|
|||
<style lang="scss"> |
|||
uni-page-body, |
|||
page { |
|||
background: #f3f4f6; |
|||
} |
|||
|
|||
.btn { |
|||
margin-top: 10px; |
|||
border: 1px solid #FEA561; |
|||
border-radius: 20px; |
|||
display: flex;flex-direction: row; |
|||
align-items: center; |
|||
justify-content: center; |
|||
padding: 5px 10px; |
|||
margin-bottom: 10px; |
|||
} |
|||
|
|||
.search-body { |
|||
background-color: #FE9039; |
|||
border-bottom-right-radius: 10px; |
|||
border-bottom-left-radius: 10px; |
|||
} |
|||
|
|||
@mixin uni-flex { |
|||
/* #ifndef APP-NVUE */ |
|||
display: flex; |
|||
/* #endif */ |
|||
} |
|||
|
|||
$search-bar-height: 52px; |
|||
$word-container_header-height: 72rpx; |
|||
|
|||
.search-container { |
|||
height: $search-bar-height; |
|||
@include uni-flex; |
|||
flex-direction: column; |
|||
justify-content: center; |
|||
align-items: center; |
|||
position: relative; |
|||
background: white; |
|||
|
|||
@at-root { |
|||
#{&}-bar { |
|||
@include uni-flex; |
|||
flex-direction: row; |
|||
justify-content: center; |
|||
align-items: center; |
|||
position: absolute; |
|||
top: 0; |
|||
left: 0; |
|||
right: 0; |
|||
background: #FE9039; |
|||
} |
|||
} |
|||
} |
|||
</style> |
|||
@ -0,0 +1,280 @@ |
|||
<template> |
|||
<view style="display: flex;flex-direction: column;background-color: #fff;height: 100%;"> |
|||
|
|||
<view class="top"> |
|||
<NavBar ref="nav" navTitle=" " :showIcon="true" :start-change-height="page.startHeight" |
|||
:end-change-height="page.endHeight"> |
|||
</NavBar> |
|||
<view> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/bind_bj_new1.png" mode="scaleToFill" |
|||
style="width: 100%;height: 70vw"></image> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view |
|||
style="height: calc(100vh - 75vw - 98px); overflow: scroll; padding-left: 12px;padding-right: 12px;padding-bottom: 24px;box-sizing: border-box;"> |
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<view style="background: #FF9D33; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<view style="background: #FFDAB2; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<text style="margin-left: 8px;font-size: 18px;color: #333;">好友赠与的礼品</text> |
|||
</view> |
|||
<view v-for="(item,index) in data.list" |
|||
style="display: flex;flex-direction: row;width: 100%;margin-top: 5px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;justify-content: space-between;width: 100%; |
|||
padding-left: 20px;padding-right: 20px;margin-top: 8px;"> |
|||
<!-- <text style="font-size: 12px;color: #666;">{{item.goodsName}}</text> |
|||
<text style="font-size: 12px;color: #666;">{{item.remarks}}</text> --> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;box-sizing: border-box;"> |
|||
|
|||
<image :src="item.goodsPicUrl" mode="aspectFill" @click="itemClick(item.goodsSid)" |
|||
style="width: 90px;height: 90px;border-radius: 10px;flex-shrink: 0;"></image> |
|||
|
|||
<view style="display: flex;flex-direction: column;margin-left:16px;box-sizing: border-box;"> |
|||
|
|||
<text style="color: #000;font-size: 14px;font-weight: 600;font-family: sans-serif;" |
|||
@click="itemClick(item.goodsSid)">{{item.goodsName}}</text> |
|||
<text style="margin-top: 6px;color: #999;font-size: 12px;">{{item.goodsContent}}</text> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 15px;"> |
|||
|
|||
<text style="color: #E36443;font-size: 12px;">{{item.goodsFs}}</text> |
|||
<text style="color: #E36443;margin-left: 10px;font-size: 12px;">{{item.goodsJs}}</text> |
|||
<!-- <text |
|||
style="margin-left: 10px;color: #E36443;border: 1px #E36443 solid;border-radius: 8px;padding: 1px 10px;font-size: 12px;">{{item.price}}</text> --> |
|||
|
|||
|
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 10px;" |
|||
v-if="data.remarks!=''"> |
|||
<view style="background: #FF9D33; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<view style="background: #FFDAB2; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<text style="margin-left: 8px;font-size: 18px;color: #333;">转赠留言</text> |
|||
</view> |
|||
|
|||
<text v-if="data.remarks!=''" |
|||
style="margin-top: 12px; padding-left: 20px;padding-right: 20px;text-indent: 2em;font-size: 16px;color: #333; |
|||
overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;">{{data.remarks}}</text> |
|||
|
|||
|
|||
</view> |
|||
|
|||
<view v-if="codeType" style="position: absolute; bottom: 24px; display: flex;flex-direction: column;width: 100%; |
|||
padding-left: 21.5px;padding-right: 21.5px;box-sizing: border-box;border-top: 1px solid #EFEFEF; "> |
|||
|
|||
<text |
|||
style=" text-align: center;width: 100%;color: #4F4F4F;font-size: 12px;margin-top: 12px;">温馨提示:您的好友赠送您一份心意，请接收。</text> |
|||
<view style="background: -webkit-linear-gradient(left,#FFB176,#FE923B); |
|||
width: 100%;border-radius: 25px;height: 50px;text-align: center; |
|||
margin-top: 12px;line-height: 50px;color: #FFFFFF;font-size: 16px;" @click="save"> |
|||
接收</view> |
|||
</view> |
|||
|
|||
|
|||
<!-- 恢复预约提货弹框 --> |
|||
<view class="model" catchtouchmove='preventTouchMove' v-if='showModal'></view> |
|||
<view class="modalDlg2" catchtouchmove='preventTouchMove' v-if='showModal'> |
|||
|
|||
<view style="display: flex;flex-direction: column;justify-content: center;align-items: center; |
|||
width: 80%; border-radius: 20px; background: linear-gradient(#FFF4E4, #fff);"> |
|||
|
|||
<image src="../../static/notices.png" style="width: 60px;height: 60px; margin-top: -30px;" |
|||
mode="scaleToFill"></image> |
|||
|
|||
<text |
|||
style="margin-top: 16px;font-size: 18px;color: #101010;font-weight: 600;font-family: sans-serif;">温馨提示</text> |
|||
<text |
|||
style="margin-top: 12px;font-size: 14px;color: #333;padding-left: 30px;padding-right: 30px;">您好，此卡已被领取。</text> |
|||
|
|||
<text style="margin-top: 25px;margin-bottom: 20px;border: 1px #FF9900 solid; color: #FF9900;font-size: 14px; |
|||
border-radius: 20px;height: 40px; line-height: 40px;padding-left: 30px;padding-right: 30px;" |
|||
@click="colseDialog()">确定</text> |
|||
|
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
//引入bus |
|||
import bus from '@/common/bus'; |
|||
export default { |
|||
data() { |
|||
return { |
|||
page: { |
|||
code: '', |
|||
codeKey: '', |
|||
customerSid: '', |
|||
startHeight: 0, |
|||
endHeight: 0 |
|||
}, |
|||
data: { |
|||
remarks: "" |
|||
}, |
|||
codeType: false, |
|||
showModal: false |
|||
} |
|||
}, |
|||
onLoad(options) { |
|||
|
|||
this.page.code = options.code |
|||
this.page.codeKey = options.codeKey |
|||
|
|||
|
|||
this.page.customerSid = getApp().globalData.sid |
|||
|
|||
let info = uni.getSystemInfoSync(); |
|||
|
|||
this.page.startHeight = info.windowWidth * 0.6 |
|||
this.page.endHeight = info.windowWidth * 0.8 |
|||
this.getData() |
|||
}, |
|||
methods: { |
|||
colseDialog() { |
|||
this.showModal = false |
|||
uni.redirectTo({ |
|||
url: '/pages/login/login' |
|||
}) |
|||
}, |
|||
itemClick(goodsSid) { |
|||
uni.navigateTo({ |
|||
url: '/pages/good/goodsDetail2?sid=' + goodsSid |
|||
}) |
|||
}, |
|||
getData() { |
|||
let _this = this |
|||
_this.$api.getTransferByCode(this.page.code).then((resp) => { |
|||
|
|||
// 1 未领取 2 已绑定 |
|||
|
|||
// 已绑定 |
|||
if ('2' == resp.state) { |
|||
|
|||
if (resp.recipientSid == _this.page.customerSid) { |
|||
uni.redirectTo({ |
|||
url: '/pages/login/login' |
|||
}) |
|||
} else { |
|||
_this.showModal = true |
|||
} |
|||
|
|||
} else { |
|||
_this.data = resp |
|||
_this.codeType = true |
|||
} |
|||
|
|||
|
|||
|
|||
}).catch(e => { |
|||
_this.longToast(e.msg) |
|||
}) |
|||
}, |
|||
|
|||
onKeyInput1(event) { |
|||
this.page.code = event.target.value |
|||
}, |
|||
onKeyInput2(event) { |
|||
this.page.codeKey = event.target.value |
|||
}, |
|||
scan() { |
|||
// 只允许通过相机扫码 |
|||
let _this = this |
|||
uni.scanCode({ |
|||
onlyFromCamera: true, |
|||
success(res) { |
|||
_this.page.code = res.result.substring(res.result.length - 20, res.result.length) |
|||
} |
|||
}); |
|||
}, |
|||
save() { |
|||
if (this.stringIsEmpty(this.page.code) || this.page.code.length != 20) { |
|||
this.shortToast('请输入20位转赠单号') |
|||
return |
|||
} |
|||
|
|||
// if (this.stringIsEmpty(this.page.codeKey) || this.page.codeKey.length != 6) { |
|||
// this.shortToast('请输入6位提货密码') |
|||
// return |
|||
// } |
|||
let _this = this |
|||
|
|||
var params = { |
|||
customerSid: this.page.customerSid, |
|||
transferSid: this.page.codeKey |
|||
} |
|||
|
|||
console.log("params+++++++++++++++", params); |
|||
|
|||
_this.$api.receiveTransferGoods(params).then((resp) => { |
|||
// bus.$emit('order', "监听回调"); |
|||
// setTimeout(() => { |
|||
// uni.$emit('order', "监听回调") |
|||
// }, 500) |
|||
const pages = getCurrentPages() |
|||
// 有可返回的页面则直接返回，uni.navigateBack 默认返回失败之后会自动刷新页面 ，无法继续返回 |
|||
if (pages.length > 1) { |
|||
uni.navigateBack(1) |
|||
return; |
|||
} else { |
|||
uni.redirectTo({ |
|||
url: '/pages/login/login' |
|||
}) |
|||
} |
|||
|
|||
|
|||
}).catch(e => { |
|||
_this.longToast(e.msg) |
|||
}) |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
.top { |
|||
width: 100vw; |
|||
height: 70vw; |
|||
} |
|||
|
|||
|
|||
/* 弹窗样式 */ |
|||
.model { |
|||
position: absolute; |
|||
width: 100%; |
|||
height: 100%; |
|||
background: #000; |
|||
z-index: 100000; |
|||
opacity: 0.7; |
|||
top: 0; |
|||
left: 0; |
|||
|
|||
} |
|||
|
|||
.modalDlg2 { |
|||
/* 设置超出滚动 */ |
|||
overflow: auto; |
|||
position: fixed; |
|||
z-index: 100000; |
|||
display: flex; |
|||
width: 100%; |
|||
height: 100%; |
|||
top: 0; |
|||
left: 0; |
|||
flex-direction: column; |
|||
justify-content: center; |
|||
align-items: center; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,142 @@ |
|||
<template> |
|||
<view style="display: flex;flex-direction: column;background-color: #fff;"> |
|||
|
|||
<view class="top"> |
|||
<NavBar ref="nav" navTitle="绑定云菜窖卡" :showIcon="true" :start-change-height="page.startHeight" |
|||
:end-change-height="page.endHeight"> |
|||
</NavBar> |
|||
<view> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/bind_bj3.png" mode="scaleToFill" |
|||
style="width: 100%;height: 70vw"></image> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<!-- <view style="display: flex;flex-direction: column;margin-top: -10vw;box-sizing: border-box;"> |
|||
<view |
|||
style="display: flex;flex-direction: column;border-radius: 20rpx;background: #FFFFFF;z-index: 1;align-items: center;box-sizing: border-box;"> |
|||
<view style="margin: 15px;">绑定云菜窖卡</view> |
|||
<view |
|||
style="display: flex;flex-direction: row;justify-content: space-between;box-sizing: border-box;width: calc(100vw - 60px);align-items: center;"> |
|||
<input maxlength="20" placeholder="请输入/扫码 提货编码" |
|||
style="font-size: 30rpx;flex: 1;background: #F8F8F8;border-radius: 5px;height: 40px;line-height: 40px;margin-right: 10px;padding-left: 10px;" |
|||
type="number" :value="page.code" @input="onKeyInput1" /> |
|||
<uni-icons type="camera-filled" color="#c0c4cc" size="22" style="flex-shrink: 0;" @click="scan" /> |
|||
</view> |
|||
<view |
|||
style="display: flex;flex-direction: row;justify-content: space-between;box-sizing: border-box;width: calc(100vw - 60px);align-items: center;margin-top: 10px;"> |
|||
<input maxlength="6" placeholder="请输入提货密码" |
|||
style="font-size: 30rpx;flex: 1;background: #F8F8F8;border-radius: 5px;height: 40px;line-height: 40px;padding-left: 10px;" |
|||
type="number" :value="page.codeKey" @input="onKeyInput2" /> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view |
|||
style="margin: 30px;background-color: #fd3655;width: calc(100% - 60px);border-radius: 100rpx;height: 80rpx;display: flex;flex-direction: column;align-items: center;line-height: 80rpx;color: #FFFFFF;font-size: 36rpx;" |
|||
@click="save"> |
|||
绑定</view> --> |
|||
|
|||
<view style="display: flex;flex-direction: column;padding:20px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<view style="background: #5C9EFD; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<view style="background: #89DAFB; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<text style="margin-left: 8px;font-size: 18px;color: #333;">绑定企业卡</text> |
|||
</view> |
|||
|
|||
<text style="margin-left: 8px;font-size: 14px;color: #333;margin-top: 20px;">提货编码</text> |
|||
<view style="display: flex;flex-direction: row;justify-content: space-between; |
|||
background: #F8F8F8;border-radius: 5px;box-sizing: border-box; |
|||
width: calc(100vw -40px);align-items: center; padding:10px 0px;margin-top: 5px;"> |
|||
<input maxlength="20" placeholder="请输入/扫码" |
|||
style="font-size: 30rpx;flex: 1;margin-right: 20px;padding-left: 10px;" type="number" |
|||
:value="page.code" @input="onKeyInput1" /> |
|||
<view style="width: 1px;height: 20px;background: #ccc; margin-right: 10px;"></view> |
|||
<uni-icons type="camera-filled" color="#c0c4cc" size="22" style="flex-shrink: 0;margin-right: 10px;" |
|||
@click="scan" /> |
|||
</view> |
|||
<text style="margin-left: 8px;font-size: 14px;color: #333;margin-top: 20px;">提货密码</text> |
|||
<view style="display: flex;flex-direction: row;justify-content: space-between; |
|||
background: #F8F8F8;border-radius: 5px; padding:10px 0px; |
|||
box-sizing: border-box;width: calc(100vw - 40px);align-items: center;margin-top: 10px;"> |
|||
<input maxlength="6" placeholder="请输入提货密码" style="font-size: 30rpx;flex: 1;padding-left: 10px;" |
|||
type="number" :value="page.codeKey" @input="onKeyInput2" /> |
|||
</view> |
|||
|
|||
<view style="background: -webkit-linear-gradient(left,#89DAFB,#5C9EFD); position: absolute; bottom: 30px; |
|||
width: 90%;border-radius: 100rpx;height: 80rpx;display: flex; |
|||
flex-direction: column;align-items: center;line-height: 80rpx;color: #FFFFFF;font-size: 36rpx;" @click="save"> |
|||
绑定</view> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
//引入bus |
|||
import bus from '@/common/bus'; |
|||
export default { |
|||
data() { |
|||
return { |
|||
page: { |
|||
code: '', |
|||
codeKey: '', |
|||
customerSid: '', |
|||
startHeight: 0, |
|||
endHeight: 0 |
|||
} |
|||
} |
|||
}, |
|||
onLoad() { |
|||
this.page.customerSid = getApp().globalData.sid |
|||
let info = uni.getSystemInfoSync(); |
|||
|
|||
this.page.startHeight = info.windowWidth * 0.6 |
|||
this.page.endHeight = info.windowWidth * 0.8 |
|||
}, |
|||
methods: { |
|||
onKeyInput1(event) { |
|||
this.page.code = event.target.value |
|||
}, |
|||
onKeyInput2(event) { |
|||
this.page.codeKey = event.target.value |
|||
}, |
|||
scan() { |
|||
// 只允许通过相机扫码 |
|||
let _this = this |
|||
uni.scanCode({ |
|||
onlyFromCamera: true, |
|||
success(res) { |
|||
_this.page.code = res.result.substring(res.result.length - 20, res.result.length) |
|||
} |
|||
}); |
|||
}, |
|||
save() { |
|||
if (this.stringIsEmpty(this.page.code) || this.page.code.length != 20) { |
|||
this.shortToast('请输入或扫描20位提货编码') |
|||
return |
|||
} |
|||
|
|||
if (this.stringIsEmpty(this.page.codeKey) || this.page.codeKey.length != 6) { |
|||
this.shortToast('请输入6位提货密码') |
|||
return |
|||
} |
|||
let _this = this |
|||
_this.$api.empcardBind(this.page).then((resp) => { |
|||
bus.$emit('order3', "监听回调"); |
|||
uni.navigateBack() |
|||
|
|||
}).catch(e => { |
|||
_this.longToast(e.msg) |
|||
}) |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
.top { |
|||
width: 100vw; |
|||
height: 70vw; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,205 @@ |
|||
<template> |
|||
|
|||
<!-- 扫码进入 携带参数 --> |
|||
|
|||
<view style="display: flex;flex-direction: column;background-color: #fff;"> |
|||
|
|||
<view class="top"> |
|||
<NavBar ref="nav" navTitle="绑定企业卡" :showIcon="true" :start-change-height="page.startHeight" |
|||
:end-change-height="page.endHeight"> |
|||
</NavBar> |
|||
<view> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/bind_bj3.png" mode="scaleToFill" |
|||
style="width: 100%;height: 70vw"></image> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<!-- <view style="display: flex;flex-direction: column;margin-top: -10vw;box-sizing: border-box;"> |
|||
<view |
|||
style="display: flex;flex-direction: column;border-radius: 20rpx;background: #FFFFFF;z-index: 1;align-items: center;box-sizing: border-box;"> |
|||
<view style="margin: 15px;">绑定云菜窖卡</view> |
|||
<view |
|||
style="display: flex;flex-direction: row;justify-content: space-between;box-sizing: border-box;width: calc(100vw - 60px);align-items: center;"> |
|||
<input maxlength="20" placeholder="请输入/扫码 提货编码" |
|||
style="font-size: 30rpx;flex: 1;background: #F8F8F8;border-radius: 5px;height: 40px;line-height: 40px;margin-right: 10px;padding-left: 10px;" |
|||
type="number" :value="page.code" @input="onKeyInput1" /> |
|||
<uni-icons type="camera-filled" color="#c0c4cc" size="22" style="flex-shrink: 0;" @click="scan" /> |
|||
</view> |
|||
<view |
|||
style="display: flex;flex-direction: row;justify-content: space-between;box-sizing: border-box;width: calc(100vw - 60px);align-items: center;margin-top: 10px;"> |
|||
<input maxlength="6" placeholder="请输入提货密码" |
|||
style="font-size: 30rpx;flex: 1;background: #F8F8F8;border-radius: 5px;height: 40px;line-height: 40px;padding-left: 10px;" |
|||
type="number" :value="page.codeKey" @input="onKeyInput2" /> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view |
|||
style="margin: 30px;background-color: #fd3655;width: calc(100% - 60px);border-radius: 100rpx;height: 80rpx;display: flex;flex-direction: column;align-items: center;line-height: 80rpx;color: #FFFFFF;font-size: 36rpx;" |
|||
@click="save"> |
|||
绑定</view> --> |
|||
|
|||
<view style="display: flex;flex-direction: column;padding:20px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<view style="background: #5C9EFD; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<view style="background: #89DAFB; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<text style="margin-left: 8px;font-size: 18px;color: #333;">绑定企业卡</text> |
|||
</view> |
|||
|
|||
<text style="margin-left: 8px;font-size: 14px;color: #333;margin-top: 20px;">提货编码</text> |
|||
<view style="display: flex;flex-direction: row;justify-content: space-between; |
|||
background: #F8F8F8;border-radius: 5px;box-sizing: border-box; |
|||
width: calc(100vw -40px);align-items: center; padding:10px 0px;margin-top: 5px;"> |
|||
<input maxlength="20" placeholder="请输入/扫码" |
|||
style="font-size: 30rpx;flex: 1;margin-right: 20px;padding-left: 10px;" type="number" |
|||
:value="page.code" @input="onKeyInput1" /> |
|||
<view style="width: 1px;height: 20px;background: #ccc; margin-right: 10px;"></view> |
|||
<uni-icons type="camera-filled" color="#c0c4cc" size="22" style="flex-shrink: 0;margin-right: 10px;" |
|||
@click="scan" /> |
|||
</view> |
|||
<text style="margin-left: 8px;font-size: 14px;color: #333;margin-top: 20px;">提货密码</text> |
|||
<view style="display: flex;flex-direction: row;justify-content: space-between; |
|||
background: #F8F8F8;border-radius: 5px; padding:10px 0px; |
|||
box-sizing: border-box;width: calc(100vw - 40px);align-items: center;margin-top: 10px;"> |
|||
<input maxlength="6" placeholder="请输入提货密码" style="font-size: 30rpx;flex: 1;padding-left: 10px;" |
|||
type="number" :value="page.codeKey" @input="onKeyInput2" /> |
|||
</view> |
|||
|
|||
<view style="background: -webkit-linear-gradient(left,#89DAFB,#5C9EFD); position: absolute; bottom: 30px; |
|||
width: 90%;border-radius: 100rpx;height: 80rpx;display: flex; |
|||
flex-direction: column;align-items: center;line-height: 80rpx;color: #FFFFFF;font-size: 36rpx;" @click="save"> |
|||
绑定</view> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
//引入bus |
|||
import bus from '@/common/bus'; |
|||
export default { |
|||
data() { |
|||
return { |
|||
page: { |
|||
code: '', |
|||
codeKey: '', |
|||
customerSid: '' |
|||
} |
|||
} |
|||
}, |
|||
onUnload() { |
|||
let pages = getCurrentPages().length - 1; |
|||
wx.navigateBack({ |
|||
delta: pages |
|||
}) |
|||
}, |
|||
onLoad(options) { |
|||
let _this = this; |
|||
wx.login({ |
|||
success: function(res) { |
|||
uni.request({ |
|||
// 组装请求地址 |
|||
url: getApp().globalData.wxSilentLoginURL + "?wxCode=" + res.code, |
|||
method: "GET", |
|||
header: { |
|||
'content-type': "application/x-www-form-urlencoded" |
|||
}, |
|||
data: { |
|||
"wxCode": res.code |
|||
}, |
|||
success: res => { |
|||
if (res.statusCode == 200) { |
|||
if (!res.data.success) { |
|||
if (res.data.code == "110") { |
|||
// 需要绑定手机号 |
|||
uni.reLaunch({ |
|||
url: '/pages/index/BindPhone?openid=' + |
|||
res.data.data.wxMpOpenid |
|||
}) |
|||
} else { |
|||
// _this.status = 'more' |
|||
} |
|||
} else { |
|||
// 成功后跳转主页 |
|||
getApp().globalData.sid = res.data.data.sid |
|||
getApp().globalData.token = res.data.data.token |
|||
uni.setStorageSync("satoken",res.data.data.token) |
|||
console.log("人员sid", res.data.data.sid); |
|||
console.log("token", res.data.data.token); |
|||
_this.page.customerSid = getApp().globalData.sid |
|||
} |
|||
} else { |
|||
// _this.status = 'more' |
|||
} |
|||
}, |
|||
fail: (err) => { |
|||
// _this.status = 'more' |
|||
} |
|||
}); |
|||
}, |
|||
fail: function(res) { |
|||
// _this.status = 'more' |
|||
} |
|||
}); |
|||
|
|||
if (options) { |
|||
console.log("options", options) |
|||
|
|||
const q = decodeURIComponent(options.q) // 获取到二维码原始链接内容 |
|||
console.log("二维码原始链接内容", q) |
|||
|
|||
var code = q.split('=')[1] |
|||
|
|||
// var code = this.getQueryString(q, 'code');// code是你二维码链接里面的参数名 |
|||
|
|||
console.log("提货卡编码", code) |
|||
this.page.code = code |
|||
} |
|||
|
|||
|
|||
}, |
|||
methods: { |
|||
onKeyInput1: function(event) { |
|||
this.page.code = event.target.value |
|||
}, |
|||
onKeyInput2: function(event) { |
|||
this.page.codeKey = event.target.value |
|||
}, |
|||
scan() { |
|||
// 只允许通过相机扫码 |
|||
let _this = this |
|||
uni.scanCode({ |
|||
onlyFromCamera: true, |
|||
success: function(res) { |
|||
_this.page.code = res.result.substring(res.result.length - 20, res.result.length) |
|||
} |
|||
}); |
|||
}, |
|||
save() { |
|||
if (this.stringIsEmpty(this.page.code) || this.page.code.length != 20) { |
|||
this.shortToast('请输入或扫描20位提货编码') |
|||
return |
|||
} |
|||
if (this.stringIsEmpty(this.page.codeKey) || this.page.codeKey.length != 6) { |
|||
this.shortToast('请输入6位提货密码') |
|||
return |
|||
} |
|||
let _this = this |
|||
_this.$api.empcardBind(this.page).then((resp) => { |
|||
bus.$emit('order3', "监听回调"); |
|||
uni.switchTab({ |
|||
url: '/pages/home/corporateCard' |
|||
}) |
|||
|
|||
}).catch(e => { |
|||
_this.longToast(e.msg) |
|||
}) |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
|
|||
</style> |
|||
@ -0,0 +1,157 @@ |
|||
<template> |
|||
<view style="display: flex;flex-direction: column;background-color: #fff;"> |
|||
|
|||
<view class="top"> |
|||
<NavBar ref="nav" navTitle="绑定云菜窖卡" :showIcon="true" :start-change-height="page.startHeight" |
|||
:end-change-height="page.endHeight"> |
|||
</NavBar> |
|||
<view> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/bind_bj2.png" mode="scaleToFill" |
|||
style="width: 100%;height: 70vw"></image> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<!-- <view style="display: flex;flex-direction: column;margin-top: -10vw;box-sizing: border-box;"> |
|||
<view |
|||
style="display: flex;flex-direction: column;border-radius: 20rpx;background: #FFFFFF;z-index: 1;align-items: center;box-sizing: border-box;"> |
|||
<view style="margin: 15px;">绑定云菜窖卡</view> |
|||
<view |
|||
style="display: flex;flex-direction: row;justify-content: space-between;box-sizing: border-box;width: calc(100vw - 60px);align-items: center;"> |
|||
<input maxlength="20" placeholder="请输入/扫码 提货编码" |
|||
style="font-size: 30rpx;flex: 1;background: #F8F8F8;border-radius: 5px;height: 40px;line-height: 40px;margin-right: 10px;padding-left: 10px;" |
|||
type="number" :value="page.code" @input="onKeyInput1" /> |
|||
<uni-icons type="camera-filled" color="#c0c4cc" size="22" style="flex-shrink: 0;" @click="scan" /> |
|||
</view> |
|||
<view |
|||
style="display: flex;flex-direction: row;justify-content: space-between;box-sizing: border-box;width: calc(100vw - 60px);align-items: center;margin-top: 10px;"> |
|||
<input maxlength="6" placeholder="请输入提货密码" |
|||
style="font-size: 30rpx;flex: 1;background: #F8F8F8;border-radius: 5px;height: 40px;line-height: 40px;padding-left: 10px;" |
|||
type="number" :value="page.codeKey" @input="onKeyInput2" /> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view |
|||
style="margin: 30px;background-color: #fd3655;width: calc(100% - 60px);border-radius: 100rpx;height: 80rpx;display: flex;flex-direction: column;align-items: center;line-height: 80rpx;color: #FFFFFF;font-size: 36rpx;" |
|||
@click="save"> |
|||
绑定</view> --> |
|||
|
|||
<view style="display: flex;flex-direction: column;padding:20px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<view style="background: #FF3F22; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<view style="background: #FF8585; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<text style="margin-left: 8px;font-size: 18px;color: #333;">绑定福礼卡</text> |
|||
</view> |
|||
|
|||
<text style="margin-left: 8px;font-size: 14px;color: #333;margin-top: 20px;">提货编码</text> |
|||
<view style="display: flex;flex-direction: row;justify-content: space-between; |
|||
background: #F8F8F8;border-radius: 5px;box-sizing: border-box; |
|||
width: calc(100vw -40px);align-items: center; padding:10px 0px;margin-top: 5px;"> |
|||
<input maxlength="20" placeholder="请输入/扫码" |
|||
style="font-size: 30rpx;flex: 1;margin-right: 20px;padding-left: 10px;" type="number" |
|||
:value="page.code" @input="onKeyInput1" /> |
|||
<view style="width: 1px;height: 20px;background: #ccc; margin-right: 10px;"></view> |
|||
<uni-icons type="camera-filled" color="#c0c4cc" size="22" style="flex-shrink: 0;margin-right: 10px;" |
|||
@click="scan" /> |
|||
</view> |
|||
<text style="margin-left: 8px;font-size: 14px;color: #333;margin-top: 20px;">提货密码</text> |
|||
<view style="display: flex;flex-direction: row;justify-content: space-between; |
|||
background: #F8F8F8;border-radius: 5px; padding:10px 0px; |
|||
box-sizing: border-box;width: calc(100vw - 40px);align-items: center;margin-top: 10px;"> |
|||
<input maxlength="6" placeholder="请输入提货密码" style="font-size: 30rpx;flex: 1;padding-left: 10px;" |
|||
type="number" :value="page.codeKey" @input="onKeyInput2" /> |
|||
</view> |
|||
|
|||
<view style="background: -webkit-linear-gradient(left,#FF8585,#FF3F22); position: absolute; bottom: 30px; |
|||
width: 90%;border-radius: 100rpx;height: 80rpx;display: flex; |
|||
flex-direction: column;align-items: center;line-height: 80rpx;color: #FFFFFF;font-size: 36rpx;" @click="save"> |
|||
绑定</view> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
//引入bus |
|||
import bus from '@/common/bus'; |
|||
export default { |
|||
data() { |
|||
return { |
|||
page: { |
|||
code: '', |
|||
codeKey: '', |
|||
customerSid: '', |
|||
startHeight: 0, |
|||
endHeight: 0 |
|||
}, |
|||
} |
|||
}, |
|||
onLoad(options) { |
|||
|
|||
this.page.code = options.code |
|||
this.page.codeKey = options.codeKey |
|||
|
|||
|
|||
this.page.customerSid = getApp().globalData.sid |
|||
let info = uni.getSystemInfoSync(); |
|||
|
|||
this.page.startHeight = info.windowWidth * 0.6 |
|||
this.page.endHeight = info.windowWidth * 0.8 |
|||
}, |
|||
methods: { |
|||
onKeyInput1(event) { |
|||
this.page.code = event.target.value |
|||
}, |
|||
onKeyInput2(event) { |
|||
this.page.codeKey = event.target.value |
|||
}, |
|||
scan() { |
|||
// 只允许通过相机扫码 |
|||
let _this = this |
|||
uni.scanCode({ |
|||
onlyFromCamera: true, |
|||
success(res) { |
|||
_this.page.code = res.result.substring(res.result.length - 20, res.result.length) |
|||
} |
|||
}); |
|||
}, |
|||
save() { |
|||
if (this.stringIsEmpty(this.page.code) || this.page.code.length != 20) { |
|||
this.shortToast('请输入或扫描20位提货编码') |
|||
return |
|||
} |
|||
|
|||
if (this.stringIsEmpty(this.page.codeKey) || this.page.codeKey.length != 6) { |
|||
this.shortToast('请输入6位提货密码') |
|||
return |
|||
} |
|||
let _this = this |
|||
_this.$api.cardBind(this.page).then((resp) => { |
|||
bus.$emit('order2', "监听回调"); |
|||
const pages = getCurrentPages() |
|||
// 有可返回的页面则直接返回，uni.navigateBack 默认返回失败之后会自动刷新页面 ，无法继续返回 |
|||
if (pages.length > 1) { |
|||
uni.navigateBack(1) |
|||
return; |
|||
} else { |
|||
uni.switchTab({ |
|||
url: '/pages/home/giftCard' |
|||
}) |
|||
} |
|||
|
|||
|
|||
}).catch(e => { |
|||
_this.longToast(e.msg) |
|||
}) |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
.top { |
|||
width: 100vw; |
|||
height: 70vw; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,202 @@ |
|||
<template> |
|||
|
|||
<!-- 扫码进入 携带参数 --> |
|||
|
|||
<view style="display: flex;flex-direction: column;background-color: #fff;"> |
|||
|
|||
<view class="top"> |
|||
<NavBar ref="nav" navTitle="绑定云菜窖卡" :showIcon="true" :start-change-height="page.startHeight" |
|||
:end-change-height="page.endHeight"> |
|||
</NavBar> |
|||
<view> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/bind_bj2.png" mode="scaleToFill" |
|||
style="width: 100%;height: 70vw"></image> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<!-- <view style="display: flex;flex-direction: column;margin-top: -10vw;box-sizing: border-box;"> |
|||
<view |
|||
style="display: flex;flex-direction: column;border-radius: 20rpx;background: #FFFFFF;z-index: 1;align-items: center;box-sizing: border-box;"> |
|||
<view style="margin: 15px;">绑定云菜窖卡</view> |
|||
<view |
|||
style="display: flex;flex-direction: row;justify-content: space-between;box-sizing: border-box;width: calc(100vw - 60px);align-items: center;"> |
|||
<input maxlength="20" placeholder="请输入/扫码 提货编码" |
|||
style="font-size: 30rpx;flex: 1;background: #F8F8F8;border-radius: 5px;height: 40px;line-height: 40px;margin-right: 10px;padding-left: 10px;" |
|||
type="number" :value="page.code" @input="onKeyInput1" /> |
|||
<uni-icons type="camera-filled" color="#c0c4cc" size="22" style="flex-shrink: 0;" @click="scan" /> |
|||
</view> |
|||
<view |
|||
style="display: flex;flex-direction: row;justify-content: space-between;box-sizing: border-box;width: calc(100vw - 60px);align-items: center;margin-top: 10px;"> |
|||
<input maxlength="6" placeholder="请输入提货密码" |
|||
style="font-size: 30rpx;flex: 1;background: #F8F8F8;border-radius: 5px;height: 40px;line-height: 40px;padding-left: 10px;" |
|||
type="number" :value="page.codeKey" @input="onKeyInput2" /> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view |
|||
style="margin: 30px;background-color: #fd3655;width: calc(100% - 60px);border-radius: 100rpx;height: 80rpx;display: flex;flex-direction: column;align-items: center;line-height: 80rpx;color: #FFFFFF;font-size: 36rpx;" |
|||
@click="save"> |
|||
绑定</view> --> |
|||
|
|||
<view style="display: flex;flex-direction: column;padding:20px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<view style="background: #FF3F22; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<view style="background: #FF8585; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<text style="margin-left: 8px;font-size: 18px;color: #333;">绑定福礼卡</text> |
|||
</view> |
|||
|
|||
<text style="margin-left: 8px;font-size: 14px;color: #333;margin-top: 20px;">提货编码</text> |
|||
<view style="display: flex;flex-direction: row;justify-content: space-between; |
|||
background: #F8F8F8;border-radius: 5px;box-sizing: border-box; |
|||
width: calc(100vw -40px);align-items: center; padding:10px 0px;margin-top: 5px;"> |
|||
<input maxlength="20" placeholder="请输入/扫码" |
|||
style="font-size: 30rpx;flex: 1;margin-right: 20px;padding-left: 10px;" type="number" |
|||
:value="page.code" @input="onKeyInput1" /> |
|||
<view style="width: 1px;height: 20px;background: #ccc; margin-right: 10px;"></view> |
|||
<uni-icons type="camera-filled" color="#c0c4cc" size="22" style="flex-shrink: 0;margin-right: 10px;" |
|||
@click="scan" /> |
|||
</view> |
|||
<text style="margin-left: 8px;font-size: 14px;color: #333;margin-top: 20px;">提货密码</text> |
|||
<view style="display: flex;flex-direction: row;justify-content: space-between; |
|||
background: #F8F8F8;border-radius: 5px; padding:10px 0px; |
|||
box-sizing: border-box;width: calc(100vw - 40px);align-items: center;margin-top: 10px;"> |
|||
<input maxlength="6" placeholder="请输入提货密码" style="font-size: 30rpx;flex: 1;padding-left: 10px;" |
|||
type="number" :value="page.codeKey" @input="onKeyInput2" /> |
|||
</view> |
|||
|
|||
<view style="background: -webkit-linear-gradient(left,#FF8585,#FF3F22); position: absolute; bottom: 30px; |
|||
width: 90%;border-radius: 100rpx;height: 80rpx;display: flex; |
|||
flex-direction: column;align-items: center;line-height: 80rpx;color: #FFFFFF;font-size: 36rpx;" @click="save"> |
|||
绑定</view> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
//引入bus |
|||
import bus from '@/common/bus'; |
|||
export default { |
|||
data() { |
|||
return { |
|||
page: { |
|||
code: '', |
|||
codeKey: '', |
|||
customerSid: '' |
|||
} |
|||
} |
|||
}, |
|||
onUnload() { |
|||
let pages = getCurrentPages().length - 1; |
|||
wx.navigateBack({ |
|||
delta: pages |
|||
}) |
|||
}, |
|||
onLoad(options) { |
|||
let _this = this; |
|||
wx.login({ |
|||
success: function(res) { |
|||
uni.request({ |
|||
// 组装请求地址 |
|||
url: getApp().globalData.wxSilentLoginURL + "?wxCode=" + res.code, |
|||
method: "GET", |
|||
header: { |
|||
'content-type': "application/x-www-form-urlencoded" |
|||
}, |
|||
data: { |
|||
"wxCode": res.code |
|||
}, |
|||
success: res => { |
|||
if (res.statusCode == 200) { |
|||
if (!res.data.success) { |
|||
if (res.data.code == "110") { |
|||
// 需要绑定手机号 |
|||
uni.reLaunch({ |
|||
url: '/pages/index/BindPhone?openid=' + |
|||
res.data.data.wxMpOpenid |
|||
}) |
|||
} else { |
|||
// _this.status = 'more' |
|||
} |
|||
} else { |
|||
// 成功后跳转主页 |
|||
getApp().globalData.sid = res.data.data.sid |
|||
_this.page.customerSid = getApp().globalData.sid |
|||
console.log("用户sid", getApp().globalData.sid) |
|||
} |
|||
} else { |
|||
// _this.status = 'more' |
|||
} |
|||
}, |
|||
fail: (err) => { |
|||
// _this.status = 'more' |
|||
} |
|||
}); |
|||
}, |
|||
fail: function(res) { |
|||
// _this.status = 'more' |
|||
} |
|||
}); |
|||
|
|||
if (options) { |
|||
console.log("options", options) |
|||
|
|||
const q = decodeURIComponent(options.q) // 获取到二维码原始链接内容 |
|||
console.log("二维码原始链接内容", q) |
|||
|
|||
var code = q.split('=')[1] |
|||
|
|||
// var code = this.getQueryString(q, 'code');// code是你二维码链接里面的参数名 |
|||
|
|||
console.log("提货卡编码", code) |
|||
this.page.code = code |
|||
} |
|||
|
|||
|
|||
}, |
|||
methods: { |
|||
onKeyInput1: function(event) { |
|||
this.page.code = event.target.value |
|||
}, |
|||
onKeyInput2: function(event) { |
|||
this.page.codeKey = event.target.value |
|||
}, |
|||
scan() { |
|||
// 只允许通过相机扫码 |
|||
let _this = this |
|||
uni.scanCode({ |
|||
onlyFromCamera: true, |
|||
success: function(res) { |
|||
_this.page.code = res.result.substring(res.result.length - 20, res.result.length) |
|||
} |
|||
}); |
|||
}, |
|||
save() { |
|||
if (this.stringIsEmpty(this.page.code) || this.page.code.length != 20) { |
|||
this.shortToast('请输入或扫描20位提货编码') |
|||
return |
|||
} |
|||
if (this.stringIsEmpty(this.page.codeKey) || this.page.codeKey.length != 6) { |
|||
this.shortToast('请输入6位提货密码') |
|||
return |
|||
} |
|||
let _this = this |
|||
_this.$api.cardBind(this.page).then((resp) => { |
|||
bus.$emit('order2', "监听回调"); |
|||
uni.switchTab({ |
|||
url: '/pages/home/giftCard' |
|||
}) |
|||
|
|||
}).catch(e => { |
|||
_this.longToast(e.msg) |
|||
}) |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
|
|||
</style> |
|||
@ -0,0 +1,160 @@ |
|||
<template> |
|||
<view style="display: flex;flex-direction: column;background-color: #fff;"> |
|||
|
|||
<view class="top"> |
|||
<NavBar ref="nav" navTitle="绑定云菜窖卡" :showIcon="true" :start-change-height="page.startHeight" |
|||
:end-change-height="page.endHeight"> |
|||
</NavBar> |
|||
<view> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/bind_bj1.png" mode="scaleToFill" |
|||
style="width: 100%;height: 70vw"></image> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<!-- <view style="display: flex;flex-direction: column;margin-top: -10vw;box-sizing: border-box;"> |
|||
<view |
|||
style="display: flex;flex-direction: column;border-radius: 20rpx;background: #FFFFFF;z-index: 1;align-items: center;box-sizing: border-box;"> |
|||
<view style="margin: 15px;">绑定云菜窖卡</view> |
|||
<view |
|||
style="display: flex;flex-direction: row;justify-content: space-between;box-sizing: border-box;width: calc(100vw - 60px);align-items: center;"> |
|||
<input maxlength="20" placeholder="请输入/扫码 提货编码" |
|||
style="font-size: 30rpx;flex: 1;background: #F8F8F8;border-radius: 5px;height: 40px;line-height: 40px;margin-right: 10px;padding-left: 10px;" |
|||
type="number" :value="page.code" @input="onKeyInput1" /> |
|||
<uni-icons type="camera-filled" color="#c0c4cc" size="22" style="flex-shrink: 0;" @click="scan" /> |
|||
</view> |
|||
<view |
|||
style="display: flex;flex-direction: row;justify-content: space-between;box-sizing: border-box;width: calc(100vw - 60px);align-items: center;margin-top: 10px;"> |
|||
<input maxlength="6" placeholder="请输入提货密码" |
|||
style="font-size: 30rpx;flex: 1;background: #F8F8F8;border-radius: 5px;height: 40px;line-height: 40px;padding-left: 10px;" |
|||
type="number" :value="page.codeKey" @input="onKeyInput2" /> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view |
|||
style="margin: 30px;background-color: #fd3655;width: calc(100% - 60px);border-radius: 100rpx;height: 80rpx;display: flex;flex-direction: column;align-items: center;line-height: 80rpx;color: #FFFFFF;font-size: 36rpx;" |
|||
@click="save"> |
|||
绑定</view> --> |
|||
|
|||
<view style="display: flex;flex-direction: column;padding:20px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<view style="background: #FF9D33; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<view style="background: #FFDAB2; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<text style="margin-left: 8px;font-size: 18px;color: #333;">绑定个人卡</text> |
|||
</view> |
|||
|
|||
<text style="margin-left: 8px;font-size: 14px;color: #333;margin-top: 20px;">提货编码</text> |
|||
<view style="display: flex;flex-direction: row;justify-content: space-between; |
|||
background: #F8F8F8;border-radius: 5px;box-sizing: border-box; |
|||
width: calc(100vw -40px);align-items: center; padding:10px 0px;margin-top: 5px;"> |
|||
<input maxlength="20" placeholder="请输入/扫码" |
|||
style="font-size: 30rpx;flex: 1;margin-right: 20px;padding-left: 10px;" type="number" |
|||
:value="page.code" @input="onKeyInput1" /> |
|||
<view style="width: 1px;height: 20px;background: #ccc; margin-right: 10px;"></view> |
|||
<uni-icons type="camera-filled" color="#c0c4cc" size="22" style="flex-shrink: 0;margin-right: 10px;" |
|||
@click="scan" /> |
|||
</view> |
|||
<text style="margin-left: 8px;font-size: 14px;color: #333;margin-top: 20px;">提货密码</text> |
|||
<view style="display: flex;flex-direction: row;justify-content: space-between; |
|||
background: #F8F8F8;border-radius: 5px; padding:10px 0px; |
|||
box-sizing: border-box;width: calc(100vw - 40px);align-items: center;margin-top: 10px;"> |
|||
<input maxlength="6" placeholder="请输入提货密码" style="font-size: 30rpx;flex: 1;padding-left: 10px;" |
|||
type="number" :value="page.codeKey" @input="onKeyInput2" /> |
|||
</view> |
|||
|
|||
<view style="background: -webkit-linear-gradient(left,#FFB176,#FE923B); position: absolute; bottom: 30px; |
|||
width: 90%;border-radius: 100rpx;height: 80rpx;display: flex; |
|||
flex-direction: column;align-items: center;line-height: 80rpx;color: #FFFFFF;font-size: 36rpx;" @click="save"> |
|||
绑定</view> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
//引入bus |
|||
import bus from '@/common/bus'; |
|||
export default { |
|||
data() { |
|||
return { |
|||
page: { |
|||
code: '', |
|||
codeKey: '', |
|||
customerSid: '', |
|||
startHeight: 0, |
|||
endHeight: 0 |
|||
}, |
|||
} |
|||
}, |
|||
onLoad(options) { |
|||
|
|||
this.page.code = options.code |
|||
this.page.codeKey = options.codeKey |
|||
|
|||
|
|||
this.page.customerSid = getApp().globalData.sid |
|||
let info = uni.getSystemInfoSync(); |
|||
|
|||
this.page.startHeight = info.windowWidth * 0.6 |
|||
this.page.endHeight = info.windowWidth * 0.8 |
|||
}, |
|||
methods: { |
|||
onKeyInput1(event) { |
|||
this.page.code = event.target.value |
|||
}, |
|||
onKeyInput2(event) { |
|||
this.page.codeKey = event.target.value |
|||
}, |
|||
scan() { |
|||
// 只允许通过相机扫码 |
|||
let _this = this |
|||
uni.scanCode({ |
|||
onlyFromCamera: true, |
|||
success(res) { |
|||
_this.page.code = res.result.substring(res.result.length - 20, res.result.length) |
|||
} |
|||
}); |
|||
}, |
|||
save() { |
|||
if (this.stringIsEmpty(this.page.code) || this.page.code.length != 20) { |
|||
this.shortToast('请输入或扫描20位提货编码') |
|||
return |
|||
} |
|||
|
|||
if (this.stringIsEmpty(this.page.codeKey) || this.page.codeKey.length != 6) { |
|||
this.shortToast('请输入6位提货密码') |
|||
return |
|||
} |
|||
let _this = this |
|||
_this.$api.cardBind(this.page).then((resp) => { |
|||
bus.$emit('order', "监听回调"); |
|||
// setTimeout(() => { |
|||
// uni.$emit('order', "监听回调") |
|||
// }, 500) |
|||
const pages = getCurrentPages() |
|||
// 有可返回的页面则直接返回，uni.navigateBack 默认返回失败之后会自动刷新页面 ，无法继续返回 |
|||
if (pages.length > 1) { |
|||
uni.navigateBack(1) |
|||
return; |
|||
} else { |
|||
uni.switchTab({ |
|||
url: '/pages/home/personCard' |
|||
}) |
|||
} |
|||
|
|||
|
|||
}).catch(e => { |
|||
_this.longToast(e.msg) |
|||
}) |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
.top { |
|||
width: 100vw; |
|||
height: 70vw; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,202 @@ |
|||
<template> |
|||
|
|||
<!-- 扫码进入 携带参数 --> |
|||
|
|||
<view style="display: flex;flex-direction: column;background-color: #fff;"> |
|||
|
|||
<view class="top"> |
|||
<NavBar ref="nav" navTitle="绑定云菜窖卡" :showIcon="true" :start-change-height="page.startHeight" |
|||
:end-change-height="page.endHeight"> |
|||
</NavBar> |
|||
<view> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/bind_bj1.png" mode="scaleToFill" |
|||
style="width: 100%;height: 70vw"></image> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<!-- <view style="display: flex;flex-direction: column;margin-top: -10vw;box-sizing: border-box;"> |
|||
<view |
|||
style="display: flex;flex-direction: column;border-radius: 20rpx;background: #FFFFFF;z-index: 1;align-items: center;box-sizing: border-box;"> |
|||
<view style="margin: 15px;">绑定云菜窖卡</view> |
|||
<view |
|||
style="display: flex;flex-direction: row;justify-content: space-between;box-sizing: border-box;width: calc(100vw - 60px);align-items: center;"> |
|||
<input maxlength="20" placeholder="请输入/扫码 提货编码" |
|||
style="font-size: 30rpx;flex: 1;background: #F8F8F8;border-radius: 5px;height: 40px;line-height: 40px;margin-right: 10px;padding-left: 10px;" |
|||
type="number" :value="page.code" @input="onKeyInput1" /> |
|||
<uni-icons type="camera-filled" color="#c0c4cc" size="22" style="flex-shrink: 0;" @click="scan" /> |
|||
</view> |
|||
<view |
|||
style="display: flex;flex-direction: row;justify-content: space-between;box-sizing: border-box;width: calc(100vw - 60px);align-items: center;margin-top: 10px;"> |
|||
<input maxlength="6" placeholder="请输入提货密码" |
|||
style="font-size: 30rpx;flex: 1;background: #F8F8F8;border-radius: 5px;height: 40px;line-height: 40px;padding-left: 10px;" |
|||
type="number" :value="page.codeKey" @input="onKeyInput2" /> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view |
|||
style="margin: 30px;background-color: #fd3655;width: calc(100% - 60px);border-radius: 100rpx;height: 80rpx;display: flex;flex-direction: column;align-items: center;line-height: 80rpx;color: #FFFFFF;font-size: 36rpx;" |
|||
@click="save"> |
|||
绑定</view> --> |
|||
|
|||
<view style="display: flex;flex-direction: column;padding:20px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<view style="background: #FF9D33; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<view style="background: #FFDAB2; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<text style="margin-left: 8px;font-size: 18px;color: #333;">绑定个人卡</text> |
|||
</view> |
|||
|
|||
<text style="margin-left: 8px;font-size: 14px;color: #333;margin-top: 20px;">提货编码</text> |
|||
<view style="display: flex;flex-direction: row;justify-content: space-between; |
|||
background: #F8F8F8;border-radius: 5px;box-sizing: border-box; |
|||
width: calc(100vw -40px);align-items: center; padding:10px 0px;margin-top: 5px;"> |
|||
<input maxlength="20" placeholder="请输入/扫码" |
|||
style="font-size: 30rpx;flex: 1;margin-right: 20px;padding-left: 10px;" type="number" |
|||
:value="page.code" @input="onKeyInput1" /> |
|||
<view style="width: 1px;height: 20px;background: #ccc; margin-right: 10px;"></view> |
|||
<uni-icons type="camera-filled" color="#c0c4cc" size="22" style="flex-shrink: 0;margin-right: 10px;" |
|||
@click="scan" /> |
|||
</view> |
|||
<text style="margin-left: 8px;font-size: 14px;color: #333;margin-top: 20px;">提货密码</text> |
|||
<view style="display: flex;flex-direction: row;justify-content: space-between; |
|||
background: #F8F8F8;border-radius: 5px; padding:10px 0px; |
|||
box-sizing: border-box;width: calc(100vw - 40px);align-items: center;margin-top: 10px;"> |
|||
<input maxlength="6" placeholder="请输入提货密码" style="font-size: 30rpx;flex: 1;padding-left: 10px;" |
|||
type="number" :value="page.codeKey" @input="onKeyInput2" /> |
|||
</view> |
|||
|
|||
<view style="background: -webkit-linear-gradient(left,#FFB176,#FE923B); position: absolute; bottom: 30px; |
|||
width: 90%;border-radius: 100rpx;height: 80rpx;display: flex; |
|||
flex-direction: column;align-items: center;line-height: 80rpx;color: #FFFFFF;font-size: 36rpx;" @click="save"> |
|||
绑定</view> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
//引入bus |
|||
import bus from '@/common/bus'; |
|||
export default { |
|||
data() { |
|||
return { |
|||
page: { |
|||
code: '', |
|||
codeKey: '', |
|||
customerSid: '' |
|||
} |
|||
} |
|||
}, |
|||
onUnload() { |
|||
let pages = getCurrentPages().length - 1; |
|||
wx.navigateBack({ |
|||
delta: pages |
|||
}) |
|||
}, |
|||
onLoad(options) { |
|||
let _this = this; |
|||
wx.login({ |
|||
success: function(res) { |
|||
uni.request({ |
|||
// 组装请求地址 |
|||
url: getApp().globalData.wxSilentLoginURL + "?wxCode=" + res.code, |
|||
method: "GET", |
|||
header: { |
|||
'content-type': "application/x-www-form-urlencoded" |
|||
}, |
|||
data: { |
|||
"wxCode": res.code |
|||
}, |
|||
success: res => { |
|||
if (res.statusCode == 200) { |
|||
if (!res.data.success) { |
|||
if (res.data.code == "110") { |
|||
// 需要绑定手机号 |
|||
uni.reLaunch({ |
|||
url: '/pages/index/BindPhone?openid=' + |
|||
res.data.data.wxMpOpenid |
|||
}) |
|||
} else { |
|||
// _this.status = 'more' |
|||
} |
|||
} else { |
|||
// 成功后跳转主页 |
|||
getApp().globalData.sid = res.data.data.sid |
|||
_this.page.customerSid = getApp().globalData.sid |
|||
console.log("用户sid", getApp().globalData.sid) |
|||
} |
|||
} else { |
|||
// _this.status = 'more' |
|||
} |
|||
}, |
|||
fail: (err) => { |
|||
// _this.status = 'more' |
|||
} |
|||
}); |
|||
}, |
|||
fail: function(res) { |
|||
// _this.status = 'more' |
|||
} |
|||
}); |
|||
|
|||
if (options) { |
|||
console.log("options", options) |
|||
|
|||
const q = decodeURIComponent(options.q) // 获取到二维码原始链接内容 |
|||
console.log("二维码原始链接内容", q) |
|||
|
|||
var code = q.split('=')[1] |
|||
|
|||
// var code = this.getQueryString(q, 'code');// code是你二维码链接里面的参数名 |
|||
|
|||
console.log("提货卡编码", code) |
|||
this.page.code = code |
|||
} |
|||
|
|||
|
|||
}, |
|||
methods: { |
|||
onKeyInput1: function(event) { |
|||
this.page.code = event.target.value |
|||
}, |
|||
onKeyInput2: function(event) { |
|||
this.page.codeKey = event.target.value |
|||
}, |
|||
scan() { |
|||
// 只允许通过相机扫码 |
|||
let _this = this |
|||
uni.scanCode({ |
|||
onlyFromCamera: true, |
|||
success: function(res) { |
|||
_this.page.code = res.result.substring(res.result.length - 20, res.result.length) |
|||
} |
|||
}); |
|||
}, |
|||
save() { |
|||
if (this.stringIsEmpty(this.page.code) || this.page.code.length != 20) { |
|||
this.shortToast('请输入或扫描20位提货编码') |
|||
return |
|||
} |
|||
if (this.stringIsEmpty(this.page.codeKey) || this.page.codeKey.length != 6) { |
|||
this.shortToast('请输入6位提货密码') |
|||
return |
|||
} |
|||
let _this = this |
|||
_this.$api.cardBind(this.page).then((resp) => { |
|||
bus.$emit('order', "监听回调"); |
|||
uni.switchTab({ |
|||
url: '/pages/home/personCard' |
|||
}) |
|||
|
|||
}).catch(e => { |
|||
_this.longToast(e.msg) |
|||
}) |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
|
|||
</style> |
|||
@ -0,0 +1,160 @@ |
|||
<template> |
|||
<view style="display: flex;flex-direction: column;background-color: #fff;"> |
|||
|
|||
<view class="top"> |
|||
<NavBar ref="nav" navTitle="绑定云菜窖" :showIcon="true" :start-change-height="page.startHeight" |
|||
:end-change-height="page.endHeight"> |
|||
</NavBar> |
|||
<view> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/bind_bj.png" mode="scaleToFill" |
|||
style="width: 100%;height: 70vw"></image> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<!-- <view style="display: flex;flex-direction: column;margin-top: -10vw;box-sizing: border-box;"> |
|||
<view |
|||
style="display: flex;flex-direction: column;border-radius: 20rpx;background: #FFFFFF;z-index: 1;align-items: center;box-sizing: border-box;"> |
|||
<view style="margin: 15px;">绑定云菜窖卡</view> |
|||
<view |
|||
style="display: flex;flex-direction: row;justify-content: space-between;box-sizing: border-box;width: calc(100vw - 60px);align-items: center;"> |
|||
<input maxlength="20" placeholder="请输入/扫码 提货编码" |
|||
style="font-size: 30rpx;flex: 1;background: #F8F8F8;border-radius: 5px;height: 40px;line-height: 40px;margin-right: 10px;padding-left: 10px;" |
|||
type="number" :value="page.code" @input="onKeyInput1" /> |
|||
<uni-icons type="camera-filled" color="#c0c4cc" size="22" style="flex-shrink: 0;" @click="scan" /> |
|||
</view> |
|||
<view |
|||
style="display: flex;flex-direction: row;justify-content: space-between;box-sizing: border-box;width: calc(100vw - 60px);align-items: center;margin-top: 10px;"> |
|||
<input maxlength="6" placeholder="请输入提货密码" |
|||
style="font-size: 30rpx;flex: 1;background: #F8F8F8;border-radius: 5px;height: 40px;line-height: 40px;padding-left: 10px;" |
|||
type="number" :value="page.codeKey" @input="onKeyInput2" /> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view |
|||
style="margin: 30px;background-color: #fd3655;width: calc(100% - 60px);border-radius: 100rpx;height: 80rpx;display: flex;flex-direction: column;align-items: center;line-height: 80rpx;color: #FFFFFF;font-size: 36rpx;" |
|||
@click="save"> |
|||
绑定</view> --> |
|||
|
|||
<view style="display: flex;flex-direction: column;padding:20px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<view style="background: #FF9D33; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<view style="background: #FFDAB2; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<text style="margin-left: 8px;font-size: 18px;color: #333;">绑定云菜窖</text> |
|||
</view> |
|||
|
|||
<text style="margin-left: 8px;font-size: 14px;color: #333;margin-top: 20px;">提货编码</text> |
|||
<view style="display: flex;flex-direction: row;justify-content: space-between; |
|||
background: #F8F8F8;border-radius: 5px;box-sizing: border-box; |
|||
width: calc(100vw -40px);align-items: center; padding:10px 0px;margin-top: 5px;"> |
|||
<input maxlength="20" placeholder="请输入/扫码" |
|||
style="font-size: 30rpx;flex: 1;margin-right: 20px;padding-left: 10px;" type="number" |
|||
:value="page.code" @input="onKeyInput1" /> |
|||
<!-- <view style="width: 1px;height: 20px;background: #ccc; margin-right: 10px;"></view> |
|||
<uni-icons type="camera-filled" color="#c0c4cc" size="22" style="flex-shrink: 0;margin-right: 10px;" |
|||
@click="scan" /> --> |
|||
</view> |
|||
<!-- <text style="margin-left: 8px;font-size: 14px;color: #333;margin-top: 20px;">提货密码</text> |
|||
<view style="display: flex;flex-direction: row;justify-content: space-between; |
|||
background: #F8F8F8;border-radius: 5px; padding:10px 0px; |
|||
box-sizing: border-box;width: calc(100vw - 40px);align-items: center;margin-top: 10px;"> |
|||
<input maxlength="6" placeholder="请输入提货密码" style="font-size: 30rpx;flex: 1;padding-left: 10px;" |
|||
type="number" :value="page.codeKey" @input="onKeyInput2" /> |
|||
</view> --> |
|||
|
|||
<view style="background: -webkit-linear-gradient(left,#FFB176,#FE923B); position: absolute; bottom: 30px; |
|||
width: 90%;border-radius: 100rpx;height: 80rpx;display: flex; |
|||
flex-direction: column;align-items: center;line-height: 80rpx;color: #FFFFFF;font-size: 36rpx;" @click="save"> |
|||
接收</view> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
//引入bus |
|||
import bus from '@/common/bus'; |
|||
export default { |
|||
data() { |
|||
return { |
|||
page: { |
|||
code: '', |
|||
codeKey: '', |
|||
customerSid: '', |
|||
startHeight: 0, |
|||
endHeight: 0 |
|||
}, |
|||
} |
|||
}, |
|||
onLoad(options) { |
|||
|
|||
this.page.code = options.code |
|||
this.page.codeKey = options.codeKey |
|||
|
|||
|
|||
this.page.customerSid = getApp().globalData.sid |
|||
let info = uni.getSystemInfoSync(); |
|||
|
|||
this.page.startHeight = info.windowWidth * 0.6 |
|||
this.page.endHeight = info.windowWidth * 0.8 |
|||
}, |
|||
methods: { |
|||
onKeyInput1(event) { |
|||
this.page.code = event.target.value |
|||
}, |
|||
onKeyInput2(event) { |
|||
this.page.codeKey = event.target.value |
|||
}, |
|||
scan() { |
|||
// 只允许通过相机扫码 |
|||
let _this = this |
|||
uni.scanCode({ |
|||
onlyFromCamera: true, |
|||
success(res) { |
|||
_this.page.code = res.result.substring(res.result.length - 20, res.result.length) |
|||
} |
|||
}); |
|||
}, |
|||
save() { |
|||
if (this.stringIsEmpty(this.page.code) || this.page.code.length != 20) { |
|||
this.shortToast('请输入20位提货编码') |
|||
return |
|||
} |
|||
|
|||
// if (this.stringIsEmpty(this.page.codeKey) || this.page.codeKey.length != 6) { |
|||
// this.shortToast('请输入6位提货密码') |
|||
// return |
|||
// } |
|||
let _this = this |
|||
_this.$api.bindAllCard(this.page).then((resp) => { |
|||
// bus.$emit('order', "监听回调"); |
|||
// setTimeout(() => { |
|||
// uni.$emit('order', "监听回调") |
|||
// }, 500) |
|||
const pages = getCurrentPages() |
|||
// 有可返回的页面则直接返回，uni.navigateBack 默认返回失败之后会自动刷新页面 ，无法继续返回 |
|||
if (pages.length > 1) { |
|||
uni.navigateBack(1) |
|||
return; |
|||
} else { |
|||
uni.switchTab({ |
|||
url: '/pages/home/myCellar' |
|||
}) |
|||
} |
|||
|
|||
|
|||
}).catch(e => { |
|||
_this.longToast(e.msg) |
|||
}) |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
.top { |
|||
width: 100vw; |
|||
height: 70vw; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,208 @@ |
|||
<template> |
|||
|
|||
<!-- 扫码进入 携带参数 --> |
|||
|
|||
<view style="display: flex;flex-direction: column;background-color: #fff;"> |
|||
|
|||
<view class="top"> |
|||
<NavBar ref="nav" navTitle="绑定云菜窖" :showIcon="true" :start-change-height="page.startHeight" |
|||
:end-change-height="page.endHeight"> |
|||
</NavBar> |
|||
<view> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/bind_bj.png" mode="scaleToFill" |
|||
style="width: 100%;height: 70vw"></image> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<!-- <view style="display: flex;flex-direction: column;margin-top: -10vw;box-sizing: border-box;"> |
|||
<view |
|||
style="display: flex;flex-direction: column;border-radius: 20rpx;background: #FFFFFF;z-index: 1;align-items: center;box-sizing: border-box;"> |
|||
<view style="margin: 15px;">绑定云菜窖卡</view> |
|||
<view |
|||
style="display: flex;flex-direction: row;justify-content: space-between;box-sizing: border-box;width: calc(100vw - 60px);align-items: center;"> |
|||
<input maxlength="20" placeholder="请输入/扫码 提货编码" |
|||
style="font-size: 30rpx;flex: 1;background: #F8F8F8;border-radius: 5px;height: 40px;line-height: 40px;margin-right: 10px;padding-left: 10px;" |
|||
type="number" :value="page.code" @input="onKeyInput1" /> |
|||
<uni-icons type="camera-filled" color="#c0c4cc" size="22" style="flex-shrink: 0;" @click="scan" /> |
|||
</view> |
|||
<view |
|||
style="display: flex;flex-direction: row;justify-content: space-between;box-sizing: border-box;width: calc(100vw - 60px);align-items: center;margin-top: 10px;"> |
|||
<input maxlength="6" placeholder="请输入提货密码" |
|||
style="font-size: 30rpx;flex: 1;background: #F8F8F8;border-radius: 5px;height: 40px;line-height: 40px;padding-left: 10px;" |
|||
type="number" :value="page.codeKey" @input="onKeyInput2" /> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view |
|||
style="margin: 30px;background-color: #fd3655;width: calc(100% - 60px);border-radius: 100rpx;height: 80rpx;display: flex;flex-direction: column;align-items: center;line-height: 80rpx;color: #FFFFFF;font-size: 36rpx;" |
|||
@click="save"> |
|||
绑定</view> --> |
|||
|
|||
<view style="display: flex;flex-direction: column;padding:20px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<view style="background: #FF9D33; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<view style="background: #FFDAB2; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<text style="margin-left: 8px;font-size: 18px;color: #333;">绑定云菜窖</text> |
|||
</view> |
|||
|
|||
<text style="margin-left: 8px;font-size: 14px;color: #333;margin-top: 20px;">提货编码</text> |
|||
<view style="display: flex;flex-direction: row;justify-content: space-between; |
|||
background: #F8F8F8;border-radius: 5px;box-sizing: border-box; |
|||
width: calc(100vw -40px);align-items: center; padding:10px 0px;margin-top: 5px;"> |
|||
<input maxlength="20" placeholder="请输入/扫码" |
|||
style="font-size: 30rpx;flex: 1;margin-right: 20px;padding-left: 10px;" type="number" |
|||
:value="page.code" @input="onKeyInput1" /> |
|||
<view style="width: 1px;height: 20px;background: #ccc; margin-right: 10px;"></view> |
|||
<uni-icons type="camera-filled" color="#c0c4cc" size="22" style="flex-shrink: 0;margin-right: 10px;" |
|||
@click="scan" /> |
|||
</view> |
|||
<text style="margin-left: 8px;font-size: 14px;color: #333;margin-top: 20px;">提货密码</text> |
|||
<view style="display: flex;flex-direction: row;justify-content: space-between; |
|||
background: #F8F8F8;border-radius: 5px; padding:10px 0px; |
|||
box-sizing: border-box;width: calc(100vw - 40px);align-items: center;margin-top: 10px;"> |
|||
<input maxlength="6" placeholder="请输入提货密码" style="font-size: 30rpx;flex: 1;padding-left: 10px;" |
|||
type="number" :value="page.codeKey" @input="onKeyInput2" /> |
|||
</view> |
|||
|
|||
<view style="background: -webkit-linear-gradient(left,#FFB176,#FE923B); position: absolute; bottom: 30px; |
|||
width: 90%;border-radius: 100rpx;height: 80rpx;display: flex; |
|||
flex-direction: column;align-items: center;line-height: 80rpx;color: #FFFFFF;font-size: 36rpx;" @click="save"> |
|||
接收</view> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
//引入bus |
|||
import bus from '@/common/bus'; |
|||
export default { |
|||
data() { |
|||
return { |
|||
page: { |
|||
code: '', |
|||
codeKey: '', |
|||
customerSid: '' |
|||
} |
|||
} |
|||
}, |
|||
onUnload() { |
|||
let pages = getCurrentPages().length - 1; |
|||
wx.navigateBack({ |
|||
delta: pages |
|||
}) |
|||
}, |
|||
onLoad(options) { |
|||
let _this = this; |
|||
wx.login({ |
|||
success: function(res) { |
|||
uni.request({ |
|||
// 组装请求地址 |
|||
url: getApp().globalData.wxSilentLoginURL + "?wxCode=" + res.code, |
|||
method: "GET", |
|||
header: { |
|||
'content-type': "application/x-www-form-urlencoded" |
|||
}, |
|||
data: { |
|||
"wxCode": res.code |
|||
}, |
|||
success: res => { |
|||
if (res.statusCode == 200) { |
|||
if (!res.data.success) { |
|||
if (res.data.code == "110") { |
|||
// 需要绑定手机号 |
|||
uni.reLaunch({ |
|||
url: '/pages/index/BindPhone?openid=' + |
|||
res.data.data.wxMpOpenid |
|||
}) |
|||
} else { |
|||
// _this.status = 'more' |
|||
} |
|||
} else { |
|||
// 成功后跳转主页 |
|||
getApp().globalData.sid = res.data.data.sid |
|||
_this.page.customerSid = getApp().globalData.sid |
|||
console.log("用户sid", getApp().globalData.sid) |
|||
} |
|||
} else { |
|||
// _this.status = 'more' |
|||
} |
|||
}, |
|||
fail: (err) => { |
|||
// _this.status = 'more' |
|||
} |
|||
}); |
|||
}, |
|||
fail: function(res) { |
|||
// _this.status = 'more' |
|||
} |
|||
}); |
|||
|
|||
if (options) { |
|||
console.log("options", options) |
|||
|
|||
const q = decodeURIComponent(options.q) // 获取到二维码原始链接内容 |
|||
console.log("二维码原始链接内容", q) |
|||
|
|||
var code = q.split('=')[1] |
|||
|
|||
// var code = this.getQueryString(q, 'code');// code是你二维码链接里面的参数名 |
|||
|
|||
console.log("提货卡编码", code) |
|||
this.page.code = code |
|||
} |
|||
|
|||
|
|||
}, |
|||
methods: { |
|||
onKeyInput1: function(event) { |
|||
this.page.code = event.target.value |
|||
}, |
|||
onKeyInput2: function(event) { |
|||
this.page.codeKey = event.target.value |
|||
}, |
|||
scan() { |
|||
// 只允许通过相机扫码 |
|||
let _this = this |
|||
uni.scanCode({ |
|||
onlyFromCamera: true, |
|||
success: function(res) { |
|||
_this.page.code = res.result.substring(res.result.length - 20, res.result.length) |
|||
} |
|||
}); |
|||
}, |
|||
save() { |
|||
|
|||
this.page.customerSid = getApp().globalData.sid |
|||
|
|||
if (this.stringIsEmpty(this.page.code) || this.page.code.length != 20) { |
|||
this.shortToast('请输入20位提货编码') |
|||
return |
|||
} |
|||
if (this.stringIsEmpty(this.page.codeKey) || this.page.codeKey.length != 6) { |
|||
this.shortToast('请输入6位提货密码') |
|||
return |
|||
} |
|||
let _this = this |
|||
|
|||
console.log("+++++++++++", this.page); |
|||
|
|||
_this.$api.bindAllCard(this.page).then((resp) => { |
|||
// bus.$emit('order', "监听回调"); |
|||
uni.switchTab({ |
|||
url: '/pages/home/myCellar' |
|||
}) |
|||
|
|||
}).catch(e => { |
|||
_this.longToast(e.msg) |
|||
}) |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
|
|||
</style> |
|||
@ -0,0 +1,241 @@ |
|||
<template> |
|||
|
|||
<view style="display: flex;flex-direction: column;"> |
|||
|
|||
<view class="top"> |
|||
<NavBar ref="nav" navTitle="首页" :showIcon="false" :start-change-height="page.startHeight" |
|||
:end-change-height="page.endHeight"> |
|||
</NavBar> |
|||
<view style="display: flex;flex-direction: column;align-items: center;"> |
|||
<view class="btn" @click="bind"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/binding.png" style="width: 15px;height: 15px;"> |
|||
</image> |
|||
<text |
|||
style="height: 45px;line-height: 45px;font-size: 17px; text-align: center;color: #FE6B00;margin-left: 11px;">绑定新卡</text> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view |
|||
style="display: flex;flex-direction: column;background-color: #fff;height: 50vh; border-top-left-radius: 25px;border-top-right-radius: 25px;margin-top: -9.06vw;"> |
|||
|
|||
<z-paging ref="paging" use-page-scroll v-model="data" @query="queryList" :refresher-enabled="false"> |
|||
|
|||
<view v-for="(item,index) in data" :key="index" |
|||
style="display: flex;flex-direction: column;align-items: center;margin-top: 14px;" |
|||
:class="item.showBtn==true?'oragin':'gray'" @click="detail(item)"> |
|||
|
|||
<view class="item" :class="{ item2: !item.showBtn }"> |
|||
|
|||
<!-- 外边 18px 内边 32px = 50px --> |
|||
<view |
|||
style="padding: 16px;display: flex;flex-direction: row;width: 100%;box-sizing: border-box;"> |
|||
|
|||
<!-- 礼包图标 总60px --> |
|||
<view style="flex-shrink: 0;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/pack.png" mode="aspectFill" |
|||
v-show="item.showBtn" style="width: 50px;height: 50px;margin-right: 10px;" /> |
|||
|
|||
<image src="https://supervise.yxtsoft.com/lpk/image/pack2.png" mode="aspectFill" |
|||
v-show="!item.showBtn" style="width: 50px;height: 50px;margin-right: 10px;" /> |
|||
</view> |
|||
|
|||
<view |
|||
style="flex: 1;display: flex;flex-direction: column;box-sizing: border-box;flex-wrap: nowrap;"> |
|||
|
|||
<view style="width: 100%;display: flex;flex-direction: row;"> |
|||
|
|||
<view style="flex: 1;display: flex;flex-direction: column;"> |
|||
<text class="_ellipsis" |
|||
style="font-size: 13px;color: #333;width: calc(100vw - 190px);">卡号: {{item.serialNumber}}</text> |
|||
<text class="_ellipsis" |
|||
style="font-size: 12px;color: #999;margin-top: 5px;width: calc(100vw - 182px);"> |
|||
{{item.time}}</text> |
|||
</view> |
|||
|
|||
<!-- 按钮 24 + 48 = 72px--> |
|||
<view :class="{ showBtn: !item.showBtn }" style="font-size: 12px;color:#fff;flex-shrink: 0; |
|||
border-radius: 15px; height: 30px;padding: 0px 12px;line-height: 30px;box-sizing: border-box; |
|||
background: -webkit-linear-gradient(left,#FF7405,#FFAD6D);">预约提货</view> |
|||
</view> |
|||
|
|||
<!-- 蔬菜礼包经典款+状态 --> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<text style="font-size: 15px;color: #FF7100;"> {{item.pname}}</text> |
|||
<text |
|||
style="border: 1px #FED4B3 solid;margin-left: 10px;border-radius: 15px;padding: 3px 10px; font-size: 12px; color: #FF6000;flex-shrink: 0;"> |
|||
{{item.state}}</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</z-paging> |
|||
</view> |
|||
</view> |
|||
|
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
page: { |
|||
remarks: '', |
|||
startHeight: 0, |
|||
endHeight: 0 |
|||
}, |
|||
data: [], |
|||
} |
|||
}, |
|||
onLoad() { |
|||
uni.$on("order", (e) => { |
|||
// 相当与下拉刷新 |
|||
this.$refs.paging.reload(true); |
|||
}) |
|||
let info = uni.getSystemInfoSync(); |
|||
|
|||
this.page.startHeight = info.windowWidth * 0.6 |
|||
this.page.endHeight = info.windowWidth * 0.8 |
|||
}, |
|||
onUnload() { |
|||
uni.$off('order'); |
|||
}, |
|||
onPageScroll(res) { |
|||
// 渐变 |
|||
this.$refs.nav.defaultColorBgAlpha(res) |
|||
}, |
|||
methods: { |
|||
// 分页的请求 |
|||
queryList(pageNo, pageSize) { |
|||
let _this = this |
|||
_this.$api.cardList({ |
|||
"current": pageNo, |
|||
"size": pageSize, |
|||
"params": { |
|||
"customerSid": getApp().globalData.sid |
|||
} |
|||
}).then((resp) => { |
|||
// 添加数据源 |
|||
this.$refs.paging.complete(resp.records) |
|||
}).catch(e => { |
|||
// 出错了，点击重试 |
|||
_this.$refs.paging.complete(false); |
|||
}) |
|||
}, |
|||
dialogInputConfirm(val) { |
|||
// 网络请求 绑定 |
|||
}, |
|||
bind() { |
|||
uni.navigateTo({ |
|||
url: '/pages/card/card_bind' |
|||
}) |
|||
}, |
|||
detail(item) { |
|||
|
|||
if (item.showBtn) { |
|||
// 正常 |
|||
uni.navigateTo({ |
|||
url: '/pages/card/card_detail?sid=' + item.sid |
|||
}) |
|||
} else { |
|||
// 过期 已完成 |
|||
uni.navigateTo({ |
|||
url: '/pages/card/card_detail2?sid=' + item.sid |
|||
}) |
|||
} |
|||
|
|||
}, |
|||
booking(item) { |
|||
|
|||
if (!item.notRese) { |
|||
this.shortToast("该卡商品已全部预约。") |
|||
return |
|||
} else { |
|||
uni.navigateTo({ |
|||
url: '/pages/card/card_booking?sid=' + item.sid |
|||
}) |
|||
} |
|||
|
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
._ellipsis { |
|||
overflow-wrap: break-word; |
|||
} |
|||
|
|||
.top { |
|||
width: 100vw; |
|||
/* height: 126.66vw; */ |
|||
height: 85vw; |
|||
/* 加载背景图 */ |
|||
background-image: url(https://supervise.yxtsoft.com/lpk/image/hmoe_bj.png); |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
background-size: 100% 100%; |
|||
} |
|||
|
|||
.btn { |
|||
/* margin-top: 97.86vw; */ |
|||
margin-top: 60vw; |
|||
width: 83%; |
|||
background-color: #FFF; |
|||
border-radius: 45px; |
|||
display: flex; |
|||
flex-direction: row; |
|||
justify-content: center; |
|||
align-items: center; |
|||
} |
|||
|
|||
.item { |
|||
/* 加载背景图 */ |
|||
background-image: url(https://supervise.yxtsoft.com/lpk/image/card_item.png); |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
background-size: 100% 100%; |
|||
width: calc(100% - 18px); |
|||
} |
|||
|
|||
.item2 { |
|||
/* 加载背景图 */ |
|||
background-image: url(https://supervise.yxtsoft.com/lpk/image/card_item2.png); |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
background-size: 100% 100%; |
|||
width: calc(100% - 18px); |
|||
} |
|||
|
|||
.showBtn { |
|||
visibility: hidden; |
|||
} |
|||
|
|||
.use { |
|||
display: flex; |
|||
flex-direction: row; |
|||
border-top-left-radius: 20rpx; |
|||
border-top-right-radius: 20rpx; |
|||
color: #FFF; |
|||
align-items: center; |
|||
background: linear-gradient(89.8deg, rgba(218, 51, 33, 1) -3.76%, rgba(237, 113, 53, 0) 300.05%); |
|||
} |
|||
|
|||
.gray { |
|||
filter: grayscale(100%); |
|||
-webkit-filter: grayscale(100%); |
|||
transition: filter 0.2s; |
|||
} |
|||
|
|||
|
|||
|
|||
.oragin {} |
|||
|
|||
uni-page-body, |
|||
page { |
|||
background: #FFFFFF; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,673 @@ |
|||
<template> |
|||
|
|||
<view style="display: flex;flex-direction: column;"> |
|||
|
|||
<view class="top"> |
|||
<NavBar ref="nav" navTitle="详情" :showIcon="true" :start-change-height="page.startHeight" |
|||
:end-change-height="page.endHeight"> |
|||
</NavBar> |
|||
<view style="display: flex;flex-direction: column;margin-top: 25vw; margin-left: 5vw;"> |
|||
<view style="font-size: 17px;color: #fff;height: 8vw;line-height: 8vw;margin-top: 5vw;"> |
|||
{{data.state}} |
|||
</view> |
|||
<view |
|||
style="font-size: 12px;color: white;line-height: 7vw;height: 7vw;color: #fff;box-sizing: border-box;"> |
|||
卡号：{{data.serialNumber}} |
|||
</view> |
|||
<view style="font-size: 12px;color: white;line-height: 7vw;height: 7vw;color: #fff;"> |
|||
{{data.time}} |
|||
</view> |
|||
</view> |
|||
|
|||
</view> |
|||
<view |
|||
style="display: flex;flex-direction: row;justify-content: center; |
|||
background-color: #fff;height: 25vw; border-top-left-radius: 25px;border-top-right-radius: 25px;margin-top: -9.06vw;"> |
|||
|
|||
<image src="https://supervise.yxtsoft.com/lpk/image/giftpack.png" mode="aspectFit" |
|||
style="margin-left: 20px;margin-right: 20px; width: 80vw;height: 25vw;"></image> |
|||
|
|||
<text |
|||
style="color: #fff;font-size: 18px;z-index: 10;position: absolute;margin-top: 11vw;">{{data.pname}}</text> |
|||
|
|||
|
|||
</view> |
|||
<loading-state ref="pageView" @request="request"> |
|||
|
|||
<view style="background-color: #fff;margin-top: 10px;padding: 10px 15px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<view style="background: #FF9D33; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<view style="background: #FFDAB2; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<text style="margin-left: 8px;font-size: 14px;color: #333;">商品明细</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view v-for="(item,index) in data.goodsVos" :key="index" @click="itemClick(item.goodsSid)" |
|||
style="display: flex;flex-direction: row;background-color: #fff;padding-left: 10px;padding-right: 10px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;background-color: #fff;padding: 10px 15px; |
|||
border-bottom: 1px #F1F2F3 solid; width: 100%;"> |
|||
<image :src="item.pic" style="width: 60px;height: 60px;flex-shrink: 0;"></image> |
|||
<view style="margin-left: 10px;margin-right: 10px;flex: 1;"> |
|||
<text class="text" style="font-weight: 500;">{{item.goods}} |
|||
</text> |
|||
<view style="font-size: 12px;color: #666666;margin-top: 5px;">{{item.remarks}}</view> |
|||
<view style="display: flex;flex-direction: row;justify-content: space-between;margin-top: 5px;"> |
|||
<text |
|||
style="font-size: 12px;color: #666666;margin-right: 10px;">总数：{{item.num}}{{item.unitName}} |
|||
</text> |
|||
<view style="font-size: 12px;color: #666666;">可预约：{{item.lnum}}{{item.unitName}}</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
|
|||
<view style="background-color: #fff;margin-top: 10px;padding: 10px 15px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<view style="background: #FF9D33; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<view style="background: #FFDAB2; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<text style="margin-left: 8px;font-size: 14px;color: #333;">预约记录</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view style="margin-bottom: 10px;"> |
|||
<view v-for="(item,index) in data.orderCardVoList" :key="index" |
|||
style="display: flex;flex-direction: row;background-color: #fff;padding-left: 10px;padding-right: 10px;"> |
|||
|
|||
<view style="display: flex;flex-direction: column;background-color: #fff; |
|||
border-bottom: 1px #F1F2F3 solid; width: 100%;padding-left: 20px;padding-bottom: 10px;"> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 10px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/date.png" |
|||
style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text |
|||
style="margin-left: 5px;font-size: 12px; color: #999;">提货时间：{{item.reserveDate}}</text> |
|||
</view> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/location.png" |
|||
style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text style="margin-left: 5px;font-size: 12px; color: #999;">提货地点：{{item.store}}</text> |
|||
</view> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/user2.png" mode="aspectFill" |
|||
style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text |
|||
style="margin-left: 5px;font-size: 12px; color: #999;">提 货 人：{{item.userName}}</text> |
|||
</view> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/phone2.png" mode="aspectFill" |
|||
style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text style="margin-left: 5px;font-size: 12px; color: #999;">联系电话：{{item.userPhone}}</text> |
|||
</view> |
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 8px;"> |
|||
<text style="color: #999; font-size: 12px;">- {{item.goods}}</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view style="background-color: #fff;margin-top: 10px;padding: 10px 15px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<view style="background: #FF472B; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<view style="background: #FF7268; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<text style="margin-left: 8px;font-size: 14px;color: #333;">转赠信息</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view style="margin-bottom: 50px;"> |
|||
|
|||
<view v-if="data.empCardGift!=null" style="display: flex;flex-direction: row;background-color: #fff; |
|||
border-bottom: 1px #F1F2F3 solid; padding-left: 10px; padding-right: 10px; padding-bottom: 10px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;width: 100%;margin-top: 10px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/giftNormal.png" |
|||
style="width: 50px;height: 50px;margin-right: 10px;flex-shrink: 0;"></image> |
|||
|
|||
<view style="display: flex;flex-direction: column;width: 100%;"> |
|||
|
|||
<text |
|||
style="font-size: 12px; color: #333;margin-top: 5px;">福礼卡编码：{{data.empCardGift.code}}</text> |
|||
<text |
|||
style="font-size: 12px; color: #333;margin-top: 5px;">提货密码：{{data.empCardGift.codeKey}}</text> |
|||
<text |
|||
style="font-size: 12px; color: #333;margin-top: 5px;">备注说明：{{data.empCardGift.remarks}}</text> |
|||
|
|||
<view |
|||
style="display: flex;flex-direction: row;margin-top: 5px;align-items: center;justify-content: space-between;"> |
|||
<text |
|||
style="flex: 1;font-size: 12px; color: #A5A5A5; margin-right: 10px;">{{data.empCardGift.goods}}</text> |
|||
|
|||
<button v-show="data.empCardGift.isShare=='1'" class='sharebtn' |
|||
:data-info="data.empCardGift" open-type="share">分享</button> |
|||
<button v-show="data.empCardGift.isShare=='2'" class='sharebtn2' |
|||
:data-info="data.empCardGift" open-type="share">已分享</button> |
|||
<button v-show="data.empCardGift.isShare=='3'" class='sharebtn3'>已绑定</button> |
|||
|
|||
|
|||
</view> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view style="height: 50px;"></view> |
|||
|
|||
<view v-if="data.notRese" style="width: 100%; background-color: #fff;height: 15vw;position: fixed;bottom: 0;overflow:hidden; |
|||
display: flex;flex-direction: row;"> |
|||
<text style=" width: 20vw;font-size: 16px;color: #fff; background-color: #FF9D33; |
|||
padding: 10px 20px; display:margin：auto;text-align: center;line-height: 10vw;" @click="showDialog2">转赠卡券</text> |
|||
|
|||
<view style="flex: 1;"></view> |
|||
|
|||
<text style=" width: 20vw;font-size: 16px;color: #fff; background-color: #FF9D33; |
|||
padding: 10px 20px; display:margin：auto;text-align: center;line-height: 10vw;" @click="showDialog">预约提货</text> |
|||
|
|||
</view> |
|||
|
|||
|
|||
</loading-state> |
|||
|
|||
|
|||
<!-- 弹窗蒙版 --> |
|||
<view class="model" catchtouchmove='preventTouchMove' v-if='showModal' @click.stop="colseDialog()"></view> |
|||
<view class="modalDlg" catchtouchmove='preventTouchMove' v-if='showModal'> |
|||
<scroll-view scroll-y="true" style="height: 100%;width: 100%; padding: 20px; " bindscrolltoupper="upper" |
|||
bindscrolltolower="lower" bindscroll="scroll"> |
|||
|
|||
<view style="display: flex;flex-direction: column;margin-top: 10px;"> |
|||
<text>提货地点</text> |
|||
<view |
|||
style="margin-top: 10px;background:#F5F5F5 ; display: flex;flex-direction: row;justify-content: space-between;width: 89.5%;border-radius: 4px;min-height: 35px;align-items: center;" |
|||
@click="address"> |
|||
<view v-if="stringIsEmpty(data.addressName)" |
|||
style="color: #666;font-size: 12px;margin-left: 10px;"> |
|||
请选择提货点</view> |
|||
<view v-if="stringIsNotEmpty(data.addressName)" |
|||
style="color: #666;font-size: 12px;margin-left: 10px;">{{data.addressName}}</view> |
|||
<uni-icons type="bottom" size="14" color="#999" style="flex-direction: 0;margin: 0px 5px;" /> |
|||
</view> |
|||
</view> |
|||
|
|||
<view style="display: flex;flex-direction: column;margin-top: 10px;"> |
|||
<text>提货时间</text> |
|||
<view style="display: flex;align-items: center;margin-top: 6px;width: 89.5%;"> |
|||
<uni-datetime-picker type="date" v-model="data.reserveDate" style="flex: 1;background: #F8F8F8;" |
|||
:start="data.start" :end="data.end" :disabledDate="disabledDate" /> |
|||
</view> |
|||
</view> |
|||
|
|||
<view style="display: flex;flex-direction: column;margin-top: 10px;"> |
|||
<text>提货人</text> |
|||
<view style="display: flex;align-items: center;margin-top: 6px;width: 89.5%;"> |
|||
<input placeholder="请输入提货人" |
|||
style="font-size: 30rpx;flex: 1;background: #F8F8F8;border-radius: 5px;height: 40px;line-height: 40px;padding-left: 10px;" |
|||
:value="data.userName" @input="onKeyInput1" /> |
|||
</view> |
|||
</view> |
|||
|
|||
<view style="display: flex;flex-direction: column;margin-top: 10px;"> |
|||
<text>联系电话</text> |
|||
<view style="display: flex;align-items: center;margin-top: 6px;width: 89.5%;"> |
|||
<input maxlength="11" placeholder="请输入联系电话" |
|||
style="font-size: 30rpx;flex: 1;background: #F8F8F8;border-radius: 5px;height: 40px;line-height: 40px;padding-left: 10px;" |
|||
type="number" :value="data.userPhone" @input="onKeyInput2" /> |
|||
</view> |
|||
</view> |
|||
|
|||
<view style="background: #F5F5F5; border-radius: 5px;margin-top: 15px;width: 89.5%;"> |
|||
<view v-for="(item,index) in data.goodsVos" |
|||
style="display: flex;flex-direction: row;margin-top: 15px; margin-bottom: 10px;"> |
|||
<view style="margin-left: 10px;margin-right: 10px;flex: 1; |
|||
display: flex;flex-direction: column;justify-content: space-between;align-items: flex-end; |
|||
padding: 10px;"> |
|||
<text class="text" style="font-weight: 500;width: 100%;font-size: 14px;">{{item.goods}} |
|||
</text> |
|||
<text class="text" |
|||
style="font-weight: 500;width: 100%;color: #919191; font-size: 12px;">剩余：{{item.lnum}}{{item.unitName}} |
|||
</text> |
|||
<uni-number-box ref="box" style="margin-top: -30px;" :showTextView="true" :min="0" |
|||
:max="item.lnum" v-model="item.select"></uni-number-box> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view |
|||
style="display: flex;flex-direction: row;align-items: center;justify-content: center;margin-top: 100px;width: 100%;"> |
|||
|
|||
<text |
|||
style="border-radius:30px; font-size: 14px;color: #666;background-color: #F5F5F5; padding: 5px 30px;margin-right: 20px;" |
|||
@click.stop="colseDialog()">取消</text> |
|||
<text |
|||
style="border-radius: 30px; font-size: 14px;color: #fff; background-color: #FF9D33; padding: 5px 30px;margin-left: 20px;" |
|||
@click="save">确认</text> |
|||
|
|||
</view> |
|||
|
|||
<view style="height: 50px;"> |
|||
|
|||
</view> |
|||
|
|||
</scroll-view> |
|||
</view> |
|||
|
|||
|
|||
<!-- 弹窗蒙版 --> |
|||
<view class="model" catchtouchmove='preventTouchMove' v-if='showModal2' @click.stop="colseDialog2()"></view> |
|||
<view class="modalDlg" catchtouchmove='preventTouchMove' v-if='showModal2'> |
|||
<scroll-view scroll-y="true" style="height: 100%; width: 100%; box-sizing: border-box; |
|||
" bindscrolltoupper="upper" bindscrolltolower="lower" bindscroll="scroll"> |
|||
|
|||
|
|||
<view style="display: flex;flex-direction: column;margin: 20px;"> |
|||
<text>备注说明</text> |
|||
<view style="display: flex;align-items: center;margin-top: 6px;"> |
|||
<textarea placeholder="请输入" :disable-default-padding='true' :fixed="true" style="font-size: 30rpx;flex: 1;background: #F8F8F8;border-radius: 5px;min-height: 50px;line-height: 20px;padding: 10px; |
|||
white-space: pre-wrap; |
|||
word-wrap: break-word;" :value="info.remarks" @input="onKeyInput3" /> |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
|
|||
<view style="background: #F5F5F5; border-radius: 5px;;margin: 20px;"> |
|||
<view v-for="(item,index) in data.goodsVos" |
|||
style="display: flex;flex-direction: row;margin-top: 15px; margin-bottom: 10px;width: 100%;"> |
|||
<view style="margin-left: 10px;margin-right: 10px;flex: 1; |
|||
display: flex;flex-direction: row; align-items: center; |
|||
padding: 10px;width: 100%; justify-content: space-between;"> |
|||
<text style="font-weight: 500;font-size: 14px; ">{{item.goods}} |
|||
</text> |
|||
<text |
|||
style="font-weight: 500;color: #919191; font-size: 12px;">剩余：{{item.lnum}}{{item.unitName}} |
|||
</text> |
|||
<!-- <uni-number-box ref="box" style="margin-top: -30px;" :showTextView="true" :min="0" |
|||
:max="item.lnum" v-model="item.select"></uni-number-box> --> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view |
|||
style="display: flex;flex-direction: row;align-items: center;justify-content: center;margin-top: 100px;width: 100%;"> |
|||
|
|||
<text |
|||
style="border-radius:30px; font-size: 14px;color: #666;background-color: #F5F5F5; padding: 5px 30px;margin-right: 20px;" |
|||
@click.stop="colseDialog2()">取消</text> |
|||
<text |
|||
style="border-radius: 30px; font-size: 14px;color: #fff; background-color: #FF9D33; padding: 5px 30px;margin-left: 20px;" |
|||
@click="save2()">确认</text> |
|||
|
|||
</view> |
|||
<view style="height: 50px;"> |
|||
|
|||
</view> |
|||
|
|||
</scroll-view> |
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
//引入bus |
|||
import bus from '@/common/bus'; |
|||
export default { |
|||
data() { |
|||
return { |
|||
showModal: false, |
|||
showModal2: false, |
|||
page: { |
|||
sid: '', |
|||
startHeight: 0, |
|||
endHeight: 0 |
|||
}, |
|||
data: { |
|||
time: "", |
|||
name: "", |
|||
pname: "", |
|||
state: "", |
|||
notRese: false, |
|||
showBtn: false, |
|||
showRecord: false, |
|||
goodsVos: [], |
|||
value: "", |
|||
userName: "", |
|||
userPhone: "", |
|||
}, |
|||
disabledDate: [ |
|||
// '2023-12-16' |
|||
], |
|||
info: { |
|||
empCardSid: "", |
|||
remarks: "", |
|||
goodsVoList: [] |
|||
} |
|||
} |
|||
}, |
|||
mounted() { |
|||
uni.$on("order", (e) => { |
|||
this.$nextTick(() => { |
|||
this.$refs.pageView.setLoadState(0) |
|||
}) |
|||
this.request(); |
|||
}) |
|||
|
|||
uni.$on("address", (e) => { |
|||
// 相当与下拉刷新 |
|||
this.data.value = e.sid; |
|||
this.data.addressName = e.name; |
|||
}) |
|||
}, |
|||
onLoad(options) { |
|||
this.page.sid = options.sid |
|||
this.request() |
|||
|
|||
let info = uni.getSystemInfoSync(); |
|||
|
|||
this.page.startHeight = info.windowWidth * 0.6 |
|||
this.page.endHeight = info.windowWidth * 0.8 |
|||
}, |
|||
onUnload() { |
|||
uni.$off('order'); |
|||
uni.$off('address'); |
|||
}, |
|||
methods: { |
|||
showDialog() { |
|||
this.showModal = true |
|||
}, |
|||
showDialog2() { |
|||
this.showModal2 = true |
|||
}, |
|||
colseDialog() { |
|||
this.showModal = false |
|||
}, |
|||
colseDialog2() { |
|||
this.showModal2 = false |
|||
}, |
|||
address() { |
|||
uni.navigateTo({ |
|||
url: '/pages/SelectAddressActivity' |
|||
}) |
|||
}, |
|||
onKeyInput1: function(event) { |
|||
this.data.userName = event.target.value |
|||
}, |
|||
onKeyInput2: function(event) { |
|||
this.data.userPhone = event.target.value |
|||
}, |
|||
onKeyInput3: function(event) { |
|||
this.info.remarks = event.target.value |
|||
}, |
|||
save() { |
|||
if (this.stringIsEmpty(this.data.value)) { |
|||
this.shortToast('请选择提货地点') |
|||
return |
|||
} |
|||
if (this.stringIsEmpty(this.data.reserveDate)) { |
|||
this.shortToast('请选择提货时间') |
|||
return |
|||
} |
|||
if (this.stringIsEmpty(this.data.userName)) { |
|||
this.shortToast('请输入提货人员') |
|||
return |
|||
} |
|||
if (this.stringIsEmpty(this.data.userPhone)) { |
|||
this.shortToast('请输入手机号码') |
|||
return |
|||
} |
|||
if (this.data.userPhone.length != 11) { |
|||
this.shortToast('手机号码格式不对') |
|||
return |
|||
} |
|||
|
|||
|
|||
let num = 0; |
|||
for (var i = 0; i < this.data.goodsVos.length; i++) { |
|||
num += Number(this.data.goodsVos[i].select); |
|||
} |
|||
if (num == 0) { |
|||
this.shortToast('您未选择任何商品') |
|||
return |
|||
} |
|||
|
|||
let _this = this |
|||
_this.$api.cardBookingSave(this.data).then((resp) => { |
|||
bus.$emit('order', "监听回调"); |
|||
// setTimeout(() => { |
|||
// uni.$emit('order', "监听回调") |
|||
// }, 500) |
|||
uni.navigateBack() |
|||
|
|||
|
|||
}).catch(e => { |
|||
_this.shortToast(e.msg) |
|||
}) |
|||
|
|||
}, |
|||
|
|||
save2() { |
|||
|
|||
let _this = this |
|||
|
|||
this.info.empCardSid = this.page.sid, |
|||
this.info.goodsVoList = this.data.goodsVos, |
|||
|
|||
console.log("info>>", this.info); |
|||
|
|||
_this.$api.generateEmpCard(this.info).then((resp) => { |
|||
bus.$emit('order', "监听回调"); |
|||
uni.navigateBack() |
|||
|
|||
}).catch(e => { |
|||
_this.shortToast(e.msg) |
|||
}) |
|||
|
|||
}, |
|||
|
|||
request() { |
|||
let _this = this |
|||
_this.$api.cardDetail(this.page.sid).then((resp) => { |
|||
_this.data = resp |
|||
_this.$nextTick(() => { |
|||
_this.$refs.pageView.setLoadState(2) |
|||
}) |
|||
this.getSun() |
|||
}).catch(e => { |
|||
_this.$nextTick(() => { |
|||
_this.$refs.pageView.setLoadState(1) |
|||
}) |
|||
}) |
|||
}, |
|||
|
|||
getSun() { |
|||
let _this = this |
|||
_this.$api.isSaturAndSun(this.page.sid).then((resp) => { |
|||
|
|||
// console.log("aaa",resp) |
|||
|
|||
this.disabledDate = resp |
|||
|
|||
}).catch(e => { |
|||
|
|||
}) |
|||
}, |
|||
|
|||
showRecord(sid) { |
|||
uni.navigateTo({ |
|||
url: '/pages/card/card_record?sid=' + sid |
|||
}) |
|||
}, |
|||
booking(sid) { |
|||
uni.navigateTo({ |
|||
url: '/pages/card/card_booking?sid=' + sid |
|||
}) |
|||
}, |
|||
itemClick(goodsSid) { |
|||
uni.navigateTo({ |
|||
url: '/pages/good/goodsDetail?sid=' + goodsSid |
|||
}) |
|||
}, |
|||
onShareAppMessage: function(res) { |
|||
console.log("res", res) |
|||
console.log("data", res.target.dataset) |
|||
var data = res.target.dataset.info |
|||
this.shareCard(data.sid) |
|||
return { |
|||
title: '汇融农链-云菜窖', |
|||
path: '/pages/bind/bind_giftCard?code=' + data.code + '&codeKey=' + data.codeKey, |
|||
imageUrl: 'https://supervise.yxtsoft.com/lpk/image/shareGift.png', //自定义图片路径，显示图片长宽比是 5:4。 |
|||
success: function(res) { |
|||
console.log('aaaa', "分享成功") |
|||
}, |
|||
fail: function(res) { |
|||
// 转发失败 |
|||
console.log('aaaa', "用户点击了取消") |
|||
} |
|||
} |
|||
}, |
|||
|
|||
shareCard(sid) { |
|||
let _this = this |
|||
|
|||
_this.$api.shareEmpCard(sid).then((resp) => { |
|||
|
|||
var item = _this.data.empCardGiftVos.find(item => item.sid === sid) |
|||
|
|||
console.log("item", item); |
|||
|
|||
item.share = '2' |
|||
|
|||
}).catch(e => {}) |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
.canvas-code { |
|||
width: 39vw !important; |
|||
height: 39vw !important; |
|||
} |
|||
|
|||
.sharebtn { |
|||
background: #FF4727; |
|||
font-size: 12px; |
|||
color: #fff; |
|||
width: 20vw; |
|||
border-radius: 20px; |
|||
} |
|||
|
|||
|
|||
.sharebtn::after { |
|||
border: none; |
|||
} |
|||
|
|||
.sharebtn2 { |
|||
background: #FF7165; |
|||
width: 20vw; |
|||
font-size: 12px; |
|||
color: #fff; |
|||
border-radius: 20px; |
|||
} |
|||
|
|||
.sharebtn2::after { |
|||
border: none; |
|||
} |
|||
|
|||
.sharebtn3 { |
|||
background: #CFCFCF; |
|||
width: 20vw; |
|||
font-size: 12px; |
|||
color: #fff; |
|||
border-radius: 20px; |
|||
} |
|||
|
|||
.sharebtn3::after { |
|||
border: none; |
|||
} |
|||
|
|||
.top { |
|||
width: 100vw; |
|||
/* height: 126.66vw; */ |
|||
height: 65vw; |
|||
/* 加载背景图 */ |
|||
background-image: url(https://supervise.yxtsoft.com/lpk/image/detail_bj1.png); |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
background-size: 100% 100%; |
|||
} |
|||
|
|||
.text { |
|||
white-space: normal; |
|||
text-overflow: -o-ellipsis-lastline; |
|||
overflow: hidden; |
|||
text-overflow: ellipsis; |
|||
display: -webkit-box; |
|||
-webkit-line-clamp: 2; |
|||
line-clamp: 2; |
|||
-webkit-box-orient: vertical; |
|||
} |
|||
|
|||
uni-page-body, |
|||
page { |
|||
background: #F1F2F3; |
|||
} |
|||
|
|||
.btn { |
|||
border: 1px solid; |
|||
padding-left: 30rpx; |
|||
padding-right: 30rpx; |
|||
padding-top: 12rpx; |
|||
padding-bottom: 12rpx; |
|||
border-radius: 50rpx; |
|||
height: 15px; |
|||
margin-left: 25rpx; |
|||
font-size: 26rpx; |
|||
} |
|||
|
|||
/* 弹窗样式 */ |
|||
.model { |
|||
position: absolute; |
|||
width: 100%; |
|||
height: 100%; |
|||
background: #000; |
|||
z-index: 999; |
|||
opacity: 0.5; |
|||
top: 0; |
|||
left: 0; |
|||
} |
|||
|
|||
.modalDlg { |
|||
/* 设置超出滚动 */ |
|||
overflow: auto; |
|||
width: 100%; |
|||
position: fixed; |
|||
top: 50vw; |
|||
left: 0; |
|||
right: 0; |
|||
bottom: 0; |
|||
z-index: 9999; |
|||
background-color: #fff; |
|||
border-top-right-radius: 20px; |
|||
border-top-left-radius: 20px; |
|||
display: flex; |
|||
flex-direction: column; |
|||
|
|||
} |
|||
</style> |
|||
@ -0,0 +1,487 @@ |
|||
<template> |
|||
|
|||
<view style="display: flex;flex-direction: column;"> |
|||
|
|||
<view class="top"> |
|||
<NavBar ref="nav" navTitle="详情" :showIcon="true" :start-change-height="page.startHeight" |
|||
:end-change-height="page.endHeight"> |
|||
</NavBar> |
|||
<view style="display: flex;flex-direction: column;margin-top: 25vw; margin-left: 5vw;"> |
|||
<view style="font-size: 17px;color: #fff;height: 8vw;line-height: 8vw;margin-top: 5vw;"> |
|||
{{data.state}} |
|||
</view> |
|||
<view |
|||
style="font-size: 12px;color: white;line-height: 7vw;height: 7vw;color: #fff;box-sizing: border-box;"> |
|||
卡号：{{data.serialNumber}} |
|||
</view> |
|||
<view style="font-size: 12px;color: white;line-height: 7vw;height: 7vw;color: #fff;"> |
|||
{{data.time}} |
|||
</view> |
|||
</view> |
|||
|
|||
</view> |
|||
<view |
|||
style="display: flex;flex-direction: row;justify-content: center; |
|||
background-color: #fff;height: 25vw; border-top-left-radius: 25px;border-top-right-radius: 25px;margin-top: -9.06vw;"> |
|||
|
|||
<image src="https://supervise.yxtsoft.com/lpk/image/giftpack.png" mode="aspectFit" |
|||
style="margin-left: 20px;margin-right: 20px; width: 80vw;height: 25vw;"></image> |
|||
|
|||
<text |
|||
style="color: #fff;font-size: 18px;z-index: 10;position: absolute;margin-top: 11vw;">{{data.pname}}</text> |
|||
|
|||
</view> |
|||
<loading-state ref="pageView" @request="request"> |
|||
|
|||
<view style="background-color: #fff;margin-top: 10px;padding: 10px 15px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<view style="background: #FF9D33; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<view style="background: #FFDAB2; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<text style="margin-left: 8px;font-size: 14px;color: #333;">商品明细</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view v-for="(item,index) in data.goodsVos" :key="index" @click="itemClick(item.goodsSid)" |
|||
style="display: flex;flex-direction: row;background-color: #fff;padding-left: 10px;padding-right: 10px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;background-color: #fff;padding: 10px 15px; |
|||
border-bottom: 1px #F1F2F3 solid; width: 100%;"> |
|||
<image :src="item.pic" style="width: 60px;height: 60px;flex-shrink: 0;"></image> |
|||
<view style="margin-left: 10px;margin-right: 10px;flex: 1;"> |
|||
<text class="text" style="font-weight: 500;">{{item.goods}} |
|||
</text> |
|||
<view style="font-size: 12px;color: #666666;margin-top: 5px;">{{item.remarks}}</view> |
|||
<view style="display: flex;flex-direction: row;justify-content: space-between;margin-top: 5px;"> |
|||
<text |
|||
style="font-size: 12px;color: #666666;margin-right: 10px;">总数：{{item.num}}{{item.unitName}} |
|||
</text> |
|||
<view style="font-size: 12px;color: #666666;">可预约：{{item.lnum}}{{item.unitName}}</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
|
|||
<view style="background-color: #fff;margin-top: 10px;padding: 10px 15px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<view style="background: #FF9D33; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<view style="background: #FFDAB2; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<text style="margin-left: 8px;font-size: 14px;color: #333;">预约记录</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view style="margin-bottom: 10px;"> |
|||
<view v-for="(item,index) in data.orderCardVoList" :key="index" @click="itemClick(item.goodsSid)" |
|||
style="display: flex;flex-direction: row;background-color: #fff;padding-left: 10px;padding-right: 10px;"> |
|||
|
|||
<view style="display: flex;flex-direction: column;background-color: #fff; |
|||
border-bottom: 1px #F1F2F3 solid; width: 100%;padding-left: 20px;padding-bottom: 10px;"> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 10px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/date.png" |
|||
style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text |
|||
style="margin-left: 5px;font-size: 12px; color: #999;">提货时间：{{item.reserveDate}}</text> |
|||
</view> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/location.png" |
|||
style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text style="margin-left: 5px;font-size: 12px; color: #999;">提货地点：{{item.store}}</text> |
|||
</view> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/user2.png" mode="aspectFill" |
|||
style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text |
|||
style="margin-left: 5px;font-size: 12px; color: #999;">提 货 人：{{item.userName}}</text> |
|||
</view> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/phone2.png" mode="aspectFill" |
|||
style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text style="margin-left: 5px;font-size: 12px; color: #999;">联系电话：{{item.userPhone}}</text> |
|||
</view> |
|||
|
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 8px;"> |
|||
<text style="color: #999; font-size: 12px;">- {{item.goods}}</text> |
|||
</view> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view style="background-color: #fff;margin-top: 10px;padding: 10px 15px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<view style="background: #FF9D33; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<view style="background: #FFDAB2; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<text style="margin-left: 8px;font-size: 14px;color: #333;">转赠信息</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view style="margin-bottom: 50px;"> |
|||
|
|||
<view v-if="data.empCardGift!=null" style="display: flex;flex-direction: row;background-color: #fff; |
|||
border-bottom: 1px #F1F2F3 solid;padding-left: 10px; padding-right: 10px; padding-bottom: 10px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;width: 100%;margin-top: 10px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/welfare_Card.png" |
|||
style="width: 50px;height: 50px;margin-right: 10px;flex-shrink: 0;"></image> |
|||
|
|||
<view style="display: flex;flex-direction: column;width: 100%;"> |
|||
|
|||
<text |
|||
style="font-size: 12px; color: #333;margin-top: 5px;">福礼卡编码：{{data.empCardGift.code}}</text> |
|||
<text |
|||
style="font-size: 12px; color: #333;margin-top: 5px;">提货密码：{{data.empCardGift.codeKey}}</text> |
|||
<text |
|||
style="font-size: 12px; color: #333;margin-top: 5px;">备注说明：{{data.empCardGift.remarks}}</text> |
|||
|
|||
<view |
|||
style="display: flex;flex-direction: row;margin-top: 5px;align-items: center;justify-content: space-between;"> |
|||
<text |
|||
style="flex: 1;font-size: 12px; color: #A5A5A5; margin-right: 10px;">{{data.empCardGift.goods}}</text> |
|||
|
|||
<button v-show="data.empCardGift.isShare=='1'" class='sharebtn' |
|||
:data-info="data.empCardGift" open-type="share">分享</button> |
|||
<button v-show="data.empCardGift.isShare=='2'" class='sharebtn2' |
|||
:data-info="data.empCardGift" open-type="share">已分享</button> |
|||
<button v-show="data.empCardGift.isShare=='3'" class='sharebtn3'>已绑定</button> |
|||
|
|||
|
|||
</view> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
<view style="height: 50px;"></view> |
|||
|
|||
|
|||
|
|||
</loading-state> |
|||
|
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
//引入bus |
|||
import bus from '@/common/bus'; |
|||
export default { |
|||
data() { |
|||
return { |
|||
page: { |
|||
sid: '', |
|||
startHeight: 0, |
|||
endHeight: 0 |
|||
}, |
|||
data: { |
|||
time: "", |
|||
name: "", |
|||
pname: "", |
|||
state: "", |
|||
notRese: false, |
|||
showBtn: false, |
|||
showRecord: false, |
|||
goodsVos: [], |
|||
value: "", |
|||
userName: "", |
|||
userPhone: "", |
|||
} |
|||
} |
|||
}, |
|||
onLoad(options) { |
|||
this.page.sid = options.sid |
|||
this.request() |
|||
uni.$on("order", (e) => { |
|||
this.$nextTick(() => { |
|||
this.$refs.pageView.setLoadState(0) |
|||
}) |
|||
this.request(); |
|||
}) |
|||
|
|||
let info = uni.getSystemInfoSync(); |
|||
|
|||
this.page.startHeight = info.windowWidth * 0.6 |
|||
this.page.endHeight = info.windowWidth * 0.8 |
|||
}, |
|||
onUnload() { |
|||
uni.$off('order'); |
|||
}, |
|||
methods: { |
|||
|
|||
request() { |
|||
let _this = this |
|||
_this.$api.cardDetail(this.page.sid).then((resp) => { |
|||
_this.data = resp |
|||
_this.$nextTick(() => { |
|||
_this.$refs.pageView.setLoadState(2) |
|||
}) |
|||
}).catch(e => { |
|||
_this.$nextTick(() => { |
|||
_this.$refs.pageView.setLoadState(1) |
|||
}) |
|||
}) |
|||
}, |
|||
itemClick(goodsSid) { |
|||
uni.navigateTo({ |
|||
url: '/pages/good/goodsDetail?sid=' + goodsSid |
|||
}) |
|||
}, |
|||
onShareAppMessage: function(res) { |
|||
console.log("res", res) |
|||
console.log("data", res.target.dataset) |
|||
var data = res.target.dataset.info |
|||
this.shareCard(data.sid) |
|||
return { |
|||
title: '汇融农链-云菜窖', |
|||
path: '/pages/bind/bind_giftCard?code=' + data.code + '&codeKey=' + data.codeKey, |
|||
imageUrl: 'https://supervise.yxtsoft.com/lpk/image/shareGift.png', //自定义图片路径，显示图片长宽比是 5:4。 |
|||
success: function(res) { |
|||
console.log('aaaa', "分享成功") |
|||
}, |
|||
fail: function(res) { |
|||
// 转发失败 |
|||
console.log('aaaa', "用户点击了取消") |
|||
} |
|||
} |
|||
}, |
|||
|
|||
shareCard(sid) { |
|||
let _this = this |
|||
|
|||
_this.$api.shareEmpCard(sid).then((resp) => { |
|||
|
|||
var item = _this.data.empCardGiftVos.find(item => item.sid === sid) |
|||
|
|||
console.log("item", item); |
|||
|
|||
item.share = '2' |
|||
|
|||
}).catch(e => {}) |
|||
} |
|||
|
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
.canvas-code { |
|||
width: 39vw !important; |
|||
height: 39vw !important; |
|||
} |
|||
|
|||
.sharebtn { |
|||
background: #FF4727; |
|||
font-size: 12px; |
|||
color: #fff; |
|||
width: 20vw; |
|||
border-radius: 20px; |
|||
} |
|||
|
|||
|
|||
.sharebtn::after { |
|||
border: none; |
|||
} |
|||
|
|||
.sharebtn2 { |
|||
background: #FF7165; |
|||
width: 20vw; |
|||
font-size: 12px; |
|||
color: #fff; |
|||
border-radius: 20px; |
|||
} |
|||
|
|||
.sharebtn2::after { |
|||
border: none; |
|||
} |
|||
|
|||
.sharebtn3 { |
|||
background: #CFCFCF; |
|||
width: 20vw; |
|||
font-size: 12px; |
|||
color: #fff; |
|||
border-radius: 20px; |
|||
} |
|||
|
|||
.sharebtn3::after { |
|||
border: none; |
|||
} |
|||
|
|||
.top { |
|||
width: 100vw; |
|||
/* height: 126.66vw; */ |
|||
height: 65vw; |
|||
/* 加载背景图 */ |
|||
background-image: url(https://supervise.yxtsoft.com/lpk/image/detail_bj4.png); |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
background-size: 100% 100%; |
|||
} |
|||
|
|||
.text { |
|||
white-space: normal; |
|||
text-overflow: -o-ellipsis-lastline; |
|||
overflow: hidden; |
|||
text-overflow: ellipsis; |
|||
display: -webkit-box; |
|||
-webkit-line-clamp: 2; |
|||
line-clamp: 2; |
|||
-webkit-box-orient: vertical; |
|||
} |
|||
|
|||
uni-page-body, |
|||
page { |
|||
background: #F1F2F3; |
|||
} |
|||
|
|||
.btn { |
|||
border: 1px solid; |
|||
padding-left: 30rpx; |
|||
padding-right: 30rpx; |
|||
padding-top: 12rpx; |
|||
padding-bottom: 12rpx; |
|||
border-radius: 50rpx; |
|||
height: 15px; |
|||
margin-left: 25rpx; |
|||
font-size: 26rpx; |
|||
} |
|||
|
|||
/* 弹窗样式 */ |
|||
.model { |
|||
position: absolute; |
|||
width: 100%; |
|||
height: 100%; |
|||
background: #000; |
|||
z-index: 999; |
|||
opacity: 0.5; |
|||
top: 0; |
|||
left: 0; |
|||
} |
|||
|
|||
.modalDlg { |
|||
/* 设置超出滚动 */ |
|||
overflow: auto; |
|||
width: 90%; |
|||
position: fixed; |
|||
top: 50vw; |
|||
left: 0; |
|||
right: 0; |
|||
bottom: 0; |
|||
z-index: 9999; |
|||
margin: 0 auto; |
|||
padding: 35rpx; |
|||
background-color: #fff; |
|||
border-radius: 20rpx; |
|||
display: flex; |
|||
flex-direction: column; |
|||
|
|||
} |
|||
|
|||
.windowRow { |
|||
display: flex; |
|||
flex-direction: row; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
padding-bottom: 15rpx; |
|||
width: 100%; |
|||
} |
|||
|
|||
.userTitle { |
|||
font-size: 42rpx; |
|||
} |
|||
|
|||
.back { |
|||
text-align: center; |
|||
color: #f0a500; |
|||
font-size: 30rpx; |
|||
} |
|||
|
|||
.wishName { |
|||
width: 100%; |
|||
justify-content: center; |
|||
flex-direction: row; |
|||
display: flex; |
|||
margin: 40rpx 0rpx; |
|||
} |
|||
|
|||
.wish_put { |
|||
width: 100%; |
|||
border: #ededef 1rpx solid; |
|||
background-color: #f6f7fb; |
|||
border-radius: 12rpx; |
|||
padding: 30rpx 20rpx; |
|||
margin: 20rpx 0rpx; |
|||
} |
|||
|
|||
.holder_cls { |
|||
color: #909399; |
|||
} |
|||
|
|||
.wishbnt { |
|||
background-color: #fec600; |
|||
text-align: center; |
|||
border-radius: 50rpx; |
|||
padding: 25rpx; |
|||
color: white; |
|||
} |
|||
|
|||
/*弹窗样式结束*/ |
|||
|
|||
/* 下面的姓名样式，不要也没什么影响 */ |
|||
.jiantou { |
|||
width: 35rpx; |
|||
height: 35rpx; |
|||
margin-left: 10rpx; |
|||
} |
|||
|
|||
.fenge { |
|||
margin-bottom: 30rpx; |
|||
} |
|||
|
|||
.xian { |
|||
border-bottom: #e5e5e5 1rpx solid; |
|||
} |
|||
|
|||
.yellow { |
|||
color: #f0a500; |
|||
font-weight: 700; |
|||
} |
|||
|
|||
.box { |
|||
background-color: white; |
|||
padding: 0rpx 25rpx; |
|||
display: flex; |
|||
flex-direction: column; |
|||
} |
|||
|
|||
.row { |
|||
height: 120rpx; |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
} |
|||
|
|||
.you { |
|||
height: 100%; |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
} |
|||
|
|||
.zhushi { |
|||
font-size: 28rpx; |
|||
color: #808080; |
|||
} |
|||
|
|||
/* 下面的姓名样式结束 */ |
|||
</style> |
|||
@ -0,0 +1,284 @@ |
|||
1<template> |
|||
|
|||
<view style="display: flex;flex-direction: column; height: 100vh;box-sizing: border-box ; background-color: #fff;" id="page"> |
|||
|
|||
<view class="top"> |
|||
<NavBar ref="nav" navTitle="详情" :showIcon="true" :start-change-height="page.startHeight" |
|||
:end-change-height="page.endHeight"> |
|||
</NavBar> |
|||
|
|||
|
|||
</view> |
|||
|
|||
<view |
|||
style="margin-top: -15vh; background-color: #fff;height: 20vh;border-top-left-radius: 25px;border-top-right-radius: 25px;"> |
|||
<loading-state ref="pageView" @request="request"> |
|||
|
|||
|
|||
<view style="display: flex;flex-direction: row; |
|||
margin:20px 20px 0px 20px;padding-bottom: 10px; border-bottom: 2px #EFEFEF solid; justify-content: space-between;"> |
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<view style="background: #FF9900; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<view style="background: #FFCC7F; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<text |
|||
style="margin-left: 8px;font-size: 16px;color: #FF9900;font-weight: 600;font-family: sans-serif;">{{page.name}}</text> |
|||
</view> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-right: 10px;"> |
|||
<view style="color: #888;font-size: 12px;">定制</view> |
|||
<input type="number" @input="numbers" v-model="page.number" maxlength="3" |
|||
style="font-size: 12px; border: 1px #AEAEAE solid;border-radius: 5px;text-align: center; width: 25px;margin-left: 5px;margin-right: 5px;padding-left: 3px;padding-right: 3px;" /> |
|||
<view style="color: #888;font-size: 12px;">个菜窖</view> |
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
|
|||
<view v-for="(item,index) in data.goods" :key="index" @click="itemClick(item.goodsSid)" |
|||
style="display: flex;flex-direction: column;margin-top: 14px; "> |
|||
|
|||
<view :style="{'border-bottom':(index===data.goods.length-1 ? 'none':'1px #EFEFEF solid')}" style="display: flex;flex-direction: column; |
|||
margin-left: 20px;margin-right: 20px;padding-bottom: 10px;"> |
|||
|
|||
<view |
|||
style=" display: flex;flex-direction: row;align-items: center; margin-right: 10px;margin-top: 5px; margin-left: 10px;"> |
|||
|
|||
<image :src='item.iconUrl' style="width: 70px;height: 70px;" mode="aspectFit"></image> |
|||
|
|||
<view style="display: flex;flex-direction: column;margin-left: 20px;width: 100%;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<text |
|||
style="flex: 1;margin-right: 10px;color: #000;font-size: 16px;">{{item.name}}</text> |
|||
<text style="color: #888;font-size: 14px;">{{item.goodsNumber}}份</text> |
|||
</view> |
|||
|
|||
|
|||
<text style="color: #AEAEAE;font-size: 12px;margin-top: 5px;line-height: 20px;">{{item.remark}}</text> |
|||
|
|||
<view |
|||
style="display: flex;flex-direction: row;justify-content:space-between;margin-top: 5px;align-items: center;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;height: 20px;align-items: center;"> |
|||
<text style="border: 1px #EE752F solid; border-radius: 10px; color:#EE752F ; font-size: 10px; |
|||
margin-right: 20px;padding: 0px 5px;">{{convertPrice(item.jprice)}}元/{{item.specificationUnit}}</text> |
|||
<text |
|||
style="border: 1px #EE752F solid; border-radius: 10px; color: #EE752F;font-size: 10px;;padding: 0px 5px;">{{item.weight}}斤/{{item.unitName}}</text> |
|||
</view> |
|||
|
|||
|
|||
<text style="color: #FF5006;font-size: 15px;">￥{{convertPrice(item.totalValue)}}</text> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
<view style="height: 100px;background: #fff; "></view> |
|||
|
|||
<view style="background-color: #fff; padding: 10px 20px;position: fixed;bottom: 0;overflow:hidden; |
|||
display: flex;flex-direction: row; width: 100%;flex-shrink: 1; border-top: 1px #F0F0F0 solid;"> |
|||
|
|||
<view style="flex: 1; display: flex;flex-direction: row;align-items: center; margin-right: 30px; |
|||
justify-content: space-between;"> |
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<text style="color: #888;font-size: 14px;">合计：</text> |
|||
<text style="color: #F0752F;font-size: 18px;">{{convertPrice(page.price)}}元</text> |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
<text |
|||
style="background: #EE752F; text-align: center; color: #fff; border-radius: 5px;padding: 5px 20px; margin-right: 40px; " |
|||
@click="settlement()">结算</text> |
|||
|
|||
|
|||
</view> |
|||
|
|||
</loading-state> |
|||
</view> |
|||
|
|||
|
|||
|
|||
|
|||
|
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
//引入bus |
|||
import bus from '@/common/bus'; |
|||
export default { |
|||
data() { |
|||
return { |
|||
page: { |
|||
sid: '', |
|||
name: "", |
|||
startHeight: 0, |
|||
endHeight: 0, |
|||
number: "1", |
|||
price: "" |
|||
}, |
|||
data: { |
|||
goods: [] |
|||
} |
|||
|
|||
} |
|||
}, |
|||
onLoad(options) { |
|||
this.page.sid = options.sid |
|||
this.page.name = options.name |
|||
|
|||
let info = uni.getSystemInfoSync(); |
|||
|
|||
this.page.startHeight = info.windowWidth * 0.6 |
|||
this.page.endHeight = info.windowWidth * 0.8 |
|||
|
|||
this.request() |
|||
uni.$on("pay", (e) => { |
|||
|
|||
uni.switchTab({ |
|||
url: '/pages/home/pickUpCard' |
|||
}) |
|||
}) |
|||
|
|||
}, |
|||
onUnload() { |
|||
uni.$off('pay'); |
|||
}, |
|||
onPageScroll(res) { |
|||
// 渐变 |
|||
this.$refs.nav.defaultColorBgAlpha(res) |
|||
}, |
|||
methods: { |
|||
itemClick(goodsSid) { |
|||
uni.navigateTo({ |
|||
url: '/pages/good/goodsDetail?sid=' + goodsSid |
|||
}) |
|||
}, |
|||
request() { |
|||
let _this = this |
|||
|
|||
_this.$api.getGiftBagBySid(this.page.sid).then((resp) => { |
|||
|
|||
_this.data = resp |
|||
this.getPrice() |
|||
|
|||
_this.$nextTick(() => { |
|||
_this.$refs.pageView.setLoadState(2) |
|||
}) |
|||
}).catch(e => { |
|||
_this.$nextTick(() => { |
|||
_this.$refs.pageView.setLoadState(1) |
|||
}) |
|||
}) |
|||
}, |
|||
numbers(event) { |
|||
this.page.number = event.target.value |
|||
this.getPrice() |
|||
}, |
|||
getPrice() { |
|||
|
|||
if (this.data.price && this.page.number) |
|||
|
|||
this.page.price = Number(this.data.price * this.page.number).toFixed(2) |
|||
else |
|||
this.page.price = "0.00" |
|||
}, |
|||
settlement() { |
|||
// 支付 |
|||
|
|||
|
|||
if (!Number(this.page.number) > 0) { |
|||
this.shortToast('请输入要定制几份云菜窖') |
|||
return |
|||
} |
|||
|
|||
|
|||
let list = [] |
|||
|
|||
for (var i = 0; i < this.data.goods.length; i++) { |
|||
var item = this.data.goods[i] |
|||
if (item.goodsNumber > 0) |
|||
list.push({ |
|||
goodsSid: item.goodsSid, |
|||
goodsName: item.name, |
|||
partNumber: item.goodsNumber, |
|||
numofPart: item.weight, |
|||
priceUnit: item.jprice, |
|||
pricePart: item.price, |
|||
}) |
|||
} |
|||
// console.log("ddd", list); |
|||
|
|||
if(list.length==0){ |
|||
this.shortToast('请添加商品') |
|||
return |
|||
} |
|||
|
|||
|
|||
var params = { |
|||
customerSid: getApp().globalData.sid, |
|||
cardNumber: this.page.number, |
|||
totalTee: this.page.price, |
|||
ordOrderDetailsVoList: list |
|||
} |
|||
// console.log("params", params); |
|||
|
|||
let _this = this |
|||
_this.$api.createOrder(params).then((resp) => { |
|||
|
|||
// console.log("resp", resp); |
|||
this.$pay(resp) |
|||
}).catch(e => { |
|||
}) |
|||
|
|||
|
|||
|
|||
// var data = { |
|||
// "price": "0.01", |
|||
// "trade_no_url": { |
|||
// "url": "http://192.168.2.110:7777/order/orderQuery", |
|||
// "params": { |
|||
// "mainSid": "954fbec1-b12e-4f29-87c1-4d9ff6332e7c" |
|||
// } |
|||
// }, |
|||
// "pay_url": { |
|||
// "url": "http://192.168.2.110:7777/order/pay ", |
|||
// "params": { |
|||
// "mainSid": "954fbec1-b12e-4f29-87c1-4d9ff6332e7c" |
|||
// } |
|||
// }, |
|||
// "order_url": { |
|||
// "page": "/pages/index2/index2", |
|||
// "params": {} |
|||
// }, |
|||
// "orderId": "288320940398", |
|||
// "remainder": 96, |
|||
// "goods": "无骨鸡柳等3件商品", |
|||
// "bus": [ |
|||
// "pay" |
|||
// ] |
|||
// } |
|||
|
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
.top { |
|||
width: 100vw; |
|||
/* height: 126.66vw; */ |
|||
height: 95vw; |
|||
/* 加载背景图 */ |
|||
background-image: url(https://supervise.yxtsoft.com/lpk/image/home_bj1.png); |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
background-size: 100% 100%; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,305 @@ |
|||
<template> |
|||
|
|||
<view style="display: flex;flex-direction: column; height: 100vh;box-sizing: border-box; background-color: #fff;" |
|||
id="page"> |
|||
|
|||
<view class="top"> |
|||
<NavBar ref="nav" navTitle="详情" :showIcon="true" :start-change-height="page.startHeight" |
|||
:end-change-height="page.endHeight"> |
|||
</NavBar> |
|||
|
|||
|
|||
</view> |
|||
|
|||
<view |
|||
style="margin-top: -15vh; background-color: #fff;height: 20vh;border-top-left-radius: 25px;border-top-right-radius: 25px;"> |
|||
<loading-state ref="pageView" @request="request"> |
|||
|
|||
|
|||
<view style="display: flex;flex-direction: column; |
|||
margin:20px 10px 0px 20px;padding-bottom:10px; border-bottom: 2px #EFEFEF solid;"> |
|||
|
|||
<view |
|||
style="display: flex;flex-direction: row;align-items: center; justify-content: space-between;"> |
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<view style="background: #FF9900; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<view style="background: #FFCC7F; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<text |
|||
style="margin-left: 8px;font-size: 16px;color: #FF9900;font-weight: 600;font-family: sans-serif;">自选组合</text> |
|||
</view> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-right: 10px;"> |
|||
<view style="color: #888;font-size: 12px;">定制</view> |
|||
<input type="number" @input="numbers" v-model="page.number" maxlength="3" |
|||
style="font-size: 12px; border: 1px #AEAEAE solid;border-radius: 5px;text-align: center; width: 25px;margin-left: 5px;margin-right: 5px;padding-left: 3px;padding-right: 3px;" /> |
|||
<view style="color: #888;font-size: 12px;">个菜窖</view> |
|||
</view> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view v-for="(item,index) in data" :key="index" @click="itemClick(item.goodsSid)" |
|||
style="display: flex;flex-direction: column;margin-top: 14px;"> |
|||
|
|||
<view :style="{'border-bottom':(index===data.length-1 ? 'none':'1px #EFEFEF solid')}" style="display: flex;flex-direction: column; |
|||
margin-left: 20px;margin-right: 20px;padding-bottom: 10px;"> |
|||
|
|||
<view |
|||
style=" display: flex;flex-direction: row;align-items: center; margin-right: 10px;margin-top: 5px; margin-left: 10px;"> |
|||
|
|||
<image :src='item.iconUrl' style="width: 70px;height: 70px;" mode="aspectFit"></image> |
|||
|
|||
<view style="display: flex;flex-direction: column;margin-left: 20px;width: 100%;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<text |
|||
style="flex: 1;margin-right: 10px;color: #000;font-size: 14px;">{{item.name}}</text> |
|||
<uni-number-box ref="box" :showTextView="true" background="#fff" |
|||
v-model="item.goodsNumber" @change="numberChange($event,item)"></uni-number-box> |
|||
|
|||
</view> |
|||
|
|||
|
|||
<text |
|||
style="color: #AEAEAE;font-size: 14px;margin-top: 5px;line-height: 20px;">{{item.remark}}</text> |
|||
|
|||
<view |
|||
style="display: flex;flex-direction: row;justify-content:space-between;margin-top: 5px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;height: 20px;align-items: center;"> |
|||
<text style="border: 1px #EE752F solid; border-radius: 10px; color:#EE752F ; font-size: 10px; |
|||
margin-right: 20px;padding: 0px 5px;">{{convertPrice(item.jprice)}}元/{{item.specificationUnit}}</text> |
|||
<text |
|||
style="border: 1px #EE752F solid; border-radius: 10px; color: #EE752F;font-size: 10px;;padding: 0px 5px;">{{item.weight}}斤/{{item.unitName}}</text> |
|||
</view> |
|||
|
|||
|
|||
<text style="color: #FF5006;font-size: 15px;">￥{{convertPrice(item.price)}}</text> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
|
|||
|
|||
|
|||
</view> |
|||
<view style="height: 200px;background: #fff; "></view> |
|||
|
|||
<view style="background-color: #fff;position: fixed;bottom: 0;overflow:hidden; |
|||
display: flex;flex-direction: column; width: 100%;flex-shrink: 1;"> |
|||
|
|||
<view |
|||
style="display: flex;flex-direction: row;align-items: center; border-bottom: 1px #F0F0F0 solid;padding-top: 5px; padding-bottom: 5px;padding-left: 20px;"> |
|||
<view style="color: #888;font-size: 10px;">温馨提示：已定制了</view> |
|||
<view style="color: #FF5006;font-size: 15px;">{{page.weight}}斤</view> |
|||
<view style="color: #888;font-size: 10px;">，满200斤可定制云菜窖</view> |
|||
</view> |
|||
|
|||
<view |
|||
style="display: flex;flex-direction: row;align-items: center; margin-top: 5px; padding: 10px 20px; width: 100%;"> |
|||
<view style="flex: 1; display: flex;flex-direction: row;align-items: center; ; |
|||
justify-content: space-between;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<text style="color: #888;font-size: 14px;">合计：</text> |
|||
<text style="color: #F0752F;font-size: 18px;">{{convertPrice(page.price)}}元</text> |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
<text |
|||
style="background: #EE752F; text-align: center; color: #fff; border-radius: 5px;padding: 5px 20px; margin-right: 40px; " |
|||
@click="settlement()">结算</text> |
|||
|
|||
|
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
|
|||
</loading-state> |
|||
</view> |
|||
|
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
//引入bus |
|||
import bus from '@/common/bus'; |
|||
export default { |
|||
data() { |
|||
return { |
|||
page: { |
|||
sid: '', |
|||
name: "", |
|||
price: "", |
|||
startHeight: 0, |
|||
endHeight: 0, |
|||
number: "1", |
|||
weight: "--", |
|||
}, |
|||
data: [] |
|||
|
|||
} |
|||
}, |
|||
onPageScroll(res) { |
|||
// 渐变 |
|||
this.$refs.nav.defaultColorBgAlpha(res) |
|||
}, |
|||
onLoad(options) { |
|||
|
|||
let info = uni.getSystemInfoSync(); |
|||
|
|||
this.page.startHeight = info.windowWidth * 0.6 |
|||
this.page.endHeight = info.windowWidth * 0.8 |
|||
|
|||
this.request() |
|||
uni.$on("pay", (e) => { |
|||
|
|||
uni.switchTab({ |
|||
url: '/pages/home/pickUpCard' |
|||
}) |
|||
}) |
|||
|
|||
}, |
|||
onUnload() { |
|||
uni.$off('pay'); |
|||
}, |
|||
methods: { |
|||
itemClick(goodsSid) { |
|||
uni.navigateTo({ |
|||
url: '/pages/good/goodsDetail?sid=' + goodsSid |
|||
}) |
|||
}, |
|||
numberChange(event, item) { |
|||
console.log("event", event) |
|||
console.log("item", item) |
|||
this.getallPrice() |
|||
this.getweight() |
|||
this.getPrice(item) |
|||
}, |
|||
request() { |
|||
let _this = this |
|||
|
|||
_this.$api.getAllGiftBag().then((resp) => { |
|||
|
|||
_this.data = resp |
|||
this.getallPrice() |
|||
this.getweight() |
|||
|
|||
_this.$nextTick(() => { |
|||
_this.$refs.pageView.setLoadState(2) |
|||
}) |
|||
}).catch(e => { |
|||
_this.$nextTick(() => { |
|||
_this.$refs.pageView.setLoadState(1) |
|||
}) |
|||
}) |
|||
}, |
|||
numbers(event) { |
|||
this.page.number = event.target.value |
|||
this.getallPrice() |
|||
this.getweight() |
|||
}, |
|||
getallPrice() { |
|||
|
|||
let num = 0; |
|||
for (var i = 0; i < this.data.length; i++) { |
|||
num += Number(this.data[i].jprice) * Number(this.data[i].goodsNumber) * Number(this.data[i].weight); |
|||
} |
|||
|
|||
console.log("num", num) |
|||
|
|||
this.page.price = Number(num * this.page.number).toFixed(2) |
|||
}, |
|||
getPrice(item) { |
|||
|
|||
if (item.goodsNumber > 0) |
|||
|
|||
item.price = Number(item.goodsNumber * item.jprice * item.weight).toFixed(2) |
|||
|
|||
else |
|||
item.price = "0" |
|||
}, |
|||
getweight() { |
|||
|
|||
let num = 0; |
|||
for (var i = 0; i < this.data.length; i++) { |
|||
num += Number(this.data[i].weight) * Number(this.data[i].goodsNumber); |
|||
|
|||
} |
|||
this.page.weight = num |
|||
}, |
|||
settlement() { |
|||
// 支付 |
|||
|
|||
if (this.page.weight < 200) { |
|||
this.shortToast('满200斤才可定制云菜窖哦，请继续选菜吧。') |
|||
return |
|||
} |
|||
|
|||
if (!Number(this.page.number) > 0) { |
|||
this.shortToast('请输入要定制几份云菜窖') |
|||
return |
|||
} |
|||
|
|||
|
|||
|
|||
let list = [] |
|||
|
|||
for (var i = 0; i < this.data.length; i++) { |
|||
var item = this.data[i] |
|||
if (item.goodsNumber > 0) |
|||
list.push({ |
|||
goodsSid: item.goodsSid, |
|||
goodsName: item.name, |
|||
partNumber: item.goodsNumber, |
|||
numofPart: item.weight, |
|||
priceUnit: item.jprice, |
|||
pricePart: item.price, |
|||
}) |
|||
} |
|||
// console.log("ddd", list); |
|||
|
|||
if (list.length == 0) { |
|||
this.shortToast('请添加商品') |
|||
return |
|||
} |
|||
|
|||
var params = { |
|||
customerSid: getApp().globalData.sid, |
|||
cardNumber: this.page.number, |
|||
totalTee: this.page.price, |
|||
ordOrderDetailsVoList: list |
|||
} |
|||
// console.log("params", params); |
|||
|
|||
let _this = this |
|||
_this.$api.createOrder(params).then((resp) => { |
|||
|
|||
// console.log("resp", resp); |
|||
this.$pay(resp) |
|||
}).catch(e => {}) |
|||
|
|||
} |
|||
|
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
.top { |
|||
width: 100vw; |
|||
/* height: 126.66vw; */ |
|||
height: 95vw; |
|||
/* 加载背景图 */ |
|||
background-image: url(https://supervise.yxtsoft.com/lpk/image/home_bj1.png); |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
background-size: 100% 100%; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,755 @@ |
|||
<template> |
|||
|
|||
<view style="display: flex;flex-direction: column;" id="page"> |
|||
|
|||
<view class="top"> |
|||
<NavBar ref="nav" navTitle="详情" :showIcon="true" :start-change-height="page.startHeight" |
|||
:end-change-height="page.endHeight"> |
|||
</NavBar> |
|||
<view style="display: flex;flex-direction: column;margin-top: 25vw; margin-left: 5vw;"> |
|||
<view style="font-size: 17px;color: #fff;height: 8vw;line-height: 8vw;margin-top: 5vw;"> |
|||
{{data.state}} |
|||
</view> |
|||
<view |
|||
style="font-size: 12px;color: white;line-height: 7vw;height: 7vw;color: #fff;box-sizing: border-box;"> |
|||
窖号：{{data.serialNumber}} |
|||
</view> |
|||
<view style="font-size: 12px;color: white;line-height: 7vw;height: 7vw;color: #fff;"> |
|||
{{data.time}} |
|||
</view> |
|||
</view> |
|||
|
|||
</view> |
|||
<view |
|||
style="display: flex;flex-direction: row;justify-content: center; |
|||
background-color: #fff;height: 25vw; border-top-left-radius: 25px;border-top-right-radius: 25px;margin-top: -9.06vw;"> |
|||
|
|||
|
|||
<image src="https://supervise.yxtsoft.com/lpk/image/detail_affeection.png" mode="aspectFit" |
|||
style="margin-left: 20px;margin-right: 20px; width: 80vw;height: 25vw;"></image> |
|||
|
|||
<view style="width: 50%; margin-left: 20vw; |
|||
display: flex;flex-direction: row;margin-top: 9vw;position: absolute;z-index: 10;align-items: center; |
|||
justify-content: space-between;"> |
|||
<text style="color: #fff;font-size: 18px;font-weight: 600;">{{data.pname}}</text> |
|||
|
|||
<text v-if="data.notRese" |
|||
style="background: #fff ; border-radius: 25px;color: #FF7201;padding: 3px 10px;" |
|||
@click="showDialog2">转赠亲友</text> |
|||
|
|||
<text v-if="!data.notRese" |
|||
style="background: #F1F2F3 ; border-radius: 25px;color: #ccc;padding: 3px 10px;">转赠亲友</text> |
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
<loading-state ref="pageView" @request="request"> |
|||
|
|||
<view style="background-color: #fff;padding: 10px 15px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<view style="background: #FF9D33; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<view style="background: #FFDAB2; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<text style="margin-left: 8px;font-size: 14px;color: #333;">商品明细</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view v-for="(item,index) in data.goodsVos" :key="index" @click="itemClick(item.goodsSid)" |
|||
style="display: flex;flex-direction: row;background-color: #fff;padding-left: 10px;padding-right: 10px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;background-color: #fff;padding: 10px 15px; |
|||
border-bottom: 1px #F1F2F3 solid; width: 100%;"> |
|||
<image :src="item.pic" style="width: 60px;height: 60px;flex-shrink: 0;"></image> |
|||
<view style="margin-left: 10px;margin-right: 10px;flex: 1;"> |
|||
<text class="text" style="font-weight: 500;">{{item.goods}} |
|||
</text> |
|||
<view style="font-size: 12px;color: #666666;margin-top: 5px;">{{item.remarks}}</view> |
|||
<view style="display: flex;flex-direction: row;justify-content: space-between;margin-top: 5px;"> |
|||
<text |
|||
style="font-size: 12px;color: #666666;margin-right: 10px;">总数：{{item.num}}{{item.unitName}} |
|||
</text> |
|||
<view style="font-size: 12px;color: #666666;">可预约：{{item.lnum}}{{item.unitName}}</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
|
|||
<view style="background-color: #fff;margin-top: 10px;padding: 10px 15px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<view style="background: #FF9D33; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<view style="background: #FFDAB2; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<text style="margin-left: 8px;font-size: 14px;color: #333;">预约记录</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view style="margin-bottom: 10px;"> |
|||
<view v-for="(item,index) in data.orderCardVoList" :key="index" |
|||
style="display: flex;flex-direction: row;background-color: #fff;padding-left: 10px;padding-right: 10px;"> |
|||
|
|||
<view style="display: flex;flex-direction: column;background-color: #fff; |
|||
border-bottom: 1px #F1F2F3 solid; width: 100%;padding-left: 20px;padding-bottom: 10px;"> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 10px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/date.png" |
|||
style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text |
|||
style="margin-left: 5px;font-size: 12px; color: #999;">提货时间：{{item.reserveDate}}</text> |
|||
</view> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/location.png" |
|||
style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text style="margin-left: 5px;font-size: 12px; color: #999;">提货地点：{{item.store}}</text> |
|||
</view> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/user2.png" mode="aspectFill" |
|||
style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text |
|||
style="margin-left: 5px;font-size: 12px; color: #999;">提 货 人：{{item.userName}}</text> |
|||
</view> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/phone2.png" mode="aspectFill" |
|||
style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text style="margin-left: 5px;font-size: 12px; color: #999;">联系电话：{{item.userPhone}}</text> |
|||
</view> |
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 8px;"> |
|||
<text style="color: #999; font-size: 12px;">- {{item.goods}}</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view style="background-color: #fff;margin-top: 10px;padding: 10px 15px;" id='the-id'> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<view style="background: #FF9D33; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<view style="background: #FFDAB2; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<text style="margin-left: 8px;font-size: 14px;color: #333;">转赠信息</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view style="margin-bottom: 50px;"> |
|||
|
|||
<view v-for="(item,index) in data.empCardGifts" :key="index" |
|||
style="display: flex;flex-direction: row;background-color: #fff;padding-left: 10px;padding-right: 10px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;background-color: #fff; |
|||
border-bottom: 1px #F1F2F3 solid; width: 100%;padding-left: 10px; padding-right: 10px; padding-bottom: 10px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;width: 100%;margin-top: 15px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/home_affection.png" |
|||
style="width: 50px;height: 50px;margin-right: 10px;flex-shrink: 0;"></image> |
|||
|
|||
<view style="display: flex;flex-direction: column;width: 100%;"> |
|||
|
|||
<text |
|||
style="font-size: 12px; color: #333;margin-top: 5px;">亲情窖序号：{{item.serialNumber}}</text> |
|||
<text |
|||
style="font-size: 12px; color: #333;margin-top: 5px;">分享时间：{{item.createTime}}</text> |
|||
<text style="font-size: 12px; color: #333;margin-top: 5px;">亲情窖编码：{{item.code}}</text> |
|||
<text style="font-size: 12px; color: #333;margin-top: 5px;">提货密码：{{item.codeKey}}</text> |
|||
<text style="font-size: 12px; color: #333;margin-top: 5px;">备注说明：{{item.remarks}}</text> |
|||
|
|||
<view |
|||
style="display: flex;flex-direction: row;margin-top: 5px;align-items: center;justify-content: space-between;width: 100%;"> |
|||
<text style="flex: 1;font-size: 12px; color: #A5A5A5; margin-right: 10px;">- |
|||
{{item.goods}}</text> |
|||
|
|||
<button v-show="item.isShare=='1'" class='sharebtn' :data-info="item" |
|||
open-type="share">分享窖</button> |
|||
<button v-show="item.isShare=='2'" class='sharebtn2' :data-info="item" |
|||
open-type="share">已分享</button> |
|||
<button v-show="item.isShare=='3'" class='sharebtn3'>转赠成功</button> |
|||
|
|||
|
|||
</view> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view style="height: 50px; "></view> |
|||
|
|||
<view v-if="data.notRese" style="width: 100%; background-color: #fff;height: 15vw;position: fixed;bottom: 0;overflow:hidden; |
|||
display: flex;flex-direction: row;"> |
|||
|
|||
<!-- <text |
|||
style="flex: 1;color: #B3B3B3; padding: 10px 20px; display:margin：auto;text-align: center;line-height: 10vw;"> |
|||
可选择就近网点进行预约提货 > |
|||
</text> --> |
|||
<view style="flex: 1;"></view> |
|||
<text style=" width: 20vw;font-size: 16px;color: #fff; background-color: #FFC104; |
|||
padding: 10px 20px; display:margin：auto;text-align: center;line-height: 10vw;" @click="showDialog">预约提货</text> |
|||
|
|||
|
|||
</view> |
|||
|
|||
|
|||
</loading-state> |
|||
|
|||
|
|||
<!-- 弹窗蒙版 --> |
|||
<view class="model" catchtouchmove='preventTouchMove' v-if='showModal' @click.stop="colseDialog()"></view> |
|||
<view class="modalDlg" catchtouchmove='preventTouchMove' v-if='showModal'> |
|||
|
|||
<scroll-view scroll-y="true" style="height: 100%;width: 100%; padding: 20px; " bindscrolltoupper="upper" |
|||
bindscrolltolower="lower" bindscroll="scroll"> |
|||
|
|||
<view style="display: flex;flex-direction: column;margin-top: 10px;"> |
|||
<text>提货地点</text> |
|||
<view |
|||
style="margin-top: 10px;background:#F5F5F5 ; display: flex;flex-direction: row;justify-content: space-between;width: 89.5%;border-radius: 4px;min-height: 35px;align-items: center;" |
|||
@click="address"> |
|||
<view v-if="stringIsEmpty(data.addressName)" |
|||
style="color: #666;font-size: 12px;margin-left: 10px;"> |
|||
请选择提货点</view> |
|||
<view v-if="stringIsNotEmpty(data.addressName)" |
|||
style="color: #666;font-size: 12px;margin-left: 10px;">{{data.addressName}}</view> |
|||
<uni-icons type="bottom" size="14" color="#999" style="flex-direction: 0;margin: 0px 5px;" /> |
|||
</view> |
|||
</view> |
|||
|
|||
<view style="display: flex;flex-direction: column;margin-top: 10px;width: 89.5%;"> |
|||
<text>提货时间</text> |
|||
<view style="display: flex;align-items: center;margin-top: 6px;"> |
|||
<uni-datetime-picker type="date" v-model="data.reserveDate" style="flex: 1;background: #F8F8F8;" |
|||
:start="data.start" :end="data.end" @showing='showing' :disabledDate="disabledDate" /> |
|||
</view> |
|||
</view> |
|||
|
|||
<view style="display: flex;flex-direction: column;margin-top: 10px;width: 89.5%;"> |
|||
<text>提货人</text> |
|||
<view style="display: flex;align-items: center;margin-top: 6px;"> |
|||
<input placeholder="请输入提货人" |
|||
style="font-size: 30rpx;flex: 1;background: #F8F8F8;border-radius: 5px;height: 40px;line-height: 40px;padding-left: 10px;" |
|||
:value="data.userName" @input="onKeyInput1" /> |
|||
</view> |
|||
</view> |
|||
|
|||
<view style="display: flex;flex-direction: column;margin-top: 10px;width: 89.5%;"> |
|||
<text>联系电话</text> |
|||
<view style="display: flex;align-items: center;margin-top: 6px;"> |
|||
<input maxlength="11" placeholder="请输入联系电话" |
|||
style="font-size: 30rpx;flex: 1;background: #F8F8F8;border-radius: 5px;height: 40px;line-height: 40px;padding-left: 10px;" |
|||
type="number" :value="data.userPhone" @input="onKeyInput2" /> |
|||
</view> |
|||
</view> |
|||
|
|||
<view style="background: #F5F5F5; border-radius: 5px;margin-top: 15px;width: 89.5%;"> |
|||
<view v-for="(item,index) in data.goodsVos" |
|||
style="display: flex;flex-direction: row;margin-top: 15px; margin-bottom: 10px;"> |
|||
<view style="margin-left: 10px;margin-right: 10px;flex: 1; |
|||
display: flex;flex-direction: column;justify-content: space-between;align-items: flex-end; |
|||
padding: 10px;"> |
|||
<text class="text" style="font-weight: 500;width: 100%;font-size: 14px;">{{item.goods}} |
|||
</text> |
|||
<text class="text" |
|||
style="font-weight: 500;width: 100%;color: #919191; font-size: 12px;">剩余：{{item.lnum}}{{item.unitName}} |
|||
</text> |
|||
<uni-number-box ref="box" style="margin-top: -30px;" :showTextView="true" :min="0" |
|||
:max="item.lnum" v-model="item.select"></uni-number-box> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view |
|||
style="display: flex;flex-direction: row;align-items: center;justify-content: center; margin-top: 100px;width: 100%;"> |
|||
|
|||
<text |
|||
style="border-radius:30px; font-size: 14px;color: #666;background-color: #F5F5F5; padding: 5px 30px;margin-right: 20px;" |
|||
@click.stop="colseDialog()">取消</text> |
|||
<text |
|||
style="border-radius: 30px; font-size: 14px;color: #fff; background-color: #FFC104; padding: 5px 30px;margin-left: 20px;" |
|||
@click="save">确认</text> |
|||
|
|||
</view> |
|||
<view style="height: 50px;"> |
|||
|
|||
</view> |
|||
|
|||
</scroll-view> |
|||
</view> |
|||
|
|||
<!-- 弹窗蒙版 --> |
|||
<view class="model" catchtouchmove='preventTouchMove' v-if='showModal2' @click.stop="colseDialog2()"></view> |
|||
<view class="modalDlg" catchtouchmove='preventTouchMove' v-if='showModal2'> |
|||
<scroll-view scroll-y="true" style="height: 100%; width: 100%; box-sizing: border-box; |
|||
" bindscrolltoupper="upper" bindscrolltolower="lower" bindscroll="scroll"> |
|||
|
|||
|
|||
<view style="display: flex;flex-direction: column;margin: 20px;"> |
|||
<text>菜窖数量</text> |
|||
<view style="display: flex;align-items: center;margin-top: 6px;"> |
|||
<input placeholder="请输入菜窖数量" |
|||
style="font-size: 30rpx;flex: 1;background: #F8F8F8;border-radius: 5px;height: 40px;line-height: 40px;padding-left: 10px;padding-right: 10px;" |
|||
type="number" :value="info.count" @input="onKeyInput3" /> |
|||
</view> |
|||
</view> |
|||
<view style="display: flex;flex-direction: column;margin: 20px;"> |
|||
<text>商品列表</text> |
|||
<view style="background: #F5F5F5; border-radius: 5px;margin-top: 6px;"> |
|||
<view v-for="(item,index) in data.goodsVos" |
|||
style="display: flex;flex-direction: row;margin-top: 15px; margin-bottom: 10px;"> |
|||
<view style="margin-left: 10px;margin-right: 10px;flex: 1; |
|||
display: flex;flex-direction: column;justify-content: space-between;align-items: flex-end; |
|||
padding: 10px;"> |
|||
<text class="text" style="font-weight: 500;width: 100%;font-size: 14px;">{{item.goods}} |
|||
</text> |
|||
<text class="text" |
|||
style="font-weight: 500;width: 100%;color: #919191; font-size: 12px;">剩余：{{item.lnum}}{{item.unitName}} |
|||
</text> |
|||
<uni-number-box ref="box" style="margin-top: -30px;" :showTextView="true" :min="0" |
|||
:max="item.lnum" v-model="item.select"></uni-number-box> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view style="display: flex;flex-direction: column;margin: 20px;"> |
|||
<text>备注说明</text> |
|||
<view style="display: flex;align-items: center;margin-top: 6px;"> |
|||
<input placeholder="请输入" |
|||
style="font-size: 30rpx;flex: 1;background: #F8F8F8;border-radius: 5px;height: 40px;line-height: 40px;padding-left: 10px;padding-right: 10px;" |
|||
:value="info.remarks" @input="onKeyInput4" /> |
|||
<!-- <textarea placeholder="请输入" :disable-default-padding='true' :fixed="true" style="font-size: 30rpx;flex: 1;background: #F8F8F8;border-radius: 5px; |
|||
line-height: 20px;padding: 10px; |
|||
white-space: pre-wrap; |
|||
height: auto;min-height: 30px; |
|||
word-wrap: break-word;" :value="info.remarks" @input="onKeyInput2" /> --> |
|||
</view> |
|||
</view> |
|||
|
|||
<view |
|||
style="display: flex;flex-direction: row;align-items: center;justify-content: center;margin-top: 100px;width: 100%;"> |
|||
|
|||
<text |
|||
style="border-radius:30px; font-size: 14px;color: #666;background-color: #F5F5F5; padding: 5px 30px;margin-right: 20px;" |
|||
@click.stop="colseDialog2()">取消</text> |
|||
<text |
|||
style="border-radius: 30px; font-size: 14px;color: #fff; background-color: #FF9D33; padding: 5px 30px;margin-left: 20px;" |
|||
@click="save2()">确认</text> |
|||
|
|||
</view> |
|||
<view style="height: 50px;"> |
|||
|
|||
</view> |
|||
|
|||
</scroll-view> |
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
//引入bus |
|||
import bus from '@/common/bus'; |
|||
export default { |
|||
data() { |
|||
return { |
|||
showModal: false, |
|||
showModal2: false, |
|||
page: { |
|||
sid: '', |
|||
showTextView: false, |
|||
startHeight: 0, |
|||
endHeight: 0 |
|||
}, |
|||
data: { |
|||
time: "", |
|||
name: "", |
|||
pname: "", |
|||
state: "", |
|||
notRese: false, |
|||
showBtn: false, |
|||
showRecord: false, |
|||
goodsVos: [], |
|||
value: "", |
|||
userName: "", |
|||
userPhone: "", |
|||
}, |
|||
disabledDate: [ |
|||
// '2023-12-16' |
|||
], |
|||
info: { |
|||
count: "1", |
|||
empCardSid: "", |
|||
remarks: "", |
|||
goodsVoList: [] |
|||
} |
|||
} |
|||
}, |
|||
onLoad(options) { |
|||
this.page.sid = options.sid |
|||
this.request() |
|||
this.getSun() |
|||
this.$bus.$on('order', msg => { |
|||
this.$nextTick(() => { |
|||
this.$refs.pageView.setLoadState(0) |
|||
}) |
|||
this.request(); |
|||
}) |
|||
|
|||
uni.$on("address", (e) => { |
|||
// 相当与下拉刷新 |
|||
this.data.value = e.sid; |
|||
this.data.addressName = e.name; |
|||
}) |
|||
|
|||
let info = uni.getSystemInfoSync(); |
|||
|
|||
this.page.startHeight = info.windowWidth * 0.6 |
|||
this.page.endHeight = info.windowWidth * 0.8 |
|||
}, |
|||
onUnload() { |
|||
uni.$off('order'); |
|||
uni.$off('address'); |
|||
}, |
|||
onPageScroll(res) { |
|||
// 渐变 |
|||
this.$refs.nav.defaultColorBgAlpha(res) |
|||
}, |
|||
methods: { |
|||
showDialog() { |
|||
this.showModal = true |
|||
}, |
|||
colseDialog() { |
|||
this.showModal = false |
|||
}, |
|||
showDialog2() { |
|||
this.showModal2 = true |
|||
}, |
|||
colseDialog2() { |
|||
this.showModal2 = false |
|||
}, |
|||
address() { |
|||
uni.navigateTo({ |
|||
url: '/pages/SelectAddressActivity' |
|||
}) |
|||
}, |
|||
onKeyInput1: function(event) { |
|||
this.data.userName = event.target.value |
|||
}, |
|||
onKeyInput2: function(event) { |
|||
this.data.userPhone = event.target.value |
|||
}, |
|||
onKeyInput3: function(event) { |
|||
this.info.count = event.target.value |
|||
|
|||
}, |
|||
onKeyInput4: function(event) { |
|||
this.info.remarks = event.target.value |
|||
}, |
|||
showing(e) { |
|||
this.page.showTextView = e |
|||
}, |
|||
save() { |
|||
if (this.stringIsEmpty(this.data.value)) { |
|||
this.shortToast('请选择提货地点') |
|||
return |
|||
} |
|||
if (this.stringIsEmpty(this.data.reserveDate)) { |
|||
this.shortToast('请选择提货时间') |
|||
return |
|||
} |
|||
if (this.stringIsEmpty(this.data.userName)) { |
|||
this.shortToast('请输入提货人员') |
|||
return |
|||
} |
|||
if (this.stringIsEmpty(this.data.userPhone)) { |
|||
this.shortToast('请输入手机号码') |
|||
return |
|||
} |
|||
if (this.data.userPhone.length != 11) { |
|||
this.shortToast('手机号码格式不对') |
|||
return |
|||
} |
|||
|
|||
|
|||
let num = 0; |
|||
for (var i = 0; i < this.data.goodsVos.length; i++) { |
|||
num += Number(this.data.goodsVos[i].select); |
|||
} |
|||
if (num == 0) { |
|||
this.shortToast('您未选择任何商品') |
|||
return |
|||
} |
|||
|
|||
let _this = this |
|||
_this.$api.gifcardBookingSave(this.data).then((resp) => { |
|||
bus.$emit('order', "监听回调"); |
|||
uni.navigateBack() |
|||
|
|||
}).catch(e => { |
|||
_this.shortToast(e.msg) |
|||
}) |
|||
|
|||
}, |
|||
|
|||
save2() { |
|||
this.pageScroll() |
|||
this.colseDialog2() |
|||
|
|||
let num = 0; |
|||
for (var i = 0; i < this.data.goodsVos.length; i++) { |
|||
num += Number(this.data.goodsVos[i].select); |
|||
} |
|||
if (num == 0) { |
|||
this.shortToast('您未选择任何商品') |
|||
return |
|||
} |
|||
|
|||
let _this = this |
|||
|
|||
this.info.empCardSid = this.page.sid, |
|||
this.info.goodsVoList = this.data.goodsVos, |
|||
|
|||
console.log("info>>", this.info); |
|||
|
|||
_this.$api.generateEmpCardGift(this.info).then((resp) => { |
|||
bus.$emit('order', "监听回调"); |
|||
// uni.navigateBack() |
|||
|
|||
}).catch(e => { |
|||
_this.shortToast(e.msg) |
|||
}) |
|||
|
|||
}, |
|||
pageScroll() { |
|||
|
|||
//获取容器高度，使页面滚动到容器底部 #xxx就是view的id名 |
|||
wx.createSelectorQuery().select('#page').boundingClientRect(function(rect) { |
|||
console.log('rect', rect); |
|||
console.log('rectheight', rect.height); |
|||
/* 将页面移动到最底部（用xxx的height定位） */ |
|||
wx.pageScrollTo({ |
|||
scrollTop: rect.height |
|||
}) |
|||
}).exec() |
|||
|
|||
}, |
|||
|
|||
|
|||
request() { |
|||
let _this = this |
|||
_this.$api.gifcardDetail(this.page.sid).then((resp) => { |
|||
_this.data = resp |
|||
_this.$nextTick(() => { |
|||
_this.$refs.pageView.setLoadState(2) |
|||
}) |
|||
}).catch(e => { |
|||
_this.$nextTick(() => { |
|||
_this.$refs.pageView.setLoadState(1) |
|||
}) |
|||
}) |
|||
}, |
|||
|
|||
getSun() { |
|||
let _this = this |
|||
_this.$api.isSaturAndSun2(this.page.sid).then((resp) => { |
|||
|
|||
// console.log("aaa",resp) |
|||
|
|||
this.disabledDate = resp |
|||
|
|||
}).catch(e => { |
|||
|
|||
}) |
|||
}, |
|||
|
|||
showRecord(sid) { |
|||
uni.navigateTo({ |
|||
url: '/pages/card/card_record?sid=' + sid |
|||
}) |
|||
}, |
|||
booking(sid) { |
|||
uni.navigateTo({ |
|||
url: '/pages/card/card_booking?sid=' + sid |
|||
}) |
|||
}, |
|||
itemClick(goodsSid) { |
|||
uni.navigateTo({ |
|||
url: '/pages/good/goodsDetail?sid=' + goodsSid |
|||
}) |
|||
}, |
|||
onShareAppMessage: function(res) { |
|||
console.log("res", res) |
|||
console.log("data", res.target.dataset) |
|||
var data = res.target.dataset.info |
|||
this.shareCard(data.sid) |
|||
// ① |
|||
let shareData = JSON.stringify({ |
|||
params: { |
|||
code: data.code, |
|||
codeKey: data.codeKey, |
|||
customerSid: '' |
|||
}, |
|||
functionName: 'bindCard', |
|||
url: '/pages/detail/detail_affeection?sid=' + data.sid |
|||
|
|||
// url:'/pages/bind/bind_pickUpCard?code=' + + &codeKey=' + data.codeKey, |
|||
// FunctionName:'share! |
|||
}) |
|||
// 转码传输 |
|||
let value = encodeURIComponent(shareData) |
|||
|
|||
return { |
|||
title: '汇融农链ss-云菜窖', |
|||
// ② |
|||
path: '/pages/login/login?data=' + value, |
|||
imageUrl: 'https://supervise.yxtsoft.com/lpk/image/shareAffeection.png', //自定义图片路径，显示图片长宽比是 5:4。 |
|||
success: function(res) { |
|||
console.log('aaaa', "分享成功") |
|||
}, |
|||
fail: function(res) { |
|||
// 转发失败 |
|||
console.log('aaaa', "用户点击了取消") |
|||
} |
|||
} |
|||
}, |
|||
|
|||
shareCard(sid) { |
|||
let _this = this |
|||
|
|||
_this.$api.shareEmpCard(sid).then((resp) => { |
|||
|
|||
var item = _this.data.empCardGiftVos.find(item => item.sid === sid) |
|||
|
|||
console.log("item", item); |
|||
|
|||
item.share = '2' |
|||
|
|||
}).catch(e => {}) |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
.canvas-code { |
|||
width: 39vw !important; |
|||
height: 39vw !important; |
|||
} |
|||
|
|||
.sharebtn { |
|||
background: #FF4727; |
|||
font-size: 12px; |
|||
color: #fff; |
|||
width: 30vw; |
|||
border-radius: 20px; |
|||
} |
|||
|
|||
|
|||
.sharebtn::after { |
|||
border: none; |
|||
} |
|||
|
|||
.sharebtn2 { |
|||
background: #FF7165; |
|||
width: 30vw; |
|||
font-size: 12px; |
|||
color: #fff; |
|||
border-radius: 20px; |
|||
} |
|||
|
|||
.sharebtn2::after { |
|||
border: none; |
|||
} |
|||
|
|||
.sharebtn3 { |
|||
background: #CFCFCF; |
|||
width: 30vw; |
|||
font-size: 12px; |
|||
color: #fff; |
|||
border-radius: 20px; |
|||
} |
|||
|
|||
.sharebtn3::after { |
|||
border: none; |
|||
} |
|||
|
|||
.top { |
|||
width: 100vw; |
|||
/* height: 126.66vw; */ |
|||
height: 65vw; |
|||
/* 加载背景图 */ |
|||
background-image: url(https://supervise.yxtsoft.com/lpk/image/detail_bj1.png); |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
background-size: 100% 100%; |
|||
} |
|||
|
|||
.text { |
|||
white-space: normal; |
|||
text-overflow: -o-ellipsis-lastline; |
|||
overflow: hidden; |
|||
text-overflow: ellipsis; |
|||
display: -webkit-box; |
|||
-webkit-line-clamp: 2; |
|||
line-clamp: 2; |
|||
-webkit-box-orient: vertical; |
|||
} |
|||
|
|||
uni-page-body, |
|||
page { |
|||
background: #F1F2F3; |
|||
} |
|||
|
|||
.btn { |
|||
border: 1px solid; |
|||
padding-left: 30rpx; |
|||
padding-right: 30rpx; |
|||
padding-top: 12rpx; |
|||
padding-bottom: 12rpx; |
|||
border-radius: 50rpx; |
|||
height: 15px; |
|||
margin-left: 25rpx; |
|||
font-size: 26rpx; |
|||
} |
|||
|
|||
/* 弹窗样式 */ |
|||
.model { |
|||
position: absolute; |
|||
width: 100%; |
|||
height: 100%; |
|||
background: #000; |
|||
z-index: 999; |
|||
opacity: 0.5; |
|||
top: 0; |
|||
left: 0; |
|||
} |
|||
|
|||
.modalDlg { |
|||
/* 设置超出滚动 */ |
|||
overflow: auto; |
|||
width: 100%; |
|||
position: fixed; |
|||
top: 50vw; |
|||
left: 0; |
|||
right: 0; |
|||
bottom: 0; |
|||
z-index: 9999; |
|||
background-color: #fff; |
|||
border-top-right-radius: 20px; |
|||
border-top-left-radius: 20px; |
|||
display: flex; |
|||
flex-direction: column; |
|||
|
|||
|
|||
} |
|||
</style> |
|||
@ -0,0 +1,518 @@ |
|||
<template> |
|||
|
|||
<view style="display: flex;flex-direction: column;"> |
|||
|
|||
<view class="top"> |
|||
<NavBar ref="nav" navTitle="详情" :showIcon="true" :start-change-height="page.startHeight" |
|||
:end-change-height="page.endHeight"> |
|||
</NavBar> |
|||
<view style="display: flex;flex-direction: column;margin-top: 25vw; margin-left: 5vw;"> |
|||
<view style="font-size: 17px;color: #fff;height: 8vw;line-height: 8vw;margin-top: 5vw;"> |
|||
{{data.state}} |
|||
</view> |
|||
<view |
|||
style="font-size: 12px;color: white;line-height: 7vw;height: 7vw;color: #fff;box-sizing: border-box;"> |
|||
窖号：{{data.serialNumber}} |
|||
</view> |
|||
<view style="font-size: 12px;color: white;line-height: 7vw;height: 7vw;color: #fff;"> |
|||
{{data.time}} |
|||
</view> |
|||
</view> |
|||
|
|||
</view> |
|||
<view |
|||
style="display: flex;flex-direction: row;justify-content: center; |
|||
background-color: #fff;height: 25vw; border-top-left-radius: 25px;border-top-right-radius: 25px;margin-top: -9.06vw;"> |
|||
|
|||
|
|||
<image src="https://supervise.yxtsoft.com/lpk/image/detail_affeection.png" mode="aspectFit" |
|||
style="margin-left: 20px;margin-right: 20px; width: 80vw;height: 25vw;"></image> |
|||
|
|||
<view style="width: 55%; margin-left: 20vw; |
|||
display: flex;flex-direction: row;margin-top: 9vw;position: absolute;z-index: 10;align-items: center; |
|||
justify-content: space-between;"> |
|||
<text style="color: #fff;font-size: 18px;font-weight: 600;">{{data.pname}}</text> |
|||
|
|||
<text style="background: #F1F2F3 ; border-radius: 25px;color: #ccc;padding: 3px 10px;">转赠亲友</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<loading-state ref="pageView" @request="request"> |
|||
|
|||
<view style="background-color: #fff;padding: 10px 15px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<view style="background: #FF9D33; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<view style="background: #FFDAB2; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<text style="margin-left: 8px;font-size: 14px;color: #333;">商品明细</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view v-for="(item,index) in data.goodsVos" :key="index" @click="itemClick(item.goodsSid)" |
|||
style="display: flex;flex-direction: row;background-color: #fff;padding-left: 10px;padding-right: 10px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;background-color: #fff;padding: 10px 15px; |
|||
border-bottom: 1px #F1F2F3 solid; width: 100%;"> |
|||
<image :src="item.pic" style="width: 60px;height: 60px;flex-shrink: 0;"></image> |
|||
<view style="margin-left: 10px;margin-right: 10px;flex: 1;"> |
|||
<text class="text" style="font-weight: 500;">{{item.goods}} |
|||
</text> |
|||
<view style="font-size: 12px;color: #666666;margin-top: 5px;">{{item.remarks}}</view> |
|||
<view style="display: flex;flex-direction: row;justify-content: space-between;margin-top: 5px;"> |
|||
<text |
|||
style="font-size: 12px;color: #666666;margin-right: 10px;">总数：{{item.num}}{{item.unitName}} |
|||
</text> |
|||
<view style="font-size: 12px;color: #666666;">可预约：{{item.lnum}}{{item.unitName}}</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
|
|||
<view style="background-color: #fff;margin-top: 10px;padding: 10px 15px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<view style="background: #FF9D33; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<view style="background: #FFDAB2; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<text style="margin-left: 8px;font-size: 14px;color: #333;">预约记录</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view style="margin-bottom: 10px;"> |
|||
<view v-for="(item,index) in data.orderCardVoList" :key="index" |
|||
style="display: flex;flex-direction: row;background-color: #fff;padding-left: 10px;padding-right: 10px;"> |
|||
|
|||
<view style="display: flex;flex-direction: column;background-color: #fff; |
|||
border-bottom: 1px #F1F2F3 solid; width: 100%;padding-left: 20px;padding-bottom: 10px;"> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 10px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/date.png" |
|||
style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text |
|||
style="margin-left: 5px;font-size: 12px; color: #999;">提货时间：{{item.reserveDate}}</text> |
|||
</view> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/location.png" |
|||
style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text style="margin-left: 5px;font-size: 12px; color: #999;">提货地点：{{item.store}}</text> |
|||
</view> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/user2.png" mode="aspectFill" |
|||
style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text |
|||
style="margin-left: 5px;font-size: 12px; color: #999;">提 货 人：{{item.userName}}</text> |
|||
</view> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/phone2.png" mode="aspectFill" |
|||
style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text style="margin-left: 5px;font-size: 12px; color: #999;">联系电话：{{item.userPhone}}</text> |
|||
</view> |
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 8px;"> |
|||
<text style="color: #999; font-size: 12px;">- {{item.goods}}</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view style="background-color: #fff;margin-top: 10px;padding: 10px 15px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<view style="background: #FF9D33; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<view style="background: #FFDAB2; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<text style="margin-left: 8px;font-size: 14px;color: #333;">转赠信息</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view style="margin-bottom: 50px;"> |
|||
|
|||
<view v-for="(item,index) in data.empCardGifts" :key="index" |
|||
style="display: flex;flex-direction: row;background-color: #fff;padding-left: 10px;padding-right: 10px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;background-color: #fff; |
|||
border-bottom: 1px #F1F2F3 solid; width: 100%;padding-left: 10px; padding-right: 10px; padding-bottom: 10px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;width: 100%;margin-top: 15px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/home_affection.png" |
|||
style="width: 50px;height: 50px;margin-right: 10px;flex-shrink: 0;"></image> |
|||
|
|||
<view style="display: flex;flex-direction: column;width: 100%;"> |
|||
|
|||
<text |
|||
style="font-size: 12px; color: #333;margin-top: 5px;">亲情窖序号：{{item.serialNumber}}</text> |
|||
<text |
|||
style="font-size: 12px; color: #333;margin-top: 5px;">分享时间：{{item.createTime}}</text> |
|||
<text style="font-size: 12px; color: #333;margin-top: 5px;">亲情窖编码：{{item.code}}</text> |
|||
<text style="font-size: 12px; color: #333;margin-top: 5px;">提货密码：{{item.codeKey}}</text> |
|||
<text style="font-size: 12px; color: #333;margin-top: 5px;">备注说明：{{item.remarks}}</text> |
|||
|
|||
<view |
|||
style="display: flex;flex-direction: row;margin-top: 5px;align-items: center;justify-content: space-between;width: 100%;"> |
|||
<text style="flex: 1;font-size: 12px; color: #A5A5A5; margin-right: 10px;">- |
|||
{{item.goods}}</text> |
|||
|
|||
<button v-show="item.isShare=='1'" class='sharebtn' :data-info="item" |
|||
open-type="share">分享窖</button> |
|||
<button v-show="item.isShare=='2'" class='sharebtn2' :data-info="item" |
|||
open-type="share">已分享</button> |
|||
<button v-show="item.isShare=='3'" class='sharebtn3'>转赠成功</button> |
|||
|
|||
|
|||
</view> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view style="height: 50px;"></view> |
|||
|
|||
|
|||
|
|||
</loading-state> |
|||
|
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
page: { |
|||
sid: '', |
|||
startHeight: 0, |
|||
endHeight: 0 |
|||
}, |
|||
data: { |
|||
time: "", |
|||
name: "", |
|||
pname: "", |
|||
state: "", |
|||
notRese: false, |
|||
showBtn: false, |
|||
showRecord: false, |
|||
goodsVos: [], |
|||
value: "", |
|||
userName: "", |
|||
userPhone: "", |
|||
} |
|||
} |
|||
}, |
|||
onLoad(options) { |
|||
this.page.sid = options.sid |
|||
this.request() |
|||
this.$bus.$on('order', msg => { |
|||
this.$nextTick(() => { |
|||
this.$refs.pageView.setLoadState(0) |
|||
}) |
|||
this.request(); |
|||
}) |
|||
|
|||
let info = uni.getSystemInfoSync(); |
|||
|
|||
this.page.startHeight = info.windowWidth * 0.6 |
|||
this.page.endHeight = info.windowWidth * 0.8 |
|||
}, |
|||
onUnload() { |
|||
uni.$off('order'); |
|||
}, |
|||
onPageScroll(res) { |
|||
// 渐变 |
|||
this.$refs.nav.defaultColorBgAlpha(res) |
|||
}, |
|||
methods: { |
|||
|
|||
request() { |
|||
let _this = this |
|||
_this.$api.gifcardDetail(this.page.sid).then((resp) => { |
|||
_this.data = resp |
|||
_this.$nextTick(() => { |
|||
_this.$refs.pageView.setLoadState(2) |
|||
}) |
|||
}).catch(e => { |
|||
_this.$nextTick(() => { |
|||
_this.$refs.pageView.setLoadState(1) |
|||
}) |
|||
}) |
|||
}, |
|||
itemClick(goodsSid) { |
|||
uni.navigateTo({ |
|||
url: '/pages/good/goodsDetail?sid=' + goodsSid |
|||
}) |
|||
}, |
|||
onShareAppMessage: function(res) { |
|||
console.log("res", res) |
|||
console.log("data", res.target.dataset) |
|||
var data = res.target.dataset.info |
|||
this.shareCard(data.sid) |
|||
// ① |
|||
let shareData = JSON.stringify({ |
|||
params: { |
|||
code: data.code, |
|||
codeKey: data.codeKey, |
|||
customerSid: '' |
|||
}, |
|||
functionName: 'bindCard', |
|||
url: '/pages/detail/detail_affeection?sid=' + data.sid |
|||
|
|||
// url:'/pages/bind/bind_pickUpCard?code=' + + &codeKey=' + data.codeKey, |
|||
// FunctionName:'share! |
|||
}) |
|||
// 转码传输 |
|||
let value = encodeURIComponent(shareData) |
|||
|
|||
return { |
|||
title: '汇融农链-云菜窖', |
|||
// ② |
|||
path: '/pages/login/login?data=' + value, |
|||
imageUrl: 'https://supervise.yxtsoft.com/lpk/image/shareAffeection.png', //自定义图片路径，显示图片长宽比是 5:4。 |
|||
success: function(res) { |
|||
console.log('aaaa', "分享成功") |
|||
}, |
|||
fail: function(res) { |
|||
// 转发失败 |
|||
console.log('aaaa', "用户点击了取消") |
|||
} |
|||
} |
|||
}, |
|||
|
|||
shareCard(sid) { |
|||
let _this = this |
|||
|
|||
_this.$api.shareEmpCard(sid).then((resp) => { |
|||
|
|||
var item = _this.data.empCardGiftVos.find(item => item.sid === sid) |
|||
|
|||
console.log("item", item); |
|||
|
|||
item.share = '2' |
|||
|
|||
}).catch(e => {}) |
|||
} |
|||
|
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
.canvas-code { |
|||
width: 39vw !important; |
|||
height: 39vw !important; |
|||
} |
|||
|
|||
.sharebtn { |
|||
background: #FF4727; |
|||
font-size: 12px; |
|||
color: #fff; |
|||
width: 30vw; |
|||
border-radius: 20px; |
|||
} |
|||
|
|||
|
|||
.sharebtn::after { |
|||
border: none; |
|||
} |
|||
|
|||
.sharebtn2 { |
|||
background: #FF7165; |
|||
width: 30vw; |
|||
font-size: 12px; |
|||
color: #fff; |
|||
border-radius: 20px; |
|||
} |
|||
|
|||
.sharebtn2::after { |
|||
border: none; |
|||
} |
|||
|
|||
.sharebtn3 { |
|||
background: #CFCFCF; |
|||
width: 30vw; |
|||
font-size: 12px; |
|||
color: #fff; |
|||
border-radius: 20px; |
|||
} |
|||
|
|||
.sharebtn3::after { |
|||
border: none; |
|||
} |
|||
|
|||
.top { |
|||
width: 100vw; |
|||
/* height: 126.66vw; */ |
|||
height: 65vw; |
|||
/* 加载背景图 */ |
|||
background-image: url(https://supervise.yxtsoft.com/lpk/image/detail_bj4.png); |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
background-size: 100% 100%; |
|||
} |
|||
|
|||
.text { |
|||
white-space: normal; |
|||
text-overflow: -o-ellipsis-lastline; |
|||
overflow: hidden; |
|||
text-overflow: ellipsis; |
|||
display: -webkit-box; |
|||
-webkit-line-clamp: 2; |
|||
line-clamp: 2; |
|||
-webkit-box-orient: vertical; |
|||
} |
|||
|
|||
uni-page-body, |
|||
page { |
|||
background: #F1F2F3; |
|||
} |
|||
|
|||
.btn { |
|||
border: 1px solid; |
|||
padding-left: 30rpx; |
|||
padding-right: 30rpx; |
|||
padding-top: 12rpx; |
|||
padding-bottom: 12rpx; |
|||
border-radius: 50rpx; |
|||
height: 15px; |
|||
margin-left: 25rpx; |
|||
font-size: 26rpx; |
|||
} |
|||
|
|||
/* 弹窗样式 */ |
|||
.model { |
|||
position: absolute; |
|||
width: 100%; |
|||
height: 100%; |
|||
background: #000; |
|||
z-index: 999; |
|||
opacity: 0.5; |
|||
top: 0; |
|||
left: 0; |
|||
} |
|||
|
|||
.modalDlg { |
|||
/* 设置超出滚动 */ |
|||
overflow: auto; |
|||
width: 90%; |
|||
position: fixed; |
|||
top: 50vw; |
|||
left: 0; |
|||
right: 0; |
|||
bottom: 0; |
|||
z-index: 9999; |
|||
margin: 0 auto; |
|||
padding: 35rpx; |
|||
background-color: #fff; |
|||
border-radius: 20rpx; |
|||
display: flex; |
|||
flex-direction: column; |
|||
|
|||
} |
|||
|
|||
.windowRow { |
|||
display: flex; |
|||
flex-direction: row; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
padding-bottom: 15rpx; |
|||
width: 100%; |
|||
} |
|||
|
|||
.userTitle { |
|||
font-size: 42rpx; |
|||
} |
|||
|
|||
.back { |
|||
text-align: center; |
|||
color: #f0a500; |
|||
font-size: 30rpx; |
|||
} |
|||
|
|||
.wishName { |
|||
width: 100%; |
|||
justify-content: center; |
|||
flex-direction: row; |
|||
display: flex; |
|||
margin: 40rpx 0rpx; |
|||
} |
|||
|
|||
.wish_put { |
|||
width: 100%; |
|||
border: #ededef 1rpx solid; |
|||
background-color: #f6f7fb; |
|||
border-radius: 12rpx; |
|||
padding: 30rpx 20rpx; |
|||
margin: 20rpx 0rpx; |
|||
} |
|||
|
|||
.holder_cls { |
|||
color: #909399; |
|||
} |
|||
|
|||
.wishbnt { |
|||
background-color: #fec600; |
|||
text-align: center; |
|||
border-radius: 50rpx; |
|||
padding: 25rpx; |
|||
color: white; |
|||
} |
|||
|
|||
/*弹窗样式结束*/ |
|||
|
|||
/* 下面的姓名样式，不要也没什么影响 */ |
|||
.jiantou { |
|||
width: 35rpx; |
|||
height: 35rpx; |
|||
margin-left: 10rpx; |
|||
} |
|||
|
|||
.fenge { |
|||
margin-bottom: 30rpx; |
|||
} |
|||
|
|||
.xian { |
|||
border-bottom: #e5e5e5 1rpx solid; |
|||
} |
|||
|
|||
.yellow { |
|||
color: #f0a500; |
|||
font-weight: 700; |
|||
} |
|||
|
|||
.box { |
|||
background-color: white; |
|||
padding: 0rpx 25rpx; |
|||
display: flex; |
|||
flex-direction: column; |
|||
} |
|||
|
|||
.row { |
|||
height: 120rpx; |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
} |
|||
|
|||
.you { |
|||
height: 100%; |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
} |
|||
|
|||
.zhushi { |
|||
font-size: 28rpx; |
|||
color: #808080; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,774 @@ |
|||
<template> |
|||
|
|||
<view style="display: flex;flex-direction: column;" id="page"> |
|||
|
|||
<view class="top"> |
|||
<NavBar ref="nav" navTitle="详情" :showIcon="true" :start-change-height="page.startHeight" |
|||
:end-change-height="page.endHeight"> |
|||
</NavBar> |
|||
<view style="display: flex;flex-direction: column;margin-top: 25vw; margin-left: 5vw;"> |
|||
<view style="font-size: 17px;color: #fff;height: 8vw;line-height: 8vw;margin-top: 5vw;"> |
|||
{{data.state}} |
|||
</view> |
|||
<view |
|||
style="font-size: 12px;color: white;line-height: 7vw;height: 7vw;color: #fff;box-sizing: border-box;"> |
|||
窖号：{{data.serialNumber}} |
|||
</view> |
|||
<view style="font-size: 12px;color: white;line-height: 7vw;height: 7vw;color: #fff;"> |
|||
{{data.time}} |
|||
</view> |
|||
</view> |
|||
|
|||
</view> |
|||
<view |
|||
style="display: flex;flex-direction: row;justify-content: center; |
|||
background-color: #fff;height: 25vw; border-top-left-radius: 25px;border-top-right-radius: 25px;margin-top: -9.06vw;"> |
|||
|
|||
|
|||
<image src="https://supervise.yxtsoft.com/lpk/image/detail_enterprise.png" mode="aspectFit" |
|||
style="margin-left: 20px;margin-right: 20px; width: 80vw;height: 25vw;"></image> |
|||
|
|||
<view style="width: 55%; margin-left: 20vw; |
|||
display: flex;flex-direction: row;margin-top: 9vw;position: absolute;z-index: 10;align-items: center; |
|||
justify-content: space-between;"> |
|||
<text style="color: #fff;font-size: 18px;font-weight: 600;">{{data.pname}}</text> |
|||
|
|||
<text v-if="data.notRese" |
|||
style="background: #fff ; border-radius: 25px;color: #FF7201;padding: 3px 10px;" |
|||
@click="showDialog">转赠亲友</text> |
|||
|
|||
<text v-if="!data.notRese" |
|||
style="background: #F1F2F3 ; border-radius: 25px;color: #ccc;padding: 3px 10px;">转赠亲友</text> |
|||
</view> |
|||
|
|||
</view> |
|||
<loading-state ref="pageView" @request="request"> |
|||
|
|||
<view style="background-color: #fff;padding: 10px 15px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<view style="background: #FF9D33; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<view style="background: #FFDAB2; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<text style="margin-left: 8px;font-size: 14px;color: #333;">商品明细</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view v-for="(item,index) in data.goodsVos" :key="index" @click="itemClick(item.goodsSid)" |
|||
style="display: flex;flex-direction: row;background-color: #fff;padding-left: 10px;padding-right: 10px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;background-color: #fff;padding: 10px 15px; |
|||
border-bottom: 1px #F1F2F3 solid; width: 100%;"> |
|||
<image :src="item.pic" style="width: 60px;height: 60px;flex-shrink: 0;"></image> |
|||
<view style="margin-left: 10px;margin-right: 10px;flex: 1;"> |
|||
<text class="text" style="font-weight: 500;">{{item.goods}} |
|||
</text> |
|||
<view style="font-size: 12px;color: #666666;margin-top: 5px;">{{item.remarks}}</view> |
|||
<view style="display: flex;flex-direction: row;justify-content: space-between;margin-top: 5px;"> |
|||
<text |
|||
style="font-size: 12px;color: #666666;margin-right: 10px;">总数：{{item.num}}{{item.unitName}} |
|||
</text> |
|||
<view style="font-size: 12px;color: #666666;">窖内剩余：{{item.lnum}}{{item.unitName}}</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
|
|||
<view style="background-color: #fff;margin-top: 10px;padding: 10px 15px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<view style="background: #FF9D33; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<view style="background: #FFDAB2; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<text style="margin-left: 8px;font-size: 14px;color: #333;">预约记录</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view style="margin-bottom: 10px;"> |
|||
<view v-for="(item,index) in data.orderCardVoList" :key="index" |
|||
style="display: flex;flex-direction: row;background-color: #fff;padding-left: 10px;padding-right: 10px;"> |
|||
|
|||
<view style="display: flex;flex-direction: column;background-color: #fff; |
|||
border-bottom: 1px #F1F2F3 solid; width: 100%;padding-left: 20px;padding-bottom: 10px;"> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 10px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/date.png" |
|||
style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text |
|||
style="margin-left: 5px;font-size: 12px; color: #999;">提货时间：{{item.reserveDate}}</text> |
|||
</view> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/location.png" |
|||
style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text style="margin-left: 5px;font-size: 12px; color: #999;">提货地点：{{item.store}}</text> |
|||
</view> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/user2.png" mode="aspectFill" |
|||
style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text |
|||
style="margin-left: 5px;font-size: 12px; color: #999;">提 货 人：{{item.userName}}</text> |
|||
</view> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/phone2.png" mode="aspectFill" |
|||
style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text style="margin-left: 5px;font-size: 12px; color: #999;">联系电话：{{item.userPhone}}</text> |
|||
</view> |
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 8px;"> |
|||
<text style="color: #999; font-size: 12px;">- {{item.goods}}</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view style="background-color: #fff;margin-top: 10px;padding: 10px 15px;" id='the-id'> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<view style="background: #FF9D33; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<view style="background: #FFDAB2; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<text style="margin-left: 8px;font-size: 14px;color: #333;">转赠记录</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view style="margin-bottom: 50px;"> |
|||
<view v-for="(item,index) in data.empCardGiftVos" :key="index" |
|||
style="display: flex;flex-direction: row;background-color: #fff;padding-left: 10px;padding-right: 10px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;background-color: #fff; |
|||
border-bottom: 1px #F1F2F3 solid; width: 100%;padding-left: 10px; padding-right: 10px; padding-bottom: 10px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;width: 100%;margin-top: 15px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/home_affection.png" |
|||
style="width: 50px;height: 50px;margin-right: 10px;flex-shrink: 0;"></image> |
|||
|
|||
<view style="display: flex;flex-direction: column;width: 100%;"> |
|||
|
|||
<text |
|||
style="font-size: 12px; color: #333;margin-top: 5px;">亲情窖序号：{{item.serialNumber}}</text> |
|||
<text |
|||
style="font-size: 12px; color: #333;margin-top: 5px;">分享时间：{{item.createTime}}</text> |
|||
<text style="font-size: 12px; color: #333;margin-top: 5px;">亲情窖编码：{{item.code}}</text> |
|||
<text style="font-size: 12px; color: #333;margin-top: 5px;">提货密码：{{item.codeKey}}</text> |
|||
<text style="font-size: 12px; color: #333;margin-top: 5px;">备注说明：{{item.remarks}}</text> |
|||
|
|||
<view |
|||
style="display: flex;flex-direction: row;margin-top: 5px;align-items: center;justify-content: space-between;width: 100%;"> |
|||
<text style="flex: 1;font-size: 12px; color: #A5A5A5; margin-right: 10px;">- |
|||
{{item.goods}}</text> |
|||
|
|||
<button v-show="item.isShare=='1'" class='sharebtn' :data-info="item" |
|||
open-type="share">分享窖</button> |
|||
<button v-show="item.isShare=='2'" class='sharebtn2' :data-info="item" |
|||
open-type="share">已分享</button> |
|||
<button v-show="item.isShare=='3'" class='sharebtn3'>转赠成功</button> |
|||
|
|||
|
|||
</view> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
</view> |
|||
|
|||
<view style="height: 50px;"></view> |
|||
|
|||
<view v-if="data.notRese" style="width: 100%; background-color: #fff;height: 15vw;position: fixed;bottom: 0;overflow:hidden; |
|||
display: flex;flex-direction: row;"> |
|||
<!-- <text |
|||
style="flex: 1;color: #B3B3B3; padding: 10px 20px; display:margin：auto;text-align: center;line-height: 10vw;"> |
|||
可选择就近网点进行预约提货 > |
|||
</text> --> |
|||
<view style="flex: 1;"></view> |
|||
<text style=" width: 20vw;font-size: 16px;color: #fff; background-color: #FE3F00; |
|||
padding: 10px 20px; display:margin：auto;text-align: center;line-height: 10vw;" @click="showDialog2">预约提货</text> |
|||
|
|||
</view> |
|||
|
|||
</loading-state> |
|||
|
|||
<!-- 弹窗蒙版 --> |
|||
<view class="model" catchtouchmove='preventTouchMove' v-if='showModal' @click.stop="colseDialog()"></view> |
|||
<view class="modalDlg" catchtouchmove='preventTouchMove' v-if='showModal'> |
|||
<scroll-view scroll-y="true" style="height: 100%; width: 100%; box-sizing: border-box; |
|||
" bindscrolltoupper="upper" bindscrolltolower="lower" bindscroll="scroll"> |
|||
|
|||
<!-- <view |
|||
style="display: flex;flex-direction: column;justify-content: center;align-items: center;margin-top: 20px;"> |
|||
|
|||
<view style="width: 43vw; height: 43vw;margin-top: 10px;padding: 5px; |
|||
display: flex;justify-content: center;align-items: center;" class="boeder"> |
|||
<canvas class="canvas-code" canvas-id="canvas" style="width: 39vw; height: 39vw;" /> |
|||
</view> |
|||
|
|||
|
|||
<text |
|||
style="font-size: 16px;color: #333; width: 100%;text-align: center;margin-top: 20px;">福礼卡编码：{{data.giftCode}}</text> |
|||
<text |
|||
style="font-size: 16px; color: #333;width: 100%;text-align: center;margin-top: 5px;">提货密码：{{data.giftCodeKey}}</text> |
|||
</view> --> |
|||
|
|||
<view style="display: flex;flex-direction: column;margin: 20px;"> |
|||
<text>菜窖数量</text> |
|||
<view style="display: flex;align-items: center;margin-top: 6px;"> |
|||
<input placeholder="请输入菜窖数量" |
|||
style="font-size: 30rpx;flex: 1;background: #F8F8F8;border-radius: 5px;height: 40px;line-height: 40px;padding-left: 10px;padding-right: 10px;" |
|||
type="number" :value="info.count" @input="onKeyInput1" /> |
|||
</view> |
|||
</view> |
|||
<view style="display: flex;flex-direction: column;margin: 20px;"> |
|||
<text>商品列表</text> |
|||
<view style="background: #F5F5F5; border-radius: 5px;margin-top: 6px;"> |
|||
<view v-for="(item,index) in data.goodsVos" |
|||
style="display: flex;flex-direction: row;margin-top: 15px; margin-bottom: 10px;"> |
|||
<view style="margin-left: 10px;margin-right: 10px;flex: 1; |
|||
display: flex;flex-direction: column;justify-content: space-between;align-items: flex-end; |
|||
padding: 10px;"> |
|||
<text class="text" style="font-weight: 500;width: 100%;font-size: 14px;">{{item.goods}} |
|||
</text> |
|||
<text class="text" |
|||
style="font-weight: 500;width: 100%;color: #919191; font-size: 12px;">剩余：{{item.lnum}}{{item.unitName}} |
|||
</text> |
|||
<uni-number-box ref="box" style="margin-top: -30px;" :showTextView="true" :min="0" |
|||
:max="item.lnum" v-model="item.select"></uni-number-box> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view style="display: flex;flex-direction: column;margin: 20px;"> |
|||
<text>备注说明</text> |
|||
<view style="display: flex;align-items: center;margin-top: 6px;"> |
|||
<input placeholder="请输入" |
|||
style="font-size: 30rpx;flex: 1;background: #F8F8F8;border-radius: 5px;height: 40px;line-height: 40px;padding-left: 10px;padding-right: 10px;" |
|||
:value="info.remarks" @input="onKeyInput2" /> |
|||
<!-- <textarea placeholder="请输入" :disable-default-padding='true' :fixed="true" style="font-size: 30rpx;flex: 1;background: #F8F8F8;border-radius: 5px; |
|||
line-height: 20px;padding: 10px; |
|||
white-space: pre-wrap; |
|||
height: auto;min-height: 30px; |
|||
word-wrap: break-word;" :value="info.remarks" @input="onKeyInput2" /> --> |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
<view |
|||
style="display: flex;flex-direction: row;align-items: center;justify-content: center;margin-top: 100px;width: 100%;"> |
|||
|
|||
<text |
|||
style="border-radius:30px; font-size: 14px;color: #666;background-color: #F5F5F5; padding: 5px 30px;margin-right: 20px;" |
|||
@click.stop="colseDialog()">取消</text> |
|||
<text |
|||
style="border-radius: 30px; font-size: 14px;color: #fff; background-color: #FE3F00; padding: 5px 30px;margin-left: 20px;" |
|||
@click="save">确认</text> |
|||
|
|||
</view> |
|||
<view style="height: 50px;"> |
|||
|
|||
</view> |
|||
|
|||
</scroll-view> |
|||
</view> |
|||
|
|||
<!-- 弹窗蒙版 --> |
|||
<view class="model" catchtouchmove='preventTouchMove' v-if='showModal2' @click.stop="colseDialog2()"></view> |
|||
<view class="modalDlg" catchtouchmove='preventTouchMove' v-if='showModal2'> |
|||
<scroll-view scroll-y="true" style="height: 100%;width: 100%; padding: 20px; " bindscrolltoupper="upper" |
|||
bindscrolltolower="lower" bindscroll="scroll"> |
|||
|
|||
<view style="display: flex;flex-direction: column;margin-top: 10px;"> |
|||
<text>提货地点</text> |
|||
<view |
|||
style="margin-top: 10px;background:#F5F5F5 ; display: flex;flex-direction: row;justify-content: space-between;width: 89.5%;border-radius: 4px;min-height: 35px;align-items: center;" |
|||
@click="address"> |
|||
<view v-if="stringIsEmpty(data.addressName)" |
|||
style="color: #666;font-size: 12px;margin-left: 10px;"> |
|||
请选择提货点</view> |
|||
<view v-if="stringIsNotEmpty(data.addressName)" |
|||
style="color: #666;font-size: 12px;margin-left: 10px;">{{data.addressName}}</view> |
|||
<uni-icons type="bottom" size="14" color="#999" style="flex-direction: 0;margin: 0px 5px;" /> |
|||
</view> |
|||
</view> |
|||
|
|||
<view style="display: flex;flex-direction: column;margin-top: 10px;width: 89.5%;"> |
|||
<text>提货时间</text> |
|||
<view style="display: flex;align-items: center;margin-top: 6px;"> |
|||
<uni-datetime-picker type="date" v-model="data.reserveDate" style="flex: 1;background: #F8F8F8;" |
|||
:start="data.start" :end="data.end" :disabledDate="disabledDate" /> |
|||
</view> |
|||
</view> |
|||
|
|||
<view style="display: flex;flex-direction: column;margin-top: 10px;width: 89.5%;"> |
|||
<text>提货人</text> |
|||
<view style="display: flex;align-items: center;margin-top: 6px;"> |
|||
<input placeholder="请输入提货人" |
|||
style="font-size: 30rpx;flex: 1;background: #F8F8F8;border-radius: 5px;height: 40px;line-height: 40px;padding-left: 10px;" |
|||
:value="data.userName" @input="onKeyInput3" /> |
|||
</view> |
|||
</view> |
|||
|
|||
<view style="display: flex;flex-direction: column;margin-top: 10px;width: 89.5%;"> |
|||
<text>联系电话</text> |
|||
<view style="display: flex;align-items: center;margin-top: 6px;"> |
|||
<input maxlength="11" placeholder="请输入联系电话" |
|||
style="font-size: 30rpx;flex: 1;background: #F8F8F8;border-radius: 5px;height: 40px;line-height: 40px;padding-left: 10px;" |
|||
type="number" :value="data.userPhone" @input="onKeyInput4" /> |
|||
</view> |
|||
</view> |
|||
|
|||
<view style="background: #F5F5F5; border-radius: 5px;margin-top: 15px;width: 89.5%;"> |
|||
<view v-for="(item,index) in data.goodsVos" |
|||
style="display: flex;flex-direction: row;margin-top: 15px; margin-bottom: 10px;"> |
|||
<view style="margin-left: 10px;margin-right: 10px;flex: 1; |
|||
display: flex;flex-direction: column;justify-content: space-between;align-items: flex-end; |
|||
padding: 10px;"> |
|||
<text class="text" style="font-weight: 500;width: 100%;font-size: 14px;">{{item.goods}} |
|||
</text> |
|||
<text class="text" |
|||
style="font-weight: 500;width: 100%;color: #919191; font-size: 12px;">剩余：{{item.lnum}}{{item.unitName}} |
|||
</text> |
|||
<uni-number-box ref="box" style="margin-top: -30px;" :showTextView="true" :min="0" |
|||
:max="item.lnum" v-model="item.select"></uni-number-box> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view |
|||
style="display: flex;flex-direction: row;align-items: center;justify-content: center; margin-top: 100px;width: 100%;"> |
|||
|
|||
<text |
|||
style="border-radius:30px; font-size: 14px;color: #666;background-color: #F5F5F5; padding: 5px 30px;margin-right: 20px;" |
|||
@click.stop="colseDialog2()">取消</text> |
|||
<text |
|||
style="border-radius: 30px; font-size: 14px;color: #fff; background-color: #FE3F00; padding: 5px 30px;margin-left: 20px;" |
|||
@click="save2">确认</text> |
|||
|
|||
</view> |
|||
<view style="height: 50px;"> |
|||
|
|||
</view> |
|||
|
|||
</scroll-view> |
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
// import QRCode from '@/utils/weapp-qrcode.js' |
|||
//引入bus |
|||
import bus from '@/common/bus'; |
|||
export default { |
|||
data() { |
|||
return { |
|||
showModal: false, |
|||
showModal2: false, |
|||
page: { |
|||
sid: '', |
|||
startHeight: 0, |
|||
endHeight: 0 |
|||
}, |
|||
data: {}, |
|||
info: { |
|||
count: "1", |
|||
empCardSid: "", |
|||
remarks: "", |
|||
goodsVoList: [] |
|||
}, |
|||
disabledDate: [ |
|||
// '2023-12-16' |
|||
], |
|||
// qrcode: null, |
|||
|
|||
} |
|||
}, |
|||
onLoad(options) { |
|||
this.page.sid = options.sid |
|||
this.request() |
|||
this.getSun() |
|||
this.$bus.$on('order', msg => { |
|||
this.$nextTick(() => { |
|||
this.$refs.pageView.setLoadState(0) |
|||
}) |
|||
this.request(); |
|||
}) |
|||
|
|||
|
|||
uni.$on("address", (e) => { |
|||
// 相当与下拉刷新 |
|||
this.data.value = e.sid; |
|||
this.data.addressName = e.name; |
|||
}) |
|||
|
|||
let info = uni.getSystemInfoSync(); |
|||
|
|||
this.page.startHeight = info.windowWidth * 0.6 |
|||
this.page.endHeight = info.windowWidth * 0.8 |
|||
|
|||
// let long = info.windowWidth*0.39; |
|||
|
|||
// this.qrcode = new QRCode('canvas', { |
|||
// usingIn: this, |
|||
// text: "https://github.com/tomfriwel/weapp-qrcode", |
|||
// width: long, |
|||
// height: long, |
|||
// colorDark: "#000000", |
|||
// colorLight: "#ffffff", |
|||
// correctLevel: QRCode.CorrectLevel.H, |
|||
// }) |
|||
|
|||
|
|||
}, |
|||
onUnload() { |
|||
uni.$off('order'); |
|||
uni.$off('address'); |
|||
}, |
|||
onPageScroll(res) { |
|||
// 渐变 |
|||
this.$refs.nav.defaultColorBgAlpha(res) |
|||
}, |
|||
methods: { |
|||
showDialog() { |
|||
// this.qrcode.makeCode(this.data.qrCode) |
|||
this.showModal = true |
|||
}, |
|||
colseDialog() { |
|||
this.showModal = false |
|||
}, |
|||
showDialog2() { |
|||
// this.qrcode.makeCode(this.data.qrCode) |
|||
this.showModal2 = true |
|||
}, |
|||
colseDialog2() { |
|||
this.showModal2 = false |
|||
}, |
|||
address() { |
|||
uni.navigateTo({ |
|||
url: '/pages/SelectAddressActivity' |
|||
}) |
|||
}, |
|||
onKeyInput1: function(event) { |
|||
this.info.count = event.target.value |
|||
}, |
|||
onKeyInput2: function(event) { |
|||
this.info.remarks = event.target.value |
|||
}, |
|||
onKeyInput3: function(event) { |
|||
this.data.userName = event.target.value |
|||
}, |
|||
onKeyInput4: function(event) { |
|||
this.data.userPhone = event.target.value |
|||
}, |
|||
getSun() { |
|||
let _this = this |
|||
_this.$api.isSaturAndSun3(this.page.sid).then((resp) => { |
|||
|
|||
// console.log("aaa",resp) |
|||
|
|||
this.disabledDate = resp |
|||
|
|||
}).catch(e => { |
|||
|
|||
}) |
|||
}, |
|||
|
|||
pageScroll() { |
|||
|
|||
//获取容器高度，使页面滚动到容器底部 #xxx就是view的id名 |
|||
wx.createSelectorQuery().select('#page').boundingClientRect(function(rect) { |
|||
console.log('rect', rect); |
|||
console.log('rectheight', rect.height); |
|||
/* 将页面移动到最底部（用xxx的height定位） */ |
|||
wx.pageScrollTo({ |
|||
scrollTop: rect.height |
|||
}) |
|||
}).exec() |
|||
|
|||
}, |
|||
|
|||
|
|||
save() { |
|||
this.pageScroll() |
|||
this.colseDialog2() |
|||
let num = 0; |
|||
for (var i = 0; i < this.data.goodsVos.length; i++) { |
|||
num += Number(this.data.goodsVos[i].select); |
|||
} |
|||
if (num == 0) { |
|||
this.shortToast('您未选择任何商品') |
|||
return |
|||
} |
|||
|
|||
let _this = this |
|||
|
|||
this.info.empCardSid = this.page.sid, |
|||
this.info.goodsVoList = this.data.goodsVos, |
|||
|
|||
console.log("info>>", this.info); |
|||
|
|||
_this.$api.empcardSave(this.info).then((resp) => { |
|||
bus.$emit('order', "监听回调"); |
|||
// uni.navigateBack() |
|||
|
|||
|
|||
}).catch(e => { |
|||
_this.shortToast(e.msg) |
|||
}) |
|||
|
|||
}, |
|||
|
|||
save2() { |
|||
|
|||
if (this.stringIsEmpty(this.data.value)) { |
|||
this.shortToast('请选择提货地点') |
|||
return |
|||
} |
|||
if (this.stringIsEmpty(this.data.reserveDate)) { |
|||
this.shortToast('请选择提货时间') |
|||
return |
|||
} |
|||
if (this.stringIsEmpty(this.data.userName)) { |
|||
this.shortToast('请输入提货人员') |
|||
return |
|||
} |
|||
if (this.stringIsEmpty(this.data.userPhone)) { |
|||
this.shortToast('请输入手机号码') |
|||
return |
|||
} |
|||
if (this.data.userPhone.length != 11) { |
|||
this.shortToast('手机号码格式不对') |
|||
return |
|||
} |
|||
|
|||
|
|||
let num = 0; |
|||
for (var i = 0; i < this.data.goodsVos.length; i++) { |
|||
num += Number(this.data.goodsVos[i].select); |
|||
} |
|||
if (num == 0) { |
|||
this.shortToast('您未选择任何商品') |
|||
return |
|||
} |
|||
|
|||
let _this = this |
|||
_this.$api.empcardBookingSave(this.data).then((resp) => { |
|||
bus.$emit('order', "监听回调"); |
|||
// uni.navigateBack() |
|||
_this.$refs.nav.clickIcon() |
|||
|
|||
}).catch(e => { |
|||
_this.shortToast(e.msg) |
|||
}) |
|||
|
|||
|
|||
}, |
|||
|
|||
request() { |
|||
let _this = this |
|||
_this.$api.empCardDetail(this.page.sid).then((resp) => { |
|||
_this.data = resp |
|||
// _this.qrcode.makeCode(_this.data.qrCode) |
|||
_this.$nextTick(() => { |
|||
_this.$refs.pageView.setLoadState(2) |
|||
}) |
|||
|
|||
}).catch(e => { |
|||
_this.$nextTick(() => { |
|||
_this.$refs.pageView.setLoadState(1) |
|||
}) |
|||
}) |
|||
}, |
|||
|
|||
itemClick(goodsSid) { |
|||
uni.navigateTo({ |
|||
url: '/pages/good/goodsDetail?sid=' + goodsSid |
|||
}) |
|||
}, |
|||
onShareAppMessage: function(res) { |
|||
console.log("res", res) |
|||
console.log("data", res.target.dataset) |
|||
var data = res.target.dataset.info |
|||
this.shareCard(data.sid) |
|||
|
|||
// ① |
|||
let shareData = JSON.stringify({ |
|||
|
|||
// 直接绑定 进入详情 |
|||
params: { |
|||
code: data.code, |
|||
codeKey: data.codeKey, |
|||
customerSid: '' |
|||
}, |
|||
functionName: 'bindCard', |
|||
url: '/pages/detail/detail_affeection?sid=' + data.sid |
|||
|
|||
// 分享 绑卡 |
|||
// url:'/pages/bind/bind_pickUpCard?code=' + + &codeKey=' + data.codeKey, |
|||
// FunctionName:'share! |
|||
}) |
|||
// 转码传输 |
|||
let value = encodeURIComponent(shareData) |
|||
|
|||
return { |
|||
title: '汇融农链-云菜窖', |
|||
// ② |
|||
path: '/pages/login/login?data=' + value, |
|||
imageUrl: 'https://supervise.yxtsoft.com/lpk/image/shareAffeection.png', //自定义图片路径，显示图片长宽比是 5:4。 |
|||
success: function(res) { |
|||
console.log('aaaa', "分享成功") |
|||
}, |
|||
fail: function(res) { |
|||
// 转发失败 |
|||
console.log('aaaa', "用户点击了取消") |
|||
} |
|||
} |
|||
}, |
|||
|
|||
shareCard(sid) { |
|||
let _this = this |
|||
|
|||
_this.$api.shareEmpCard(sid).then((resp) => { |
|||
|
|||
var item = _this.data.empCardGiftVos.find(item => item.sid === sid) |
|||
|
|||
console.log("item", item); |
|||
|
|||
item.share = '2' |
|||
|
|||
}).catch(e => {}) |
|||
} |
|||
|
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
.canvas-code { |
|||
width: 39vw !important; |
|||
height: 39vw !important; |
|||
} |
|||
|
|||
.sharebtn { |
|||
background: #FF4727; |
|||
font-size: 12px; |
|||
color: #fff; |
|||
width: 30vw; |
|||
border-radius: 20px; |
|||
} |
|||
|
|||
|
|||
.sharebtn::after { |
|||
border: none; |
|||
} |
|||
|
|||
.sharebtn2 { |
|||
background: #FF7165; |
|||
width: 30vw; |
|||
font-size: 12px; |
|||
color: #fff; |
|||
border-radius: 20px; |
|||
} |
|||
|
|||
.sharebtn2::after { |
|||
border: none; |
|||
} |
|||
|
|||
.sharebtn3 { |
|||
background: #CFCFCF; |
|||
width: 30vw; |
|||
font-size: 12px; |
|||
color: #fff; |
|||
border-radius: 20px; |
|||
} |
|||
|
|||
.sharebtn3::after { |
|||
border: none; |
|||
} |
|||
|
|||
.boeder { |
|||
/* 加载背景图 */ |
|||
background-image: url(../../static/border.png); |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
background-size: 100% 100%; |
|||
} |
|||
|
|||
.top { |
|||
width: 100vw; |
|||
/* height: 126.66vw; */ |
|||
height: 65vw; |
|||
/* 加载背景图 */ |
|||
background-image: url(https://supervise.yxtsoft.com/lpk/image/detail_bj1.png); |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
background-size: 100% 100%; |
|||
} |
|||
|
|||
.text { |
|||
white-space: normal; |
|||
text-overflow: -o-ellipsis-lastline; |
|||
overflow: hidden; |
|||
text-overflow: ellipsis; |
|||
display: -webkit-box; |
|||
-webkit-line-clamp: 2; |
|||
line-clamp: 2; |
|||
-webkit-box-orient: vertical; |
|||
} |
|||
|
|||
uni-page-body, |
|||
page { |
|||
background: #F1F2F3; |
|||
} |
|||
|
|||
.btn { |
|||
border: 1px solid; |
|||
padding-left: 30rpx; |
|||
padding-right: 30rpx; |
|||
padding-top: 12rpx; |
|||
padding-bottom: 12rpx; |
|||
border-radius: 50rpx; |
|||
height: 15px; |
|||
margin-left: 25rpx; |
|||
font-size: 26rpx; |
|||
} |
|||
|
|||
/* 弹窗样式 */ |
|||
.model { |
|||
position: absolute; |
|||
width: 100%; |
|||
height: 100%; |
|||
background: #000; |
|||
z-index: 999; |
|||
opacity: 0.5; |
|||
top: 0; |
|||
left: 0; |
|||
} |
|||
|
|||
.modalDlg { |
|||
/* 设置超出滚动 */ |
|||
overflow: auto; |
|||
width: 100%; |
|||
position: fixed; |
|||
top: 50vw; |
|||
left: 0; |
|||
right: 0; |
|||
bottom: 0; |
|||
z-index: 9999; |
|||
margin: 0 auto; |
|||
background-color: #fff; |
|||
border-top-left-radius: 20px; |
|||
border-top-right-radius: 20px; |
|||
display: flex; |
|||
flex-direction: column; |
|||
box-sizing: content-box; |
|||
|
|||
} |
|||
</style> |
|||
@ -0,0 +1,512 @@ |
|||
<template> |
|||
|
|||
<view style="display: flex;flex-direction: column;"> |
|||
|
|||
<view class="top"> |
|||
<NavBar ref="nav" navTitle="详情" :showIcon="true" :start-change-height="page.startHeight" |
|||
:end-change-height="page.endHeight"> |
|||
</NavBar> |
|||
<view style="display: flex;flex-direction: column;margin-top: 25vw; margin-left: 5vw;"> |
|||
<view style="font-size: 17px;color: #fff;height: 8vw;line-height: 8vw;margin-top: 5vw;"> |
|||
{{data.state}} |
|||
</view> |
|||
<view |
|||
style="font-size: 12px;color: white;line-height: 7vw;height: 7vw;color: #fff;box-sizing: border-box;"> |
|||
窖号：{{data.serialNumber}} |
|||
</view> |
|||
<view style="font-size: 12px;color: white;line-height: 7vw;height: 7vw;color: #fff;"> |
|||
{{data.time}} |
|||
</view> |
|||
</view> |
|||
|
|||
</view> |
|||
<view |
|||
style="display: flex;flex-direction: row;justify-content: center; |
|||
background-color: #fff;height: 25vw; border-top-left-radius: 25px;border-top-right-radius: 25px;margin-top: -9.06vw;"> |
|||
|
|||
|
|||
<image src="https://supervise.yxtsoft.com/lpk/image/detail_enterprise.png" mode="aspectFit" |
|||
style="margin-left: 20px;margin-right: 20px; width: 80vw;height: 25vw;"></image> |
|||
|
|||
<view style="width: 55%; margin-left: 20vw; |
|||
display: flex;flex-direction: row;margin-top:9vw;position: absolute;z-index: 10;align-items: center; |
|||
justify-content: space-between;"> |
|||
<text style="color: #fff;font-size: 18px;font-weight: 600;">{{data.pname}}</text> |
|||
|
|||
<text style="background: #F1F2F3 ; border-radius: 25px;color: #ccc;padding: 3px 10px;">转赠亲友</text> |
|||
</view> |
|||
|
|||
</view> |
|||
<loading-state ref="pageView" @request="request"> |
|||
|
|||
<view style="background-color: #fff;padding: 10px 15px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<view style="background: #FF9D33; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<view style="background: #FFDAB2; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<text style="margin-left: 8px;font-size: 14px;color: #333;">商品明细</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view v-for="(item,index) in data.goodsVos" :key="index" @click="itemClick(item.goodsSid)" |
|||
style="display: flex;flex-direction: row;background-color: #fff;padding-left: 10px;padding-right: 10px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;background-color: #fff;padding: 10px 15px; |
|||
border-bottom: 1px #F1F2F3 solid; width: 100%; "> |
|||
<image :src="item.pic" style="width: 60px;height: 60px;flex-shrink: 0;"></image> |
|||
<view style="margin-left: 10px;margin-right: 10px;flex: 1;"> |
|||
<text class="text" style="font-weight: 500;">{{item.goods}} |
|||
</text> |
|||
<view style="font-size: 12px;color: #666666;margin-top: 5px;">{{item.remarks}}</view> |
|||
<view style="display: flex;flex-direction: row;justify-content: space-between;margin-top: 5px;"> |
|||
<text |
|||
style="font-size: 12px;color: #666666;margin-right: 10px;">总数：{{item.num}}{{item.unitName}} |
|||
</text> |
|||
<view style="font-size: 12px;color: #666666;">窖内剩余：{{item.lnum}}{{item.unitName}}</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
|
|||
<view style="background-color: #fff;margin-top: 10px;padding: 10px 15px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<view style="background: #FF9D33; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<view style="background: #FFDAB2; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<text style="margin-left: 8px;font-size: 14px;color: #333;">预约记录</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view style="margin-bottom: 10px;"> |
|||
<view v-for="(item,index) in data.orderCardVoList" :key="index" |
|||
style="display: flex;flex-direction: row;background-color: #fff;padding-left: 10px;padding-right: 10px;"> |
|||
|
|||
<view style="display: flex;flex-direction: column;background-color: #fff; |
|||
border-bottom: 1px #F1F2F3 solid; width: 100%;padding-left: 20px;padding-bottom: 10px;"> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 10px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/date.png" |
|||
style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text |
|||
style="margin-left: 5px;font-size: 12px; color: #999;">提货时间：{{item.reserveDate}}</text> |
|||
</view> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/location.png" |
|||
style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text style="margin-left: 5px;font-size: 12px; color: #999;">提货地点：{{item.store}}</text> |
|||
</view> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/user2.png" mode="aspectFill" |
|||
style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text |
|||
style="margin-left: 5px;font-size: 12px; color: #999;">提 货 人：{{item.userName}}</text> |
|||
</view> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/phone2.png" mode="aspectFill" |
|||
style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text style="margin-left: 5px;font-size: 12px; color: #999;">联系电话：{{item.userPhone}}</text> |
|||
</view> |
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 8px;"> |
|||
<text style="color: #999; font-size: 12px;">- {{item.goods}}</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view style="background-color: #fff;margin-top: 10px;padding: 10px 15px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<view style="background: #FF9D33; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<view style="background: #FFDAB2; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<text style="margin-left: 8px;font-size: 14px;color: #333;">转赠记录</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view style="margin-bottom: 50px;"> |
|||
<view v-for="(item,index) in data.empCardGiftVos" :key="index" |
|||
style="display: flex;flex-direction: row;background-color: #fff;padding-left: 10px;padding-right: 10px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;background-color: #fff; |
|||
border-bottom: 1px #F1F2F3 solid; width: 100%;padding-left: 10px; padding-right: 10px; padding-bottom: 10px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;width: 100%;margin-top: 15px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/home_affection.png" |
|||
style="width: 50px;height: 50px;margin-right: 10px;flex-shrink: 0;"></image> |
|||
|
|||
<view style="display: flex;flex-direction: column;width: 100%;"> |
|||
|
|||
<text |
|||
style="font-size: 12px; color: #333;margin-top: 5px;">亲情窖序号：{{item.serialNumber}}</text> |
|||
<text |
|||
style="font-size: 12px; color: #333;margin-top: 5px;">分享时间：{{item.createTime}}</text> |
|||
<text style="font-size: 12px; color: #333;margin-top: 5px;">亲情窖编码：{{item.code}}</text> |
|||
<text style="font-size: 12px; color: #333;margin-top: 5px;">提货密码：{{item.codeKey}}</text> |
|||
<text style="font-size: 12px; color: #333;margin-top: 5px;">备注说明：{{item.remarks}}</text> |
|||
|
|||
<view |
|||
style="display: flex;flex-direction: row;margin-top: 5px;align-items: center;justify-content: space-between;width: 100%;"> |
|||
<text style="flex: 1;font-size: 12px; color: #A5A5A5; margin-right: 10px;">- |
|||
{{item.goods}}</text> |
|||
|
|||
<button v-show="item.isShare=='1'" class='sharebtn' :data-info="item" |
|||
open-type="share">分享窖</button> |
|||
<button v-show="item.isShare=='2'" class='sharebtn2' :data-info="item" |
|||
open-type="share">已分享</button> |
|||
<button v-show="item.isShare=='3'" class='sharebtn3'>转赠成功</button> |
|||
</view> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
<view style="height: 50px;"></view> |
|||
|
|||
</loading-state> |
|||
|
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
page: { |
|||
sid: '', |
|||
startHeight: 0, |
|||
endHeight: 0 |
|||
}, |
|||
data: { |
|||
time: "", |
|||
name: "", |
|||
pname: "", |
|||
state: "", |
|||
notRese: false, |
|||
showBtn: false, |
|||
showRecord: false, |
|||
goodsVos: [], |
|||
value: "", |
|||
userName: "", |
|||
userPhone: "", |
|||
} |
|||
} |
|||
}, |
|||
onLoad(options) { |
|||
this.page.sid = options.sid |
|||
this.request() |
|||
this.$bus.$on('order', msg => { |
|||
this.$nextTick(() => { |
|||
this.$refs.pageView.setLoadState(0) |
|||
}) |
|||
this.request(); |
|||
}) |
|||
|
|||
let info = uni.getSystemInfoSync(); |
|||
|
|||
this.page.startHeight = info.windowWidth * 0.6 |
|||
this.page.endHeight = info.windowWidth * 0.8 |
|||
}, |
|||
onUnload() { |
|||
uni.$off('order'); |
|||
}, |
|||
onPageScroll(res) { |
|||
// 渐变 |
|||
this.$refs.nav.defaultColorBgAlpha(res) |
|||
}, |
|||
methods: { |
|||
|
|||
request() { |
|||
let _this = this |
|||
_this.$api.empCardDetail(this.page.sid).then((resp) => { |
|||
_this.data = resp |
|||
_this.$nextTick(() => { |
|||
_this.$refs.pageView.setLoadState(2) |
|||
}) |
|||
}).catch(e => { |
|||
_this.$nextTick(() => { |
|||
_this.$refs.pageView.setLoadState(1) |
|||
}) |
|||
}) |
|||
}, |
|||
itemClick(goodsSid) { |
|||
uni.navigateTo({ |
|||
url: '/pages/good/goodsDetail?sid=' + goodsSid |
|||
}) |
|||
}, |
|||
tapName(event) { |
|||
console.log("event", event) |
|||
}, |
|||
onShareAppMessage: function(res) { |
|||
console.log("res", res) |
|||
console.log("data", res.target.dataset) |
|||
var data = res.target.dataset.info |
|||
this.shareCard(data.sid) |
|||
// ① |
|||
let shareData = JSON.stringify({ |
|||
params: { |
|||
code: data.code, |
|||
codeKey: data.codeKey, |
|||
customerSid: '' |
|||
}, |
|||
functionName: 'bindCard', |
|||
url: '/pages/detail/detail_affeection?sid=' + data.sid |
|||
|
|||
// url:'/pages/bind/bind_pickUpCard?code=' + + &codeKey=' + data.codeKey, |
|||
// FunctionName:'share! |
|||
}) |
|||
// 转码传输 |
|||
let value = encodeURIComponent(shareData) |
|||
|
|||
return { |
|||
title: '汇融农链-云菜窖', |
|||
// ② |
|||
path: '/pages/login/login?data=' + value, |
|||
imageUrl: 'https://supervise.yxtsoft.com/lpk/image/shareAffeection.png', //自定义图片路径，显示图片长宽比是 5:4。 |
|||
success: function(res) { |
|||
console.log('aaaa', "分享成功") |
|||
}, |
|||
fail: function(res) { |
|||
// 转发失败 |
|||
console.log('aaaa', "用户点击了取消") |
|||
} |
|||
} |
|||
}, |
|||
|
|||
shareCard(sid) { |
|||
let _this = this |
|||
|
|||
_this.$api.shareEmpCard(sid).then((resp) => { |
|||
|
|||
var item = _this.data.empCardGiftVos.find(item => item.sid === sid) |
|||
|
|||
console.log("item", item); |
|||
|
|||
item.share = '2' |
|||
|
|||
}).catch(e => {}) |
|||
} |
|||
|
|||
|
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
.sharebtn { |
|||
background: #FF4727; |
|||
font-size: 12px; |
|||
color: #fff; |
|||
width: 30vw; |
|||
border-radius: 20px; |
|||
} |
|||
|
|||
|
|||
.sharebtn::after { |
|||
border: none; |
|||
} |
|||
|
|||
.sharebtn2 { |
|||
background: #FF7165; |
|||
width: 30vw; |
|||
font-size: 12px; |
|||
color: #fff; |
|||
border-radius: 20px; |
|||
} |
|||
|
|||
.sharebtn2::after { |
|||
border: none; |
|||
} |
|||
|
|||
.sharebtn3 { |
|||
background: #CFCFCF; |
|||
width: 30vw; |
|||
font-size: 12px; |
|||
color: #fff; |
|||
border-radius: 20px; |
|||
} |
|||
|
|||
.sharebtn3::after { |
|||
border: none; |
|||
} |
|||
|
|||
.top { |
|||
width: 100vw; |
|||
/* height: 126.66vw; */ |
|||
height: 65vw; |
|||
/* 加载背景图 */ |
|||
background-image: url(https://supervise.yxtsoft.com/lpk/image/detail_bj4.png); |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
background-size: 100% 100%; |
|||
} |
|||
|
|||
.text { |
|||
white-space: normal; |
|||
text-overflow: -o-ellipsis-lastline; |
|||
overflow: hidden; |
|||
text-overflow: ellipsis; |
|||
display: -webkit-box; |
|||
-webkit-line-clamp: 2; |
|||
line-clamp: 2; |
|||
-webkit-box-orient: vertical; |
|||
} |
|||
|
|||
uni-page-body, |
|||
page { |
|||
background: #F1F2F3; |
|||
} |
|||
|
|||
.btn { |
|||
border: 1px solid; |
|||
padding-left: 30rpx; |
|||
padding-right: 30rpx; |
|||
padding-top: 12rpx; |
|||
padding-bottom: 12rpx; |
|||
border-radius: 50rpx; |
|||
height: 15px; |
|||
margin-left: 25rpx; |
|||
font-size: 26rpx; |
|||
} |
|||
|
|||
/* 弹窗样式 */ |
|||
.model { |
|||
position: absolute; |
|||
width: 100%; |
|||
height: 100%; |
|||
background: #000; |
|||
z-index: 999; |
|||
opacity: 0.5; |
|||
top: 0; |
|||
left: 0; |
|||
} |
|||
|
|||
.modalDlg { |
|||
/* 设置超出滚动 */ |
|||
overflow: auto; |
|||
width: 90%; |
|||
position: fixed; |
|||
top: 50vw; |
|||
left: 0; |
|||
right: 0; |
|||
bottom: 0; |
|||
z-index: 9999; |
|||
margin: 0 auto; |
|||
padding: 35rpx; |
|||
background-color: #fff; |
|||
border-radius: 20rpx; |
|||
display: flex; |
|||
flex-direction: column; |
|||
|
|||
} |
|||
|
|||
.windowRow { |
|||
display: flex; |
|||
flex-direction: row; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
padding-bottom: 15rpx; |
|||
width: 100%; |
|||
} |
|||
|
|||
.userTitle { |
|||
font-size: 42rpx; |
|||
} |
|||
|
|||
.back { |
|||
text-align: center; |
|||
color: #f0a500; |
|||
font-size: 30rpx; |
|||
} |
|||
|
|||
.wishName { |
|||
width: 100%; |
|||
justify-content: center; |
|||
flex-direction: row; |
|||
display: flex; |
|||
margin: 40rpx 0rpx; |
|||
} |
|||
|
|||
.wish_put { |
|||
width: 100%; |
|||
border: #ededef 1rpx solid; |
|||
background-color: #f6f7fb; |
|||
border-radius: 12rpx; |
|||
padding: 30rpx 20rpx; |
|||
margin: 20rpx 0rpx; |
|||
} |
|||
|
|||
.holder_cls { |
|||
color: #909399; |
|||
} |
|||
|
|||
.wishbnt { |
|||
background-color: #fec600; |
|||
text-align: center; |
|||
border-radius: 50rpx; |
|||
padding: 25rpx; |
|||
color: white; |
|||
} |
|||
|
|||
/*弹窗样式结束*/ |
|||
|
|||
/* 下面的姓名样式，不要也没什么影响 */ |
|||
.jiantou { |
|||
width: 35rpx; |
|||
height: 35rpx; |
|||
margin-left: 10rpx; |
|||
} |
|||
|
|||
.fenge { |
|||
margin-bottom: 30rpx; |
|||
} |
|||
|
|||
.xian { |
|||
border-bottom: #e5e5e5 1rpx solid; |
|||
} |
|||
|
|||
.yellow { |
|||
color: #f0a500; |
|||
font-weight: 700; |
|||
} |
|||
|
|||
.box { |
|||
background-color: white; |
|||
padding: 0rpx 25rpx; |
|||
display: flex; |
|||
flex-direction: column; |
|||
} |
|||
|
|||
.row { |
|||
height: 120rpx; |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
} |
|||
|
|||
.you { |
|||
height: 100%; |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
} |
|||
|
|||
.zhushi { |
|||
font-size: 28rpx; |
|||
color: #808080; |
|||
} |
|||
|
|||
/* 下面的姓名样式结束 */ |
|||
</style> |
|||
@ -0,0 +1,757 @@ |
|||
<template> |
|||
|
|||
<view style="display: flex;flex-direction: column;" id="page"> |
|||
|
|||
<view class="top"> |
|||
<NavBar ref="nav" navTitle="详情" :showIcon="true" :start-change-height="page.startHeight" |
|||
:end-change-height="page.endHeight"> |
|||
</NavBar> |
|||
<view style="display: flex;flex-direction: column;margin-top: 25vw; margin-left: 5vw;"> |
|||
<view style="font-size: 17px;color: #fff;height: 8vw;line-height: 8vw;margin-top: 5vw;"> |
|||
{{data.state}} |
|||
</view> |
|||
<view |
|||
style="font-size: 12px;color: white;line-height: 7vw;height: 7vw;color: #fff;box-sizing: border-box;"> |
|||
窖号：{{data.serialNumber}} |
|||
</view> |
|||
<view style="font-size: 12px;color: white;line-height: 7vw;height: 7vw;color: #fff;"> |
|||
{{data.time}} |
|||
</view> |
|||
</view> |
|||
|
|||
</view> |
|||
<view |
|||
style="display: flex;flex-direction: row;justify-content: center; |
|||
background-color: #fff;height: 25vw; border-top-left-radius: 25px;border-top-right-radius: 25px;margin-top: -9.06vw;"> |
|||
|
|||
<image src="https://supervise.yxtsoft.com/lpk/image/detail_family.png" mode="aspectFit" |
|||
style="margin-left: 20px;margin-right: 20px; width: 80vw;height: 25vw;"></image> |
|||
|
|||
<view style="width: 55%; margin-left: 20vw; |
|||
display: flex;flex-direction: row;margin-top: 9vw;position: absolute;z-index: 10;align-items: center; |
|||
justify-content: space-between;"> |
|||
<text style="color: #fff;font-size: 18px;font-weight: 600;">{{data.pname}}</text> |
|||
|
|||
<text v-if="data.notRese" |
|||
style="background: #fff ; border-radius: 25px;color: #FF7201;padding: 3px 10px;" |
|||
@click="showDialog2">转赠亲友</text> |
|||
|
|||
<text v-if="!data.notRese" |
|||
style="background: #F1F2F3 ; border-radius: 25px;color: #ccc;padding: 3px 10px;">转赠亲友</text> |
|||
</view> |
|||
|
|||
</view> |
|||
<loading-state ref="pageView" @request="request"> |
|||
|
|||
<view style="background-color: #fff;margin-top: 10px;padding: 10px 15px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<view style="background: #FF9D33; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<view style="background: #FFDAB2; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<text style="margin-left: 8px;font-size: 14px;color: #333;">商品明细</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view v-for="(item,index) in data.goodsVos" :key="index" @click="itemClick(item.goodsSid)" |
|||
style="display: flex;flex-direction: row;background-color: #fff;padding-left: 10px;padding-right: 10px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;background-color: #fff;padding: 10px 15px; |
|||
border-bottom: 1px #F1F2F3 solid; width: 100%;"> |
|||
<image :src="item.pic" style="width: 60px;height: 60px;flex-shrink: 0;"></image> |
|||
<view style="margin-left: 10px;margin-right: 10px;flex: 1;"> |
|||
<text class="text" style="font-weight: 500;">{{item.goods}} |
|||
</text> |
|||
<view style="font-size: 12px;color: #666666;margin-top: 5px;">{{item.remarks}}</view> |
|||
<view style="display: flex;flex-direction: row;justify-content: space-between;margin-top: 5px;"> |
|||
<text |
|||
style="font-size: 12px;color: #666666;margin-right: 10px;">总数：{{item.num}}{{item.unitName}} |
|||
</text> |
|||
<view style="font-size: 12px;color: #666666;">可预约：{{item.lnum}}{{item.unitName}}</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
|
|||
<view style="background-color: #fff;margin-top: 10px;padding: 10px 15px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<view style="background: #FF9D33; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<view style="background: #FFDAB2; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<text style="margin-left: 8px;font-size: 14px;color: #333;">预约记录</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view style="margin-bottom: 10px;"> |
|||
<view v-for="(item,index) in data.orderCardVoList" :key="index" |
|||
style="display: flex;flex-direction: row;background-color: #fff;padding-left: 10px;padding-right: 10px;"> |
|||
|
|||
<view style="display: flex;flex-direction: column;background-color: #fff; |
|||
border-bottom: 1px #F1F2F3 solid; width: 100%;padding-left: 20px;padding-bottom: 10px;"> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 10px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/date.png" |
|||
style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text |
|||
style="margin-left: 5px;font-size: 12px; color: #999;">提货时间：{{item.reserveDate}}</text> |
|||
</view> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/location.png" |
|||
style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text style="margin-left: 5px;font-size: 12px; color: #999;">提货地点：{{item.store}}</text> |
|||
</view> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/user2.png" mode="aspectFill" |
|||
style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text |
|||
style="margin-left: 5px;font-size: 12px; color: #999;">提 货 人：{{item.userName}}</text> |
|||
</view> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/phone2.png" mode="aspectFill" |
|||
style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text style="margin-left: 5px;font-size: 12px; color: #999;">联系电话：{{item.userPhone}}</text> |
|||
</view> |
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 8px;"> |
|||
<text style="color: #999; font-size: 12px;">- {{item.goods}}</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view style="background-color: #fff;margin-top: 10px;padding: 10px 15px;" id='the-id'> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<view style="background: #FF9D33; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<view style="background: #FFDAB2; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<text style="margin-left: 8px;font-size: 14px;color: #333;">转赠记录</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view style="margin-bottom: 50px;"> |
|||
|
|||
<view v-for="(item,index) in data.empCardGifts" :key="index" |
|||
style="display: flex;flex-direction: row;background-color: #fff;padding-left: 10px;padding-right: 10px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;background-color: #fff; |
|||
border-bottom: 1px #F1F2F3 solid; width: 100%;padding-left: 10px; padding-right: 10px; padding-bottom: 10px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;width: 100%;margin-top: 15px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/home_affection.png" |
|||
style="width: 50px;height: 50px;margin-right: 10px;flex-shrink: 0;"></image> |
|||
|
|||
<view style="display: flex;flex-direction: column;width: 100%;"> |
|||
|
|||
<text |
|||
style="font-size: 12px; color: #333;margin-top: 5px;">亲情窖序号：{{item.serialNumber}}</text> |
|||
<text |
|||
style="font-size: 12px; color: #333;margin-top: 5px;">分享时间：{{item.createTime}}</text> |
|||
<text style="font-size: 12px; color: #333;margin-top: 5px;">亲情窖编码：{{item.code}}</text> |
|||
<text style="font-size: 12px; color: #333;margin-top: 5px;">提货密码：{{item.codeKey}}</text> |
|||
<text style="font-size: 12px; color: #333;margin-top: 5px;">备注说明：{{item.remarks}}</text> |
|||
|
|||
<view |
|||
style="display: flex;flex-direction: row;margin-top: 5px;align-items: center;justify-content: space-between;width: 100%;"> |
|||
<text style="flex: 1;font-size: 12px; color: #A5A5A5; margin-right: 10px;">- |
|||
{{item.goods}}</text> |
|||
|
|||
<button v-show="item.isShare=='1'" class='sharebtn' :data-info="item" |
|||
open-type="share">分享窖</button> |
|||
<button v-show="item.isShare=='2'" class='sharebtn2' :data-info="item" |
|||
open-type="share">已分享</button> |
|||
<button v-show="item.isShare=='3'" class='sharebtn3'>转赠成功</button> |
|||
|
|||
|
|||
</view> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view style="height: 50px;"></view> |
|||
|
|||
<view v-if="data.notRese" style="width: 100%; background-color: #fff;height: 15vw;position: fixed;bottom: 0;overflow:hidden; |
|||
display: flex;flex-direction: row;"> |
|||
<!-- <text |
|||
style="flex: 1;color: #B3B3B3; padding: 10px 20px; display:margin：auto;text-align: center;line-height: 10vw;"> |
|||
可选择就近网点进行预约提货 > |
|||
</text> --> |
|||
<view style="flex: 1;"></view> |
|||
<text style=" width: 20vw;font-size: 16px;color: #fff; background-color: #FF9D33; |
|||
padding: 10px 20px; display:margin：auto;text-align: center;line-height: 10vw;" @click="showDialog">预约提货</text> |
|||
|
|||
|
|||
</view> |
|||
|
|||
|
|||
</loading-state> |
|||
|
|||
|
|||
<!-- 弹窗蒙版 --> |
|||
<view class="model" catchtouchmove='preventTouchMove' v-if='showModal' @click.stop="colseDialog()"></view> |
|||
<view class="modalDlg" catchtouchmove='preventTouchMove' v-if='showModal'> |
|||
<scroll-view scroll-y="true" style="height: 100%;width: 100%; padding: 20px; " bindscrolltoupper="upper" |
|||
bindscrolltolower="lower" bindscroll="scroll"> |
|||
|
|||
<view style="display: flex;flex-direction: column;margin-top: 10px;"> |
|||
<text>提货地点</text> |
|||
<view |
|||
style="margin-top: 10px;background:#F5F5F5 ; display: flex;flex-direction: row;justify-content: space-between;width: 89.5%;border-radius: 4px;min-height: 35px;align-items: center;" |
|||
@click="address"> |
|||
<view v-if="stringIsEmpty(data.addressName)" |
|||
style="color: #666;font-size: 12px;margin-left: 10px;"> |
|||
请选择提货点</view> |
|||
<view v-if="stringIsNotEmpty(data.addressName)" |
|||
style="color: #666;font-size: 12px;margin-left: 10px;">{{data.addressName}}</view> |
|||
<uni-icons type="bottom" size="14" color="#999" style="flex-direction: 0;margin: 0px 5px;" /> |
|||
</view> |
|||
</view> |
|||
|
|||
<view style="display: flex;flex-direction: column;margin-top: 10px;"> |
|||
<text>提货时间</text> |
|||
<view style="display: flex;align-items: center;margin-top: 6px;width: 89.5%;"> |
|||
<uni-datetime-picker type="date" v-model="data.reserveDate" style="flex: 1;background: #F8F8F8;" |
|||
:start="data.start" :end="data.end" :disabledDate="disabledDate" /> |
|||
</view> |
|||
</view> |
|||
|
|||
<view style="display: flex;flex-direction: column;margin-top: 10px;"> |
|||
<text>提货人</text> |
|||
<view style="display: flex;align-items: center;margin-top: 6px;width: 89.5%;"> |
|||
<input placeholder="请输入提货人" |
|||
style="font-size: 30rpx;flex: 1;background: #F8F8F8;border-radius: 5px;height: 40px;line-height: 40px;padding-left: 10px;" |
|||
:value="data.userName" @input="onKeyInput1" /> |
|||
</view> |
|||
</view> |
|||
|
|||
<view style="display: flex;flex-direction: column;margin-top: 10px;"> |
|||
<text>联系电话</text> |
|||
<view style="display: flex;align-items: center;margin-top: 6px;width: 89.5%;"> |
|||
<input maxlength="11" placeholder="请输入联系电话" |
|||
style="font-size: 30rpx;flex: 1;background: #F8F8F8;border-radius: 5px;height: 40px;line-height: 40px;padding-left: 10px;" |
|||
type="number" :value="data.userPhone" @input="onKeyInput2" /> |
|||
</view> |
|||
</view> |
|||
|
|||
<view style="background: #F5F5F5; border-radius: 5px;margin-top: 15px;width: 89.5%;"> |
|||
<view v-for="(item,index) in data.goodsVos" |
|||
style="display: flex;flex-direction: row;margin-top: 15px; margin-bottom: 10px;"> |
|||
<view style="margin-left: 10px;margin-right: 10px;flex: 1; |
|||
display: flex;flex-direction: column;justify-content: space-between;align-items: flex-end; |
|||
padding: 10px;"> |
|||
<text class="text" style="font-weight: 500;width: 100%;font-size: 14px;">{{item.goods}} |
|||
</text> |
|||
<text class="text" |
|||
style="font-weight: 500;width: 100%;color: #919191; font-size: 12px;">剩余：{{item.lnum}}{{item.unitName}} |
|||
</text> |
|||
<uni-number-box ref="box" style="margin-top: -30px;" :showTextView="true" :min="0" |
|||
:max="item.lnum" v-model="item.select"></uni-number-box> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view |
|||
style="display: flex;flex-direction: row;align-items: center;justify-content: center;margin-top: 100px;width: 100%;"> |
|||
|
|||
<text |
|||
style="border-radius:30px; font-size: 14px;color: #666;background-color: #F5F5F5; padding: 5px 30px;margin-right: 20px;" |
|||
@click.stop="colseDialog()">取消</text> |
|||
<text |
|||
style="border-radius: 30px; font-size: 14px;color: #fff; background-color: #FF9D33; padding: 5px 30px;margin-left: 20px;" |
|||
@click="save">确认</text> |
|||
|
|||
</view> |
|||
|
|||
<view style="height: 50px;"> |
|||
|
|||
</view> |
|||
|
|||
</scroll-view> |
|||
</view> |
|||
|
|||
|
|||
<!-- 弹窗蒙版 --> |
|||
<view class="model" catchtouchmove='preventTouchMove' v-if='showModal2' @click.stop="colseDialog2()"></view> |
|||
<view class="modalDlg" catchtouchmove='preventTouchMove' v-if='showModal2'> |
|||
<scroll-view scroll-y="true" style="height: 100%; width: 100%; box-sizing: border-box; |
|||
" bindscrolltoupper="upper" bindscrolltolower="lower" bindscroll="scroll"> |
|||
|
|||
<view style="display: flex;flex-direction: column;margin: 20px;"> |
|||
<text>菜窖数量</text> |
|||
<view style="display: flex;align-items: center;margin-top: 6px;"> |
|||
<input placeholder="请输入菜窖数量" |
|||
style="font-size: 30rpx;flex: 1;background: #F8F8F8;border-radius: 5px;height: 40px;line-height: 40px;padding-left: 10px;padding-right: 10px;" |
|||
type="number" :value="info.count" @input="onKeyInput3" /> |
|||
</view> |
|||
</view> |
|||
<view style="display: flex;flex-direction: column;margin: 20px;"> |
|||
<text>商品列表</text> |
|||
<view style="background: #F5F5F5; border-radius: 5px;margin-top: 6px;"> |
|||
<view v-for="(item,index) in data.goodsVos" |
|||
style="display: flex;flex-direction: row;margin-top: 15px; margin-bottom: 10px;"> |
|||
<view style="margin-left: 10px;margin-right: 10px;flex: 1; |
|||
display: flex;flex-direction: column;justify-content: space-between;align-items: flex-end; |
|||
padding: 10px;"> |
|||
<text class="text" style="font-weight: 500;width: 100%;font-size: 14px;">{{item.goods}} |
|||
</text> |
|||
<text class="text" |
|||
style="font-weight: 500;width: 100%;color: #919191; font-size: 12px;">剩余：{{item.lnum}}{{item.unitName}} |
|||
</text> |
|||
<uni-number-box ref="box" style="margin-top: -30px;" :showTextView="true" :min="0" |
|||
:max="item.lnum" v-model="item.select"></uni-number-box> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<view style="display: flex;flex-direction: column;margin: 20px;"> |
|||
<text>备注说明</text> |
|||
<view style="display: flex;align-items: center;margin-top: 6px;"> |
|||
<input placeholder="请输入" |
|||
style="font-size: 30rpx;flex: 1;background: #F8F8F8;border-radius: 5px;height: 40px;line-height: 40px;padding-left: 10px;padding-right: 10px;" |
|||
:value="info.remarks" @input="onKeyInput4" /> |
|||
<!-- <textarea placeholder="请输入" :disable-default-padding='true' :fixed="true" style="font-size: 30rpx;flex: 1;background: #F8F8F8;border-radius: 5px; |
|||
line-height: 20px;padding: 10px; |
|||
white-space: pre-wrap; |
|||
height: auto;min-height: 30px; |
|||
word-wrap: break-word;" :value="info.remarks" @input="onKeyInput2" /> --> |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
<view |
|||
style="display: flex;flex-direction: row;align-items: center;justify-content: center;margin-top: 100px;width: 100%;"> |
|||
|
|||
<text |
|||
style="border-radius:30px; font-size: 14px;color: #666;background-color: #F5F5F5; padding: 5px 30px;margin-right: 20px;" |
|||
@click.stop="colseDialog2()">取消</text> |
|||
<text |
|||
style="border-radius: 30px; font-size: 14px;color: #fff; background-color: #FF9D33; padding: 5px 30px;margin-left: 20px;" |
|||
@click="save2()">确认</text> |
|||
|
|||
</view> |
|||
<view style="height: 50px;"> |
|||
|
|||
</view> |
|||
|
|||
</scroll-view> |
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
//引入bus |
|||
import bus from '@/common/bus'; |
|||
export default { |
|||
data() { |
|||
return { |
|||
showModal: false, |
|||
showModal2: false, |
|||
page: { |
|||
sid: '', |
|||
startHeight: 0, |
|||
endHeight: 0 |
|||
}, |
|||
data: { |
|||
time: "", |
|||
name: "", |
|||
pname: "", |
|||
state: "", |
|||
notRese: false, |
|||
showBtn: false, |
|||
showRecord: false, |
|||
goodsVos: [], |
|||
value: "", |
|||
userName: "", |
|||
userPhone: "", |
|||
}, |
|||
disabledDate: [ |
|||
// '2023-12-16' |
|||
], |
|||
info: { |
|||
count: "1", |
|||
empCardSid: "", |
|||
remarks: "", |
|||
goodsVoList: [] |
|||
}, |
|||
} |
|||
}, |
|||
mounted() { |
|||
this.$bus.$on('order', msg => { |
|||
this.request(); |
|||
this.$nextTick(() => { |
|||
|
|||
this.$refs.pageView.setLoadState(0) |
|||
|
|||
}) |
|||
|
|||
}) |
|||
|
|||
uni.$on("address", (e) => { |
|||
// 相当与下拉刷新 |
|||
this.data.value = e.sid; |
|||
this.data.addressName = e.name; |
|||
}) |
|||
}, |
|||
onLoad(options) { |
|||
this.page.sid = options.sid |
|||
this.request() |
|||
|
|||
let info = uni.getSystemInfoSync(); |
|||
|
|||
this.page.startHeight = info.windowWidth * 0.6 |
|||
this.page.endHeight = info.windowWidth * 0.8 |
|||
}, |
|||
onUnload() { |
|||
uni.$off('order'); |
|||
uni.$off('address'); |
|||
}, |
|||
onPageScroll(res) { |
|||
// 渐变 |
|||
this.$refs.nav.defaultColorBgAlpha(res) |
|||
}, |
|||
methods: { |
|||
showDialog() { |
|||
this.showModal = true |
|||
}, |
|||
showDialog2() { |
|||
this.showModal2 = true |
|||
|
|||
}, |
|||
colseDialog() { |
|||
this.showModal = false |
|||
}, |
|||
colseDialog2() { |
|||
this.showModal2 = false |
|||
}, |
|||
address() { |
|||
uni.navigateTo({ |
|||
url: '/pages/SelectAddressActivity' |
|||
}) |
|||
}, |
|||
onKeyInput1: function(event) { |
|||
this.data.userName = event.target.value |
|||
}, |
|||
onKeyInput2: function(event) { |
|||
this.data.userPhone = event.target.value |
|||
}, |
|||
onKeyInput3: function(event) { |
|||
this.info.count = event.target.value |
|||
|
|||
}, |
|||
onKeyInput4: function(event) { |
|||
this.info.remarks = event.target.value |
|||
}, |
|||
save() { |
|||
if (this.stringIsEmpty(this.data.value)) { |
|||
this.shortToast('请选择提货地点') |
|||
return |
|||
} |
|||
if (this.stringIsEmpty(this.data.reserveDate)) { |
|||
this.shortToast('请选择提货时间') |
|||
return |
|||
} |
|||
if (this.stringIsEmpty(this.data.userName)) { |
|||
this.shortToast('请输入提货人员') |
|||
return |
|||
} |
|||
if (this.stringIsEmpty(this.data.userPhone)) { |
|||
this.shortToast('请输入手机号码') |
|||
return |
|||
} |
|||
if (this.data.userPhone.length != 11) { |
|||
this.shortToast('手机号码格式不对') |
|||
return |
|||
} |
|||
|
|||
|
|||
let num = 0; |
|||
for (var i = 0; i < this.data.goodsVos.length; i++) { |
|||
num += Number(this.data.goodsVos[i].select); |
|||
} |
|||
if (num == 0) { |
|||
this.shortToast('您未选择任何商品') |
|||
return |
|||
} |
|||
|
|||
let _this = this |
|||
_this.$api.cardBookingSave(this.data).then((resp) => { |
|||
bus.$emit('order', "监听回调"); |
|||
// setTimeout(() => { |
|||
// uni.$emit('order', "监听回调") |
|||
// }, 500) |
|||
uni.navigateBack() |
|||
|
|||
|
|||
}).catch(e => { |
|||
_this.shortToast(e.msg) |
|||
}) |
|||
|
|||
}, |
|||
|
|||
save2() { |
|||
this.colseDialog2() |
|||
this.pageScroll() |
|||
let num = 0; |
|||
for (var i = 0; i < this.data.goodsVos.length; i++) { |
|||
num += Number(this.data.goodsVos[i].select); |
|||
} |
|||
if (num == 0) { |
|||
this.shortToast('您未选择任何商品') |
|||
return |
|||
} |
|||
|
|||
let _this = this |
|||
|
|||
this.info.empCardSid = this.page.sid, |
|||
this.info.goodsVoList = this.data.goodsVos, |
|||
|
|||
console.log("info>>", this.info); |
|||
_this.$api.generateEmpCard(this.info).then((resp) => { |
|||
bus.$emit('order', "监听回调"); |
|||
// uni.navigateBack() |
|||
|
|||
|
|||
}).catch(e => { |
|||
_this.shortToast(e.msg) |
|||
}) |
|||
|
|||
}, |
|||
pageScroll() { |
|||
|
|||
//获取容器高度，使页面滚动到容器底部 #xxx就是view的id名 |
|||
wx.createSelectorQuery().select('#page').boundingClientRect(function(rect) { |
|||
console.log('rect', rect); |
|||
console.log('rectheight', rect.height); |
|||
/* 将页面移动到最底部（用xxx的height定位） */ |
|||
wx.pageScrollTo({ |
|||
scrollTop: rect.height |
|||
}) |
|||
}).exec() |
|||
|
|||
}, |
|||
|
|||
request() { |
|||
let _this = this |
|||
_this.$api.cardDetail(this.page.sid).then((resp) => { |
|||
_this.data = resp |
|||
_this.$nextTick(() => { |
|||
|
|||
_this.$refs.pageView.setLoadState(2) |
|||
}) |
|||
_this.getSun() |
|||
|
|||
}).catch(e => { |
|||
_this.$nextTick(() => { |
|||
_this.$refs.pageView.setLoadState(1) |
|||
}) |
|||
}) |
|||
}, |
|||
|
|||
getSun() { |
|||
let _this = this |
|||
_this.$api.isSaturAndSun(this.page.sid).then((resp) => { |
|||
|
|||
// console.log("aaa",resp) |
|||
|
|||
this.disabledDate = resp |
|||
|
|||
}).catch(e => { |
|||
|
|||
}) |
|||
}, |
|||
|
|||
showRecord(sid) { |
|||
uni.navigateTo({ |
|||
url: '/pages/card/card_record?sid=' + sid |
|||
}) |
|||
}, |
|||
booking(sid) { |
|||
uni.navigateTo({ |
|||
url: '/pages/card/card_booking?sid=' + sid |
|||
}) |
|||
}, |
|||
itemClick(goodsSid) { |
|||
uni.navigateTo({ |
|||
url: '/pages/good/goodsDetail?sid=' + goodsSid |
|||
}) |
|||
}, |
|||
onShareAppMessage: function(res) { |
|||
console.log("res", res) |
|||
console.log("data", res.target.dataset) |
|||
var data = res.target.dataset.info |
|||
this.shareCard(data.sid) |
|||
// ① |
|||
let shareData = JSON.stringify({ |
|||
params: { |
|||
code: data.code, |
|||
codeKey: data.codeKey, |
|||
customerSid: '' |
|||
}, |
|||
functionName: 'bindCard', |
|||
url: '/pages/detail/detail_affeection?sid=' + data.sid |
|||
|
|||
// url:'/pages/bind/bind_pickUpCard?code=' + + &codeKey=' + data.codeKey, |
|||
// FunctionName:'share! |
|||
}) |
|||
// 转码传输 |
|||
let value = encodeURIComponent(shareData) |
|||
|
|||
return { |
|||
title: '汇融农链-云菜窖', |
|||
// ② |
|||
path: '/pages/login/login?data=' + value, |
|||
imageUrl: 'https://supervise.yxtsoft.com/lpk/image/shareAffeection.png', //自定义图片路径，显示图片长宽比是 5:4。 |
|||
success: function(res) { |
|||
console.log('aaaa', "分享成功") |
|||
}, |
|||
fail: function(res) { |
|||
// 转发失败 |
|||
console.log('aaaa', "用户点击了取消") |
|||
} |
|||
} |
|||
}, |
|||
|
|||
shareCard(sid) { |
|||
let _this = this |
|||
|
|||
_this.$api.shareEmpCard(sid).then((resp) => { |
|||
|
|||
var item = _this.data.empCardGiftVos.find(item => item.sid === sid) |
|||
|
|||
console.log("item", item); |
|||
|
|||
item.share = '2' |
|||
|
|||
}).catch(e => {}) |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
.canvas-code { |
|||
width: 39vw !important; |
|||
height: 39vw !important; |
|||
} |
|||
|
|||
.sharebtn { |
|||
background: #FF4727; |
|||
font-size: 12px; |
|||
color: #fff; |
|||
width: 30vw; |
|||
border-radius: 20px; |
|||
} |
|||
|
|||
|
|||
.sharebtn::after { |
|||
border: none; |
|||
} |
|||
|
|||
.sharebtn2 { |
|||
background: #FF7165; |
|||
width: 30vw; |
|||
font-size: 12px; |
|||
color: #fff; |
|||
border-radius: 20px; |
|||
} |
|||
|
|||
.sharebtn2::after { |
|||
border: none; |
|||
} |
|||
|
|||
.sharebtn3 { |
|||
background: #CFCFCF; |
|||
width: 30vw; |
|||
font-size: 12px; |
|||
color: #fff; |
|||
border-radius: 20px; |
|||
} |
|||
|
|||
.sharebtn3::after { |
|||
border: none; |
|||
} |
|||
|
|||
.top { |
|||
width: 100vw; |
|||
/* height: 126.66vw; */ |
|||
height: 65vw; |
|||
/* 加载背景图 */ |
|||
background-image: url(https://supervise.yxtsoft.com/lpk/image/detail_bj1.png); |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
background-size: 100% 100%; |
|||
} |
|||
|
|||
.text { |
|||
white-space: normal; |
|||
text-overflow: -o-ellipsis-lastline; |
|||
overflow: hidden; |
|||
text-overflow: ellipsis; |
|||
display: -webkit-box; |
|||
-webkit-line-clamp: 2; |
|||
line-clamp: 2; |
|||
-webkit-box-orient: vertical; |
|||
} |
|||
|
|||
uni-page-body, |
|||
page { |
|||
background: #F1F2F3; |
|||
} |
|||
|
|||
.btn { |
|||
border: 1px solid; |
|||
padding-left: 30rpx; |
|||
padding-right: 30rpx; |
|||
padding-top: 12rpx; |
|||
padding-bottom: 12rpx; |
|||
border-radius: 50rpx; |
|||
height: 15px; |
|||
margin-left: 25rpx; |
|||
font-size: 26rpx; |
|||
} |
|||
|
|||
/* 弹窗样式 */ |
|||
.model { |
|||
position: absolute; |
|||
width: 100%; |
|||
height: 100%; |
|||
background: #000; |
|||
z-index: 999; |
|||
opacity: 0.5; |
|||
top: 0; |
|||
left: 0; |
|||
} |
|||
|
|||
.modalDlg { |
|||
/* 设置超出滚动 */ |
|||
overflow: auto; |
|||
width: 100%; |
|||
position: fixed; |
|||
top: 50vw; |
|||
left: 0; |
|||
right: 0; |
|||
bottom: 0; |
|||
z-index: 9999; |
|||
background-color: #fff; |
|||
border-top-right-radius: 20px; |
|||
border-top-left-radius: 20px; |
|||
display: flex; |
|||
flex-direction: column; |
|||
|
|||
} |
|||
</style> |
|||
@ -0,0 +1,520 @@ |
|||
<template> |
|||
|
|||
<view style="display: flex;flex-direction: column;"> |
|||
|
|||
<view class="top"> |
|||
<NavBar ref="nav" navTitle="详情" :showIcon="true" :start-change-height="page.startHeight" |
|||
:end-change-height="page.endHeight"> |
|||
</NavBar> |
|||
<view style="display: flex;flex-direction: column;margin-top: 25vw; margin-left: 5vw;"> |
|||
<view style="font-size: 17px;color: #fff;height: 8vw;line-height: 8vw;margin-top: 5vw;"> |
|||
{{data.state}} |
|||
</view> |
|||
<view |
|||
style="font-size: 12px;color: white;line-height: 7vw;height: 7vw;color: #fff;box-sizing: border-box;"> |
|||
窖号：{{data.serialNumber}} |
|||
</view> |
|||
<view style="font-size: 12px;color: white;line-height: 7vw;height: 7vw;color: #fff;"> |
|||
{{data.time}} |
|||
</view> |
|||
</view> |
|||
|
|||
</view> |
|||
<view |
|||
style="display: flex;flex-direction: row;justify-content: center; |
|||
background-color: #fff;height: 25vw; border-top-left-radius: 25px;border-top-right-radius: 25px;margin-top: -9.06vw;"> |
|||
|
|||
<image src="https://supervise.yxtsoft.com/lpk/image/detail_family.png" mode="aspectFit" |
|||
style="margin-left: 20px;margin-right: 20px; width: 80vw;height: 25vw;"></image> |
|||
|
|||
<view style="width: 50%; margin-left: 20vw; |
|||
display: flex;flex-direction: row;margin-top: 9vw;position: absolute;z-index: 10;align-items: center; |
|||
justify-content: space-between;"> |
|||
<text style="color: #fff;font-size: 18px;font-weight: 600;">{{data.pname}}</text> |
|||
|
|||
<text style="background: #F1F2F3 ; border-radius: 25px;color: #ccc;padding: 3px 10px;">转赠亲友</text> |
|||
</view> |
|||
|
|||
|
|||
|
|||
</view> |
|||
<loading-state ref="pageView" @request="request"> |
|||
|
|||
<view style="background-color: #fff;margin-top: 10px;padding: 10px 15px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<view style="background: #FF9D33; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<view style="background: #FFDAB2; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<text style="margin-left: 8px;font-size: 14px;color: #333;">商品明细</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view v-for="(item,index) in data.goodsVos" :key="index" @click="itemClick(item.goodsSid)" |
|||
style="display: flex;flex-direction: row;background-color: #fff;padding-left: 10px;padding-right: 10px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;background-color: #fff;padding: 10px 15px; |
|||
border-bottom: 1px #F1F2F3 solid; width: 100%;"> |
|||
<image :src="item.pic" style="width: 60px;height: 60px;flex-shrink: 0;"></image> |
|||
<view style="margin-left: 10px;margin-right: 10px;flex: 1;"> |
|||
<text class="text" style="font-weight: 500;">{{item.goods}} |
|||
</text> |
|||
<view style="font-size: 12px;color: #666666;margin-top: 5px;">{{item.remarks}}</view> |
|||
<view style="display: flex;flex-direction: row;justify-content: space-between;margin-top: 5px;"> |
|||
<text |
|||
style="font-size: 12px;color: #666666;margin-right: 10px;">总数：{{item.num}}{{item.unitName}} |
|||
</text> |
|||
<view style="font-size: 12px;color: #666666;">可预约：{{item.lnum}}{{item.unitName}}</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
|
|||
<view style="background-color: #fff;margin-top: 10px;padding: 10px 15px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<view style="background: #FF9D33; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<view style="background: #FFDAB2; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<text style="margin-left: 8px;font-size: 14px;color: #333;">预约记录</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view style="margin-bottom: 10px;"> |
|||
<view v-for="(item,index) in data.orderCardVoList" :key="index" |
|||
style="display: flex;flex-direction: row;background-color: #fff;padding-left: 10px;padding-right: 10px;"> |
|||
|
|||
<view style="display: flex;flex-direction: column;background-color: #fff; |
|||
border-bottom: 1px #F1F2F3 solid; width: 100%;padding-left: 20px;padding-bottom: 10px;"> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 10px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/date.png" |
|||
style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text |
|||
style="margin-left: 5px;font-size: 12px; color: #999;">提货时间：{{item.reserveDate}}</text> |
|||
</view> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/location.png" |
|||
style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text style="margin-left: 5px;font-size: 12px; color: #999;">提货地点：{{item.store}}</text> |
|||
</view> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/user2.png" mode="aspectFill" |
|||
style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text |
|||
style="margin-left: 5px;font-size: 12px; color: #999;">提 货 人：{{item.userName}}</text> |
|||
</view> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/phone2.png" mode="aspectFill" |
|||
style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text style="margin-left: 5px;font-size: 12px; color: #999;">联系电话：{{item.userPhone}}</text> |
|||
</view> |
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 8px;"> |
|||
<text style="color: #999; font-size: 12px;">- {{item.goods}}</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view style="background-color: #fff;margin-top: 10px;padding: 10px 15px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<view style="background: #FF9D33; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<view style="background: #FFDAB2; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<text style="margin-left: 8px;font-size: 14px;color: #333;">转赠记录</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view style="margin-bottom: 50px;"> |
|||
|
|||
<view v-for="(item,index) in data.empCardGifts" :key="index" |
|||
style="display: flex;flex-direction: row;background-color: #fff;padding-left: 10px;padding-right: 10px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;background-color: #fff; |
|||
border-bottom: 1px #F1F2F3 solid; width: 100%;padding-left: 10px; padding-right: 10px; padding-bottom: 10px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;width: 100%;margin-top: 15px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/home_affection.png" |
|||
style="width: 50px;height: 50px;margin-right: 10px;flex-shrink: 0;"></image> |
|||
|
|||
<view style="display: flex;flex-direction: column;width: 100%;"> |
|||
|
|||
<text |
|||
style="font-size: 12px; color: #333;margin-top: 5px;">亲情窖序号：{{item.serialNumber}}</text> |
|||
<text |
|||
style="font-size: 12px; color: #333;margin-top: 5px;">分享时间：{{item.createTime}}</text> |
|||
<text style="font-size: 12px; color: #333;margin-top: 5px;">亲情窖编码：{{item.code}}</text> |
|||
<text style="font-size: 12px; color: #333;margin-top: 5px;">提货密码：{{item.codeKey}}</text> |
|||
<text style="font-size: 12px; color: #333;margin-top: 5px;">备注说明：{{item.remarks}}</text> |
|||
|
|||
<view |
|||
style="display: flex;flex-direction: row;margin-top: 5px;align-items: center;justify-content: space-between;width: 100%;"> |
|||
<text style="flex: 1;font-size: 12px; color: #A5A5A5; margin-right: 10px;">- |
|||
{{item.goods}}</text> |
|||
|
|||
<button v-show="item.isShare=='1'" class='sharebtn' :data-info="item" |
|||
open-type="share">分享窖</button> |
|||
<button v-show="item.isShare=='2'" class='sharebtn2' :data-info="item" |
|||
open-type="share">已分享</button> |
|||
<button v-show="item.isShare=='3'" class='sharebtn3'>转赠成功</button> |
|||
|
|||
</view> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
<view style="height: 50px;"></view> |
|||
|
|||
|
|||
|
|||
</loading-state> |
|||
|
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
//引入bus |
|||
import bus from '@/common/bus'; |
|||
export default { |
|||
data() { |
|||
return { |
|||
page: { |
|||
sid: '', |
|||
startHeight: 0, |
|||
endHeight: 0 |
|||
}, |
|||
data: { |
|||
time: "", |
|||
name: "", |
|||
pname: "", |
|||
state: "", |
|||
notRese: false, |
|||
showBtn: false, |
|||
showRecord: false, |
|||
goodsVos: [], |
|||
value: "", |
|||
userName: "", |
|||
userPhone: "", |
|||
} |
|||
} |
|||
}, |
|||
onLoad(options) { |
|||
this.page.sid = options.sid |
|||
this.request() |
|||
this.$bus.$on('order', msg => { |
|||
this.$nextTick(() => { |
|||
this.$refs.pageView.setLoadState(0) |
|||
}) |
|||
this.request(); |
|||
}) |
|||
|
|||
let info = uni.getSystemInfoSync(); |
|||
|
|||
this.page.startHeight = info.windowWidth * 0.6 |
|||
this.page.endHeight = info.windowWidth * 0.8 |
|||
}, |
|||
onUnload() { |
|||
uni.$off('order'); |
|||
}, |
|||
onPageScroll(res) { |
|||
// 渐变 |
|||
this.$refs.nav.defaultColorBgAlpha(res) |
|||
}, |
|||
methods: { |
|||
|
|||
request() { |
|||
let _this = this |
|||
_this.$api.cardDetail(this.page.sid).then((resp) => { |
|||
_this.data = resp |
|||
_this.$nextTick(() => { |
|||
_this.$refs.pageView.setLoadState(2) |
|||
}) |
|||
}).catch(e => { |
|||
_this.$nextTick(() => { |
|||
_this.$refs.pageView.setLoadState(1) |
|||
}) |
|||
}) |
|||
}, |
|||
itemClick(goodsSid) { |
|||
uni.navigateTo({ |
|||
url: '/pages/good/goodsDetail?sid=' + goodsSid |
|||
}) |
|||
}, |
|||
onShareAppMessage: function(res) { |
|||
console.log("res", res) |
|||
console.log("data", res.target.dataset) |
|||
var data = res.target.dataset.info |
|||
this.shareCard(data.sid) |
|||
// ① |
|||
let shareData = JSON.stringify({ |
|||
params: { |
|||
code: data.code, |
|||
codeKey: data.codeKey, |
|||
customerSid: '' |
|||
}, |
|||
functionName: 'bindCard', |
|||
url: '/pages/detail/detail_affeection?sid=' + data.sid |
|||
|
|||
// url:'/pages/bind/bind_pickUpCard?code=' + + &codeKey=' + data.codeKey, |
|||
// FunctionName:'share! |
|||
}) |
|||
// 转码传输 |
|||
let value = encodeURIComponent(shareData) |
|||
|
|||
return { |
|||
title: '汇融农链-云菜窖', |
|||
// ② |
|||
path: '/pages/login/login?data=' + value, |
|||
imageUrl: 'https://supervise.yxtsoft.com/lpk/image/shareAffeection.png', //自定义图片路径，显示图片长宽比是 5:4。 |
|||
success: function(res) { |
|||
console.log('aaaa', "分享成功") |
|||
}, |
|||
fail: function(res) { |
|||
// 转发失败 |
|||
console.log('aaaa', "用户点击了取消") |
|||
} |
|||
} |
|||
}, |
|||
|
|||
shareCard(sid) { |
|||
let _this = this |
|||
|
|||
_this.$api.shareEmpCard(sid).then((resp) => { |
|||
|
|||
var item = _this.data.empCardGiftVos.find(item => item.sid === sid) |
|||
|
|||
console.log("item", item); |
|||
|
|||
item.share = '2' |
|||
|
|||
}).catch(e => {}) |
|||
} |
|||
|
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
.canvas-code { |
|||
width: 39vw !important; |
|||
height: 39vw !important; |
|||
} |
|||
|
|||
.sharebtn { |
|||
background: #FF4727; |
|||
font-size: 12px; |
|||
color: #fff; |
|||
width: 30vw; |
|||
border-radius: 20px; |
|||
} |
|||
|
|||
|
|||
.sharebtn::after { |
|||
border: none; |
|||
} |
|||
|
|||
.sharebtn2 { |
|||
background: #FF7165; |
|||
width: 30vw; |
|||
font-size: 12px; |
|||
color: #fff; |
|||
border-radius: 20px; |
|||
} |
|||
|
|||
.sharebtn2::after { |
|||
border: none; |
|||
} |
|||
|
|||
.sharebtn3 { |
|||
background: #CFCFCF; |
|||
width: 30vw; |
|||
font-size: 12px; |
|||
color: #fff; |
|||
border-radius: 20px; |
|||
} |
|||
|
|||
.sharebtn3::after { |
|||
border: none; |
|||
} |
|||
|
|||
.top { |
|||
width: 100vw; |
|||
/* height: 126.66vw; */ |
|||
height: 65vw; |
|||
/* 加载背景图 */ |
|||
background-image: url(https://supervise.yxtsoft.com/lpk/image/detail_bj4.png); |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
background-size: 100% 100%; |
|||
} |
|||
|
|||
.text { |
|||
white-space: normal; |
|||
text-overflow: -o-ellipsis-lastline; |
|||
overflow: hidden; |
|||
text-overflow: ellipsis; |
|||
display: -webkit-box; |
|||
-webkit-line-clamp: 2; |
|||
line-clamp: 2; |
|||
-webkit-box-orient: vertical; |
|||
} |
|||
|
|||
uni-page-body, |
|||
page { |
|||
background: #F1F2F3; |
|||
} |
|||
|
|||
.btn { |
|||
border: 1px solid; |
|||
padding-left: 30rpx; |
|||
padding-right: 30rpx; |
|||
padding-top: 12rpx; |
|||
padding-bottom: 12rpx; |
|||
border-radius: 50rpx; |
|||
height: 15px; |
|||
margin-left: 25rpx; |
|||
font-size: 26rpx; |
|||
} |
|||
|
|||
/* 弹窗样式 */ |
|||
.model { |
|||
position: absolute; |
|||
width: 100%; |
|||
height: 100%; |
|||
background: #000; |
|||
z-index: 999; |
|||
opacity: 0.5; |
|||
top: 0; |
|||
left: 0; |
|||
} |
|||
|
|||
.modalDlg { |
|||
/* 设置超出滚动 */ |
|||
overflow: auto; |
|||
width: 90%; |
|||
position: fixed; |
|||
top: 50vw; |
|||
left: 0; |
|||
right: 0; |
|||
bottom: 0; |
|||
z-index: 9999; |
|||
margin: 0 auto; |
|||
padding: 35rpx; |
|||
background-color: #fff; |
|||
border-radius: 20rpx; |
|||
display: flex; |
|||
flex-direction: column; |
|||
|
|||
} |
|||
|
|||
.windowRow { |
|||
display: flex; |
|||
flex-direction: row; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
padding-bottom: 15rpx; |
|||
width: 100%; |
|||
} |
|||
|
|||
.userTitle { |
|||
font-size: 42rpx; |
|||
} |
|||
|
|||
.back { |
|||
text-align: center; |
|||
color: #f0a500; |
|||
font-size: 30rpx; |
|||
} |
|||
|
|||
.wishName { |
|||
width: 100%; |
|||
justify-content: center; |
|||
flex-direction: row; |
|||
display: flex; |
|||
margin: 40rpx 0rpx; |
|||
} |
|||
|
|||
.wish_put { |
|||
width: 100%; |
|||
border: #ededef 1rpx solid; |
|||
background-color: #f6f7fb; |
|||
border-radius: 12rpx; |
|||
padding: 30rpx 20rpx; |
|||
margin: 20rpx 0rpx; |
|||
} |
|||
|
|||
.holder_cls { |
|||
color: #909399; |
|||
} |
|||
|
|||
.wishbnt { |
|||
background-color: #fec600; |
|||
text-align: center; |
|||
border-radius: 50rpx; |
|||
padding: 25rpx; |
|||
color: white; |
|||
} |
|||
|
|||
/*弹窗样式结束*/ |
|||
|
|||
/* 下面的姓名样式，不要也没什么影响 */ |
|||
.jiantou { |
|||
width: 35rpx; |
|||
height: 35rpx; |
|||
margin-left: 10rpx; |
|||
} |
|||
|
|||
.fenge { |
|||
margin-bottom: 30rpx; |
|||
} |
|||
|
|||
.xian { |
|||
border-bottom: #e5e5e5 1rpx solid; |
|||
} |
|||
|
|||
.yellow { |
|||
color: #f0a500; |
|||
font-weight: 700; |
|||
} |
|||
|
|||
.box { |
|||
background-color: white; |
|||
padding: 0rpx 25rpx; |
|||
display: flex; |
|||
flex-direction: column; |
|||
} |
|||
|
|||
.row { |
|||
height: 120rpx; |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
} |
|||
|
|||
.you { |
|||
height: 100%; |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
} |
|||
|
|||
.zhushi { |
|||
font-size: 28rpx; |
|||
color: #808080; |
|||
} |
|||
|
|||
/* 下面的姓名样式结束 */ |
|||
</style> |
|||
@ -0,0 +1,698 @@ |
|||
<template> |
|||
|
|||
<view style="display: flex;flex-direction: column;"> |
|||
|
|||
<view class="top"> |
|||
<NavBar ref="nav" navTitle="详情" :showIcon="true" :start-change-height="page.startHeight" |
|||
:end-change-height="page.endHeight"> |
|||
</NavBar> |
|||
<view style="display: flex;flex-direction: column;margin-top: 25vw; margin-left: 5vw;"> |
|||
<view style="font-size: 17px;color: #fff;height: 8vw;line-height: 8vw;margin-top: 5vw;"> |
|||
{{data.state}} |
|||
</view> |
|||
<view |
|||
style="font-size: 12px;color: white;line-height: 7vw;height: 7vw;color: #fff;box-sizing: border-box;"> |
|||
卡号：{{data.serialNumber}} |
|||
</view> |
|||
<view style="font-size: 12px;color: white;line-height: 7vw;height: 7vw;color: #fff;"> |
|||
{{data.time}} |
|||
</view> |
|||
</view> |
|||
|
|||
</view> |
|||
<loading-state ref="pageView" @request="request"> |
|||
|
|||
<view style="background-color: #fff;padding: 10px 15px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<view style="background: #4F9AFD; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<view style="background: #7DCEFB; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<text style="margin-left: 8px;font-size: 14px;color: #333;">商品明细</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view v-for="(item,index) in data.goodsVos" :key="index" @click="itemClick(item.goodsSid)" |
|||
style="display: flex;flex-direction: row;background-color: #fff;padding-left: 10px;padding-right: 10px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;background-color: #fff;padding: 10px 15px; |
|||
border-bottom: 1px #F1F2F3 solid; width: 100%;"> |
|||
<image :src="item.pic" style="width: 60px;height: 60px;flex-shrink: 0;"></image> |
|||
<view style="margin-left: 10px;margin-right: 10px;flex: 1;"> |
|||
<text class="text" style="font-weight: 500;">{{item.goods}} |
|||
</text> |
|||
<view style="font-size: 12px;color: #666666;margin-top: 5px;">{{item.remarks}}</view> |
|||
<view style="display: flex;flex-direction: row;justify-content: space-between;margin-top: 5px;"> |
|||
<text |
|||
style="font-size: 12px;color: #666666;margin-right: 10px;">总数：{{item.num}}{{item.unitName}} |
|||
</text> |
|||
<view style="font-size: 12px;color: #666666;">卡内剩余：{{item.lnum}}{{item.unitName}}</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
|
|||
<view style="background-color: #fff;margin-top: 10px;padding: 10px 15px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<view style="background: #FF472B; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<view style="background: #FF7268; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<text style="margin-left: 8px;font-size: 14px;color: #333;">预约记录</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view style="margin-bottom: 10px;"> |
|||
<view v-for="(item,index) in data.orderCardVoList" :key="index" |
|||
style="display: flex;flex-direction: row;background-color: #fff;padding-left: 10px;padding-right: 10px;"> |
|||
|
|||
<view style="display: flex;flex-direction: column;background-color: #fff; |
|||
border-bottom: 1px #F1F2F3 solid; width: 100%;padding-left: 20px;padding-bottom: 10px;"> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 10px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/gift_date.png" |
|||
style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text |
|||
style="margin-left: 5px;font-size: 12px; color: #999;">提货时间：{{item.reserveDate}}</text> |
|||
</view> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/gift_loction.png" |
|||
style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text style="margin-left: 5px;font-size: 12px; color: #999;">提货地点：{{item.store}}</text> |
|||
</view> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/gift_user.png" mode="aspectFill" |
|||
style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text |
|||
style="margin-left: 5px;font-size: 12px; color: #999;">提 货 人：{{item.userName}}</text> |
|||
</view> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/gift_phone.png" mode="aspectFill" |
|||
style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text style="margin-left: 5px;font-size: 12px; color: #999;">联系电话：{{item.userPhone}}</text> |
|||
</view> |
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 8px;"> |
|||
<text style="color: #999; font-size: 12px;">- {{item.goods}}</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view style="background-color: #fff;margin-top: 10px;padding: 10px 15px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<view style="background: #FF472B; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<view style="background: #FF7268; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<text style="margin-left: 8px;font-size: 14px;color: #333;">已生成福礼卡</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view style="margin-bottom: 50px;"> |
|||
<view v-for="(item,index) in data.empCardGiftVos" :key="index" |
|||
style="display: flex;flex-direction: row;background-color: #fff;padding-left: 10px;padding-right: 10px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;background-color: #fff; |
|||
border-bottom: 1px #F1F2F3 solid; width: 100%;padding-left: 10px; padding-right: 10px; padding-bottom: 10px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;width: 100%;margin-top: 15px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/giftNormal.png" |
|||
style="width: 50px;height: 50px;margin-right: 10px;flex-shrink: 0;"></image> |
|||
|
|||
<view style="display: flex;flex-direction: column;width: 100%;"> |
|||
|
|||
<text style="font-size: 12px; color: #333;margin-top: 5px;">福礼卡编码：{{item.code}}</text> |
|||
<text style="font-size: 12px; color: #333;margin-top: 5px;">提货密码：{{item.codeKey}}</text> |
|||
<text style="font-size: 12px; color: #333;margin-top: 5px;">备注说明：{{item.remarks}}</text> |
|||
|
|||
<view |
|||
style="display: flex;flex-direction: row;margin-top: 5px;align-items: center;justify-content: space-between;width: 100%;"> |
|||
<text |
|||
style="flex: 1;font-size: 12px; color: #A5A5A5; margin-right: 10px;">{{item.goods}}</text> |
|||
|
|||
<button v-show="item.share=='1'" class='sharebtn' :data-info="item" |
|||
open-type="share">分享</button> |
|||
<button v-show="item.share=='2'" class='sharebtn2' :data-info="item" |
|||
open-type="share">已分享</button> |
|||
<button v-show="item.share=='3'" class='sharebtn3'>已绑定</button> |
|||
|
|||
|
|||
</view> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
</view> |
|||
|
|||
<view style="height: 50px;"></view> |
|||
|
|||
<view v-if="data.notRese" style="width: 100%; background-color: #fff;height: 15vw;position: fixed;bottom: 0;overflow:hidden; |
|||
display: flex;flex-direction: row;"> |
|||
<text style=" width: 20vw;font-size: 16px;color: #fff; background-color: #54A0FD; |
|||
padding: 10px 20px; display:margin：auto;text-align: center;line-height: 10vw;" @click="showDialog">生成卡券</text> |
|||
<view style="flex: 1;"></view> |
|||
<text style=" width: 20vw;font-size: 16px;color: #fff; background-color: #54A0FD; |
|||
padding: 10px 20px; display:margin：auto;text-align: center;line-height: 10vw;" @click="showDialog2">预约提货</text> |
|||
|
|||
</view> |
|||
|
|||
</loading-state> |
|||
|
|||
<!-- 弹窗蒙版 --> |
|||
<view class="model" catchtouchmove='preventTouchMove' v-if='showModal' @click.stop="colseDialog()"></view> |
|||
<view class="modalDlg" catchtouchmove='preventTouchMove' v-if='showModal'> |
|||
<scroll-view scroll-y="true" style="height: 100%; width: 100%; box-sizing: border-box; |
|||
" bindscrolltoupper="upper" bindscrolltolower="lower" bindscroll="scroll"> |
|||
|
|||
<!-- <view |
|||
style="display: flex;flex-direction: column;justify-content: center;align-items: center;margin-top: 20px;"> |
|||
|
|||
<view style="width: 43vw; height: 43vw;margin-top: 10px;padding: 5px; |
|||
display: flex;justify-content: center;align-items: center;" class="boeder"> |
|||
<canvas class="canvas-code" canvas-id="canvas" style="width: 39vw; height: 39vw;" /> |
|||
</view> |
|||
|
|||
|
|||
<text |
|||
style="font-size: 16px;color: #333; width: 100%;text-align: center;margin-top: 20px;">福礼卡编码：{{data.giftCode}}</text> |
|||
<text |
|||
style="font-size: 16px; color: #333;width: 100%;text-align: center;margin-top: 5px;">提货密码：{{data.giftCodeKey}}</text> |
|||
</view> --> |
|||
|
|||
<view style="display: flex;flex-direction: column;margin: 20px;"> |
|||
<text>卡券数量</text> |
|||
<view style="display: flex;align-items: center;margin-top: 6px;"> |
|||
<input placeholder="请输入卡券数量" |
|||
style="font-size: 30rpx;flex: 1;background: #F8F8F8;border-radius: 5px;height: 40px;line-height: 40px;padding-left: 10px;" |
|||
type="number" :value="info.count" @input="onKeyInput1" /> |
|||
</view> |
|||
</view> |
|||
|
|||
<view style="display: flex;flex-direction: column;margin: 20px;"> |
|||
<text>备注说明</text> |
|||
<view style="display: flex;align-items: center;margin-top: 6px;"> |
|||
<textarea placeholder="请输入" :disable-default-padding='true' :fixed="true" style="font-size: 30rpx;flex: 1;background: #F8F8F8;border-radius: 5px; |
|||
min-height: 50px;line-height: 20px;padding: 10px; |
|||
white-space: pre-wrap; |
|||
word-wrap: break-word;" :value="info.remarks" @input="onKeyInput2" /> |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
|
|||
<view style="background: #F5F5F5; border-radius: 5px;;margin: 20px;"> |
|||
<view v-for="(item,index) in data.goodsVos" |
|||
style="display: flex;flex-direction: row;margin-top: 15px; margin-bottom: 10px;"> |
|||
<view style="margin-left: 10px;margin-right: 10px;flex: 1; |
|||
display: flex;flex-direction: column;justify-content: space-between;align-items: flex-end; |
|||
padding: 10px;"> |
|||
<text class="text" style="font-weight: 500;width: 100%;font-size: 14px;">{{item.goods}} |
|||
</text> |
|||
<text class="text" |
|||
style="font-weight: 500;width: 100%;color: #919191; font-size: 12px;">剩余：{{item.lnum}}{{item.unitName}} |
|||
</text> |
|||
<uni-number-box ref="box" style="margin-top: -30px;" :showTextView="true" :min="0" |
|||
:max="item.lnum" v-model="item.select"></uni-number-box> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view |
|||
style="display: flex;flex-direction: row;align-items: center;justify-content: center;margin-top: 100px;width: 100%;"> |
|||
|
|||
<text |
|||
style="border-radius:30px; font-size: 14px;color: #666;background-color: #F5F5F5; padding: 5px 30px;margin-right: 20px;" |
|||
@click.stop="colseDialog()">取消</text> |
|||
<text |
|||
style="border-radius: 30px; font-size: 14px;color: #fff; background-color: #54A0FD; padding: 5px 30px;margin-left: 20px;" |
|||
@click="save">确认</text> |
|||
|
|||
</view> |
|||
<view style="height: 50px;"> |
|||
|
|||
</view> |
|||
|
|||
</scroll-view> |
|||
</view> |
|||
|
|||
<!-- 弹窗蒙版 --> |
|||
<view class="model" catchtouchmove='preventTouchMove' v-if='showModal2' @click.stop="colseDialog2()"></view> |
|||
<view class="modalDlg" catchtouchmove='preventTouchMove' v-if='showModal2'> |
|||
<scroll-view scroll-y="true" style="height: 100%;width: 100%; padding: 20px; " bindscrolltoupper="upper" |
|||
bindscrolltolower="lower" bindscroll="scroll"> |
|||
|
|||
<view style="display: flex;flex-direction: column;margin-top: 10px;"> |
|||
<text>提货地点</text> |
|||
<view |
|||
style="margin-top: 10px;background:#F5F5F5 ; display: flex;flex-direction: row;justify-content: space-between;width: 89.5%;border-radius: 4px;min-height: 35px;align-items: center;" |
|||
@click="address"> |
|||
<view v-if="stringIsEmpty(data.addressName)" |
|||
style="color: #666;font-size: 12px;margin-left: 10px;"> |
|||
请选择提货点</view> |
|||
<view v-if="stringIsNotEmpty(data.addressName)" |
|||
style="color: #666;font-size: 12px;margin-left: 10px;">{{data.addressName}}</view> |
|||
<uni-icons type="bottom" size="14" color="#999" style="flex-direction: 0;margin: 0px 5px;" /> |
|||
</view> |
|||
</view> |
|||
|
|||
<view style="display: flex;flex-direction: column;margin-top: 10px;width: 89.5%;"> |
|||
<text>提货时间</text> |
|||
<view style="display: flex;align-items: center;margin-top: 6px;"> |
|||
<uni-datetime-picker type="date" v-model="data.reserveDate" style="flex: 1;background: #F8F8F8;" |
|||
:start="data.start" :end="data.end" :disabledDate="disabledDate" /> |
|||
</view> |
|||
</view> |
|||
|
|||
<view style="display: flex;flex-direction: column;margin-top: 10px;width: 89.5%;"> |
|||
<text>提货人</text> |
|||
<view style="display: flex;align-items: center;margin-top: 6px;"> |
|||
<input placeholder="请输入提货人" |
|||
style="font-size: 30rpx;flex: 1;background: #F8F8F8;border-radius: 5px;height: 40px;line-height: 40px;padding-left: 10px;" |
|||
:value="data.userName" @input="onKeyInput3" /> |
|||
</view> |
|||
</view> |
|||
|
|||
<view style="display: flex;flex-direction: column;margin-top: 10px;width: 89.5%;"> |
|||
<text>联系电话</text> |
|||
<view style="display: flex;align-items: center;margin-top: 6px;"> |
|||
<input maxlength="11" placeholder="请输入联系电话" |
|||
style="font-size: 30rpx;flex: 1;background: #F8F8F8;border-radius: 5px;height: 40px;line-height: 40px;padding-left: 10px;" |
|||
type="number" :value="data.userPhone" @input="onKeyInput4" /> |
|||
</view> |
|||
</view> |
|||
|
|||
<view style="background: #F5F5F5; border-radius: 5px;margin-top: 15px;width: 89.5%;"> |
|||
<view v-for="(item,index) in data.goodsVos" |
|||
style="display: flex;flex-direction: row;margin-top: 15px; margin-bottom: 10px;"> |
|||
<view style="margin-left: 10px;margin-right: 10px;flex: 1; |
|||
display: flex;flex-direction: column;justify-content: space-between;align-items: flex-end; |
|||
padding: 10px;"> |
|||
<text class="text" style="font-weight: 500;width: 100%;font-size: 14px;">{{item.goods}} |
|||
</text> |
|||
<text class="text" |
|||
style="font-weight: 500;width: 100%;color: #919191; font-size: 12px;">剩余：{{item.lnum}}{{item.unitName}} |
|||
</text> |
|||
<uni-number-box ref="box" style="margin-top: -30px;" :showTextView="true" :min="0" |
|||
:max="item.lnum" v-model="item.select"></uni-number-box> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view |
|||
style="display: flex;flex-direction: row;align-items: center;justify-content: center; margin-top: 100px;width: 100%;"> |
|||
|
|||
<text |
|||
style="border-radius:30px; font-size: 14px;color: #666;background-color: #F5F5F5; padding: 5px 30px;margin-right: 20px;" |
|||
@click.stop="colseDialog2()">取消</text> |
|||
<text |
|||
style="border-radius: 30px; font-size: 14px;color: #fff; background-color: #54A0FD; padding: 5px 30px;margin-left: 20px;" |
|||
@click="save2">确认</text> |
|||
|
|||
</view> |
|||
<view style="height: 50px;"> |
|||
|
|||
</view> |
|||
|
|||
</scroll-view> |
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
// import QRCode from '@/utils/weapp-qrcode.js' |
|||
//引入bus |
|||
import bus from '@/common/bus'; |
|||
export default { |
|||
data() { |
|||
return { |
|||
showModal: false, |
|||
showModal2: false, |
|||
page: { |
|||
sid: '', |
|||
startHeight: 0, |
|||
endHeight: 0 |
|||
}, |
|||
data: {}, |
|||
info: { |
|||
count: "1", |
|||
empCardSid: "", |
|||
remarks: "", |
|||
goodsVoList: [] |
|||
}, |
|||
disabledDate: [ |
|||
// '2023-12-16' |
|||
], |
|||
// qrcode: null, |
|||
|
|||
} |
|||
}, |
|||
onLoad(options) { |
|||
this.page.sid = options.sid |
|||
this.request() |
|||
this.getSun() |
|||
uni.$on("order3", (e) => { |
|||
this.$nextTick(() => { |
|||
this.$refs.pageView.setLoadState(0) |
|||
}) |
|||
this.request(); |
|||
}) |
|||
|
|||
|
|||
uni.$on("address", (e) => { |
|||
// 相当与下拉刷新 |
|||
this.data.value = e.sid; |
|||
this.data.addressName = e.name; |
|||
}) |
|||
|
|||
let info = uni.getSystemInfoSync(); |
|||
|
|||
this.page.startHeight = info.windowWidth * 0.6 |
|||
this.page.endHeight = info.windowWidth * 0.8 |
|||
|
|||
// let long = info.windowWidth*0.39; |
|||
|
|||
// this.qrcode = new QRCode('canvas', { |
|||
// usingIn: this, |
|||
// text: "https://github.com/tomfriwel/weapp-qrcode", |
|||
// width: long, |
|||
// height: long, |
|||
// colorDark: "#000000", |
|||
// colorLight: "#ffffff", |
|||
// correctLevel: QRCode.CorrectLevel.H, |
|||
// }) |
|||
|
|||
|
|||
}, |
|||
onUnload() { |
|||
uni.$off('order3'); |
|||
uni.$off('address'); |
|||
}, |
|||
methods: { |
|||
showDialog() { |
|||
// this.qrcode.makeCode(this.data.qrCode) |
|||
this.showModal = true |
|||
}, |
|||
colseDialog() { |
|||
this.showModal = false |
|||
}, |
|||
showDialog2() { |
|||
// this.qrcode.makeCode(this.data.qrCode) |
|||
this.showModal2 = true |
|||
}, |
|||
colseDialog2() { |
|||
this.showModal2 = false |
|||
}, |
|||
address() { |
|||
uni.navigateTo({ |
|||
url: '/pages/SelectAddressActivity' |
|||
}) |
|||
}, |
|||
onKeyInput1: function(event) { |
|||
this.info.count = event.target.value |
|||
}, |
|||
onKeyInput2: function(event) { |
|||
this.info.remarks = event.target.value |
|||
}, |
|||
onKeyInput3: function(event) { |
|||
this.data.userName = event.target.value |
|||
}, |
|||
onKeyInput4: function(event) { |
|||
this.data.userPhone = event.target.value |
|||
}, |
|||
getSun() { |
|||
let _this = this |
|||
_this.$api.isSaturAndSun3(this.page.sid).then((resp) => { |
|||
|
|||
// console.log("aaa",resp) |
|||
|
|||
this.disabledDate = resp |
|||
|
|||
}).catch(e => { |
|||
|
|||
}) |
|||
}, |
|||
save() { |
|||
|
|||
|
|||
let num = 0; |
|||
for (var i = 0; i < this.data.goodsVos.length; i++) { |
|||
num += Number(this.data.goodsVos[i].select); |
|||
} |
|||
if (num == 0) { |
|||
this.shortToast('您未选择任何商品') |
|||
return |
|||
} |
|||
|
|||
let _this = this |
|||
|
|||
this.info.empCardSid = this.page.sid, |
|||
this.info.goodsVoList = this.data.goodsVos, |
|||
|
|||
console.log("info>>", this.info); |
|||
|
|||
_this.$api.empcardSave(this.info).then((resp) => { |
|||
bus.$emit('order3', "监听回调"); |
|||
uni.navigateBack() |
|||
|
|||
}).catch(e => { |
|||
_this.shortToast(e.msg) |
|||
}) |
|||
|
|||
}, |
|||
|
|||
save2() { |
|||
|
|||
if (this.stringIsEmpty(this.data.value)) { |
|||
this.shortToast('请选择提货地点') |
|||
return |
|||
} |
|||
if (this.stringIsEmpty(this.data.reserveDate)) { |
|||
this.shortToast('请选择提货时间') |
|||
return |
|||
} |
|||
if (this.stringIsEmpty(this.data.userName)) { |
|||
this.shortToast('请输入提货人员') |
|||
return |
|||
} |
|||
if (this.stringIsEmpty(this.data.userPhone)) { |
|||
this.shortToast('请输入手机号码') |
|||
return |
|||
} |
|||
if (this.data.userPhone.length != 11) { |
|||
this.shortToast('手机号码格式不对') |
|||
return |
|||
} |
|||
|
|||
|
|||
let num = 0; |
|||
for (var i = 0; i < this.data.goodsVos.length; i++) { |
|||
num += Number(this.data.goodsVos[i].select); |
|||
} |
|||
if (num == 0) { |
|||
this.shortToast('您未选择任何商品') |
|||
return |
|||
} |
|||
|
|||
let _this = this |
|||
_this.$api.empcardBookingSave(this.data).then((resp) => { |
|||
bus.$emit('order3', "监听回调"); |
|||
uni.navigateBack() |
|||
|
|||
}).catch(e => { |
|||
_this.shortToast(e.msg) |
|||
}) |
|||
|
|||
|
|||
}, |
|||
|
|||
request() { |
|||
let _this = this |
|||
_this.$api.empCardDetail(this.page.sid).then((resp) => { |
|||
_this.data = resp |
|||
// _this.qrcode.makeCode(_this.data.qrCode) |
|||
_this.$nextTick(() => { |
|||
_this.$refs.pageView.setLoadState(2) |
|||
}) |
|||
|
|||
}).catch(e => { |
|||
_this.$nextTick(() => { |
|||
_this.$refs.pageView.setLoadState(1) |
|||
}) |
|||
}) |
|||
}, |
|||
|
|||
itemClick(goodsSid) { |
|||
uni.navigateTo({ |
|||
url: '/pages/good/goodsDetail?sid=' + goodsSid |
|||
}) |
|||
}, |
|||
onShareAppMessage: function(res) { |
|||
console.log("res", res) |
|||
console.log("data", res.target.dataset) |
|||
var data = res.target.dataset.info |
|||
this.shareCard(data.sid) |
|||
return { |
|||
title: '汇融农链-云菜窖', |
|||
path: '/pages/bind/bind_giftCard?code=' + data.code + '&codeKey=' + data.codeKey, |
|||
imageUrl: 'https://supervise.yxtsoft.com/lpk/image/share.png', //自定义图片路径，显示图片长宽比是 5:4。 |
|||
success: function(res) { |
|||
console.log('aaaa', "分享成功") |
|||
}, |
|||
fail: function(res) { |
|||
// 转发失败 |
|||
console.log('aaaa', "用户点击了取消") |
|||
} |
|||
} |
|||
}, |
|||
|
|||
shareCard(sid) { |
|||
let _this = this |
|||
|
|||
_this.$api.shareEmpCard(sid).then((resp) => { |
|||
|
|||
var item = _this.data.empCardGiftVos.find(item => item.sid === sid) |
|||
|
|||
console.log("item", item); |
|||
|
|||
item.share = '2' |
|||
|
|||
}).catch(e => {}) |
|||
} |
|||
|
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
.canvas-code { |
|||
width: 39vw !important; |
|||
height: 39vw !important; |
|||
} |
|||
|
|||
.sharebtn { |
|||
background: #FF4727; |
|||
font-size: 12px; |
|||
color: #fff; |
|||
width: 20vw; |
|||
border-radius: 20px; |
|||
} |
|||
|
|||
|
|||
.sharebtn::after { |
|||
border: none; |
|||
} |
|||
|
|||
.sharebtn2 { |
|||
background: #FF7165; |
|||
width: 20vw; |
|||
font-size: 12px; |
|||
color: #fff; |
|||
border-radius: 20px; |
|||
} |
|||
|
|||
.sharebtn2::after { |
|||
border: none; |
|||
} |
|||
|
|||
.sharebtn3 { |
|||
background: #CFCFCF; |
|||
width: 20vw; |
|||
font-size: 12px; |
|||
color: #fff; |
|||
border-radius: 20px; |
|||
} |
|||
|
|||
.sharebtn3::after { |
|||
border: none; |
|||
} |
|||
|
|||
.boeder { |
|||
/* 加载背景图 */ |
|||
background-image: url(../../static/border.png); |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
background-size: 100% 100%; |
|||
} |
|||
|
|||
.top { |
|||
width: 100vw; |
|||
/* height: 126.66vw; */ |
|||
height: 65vw; |
|||
/* 加载背景图 */ |
|||
background-image: url(https://supervise.yxtsoft.com/lpk/image/detail_bj3.png); |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
background-size: 100% 100%; |
|||
} |
|||
|
|||
.text { |
|||
white-space: normal; |
|||
text-overflow: -o-ellipsis-lastline; |
|||
overflow: hidden; |
|||
text-overflow: ellipsis; |
|||
display: -webkit-box; |
|||
-webkit-line-clamp: 2; |
|||
line-clamp: 2; |
|||
-webkit-box-orient: vertical; |
|||
} |
|||
|
|||
uni-page-body, |
|||
page { |
|||
background: #F1F2F3; |
|||
} |
|||
|
|||
.btn { |
|||
border: 1px solid; |
|||
padding-left: 30rpx; |
|||
padding-right: 30rpx; |
|||
padding-top: 12rpx; |
|||
padding-bottom: 12rpx; |
|||
border-radius: 50rpx; |
|||
height: 15px; |
|||
margin-left: 25rpx; |
|||
font-size: 26rpx; |
|||
} |
|||
|
|||
/* 弹窗样式 */ |
|||
.model { |
|||
position: absolute; |
|||
width: 100%; |
|||
height: 100%; |
|||
background: #000; |
|||
z-index: 999; |
|||
opacity: 0.5; |
|||
top: 0; |
|||
left: 0; |
|||
} |
|||
|
|||
.modalDlg { |
|||
/* 设置超出滚动 */ |
|||
overflow: auto; |
|||
width: 100%; |
|||
position: fixed; |
|||
top: 50vw; |
|||
left: 0; |
|||
right: 0; |
|||
bottom: 0; |
|||
z-index: 9999; |
|||
margin: 0 auto; |
|||
background-color: #fff; |
|||
border-top-left-radius: 20px; |
|||
border-top-right-radius: 20px; |
|||
display: flex; |
|||
flex-direction: column; |
|||
box-sizing: content-box; |
|||
|
|||
} |
|||
</style> |
|||
@ -0,0 +1,470 @@ |
|||
<template> |
|||
|
|||
<view style="display: flex;flex-direction: column;"> |
|||
|
|||
<view class="top"> |
|||
<NavBar ref="nav" navTitle="详情" :showIcon="true" :start-change-height="page.startHeight" |
|||
:end-change-height="page.endHeight"> |
|||
</NavBar> |
|||
<view style="display: flex;flex-direction: column;margin-top: 25vw; margin-left: 5vw;"> |
|||
<view style="font-size: 17px;color: #fff;height: 8vw;line-height: 8vw;margin-top: 5vw;"> |
|||
{{data.state}} |
|||
</view> |
|||
<view |
|||
style="font-size: 12px;color: white;line-height: 7vw;height: 7vw;color: #fff;box-sizing: border-box;"> |
|||
卡号：{{data.serialNumber}} |
|||
</view> |
|||
<view style="font-size: 12px;color: white;line-height: 7vw;height: 7vw;color: #fff;"> |
|||
{{data.time}} |
|||
</view> |
|||
</view> |
|||
|
|||
</view> |
|||
<loading-state ref="pageView" @request="request"> |
|||
|
|||
<view style="background-color: #fff;padding: 10px 15px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<view style="background: #4F9AFD; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<view style="background: #7DCEFB; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<text style="margin-left: 8px;font-size: 14px;color: #333;">商品明细</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view v-for="(item,index) in data.goodsVos" :key="index" @click="itemClick(item.goodsSid)" |
|||
style="display: flex;flex-direction: row;background-color: #fff;padding-left: 10px;padding-right: 10px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;background-color: #fff;padding: 10px 15px; |
|||
border-bottom: 1px #F1F2F3 solid; width: 100%; "> |
|||
<image :src="item.pic" style="width: 60px;height: 60px;flex-shrink: 0;"></image> |
|||
<view style="margin-left: 10px;margin-right: 10px;flex: 1;"> |
|||
<text class="text" style="font-weight: 500;">{{item.goods}} |
|||
</text> |
|||
<view style="font-size: 12px;color: #666666;margin-top: 5px;">{{item.remarks}}</view> |
|||
<view style="display: flex;flex-direction: row;justify-content: space-between;margin-top: 5px;"> |
|||
<text |
|||
style="font-size: 12px;color: #666666;margin-right: 10px;">总数：{{item.num}}{{item.unitName}} |
|||
</text> |
|||
<view style="font-size: 12px;color: #666666;">卡内剩余：{{item.lnum}}{{item.unitName}}</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
|
|||
<view style="background-color: #fff;margin-top: 10px;padding: 10px 15px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<view style="background: #FF472B; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<view style="background: #FF7268; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<text style="margin-left: 8px;font-size: 14px;color: #333;">预约记录</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view style="margin-bottom: 10px;"> |
|||
<view v-for="(item,index) in data.orderCardVoList" :key="index" |
|||
style="display: flex;flex-direction: row;background-color: #fff;padding-left: 10px;padding-right: 10px;"> |
|||
|
|||
<view style="display: flex;flex-direction: column;background-color: #fff; |
|||
border-bottom: 1px #F1F2F3 solid; width: 100%;padding-left: 20px;padding-bottom: 10px;"> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 10px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/gift_date.png" |
|||
style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text |
|||
style="margin-left: 5px;font-size: 12px; color: #999;">提货时间：{{item.reserveDate}}</text> |
|||
</view> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/gift_loction.png" |
|||
style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text style="margin-left: 5px;font-size: 12px; color: #999;">提货地点：{{item.store}}</text> |
|||
</view> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/gift_user.png" mode="aspectFill" |
|||
style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text |
|||
style="margin-left: 5px;font-size: 12px; color: #999;">提 货 人：{{item.userName}}</text> |
|||
</view> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/gift_phone.png" mode="aspectFill" |
|||
style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text style="margin-left: 5px;font-size: 12px; color: #999;">联系电话：{{item.userPhone}}</text> |
|||
</view> |
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 8px;"> |
|||
<text style="color: #999; font-size: 12px;">- {{item.goods}}</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view style="background-color: #fff;margin-top: 10px;padding: 10px 15px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<view style="background: #FF472B; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<view style="background: #FF7268; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<text style="margin-left: 8px;font-size: 14px;color: #333;">已生成福礼卡</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view style="margin-bottom: 50px;"> |
|||
<view v-for="(item,index) in data.empCardGiftVos" :key="index" |
|||
style="display: flex;flex-direction: row;background-color: #fff;padding-left: 10px;padding-right: 10px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;background-color: #fff; |
|||
border-bottom: 1px #F1F2F3 solid; width: 100%;padding-left: 10px; padding-right: 10px; padding-bottom: 10px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;width: 100%;margin-top: 15px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/giftNormal.png" |
|||
style="width: 50px;height: 50px;margin-right: 10px;flex-shrink: 0;"></image> |
|||
|
|||
<view style="display: flex;flex-direction: column;width: 100%;"> |
|||
|
|||
<text style="font-size: 12px; color: #333;margin-top: 5px;">福礼卡编码：{{item.code}}</text> |
|||
<text style="font-size: 12px; color: #333;margin-top: 5px;">提货密码：{{item.codeKey}}</text> |
|||
<text style="font-size: 12px; color: #333;margin-top: 5px;">备注说明：{{item.remarks}}</text> |
|||
|
|||
<view |
|||
style="display: flex;flex-direction: row;margin-top: 5px;align-items: center;justify-content: space-between;width: 100%;"> |
|||
<text |
|||
style="flex: 1;font-size: 12px; color: #A5A5A5; margin-right: 10px;">{{item.goods}}</text> |
|||
|
|||
<button v-show="item.share=='1'" class='sharebtn' :data-info="item" |
|||
open-type="share">分享</button> |
|||
<button v-show="item.share=='2'" class='sharebtn2' :data-info="item" |
|||
open-type="share">已分享</button> |
|||
<button v-show="item.share=='3'" class='sharebtn3'>已绑定</button> |
|||
</view> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
<view style="height: 50px;"></view> |
|||
|
|||
</loading-state> |
|||
|
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
page: { |
|||
sid: '', |
|||
startHeight: 0, |
|||
endHeight: 0 |
|||
}, |
|||
data: { |
|||
time: "", |
|||
name: "", |
|||
pname: "", |
|||
state: "", |
|||
notRese: false, |
|||
showBtn: false, |
|||
showRecord: false, |
|||
goodsVos: [], |
|||
value: "", |
|||
userName: "", |
|||
userPhone: "", |
|||
} |
|||
} |
|||
}, |
|||
onLoad(options) { |
|||
this.page.sid = options.sid |
|||
this.request() |
|||
uni.$on("order3", (e) => { |
|||
this.$nextTick(() => { |
|||
this.$refs.pageView.setLoadState(0) |
|||
}) |
|||
this.request(); |
|||
}) |
|||
|
|||
let info = uni.getSystemInfoSync(); |
|||
|
|||
this.page.startHeight = info.windowWidth * 0.6 |
|||
this.page.endHeight = info.windowWidth * 0.8 |
|||
}, |
|||
onUnload() { |
|||
uni.$off('order3'); |
|||
}, |
|||
methods: { |
|||
|
|||
request() { |
|||
let _this = this |
|||
_this.$api.empCardDetail(this.page.sid).then((resp) => { |
|||
_this.data = resp |
|||
_this.$nextTick(() => { |
|||
_this.$refs.pageView.setLoadState(2) |
|||
}) |
|||
}).catch(e => { |
|||
_this.$nextTick(() => { |
|||
_this.$refs.pageView.setLoadState(1) |
|||
}) |
|||
}) |
|||
}, |
|||
itemClick(goodsSid) { |
|||
uni.navigateTo({ |
|||
url: '/pages/good/goodsDetail?sid=' + goodsSid |
|||
}) |
|||
}, |
|||
tapName(event) { |
|||
console.log("event", event) |
|||
}, |
|||
onShareAppMessage: function(res) { |
|||
console.log("res", res) |
|||
console.log("data", res.target.dataset) |
|||
var data = res.target.dataset.info |
|||
this.shareCard(data.sid) |
|||
return { |
|||
title: '汇融农链-云菜窖', |
|||
path: '/pages/bind/bind_giftCard?code=' + data.code + '&codeKey=' + data.codeKey, |
|||
imageUrl: 'https://supervise.yxtsoft.com/lpk/image/share.png', //自定义图片路径，显示图片长宽比是 5:4。 |
|||
success: function(res) { |
|||
console.log('aaaa', "分享成功") |
|||
}, |
|||
fail: function(res) { |
|||
// 转发失败 |
|||
console.log('aaaa', "用户点击了取消") |
|||
} |
|||
} |
|||
}, |
|||
|
|||
shareCard(sid) { |
|||
let _this = this |
|||
|
|||
_this.$api.shareEmpCard(sid).then((resp) => { |
|||
|
|||
var item = _this.data.empCardGiftVos.find(item => item.sid === sid) |
|||
|
|||
console.log("item", item); |
|||
|
|||
item.share = '2' |
|||
|
|||
}).catch(e => {}) |
|||
} |
|||
|
|||
|
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
.sharebtn { |
|||
background: #FF4727; |
|||
font-size: 12px; |
|||
color: #fff; |
|||
width: 20vw; |
|||
border-radius: 20px; |
|||
} |
|||
|
|||
|
|||
.sharebtn::after { |
|||
border: none; |
|||
} |
|||
|
|||
.sharebtn2 { |
|||
background: #FF7165; |
|||
width: 20vw; |
|||
font-size: 12px; |
|||
color: #fff; |
|||
border-radius: 20px; |
|||
} |
|||
|
|||
.sharebtn2::after { |
|||
border: none; |
|||
} |
|||
|
|||
.sharebtn3 { |
|||
background: #CFCFCF; |
|||
width: 20vw; |
|||
font-size: 12px; |
|||
color: #fff; |
|||
border-radius: 20px; |
|||
} |
|||
|
|||
.sharebtn3::after { |
|||
border: none; |
|||
} |
|||
|
|||
.top { |
|||
width: 100vw; |
|||
/* height: 126.66vw; */ |
|||
height: 65vw; |
|||
/* 加载背景图 */ |
|||
background-image: url(https://supervise.yxtsoft.com/lpk/image/detail_bj6.png); |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
background-size: 100% 100%; |
|||
} |
|||
|
|||
.text { |
|||
white-space: normal; |
|||
text-overflow: -o-ellipsis-lastline; |
|||
overflow: hidden; |
|||
text-overflow: ellipsis; |
|||
display: -webkit-box; |
|||
-webkit-line-clamp: 2; |
|||
line-clamp: 2; |
|||
-webkit-box-orient: vertical; |
|||
} |
|||
|
|||
uni-page-body, |
|||
page { |
|||
background: #F1F2F3; |
|||
} |
|||
|
|||
.btn { |
|||
border: 1px solid; |
|||
padding-left: 30rpx; |
|||
padding-right: 30rpx; |
|||
padding-top: 12rpx; |
|||
padding-bottom: 12rpx; |
|||
border-radius: 50rpx; |
|||
height: 15px; |
|||
margin-left: 25rpx; |
|||
font-size: 26rpx; |
|||
} |
|||
|
|||
/* 弹窗样式 */ |
|||
.model { |
|||
position: absolute; |
|||
width: 100%; |
|||
height: 100%; |
|||
background: #000; |
|||
z-index: 999; |
|||
opacity: 0.5; |
|||
top: 0; |
|||
left: 0; |
|||
} |
|||
|
|||
.modalDlg { |
|||
/* 设置超出滚动 */ |
|||
overflow: auto; |
|||
width: 90%; |
|||
position: fixed; |
|||
top: 50vw; |
|||
left: 0; |
|||
right: 0; |
|||
bottom: 0; |
|||
z-index: 9999; |
|||
margin: 0 auto; |
|||
padding: 35rpx; |
|||
background-color: #fff; |
|||
border-radius: 20rpx; |
|||
display: flex; |
|||
flex-direction: column; |
|||
|
|||
} |
|||
|
|||
.windowRow { |
|||
display: flex; |
|||
flex-direction: row; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
padding-bottom: 15rpx; |
|||
width: 100%; |
|||
} |
|||
|
|||
.userTitle { |
|||
font-size: 42rpx; |
|||
} |
|||
|
|||
.back { |
|||
text-align: center; |
|||
color: #f0a500; |
|||
font-size: 30rpx; |
|||
} |
|||
|
|||
.wishName { |
|||
width: 100%; |
|||
justify-content: center; |
|||
flex-direction: row; |
|||
display: flex; |
|||
margin: 40rpx 0rpx; |
|||
} |
|||
|
|||
.wish_put { |
|||
width: 100%; |
|||
border: #ededef 1rpx solid; |
|||
background-color: #f6f7fb; |
|||
border-radius: 12rpx; |
|||
padding: 30rpx 20rpx; |
|||
margin: 20rpx 0rpx; |
|||
} |
|||
|
|||
.holder_cls { |
|||
color: #909399; |
|||
} |
|||
|
|||
.wishbnt { |
|||
background-color: #fec600; |
|||
text-align: center; |
|||
border-radius: 50rpx; |
|||
padding: 25rpx; |
|||
color: white; |
|||
} |
|||
|
|||
/*弹窗样式结束*/ |
|||
|
|||
/* 下面的姓名样式，不要也没什么影响 */ |
|||
.jiantou { |
|||
width: 35rpx; |
|||
height: 35rpx; |
|||
margin-left: 10rpx; |
|||
} |
|||
|
|||
.fenge { |
|||
margin-bottom: 30rpx; |
|||
} |
|||
|
|||
.xian { |
|||
border-bottom: #e5e5e5 1rpx solid; |
|||
} |
|||
|
|||
.yellow { |
|||
color: #f0a500; |
|||
font-weight: 700; |
|||
} |
|||
|
|||
.box { |
|||
background-color: white; |
|||
padding: 0rpx 25rpx; |
|||
display: flex; |
|||
flex-direction: column; |
|||
} |
|||
|
|||
.row { |
|||
height: 120rpx; |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
} |
|||
|
|||
.you { |
|||
height: 100%; |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
} |
|||
|
|||
.zhushi { |
|||
font-size: 28rpx; |
|||
color: #808080; |
|||
} |
|||
|
|||
/* 下面的姓名样式结束 */ |
|||
</style> |
|||
@ -0,0 +1,657 @@ |
|||
<template> |
|||
|
|||
<view style="display: flex;flex-direction: column;"> |
|||
|
|||
<view class="top"> |
|||
<NavBar ref="nav" navTitle="详情" :showIcon="true" :start-change-height="page.startHeight" |
|||
:end-change-height="page.endHeight"> |
|||
</NavBar> |
|||
<view style="display: flex;flex-direction: column;margin-top: 25vw; margin-left: 5vw;"> |
|||
<view style="font-size: 17px;color: #fff;height: 8vw;line-height: 8vw;margin-top: 5vw;"> |
|||
{{data.state}} |
|||
</view> |
|||
<view |
|||
style="font-size: 12px;color: white;line-height: 7vw;height: 7vw;color: #fff;box-sizing: border-box;"> |
|||
卡号：{{data.serialNumber}} |
|||
</view> |
|||
<view style="font-size: 12px;color: white;line-height: 7vw;height: 7vw;color: #fff;"> |
|||
{{data.time}} |
|||
</view> |
|||
</view> |
|||
|
|||
</view> |
|||
<loading-state ref="pageView" @request="request"> |
|||
|
|||
<view style="background-color: #fff;padding: 10px 15px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<view style="background: #FF472B; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<view style="background: #FF7268; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<text style="margin-left: 8px;font-size: 14px;color: #333;">商品明细</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view v-for="(item,index) in data.goodsVos" :key="index" @click="itemClick(item.goodsSid)" |
|||
style="display: flex;flex-direction: row;background-color: #fff;padding-left: 10px;padding-right: 10px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;background-color: #fff;padding: 10px 15px; |
|||
border-bottom: 1px #F1F2F3 solid; width: 100%;"> |
|||
<image :src="item.pic" style="width: 60px;height: 60px;flex-shrink: 0;"></image> |
|||
<view style="margin-left: 10px;margin-right: 10px;flex: 1;"> |
|||
<text class="text" style="font-weight: 500;">{{item.goods}} |
|||
</text> |
|||
<view style="font-size: 12px;color: #666666;margin-top: 5px;">{{item.remarks}}</view> |
|||
<view style="display: flex;flex-direction: row;justify-content: space-between;margin-top: 5px;"> |
|||
<text |
|||
style="font-size: 12px;color: #666666;margin-right: 10px;">总数：{{item.num}}{{item.unitName}} |
|||
</text> |
|||
<view style="font-size: 12px;color: #666666;">可预约：{{item.lnum}}{{item.unitName}}</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
|
|||
<view style="background-color: #fff;margin-top: 10px;padding: 10px 15px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<view style="background: #FF472B; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<view style="background: #FF7268; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<text style="margin-left: 8px;font-size: 14px;color: #333;">预约记录</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view style="margin-bottom: 10px;"> |
|||
<view v-for="(item,index) in data.orderCardVoList" :key="index" |
|||
style="display: flex;flex-direction: row;background-color: #fff;padding-left: 10px;padding-right: 10px;"> |
|||
|
|||
<view style="display: flex;flex-direction: column;background-color: #fff; |
|||
border-bottom: 1px #F1F2F3 solid; width: 100%;padding-left: 20px;padding-bottom: 10px;"> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 10px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/gift_date.png" |
|||
style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text |
|||
style="margin-left: 5px;font-size: 12px; color: #999;">提货时间：{{item.reserveDate}}</text> |
|||
</view> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/gift_loction.png" |
|||
style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text style="margin-left: 5px;font-size: 12px; color: #999;">提货地点：{{item.store}}</text> |
|||
</view> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/gift_user.png" mode="aspectFill" |
|||
style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text |
|||
style="margin-left: 5px;font-size: 12px; color: #999;">提 货 人：{{item.userName}}</text> |
|||
</view> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/gift_phone.png" mode="aspectFill" |
|||
style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text style="margin-left: 5px;font-size: 12px; color: #999;">联系电话：{{item.userPhone}}</text> |
|||
</view> |
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 8px;"> |
|||
<text style="color: #999; font-size: 12px;">- {{item.goods}}</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view style="background-color: #fff;margin-top: 10px;padding: 10px 15px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<view style="background: #FF472B; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<view style="background: #FF7268; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<text style="margin-left: 8px;font-size: 14px;color: #333;">转赠信息</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view style="margin-bottom: 50px;"> |
|||
|
|||
<view v-if="data.empCardGift!=null" style="display: flex;flex-direction: row;background-color: #fff; |
|||
border-bottom: 1px #F1F2F3 solid;padding-left: 10px; padding-right: 10px; padding-bottom: 10px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;width: 100%;margin-top: 10px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/giftNormal.png" |
|||
style="width: 50px;height: 50px;margin-right: 10px;flex-shrink: 0;"></image> |
|||
|
|||
<view style="display: flex;flex-direction: column;width: 100%;"> |
|||
|
|||
<text |
|||
style="font-size: 12px; color: #333;margin-top: 5px;">福礼卡编码：{{data.empCardGift.code}}</text> |
|||
<text |
|||
style="font-size: 12px; color: #333;margin-top: 5px;">提货密码：{{data.empCardGift.codeKey}}</text> |
|||
<text |
|||
style="font-size: 12px; color: #333;margin-top: 5px;">备注说明：{{data.empCardGift.remarks}}</text> |
|||
|
|||
<view |
|||
style="display: flex;flex-direction: row;margin-top: 5px;align-items: center;justify-content: space-between;"> |
|||
<text |
|||
style="flex: 1;font-size: 12px; color: #A5A5A5; margin-right: 10px;">{{data.empCardGift.goods}}</text> |
|||
|
|||
<button v-show="data.empCardGift.isShare=='1'" class='sharebtn' |
|||
:data-info="data.empCardGift" open-type="share">分享</button> |
|||
<button v-show="data.empCardGift.isShare=='2'" class='sharebtn2' |
|||
:data-info="data.empCardGift" open-type="share">已分享</button> |
|||
<button v-show="data.empCardGift.isShare=='3'" class='sharebtn3'>已绑定</button> |
|||
|
|||
|
|||
</view> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view style="height: 50px;"></view> |
|||
|
|||
<view v-if="data.notRese" style="width: 100%; background-color: #fff;height: 15vw;position: fixed;bottom: 0;overflow:hidden; |
|||
display: flex;flex-direction: row;"> |
|||
<text style=" width: 20vw;font-size: 16px;color: #fff; background-color: #FF523D; |
|||
padding: 10px 20px; display:margin：auto;text-align: center;line-height: 10vw;" @click="showDialog2">转赠卡券</text> |
|||
<view style="flex: 1;"></view> |
|||
<text style=" width: 20vw;font-size: 16px;color: #fff; background-color: #FF523D; |
|||
padding: 10px 20px; display:margin：auto;text-align: center;line-height: 10vw;" @click="showDialog">预约提货</text> |
|||
|
|||
</view> |
|||
|
|||
|
|||
</loading-state> |
|||
|
|||
|
|||
<!-- 弹窗蒙版 --> |
|||
<view class="model" catchtouchmove='preventTouchMove' v-if='showModal' @click.stop="colseDialog()"></view> |
|||
<view class="modalDlg" catchtouchmove='preventTouchMove' v-if='showModal'> |
|||
|
|||
<scroll-view scroll-y="true" style="height: 100%;width: 100%; padding: 20px; " bindscrolltoupper="upper" |
|||
bindscrolltolower="lower" bindscroll="scroll"> |
|||
|
|||
<view style="display: flex;flex-direction: column;margin-top: 10px;"> |
|||
<text>提货地点</text> |
|||
<view |
|||
style="margin-top: 10px;background:#F5F5F5 ; display: flex;flex-direction: row;justify-content: space-between;width: 89.5%;border-radius: 4px;min-height: 35px;align-items: center;" |
|||
@click="address"> |
|||
<view v-if="stringIsEmpty(data.addressName)" |
|||
style="color: #666;font-size: 12px;margin-left: 10px;"> |
|||
请选择提货点</view> |
|||
<view v-if="stringIsNotEmpty(data.addressName)" |
|||
style="color: #666;font-size: 12px;margin-left: 10px;">{{data.addressName}}</view> |
|||
<uni-icons type="bottom" size="14" color="#999" style="flex-direction: 0;margin: 0px 5px;" /> |
|||
</view> |
|||
</view> |
|||
|
|||
<view style="display: flex;flex-direction: column;margin-top: 10px;width: 89.5%;"> |
|||
<text>提货时间</text> |
|||
<view style="display: flex;align-items: center;margin-top: 6px;"> |
|||
<uni-datetime-picker type="date" v-model="data.reserveDate" style="flex: 1;background: #F8F8F8;" |
|||
:start="data.start" :end="data.end" @showing='showing' :disabledDate="disabledDate" /> |
|||
</view> |
|||
</view> |
|||
|
|||
<view style="display: flex;flex-direction: column;margin-top: 10px;width: 89.5%;"> |
|||
<text>提货人</text> |
|||
<view style="display: flex;align-items: center;margin-top: 6px;"> |
|||
<input placeholder="请输入提货人" |
|||
style="font-size: 30rpx;flex: 1;background: #F8F8F8;border-radius: 5px;height: 40px;line-height: 40px;padding-left: 10px;" |
|||
:value="data.userName" @input="onKeyInput1" /> |
|||
</view> |
|||
</view> |
|||
|
|||
<view style="display: flex;flex-direction: column;margin-top: 10px;width: 89.5%;"> |
|||
<text>联系电话</text> |
|||
<view style="display: flex;align-items: center;margin-top: 6px;"> |
|||
<input maxlength="11" placeholder="请输入联系电话" |
|||
style="font-size: 30rpx;flex: 1;background: #F8F8F8;border-radius: 5px;height: 40px;line-height: 40px;padding-left: 10px;" |
|||
type="number" :value="data.userPhone" @input="onKeyInput2" /> |
|||
</view> |
|||
</view> |
|||
|
|||
<view style="background: #F5F5F5; border-radius: 5px;margin-top: 15px;width: 89.5%;"> |
|||
<view v-for="(item,index) in data.goodsVos" |
|||
style="display: flex;flex-direction: row;margin-top: 15px; margin-bottom: 10px;"> |
|||
<view style="margin-left: 10px;margin-right: 10px;flex: 1; |
|||
display: flex;flex-direction: column;justify-content: space-between;align-items: flex-end; |
|||
padding: 10px;"> |
|||
<text class="text" style="font-weight: 500;width: 100%;font-size: 14px;">{{item.goods}} |
|||
</text> |
|||
<text class="text" |
|||
style="font-weight: 500;width: 100%;color: #919191; font-size: 12px;">剩余：{{item.lnum}}{{item.unitName}} |
|||
</text> |
|||
<uni-number-box ref="box" style="margin-top: -30px;" :showTextView="true" :min="0" |
|||
:max="item.lnum" v-model="item.select"></uni-number-box> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view |
|||
style="display: flex;flex-direction: row;align-items: center;justify-content: center; margin-top: 100px;width: 100%;"> |
|||
|
|||
<text |
|||
style="border-radius:30px; font-size: 14px;color: #666;background-color: #F5F5F5; padding: 5px 30px;margin-right: 20px;" |
|||
@click.stop="colseDialog()">取消</text> |
|||
<text |
|||
style="border-radius: 30px; font-size: 14px;color: #fff; background-color: #FF523D; padding: 5px 30px;margin-left: 20px;" |
|||
@click="save">确认</text> |
|||
|
|||
</view> |
|||
<view style="height: 50px;"> |
|||
|
|||
</view> |
|||
|
|||
</scroll-view> |
|||
</view> |
|||
|
|||
<!-- 弹窗蒙版 --> |
|||
<view class="model" catchtouchmove='preventTouchMove' v-if='showModal2' @click.stop="colseDialog2()"></view> |
|||
<view class="modalDlg" catchtouchmove='preventTouchMove' v-if='showModal2'> |
|||
<scroll-view scroll-y="true" style="height: 100%; width: 100%; box-sizing: border-box; |
|||
" bindscrolltoupper="upper" bindscrolltolower="lower" bindscroll="scroll"> |
|||
|
|||
|
|||
<view style="display: flex;flex-direction: column;margin: 20px;"> |
|||
<text>备注说明</text> |
|||
<view style="display: flex;align-items: center;margin-top: 6px;"> |
|||
<textarea placeholder="请输入" :disable-default-padding='true' :fixed="true" style="font-size: 30rpx;flex: 1;background: #F8F8F8;border-radius: 5px;min-height: 50px;line-height: 20px;padding: 10px; |
|||
white-space: pre-wrap; |
|||
word-wrap: break-word;" :value="info.remarks" @input="onKeyInput3" /> |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
|
|||
<view style="background: #F5F5F5; border-radius: 5px;;margin: 20px;"> |
|||
<view v-for="(item,index) in data.goodsVos" |
|||
style="display: flex;flex-direction: row;margin-top: 15px; margin-bottom: 10px;width: 100%;"> |
|||
<view style="margin-left: 10px;margin-right: 10px;flex: 1; |
|||
display: flex;flex-direction: row; align-items: center; |
|||
padding: 10px;width: 100%; justify-content: space-between;"> |
|||
<text style="font-weight: 500;font-size: 14px; ">{{item.goods}} |
|||
</text> |
|||
<text |
|||
style="font-weight: 500;color: #919191; font-size: 12px;">剩余：{{item.lnum}}{{item.unitName}} |
|||
</text> |
|||
<!-- <uni-number-box ref="box" style="margin-top: -30px;" :showTextView="true" :min="0" |
|||
:max="item.lnum" v-model="item.select"></uni-number-box> --> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<view |
|||
style="display: flex;flex-direction: row;align-items: center;justify-content: center;margin-top: 100px;width: 100%;"> |
|||
|
|||
<text |
|||
style="border-radius:30px; font-size: 14px;color: #666;background-color: #F5F5F5; padding: 5px 30px;margin-right: 20px;" |
|||
@click.stop="colseDialog2()">取消</text> |
|||
<text |
|||
style="border-radius: 30px; font-size: 14px;color: #fff; background-color: #FF523D; padding: 5px 30px;margin-left: 20px;" |
|||
@click="save2()">确认</text> |
|||
|
|||
</view> |
|||
<view style="height: 50px;"> |
|||
|
|||
</view> |
|||
|
|||
</scroll-view> |
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
//引入bus |
|||
import bus from '@/common/bus'; |
|||
export default { |
|||
data() { |
|||
return { |
|||
showModal: false, |
|||
showModal2: false, |
|||
page: { |
|||
sid: '', |
|||
showTextView: false, |
|||
startHeight: 0, |
|||
endHeight: 0 |
|||
}, |
|||
data: { |
|||
time: "", |
|||
name: "", |
|||
pname: "", |
|||
state: "", |
|||
notRese: false, |
|||
showBtn: false, |
|||
showRecord: false, |
|||
goodsVos: [], |
|||
value: "", |
|||
userName: "", |
|||
userPhone: "", |
|||
}, |
|||
disabledDate: [ |
|||
// '2023-12-16' |
|||
], |
|||
info: { |
|||
empCardSid: "", |
|||
remarks: "", |
|||
goodsVoList: [] |
|||
} |
|||
} |
|||
}, |
|||
onLoad(options) { |
|||
this.page.sid = options.sid |
|||
this.request() |
|||
this.getSun() |
|||
uni.$on("order2", (e) => { |
|||
this.$nextTick(() => { |
|||
this.$refs.pageView.setLoadState(0) |
|||
}) |
|||
this.request(); |
|||
}) |
|||
|
|||
uni.$on("address", (e) => { |
|||
// 相当与下拉刷新 |
|||
this.data.value = e.sid; |
|||
this.data.addressName = e.name; |
|||
}) |
|||
|
|||
let info = uni.getSystemInfoSync(); |
|||
|
|||
this.page.startHeight = info.windowWidth * 0.6 |
|||
this.page.endHeight = info.windowWidth * 0.8 |
|||
}, |
|||
onUnload() { |
|||
uni.$off('order2'); |
|||
uni.$off('address'); |
|||
}, |
|||
methods: { |
|||
showDialog() { |
|||
this.showModal = true |
|||
}, |
|||
colseDialog() { |
|||
this.showModal = false |
|||
}, |
|||
showDialog2() { |
|||
this.showModal2 = true |
|||
}, |
|||
colseDialog2() { |
|||
this.showModal2 = false |
|||
}, |
|||
address() { |
|||
uni.navigateTo({ |
|||
url: '/pages/SelectAddressActivity' |
|||
}) |
|||
}, |
|||
onKeyInput1: function(event) { |
|||
this.data.userName = event.target.value |
|||
}, |
|||
onKeyInput2: function(event) { |
|||
this.data.userPhone = event.target.value |
|||
}, |
|||
onKeyInput3: function(event) { |
|||
this.info.remarks = event.target.value |
|||
}, |
|||
showing(e) { |
|||
this.page.showTextView = e |
|||
}, |
|||
save() { |
|||
if (this.stringIsEmpty(this.data.value)) { |
|||
this.shortToast('请选择提货地点') |
|||
return |
|||
} |
|||
if (this.stringIsEmpty(this.data.reserveDate)) { |
|||
this.shortToast('请选择提货时间') |
|||
return |
|||
} |
|||
if (this.stringIsEmpty(this.data.userName)) { |
|||
this.shortToast('请输入提货人员') |
|||
return |
|||
} |
|||
if (this.stringIsEmpty(this.data.userPhone)) { |
|||
this.shortToast('请输入手机号码') |
|||
return |
|||
} |
|||
if (this.data.userPhone.length != 11) { |
|||
this.shortToast('手机号码格式不对') |
|||
return |
|||
} |
|||
|
|||
|
|||
let num = 0; |
|||
for (var i = 0; i < this.data.goodsVos.length; i++) { |
|||
num += Number(this.data.goodsVos[i].select); |
|||
} |
|||
if (num == 0) { |
|||
this.shortToast('您未选择任何商品') |
|||
return |
|||
} |
|||
|
|||
let _this = this |
|||
_this.$api.gifcardBookingSave(this.data).then((resp) => { |
|||
bus.$emit('order2', "监听回调"); |
|||
uni.navigateBack() |
|||
|
|||
}).catch(e => { |
|||
_this.shortToast(e.msg) |
|||
}) |
|||
|
|||
}, |
|||
|
|||
save2() { |
|||
|
|||
let _this = this |
|||
|
|||
this.info.empCardSid = this.page.sid, |
|||
this.info.goodsVoList = this.data.goodsVos, |
|||
|
|||
console.log("info>>", this.info); |
|||
|
|||
_this.$api.generateEmpCardGift(this.info).then((resp) => { |
|||
bus.$emit('order2', "监听回调"); |
|||
uni.navigateBack() |
|||
|
|||
}).catch(e => { |
|||
_this.shortToast(e.msg) |
|||
}) |
|||
|
|||
}, |
|||
|
|||
request() { |
|||
let _this = this |
|||
_this.$api.gifcardDetail(this.page.sid).then((resp) => { |
|||
_this.data = resp |
|||
_this.$nextTick(() => { |
|||
_this.$refs.pageView.setLoadState(2) |
|||
}) |
|||
}).catch(e => { |
|||
_this.$nextTick(() => { |
|||
_this.$refs.pageView.setLoadState(1) |
|||
}) |
|||
}) |
|||
}, |
|||
|
|||
getSun() { |
|||
let _this = this |
|||
_this.$api.isSaturAndSun2(this.page.sid).then((resp) => { |
|||
|
|||
// console.log("aaa",resp) |
|||
|
|||
this.disabledDate = resp |
|||
|
|||
}).catch(e => { |
|||
|
|||
}) |
|||
}, |
|||
|
|||
showRecord(sid) { |
|||
uni.navigateTo({ |
|||
url: '/pages/card/card_record?sid=' + sid |
|||
}) |
|||
}, |
|||
booking(sid) { |
|||
uni.navigateTo({ |
|||
url: '/pages/card/card_booking?sid=' + sid |
|||
}) |
|||
}, |
|||
itemClick(goodsSid) { |
|||
uni.navigateTo({ |
|||
url: '/pages/good/goodsDetail?sid=' + goodsSid |
|||
}) |
|||
}, |
|||
onShareAppMessage: function(res) { |
|||
console.log("res", res) |
|||
console.log("data", res.target.dataset) |
|||
var data = res.target.dataset.info |
|||
this.shareCard(data.sid) |
|||
return { |
|||
title: '汇融农链-云菜窖', |
|||
path: '/pages/bind/bind_giftCard?code=' + data.code + '&codeKey=' + data.codeKey, |
|||
imageUrl: 'https://supervise.yxtsoft.com/lpk/image/shareGift.png', //自定义图片路径，显示图片长宽比是 5:4。 |
|||
success: function(res) { |
|||
console.log('aaaa', "分享成功") |
|||
}, |
|||
fail: function(res) { |
|||
// 转发失败 |
|||
console.log('aaaa', "用户点击了取消") |
|||
} |
|||
} |
|||
}, |
|||
|
|||
shareCard(sid) { |
|||
let _this = this |
|||
|
|||
_this.$api.shareEmpCard(sid).then((resp) => { |
|||
|
|||
var item = _this.data.empCardGiftVos.find(item => item.sid === sid) |
|||
|
|||
console.log("item", item); |
|||
|
|||
item.share = '2' |
|||
|
|||
}).catch(e => {}) |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
.canvas-code { |
|||
width: 39vw !important; |
|||
height: 39vw !important; |
|||
} |
|||
|
|||
.sharebtn { |
|||
background: #FF4727; |
|||
font-size: 12px; |
|||
color: #fff; |
|||
width: 20vw; |
|||
border-radius: 20px; |
|||
} |
|||
|
|||
|
|||
.sharebtn::after { |
|||
border: none; |
|||
} |
|||
|
|||
.sharebtn2 { |
|||
background: #FF7165; |
|||
width: 20vw; |
|||
font-size: 12px; |
|||
color: #fff; |
|||
border-radius: 20px; |
|||
} |
|||
|
|||
.sharebtn2::after { |
|||
border: none; |
|||
} |
|||
|
|||
.sharebtn3 { |
|||
background: #CFCFCF; |
|||
width: 20vw; |
|||
font-size: 12px; |
|||
color: #fff; |
|||
border-radius: 20px; |
|||
} |
|||
|
|||
.sharebtn3::after { |
|||
border: none; |
|||
} |
|||
|
|||
.top { |
|||
width: 100vw; |
|||
/* height: 126.66vw; */ |
|||
height: 65vw; |
|||
/* 加载背景图 */ |
|||
background-image: url(https://supervise.yxtsoft.com/lpk/image/detail_bj2.png); |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
background-size: 100% 100%; |
|||
} |
|||
|
|||
.text { |
|||
white-space: normal; |
|||
text-overflow: -o-ellipsis-lastline; |
|||
overflow: hidden; |
|||
text-overflow: ellipsis; |
|||
display: -webkit-box; |
|||
-webkit-line-clamp: 2; |
|||
line-clamp: 2; |
|||
-webkit-box-orient: vertical; |
|||
} |
|||
|
|||
uni-page-body, |
|||
page { |
|||
background: #F1F2F3; |
|||
} |
|||
|
|||
.btn { |
|||
border: 1px solid; |
|||
padding-left: 30rpx; |
|||
padding-right: 30rpx; |
|||
padding-top: 12rpx; |
|||
padding-bottom: 12rpx; |
|||
border-radius: 50rpx; |
|||
height: 15px; |
|||
margin-left: 25rpx; |
|||
font-size: 26rpx; |
|||
} |
|||
|
|||
/* 弹窗样式 */ |
|||
.model { |
|||
position: absolute; |
|||
width: 100%; |
|||
height: 100%; |
|||
background: #000; |
|||
z-index: 999; |
|||
opacity: 0.5; |
|||
top: 0; |
|||
left: 0; |
|||
} |
|||
|
|||
.modalDlg { |
|||
/* 设置超出滚动 */ |
|||
overflow: auto; |
|||
width: 100%; |
|||
position: fixed; |
|||
top: 50vw; |
|||
left: 0; |
|||
right: 0; |
|||
bottom: 0; |
|||
z-index: 9999; |
|||
background-color: #fff; |
|||
border-top-right-radius: 20px; |
|||
border-top-left-radius: 20px; |
|||
display: flex; |
|||
flex-direction: column; |
|||
|
|||
|
|||
} |
|||
</style> |
|||
@ -0,0 +1,474 @@ |
|||
<template> |
|||
|
|||
<view style="display: flex;flex-direction: column;"> |
|||
|
|||
<view class="top"> |
|||
<NavBar ref="nav" navTitle="详情" :showIcon="true" :start-change-height="page.startHeight" |
|||
:end-change-height="page.endHeight"> |
|||
</NavBar> |
|||
<view style="display: flex;flex-direction: column;margin-top: 25vw; margin-left: 5vw;"> |
|||
<view style="font-size: 17px;color: #fff;height: 8vw;line-height: 8vw;margin-top: 5vw;"> |
|||
{{data.state}} |
|||
</view> |
|||
<view |
|||
style="font-size: 12px;color: white;line-height: 7vw;height: 7vw;color: #fff;box-sizing: border-box;"> |
|||
卡号：{{data.serialNumber}} |
|||
</view> |
|||
<view style="font-size: 12px;color: white;line-height: 7vw;height: 7vw;color: #fff;"> |
|||
{{data.time}} |
|||
</view> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<loading-state ref="pageView" @request="request"> |
|||
|
|||
<view style="background-color: #fff;padding: 10px 15px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<view style="background: #FF472B; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<view style="background: #FF7268; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<text style="margin-left: 8px;font-size: 14px;color: #333;">商品明细</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view v-for="(item,index) in data.goodsVos" :key="index" @click="itemClick(item.goodsSid)" |
|||
style="display: flex;flex-direction: row;background-color: #fff;padding-left: 10px;padding-right: 10px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;background-color: #fff;padding: 10px 15px; |
|||
border-bottom: 1px #F1F2F3 solid; width: 100%;"> |
|||
<image :src="item.pic" style="width: 60px;height: 60px;flex-shrink: 0;"></image> |
|||
<view style="margin-left: 10px;margin-right: 10px;flex: 1;"> |
|||
<text class="text" style="font-weight: 500;">{{item.goods}} |
|||
</text> |
|||
<view style="font-size: 12px;color: #666666;margin-top: 5px;">{{item.remarks}}</view> |
|||
<view style="display: flex;flex-direction: row;justify-content: space-between;margin-top: 5px;"> |
|||
<text |
|||
style="font-size: 12px;color: #666666;margin-right: 10px;">总数：{{item.num}}{{item.unitName}} |
|||
</text> |
|||
<view style="font-size: 12px;color: #666666;">可预约：{{item.lnum}}{{item.unitName}}</view> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
|
|||
<view style="background-color: #fff;margin-top: 10px;padding: 10px 15px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<view style="background: #FF472B; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<view style="background: #FF7268; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<text style="margin-left: 8px;font-size: 14px;color: #333;">预约记录</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view style="margin-bottom: 10px;"> |
|||
<view v-for="(item,index) in data.orderCardVoList" :key="index" @click="itemClick(item.goodsSid)" |
|||
style="display: flex;flex-direction: row;background-color: #fff;padding-left: 10px;padding-right: 10px;"> |
|||
|
|||
<view style="display: flex;flex-direction: column;background-color: #fff; |
|||
border-bottom: 1px #F1F2F3 solid; width: 100%;padding-left: 20px;padding-bottom: 10px;"> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 10px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/gift_date.png" |
|||
style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text |
|||
style="margin-left: 5px;font-size: 12px; color: #999;">提货时间：{{item.reserveDate}}</text> |
|||
</view> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/gift_loction.png" |
|||
style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text style="margin-left: 5px;font-size: 12px; color: #999;">提货地点：{{item.store}}</text> |
|||
</view> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/gift_user.png" mode="aspectFill" |
|||
style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text |
|||
style="margin-left: 5px;font-size: 12px; color: #999;">提 货 人：{{item.userName}}</text> |
|||
</view> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/gift_phone.png" mode="aspectFill" |
|||
style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text style="margin-left: 5px;font-size: 12px; color: #999;">联系电话：{{item.userPhone}}</text> |
|||
</view> |
|||
|
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 8px;"> |
|||
<text style="color: #999; font-size: 12px;">- {{item.goods}}</text> |
|||
</view> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view style="background-color: #fff;margin-top: 10px;padding: 10px 15px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<view style="background: #FF472B; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<view style="background: #FF7268; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<text style="margin-left: 8px;font-size: 14px;color: #333;">转赠信息</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view style="margin-bottom: 50px;"> |
|||
|
|||
<view v-if="data.empCardGift!=null" style="display: flex;flex-direction: row;background-color: #fff; |
|||
border-bottom: 1px #F1F2F3 solid;padding-left: 10px; padding-right: 10px; padding-bottom: 10px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;width: 100%;margin-top: 10px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/welfare_Card.png" |
|||
style="width: 50px;height: 50px;margin-right: 10px;flex-shrink: 0;"></image> |
|||
|
|||
<view style="display: flex;flex-direction: column;width: 100%;"> |
|||
|
|||
<text |
|||
style="font-size: 12px; color: #333;margin-top: 5px;">福礼卡编码：{{data.empCardGift.code}}</text> |
|||
<text |
|||
style="font-size: 12px; color: #333;margin-top: 5px;">提货密码：{{data.empCardGift.codeKey}}</text> |
|||
<text |
|||
style="font-size: 12px; color: #333;margin-top: 5px;">备注说明：{{data.empCardGift.remarks}}</text> |
|||
|
|||
<view |
|||
style="display: flex;flex-direction: row;margin-top: 5px;align-items: center;justify-content: space-between;"> |
|||
<text |
|||
style="flex: 1;font-size: 12px; color: #A5A5A5; margin-right: 10px;">{{data.empCardGift.goods}}</text> |
|||
|
|||
<button v-show="data.empCardGift.isShare=='1'" class='sharebtn' |
|||
:data-info="data.empCardGift" open-type="share">分享</button> |
|||
<button v-show="data.empCardGift.isShare=='2'" class='sharebtn2' |
|||
:data-info="data.empCardGift" open-type="share">已分享</button> |
|||
<button v-show="data.empCardGift.isShare=='3'" class='sharebtn3'>已绑定</button> |
|||
|
|||
|
|||
</view> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view style="height: 50px;"></view> |
|||
|
|||
|
|||
|
|||
</loading-state> |
|||
|
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
page: { |
|||
sid: '', |
|||
startHeight: 0, |
|||
endHeight: 0 |
|||
}, |
|||
data: { |
|||
time: "", |
|||
name: "", |
|||
pname: "", |
|||
state: "", |
|||
notRese: false, |
|||
showBtn: false, |
|||
showRecord: false, |
|||
goodsVos: [], |
|||
value: "", |
|||
userName: "", |
|||
userPhone: "", |
|||
} |
|||
} |
|||
}, |
|||
onLoad(options) { |
|||
this.page.sid = options.sid |
|||
this.request() |
|||
uni.$on("order2", (e) => { |
|||
this.$nextTick(() => { |
|||
this.$refs.pageView.setLoadState(0) |
|||
}) |
|||
this.request(); |
|||
}) |
|||
|
|||
let info = uni.getSystemInfoSync(); |
|||
|
|||
this.page.startHeight = info.windowWidth * 0.6 |
|||
this.page.endHeight = info.windowWidth * 0.8 |
|||
}, |
|||
onUnload() { |
|||
uni.$off('order2'); |
|||
}, |
|||
methods: { |
|||
|
|||
request() { |
|||
let _this = this |
|||
_this.$api.gifcardDetail(this.page.sid).then((resp) => { |
|||
_this.data = resp |
|||
_this.$nextTick(() => { |
|||
_this.$refs.pageView.setLoadState(2) |
|||
}) |
|||
}).catch(e => { |
|||
_this.$nextTick(() => { |
|||
_this.$refs.pageView.setLoadState(1) |
|||
}) |
|||
}) |
|||
}, |
|||
itemClick(goodsSid) { |
|||
uni.navigateTo({ |
|||
url: '/pages/good/goodsDetail?sid=' + goodsSid |
|||
}) |
|||
}, |
|||
onShareAppMessage: function(res) { |
|||
console.log("res", res) |
|||
console.log("data", res.target.dataset) |
|||
var data = res.target.dataset.info |
|||
this.shareCard(data.sid) |
|||
return { |
|||
title: '汇融农链-云菜窖', |
|||
path: '/pages/bind/bind_giftCard?code=' + data.code + '&codeKey=' + data.codeKey, |
|||
imageUrl: 'https://supervise.yxtsoft.com/lpk/image/shareGift.png', //自定义图片路径，显示图片长宽比是 5:4。 |
|||
success: function(res) { |
|||
console.log('aaaa', "分享成功") |
|||
}, |
|||
fail: function(res) { |
|||
// 转发失败 |
|||
console.log('aaaa', "用户点击了取消") |
|||
} |
|||
} |
|||
}, |
|||
|
|||
shareCard(sid) { |
|||
let _this = this |
|||
|
|||
_this.$api.shareEmpCard(sid).then((resp) => { |
|||
|
|||
var item = _this.data.empCardGiftVos.find(item => item.sid === sid) |
|||
|
|||
console.log("item", item); |
|||
|
|||
item.share = '2' |
|||
|
|||
}).catch(e => {}) |
|||
} |
|||
|
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
.canvas-code { |
|||
width: 39vw !important; |
|||
height: 39vw !important; |
|||
} |
|||
|
|||
.sharebtn { |
|||
background: #FF4727; |
|||
font-size: 12px; |
|||
color: #fff; |
|||
width: 20vw; |
|||
border-radius: 20px; |
|||
} |
|||
|
|||
|
|||
.sharebtn::after { |
|||
border: none; |
|||
} |
|||
|
|||
.sharebtn2 { |
|||
background: #FF7165; |
|||
width: 20vw; |
|||
font-size: 12px; |
|||
color: #fff; |
|||
border-radius: 20px; |
|||
} |
|||
|
|||
.sharebtn2::after { |
|||
border: none; |
|||
} |
|||
|
|||
.sharebtn3 { |
|||
background: #CFCFCF; |
|||
width: 20vw; |
|||
font-size: 12px; |
|||
color: #fff; |
|||
border-radius: 20px; |
|||
} |
|||
|
|||
.sharebtn3::after { |
|||
border: none; |
|||
} |
|||
|
|||
.top { |
|||
width: 100vw; |
|||
/* height: 126.66vw; */ |
|||
height: 65vw; |
|||
/* 加载背景图 */ |
|||
background-image: url(https://supervise.yxtsoft.com/lpk/image/detail_bj5.png); |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
background-size: 100% 100%; |
|||
} |
|||
|
|||
.text { |
|||
white-space: normal; |
|||
text-overflow: -o-ellipsis-lastline; |
|||
overflow: hidden; |
|||
text-overflow: ellipsis; |
|||
display: -webkit-box; |
|||
-webkit-line-clamp: 2; |
|||
line-clamp: 2; |
|||
-webkit-box-orient: vertical; |
|||
} |
|||
|
|||
uni-page-body, |
|||
page { |
|||
background: #F1F2F3; |
|||
} |
|||
|
|||
.btn { |
|||
border: 1px solid; |
|||
padding-left: 30rpx; |
|||
padding-right: 30rpx; |
|||
padding-top: 12rpx; |
|||
padding-bottom: 12rpx; |
|||
border-radius: 50rpx; |
|||
height: 15px; |
|||
margin-left: 25rpx; |
|||
font-size: 26rpx; |
|||
} |
|||
|
|||
/* 弹窗样式 */ |
|||
.model { |
|||
position: absolute; |
|||
width: 100%; |
|||
height: 100%; |
|||
background: #000; |
|||
z-index: 999; |
|||
opacity: 0.5; |
|||
top: 0; |
|||
left: 0; |
|||
} |
|||
|
|||
.modalDlg { |
|||
/* 设置超出滚动 */ |
|||
overflow: auto; |
|||
width: 90%; |
|||
position: fixed; |
|||
top: 50vw; |
|||
left: 0; |
|||
right: 0; |
|||
bottom: 0; |
|||
z-index: 9999; |
|||
margin: 0 auto; |
|||
padding: 35rpx; |
|||
background-color: #fff; |
|||
border-radius: 20rpx; |
|||
display: flex; |
|||
flex-direction: column; |
|||
|
|||
} |
|||
|
|||
.windowRow { |
|||
display: flex; |
|||
flex-direction: row; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
padding-bottom: 15rpx; |
|||
width: 100%; |
|||
} |
|||
|
|||
.userTitle { |
|||
font-size: 42rpx; |
|||
} |
|||
|
|||
.back { |
|||
text-align: center; |
|||
color: #f0a500; |
|||
font-size: 30rpx; |
|||
} |
|||
|
|||
.wishName { |
|||
width: 100%; |
|||
justify-content: center; |
|||
flex-direction: row; |
|||
display: flex; |
|||
margin: 40rpx 0rpx; |
|||
} |
|||
|
|||
.wish_put { |
|||
width: 100%; |
|||
border: #ededef 1rpx solid; |
|||
background-color: #f6f7fb; |
|||
border-radius: 12rpx; |
|||
padding: 30rpx 20rpx; |
|||
margin: 20rpx 0rpx; |
|||
} |
|||
|
|||
.holder_cls { |
|||
color: #909399; |
|||
} |
|||
|
|||
.wishbnt { |
|||
background-color: #fec600; |
|||
text-align: center; |
|||
border-radius: 50rpx; |
|||
padding: 25rpx; |
|||
color: white; |
|||
} |
|||
|
|||
/*弹窗样式结束*/ |
|||
|
|||
/* 下面的姓名样式，不要也没什么影响 */ |
|||
.jiantou { |
|||
width: 35rpx; |
|||
height: 35rpx; |
|||
margin-left: 10rpx; |
|||
} |
|||
|
|||
.fenge { |
|||
margin-bottom: 30rpx; |
|||
} |
|||
|
|||
.xian { |
|||
border-bottom: #e5e5e5 1rpx solid; |
|||
} |
|||
|
|||
.yellow { |
|||
color: #f0a500; |
|||
font-weight: 700; |
|||
} |
|||
|
|||
.box { |
|||
background-color: white; |
|||
padding: 0rpx 25rpx; |
|||
display: flex; |
|||
flex-direction: column; |
|||
} |
|||
|
|||
.row { |
|||
height: 120rpx; |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
} |
|||
|
|||
.you { |
|||
height: 100%; |
|||
display: flex; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
} |
|||
|
|||
.zhushi { |
|||
font-size: 28rpx; |
|||
color: #808080; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,71 @@ |
|||
<template> |
|||
|
|||
<view |
|||
style="display: flex;flex-direction: column; background: #f7f7f7;height: 100%;box-sizing: border-box;position: absolute;width: 100%;"> |
|||
|
|||
<NavBar ref="nav" navTitle="提货人信息" :showIcon="true" :supportChange="false"> |
|||
</NavBar> |
|||
|
|||
<view style="display: flex;flex-direction: column; margin: 10px; border-radius: 15px; background: #fff; |
|||
padding: 10px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
|
|||
<text style="font-size: 14px;color: #999;">提货人</text> |
|||
|
|||
<input placeholder="请输入提货人" style="font-size: 25rpx;flex: 1;height: 35px;line-height: 35px;padding-left: 10px;padding-right: 10px; margin-left: 15px; |
|||
border-bottom: 1px #EFEFEF solid;padding-bottom: 1px;" :value="page.name" @input="onKeyInput1" /> |
|||
</view> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
|
|||
<text style="font-size: 14px;color: #999;">电  话</text> |
|||
|
|||
<input placeholder="请输入联系电话" type="number" maxlength="11" |
|||
style="font-size: 25rpx;flex: 1;height: 35px;line-height: 35px;padding-left: 10px;padding-right: 10px; margin-left: 15px;" |
|||
:value="page.phone" @input="onKeyInput2" /> |
|||
</view> |
|||
</view> |
|||
|
|||
<view |
|||
style=" width: 100%; box-sizing: border-box; padding-left: 10vw;padding-right: 10vw;display: flex;flex-direction: row; justify-content: center;align-items: center;"> |
|||
<text style=" background: #FF9900;color: #fff;margin-top: 20px;margin-bottom: 20px; border-radius: 20px; |
|||
padding-top: 10px;padding-bottom: 10px;padding-left: 25vw;padding-right: 25vw; text-align: center;" |
|||
@click="confirm()">确认</text> |
|||
</view> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
page: { |
|||
name: "", |
|||
phone: "" |
|||
} |
|||
} |
|||
}, |
|||
onLoad(options) { |
|||
this.page.name = options.name |
|||
this.page.phone = options.phone |
|||
}, |
|||
methods: { |
|||
|
|||
onKeyInput1(event) { |
|||
this.page.name = event.target.value |
|||
}, |
|||
onKeyInput2(event) { |
|||
this.page.phone = event.target.value |
|||
}, |
|||
confirm() { |
|||
uni.$emit('changePer', this.page) |
|||
uni.navigateBack() |
|||
}, |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss"> |
|||
|
|||
</style> |
|||
@ -0,0 +1,566 @@ |
|||
<template> |
|||
<view style="height: 100vh;background: #fff;"> |
|||
<loading-state ref="pageView" @request="request"> |
|||
<view style="height: 85vh;overflow: hidden;overflow-y: auto;"> |
|||
<image :src="data.picUrl" style="width: 100vw;height: 80vw;" mode="scaleToFill"></image> |
|||
|
|||
<view style="display: flex;flex-direction: column;background: #fff;padding: 20px 20px 0px 20px;margin-top: 10px; |
|||
border-top-left-radius: 20px;border-top-right-radius: 20px;height: 100%;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;justify-content: space-between;align-items: center;"> |
|||
<text |
|||
style="font-size: 18px;font-weight: 600;font-family: sans-serif;color: #333;">{{data.name}}</text> |
|||
<text style="font-size: 13px;color: #FF7A11;">￥{{data.price}}</text> |
|||
</view> |
|||
|
|||
<view style="display: flex;flex-direction: row;justify-content: space-between;margin-top: 10px;"> |
|||
<text style="font-size: 13px;color: #666;">单    价</text> |
|||
<text |
|||
style="font-size: 13px;color: #999;">{{data.weight}}{{data.specificationUnit}}/{{data.unitName}}</text> |
|||
</view> |
|||
<view style="display: flex;flex-direction: row;justify-content: space-between;margin-top: 10px;"> |
|||
<text style="font-size: 13px;color: #666;">规    格</text> |
|||
<text style="font-size: 13px;color: #999;">{{data.remarks}}</text> |
|||
</view> |
|||
|
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 20px;"> |
|||
|
|||
<view style="width: 2px;height: 15px;background: #FF7A11;margin-right: 10px;"></view> |
|||
<text style="font-size: 14px;font-weight: 600;font-family: sans-serif;color: #333;">商品详情</text> |
|||
|
|||
</view> |
|||
|
|||
<view style="margin-top: 10px;" v-show="!data.appContent==''"> |
|||
<rich-text :nodes="data.appContent | formatRichText"></rich-text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
</loading-state> |
|||
|
|||
<view |
|||
style="position: absolute; bottom: 0px; display: flex;flex-direction: column;width: 100%; |
|||
box-sizing: border-box; padding-left: 16px;padding-right: 16px;background: #fff; height: 12vh;border-top: 1px solid #EFEFEF;"> |
|||
|
|||
<!-- <view |
|||
style="display: flex;flex-direction: row;align-items: center; justify-content: center; margin-top:10px;"> |
|||
|
|||
<view id="bomView" style="display: flex;flex-direction: row;align-items: center;"> |
|||
<view style="color: #888;font-size: 10px;height: 10px;line-height: 10px;margin-top: 5px;"> |
|||
温馨提示：已订</view> |
|||
<view style="color: #FF5006;font-size: 15px;height: 15px;line-height: 15px;font-weight: bold;"> |
|||
{{page.weight}}斤 |
|||
</view> |
|||
|
|||
<view style="color: #888;font-size: 10px;height: 10px;line-height: 10px;margin-top: 5px;"> |
|||
，{{data.qssl}}斤起订。</view> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;" @click="showPop2()"> |
|||
<text |
|||
style="color: #6190D8;font-size: 13px;height: 10px;line-height: 10px;margin-top: 5px;text-decoration:underline;font-style:oblique;"> |
|||
起订说明</text> |
|||
<text |
|||
style="color: #6190D8;font-size: 13px;height: 10px;line-height: 10px;margin-top: 5px;margin-left: 2px;"> |
|||
>></text> |
|||
</view> |
|||
|
|||
</view> |
|||
</view> --> |
|||
|
|||
<view |
|||
style="display: flex;flex-direction: row; justify-content: center;align-items: center;margin-top: 10px;padding: 0px 10px;margin-bottom: 20px;"> |
|||
|
|||
<text style="background: #FF9900; color: #fff;font-size: 14px; padding: 0px 15px;height: 50px;line-height:50px;flex: 1;text-align: center; |
|||
border: 1px #FF9900 solid; border-radius: 25px;" @click="showDialog()">加入购物车</text> |
|||
|
|||
<!-- <view style="border: 1px #FF9900 solid;border-top-right-radius: 25px; border-bottom-right-radius: 25px;padding: 0px 5px;height: 50px;line-height:50px;flex: 1; |
|||
display: flex;flex-direction: row;align-items: center;box-sizing: border-box;justify-content: center;" |
|||
@click="gotoCart()"> |
|||
<image src="../../static/shoppCart_icon.png" mode="aspectFill" |
|||
style="height: 20px;width: 20px;flex-shrink: 0;"> |
|||
</image> |
|||
<view style="display: flex;flex-direction: column;justify-content: center;align-items: center;"> |
|||
<text |
|||
style="font-size: 15px;color: #FF5006;margin-left: 5px;height: 20px;line-height: 20px;margin-top: 5px;font-weight: bold;">￥{{page.price}}</text> |
|||
<text v-if="page.remarks!=''" |
|||
style="font-size: 10px;color: #666;margin-left: 5px; height: 10px;line-height: 10px;margin-bottom: 5px;">{{page.remarks}}</text> |
|||
</view> |
|||
</view> --> |
|||
|
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
<!-- 弹窗蒙版 --> |
|||
<view class="model" catchtouchmove='preventTouchMove' v-if='showModal'></view> |
|||
<view class="modalDlg" catchtouchmove='preventTouchMove' v-if='showModal'> |
|||
|
|||
<view style="display: flex;flex-direction: row;padding: 16px 20px;margin-top: 10px;"> |
|||
|
|||
<image :src="data.picUrl" style="width: 90px;height: 90px;border-radius: 10px;" mode="scaleToFill"> |
|||
</image> |
|||
|
|||
<view style="display: flex;flex-direction: column;flex: 1;margin-left: 15px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;"> |
|||
<text style="flex: 1;margin-right: 10px;">{{data.name}}</text> |
|||
<image src="../../static/close2.png" style="width: 22px;height: 22px;" @click="colseDialog()"> |
|||
</image> |
|||
</view> |
|||
|
|||
<view style="display: flex;flex-direction: row;margin-top: 8px;"> |
|||
|
|||
<text |
|||
style="color: #EE752F;border: 1px #EE752F solid; |
|||
border-radius: 8px;padding: 1px 10px;font-size: 10px;">{{data.weight}}{{data.specificationUnit}}/{{data.unitName}}</text> |
|||
|
|||
<text style="margin-left: 10px;color: #EE752F;border: 1px #EE752F solid; |
|||
border-radius: 8px;padding: 1px 10px;font-size: 10px;">{{data.remarks}}</text> |
|||
|
|||
</view> |
|||
|
|||
<!-- <text style="font-size: 12px;color: #E36443;margin-top: 8px;">提货截止日：{{data.periodValidity}}</text> --> |
|||
|
|||
<text style="font-size: 12px;color: #E36443;margin-top: 8px;">￥{{data.price}}元</text> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
|
|||
<view |
|||
style="display: flex;flex-direction: row;margin-top:10px;justify-content: space-between;padding: 16px 20px;"> |
|||
|
|||
<text style="font-size: 16px;font-weight: 600;font-family: sans-serif;">数量</text> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
|
|||
<image src="../../static/jian_icon.png" mode="aspectFill" style="width: 25px;height: 25px;" |
|||
@click.stop="jian(data)"> |
|||
</image> |
|||
|
|||
<text style="font-size: 16px;padding:5px; margin-left: 8px;margin-right: 8px;" |
|||
@click.stop="numberClick(data)">{{data.goodsNumber}}</text> |
|||
|
|||
<image src="../../static/jia_icon.png" mode="aspectFill" style="width: 25px;height: 25px;" |
|||
@click.stop="jia(data)"> |
|||
</image> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
|
|||
|
|||
<view style="position: absolute; bottom: 0px; display: flex;flex-direction: column;width: 100%; |
|||
box-sizing: border-box; padding-left: 16px;padding-right: 16px;background: #fff; height: 12vh; |
|||
border-top: 1px solid #EFEFEF;"> |
|||
|
|||
<!-- <view |
|||
style="display: flex;flex-direction: row;align-items: center; justify-content: center; margin-top:10px;"> |
|||
|
|||
<view id="bomView" style="display: flex;flex-direction: row;align-items: center;"> |
|||
<view style="color: #888;font-size: 10px;height: 10px;line-height: 10px;margin-top: 5px;"> |
|||
温馨提示：已订</view> |
|||
<view style="color: #FF5006;font-size: 15px;height: 15px;line-height: 15px;font-weight: bold;"> |
|||
{{page.weight}}斤 |
|||
</view> |
|||
|
|||
<view style="color: #888;font-size: 10px;height: 10px;line-height: 10px;margin-top: 5px;"> |
|||
，{{data.qssl}}斤起订。</view> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;" @click="showPop2()"> |
|||
<text |
|||
style="color: #6190D8;font-size: 13px;height: 10px;line-height: 10px;margin-top: 5px;text-decoration:underline;font-style:oblique;"> |
|||
起订说明</text> |
|||
<text |
|||
style="color: #6190D8;font-size: 13px;height: 10px;line-height: 10px;margin-top: 5px;margin-left: 2px;"> |
|||
>></text> |
|||
</view> |
|||
|
|||
</view> |
|||
</view> --> |
|||
|
|||
<view |
|||
style="display: flex;flex-direction: row; justify-content: center;align-items: center;margin-top: 10px;padding: 0px 10px;margin-bottom: 20px;"> |
|||
|
|||
<text style="background: #FF9900; color: #fff;font-size: 14px; padding: 0px 15px;height: 50px;line-height:50px;flex: 1;text-align: center; |
|||
border: 1px #FF9900 solid; border-radius: 25px;" @click="upDateShoppCart()">加入购物车</text> |
|||
|
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
|
|||
</view> |
|||
|
|||
<!-- 输入数量 --> |
|||
<view class="model" catchtouchmove='preventTouchMove' v-if='showModal1'></view> |
|||
<view class="modalDlg4" catchtouchmove='preventTouchMove' v-if='showModal1'> |
|||
|
|||
<view |
|||
style="display: flex;flex-direction: column;background: #fff; width: 80%; border-radius: 20px;box-sizing: border-box;"> |
|||
|
|||
<input type="number" placeholder="请输入数量" v-model="data.goodsNumber" |
|||
style="margin: 20px;border: 1px #bbb solid; padding: 5px;line-height: 30px;height: 30px;border-radius: 6px;" /> |
|||
<view |
|||
style="flex-shrink: 0;display: flex;flex-direction: row;align-items: center;justify-content: center;"> |
|||
<button class="button1" @click="colseDialog1()">取消</button> |
|||
<button class="button2" @click="saveNum()">确定</button> |
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
|
|||
<uni-popup ref="inputDialog2" type="dialog"> |
|||
<uni-popup-dialog ref="inputClose" mode="more" title="起订说明" :showConfirm="true" |
|||
:beforeClose="dialogBeforeClose2" @confirm="dialogInputConfirm2" |
|||
:content="data.qdxy"></uni-popup-dialog> |
|||
</uni-popup> |
|||
|
|||
</view> |
|||
|
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
showModal: false, |
|||
showModal1: false, |
|||
page: { |
|||
sid: '', |
|||
weight: "", |
|||
remarks: "", |
|||
price: "" |
|||
}, |
|||
data: { |
|||
picUrl: '', |
|||
name: '', |
|||
price: '', |
|||
remarks: '', |
|||
appContent: "" |
|||
}, |
|||
|
|||
dialogContent: "这里是协议内容，这里是协议内容,这里是协议内容，这里是协议内容,这里是协议内容，这里是协议内容,这里是协议内容，这里是协议内容这里是协议内容，这里是协议内容", |
|||
confirmText: "我知道了（5s）", |
|||
dialogBeforeClose: false, |
|||
dialogBeforeClose2: false, |
|||
countdown: 5, |
|||
|
|||
} |
|||
}, |
|||
onLoad(options) { |
|||
this.page.sid = options.sid |
|||
}, |
|||
onShow() { |
|||
this.request() |
|||
}, |
|||
filters: { |
|||
/** |
|||
* 处理富文本里的图片宽度自适应 |
|||
* 1.去掉img标签里的style、width、height属性 |
|||
* 2.img标签添加style属性：max-width:100%;height:auto |
|||
* 3.修改所有style里的width属性为max-width:100% |
|||
* 4.去掉<br/>标签 |
|||
* @param html |
|||
* @returns {void|string|*} |
|||
*/ |
|||
formatRichText(html) { |
|||
//控制小程序中图片大小 |
|||
if (html) { |
|||
let newContent = html.replace(/<img[^>]*>/gi, function(match, capture) { |
|||
match = match.replace(/style="[^"]+"/gi, '').replace(/style='[^']+'/gi, ''); |
|||
match = match.replace(/width="[^"]+"/gi, '').replace(/width='[^']+'/gi, ''); |
|||
match = match.replace(/height="[^"]+"/gi, '').replace(/height='[^']+'/gi, ''); |
|||
return match; |
|||
}); |
|||
newContent = newContent.replace(/style="[^"]+"/gi, function(match, capture) { |
|||
match = match.replace(/width:[^;]+;/gi, 'max-width:100%;').replace(/width:[^;]+;/gi, |
|||
'max-width:100%;'); |
|||
return match; |
|||
}); |
|||
newContent = newContent.replace(/<br[^>]*\/>/gi, ''); |
|||
newContent = newContent.replace(/\<img/gi, |
|||
'<img style="max-width:100%;height:auto;display:block;margin:10rpx auto;"'); |
|||
return newContent; |
|||
} else { |
|||
return '暂无商品详情'; |
|||
} |
|||
}, |
|||
}, |
|||
methods: { |
|||
showDialog() { |
|||
this.showModal = true |
|||
}, |
|||
colseDialog() { |
|||
this.showModal = false |
|||
}, |
|||
colseDialog1() { |
|||
this.showModal1 = false |
|||
}, |
|||
saveNum() { |
|||
this.showModal1 = false |
|||
}, |
|||
jian(item) { |
|||
if (Number(item.goodsNumber) > 0) { |
|||
item.goodsNumber = Number(item.goodsNumber) - 1 |
|||
} |
|||
}, |
|||
jia(item) { |
|||
item.goodsNumber = Number(item.goodsNumber) + 1 |
|||
}, |
|||
numberClick(item) { |
|||
this.showModal1 = true |
|||
}, |
|||
|
|||
request() { |
|||
|
|||
var params = { |
|||
customerSid: getApp().globalData.sid, |
|||
sid: this.page.sid, |
|||
} |
|||
|
|||
console.log("request", params); |
|||
|
|||
|
|||
let _this = this |
|||
|
|||
_this.$api.goodsDetail(params).then((resp) => { |
|||
// console.log(resp); |
|||
_this.data = resp |
|||
|
|||
_this.getAllPriceOrWeight() |
|||
|
|||
// _this.$nextTick(() => { |
|||
// _this.$refs.pageView.setLoadState(2) |
|||
// }) |
|||
}).catch(e => { |
|||
_this.$nextTick(() => { |
|||
_this.$refs.pageView.setLoadState(1) |
|||
}) |
|||
}) |
|||
}, |
|||
|
|||
getAllPriceOrWeight() { |
|||
let _this = this |
|||
|
|||
var params = { |
|||
customerSid: getApp().globalData.sid, |
|||
brandId: _this.data.brandId, |
|||
} |
|||
|
|||
console.log("getGoodsWeight", params); |
|||
|
|||
_this.$api.getGoodsWeight(params).then((resp) => { |
|||
|
|||
console.log("getGoodsWeight", resp); |
|||
|
|||
_this.page.price = resp.totalPrice |
|||
_this.page.weight = resp.totalWeight |
|||
_this.page.remarks = resp.remarks |
|||
|
|||
|
|||
_this.$nextTick(() => { |
|||
_this.$refs.pageView.setLoadState(2) |
|||
}) |
|||
|
|||
}).catch(e => { |
|||
_this.$nextTick(() => { |
|||
_this.$refs.pageView.setLoadState(1) |
|||
}) |
|||
}) |
|||
}, |
|||
|
|||
inCart() { |
|||
|
|||
// this.data.goodsNumber = Number(this.data.goodsNumber) + 1 |
|||
|
|||
this.upDateShoppCart() |
|||
}, |
|||
upDateShoppCart() { |
|||
var good = { |
|||
goodsSid: this.data.sid, |
|||
goodsName: this.data.name, |
|||
goodsNumber: this.data.goodsNumber, |
|||
affiliation: this.data.brandId, |
|||
price: this.data.mefenPrice, |
|||
weight: this.data.weight, |
|||
customerSid: getApp().globalData.sid |
|||
} |
|||
|
|||
let _this = this |
|||
|
|||
console.log("upDateShoppCart", good); |
|||
|
|||
_this.$api.addShoppingCart(good).then((resp) => { |
|||
_this.shortToast('已加入购物车。') |
|||
_this.getAllPriceOrWeight() |
|||
_this.showModal = false |
|||
uni.navigateBack() |
|||
}).catch(e => { |
|||
_this.showModal = false |
|||
}) |
|||
}, |
|||
settlement() { |
|||
// 支付 |
|||
|
|||
if (this.page.weight < parseInt(this.data.qssl)) { |
|||
this.shortToast('满' + this.data.qssl + '斤才可定制云菜窖哦，请继续选菜吧。') |
|||
return |
|||
} |
|||
|
|||
this.showPop() |
|||
|
|||
}, |
|||
showPop() { |
|||
|
|||
this.$refs.inputDialog.open() |
|||
|
|||
let timeOut = setInterval(() => { |
|||
|
|||
if (this.countdown == 1) { |
|||
this.confirmText = "确定" |
|||
this.countdown = 5 |
|||
this.dialogBeforeClose = false |
|||
clearInterval(timeOut) |
|||
|
|||
} else { |
|||
this.dialogBeforeClose = true |
|||
this.countdown = this.countdown - 1; |
|||
this.confirmText = "我知道了" + "（" + this.countdown + "s）" |
|||
} |
|||
}, 1000) |
|||
}, |
|||
saveGoods() { |
|||
|
|||
|
|||
var params = { |
|||
customerSid: getApp().globalData.sid, |
|||
// cardNumber: 1, |
|||
brandId: this.data.brandId, |
|||
totalTee: this.page.price, |
|||
|
|||
// ordOrderDetailsVoList: list |
|||
} |
|||
console.log("params", params); |
|||
|
|||
let _this = this |
|||
_this.$api.createVegeOrder(params).then((resp) => { |
|||
|
|||
// console.log("resp", resp); |
|||
this.$pay(resp) |
|||
}).catch(e => {}) |
|||
|
|||
|
|||
}, |
|||
|
|||
gotoCart() { |
|||
uni.navigateTo({ |
|||
url: 'shoppCart?affiliation=' + this.data.brandId + "&weight=" + this.data.qssl + "&qdxy=" + |
|||
this.data.qdxy |
|||
}) |
|||
}, |
|||
showPop2() { |
|||
|
|||
this.$refs.inputDialog2.open() |
|||
|
|||
}, |
|||
dialogInputConfirm(val) { |
|||
if (this.confirmText == "确定") { |
|||
this.confirmText = "我知道了（5s）", |
|||
this.dialogBeforeClose = true, |
|||
this.countdown = 5 |
|||
this.saveGoods() |
|||
} |
|||
|
|||
}, |
|||
|
|||
dialogInputConfirm2(val) { |
|||
console.log(">>>>>>>>>>>", this.dialogBeforeClose2); |
|||
this.dialogBeforeClose2 = false |
|||
}, |
|||
|
|||
|
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
uni-page-body, |
|||
page { |
|||
background: #f3f4f6; |
|||
} |
|||
|
|||
/* 弹窗样式 */ |
|||
.model { |
|||
position: absolute; |
|||
width: 100%; |
|||
height: 100%; |
|||
background: #000; |
|||
z-index: 1; |
|||
opacity: 0.5; |
|||
top: 0; |
|||
left: 0; |
|||
} |
|||
|
|||
.modalDlg { |
|||
/* 设置超出滚动 */ |
|||
overflow: auto; |
|||
width: 100%; |
|||
position: fixed; |
|||
top: 70vw; |
|||
left: 0; |
|||
right: 0; |
|||
bottom: 0; |
|||
z-index: 1; |
|||
background-color: #fff; |
|||
border-top-right-radius: 20px; |
|||
border-top-left-radius: 20px; |
|||
display: flex; |
|||
flex-direction: column; |
|||
} |
|||
|
|||
.modalDlg4 { |
|||
/* 设置超出滚动 */ |
|||
overflow: auto; |
|||
position: fixed; |
|||
z-index: 2; |
|||
display: flex; |
|||
width: 100%; |
|||
height: 100%; |
|||
top: 0; |
|||
left: 0; |
|||
flex-direction: column; |
|||
justify-content: center; |
|||
align-items: center; |
|||
} |
|||
|
|||
button::after { |
|||
border: 0; |
|||
} |
|||
|
|||
.button1 { |
|||
|
|||
background: #fff; |
|||
color: #666; |
|||
flex: 1; |
|||
border-radius: 0px; |
|||
border-bottom-left-radius: 20px; |
|||
border: 1px solid #eee; |
|||
} |
|||
|
|||
.button2 { |
|||
background: #fff; |
|||
color: #FF9900; |
|||
border-radius: 0px; |
|||
border-bottom-right-radius: 20px; |
|||
flex: 1; |
|||
border: 1px solid #eee; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,351 @@ |
|||
<template> |
|||
<view style="height: 100vh;background: #fff;"> |
|||
<loading-state ref="pageView" @request="request"> |
|||
<view style="height: 100vh;overflow: hidden;overflow-y: auto;"> |
|||
<image :src="data.picUrl" style="width: 100vw;height: 80vw;" mode="aspectFill"></image> |
|||
|
|||
<view style="display: flex;flex-direction: column;background: #fff;padding: 20px 20px 0px 20px;margin-top: 10px; |
|||
border-top-left-radius: 20px;border-top-right-radius: 20px;height: 100%;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;justify-content: space-between;align-items: center;"> |
|||
<text |
|||
style="font-size: 18px;font-weight: 600;font-family: sans-serif;color: #333;">{{data.name}}</text> |
|||
<text style="font-size: 13px;color: #FF7A11;">￥{{data.price}}</text> |
|||
</view> |
|||
|
|||
<view style="display: flex;flex-direction: row;justify-content: space-between;margin-top: 10px;"> |
|||
<text style="font-size: 13px;color: #666;">单    价</text> |
|||
<text |
|||
style="font-size: 13px;color: #999;">{{data.weight}}{{data.specificationUnit}}/{{data.unitName}}</text> |
|||
</view> |
|||
<view style="display: flex;flex-direction: row;justify-content: space-between;margin-top: 10px;"> |
|||
<text style="font-size: 13px;color: #666;">规    格</text> |
|||
<text style="font-size: 13px;color: #999;">{{data.remarks}}</text> |
|||
</view> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 20px;"> |
|||
|
|||
<view style="width: 2px;height: 15px;background: #FF7A11;margin-right: 10px;"></view> |
|||
<text style="font-size: 14px;font-weight: 600;font-family: sans-serif;color: #333;">商品详情</text> |
|||
|
|||
</view> |
|||
|
|||
<view style="margin-top: 10px;" v-show="!data.appContent==''"> |
|||
<rich-text :nodes="data.appContent | formatRichText"></rich-text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
</loading-state> |
|||
|
|||
<!-- <view style="position: absolute; bottom: 0px; display: flex;flex-direction: column;width: 100%; |
|||
box-sizing: border-box; padding-left: 16px;padding-right: 16px;background: #fff; height: 13vh;"> |
|||
|
|||
<view |
|||
style="display: flex;flex-direction: row;align-items: center; justify-content: center; margin-top:10px;"> |
|||
|
|||
<view id="bomView" style="display: flex;flex-direction: row;align-items: center;"> |
|||
<view style="color: #888;font-size: 10px;height: 10px;line-height: 10px;margin-top: 5px;"> |
|||
温馨提示：已订</view> |
|||
<view style="color: #FF5006;font-size: 15px;height: 15px;line-height: 15px;font-weight: bold;"> |
|||
{{page.weight}}斤 |
|||
</view> |
|||
|
|||
<view style="color: #888;font-size: 10px;height: 10px;line-height: 10px;margin-top: 5px;"> |
|||
，{{data.qssl}}斤起订。</view> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;" @click="showPop2()"> |
|||
<text |
|||
style="color: #6190D8;font-size: 13px;height: 10px;line-height: 10px;margin-top: 5px;text-decoration:underline;font-style:oblique;"> |
|||
起订说明</text> |
|||
<text |
|||
style="color: #6190D8;font-size: 13px;height: 10px;line-height: 10px;margin-top: 5px;margin-left: 2px;"> |
|||
>></text> |
|||
</view> |
|||
|
|||
</view> |
|||
</view> |
|||
|
|||
<view |
|||
style="display: flex;flex-direction: row; justify-content: center;align-items: center;margin-top: 10px;padding: 0px 10px;margin-bottom: 20px;"> |
|||
|
|||
<text style="background: #FF9900; color: #fff;font-size: 13px; padding: 0px 15px;height: 40px;line-height: 40px; |
|||
border: 1px #FF5006 solid; border-top-left-radius: 25px; border-bottom-left-radius: 25px;flex-shrink: 0;" |
|||
@click="inCart()">加入购物车</text> |
|||
|
|||
<view style="border: 1px #FF5006 solid;margin-left: 5px;margin-right: 5px;padding: 0px 5px;height: 42px;flex: 1; |
|||
display: flex;flex-direction: row;align-items: center;box-sizing: border-box;" @click="gotoCart()"> |
|||
<image src="../../static/shoppCart_icon.png" mode="aspectFill" |
|||
style="height: 20px;width: 20px;flex-shrink: 0;"> |
|||
</image> |
|||
<view style="display: flex;flex-direction: column;flex: 1;"> |
|||
<text |
|||
style="font-size: 15px;color: #FF5006;margin-left: 5px;height: 20px;line-height: 20px;margin-top: 5px;font-weight: bold;">￥{{page.price}}</text> |
|||
<text v-if="page.remarks!=''" |
|||
style="font-size: 10px;color: #666;margin-left: 5px; height: 10px;line-height: 10px;margin-bottom: 5px;">{{page.remarks}}</text> |
|||
</view> |
|||
</view> |
|||
|
|||
<text style="background: #FF9900; color: #fff;font-size: 13px; padding: 0px 15px;height: 40px;line-height: 40px; |
|||
border: 1px #FF5006 solid; border-top-right-radius: 25px; border-bottom-right-radius: 25px;flex-shrink: 0;" |
|||
@click="settlement()">结算</text> |
|||
|
|||
</view> |
|||
</view> |
|||
|
|||
<uni-popup ref="inputDialog" type="dialog"> |
|||
<uni-popup-dialog ref="inputClose" mode="more" title="订购协议" :showConfirm="true" |
|||
:beforeClose="dialogBeforeClose" @confirm="dialogInputConfirm" :content="data.dgxy" |
|||
:confirm-text="confirmText"></uni-popup-dialog> |
|||
</uni-popup> |
|||
|
|||
<uni-popup ref="inputDialog2" type="dialog"> |
|||
<uni-popup-dialog ref="inputClose" mode="more" title="起订说明" :showConfirm="true" |
|||
:beforeClose="dialogBeforeClose2" @confirm="dialogInputConfirm2" |
|||
:content="data.qdxy"></uni-popup-dialog> |
|||
</uni-popup> --> |
|||
|
|||
</view> |
|||
|
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
page: { |
|||
sid: '', |
|||
weight: "", |
|||
remarks: "", |
|||
price: "" |
|||
}, |
|||
data: { |
|||
picUrl: '', |
|||
name: '', |
|||
price: '', |
|||
remarks: '', |
|||
appContent: "" |
|||
}, |
|||
|
|||
dialogContent: "这里是协议内容，这里是协议内容,这里是协议内容，这里是协议内容,这里是协议内容，这里是协议内容,这里是协议内容，这里是协议内容这里是协议内容，这里是协议内容", |
|||
confirmText: "我知道了（5s）", |
|||
dialogBeforeClose: false, |
|||
dialogBeforeClose2: false, |
|||
countdown: 5, |
|||
|
|||
} |
|||
}, |
|||
onLoad(options) { |
|||
this.page.sid = options.sid |
|||
}, |
|||
onShow() { |
|||
this.request() |
|||
}, |
|||
filters: { |
|||
/** |
|||
* 处理富文本里的图片宽度自适应 |
|||
* 1.去掉img标签里的style、width、height属性 |
|||
* 2.img标签添加style属性：max-width:100%;height:auto |
|||
* 3.修改所有style里的width属性为max-width:100% |
|||
* 4.去掉<br/>标签 |
|||
* @param html |
|||
* @returns {void|string|*} |
|||
*/ |
|||
formatRichText(html) { |
|||
//控制小程序中图片大小 |
|||
if (html) { |
|||
let newContent = html.replace(/<img[^>]*>/gi, function(match, capture) { |
|||
match = match.replace(/style="[^"]+"/gi, '').replace(/style='[^']+'/gi, ''); |
|||
match = match.replace(/width="[^"]+"/gi, '').replace(/width='[^']+'/gi, ''); |
|||
match = match.replace(/height="[^"]+"/gi, '').replace(/height='[^']+'/gi, ''); |
|||
return match; |
|||
}); |
|||
newContent = newContent.replace(/style="[^"]+"/gi, function(match, capture) { |
|||
match = match.replace(/width:[^;]+;/gi, 'max-width:100%;').replace(/width:[^;]+;/gi, |
|||
'max-width:100%;'); |
|||
return match; |
|||
}); |
|||
newContent = newContent.replace(/<br[^>]*\/>/gi, ''); |
|||
newContent = newContent.replace(/\<img/gi, |
|||
'<img style="max-width:100%;height:auto;display:block;margin:10rpx auto;"'); |
|||
return newContent; |
|||
} else { |
|||
return '暂无商品详情'; |
|||
} |
|||
}, |
|||
}, |
|||
methods: { |
|||
request() { |
|||
|
|||
var params = { |
|||
customerSid: getApp().globalData.sid, |
|||
sid: this.page.sid, |
|||
} |
|||
|
|||
console.log("request", params); |
|||
|
|||
|
|||
let _this = this |
|||
|
|||
_this.$api.goodsDetail(params).then((resp) => { |
|||
// console.log(resp); |
|||
_this.data = resp |
|||
|
|||
_this.getAllPriceOrWeight() |
|||
|
|||
// _this.$nextTick(() => { |
|||
// _this.$refs.pageView.setLoadState(2) |
|||
// }) |
|||
}).catch(e => { |
|||
_this.$nextTick(() => { |
|||
_this.$refs.pageView.setLoadState(1) |
|||
}) |
|||
}) |
|||
}, |
|||
|
|||
getAllPriceOrWeight() { |
|||
let _this = this |
|||
|
|||
var params = { |
|||
customerSid: getApp().globalData.sid, |
|||
brandId: _this.data.brandId, |
|||
} |
|||
|
|||
console.log("getGoodsWeight", params); |
|||
|
|||
_this.$api.getGoodsWeight(params).then((resp) => { |
|||
|
|||
console.log("getGoodsWeight", resp); |
|||
|
|||
_this.page.price = resp.totalPrice |
|||
_this.page.weight = resp.totalWeight |
|||
_this.page.remarks = resp.remarks |
|||
|
|||
|
|||
_this.$nextTick(() => { |
|||
_this.$refs.pageView.setLoadState(2) |
|||
}) |
|||
|
|||
}).catch(e => { |
|||
_this.$nextTick(() => { |
|||
_this.$refs.pageView.setLoadState(1) |
|||
}) |
|||
}) |
|||
}, |
|||
|
|||
inCart() { |
|||
|
|||
this.data.goodsNumber = Number(this.data.goodsNumber) + 1 |
|||
|
|||
this.upDateShoppCart() |
|||
}, |
|||
upDateShoppCart() { |
|||
var good = { |
|||
goodsSid: this.data.sid, |
|||
goodsName: this.data.name, |
|||
goodsNumber: this.data.goodsNumber, |
|||
affiliation: this.data.brandId, |
|||
price: this.data.mefenPrice, |
|||
weight: this.data.weight, |
|||
customerSid: getApp().globalData.sid |
|||
} |
|||
|
|||
let _this = this |
|||
_this.$api.addShoppingCart(good).then((resp) => { |
|||
_this.shortToast('已加入购物车。') |
|||
_this.getAllPriceOrWeight() |
|||
}).catch(e => { |
|||
|
|||
}) |
|||
}, |
|||
settlement() { |
|||
// 支付 |
|||
|
|||
if (this.page.weight < parseInt(this.data.qssl)) { |
|||
this.shortToast('满' + this.data.qssl + '斤才可定制云菜窖哦，请继续选菜吧。') |
|||
return |
|||
} |
|||
|
|||
this.showPop() |
|||
|
|||
}, |
|||
showPop() { |
|||
|
|||
this.$refs.inputDialog.open() |
|||
|
|||
let timeOut = setInterval(() => { |
|||
|
|||
if (this.countdown == 1) { |
|||
this.confirmText = "确定" |
|||
this.countdown = 5 |
|||
this.dialogBeforeClose = false |
|||
clearInterval(timeOut) |
|||
|
|||
} else { |
|||
this.dialogBeforeClose = true |
|||
this.countdown = this.countdown - 1; |
|||
this.confirmText = "我知道了" + "（" + this.countdown + "s）" |
|||
} |
|||
}, 1000) |
|||
}, |
|||
saveGoods() { |
|||
|
|||
|
|||
var params = { |
|||
customerSid: getApp().globalData.sid, |
|||
// cardNumber: 1, |
|||
brandId: this.data.brandId, |
|||
totalTee: this.page.price, |
|||
|
|||
// ordOrderDetailsVoList: list |
|||
} |
|||
console.log("params", params); |
|||
|
|||
let _this = this |
|||
_this.$api.createVegeOrder(params).then((resp) => { |
|||
|
|||
// console.log("resp", resp); |
|||
this.$pay(resp) |
|||
}).catch(e => {}) |
|||
|
|||
|
|||
}, |
|||
|
|||
gotoCart() { |
|||
uni.navigateTo({ |
|||
url: 'shoppCart?affiliation=' + this.data.brandId + "&weight=" + this.data.qssl + "&qdxy=" + |
|||
this.data.qdxy |
|||
}) |
|||
}, |
|||
showPop2() { |
|||
|
|||
this.$refs.inputDialog2.open() |
|||
|
|||
}, |
|||
dialogInputConfirm(val) { |
|||
if (this.confirmText == "确定") { |
|||
this.confirmText = "我知道了（5s）", |
|||
this.dialogBeforeClose = true, |
|||
this.countdown = 5 |
|||
this.saveGoods() |
|||
} |
|||
|
|||
}, |
|||
|
|||
dialogInputConfirm2(val) { |
|||
console.log(">>>>>>>>>>>", this.dialogBeforeClose2); |
|||
this.dialogBeforeClose2 = false |
|||
}, |
|||
|
|||
|
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
uni-page-body, |
|||
page { |
|||
background: #f3f4f6; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,396 @@ |
|||
<template> |
|||
<view style="width: 100%;height: 100%;background: #FFA35A;display: flex;flex-direction: column;"> |
|||
|
|||
<NavBar ref="nav" navTitle="预约提货" :showIcon="true" :supportChange="false"> |
|||
</NavBar> |
|||
|
|||
<loading-state ref="pageView" @request="request"> |
|||
|
|||
<!-- <view style="background: #FFA35A;width: 100%;height: 100%;"> --> |
|||
|
|||
|
|||
<view style="display: flex;flex-direction: column;background: #F2F2F2; width: 100%; |
|||
border-radius: 25px;height: 100vh; padding: 10px;box-sizing: border-box;"> |
|||
|
|||
<view style="display: flex;flex-direction: column;background: #fff; |
|||
border-radius: 15px;padding: 15px 10px;"> |
|||
|
|||
<view v-if="info.storeSid!=''" |
|||
style="display: flex;flex-direction: row;align-items: center;justify-content: space-between;"> |
|||
|
|||
<text |
|||
style="font-size: 16px;color: #000; font-weight: 600;font-family: sans-serif;">{{info.storeName}}</text> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;" @click="address()"> |
|||
<text style="font-size: 12px;color: #FF9900;">切换</text> |
|||
<image src="../../static/right_icon.png" style="width: 15px;height: 15px;margin-left: 5px;"> |
|||
</image> |
|||
</view> |
|||
</view> |
|||
|
|||
<view v-if="info.storeSid==''" |
|||
style="display: flex;flex-direction: row;align-items: center;justify-content: space-between;"> |
|||
|
|||
<text |
|||
style="font-size: 16px;color: #000; font-weight: 600;font-family: sans-serif;">暂无提货点信息</text> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;" @click="address()"> |
|||
<text style="font-size: 12px;color: #FF9900;">去完善</text> |
|||
<image src="../../static/right_icon.png" style="width: 15px;height: 15px;margin-left: 5px;"> |
|||
</image> |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
<view v-if="info.storeSid!=''" |
|||
style="display: flex;flex-direction: row;align-items: center;margin-top: 15px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/date.png" style="width:20px;height: 20px;"> |
|||
</image> |
|||
<text |
|||
style="margin-left: 5px;flex: 1;color: #666;font-size: 14px;">{{info.businessHours}}</text> |
|||
|
|||
</view> |
|||
|
|||
<view v-if="info.storeSid!=''" |
|||
style="display: flex;flex-direction: row;align-items: center;margin-top: 15px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/location.png" |
|||
style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text style="margin-left: 5px;flex: 1; color: #666;font-size: 14px;">{{info.address}}</text> |
|||
|
|||
</view> |
|||
|
|||
|
|||
<view |
|||
style="display: flex;flex-direction: row;align-items: center;justify-content: center;margin-top: 16px;"> |
|||
<text |
|||
style="font-size: 14px;color: #000; font-weight: 600;font-family: sans-serif; flex: 1;">提货时间</text> |
|||
|
|||
<uni-datetime-picker type="date" v-model="info.reserveDate" :start="info.start" |
|||
:clearIcon="false" :border="false" :end="info.end" :disabledDate="disabledDate" /> |
|||
<image src="../../static/right_icon.png" style="width: 15px;height: 15px;margin-left: 5px;"> |
|||
</image> |
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
|
|||
<view style="margin-top: 10px;display: flex;flex-direction: row;background: #fff;align-items: center; |
|||
border-radius: 15px;padding: 15px 10px;justify-content: space-between;"> |
|||
|
|||
<text style="font-size: 14px;color: #000; font-weight: 600;font-family: sans-serif;">提货人</text> |
|||
|
|||
<view v-if="info.name!=''" style="display: flex;flex-direction: row;align-items: center;" |
|||
@click="changePer()"> |
|||
|
|||
<text |
|||
style="font-size: 14px;color: #000; font-weight: 600;font-family: sans-serif;">{{info.name}}</text> |
|||
<text style="font-size: 12px;color: #999; margin-left: 8px;">{{info.phone}}</text> |
|||
|
|||
<image src="../../static/right_icon.png" style="width: 15px;height: 15px;margin-left: 5px;"> |
|||
</image> |
|||
</view> |
|||
|
|||
<view v-if="info.name==''" style="display: flex;flex-direction: row;align-items: center;" |
|||
@click="changePer()"> |
|||
|
|||
<text style="font-size: 12px;color: #999; margin-left: 8px;">去完善</text> |
|||
|
|||
<image src="../../static/right_icon.png" style="width: 15px;height: 15px;margin-left: 5px;"> |
|||
</image> |
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
|
|||
|
|||
<view |
|||
style="margin-top: 10px;display: flex;flex-direction: column;background: #fff;border-radius: 15px;padding: 10px;"> |
|||
|
|||
<text style="font-size: 15px; color: #000; font-weight: 600;font-family: sans-serif;">提货列表</text> |
|||
|
|||
<scroll-view scroll-y="true" style="max-height:calc(100vh - 450px); width: 100%; box-sizing: border-box; margin-top: 10px;; |
|||
" bindscrolltoupper="upper" bindscrolltolower="lower" bindscroll="scroll"> |
|||
|
|||
<view style="width: 100%; display: flex;flex-direction: column; margin-top: 10px;"> |
|||
<view v-for="(item,index) in pickingUpGoods" |
|||
style="display: flex;flex-direction: column;justify-content: center;width: 100%; margin-top: 15px; "> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;width: 100%; "> |
|||
|
|||
<image :src="item.iconUrl" @click="itemClick(item.goodsSid)" |
|||
style="width: 90px;height: 90px; border-radius: 10px; " mode="aspectFill"> |
|||
</image> |
|||
|
|||
<view |
|||
style="display: flex;flex-direction: column;flex: 1; padding-bottom: 15px; margin-left: 10px;" |
|||
:style="{'border-bottom':(index == pickingUpGoods.length-1 ? 'none' : '1px #EFEFEF solid')}"> |
|||
|
|||
<text style="font-size: 13px;color: #000;" |
|||
@click="itemClick(item.goodsSid)">{{item.name}}</text> |
|||
|
|||
<text |
|||
style="font-size: 10px;color: #999;margin-top: 5px;">{{item.remark}}</text> |
|||
|
|||
<view |
|||
style="display: flex;flex-direction: row;align-items: center;margin-top: 8px;"> |
|||
<text |
|||
style="border: 1px #EE752F solid; border-radius: 5px; padding: 0px 8px; |
|||
font-size: 10px;color: #EE752F; margin-right: 10px; ">{{item.weight}}{{item.specificationUnit}}/{{item.unitName}}</text> |
|||
|
|||
<text |
|||
style="border: 1px #EE752F solid; background: #FF9900; color: #fff; font-size: 10px;border-radius: 5px; padding: 0px 8px;" |
|||
v-if="item.type=='0'">百姓菜!</text> |
|||
<text |
|||
style="border: 1px #3AA15F solid; background: #40C772; color: #fff; font-size: 10px;border-radius: 5px; padding: 0px 8px;" |
|||
v-if="item.type=='1'">精品菜!</text> |
|||
<text |
|||
style="border: 1px #1D60C7 solid; background: #2489F7; color: #fff; font-size: 10px;border-radius: 5px; padding: 0px 8px;" |
|||
v-if="item.type=='2'">企业菜!</text> |
|||
|
|||
</view> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;justify-content: space-between; margin-top: 15px; |
|||
margin-right: 15px;"> |
|||
|
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<text style="font-size: 12px;color: #FF5006;">存量：</text> |
|||
<text |
|||
style="font-size: 14px;color: #FF5006;">{{item.goodsNumber}}{{item.unitName}}</text> |
|||
</view> |
|||
|
|||
|
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
|
|||
<image src="../../static/jian_icon.png" mode="aspectFill" |
|||
style="width: 20px;height: 20px;" @click.stop="jian(item)"> |
|||
</image> |
|||
|
|||
<text |
|||
style="font-size: 14px;margin-left: 8px;margin-right: 8px;">{{item.count}}</text> |
|||
<image src="../../static/jia_icon.png" mode="aspectFill" |
|||
style="width: 20px;height: 20px;" @click.stop="jia(item)"> |
|||
</image> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</scroll-view> |
|||
|
|||
</view> |
|||
|
|||
<view |
|||
style="position: fixed;bottom: 0; width: 100%; box-sizing: border-box; padding-left: 10vw;padding-right: 10vw;display: flex;flex-direction: row; justify-content: center;align-items: center;"> |
|||
<text style=" background: #FF9900;color: #fff;margin-bottom: 20px; border-radius: 20px; |
|||
padding-top: 10px;padding-bottom: 10px;padding-left: 25vw;padding-right: 25vw; text-align: center;" |
|||
@click="congirmExtract()">确认提货</text> |
|||
</view> |
|||
|
|||
</view> |
|||
<!-- </view> --> |
|||
</loading-state> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
affiliation: "", |
|||
info: { |
|||
|
|||
}, |
|||
pickingUpGoods: [], |
|||
disabledDate: [ |
|||
// '2023-12-16' |
|||
], |
|||
btnDisabled: false |
|||
} |
|||
}, |
|||
onLoad(options) { |
|||
|
|||
uni.$on("address", (e) => { |
|||
// 相当与下拉刷新 |
|||
this.info.storeSid = e.sid; |
|||
this.info.storeName = e.name; |
|||
this.info.businessHours = e.businessHours; |
|||
this.info.address = e.address; |
|||
}) |
|||
|
|||
uni.$on("changePer", (e) => { |
|||
// 相当与下拉刷新 |
|||
this.info.name = e.name; |
|||
this.info.phone = e.phone; |
|||
}) |
|||
|
|||
|
|||
this.request() |
|||
this.getSun() |
|||
|
|||
this.pickingUpGoods = JSON.parse(decodeURIComponent(options.pickingUpGoods)) |
|||
this.affiliation = options.affiliation |
|||
|
|||
console.log(">>>>>", options); |
|||
console.log(">>>>>", this.pickingUpGoods); |
|||
console.log(">>>>>", this.affiliation); |
|||
|
|||
}, |
|||
onUnload() { |
|||
uni.$off('address'); |
|||
uni.$off('changePer'); |
|||
}, |
|||
methods: { |
|||
itemClick(goodsSid) { |
|||
uni.navigateTo({ |
|||
url: '/pages/good/goodsDetail?sid=' + goodsSid |
|||
}) |
|||
}, |
|||
getSun() { |
|||
let _this = this |
|||
_this.$api.getExtractSaturAndSun().then((resp) => { |
|||
|
|||
_this.disabledDate = resp |
|||
|
|||
}).catch(e => { |
|||
|
|||
}) |
|||
}, |
|||
address() { |
|||
uni.navigateTo({ |
|||
url: '/pages/SelectAddressActivity' |
|||
}) |
|||
}, |
|||
changePer() { |
|||
uni.navigateTo({ |
|||
url: '/pages/good/changePersonnel?name=' + this.info.name + "&phone=" + this.info.phone |
|||
}) |
|||
}, |
|||
// 获取数据 |
|||
request() { |
|||
let _this = this |
|||
_this.$api.getStoreBySid(getApp().globalData.sid).then((resp) => { |
|||
_this.info = resp |
|||
_this.$nextTick(() => { |
|||
_this.$refs.pageView.setLoadState(2) |
|||
}) |
|||
|
|||
}).catch(e => { |
|||
console.log(e); |
|||
}) |
|||
}, |
|||
|
|||
jian(item) { |
|||
console.log("item》》》》", item) |
|||
const that = this |
|||
if (Number(item.count) == 1) { |
|||
|
|||
wx.showModal({ |
|||
content: '确定不要了吗', |
|||
cancelText: "再想想", |
|||
confirmText: "删除", |
|||
confirmColor: "#FF9900", |
|||
success(res) { |
|||
if (res.confirm) { |
|||
console.log('用户点击确定') |
|||
item.count = 0 |
|||
const index = that.pickingUpGoods.findIndex((info) => info.goodsSid === item |
|||
.goodsSid) |
|||
console.log("index》》》》", index) |
|||
that.pickingUpGoods.splice(index, 1) |
|||
} else if (res.cancel) { |
|||
|
|||
} |
|||
} |
|||
}) |
|||
|
|||
} else { |
|||
if (Number(item.count) > 0) { |
|||
item.count = Number(item.count) - 1 |
|||
} |
|||
|
|||
} |
|||
}, |
|||
jia(item) { |
|||
if (item.count < item.goodsNumber) |
|||
item.count = Number(item.count) + 1 |
|||
}, |
|||
congirmExtract() { |
|||
let _this = this |
|||
|
|||
if (this.btnDisabled) { |
|||
this.shortToast('请勿重复点击') |
|||
return |
|||
} |
|||
|
|||
this.btnDisabled = true |
|||
|
|||
if (_this.info.storeSid == '') { |
|||
this.shortToast('请完善提货点信息') |
|||
return |
|||
} |
|||
|
|||
|
|||
if (_this.info.reserveDate == '') { |
|||
this.shortToast('请选择日期') |
|||
return |
|||
} |
|||
|
|||
if (this.info.name == "" || this.info.phone == '') { |
|||
this.shortToast('请完善提菜人信息') |
|||
return |
|||
} |
|||
|
|||
let list = [] |
|||
|
|||
for (var i = 0; i < this.pickingUpGoods.length; i++) { |
|||
var item = this.pickingUpGoods[i] |
|||
if (item.count > 0) |
|||
list.push({ |
|||
goodsSid: item.goodsSid, |
|||
select: item.count, |
|||
}) |
|||
} |
|||
// console.log("ddd", list); |
|||
|
|||
if (list.length == 0) { |
|||
this.shortToast('请添加商品') |
|||
return |
|||
} |
|||
|
|||
var params = { |
|||
customerSid: getApp().globalData.sid, |
|||
affiliation: _this.affiliation, |
|||
reserveDate: _this.info.reserveDate, |
|||
storeSid: _this.info.storeSid, |
|||
userName: _this.info.name, |
|||
userPhone: _this.info.phone, |
|||
goodsVos: list |
|||
} |
|||
console.log("pppp", params); |
|||
|
|||
_this.$api.submissionExtract(params).then((resp) => { |
|||
uni.navigateBack() |
|||
_this.btnDisabled = false |
|||
}).catch(e => { |
|||
console.log(e); |
|||
_this.btnDisabled = false |
|||
}) |
|||
}, |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
|
|||
</style> |
|||
@ -0,0 +1,373 @@ |
|||
<template> |
|||
<view style="height: 100vh; width: 100%; background: #F2F2F2; |
|||
display: flex;flex-direction: column;overflow: scroll;"> |
|||
<loading-state ref="pageView" @request="request"> |
|||
|
|||
<!-- <scroll-view scroll-y="true" style="min-height: calc(100% - 15vw); width: 100%; margin-top: 10px;" |
|||
bindscrolltoupper="upper" bindscrolltolower="lower" bindscroll="scroll"> --> |
|||
|
|||
<view style="width: 100%; display: flex;flex-direction: column;"> |
|||
<view v-for="(item,index) in data" style="display: flex;flex-direction: column;justify-content: center; margin: 10px 10px 0px 10px; |
|||
padding: 10px; border-radius: 15px; background-color: #fff; "> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;width: 100%; "> |
|||
|
|||
<image :src="item.iconUrl" @click="itemClick(item.goodsSid)" |
|||
style="width: 90px;height: 90px; border-radius: 10px; " mode="aspectFill"></image> |
|||
|
|||
<view style="display: flex;flex-direction: column;flex: 1; |
|||
margin-left: 10px;"> |
|||
|
|||
<text style="font-size: 13px;color: #000;" |
|||
@click="itemClick(item.goodsSid)">{{item.goodsName}}</text> |
|||
|
|||
<text style="font-size: 10px;color: #999;margin-top: 5px;">{{item.remarks}}</text> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 8px;"> |
|||
<text style="border: 1px #EE752F solid; border-radius: 5px; padding: 0px 8px; |
|||
font-size: 10px;color: #EE752F;">{{item.jprice}}元/{{item.specificationUnit}}</text> |
|||
<text |
|||
style="border: 1px #EE752F solid; border-radius: 5px; padding: 0px 8px; |
|||
font-size: 10px;color: #EE752F; margin-left: 10px; margin-right: 10px; ">{{item.weight}}{{item.specificationUnit}}/{{item.unitName}}</text> |
|||
<!-- <text |
|||
style="background: #FF9900; color: #fff; font-size: 10px;padding: 0px 8px; border-radius: 5px;">￥{{item.mefenPrice}}</text> --> |
|||
</view> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;justify-content: space-between; margin-top: 15px; |
|||
margin-right: 15px;"> |
|||
<text style="font-size: 14px;color: #FF5006;">￥{{item.price}}</text> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
|
|||
<image src="../../static/jian_icon.png" mode="aspectFill" |
|||
style="width: 20px;height: 20px;" @click.stop="jian(item)"></image> |
|||
|
|||
<text |
|||
style="font-size: 14px;margin-left: 8px;margin-right: 8px;">{{item.goodsNumber}}</text> |
|||
<image src="../../static/jia_icon.png" mode="aspectFill" |
|||
style="width: 20px;height: 20px;" @click.stop="jia(item)"></image> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
<view style="height: 150px; background: #F2F2F2;"></view> |
|||
</view> |
|||
|
|||
<view v-if="notData" style="display: flex;flex-direction: column;align-items: center;margin-top: -30vw;"> |
|||
|
|||
<image src="https://supervise.yxtsoft.com/lpk/image/not_Cart.png" mode="aspectFit" |
|||
style="width: 50vw;height: 50vw;"></image> |
|||
<view style="display: flex;flex-direction: column;align-items: center;margin-top: 10px;"> |
|||
<text style="font-size: 14px; color: #666;margin-right: 5px;">购菜车是空的</text> |
|||
<text style="font-size: 14px;color: #fff;padding: 8px 40px; border-radius: 20px; |
|||
background: -webkit-linear-gradient(left,#FFC369,#FF9901);margin-top: 10px;" @click="gotoShopp()">去逛逛</text> |
|||
</view> |
|||
</view> |
|||
|
|||
<!-- </scroll-view> --> |
|||
|
|||
<view style=" width: 100%; display: flex;flex-direction: column;position: fixed;bottom: 0;overflow:hidden; |
|||
justify-content: center;align-items: center; background: #fff;padding-top: 10px;"> |
|||
|
|||
<view id="bomView" style="display: flex;flex-direction: row;align-items: center;"> |
|||
<view style="color: #888;font-size: 10px;height: 10px;line-height: 10px;margin-top: 5px;"> |
|||
温馨提示：已订</view> |
|||
<view style="color: #FF5006;font-size: 15px;height: 15px;line-height: 15px;font-weight: bold;"> |
|||
{{page.weight}}斤 |
|||
</view> |
|||
|
|||
<view style="color: #888;font-size: 10px;height: 10px;line-height: 10px;margin-top: 5px;"> |
|||
，{{page.qssl}}斤起订。</view> |
|||
<view style="display: flex;flex-direction: row;align-items: center;" @click="showPop()"> |
|||
<text |
|||
style="color: #6190D8;font-size: 13px;height: 10px;line-height: 10px;margin-top: 5px;text-decoration:underline;font-style:oblique;"> |
|||
起订说明</text> |
|||
<text |
|||
style="color: #6190D8;font-size: 13px;height: 10px;line-height: 10px;margin-top: 5px;margin-left: 2px;"> |
|||
>></text> |
|||
</view> |
|||
</view> |
|||
|
|||
<view |
|||
style=" width: 100%; box-sizing: border-box; padding-left: 50px;padding-right: 50px; |
|||
display: flex;flex-direction: row; justify-content: center;align-items: center;margin-top: 10px;margin-bottom: 20px;"> |
|||
|
|||
<view |
|||
style="border: 1px #FF5006 solid;margin-left: 5px;margin-right: 5px;padding: 0px 5px;height: 42px; flex: 1; |
|||
display: flex;flex-direction: row;align-items: center;border-top-left-radius: 25px; border-bottom-left-radius: 25px;"> |
|||
<image src="../../static/shoppCart_icon.png" mode="aspectFill" |
|||
style="height: 20px;width: 20px;flex-shrink: 0;margin-left: 10px;"> |
|||
</image> |
|||
<view style="display: flex;flex-direction: column;flex: 1;"> |
|||
<text style="font-size: 15px;color: #FF5006;margin-left: 10px; ">￥{{page.price}}</text> |
|||
<text style="font-size: 10px;color: #666;margin-left: 10px; ">{{page.remarks}}</text> |
|||
</view> |
|||
</view> |
|||
<text style="background: #FF9900; color: #fff;font-size: 13px; padding: 0px 25px;height: 40px;line-height: 40px; |
|||
border: 1px #FF5006 solid; border-top-right-radius: 25px; border-bottom-right-radius: 25px;" |
|||
@click="settlement()">结算</text> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
</loading-state> |
|||
|
|||
<uni-popup ref="inputDialog" type="dialog"> |
|||
<uni-popup-dialog ref="inputClose" mode="base" title="起订说明" :showConfirm="true" |
|||
:beforeClose="dialogBeforeClose" @confirm="dialogInputConfirm" :content="page.qdxy"></uni-popup-dialog> |
|||
</uni-popup> |
|||
|
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
notData: false, |
|||
dialogBeforeClose: false, |
|||
page: { |
|||
affiliation: '', |
|||
weight: "0", |
|||
price: "0", |
|||
reduce: "0", |
|||
remarks: "", |
|||
qssl: "", |
|||
qdxy: "" |
|||
}, |
|||
data: [ |
|||
|
|||
] |
|||
} |
|||
}, |
|||
onLoad(options) { |
|||
this.page.affiliation = options.affiliation |
|||
this.page.qssl = options.weight |
|||
this.page.qdxy = options.qdxy |
|||
console.log(" options", options); |
|||
|
|||
}, |
|||
onShow() { |
|||
this.request() |
|||
}, |
|||
methods: { |
|||
gotoShopp() { |
|||
uni.reLaunch({ |
|||
url: "/pages/home/cloudCard2" |
|||
}) |
|||
}, |
|||
showPop() { |
|||
|
|||
this.$refs.inputDialog.open() |
|||
|
|||
}, |
|||
|
|||
dialogInputConfirm() { |
|||
this.dialogBeforeClose = false |
|||
}, |
|||
request() { |
|||
let _this = this |
|||
|
|||
var params = { |
|||
customerSid: getApp().globalData.sid, |
|||
brandId: _this.page.affiliation |
|||
} |
|||
|
|||
_this.$api.shoppingCartList(params).then((resp) => { |
|||
console.log("resp", resp); |
|||
_this.data = resp |
|||
|
|||
_this.notData = resp.length == 0 |
|||
// _this.getallPrice() |
|||
// _this.getweight() |
|||
_this.getAllPriceOrWeight() |
|||
|
|||
}).catch(e => { |
|||
// 错误 1 |
|||
_this.$nextTick(() => { |
|||
_this.$refs.pageView.setLoadState(1) |
|||
}) |
|||
}) |
|||
}, |
|||
itemClick(goodsSid) { |
|||
uni.navigateTo({ |
|||
url: '/pages/good/goodsDetail?sid=' + goodsSid |
|||
}) |
|||
}, |
|||
|
|||
jian(item) { |
|||
const that = this |
|||
console.log("item》》》》", item) |
|||
// if (Number(item.goodsNumber) == 1) { |
|||
|
|||
// wx.showModal({ |
|||
// content: '确定不要了吗', |
|||
// cancelText: "再想想", |
|||
// confirmText: "删除", |
|||
// confirmColor: "#FF9900", |
|||
// success(res) { |
|||
// if (res.confirm) { |
|||
// console.log('用户点击确定') |
|||
// item.goodsNumber = 0 |
|||
// const index = that.data.findIndex((info) => info.goodsSid === item.goodsSid) |
|||
// console.log("index》》》》", index) |
|||
// that.data.splice(index, 1) |
|||
// // that.getallPrice() |
|||
// // that.getweight() |
|||
|
|||
// that.notData = that.data.length == 0 |
|||
|
|||
// that.upDateShoppCart(item) |
|||
// } else if (res.cancel) { |
|||
|
|||
// } |
|||
// } |
|||
// }) |
|||
|
|||
// } else { |
|||
if (Number(item.goodsNumber) > 0) { |
|||
item.goodsNumber = Number(item.goodsNumber) - 1 |
|||
|
|||
if (Number(item.goodsNumber) == 0) { |
|||
const index = that.data.findIndex((info) => info.goodsSid === item.goodsSid) |
|||
console.log("index》》》》", index) |
|||
that.data.splice(index, 1) |
|||
|
|||
that.notData = that.data.length == 0 |
|||
|
|||
} |
|||
|
|||
} |
|||
|
|||
|
|||
|
|||
item.totalPrice = Number(item.goodsNumber) * Number(item.price) |
|||
// that.getallPrice() |
|||
// that.getweight() |
|||
that.upDateShoppCart(item) |
|||
// } |
|||
|
|||
}, |
|||
jia(item) { |
|||
|
|||
item.goodsNumber = Number(item.goodsNumber) + 1 |
|||
item.totalPrice = Number(item.goodsNumber) * Number(item.price) |
|||
|
|||
// this.getallPrice() |
|||
// this.getweight() |
|||
this.upDateShoppCart(item) |
|||
|
|||
}, |
|||
|
|||
getAllPriceOrWeight() { |
|||
let _this = this |
|||
|
|||
var params = { |
|||
customerSid: getApp().globalData.sid, |
|||
brandId: this.page.affiliation, |
|||
} |
|||
|
|||
_this.$api.getGoodsWeight(params).then((resp) => { |
|||
console.log("getGoodsWeight", resp); |
|||
|
|||
_this.page.price = resp.totalPrice |
|||
_this.page.weight = resp.totalWeight |
|||
_this.page.remarks = resp.remarks |
|||
|
|||
|
|||
_this.$nextTick(() => { |
|||
_this.$refs.pageView.setLoadState(2) |
|||
}) |
|||
|
|||
}).catch(e => { |
|||
_this.$nextTick(() => { |
|||
_this.$refs.pageView.setLoadState(1) |
|||
}) |
|||
}) |
|||
}, |
|||
|
|||
|
|||
getallPrice() { |
|||
|
|||
let num = 0; |
|||
for (var i = 0; i < this.data.length; i++) { |
|||
num += Number(this.data[i].totalPrice); |
|||
} |
|||
|
|||
this.page.price = num |
|||
}, |
|||
|
|||
getweight() { |
|||
|
|||
let num = 0; |
|||
for (var i = 0; i < this.data.length; i++) { |
|||
num += Number(this.data[i].weight) * Number(this.data[i].goodsNumber); |
|||
|
|||
} |
|||
|
|||
this.page.weight = num |
|||
|
|||
}, |
|||
|
|||
upDateShoppCart(item) { |
|||
var good = { |
|||
goodsSid: item.goodsSid, |
|||
goodsName: item.goodsName, |
|||
goodsNumber: item.goodsNumber, |
|||
affiliation: this.page.affiliation, |
|||
price: item.price, |
|||
weight: item.weight, |
|||
customerSid: getApp().globalData.sid |
|||
} |
|||
|
|||
let _this = this |
|||
_this.$api.addShoppingCart(good).then((resp) => { |
|||
_this.getAllPriceOrWeight() |
|||
}).catch(e => { |
|||
_this.$nextTick(() => { |
|||
_this.$refs.pageView.setLoadState(1) |
|||
}) |
|||
}) |
|||
}, |
|||
|
|||
settlement() { |
|||
// 支付 |
|||
|
|||
if (this.page.weight < parseInt(this.page.qssl)) { |
|||
this.shortToast('满' + this.page.qssl + '斤才可定制云菜窖哦，请继续选菜吧。') |
|||
return |
|||
} |
|||
|
|||
var params = { |
|||
customerSid: getApp().globalData.sid, |
|||
// cardNumber: 1, |
|||
brandId: this.page.affiliation, |
|||
totalTee: this.page.price, |
|||
|
|||
// ordOrderDetailsVoList: list |
|||
} |
|||
console.log("params", params); |
|||
|
|||
let _this = this |
|||
_this.$api.createVegeOrder(params).then((resp) => { |
|||
|
|||
// console.log("resp", resp); |
|||
this.$pay(resp) |
|||
}).catch(e => {}) |
|||
|
|||
}, |
|||
|
|||
|
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
|
|||
</style> |
|||
@ -0,0 +1,272 @@ |
|||
<template> |
|||
<view style="width: 100%;height: 100%;background: #FFA35A;display: flex;flex-direction: column;"> |
|||
|
|||
<!-- <NavBar ref="nav" navTitle="转赠亲友" :showIcon="true" :supportChange="false"> |
|||
</NavBar> --> |
|||
|
|||
<view |
|||
style="display: flex;flex-direction: column;background: #f7f7f7;padding: 10px;border-radius: 15px; height: 100vh;width: 100%; box-sizing: border-box;"> |
|||
|
|||
<scroll-view scroll-y="true" style="height: calc(100vh - 150px); width: 100%; background: #fff;padding: 10px; box-sizing: border-box; |
|||
" bindscrolltoupper="upper" bindscrolltolower="lower" bindscroll="scroll"> |
|||
<view style="display: flex;flex-direction: column;"> |
|||
|
|||
<view v-for="(item,index) in pickingUpGoods" |
|||
style=" display: flex;flex-direction: row;margin-top: 15px; margin-bottom: 10px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;width: 100%; "> |
|||
|
|||
<image :src="item.iconUrl" style="width: 90px;height: 90px; border-radius: 10px; " |
|||
mode="aspectFill" @click="itemClick(item.goodsSid)"></image> |
|||
|
|||
<view |
|||
style="display: flex;flex-direction: column;flex: 1; padding-bottom: 15px; margin-left: 10px;" |
|||
:style="{'border-bottom':(index == goods.length-1 ? 'none' : '1px #EFEFEF solid')}"> |
|||
|
|||
<text style="font-size: 14px;color: #000; font-weight: 600;" |
|||
@click="itemClick(item.goodsSid)">{{item.name}}</text> |
|||
|
|||
<text style="font-size: 10px;color: #999;margin-top: 5px;">{{item.remark}}</text> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 8px;"> |
|||
<text style="border: 1px #EE752F solid; border-radius: 5px; padding: 0px 8px; |
|||
font-size: 10px;color: #EE752F;">{{item.weight}}{{item.specificationUnit}}/{{item.unitName}}</text> |
|||
|
|||
<text |
|||
style="border: 1px #EE752F solid; background: #FF9900;margin-left: 10px; color: #fff; font-size: 10px;border-radius: 5px; padding: 0px 8px;" |
|||
v-if="item.type=='0'">百姓菜!</text> |
|||
<text |
|||
style="border: 1px #3AA15F solid; background: #40C772;margin-left: 10px; color: #fff; font-size: 10px;border-radius: 5px; padding: 0px 8px;" |
|||
v-if="item.type=='1'">精品菜!</text> |
|||
<text |
|||
style="border: 1px #1D60C7 solid; background: #2489F7;margin-left: 10px; color: #fff; font-size: 10px;border-radius: 5px; padding: 0px 8px;" |
|||
v-if="item.type=='2'">企业菜!</text> |
|||
</view> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;justify-content: space-between; margin-top: 15px; |
|||
margin-right: 15px;"> |
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<text style="font-size: 10px;color: #FF5006;">存量：</text> |
|||
<text |
|||
style="font-size: 14px;color: #FF5006;">{{item.goodsNumber}}{{item.unitName}}</text> |
|||
</view> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
|
|||
<image src="../../static/jian_icon.png" mode="aspectFill" |
|||
style="width: 20px;height: 20px;" @click.stop="jian(item)"></image> |
|||
|
|||
<text |
|||
style="font-size: 14px;margin-left: 8px;margin-right: 8px;">{{item.count}}</text> |
|||
<image src="../../static/jia_icon.png" mode="aspectFill" |
|||
style="width: 20px;height: 20px;" @click.stop="jia(item)"></image> |
|||
|
|||
</view> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
|
|||
<view v-if="transferNotData" |
|||
style="display: flex;flex-direction: column;justify-content: center;align-items: center;margin-top: 5vw;"> |
|||
|
|||
<image src="https://supervise.yxtsoft.com/lpk/image/supplementing.png" mode="aspectFit" |
|||
style="width: 50vw;height: 50vw;"></image> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: -15px;"> |
|||
<text style=" border-radius: 8px; padding: 3px 8px; color: #999;">没有商品咯,请添加~</text> |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
|
|||
|
|||
</scroll-view> |
|||
|
|||
|
|||
</view> |
|||
|
|||
|
|||
<view style="position: fixed;bottom: 0;display: flex;flex-direction: column; |
|||
border-top: 1px solid #f7f7f7; |
|||
justify-content: center;background: #fff; width: 100%;box-sizing:border-box;"> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 15px; |
|||
padding-left: 15px;padding-right: 15px;"> |
|||
<text style="font-size: 14px;margin-right: 10px;font-weight: 600;">转赠留言</text> |
|||
<input placeholder="可以写下您对亲友的祝福" |
|||
style="font-size: 30rpx;flex: 1;background: #F2F2F2;border-radius: 5px;height: 40px;line-height: 40px;padding-left: 10px;padding-right: 10px;" |
|||
:value="transferInfo.remarks" @input="onKeyInput" /> |
|||
</view> |
|||
|
|||
<button open-type="share" :disabled="transferNotData">确认</button> |
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
affiliation: "", |
|||
transferNotData: false, |
|||
transferInfo: { |
|||
|
|||
}, |
|||
pickingUpGoods: [], |
|||
} |
|||
}, |
|||
onLoad(options) { |
|||
|
|||
|
|||
this.pickingUpGoods = JSON.parse(decodeURIComponent(options.pickingUpGoods)) |
|||
this.affiliation = options.affiliation |
|||
|
|||
console.log(">>>>>", options); |
|||
console.log(">>>>>", this.pickingUpGoods); |
|||
console.log(">>>>>", this.affiliation); |
|||
|
|||
}, |
|||
onPageScroll(res) { |
|||
// 渐变 |
|||
this.$refs.nav.defaultColorBgAlpha(res) |
|||
}, |
|||
methods: { |
|||
itemClick(goodsSid) { |
|||
uni.navigateTo({ |
|||
url: '/pages/good/goodsDetail?sid=' + goodsSid |
|||
}) |
|||
}, |
|||
onKeyInput(event) { |
|||
this.transferInfo.remarks = event.target.value |
|||
}, |
|||
jian(item) { |
|||
console.log("item》》》》", item) |
|||
const that = this |
|||
if (Number(item.count) == 1) { |
|||
|
|||
wx.showModal({ |
|||
content: '确定不要了吗', |
|||
cancelText: "再想想", |
|||
confirmText: "删除", |
|||
confirmColor: "#FF9900", |
|||
success(res) { |
|||
if (res.confirm) { |
|||
console.log('用户点击确定') |
|||
item.count = 0 |
|||
const index = that.pickingUpGoods.findIndex((info) => info.goodsSid === item |
|||
.goodsSid) |
|||
console.log("index》》》》", index) |
|||
that.pickingUpGoods.splice(index, 1) |
|||
|
|||
that.transferNotData = that.pickingUpGoods.length == 0 |
|||
|
|||
} else if (res.cancel) { |
|||
|
|||
} |
|||
} |
|||
}) |
|||
|
|||
} else { |
|||
if (Number(item.count) > 0) { |
|||
item.count = Number(item.count) - 1 |
|||
} |
|||
|
|||
} |
|||
}, |
|||
jia(item) { |
|||
if (item.count < item.goodsNumber) |
|||
item.count = Number(item.count) + 1 |
|||
}, |
|||
|
|||
onShareAppMessage: function(res) { |
|||
|
|||
let _this = this |
|||
const promise = new Promise(resolve => { |
|||
// 模拟网络请求 |
|||
setTimeout(() => { |
|||
|
|||
var list = [] |
|||
for (var i = 0; i < this.pickingUpGoods.length; i++) { |
|||
var item = this.pickingUpGoods[i] |
|||
|
|||
if (item.count > 0) { |
|||
list.push({ |
|||
goodsSid: item.goodsSid, |
|||
select: item.count |
|||
}) |
|||
} |
|||
|
|||
} |
|||
|
|||
var params = { |
|||
customerSid: getApp().globalData.sid, |
|||
brandId: _this.affiliation, |
|||
remarks: _this.transferInfo.remarks, |
|||
vos: list |
|||
} |
|||
|
|||
// console.log("=========0", params); |
|||
|
|||
_this.$api.transSubmission(params).then((resp) => { |
|||
uni.navigateBack() |
|||
// console.log("=========", resp); |
|||
|
|||
let shareData = JSON.stringify({ |
|||
params: { |
|||
code: resp.transferCode, |
|||
codeKey: resp.sid |
|||
}, |
|||
functionName: 'bindCard', |
|||
url: '/pages/bind/bind_cloudCard?code=' + resp |
|||
.transferCode + "&codeKey=" + resp.sid |
|||
|
|||
// url: '/pages/home/cloudCard2?shareSid=' + getApp().globalData.sid, |
|||
// functionName: 'share' |
|||
}) |
|||
// 转码传输 |
|||
let value = encodeURIComponent(shareData) |
|||
|
|||
resolve({ |
|||
title: '汇融农链-云菜窖', |
|||
// ② |
|||
path: '/pages/login/login?data=' + value, |
|||
imageUrl: 'https://supervise.yxtsoft.com/lpk/image/share_transfer.png', //自定义图片路径，显示图片长宽比是 5:4。 |
|||
|
|||
}) |
|||
|
|||
}).catch(e => { |
|||
_this.shortToast('发生错误,请稍后再试.') |
|||
return |
|||
}) |
|||
|
|||
}, 0) |
|||
}) |
|||
|
|||
return promise |
|||
|
|||
}, |
|||
|
|||
|
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
button { |
|||
background: #FF9900; |
|||
color: #fff; |
|||
margin-top: 20px; |
|||
height: 40px; |
|||
width: 80%; |
|||
line-height: 40px; |
|||
text-align: center; |
|||
border-radius: 20px; |
|||
margin-bottom: 20px; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,304 @@ |
|||
<template> |
|||
|
|||
<view style="display: flex;flex-direction: column;height: 100vh;background: -webkit-linear-gradient(left,#FEA65F,#FB9440);"> |
|||
|
|||
<view class="top"> |
|||
<NavBar ref="nav" navTitle=" " :showIcon="false" :start-change-height="page.startHeight" |
|||
:end-change-height="page.endHeight"> |
|||
</NavBar> |
|||
<!-- <view class="topText"> |
|||
冬储文化是中国传统文化的一部分，是古人顺应自然、因时而食的智慧体现，是刻在老一辈骨子里的温暖记忆! |
|||
</view> --> |
|||
</view> |
|||
|
|||
<!-- <view |
|||
style="display: flex;flex-direction: column; height: 30vw; width: 100vw;background: #ff0;z-index: 1000; position: fixed; top:61vw "> |
|||
--> |
|||
|
|||
|
|||
<z-paging ref="paging" v-model="data" :pagingStyle='styleObject' @query="queryList" :refresher-enabled="true" > |
|||
|
|||
<view style="display: flex;flex-direction: row;justify-content: space-between; |
|||
margin:5px 20px 0px 20px;padding-bottom: 10px; border-bottom: 2px #EFEFEF solid;"> |
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<view style="background: #FF9900; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<view style="background: #FFCC7F; border-radius: 50%;width: 12px;height: 12px;"></view> |
|||
<text |
|||
style="margin-left: 8px;font-size: 16px;color: #FF9900;font-weight: 600;font-family: sans-serif;">精选蔬菜组合</text> |
|||
</view> |
|||
|
|||
<!-- <view style="border: 1px #FF9900 solid;font-size: 16px;color: #FF9900;font-weight: 600;font-family: sans-serif;border-radius: 15px; |
|||
padding:5px 15px;" @click="optionalClick()"> |
|||
+ 自选菜窖 |
|||
</view> --> |
|||
|
|||
</view> |
|||
|
|||
<view v-for="(item,index) in data" :key="index" |
|||
style="display: flex;flex-direction: column;margin-top: 14px;width: 100%;" |
|||
@click="detail(item)"> |
|||
|
|||
<view :style="{'border-bottom':(index===data.length-1 ? 'none':'1px #EFEFEF solid')}" style="display: flex;flex-direction: column; |
|||
margin-left: 20px;margin-right: 20px;padding-bottom: 10px;flex: 1;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;width: 100%; "> |
|||
<text style="flex: 1;margin-right: 10px;color: #000;font-size: 16px;">{{item.name}}</text> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<text style="color: #FCA45C; font-size: 12px;margin-right: 5px;">订窖</text> |
|||
<image src="@/static/right_icon.png" style="width: 15px;height: 15px;"></image> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center; margin-right: 10px;margin-top: 5px; width: 100%; "> |
|||
|
|||
<image :src='item.iconUrl' style="width: 70px;height: 70px;" mode="aspectFit"></image> |
|||
|
|||
<view style="display: flex;flex-direction: column;margin-left: 20px;flex: 1; width: 100%; margin-top: 5px;"> |
|||
|
|||
<text style="color: #999;font-size: 13px;width: 100%;line-height: 20px;">{{item.remarks}}</text> |
|||
|
|||
<view style="display: flex;flex-direction: row;justify-content:space-between;margin-top: 10px;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;"> |
|||
<text |
|||
style="border: 1px #EE752F solid; border-radius: 10px; color:#EE752F ; font-size: 14px; |
|||
margin-right: 10px;padding: 0px 8px;" |
|||
v-show="item.isRecommend=='1'">推荐</text> |
|||
<text |
|||
style="border: 1px #EE752F solid; border-radius: 10px; color: #EE752F;font-size: 12px;;padding: 0px 8px;">{{item.count}}</text> |
|||
</view> |
|||
|
|||
|
|||
<text style="color: #FF5006;font-size: 14px;">￥{{convertPrice(item.price)}}</text> |
|||
|
|||
</view> |
|||
|
|||
<view v-if="item.giftBagGoods.length>0"> |
|||
<view style="height: 10px;"></view> |
|||
|
|||
<view v-for="(child,pos) in item.giftBagGoods" :key="pos" |
|||
style="display: flex;flex-direction: row;align-items: center;width: calc(100vw - 120px);padding-top: 5px;box-sizing: border-box;"> |
|||
<image src="../../static/tck_mx_icon.png" style="width: 9px;height: 9px;"> |
|||
</image> |
|||
<view |
|||
style="font-size: 11px;color: #E99D42;padding-left: 5px;flex: 1;overflow: hidden;text-overflow: ellipsis;white-space: nowrap"> |
|||
{{child.name}} |
|||
</view> |
|||
<view style="font-size: 11px;color: #E99D42;flex-shrink: 0;margin-left: 23px;"> |
|||
{{child.count}} |
|||
</view> |
|||
<view style="font-size: 11px;color: #E99D42;min-width: 60px;text-align: right;padding-left: 5px;"> |
|||
{{child.spec}} |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
|
|||
<view slot="loadingMoreNoMore"> |
|||
<view style="display: flex;flex-direction: column;justify-content: center; align-items: center; margin-top: 20px; border-top: 2px #efefef solid; |
|||
padding-top: 20px; margin-left:20px;margin-right: 20px;"> |
|||
<text style="color: #888888; font-size: 13px;">您也可以自由选菜，自建惠享云菜窖。</text> |
|||
|
|||
<text style="color: #fff; font-size: 16px; font-weight: 600; font-family: sans-serif; background: #FCA45C; border-radius: 8px; padding: 10px 15px; margin-top: 15px;;" @click="optionalClick()">补充菜窖</text> |
|||
</view> |
|||
<view style="height: 20px;"></view> |
|||
</view> |
|||
|
|||
|
|||
</z-paging> |
|||
|
|||
<!-- </view> --> |
|||
</view> |
|||
|
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
styleObject: { |
|||
// 'position': 'fixed', |
|||
// 'top':'80vw', |
|||
'margin-top': '68vw', |
|||
'border-top-left-radius': '25px', |
|||
'border-top-right-radius': '25px', |
|||
'border-bottom-left-radius': '25px', |
|||
'border-bottom-right-radius': '25px', |
|||
'background': '#fff', |
|||
'padding-top': '10px', |
|||
'margin-bottom':"60px" |
|||
|
|||
}, |
|||
page: { |
|||
startHeight: 0, |
|||
endHeight: 0 |
|||
}, |
|||
data: [], |
|||
|
|||
} |
|||
}, |
|||
created() { |
|||
this.$bus.$on('order', msg => { |
|||
console.log("aaaaaaaaaaa4", msg) |
|||
this.$refs.paging.reload(true); |
|||
}); |
|||
}, |
|||
onShow(){ |
|||
if (typeof this.$mp.page.getTabBar === 'function' && this.$mp.page.getTabBar()) { |
|||
this.$mp.page.getTabBar().setData({ |
|||
selected: 0 |
|||
}) |
|||
|
|||
} |
|||
}, |
|||
|
|||
onLoad() { |
|||
|
|||
let info = uni.getSystemInfoSync(); |
|||
|
|||
this.page.startHeight = info.windowWidth * 0.6 |
|||
this.page.endHeight = info.windowWidth * 0.8 |
|||
}, |
|||
onUnload() { |
|||
uni.$off('order'); |
|||
}, |
|||
onPageScroll(res) { |
|||
// 渐变 |
|||
this.$refs.nav.defaultColorBgAlpha(res) |
|||
}, |
|||
methods: { |
|||
// 分页的请求 |
|||
queryList(pageNo, pageSize) { |
|||
let _this = this |
|||
_this.$api.appletGiftBagList().then((resp) => { |
|||
// 添加数据源 |
|||
// this.$refs.paging.complete(resp.records) |
|||
|
|||
this.$refs.paging.complete(resp) |
|||
}).catch(e => { |
|||
// 出错了，点击重试 |
|||
_this.$refs.paging.complete(false); |
|||
}) |
|||
}, |
|||
|
|||
detail(item) { |
|||
// 详情 |
|||
uni.navigateTo({ |
|||
url: '/pages/cloud/detail_cloudCard?sid=' + item.sid+"&name="+item.name |
|||
}) |
|||
}, |
|||
optionalClick(){ |
|||
uni.navigateTo({ |
|||
url: '/pages/cloud/optionalCard' |
|||
}) |
|||
|
|||
} |
|||
|
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
|
|||
._ellipsis { |
|||
overflow-wrap: break-word; |
|||
} |
|||
|
|||
.top { |
|||
width: 100vw; |
|||
/* height: 126.66vw; */ |
|||
height: 75vw; |
|||
/* 加载背景图 */ |
|||
background-image: url(https://supervise.yxtsoft.com/lpk/image/clound_bj1.png); |
|||
/* background-image: url(../../static/clound_bj1.png); */ |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
background-size: 100% 100%; |
|||
} |
|||
|
|||
.topText { |
|||
margin-top: 60vw; |
|||
margin-left: 7vw; |
|||
margin-right: 7vw; |
|||
border-radius: 15px; |
|||
background-color: #FFF0E5; |
|||
padding: 10px 10px; |
|||
font-size: 12px; |
|||
color: #FF9900; |
|||
font-weight: 600; |
|||
font-family: sans-serif; |
|||
} |
|||
|
|||
.btn { |
|||
/* margin-top: 97.86vw; */ |
|||
margin-top: 60vw; |
|||
width: 83%; |
|||
background-color: #FFF; |
|||
border-radius: 45px; |
|||
display: flex; |
|||
height: 13vw; |
|||
flex-direction: row; |
|||
justify-content: center; |
|||
align-items: center; |
|||
/* 加载背景图 */ |
|||
background-image: url(https://supervise.yxtsoft.com/lpk/image/bindBtn_bj1.png); |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
background-size: 100% 100%; |
|||
} |
|||
|
|||
.item { |
|||
/* 加载背景图 */ |
|||
background-image: url(https://supervise.yxtsoft.com/lpk/image/carPerson.png); |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
background-size: 100% 100%; |
|||
width: calc(100% - 18px); |
|||
} |
|||
|
|||
.item2 { |
|||
/* 加载背景图 */ |
|||
background-image: url(https://supervise.yxtsoft.com/lpk/image/caradLose.png); |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
background-size: 100% 100%; |
|||
width: calc(100% - 18px); |
|||
} |
|||
|
|||
.showBtn { |
|||
visibility: hidden; |
|||
} |
|||
|
|||
.use { |
|||
display: flex; |
|||
flex-direction: row; |
|||
border-top-left-radius: 20rpx; |
|||
border-top-right-radius: 20rpx; |
|||
color: #FFF; |
|||
align-items: center; |
|||
background: linear-gradient(89.8deg, rgba(218, 51, 33, 1) -3.76%, rgba(237, 113, 53, 0) 300.05%); |
|||
} |
|||
|
|||
.gray { |
|||
filter: grayscale(100%); |
|||
-webkit-filter: grayscale(100%); |
|||
transition: filter 0.2s; |
|||
} |
|||
|
|||
|
|||
|
|||
.oragin {} |
|||
|
|||
uni-page-body, |
|||
page { |
|||
background: #FFFFFF; |
|||
} |
|||
</style> |
|||
File diff suppressed because it is too large
@ -0,0 +1,260 @@ |
|||
<template> |
|||
<view style="display: flex;flex-direction: column;"> |
|||
|
|||
<view class="top"> |
|||
<NavBar ref="nav" navTitle="企业卡" :showIcon="false" :start-change-height="page.startHeight" |
|||
:end-change-height="page.endHeight"> |
|||
</NavBar> |
|||
<view style="display: flex;flex-direction: column;align-items: center;"> |
|||
<view class="btn" @click="bind"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/binding2.png" style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text |
|||
style="height: 45px;line-height: 45px;font-size: 17px; text-align: center;color: #fff;margin-left: 11px;">绑定企业卡</text> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<!-- |
|||
<view |
|||
style="display: flex;flex-direction: column;background: #fff;height:55vh;border-top-left-radius: 25px;border-top-right-radius: 25px;margin-top: -9.1vw;"> |
|||
--> |
|||
|
|||
<z-paging ref="paging" :pagingStyle='styleObject' v-model="data" @query="queryList" :refresher-enabled="true"> |
|||
<view v-for="(item,index) in data" :key="index" |
|||
style="display: flex;flex-direction: column;align-items: center;margin-top: 14px;" |
|||
:class="item.showBtn==true?'oragin':'gray'" @click="detail(item)"> |
|||
|
|||
<view class="item" :class="{ item2: !item.showBtn }"> |
|||
|
|||
<!-- 外边 18px 内边 32px = 50px --> |
|||
<view style="padding: 16px;display: flex;flex-direction: row;width: 100%;box-sizing: border-box;"> |
|||
|
|||
<!-- 礼包图标 总60px --> |
|||
<view style="flex-shrink: 0;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/enterpriseNormal.png" mode="aspectFill" |
|||
v-show="item.showBtn" style="width: 50px;height: 50px;margin-right: 10px;" /> |
|||
|
|||
<image src="https://supervise.yxtsoft.com/lpk/image/enterpriseLose.png" mode="aspectFill" |
|||
v-show="!item.showBtn" style="width: 50px;height: 50px;margin-right: 10px;" /> |
|||
</view> |
|||
|
|||
<view style="width: 100%;display: flex;flex-direction: column;"> |
|||
|
|||
<view style="display: flex;flex-direction: row; width: 100%;"> |
|||
<view style="flex: 1; display: flex;flex-direction: column;"> |
|||
<text class="_ellipsis" |
|||
style="font-size: 13px;color: #333;width: calc(100vw - 190px);">卡号:{{item.serialNumber}}</text> |
|||
<text class="_ellipsis" |
|||
style="font-size: 12px;color: ##6FADFF;margin-top: 5px;width: calc(100vw - 182px);">{{item.pname}}</text> |
|||
</view> |
|||
|
|||
<text :class="(item.showBtn)?'state1':'state2'"> |
|||
{{item.state}}</text> |
|||
|
|||
</view> |
|||
|
|||
|
|||
|
|||
<text style="font-size: 12px;color: ##6FADFF;margin-top: 5px;" |
|||
v-show="item.showBtn">企业卡内的商品及数量可以派生出“福礼卡”</text> |
|||
<text style="font-size: 12px;color: #999;margin-top: 5px;" |
|||
v-show="!item.showBtn">当前卡片已失效</text> |
|||
|
|||
<!-- 按钮 24 + 48 = 72px--> |
|||
<view v-show="item.showBtn" style="font-size: 12px;color:#fff;flex-shrink: 0; |
|||
text-align: center;margin-top: 5px; |
|||
border-radius: 15px; height: 30px;padding: 0px 12px;line-height: 30px;box-sizing: border-box; |
|||
background: -webkit-linear-gradient(left,#0473FF,#A4CDFF);">发放福礼卡</view> |
|||
|
|||
<!-- 蔬菜礼包经典款+状态 |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<text style="font-size: 15px;color: #FF7100;"> {{item.pname}}</text> |
|||
<text |
|||
style="border: 1px #FED4B3 solid;margin-left: 10px;border-radius: 15px;padding: 3px 10px; font-size: 12px; color: #FF6000;flex-shrink: 0;"> |
|||
{{item.state}}</text> |
|||
</view> --> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
</z-paging> |
|||
<!-- </view> --> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
data: [], |
|||
styleObject: { |
|||
'margin-top': '78vw', |
|||
'border-top-left-radius': '25px', |
|||
'border-top-right-radius': '25px', |
|||
'background': '#fff', |
|||
'padding-top': '10px', |
|||
}, |
|||
page: { |
|||
remarks: '', |
|||
startHeight: 0, |
|||
endHeight: 0 |
|||
}, |
|||
} |
|||
}, |
|||
created() { |
|||
this.$bus.$on('order3', msg => { |
|||
console.log("aaaaaaaaaaa4", msg) |
|||
this.$refs.paging.reload(true); |
|||
}); |
|||
}, |
|||
onLoad() { |
|||
let info = uni.getSystemInfoSync(); |
|||
|
|||
this.page.startHeight = info.windowWidth * 0.6 |
|||
this.page.endHeight = info.windowWidth * 0.8 |
|||
}, |
|||
methods: { |
|||
// 分页的请求 |
|||
queryList(pageNo, pageSize) { |
|||
let _this = this |
|||
_this.$api.empcardList({ |
|||
"current": pageNo, |
|||
"size": pageSize, |
|||
"params": { |
|||
"customerSid": getApp().globalData.sid |
|||
} |
|||
}).then((resp) => { |
|||
// 添加数据源 |
|||
this.$refs.paging.complete(resp.records) |
|||
}).catch(e => { |
|||
// 出错了，点击重试 |
|||
_this.$refs.paging.complete(false); |
|||
}) |
|||
}, |
|||
bind() { |
|||
uni.navigateTo({ |
|||
url: '/pages/bind/bind_enterpriseCard' |
|||
}) |
|||
}, |
|||
detail(item) { |
|||
|
|||
|
|||
if (item.showBtn) { |
|||
// 正常 |
|||
uni.navigateTo({ |
|||
url: '/pages/enterprise/corporate_card_detail?sid=' + item.sid |
|||
}) |
|||
} else { |
|||
// 过期 已完成 |
|||
uni.navigateTo({ |
|||
url: '/pages/enterprise/corporate_card_detail2?sid=' + item.sid |
|||
}) |
|||
} |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
._ellipsis { |
|||
overflow-wrap: break-word; |
|||
} |
|||
|
|||
.top { |
|||
width: 100vw; |
|||
/* height: 126.66vw; */ |
|||
height: 85vw; |
|||
/* 加载背景图 */ |
|||
background-image: url(https://supervise.yxtsoft.com/lpk/image/home_bj3.png); |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
background-size: 100% 100%; |
|||
} |
|||
|
|||
.btn { |
|||
/* margin-top: 97.86vw; */ |
|||
margin-top: 60vw; |
|||
width: 83%; |
|||
background-color: #FFF; |
|||
border-radius: 45px; |
|||
display: flex; |
|||
flex-direction: row; |
|||
justify-content: center; |
|||
align-items: center; |
|||
height: 13vw; |
|||
/* 加载背景图 */ |
|||
background-image: url(https://supervise.yxtsoft.com/lpk/image/bindBtn_bj3.png); |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
background-size: 100% 100%; |
|||
} |
|||
|
|||
.item { |
|||
/* 加载背景图 */ |
|||
background-image: url(https://supervise.yxtsoft.com/lpk/image/cardEnterprise.png); |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
background-size: 100% 100%; |
|||
width: calc(100% - 18px); |
|||
} |
|||
|
|||
.item2 { |
|||
/* 加载背景图 */ |
|||
background-image: url(https://supervise.yxtsoft.com/lpk/image/caradLose.png); |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
background-size: 100% 100%; |
|||
width: calc(100% - 18px); |
|||
} |
|||
|
|||
.showBtn { |
|||
visibility: hidden; |
|||
} |
|||
|
|||
.use { |
|||
display: flex; |
|||
flex-direction: row; |
|||
border-top-left-radius: 20rpx; |
|||
border-top-right-radius: 20rpx; |
|||
color: #FFF; |
|||
align-items: center; |
|||
background: linear-gradient(89.8deg, rgba(218, 51, 33, 1) -3.76%, rgba(237, 113, 53, 0) 300.05%); |
|||
} |
|||
|
|||
.gray { |
|||
filter: grayscale(100%); |
|||
-webkit-filter: grayscale(100%); |
|||
transition: filter 0.2s; |
|||
} |
|||
|
|||
|
|||
|
|||
.oragin {} |
|||
|
|||
uni-page-body, |
|||
page { |
|||
background: #FFFFFF; |
|||
} |
|||
|
|||
.state1 { |
|||
height: 17px; |
|||
border: 1px #6FADFF solid; |
|||
margin-left: 10px; |
|||
border-radius: 15px; |
|||
padding: 3px 10px; |
|||
font-size: 12px; |
|||
color: #6FADFF; |
|||
flex-shrink: 0; |
|||
} |
|||
|
|||
.state2 { |
|||
height: 17px; |
|||
border: 1px #D9D9D9 solid; |
|||
margin-left: 10px; |
|||
border-radius: 15px; |
|||
padding: 3px 10px; |
|||
font-size: 12px; |
|||
color: #7E7E7E; |
|||
flex-shrink: 0; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,245 @@ |
|||
<template> |
|||
|
|||
<view style="display: flex;flex-direction: column;"> |
|||
|
|||
<view class="top"> |
|||
<NavBar ref="nav" navTitle="福礼卡" :showIcon="false" :start-change-height="page.startHeight" |
|||
:end-change-height="page.endHeight"> |
|||
</NavBar> |
|||
<view style="display: flex;flex-direction: column;align-items: center;"> |
|||
<view class="btn" @click="bind"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/binding2.png" style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text |
|||
style="height: 45px;line-height: 45px;font-size: 17px; text-align: center;color: #fff;margin-left: 11px;">绑定福礼卡</text> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
<!-- |
|||
<view |
|||
style="display: flex;flex-direction: column;background: #fff;height:55vh;border-top-left-radius: 25px;border-top-right-radius: 25px;margin-top: -9.1vw;"> |
|||
--> |
|||
|
|||
<z-paging ref="paging2" v-model="data2" :pagingStyle='styleObject' @query="queryList2" :refresher-enabled="true"> |
|||
|
|||
<view v-for="(item,index) in data2" :key="index" |
|||
style="display: flex;flex-direction: column;align-items: center;margin-top: 14px;" |
|||
:class="item.showBtn==true?'oragin':'gray'" @click="detail2(item)"> |
|||
|
|||
<view class="item" :class="{ item2: !item.showBtn }"> |
|||
|
|||
<!-- 外边 18px 内边 32px = 50px --> |
|||
<view |
|||
style="padding: 16px;display: flex;flex-direction: row;width: 100%;box-sizing: border-box;"> |
|||
|
|||
<!-- 礼包图标 总60px --> |
|||
<view style="flex-shrink: 0;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/giftNormal.png" mode="aspectFill" |
|||
v-show="item.showBtn" style="width: 50px;height: 50px;margin-right: 10px;" /> |
|||
|
|||
<image src="https://supervise.yxtsoft.com/lpk/image/giftLose.png" mode="aspectFill" |
|||
v-show="!item.showBtn" style="width: 50px;height: 50px;margin-right: 10px;" /> |
|||
</view> |
|||
|
|||
<view |
|||
style="flex: 1;display: flex;flex-direction: column;box-sizing: border-box;flex-wrap: nowrap;"> |
|||
|
|||
<view style="width: 100%;display: flex;flex-direction: row;"> |
|||
|
|||
<view style="flex: 1;display: flex;flex-direction: column;"> |
|||
<text class="_ellipsis" |
|||
style="font-size: 13px;color: #333;width: calc(100vw - 190px);">卡号:{{item.serialNumber}}</text> |
|||
<text class="_ellipsis" |
|||
style="font-size: 12px;color: #999;margin-top: 5px;width: calc(100vw - 182px);"> |
|||
{{item.time}}</text> |
|||
</view> |
|||
|
|||
<!-- 按钮 24 + 48 = 72px--> |
|||
<view :class="{ showBtn: !item.showBtn }" style="font-size: 12px;color:#fff;flex-shrink: 0; |
|||
border-radius: 15px; height: 30px;padding: 0px 12px;line-height: 30px;box-sizing: border-box; |
|||
background: -webkit-linear-gradient(left,#FF2B00,#FA6B54);">预约提货</view> |
|||
</view> |
|||
|
|||
<!-- 蔬菜礼包经典款+状态 --> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<text style="font-size: 15px;color: #FF2B00;">福礼卡</text> |
|||
<text |
|||
style="border: 1px #FF2B00 solid;margin-left: 10px;border-radius: 15px;padding: 3px 10px; font-size: 12px; color: #FF2B00;flex-shrink: 0;"> |
|||
{{item.state}}</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
</z-paging> |
|||
|
|||
<!-- </view> --> |
|||
</view> |
|||
|
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
styleObject:{ |
|||
'margin-top': '78vw', |
|||
'border-top-left-radius': '25px', |
|||
'border-top-right-radius': '25px', |
|||
'background': '#fff', |
|||
'padding-top': '10px', |
|||
}, |
|||
page: { |
|||
remarks: '', |
|||
startHeight: 0, |
|||
endHeight: 0 |
|||
}, |
|||
data: [], |
|||
data2: [], |
|||
currentTab: 0, |
|||
} |
|||
}, |
|||
created() { |
|||
this.$bus.$on('order2', msg => { |
|||
console.log("aaaaaaaaaaa4", msg) |
|||
this.$refs.paging2.reload(true); |
|||
}); |
|||
}, |
|||
onLoad() { |
|||
let info = uni.getSystemInfoSync(); |
|||
|
|||
this.page.startHeight = info.windowWidth * 0.6 |
|||
this.page.endHeight = info.windowWidth * 0.8 |
|||
}, |
|||
onUnload() { |
|||
uni.$off('order2'); |
|||
}, |
|||
onPageScroll(res) { |
|||
// 渐变 |
|||
this.$refs.nav.defaultColorBgAlpha(res) |
|||
}, |
|||
methods: { |
|||
// 分页的请求 |
|||
queryList2(pageNo, pageSize) { |
|||
let _this = this |
|||
_this.$api.gifcardList({ |
|||
"current": pageNo, |
|||
"size": pageSize, |
|||
"params": { |
|||
"customerSid": getApp().globalData.sid |
|||
} |
|||
}).then((resp) => { |
|||
// 添加数据源 |
|||
this.$refs.paging2.complete(resp.records) |
|||
}).catch(e => { |
|||
// 出错了，点击重试 |
|||
_this.$refs.paging2.complete(false); |
|||
}) |
|||
}, |
|||
|
|||
bind() { |
|||
uni.navigateTo({ |
|||
url: '/pages/bind/bind_giftCard' |
|||
}) |
|||
}, |
|||
detail2(item) { |
|||
|
|||
if (item.showBtn) { |
|||
// 正常 |
|||
uni.navigateTo({ |
|||
url: '/pages/enterprise/welfare_card_detail?sid=' + item.sid |
|||
}) |
|||
} else { |
|||
// 过期 已完成 |
|||
uni.navigateTo({ |
|||
url: '/pages/enterprise/welfare_card_detail2?sid=' + item.sid |
|||
}) |
|||
} |
|||
}, |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
._ellipsis { |
|||
overflow-wrap: break-word; |
|||
} |
|||
|
|||
.top { |
|||
width: 100vw; |
|||
/* height: 126.66vw; */ |
|||
height: 85vw; |
|||
/* 加载背景图 */ |
|||
background-image: url(https://supervise.yxtsoft.com/lpk/image/home_bj2.png); |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
background-size: 100% 100%; |
|||
} |
|||
|
|||
.btn { |
|||
/* margin-top: 97.86vw; */ |
|||
margin-top: 60vw; |
|||
width: 83%; |
|||
background-color: #FFF; |
|||
border-radius: 45px; |
|||
display: flex; |
|||
height: 13vw; |
|||
flex-direction: row; |
|||
justify-content: center; |
|||
align-items: center; |
|||
/* 加载背景图 */ |
|||
background-image: url(https://supervise.yxtsoft.com/lpk/image/bindBtn_bj2.png); |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
background-size: 100% 100%; |
|||
} |
|||
|
|||
.item { |
|||
/* 加载背景图 */ |
|||
background-image: url(https://supervise.yxtsoft.com/lpk/image/cardGift.png); |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
background-size: 100% 100%; |
|||
width: calc(100% - 18px); |
|||
} |
|||
|
|||
.item2 { |
|||
/* 加载背景图 */ |
|||
background-image: url(https://supervise.yxtsoft.com/lpk/image/caradLose.png); |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
background-size: 100% 100%; |
|||
width: calc(100% - 18px); |
|||
} |
|||
|
|||
.showBtn { |
|||
visibility: hidden; |
|||
} |
|||
|
|||
.use { |
|||
display: flex; |
|||
flex-direction: row; |
|||
border-top-left-radius: 20rpx; |
|||
border-top-right-radius: 20rpx; |
|||
color: #FFF; |
|||
align-items: center; |
|||
background: linear-gradient(89.8deg, rgba(218, 51, 33, 1) -3.76%, rgba(237, 113, 53, 0) 300.05%); |
|||
} |
|||
|
|||
.gray { |
|||
filter: grayscale(100%); |
|||
-webkit-filter: grayscale(100%); |
|||
transition: filter 0.2s; |
|||
} |
|||
|
|||
|
|||
|
|||
.oragin {} |
|||
|
|||
uni-page-body, |
|||
page { |
|||
background: #FFFFFF; |
|||
} |
|||
|
|||
|
|||
</style> |
|||
File diff suppressed because it is too large
@ -0,0 +1,724 @@ |
|||
<template> |
|||
<view id="page"> |
|||
<!-- 顶部 --> |
|||
<view class="top"> |
|||
<NavBar ref="nav" navTitle=" " :showIcon="false" :start-change-height="page.startHeight" |
|||
:end-change-height="page.endHeight"></NavBar> |
|||
<!-- 用户信息 --> |
|||
<view class="userinfo" @click="showDiaLog"> |
|||
<!-- 头像 --> |
|||
<image class="head-img" :src="userInfo.photo"></image> |
|||
<view class="name-mob" style="flex: 1;"> |
|||
<!-- 昵称 --> |
|||
<text>{{userInfo.nick}}</text> |
|||
<!-- 手机 --> |
|||
<text style="font-size:14px;">{{userInfo.mobile}}</text> |
|||
</view> |
|||
<image src="../../static/more_white.png" |
|||
style="width: 30px;height: 30px;margin-right: 10px;flex-shrink: 0;" :rotate="0"></image> |
|||
</view> |
|||
<view style="display: flex;flex-direction: row;align-items: center; width: 100%; |
|||
position: absolute;bottom: 8vw; "> |
|||
<view style="flex: 1;"></view> |
|||
<view style="margin-right: 20px;display: flex;flex-direction: row;align-items: center;" |
|||
@click="makePhoneCall()"> |
|||
<image src="../../static/userService.png" style="width: 25px;height: 25px;margin-right: 5px;"> |
|||
</image> |
|||
<text style="color: #fff;font-size: 16px;">联系我们</text> |
|||
</view> |
|||
|
|||
</view> |
|||
</view> |
|||
<view class="view" style="z-index: 2;"> |
|||
<!-- 滚动视图 --> |
|||
<scroll-view scroll-y="true" class="scroll-view" bindscrolltoupper="upper" bindscrolltolower="lower" |
|||
bindscroll="scroll"> |
|||
<!-- 预约记录 --> |
|||
<view class="icon-cow"> |
|||
<text class="title">预约记录</text> |
|||
<view class="group"> |
|||
<!-- 待提菜 --> |
|||
<view class="icon-name" @click="itemClick('待提菜')"> |
|||
<view class="icon"> |
|||
<image class="img" src="../../static/img/record-query/waiting_extraction.png" |
|||
mode="aspectFill"></image> |
|||
<!-- <view v-if="data.count>0" class="count">{{data.count}}</view> --> |
|||
</view> |
|||
<text class="name">待提取</text> |
|||
</view> |
|||
<!-- 已提菜 --> |
|||
<view class="icon-name" @click="itemClick('已提菜')"> |
|||
<view class="icon"> |
|||
<image class="img" src="../../static/img/record-query/extracted.png" mode="aspectFill"> |
|||
</image> |
|||
</view> |
|||
<text class="name">已提取</text> |
|||
</view> |
|||
<view class="icon-name"></view> |
|||
<view class="icon-name"></view> |
|||
</view> |
|||
|
|||
</view> |
|||
<!-- 订单记录 --> |
|||
<view class="icon-cow"> |
|||
<text class="title">订单记录</text> |
|||
<view class="group"> |
|||
<view class="icon-name" @click="itemClick('我的订单')"> |
|||
<view class="icon"> |
|||
<image class="img" src="../../static/img/record-query/obligation.png" mode="aspectFill"> |
|||
</image> |
|||
<!-- <view class="count">{{data.count}}</view> --> |
|||
</view> |
|||
<text class="name">我的订单</text> |
|||
</view> |
|||
<view class="icon-name" @click="itemClick('已失效')"> |
|||
<view class="icon"> |
|||
<image class="img" src="../../static/img/record-query/invalid.png" mode="aspectFill"> |
|||
</image> |
|||
</view> |
|||
<text class="name">已失效</text> |
|||
</view> |
|||
<view class="icon-name"></view> |
|||
<view class="icon-name"></view> |
|||
|
|||
|
|||
</view> |
|||
</view> |
|||
<!-- 失效菜品 --> |
|||
<!-- <view class="icon-cow"> |
|||
<text class="title">失效菜品</text> |
|||
<view class="group"> |
|||
|
|||
<view class="icon-name" @click="itemClick('已失效')"> |
|||
<view class="icon"> |
|||
<image class="img" src="../../static/img/record-query/invalid.png" mode="aspectFill"> |
|||
</image> |
|||
</view> |
|||
<text class="name">已失效</text> |
|||
</view> |
|||
<view class="icon-name"></view> |
|||
<view class="icon-name"></view> |
|||
<view class="icon-name"></view> |
|||
</view> |
|||
</view> --> |
|||
<!-- 转赠记录 --> |
|||
<view class="icon-cow"> |
|||
<text class="title">转赠记录</text> |
|||
<view class="group"> |
|||
<!-- 赠与我的 --> |
|||
<view class="icon-name" @click="itemClick('赠与我的')"> |
|||
<view class="icon"> |
|||
<image class="img" src="../../static/img/record-query/gifted_to_me.png" |
|||
mode="aspectFill"></image> |
|||
</view> |
|||
<text class="name">收到的礼品</text> |
|||
</view> |
|||
<!-- 我的转赠 --> |
|||
<view class="icon-name" @click="itemClick('我的转赠')"> |
|||
<view class="icon"> |
|||
<image class="img" src="../../static/img/record-query/my_gift.png" mode="aspectFill"> |
|||
</image> |
|||
</view> |
|||
<text class="name">发出的礼品</text> |
|||
</view> |
|||
<view class="icon-name"></view> |
|||
<view class="icon-name"></view> |
|||
</view> |
|||
</view> |
|||
<!-- 推荐有礼 --> |
|||
<view style="display: flex;flex-direction: column; border-radius: 10px;background: #fff; |
|||
padding: 10px; margin-top: 10px;width: 100%;box-sizing: border-box; visibility: hidden;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;justify-content: space-between;width: 100%;"> |
|||
<view style="display: flex;flex-direction: row;align-items: center;flex: 1;"> |
|||
<text |
|||
style="font-size: 15px;color: #101010;font-weight: 600;font-family: sans-serif;">推荐有礼</text> |
|||
<image src="../../static/share_gift.png" |
|||
style="margin-left: 5px; width: 20px;height: 20px;"></image> |
|||
</view> |
|||
|
|||
<!-- <view style="display: flex;flex-direction: row;align-items: center;" @click=""> |
|||
<text style="margin-right: 5px;color: #FF9900;font-size: 12px;">马上邀请</text> |
|||
<image src="../../static/right_icon.png" style="width: 15px;height: 15px;"></image> |
|||
</view> --> |
|||
|
|||
<button open-type="share" style="margin-right: -20px;height: 20px;line-height: 20px;"> |
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<text style="margin-right: 5px;color: #FF9900;font-size: 12px;">马上邀请</text> |
|||
<image src="../../static/right_icon.png" style="width: 15px;height: 15px;"></image> |
|||
</view> |
|||
</button> |
|||
|
|||
</view> |
|||
|
|||
<text style="font-size: 12px;color: #4B4B4B; margin-top: 8px;" |
|||
v-if="recommend.remarks!=''">{{recommend.remarks}}</text> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center; margin-top: 10px;" |
|||
v-if="recommend.vos.length>0"> |
|||
|
|||
<!-- <image :src="recommend.iconUrl" style="width: 30%;height: 100px; border-radius: 10px;" |
|||
mode="aspectFill"> |
|||
|
|||
</image> --> |
|||
|
|||
<view |
|||
style="display: flex;flex-direction: column; margin-left:10px;width: 90%;box-sizing: border-box;"> |
|||
<view v-for="(child,pos) in recommend.vos" :key="pos" @click="recommendClick(child)" |
|||
style="display: flex;flex-direction: column;width: 100%;box-sizing: border-box;"> |
|||
|
|||
<text |
|||
style="color: #424242; font-size: 13px;line-height: 25px;">*{{child.remarks}}</text> |
|||
|
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
<!-- </loading-state> --> |
|||
</scroll-view> |
|||
</view> |
|||
|
|||
|
|||
<!-- 获取手机号弹框 --> |
|||
<view class="model" catchtouchmove='preventTouchMove' v-if='showModal1' @click="colseDialog1()"></view> |
|||
<view class="modalDlg4" catchtouchmove='preventTouchMove' v-if='showModal1'> |
|||
|
|||
<view style="display: flex;flex-direction: column;background: #fff; width: 80%; border-radius: 20px; |
|||
"> |
|||
<view |
|||
style="display: flex;flex-direction: column;align-items: center;justify-content: center;width: 100%;margin-top: 20px;"> |
|||
<image src="../../static/logo_icon.png" style="width: 10vw;height: 10vw;" mode="scaleToFill"> |
|||
</image> |
|||
<text |
|||
style="margin-top: 5px;color: #333;font-size: 18px;font-weight: 600;font-family: sans-serif;">云菜窖</text> |
|||
</view> |
|||
|
|||
|
|||
<view style="display: flex;margin-top: 10px;margin-left: 20px; margin-right: 20px;"> |
|||
<text style="color: #999;text-indent:2em;">为确保您能正常体验小程序功能，云菜窖需要获取您的手机号。</text> |
|||
</view> |
|||
|
|||
|
|||
<view |
|||
style="flex-shrink: 0;display: flex;flex-direction: row;align-items: center;justify-content: center;margin-top: 20px;"> |
|||
<button class="button1" @click="colseDialog1()">拒绝</button> |
|||
<button class="button2" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">同意</button> |
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
showModal1: false, |
|||
butdisabled: true, |
|||
page: { |
|||
startHeight: 0, |
|||
endHeight: 0 |
|||
}, |
|||
data: { |
|||
count: "1", |
|||
}, |
|||
userInfo: { |
|||
nick: "", |
|||
mobile: "绑定手机号", |
|||
photo: "../../static/userHead.png" |
|||
}, |
|||
dialogInfo: { |
|||
url: "../../static/userHead.png", |
|||
name: "", |
|||
mobile: "" |
|||
}, |
|||
headImage: "", |
|||
recommend: { |
|||
vos: [] |
|||
}, |
|||
banKInfo: null |
|||
} |
|||
}, |
|||
onShow() { |
|||
if (typeof this.$mp.page.getTabBar === 'function' && this.$mp.page.getTabBar()) { |
|||
this.$mp.page.getTabBar().setData({ |
|||
selected: 2 |
|||
}) |
|||
|
|||
} |
|||
|
|||
if (getApp().globalData.mobile == '') |
|||
this.showModal1 = true |
|||
|
|||
|
|||
this.getUserInfo() |
|||
this.myRecommend() |
|||
}, |
|||
onLoad(options) { |
|||
// this.request() |
|||
let info = uni.getSystemInfoSync(); |
|||
|
|||
this.page.startHeight = info.windowWidth * 0.6 |
|||
this.page.endHeight = info.windowWidth * 0.8 |
|||
}, |
|||
onPageScroll(res) { |
|||
// 渐变 |
|||
this.$refs.nav.defaultColorBgAlpha(res) |
|||
}, |
|||
methods: { |
|||
makePhoneCall() { |
|||
wx.makePhoneCall({ |
|||
// phoneNumber: '15632127890', |
|||
phoneNumber: '13011576972', |
|||
|
|||
}) |
|||
}, |
|||
getUserInfo() { |
|||
let _this = this |
|||
_this.$api.getUserInfo(getApp().globalData.sid).then((resp) => { |
|||
|
|||
_this.userInfo = { |
|||
nick: resp.nick, |
|||
mobile: resp.mobile, |
|||
photo: resp.photo |
|||
} |
|||
|
|||
_this.headImage = resp.data.photo |
|||
|
|||
|
|||
}).catch(e => { |
|||
|
|||
}) |
|||
|
|||
}, |
|||
myRecommend() { |
|||
let _this = this |
|||
_this.$api.myRecommend(getApp().globalData.sid).then((resp) => { |
|||
|
|||
console.log("myRecommend>>>", resp) |
|||
|
|||
_this.recommend = resp |
|||
|
|||
}).catch(e => { |
|||
|
|||
}) |
|||
}, |
|||
recommendClick(item) { |
|||
console.log("recommendClick>>>", item) |
|||
|
|||
// uni.navigateTo({ |
|||
// url: '/pages/records/recommendRecords' |
|||
// }) |
|||
}, |
|||
showDiaLog() { |
|||
uni.navigateTo({ |
|||
url: '/pages/me/base_info' |
|||
}) |
|||
}, |
|||
colseDialog1() { |
|||
this.showModal1 = false |
|||
}, |
|||
getPhoneNumber(e) { |
|||
let _this = this |
|||
console.log(e.detail.code) |
|||
_this.$api.getPhone({ |
|||
userSid: getApp().globalData.sid, |
|||
code: e.detail.code |
|||
}).then((resp) => { |
|||
_this.showModal1 = false |
|||
getApp().globalData.mobile = resp |
|||
}).catch(e => { |
|||
console.log(e); |
|||
}) |
|||
}, |
|||
|
|||
onShareAppMessage: function(res) { |
|||
// console.log("res", res) |
|||
// console.log("data", res.target.dataset) |
|||
// var data = res.target.dataset.info |
|||
|
|||
// this.shareCard() |
|||
|
|||
// // ① |
|||
// let shareData = JSON.stringify({ |
|||
// // params: { |
|||
// // code: data.code, |
|||
// // codeKey: data.codeKey, |
|||
// // customerSid: '' |
|||
// // }, |
|||
// // functionName: 'bindCard', |
|||
// // url: '/pages/detail/detail_affeection?sid=' + data.sid |
|||
|
|||
// url: '/pages/home/myCellar?shareSid=' + getApp().globalData.sid, |
|||
// functionName: 'share' |
|||
// }) |
|||
// // 转码传输 |
|||
// let value = encodeURIComponent(shareData) |
|||
|
|||
// return { |
|||
// title: '汇融农链-云菜窖', |
|||
// // ② |
|||
// path: '/pages/login/login?data=' + value, |
|||
// imageUrl: 'https://supervise.yxtsoft.com/lpk/image/share_invite.png', //自定义图片路径，显示图片长宽比是 5:4。 |
|||
// success: function(res) { |
|||
// console.log('aaaa', "分享成功") |
|||
// }, |
|||
// fail: function(res) { |
|||
// // 转发失败 |
|||
// console.log('aaaa', "用户点击了取消") |
|||
// } |
|||
// } |
|||
|
|||
|
|||
let _this = this |
|||
const promise = new Promise(resolve => { |
|||
// 模拟网络请求 |
|||
setTimeout(() => { |
|||
|
|||
var params = { |
|||
customerSid: getApp().globalData.sid |
|||
} |
|||
|
|||
_this.$api.recommendNewUsers(params).then((resp) => { |
|||
|
|||
|
|||
let shareData = JSON.stringify({ |
|||
// params: { |
|||
// code: resp.transferCode, |
|||
// codeKey: resp.sid |
|||
// }, |
|||
// functionName: 'bindCard', |
|||
// url: '/pages/bind/bind_cloudCard?code=' + resp |
|||
// .transferCode + "&codeKey=" + resp.sid |
|||
|
|||
url: '/pages/home/myCellar?shareSid=' + getApp() |
|||
.globalData.sid + "&orderSid=" + resp.sid, |
|||
functionName: 'share' |
|||
}) |
|||
// 转码传输 |
|||
let value = encodeURIComponent(shareData) |
|||
|
|||
resolve({ |
|||
title: '汇融农链-云菜窖', |
|||
// ② |
|||
path: '/pages/login/login?data=' + value, |
|||
imageUrl: 'https://supervise.yxtsoft.com/lpk/image/share_invite.png', //自定义图片路径，显示图片长宽比是 5:4。 |
|||
|
|||
}) |
|||
|
|||
}).catch(e => { |
|||
_this.shortToast('发生错误,请稍后再试.') |
|||
return |
|||
}) |
|||
|
|||
}, 0) |
|||
}) |
|||
|
|||
return promise |
|||
|
|||
|
|||
}, |
|||
shareCard() { |
|||
let _this = this |
|||
|
|||
var params = { |
|||
customerSid: getApp().globalData.sid |
|||
} |
|||
|
|||
_this.$api.recommendNewUsers(params).then((resp) => { |
|||
|
|||
|
|||
}).catch(e => {}) |
|||
}, |
|||
|
|||
itemClick(type) { |
|||
|
|||
switch (type) { |
|||
case "待提菜": |
|||
// uni.navigateTo({ |
|||
// url: '/pages/records/reservationRecords', |
|||
// }) |
|||
|
|||
uni.navigateTo({ |
|||
url: '/pages/records/reservationRecords3', |
|||
}) |
|||
break; |
|||
case "已提菜": |
|||
// uni.navigateTo({ |
|||
// url: '/pages/records/reservationRecords2', |
|||
// }) |
|||
uni.navigateTo({ |
|||
url: '/pages/records/reservationRecords4', |
|||
}) |
|||
break; |
|||
case "我的订单": |
|||
uni.navigateTo({ |
|||
url: '/pages/records/orderRecords', |
|||
}) |
|||
|
|||
// uni.navigateTo({ |
|||
// url:"/pages/records/orderDetail" |
|||
// }) |
|||
|
|||
|
|||
break; |
|||
|
|||
case "已失效": |
|||
uni.navigateTo({ |
|||
url: '/pages/records/invalidGoods', |
|||
}) |
|||
break; |
|||
case "待付款": |
|||
|
|||
break; |
|||
case "已付款": |
|||
|
|||
break; |
|||
case "赠与我的": |
|||
uni.navigateTo({ |
|||
url: '/pages/records/transferRecords2', |
|||
}) |
|||
break; |
|||
case "我的转赠": |
|||
uni.navigateTo({ |
|||
url: '/pages/records/transferRecords', |
|||
}) |
|||
break; |
|||
} |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
#page { |
|||
display: flex; |
|||
flex-direction: column; |
|||
height: 100vh; |
|||
background: -webkit-linear-gradient(left, #FEA65F, #FB9440); |
|||
box-sizing: border-box; |
|||
} |
|||
|
|||
|
|||
/* 顶部 */ |
|||
.top { |
|||
width: 100vw; |
|||
/* height: 126.66vw; */ |
|||
height: 65vw; |
|||
/* 加载背景图 */ |
|||
background-image: url(https://supervise.yxtsoft.com/lpk/image/my_bj.png); |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
background-size: 100% 100%; |
|||
|
|||
position: relative; |
|||
/*父元素位置要设置为相对*/ |
|||
} |
|||
|
|||
/* 顶部-用户信息 */ |
|||
.top .userinfo { |
|||
display: flex; |
|||
flex-direction: row; |
|||
align-items: center; |
|||
margin-top: 25vw; |
|||
margin-left: 8vw; |
|||
} |
|||
|
|||
/* 顶部-用户信息-头像 */ |
|||
.top .userinfo .head-img { |
|||
width: 60px; |
|||
height: 60px; |
|||
border-radius: 50%; |
|||
} |
|||
|
|||
/* 顶部-用户信息-名称手机 */ |
|||
.top .userinfo .name-mob { |
|||
display: flex; |
|||
flex-direction: column; |
|||
margin-left: 10px; |
|||
} |
|||
|
|||
/* 顶部-用户信息-名称手机-文本样式 */ |
|||
.top .userinfo .name-mob text { |
|||
font-size: 16px; |
|||
color: #fff; |
|||
} |
|||
|
|||
/* 视图 */ |
|||
.view { |
|||
box-sizing: border-box; |
|||
margin-top: -15px; |
|||
background: #F7F7F7; |
|||
height: calc(100vh - 45px - 65vw); |
|||
; |
|||
width: 100%; |
|||
border-radius: 15px; |
|||
} |
|||
|
|||
/* 滚动视图 */ |
|||
.scroll-view { |
|||
height: 100%; |
|||
width: 100%; |
|||
padding: 15px; |
|||
border-radius: 15px; |
|||
box-sizing: border-box; |
|||
} |
|||
|
|||
/* 图标显示行 */ |
|||
.icon-cow { |
|||
display: flex; |
|||
flex-direction: column; |
|||
border-radius: 10px; |
|||
background: #fff; |
|||
padding: 12px; |
|||
margin-bottom: 10px |
|||
} |
|||
|
|||
/* 图标显示行-标题 */ |
|||
.icon-cow .title { |
|||
font-size: 15px; |
|||
color: #101010; |
|||
font-weight: 600; |
|||
font-family: sans-serif; |
|||
} |
|||
|
|||
/* 图标显示行-图标群 */ |
|||
.icon-cow .group { |
|||
display: flex; |
|||
flex-direction: row; |
|||
justify-content: flex-start; |
|||
align-items: center; |
|||
margin-top: 10px; |
|||
} |
|||
|
|||
/* 图标显示行-图标群-图标和名称*/ |
|||
.icon-cow .group .icon-name { |
|||
flex: 1; |
|||
display: flex; |
|||
flex-direction: column; |
|||
justify-content: center; |
|||
align-items: center; |
|||
} |
|||
|
|||
/* 图标显示行-图标群-图标和名称-图标*/ |
|||
.icon-cow .group .icon-name .icon { |
|||
position: relative; |
|||
width: 35px; |
|||
height: 35px; |
|||
} |
|||
|
|||
/* 图标显示行-图标群-图标和名称-图标-图片*/ |
|||
.icon-cow .group .icon-name .icon .img { |
|||
width: 28px; |
|||
height: 28px; |
|||
margin-left: 5px; |
|||
margin-top: 5px; |
|||
} |
|||
|
|||
/* 图标显示行-图标群-图标和名称-图标-数量*/ |
|||
.icon-cow .group .icon-name .icon .count { |
|||
border-radius: 50%; |
|||
text-align: center; |
|||
background: #f00; |
|||
color: #fff; |
|||
font-size: 8px; |
|||
position: absolute; |
|||
top: 2px; |
|||
right: 0px; |
|||
padding: 2px 5px; |
|||
width: auto; |
|||
} |
|||
|
|||
/* 图标显示行-图标群-图标和名称-图标名称*/ |
|||
.icon-cow .group .icon-name .name { |
|||
font-size: 13px; |
|||
color: #101010; |
|||
margin-top: 5px; |
|||
} |
|||
|
|||
|
|||
.sharebtn { |
|||
margin-right: -10px; |
|||
background: #f0f; |
|||
/* font-size: 12px; |
|||
color: #fff; |
|||
width: 30vw; |
|||
border-radius: 20px; */ |
|||
} |
|||
|
|||
|
|||
.sharebtn::after { |
|||
border: none; |
|||
} |
|||
|
|||
|
|||
/* 弹窗样式 */ |
|||
.model { |
|||
position: absolute; |
|||
width: 100%; |
|||
height: 100%; |
|||
background: #000; |
|||
z-index: 100000; |
|||
opacity: 0.7; |
|||
top: 0; |
|||
left: 0; |
|||
|
|||
} |
|||
|
|||
.modalDlg4 { |
|||
/* 设置超出滚动 */ |
|||
overflow: auto; |
|||
position: fixed; |
|||
z-index: 100000; |
|||
display: flex; |
|||
width: 100%; |
|||
height: 100%; |
|||
top: 0; |
|||
left: 0; |
|||
flex-direction: column; |
|||
justify-content: center; |
|||
align-items: center; |
|||
} |
|||
|
|||
.button1 { |
|||
|
|||
background: #fff; |
|||
color: #666; |
|||
flex: 1; |
|||
border-radius: 0px; |
|||
border-bottom-left-radius: 20px; |
|||
border: 1px solid #eee; |
|||
} |
|||
|
|||
.button2 { |
|||
background: #fff; |
|||
color: #FF9900; |
|||
border-radius: 0px; |
|||
border-bottom-right-radius: 20px; |
|||
flex: 1; |
|||
border: 1px solid #eee; |
|||
} |
|||
|
|||
button { |
|||
background: #fff; |
|||
color: #fff; |
|||
height: 42px; |
|||
line-height: 40px; |
|||
font-size: 13px; |
|||
padding: 0px 15px; |
|||
} |
|||
|
|||
button::after { |
|||
border: 0; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,32 @@ |
|||
<template> |
|||
<view style="display: flex;flex-direction: column;width: 100%;height: 100%;box-sizing: border-box;"> |
|||
|
|||
<NavBar ref="nav" navTitle=" " :showIcon="true" > |
|||
</NavBar> |
|||
<image :src="page.url" style="width: 100%;height: 100vh;" mode="scaleToFill"></image> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
page:{ |
|||
url:"", |
|||
} |
|||
} |
|||
}, |
|||
onLoad(options) { |
|||
console.log("options",options) |
|||
this.page.url = JSON.parse(decodeURIComponent(options.url)) |
|||
console.log("as",this.page.url) |
|||
}, |
|||
methods: { |
|||
|
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
|
|||
</style> |
|||
@ -0,0 +1,244 @@ |
|||
<template> |
|||
|
|||
<view style="display: flex;flex-direction: column;height: 100#;"> |
|||
|
|||
<view class="top"> |
|||
<NavBar ref="nav" navTitle="个人卡" :showIcon="false" :start-change-height="page.startHeight" |
|||
:end-change-height="page.endHeight"> |
|||
</NavBar> |
|||
<view style="display: flex;flex-direction: column;align-items: center;"> |
|||
<view class="btn" @click="bind"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/binding2.png" style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text |
|||
style="height: 45px;line-height: 45px;font-size: 17px; text-align: center;color: #fff;margin-left: 11px;">绑定个人卡</text> |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
<!-- <view |
|||
style="display: flex;flex-direction: column;background: #f0f; height: auto; border-top-left-radius: 25px;border-top-right-radius: 25px;margin-top: -9.1vw;"> --> |
|||
<z-paging ref="paging" v-model="data" :pagingStyle='styleObject' @query="queryList" :refresher-enabled="true"> |
|||
|
|||
<view v-for="(item,index) in data" :key="index" |
|||
style="display: flex;flex-direction: column;align-items: center;margin-top: 14px; " |
|||
:class="item.showBtn==true?'oragin':'gray'" @click="detail(item)"> |
|||
|
|||
<view class="item" :class="{ item2: !item.showBtn }"> |
|||
|
|||
<!-- 外边 18px 内边 32px = 50px --> |
|||
<view |
|||
style="padding: 16px;display: flex;flex-direction: row;width: 100%;box-sizing: border-box;"> |
|||
|
|||
<!-- 礼包图标 总60px --> |
|||
<view style="flex-shrink: 0;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/personNormal.png" mode="aspectFill" |
|||
v-show="item.showBtn" style="width: 50px;height: 50px;margin-right: 10px;" /> |
|||
|
|||
<image src="https://supervise.yxtsoft.com/lpk/image/peronLose.png" mode="aspectFill" |
|||
v-show="!item.showBtn" style="width: 50px;height: 50px;margin-right: 10px;" /> |
|||
</view> |
|||
|
|||
<view |
|||
style="flex: 1;display: flex;flex-direction: column;box-sizing: border-box;flex-wrap: nowrap;"> |
|||
|
|||
<view style="width: 100%;display: flex;flex-direction: row;"> |
|||
|
|||
<view style="flex: 1;display: flex;flex-direction: column;"> |
|||
<text class="_ellipsis" |
|||
style="font-size: 13px;color: #333;width: calc(100vw - 190px);">卡号:{{item.serialNumber}}</text> |
|||
<text lass="_ellipsis" |
|||
style="font-size: 12px;color: #999;margin-top: 5px;width: calc(100vw - 182px);"> |
|||
{{item.time}}</text> |
|||
</view> |
|||
|
|||
<!-- 按钮 24 + 48 = 72px--> |
|||
<view :class="{ showBtn: !item.showBtn }" style="font-size: 12px;color:#fff;flex-shrink: 0; |
|||
border-radius: 15px; height: 30px;padding: 0px 12px;line-height: 30px;box-sizing: border-box; |
|||
background: -webkit-linear-gradient(left,#FF7405,#FFAD6D);">预约提货</view> |
|||
</view> |
|||
|
|||
<!-- 蔬菜礼包经典款+状态 --> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<text style="font-size: 15px;color: #FF7100;"> {{item.pname}}</text> |
|||
<text |
|||
style="border: 1px #FED4B3 solid;margin-left: 10px;border-radius: 15px;padding: 3px 10px; font-size: 12px; color: #FF6000;flex-shrink: 0;"> |
|||
{{item.state}}</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
</z-paging> |
|||
|
|||
<!-- </view> --> |
|||
</view> |
|||
|
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
styleObject:{ |
|||
'margin-top': '78vw', |
|||
'border-top-left-radius': '25px', |
|||
'border-top-right-radius': '25px', |
|||
'background': '#fff', |
|||
'padding-top': '10px', |
|||
}, |
|||
page: { |
|||
remarks: '', |
|||
startHeight: 0, |
|||
endHeight: 0 |
|||
}, |
|||
data: [], |
|||
data2: [], |
|||
currentTab: 0, |
|||
} |
|||
}, |
|||
created() { |
|||
this.$bus.$on('order', msg => { |
|||
console.log("aaaaaaaaaaa4", msg) |
|||
this.$refs.paging.reload(true); |
|||
}); |
|||
}, |
|||
onLoad() { |
|||
|
|||
let info = uni.getSystemInfoSync(); |
|||
|
|||
this.page.startHeight = info.windowWidth * 0.6 |
|||
this.page.endHeight = info.windowWidth * 0.8 |
|||
}, |
|||
onUnload() { |
|||
uni.$off('order'); |
|||
}, |
|||
onPageScroll(res) { |
|||
// 渐变 |
|||
this.$refs.nav.defaultColorBgAlpha(res) |
|||
}, |
|||
methods: { |
|||
// 分页的请求 |
|||
queryList(pageNo, pageSize) { |
|||
let _this = this |
|||
_this.$api.cardList({ |
|||
"current": pageNo, |
|||
"size": pageSize, |
|||
"params": { |
|||
"customerSid": getApp().globalData.sid |
|||
} |
|||
}).then((resp) => { |
|||
// 添加数据源 |
|||
this.$refs.paging.complete(resp.records) |
|||
}).catch(e => { |
|||
// 出错了，点击重试 |
|||
_this.$refs.paging.complete(false); |
|||
}) |
|||
}, |
|||
|
|||
bind() { |
|||
uni.navigateTo({ |
|||
url: '/pages/bind/bind_personCard' |
|||
}) |
|||
}, |
|||
detail(item) { |
|||
|
|||
if (item.showBtn) { |
|||
// 正常 |
|||
uni.navigateTo({ |
|||
url: '/pages/card/card_detail?sid=' + item.sid |
|||
}) |
|||
} else { |
|||
// 过期 已完成 |
|||
uni.navigateTo({ |
|||
url: '/pages/card/card_detail2?sid=' + item.sid |
|||
}) |
|||
} |
|||
|
|||
}, |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
._ellipsis { |
|||
overflow-wrap: break-word; |
|||
} |
|||
|
|||
.top { |
|||
width: 100vw; |
|||
/* height: 126.66vw; */ |
|||
height: 85vw; |
|||
/* 加载背景图 */ |
|||
background-image: url(https://supervise.yxtsoft.com/lpk/image/home_bj1.png); |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
background-size: 100% 100%; |
|||
} |
|||
|
|||
.btn { |
|||
/* margin-top: 97.86vw; */ |
|||
margin-top: 60vw; |
|||
width: 83%; |
|||
background-color: #FFF; |
|||
border-radius: 45px; |
|||
display: flex; |
|||
height: 13vw; |
|||
flex-direction: row; |
|||
justify-content: center; |
|||
align-items: center; |
|||
/* 加载背景图 */ |
|||
background-image: url(https://supervise.yxtsoft.com/lpk/image/bindBtn_bj1.png); |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
background-size: 100% 100%; |
|||
} |
|||
|
|||
.item { |
|||
/* 加载背景图 */ |
|||
background-image: url(https://supervise.yxtsoft.com/lpk/image/carPerson.png); |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
background-size: 100% 100%; |
|||
width: calc(100% - 18px); |
|||
} |
|||
|
|||
.item2 { |
|||
/* 加载背景图 */ |
|||
background-image: url(https://supervise.yxtsoft.com/lpk/image/caradLose.png); |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
background-size: 100% 100%; |
|||
width: calc(100% - 18px); |
|||
} |
|||
|
|||
.showBtn { |
|||
visibility: hidden; |
|||
} |
|||
|
|||
.use { |
|||
display: flex; |
|||
flex-direction: row; |
|||
border-top-left-radius: 20rpx; |
|||
border-top-right-radius: 20rpx; |
|||
color: #FFF; |
|||
align-items: center; |
|||
background: linear-gradient(89.8deg, rgba(218, 51, 33, 1) -3.76%, rgba(237, 113, 53, 0) 300.05%); |
|||
} |
|||
|
|||
.gray { |
|||
filter: grayscale(100%); |
|||
-webkit-filter: grayscale(100%); |
|||
transition: filter 0.2s; |
|||
} |
|||
|
|||
|
|||
|
|||
.oragin {} |
|||
|
|||
uni-page-body, |
|||
page { |
|||
background: #FFFFFF; |
|||
} |
|||
|
|||
</style> |
|||
@ -0,0 +1,546 @@ |
|||
<template> |
|||
|
|||
<view style="display: flex;flex-direction: column;height: 100vh;background: -webkit-linear-gradient(left,#FEA65F,#FB9440);"> |
|||
|
|||
<view class="top"> |
|||
<NavBar ref="nav" navTitle=" " :showIcon="false" :start-change-height="page.startHeight" |
|||
:end-change-height="page.endHeight"> |
|||
</NavBar> |
|||
<view style="display: flex;flex-direction: row;"> |
|||
<!-- <view class="btn" @click="bind"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/binding.png" style="width: 20px;height: 20px;"> |
|||
</image> |
|||
<text |
|||
style="height: 45px;line-height: 45px;font-size: 17px;font-weight: 600; text-align: center;color: #FF7100;margin-left: 11px;">绑定新卡</text> |
|||
</view> --> |
|||
<view style="flex: 1;"></view> |
|||
<!-- <text style="color: #fff;margin-top: 60vw; margin-right: 25px;" @click="bind">绑定新卡</text> --> |
|||
<image @click="bind" src="https://supervise.yxtsoft.com/lpk/image/bind2.png" |
|||
style="margin-top: 60vw; margin-right: 25px;width: 20px;height: 20px;"> |
|||
</image> |
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
|
|||
<!-- <view |
|||
style="display: flex;flex-direction: column;background: #f0f; height: auto; border-top-left-radius: 25px;border-top-right-radius: 25px;margin-top: -9.1vw;"> --> |
|||
<z-paging ref="paging" v-model="data" :pagingStyle='styleObject' @query="queryList" :refresher-enabled="true" :auto="false"> |
|||
|
|||
<view v-for="(item,index) in data" :key="index" |
|||
style="display: flex;flex-direction: column;align-items: center;margin-top: 14px; " |
|||
:class="item.showBtn==true?'oragin':'gray'" @click="detail(item)"> |
|||
|
|||
<!-- 家庭卡--> |
|||
<view v-show="item.type=='1'"> |
|||
|
|||
<view class="item" :class="{ item2: !item.showBtn }"> |
|||
|
|||
<!-- 外边 18px 内边 32px = 50px --> |
|||
<view |
|||
style="padding: 16px;display: flex;flex-direction: row;width: 100%;box-sizing: border-box;"> |
|||
|
|||
<!-- 礼包图标 总60px --> |
|||
<view style="flex-shrink: 0;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/home_family.png" mode="aspectFill" |
|||
v-show="item.showBtn" style="width: 50px;height: 50px;margin-right: 10px;" /> |
|||
|
|||
<image src="https://supervise.yxtsoft.com/lpk/image/home_notFamily.png" |
|||
mode="aspectFill" v-show="!item.showBtn" |
|||
style="width: 50px;height: 50px;margin-right: 10px;" /> |
|||
</view> |
|||
|
|||
<view |
|||
style="flex: 1;display: flex;flex-direction: column;box-sizing: border-box;flex-wrap: nowrap;"> |
|||
|
|||
<view style="width: 100%;display: flex;flex-direction: row;"> |
|||
|
|||
<view style="flex: 1;display: flex;flex-direction: column;"> |
|||
<text class="_ellipsis" |
|||
style="font-size: 13px;color: #333;width: calc(100vw - 190px);">窖号:{{item.serialNumber}}</text> |
|||
<text lass="_ellipsis" |
|||
style="font-size: 12px;color: #999;margin-top: 5px;width: calc(100vw - 182px);"> |
|||
{{item.time}}</text> |
|||
</view> |
|||
|
|||
<!-- 按钮 24 + 48 = 72px--> |
|||
<view :class="{ showBtn: !item.showBtn }" style="font-size: 12px;color:#fff;flex-shrink: 0; |
|||
border-radius: 15px; height: 30px;padding: 0px 12px;line-height: 30px;box-sizing: border-box; |
|||
background: -webkit-linear-gradient(left,#FF7405,#FFAD6D);">预约提货</view> |
|||
</view> |
|||
|
|||
<!-- 蔬菜礼包经典款+状态 --> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<text style="font-size: 15px;color: #FF7100;flex: 1;"> {{item.pname}}</text> |
|||
<text |
|||
style="margin-left: 10px;border-radius: 15px;padding: 3px 10px; font-size: 12px; color: #FF6000;flex-shrink: 0;"> |
|||
{{item.state}}</text> |
|||
</view> |
|||
|
|||
<view v-if="item.list.length>0"> |
|||
<view style="height: 10px;"></view> |
|||
|
|||
<view v-for="(child,pos) in item.list" :key="pos" |
|||
style="display: flex;flex-direction: row;align-items: center;width: calc(100vw - 120px);padding-top: 5px;box-sizing: border-box;"> |
|||
<image src="../../static/tck_mx_icon.png" style="width: 9px;height: 9px;"> |
|||
</image> |
|||
<view |
|||
style="font-size: 11px;color: #E99D42;padding-left: 5px;flex: 1;overflow: hidden;text-overflow: ellipsis;white-space: nowrap"> |
|||
{{child.goodsName}} |
|||
</view> |
|||
<view style="font-size: 11px;color: #E99D42;flex-shrink: 0;margin-left: 23px;"> |
|||
{{child.content}} |
|||
</view> |
|||
<view style="font-size: 11px;color: #E99D42;min-width: 60px;text-align: right;padding-left: 5px;"> |
|||
{{child.remarks}} |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<!-- 亲情卡--> |
|||
<view v-show="item.type=='2'"> |
|||
|
|||
<view class="item3" :class="{ item4: !item.showBtn }"> |
|||
|
|||
<!-- 外边 18px 内边 32px = 50px --> |
|||
<view |
|||
style="padding: 16px;display: flex;flex-direction: row;width: 100%;box-sizing: border-box;"> |
|||
|
|||
<!-- 礼包图标 总60px --> |
|||
<view style="flex-shrink: 0;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/home_affection.png" |
|||
mode="aspectFill" v-show="item.showBtn" |
|||
style="width: 50px;height: 50px;margin-right: 10px;" /> |
|||
|
|||
<image src="https://supervise.yxtsoft.com/lpk/image/home_notAffection.png" |
|||
mode="aspectFill" v-show="!item.showBtn" |
|||
style="width: 50px;height: 50px;margin-right: 10px;" /> |
|||
</view> |
|||
|
|||
<view |
|||
style="flex: 1;display: flex;flex-direction: column;box-sizing: border-box;flex-wrap: nowrap;"> |
|||
|
|||
<view style="width: 100%;display: flex;flex-direction: row;"> |
|||
|
|||
<view style="flex: 1;display: flex;flex-direction: column;"> |
|||
<text class="_ellipsis" |
|||
style="font-size: 13px;color: #333;width: calc(100vw - 190px);">窖号:{{item.serialNumber}}</text> |
|||
<text lass="_ellipsis" |
|||
style="font-size: 12px;color: #999;margin-top: 5px;width: calc(100vw - 182px);"> |
|||
{{item.time}}</text> |
|||
</view> |
|||
|
|||
<!-- 按钮 24 + 48 = 72px--> |
|||
<view :class="{ showBtn: !item.showBtn }" style="font-size: 12px;color:#fff;flex-shrink: 0; |
|||
border-radius: 15px; height: 30px;padding: 0px 12px;line-height: 30px;box-sizing: border-box; |
|||
background: -webkit-linear-gradient(left,#FF7405,#FFAD6D);">预约提货</view> |
|||
</view> |
|||
|
|||
<!-- 蔬菜礼包经典款+状态 --> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<text style="font-size: 15px;color: #FF7100;flex: 1;"> {{item.pname}}</text> |
|||
<text |
|||
style="margin-left: 10px;border-radius: 15px;padding: 3px 10px; font-size: 12px; color: #FF6000;flex-shrink: 0;"> |
|||
{{item.state}}</text> |
|||
</view> |
|||
|
|||
<view v-if="item.list.length>0"> |
|||
<view style="height: 10px;"></view> |
|||
|
|||
<view v-for="(child,pos) in item.list" :key="pos" |
|||
style="display: flex;flex-direction: row;align-items: center;width: calc(100vw - 120px);padding-top: 5px;box-sizing: border-box;"> |
|||
<image src="../../static/tck_mx_icon.png" style="width: 9px;height: 9px;"> |
|||
</image> |
|||
<view |
|||
style="font-size: 11px;color: #E99D42;padding-left: 5px;flex: 1;overflow: hidden;text-overflow: ellipsis;white-space: nowrap"> |
|||
{{child.goodsName}} |
|||
</view> |
|||
<view style="font-size: 11px;color: #E99D42;flex-shrink: 0;margin-left: 23px;"> |
|||
{{child.content}} |
|||
</view> |
|||
<view style="font-size: 11px;color: #E99D42;min-width: 60px;text-align: right;padding-left: 5px;"> |
|||
{{child.remarks}} |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
|
|||
<!-- 企业卡--> |
|||
<view v-show="item.type=='3'"> |
|||
|
|||
<view class="item5" :class="{ item6: !item.showBtn }"> |
|||
|
|||
<!-- 外边 18px 内边 32px = 50px --> |
|||
<view |
|||
style="padding: 16px;display: flex;flex-direction: row;width: 100%;box-sizing: border-box;"> |
|||
|
|||
<!-- 礼包图标 总60px --> |
|||
<view style="flex-shrink: 0;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/home_enterprise.png" |
|||
mode="aspectFill" v-show="item.showBtn" |
|||
style="width: 50px;height: 50px;margin-right: 10px;" /> |
|||
|
|||
<image src="https://supervise.yxtsoft.com/lpk/image/home_notEnterprise.png" |
|||
mode="aspectFill" v-show="!item.showBtn" |
|||
style="width: 50px;height: 50px;margin-right: 10px;" /> |
|||
</view> |
|||
|
|||
<view |
|||
style="flex: 1;display: flex;flex-direction: column;box-sizing: border-box;flex-wrap: nowrap;"> |
|||
|
|||
<view style="width: 100%;display: flex;flex-direction: row;"> |
|||
|
|||
<view style="flex: 1;display: flex;flex-direction: column;"> |
|||
<text class="_ellipsis" |
|||
style="font-size: 13px;color: #333;width: calc(100vw - 190px);">窖号:{{item.serialNumber}}</text> |
|||
<text lass="_ellipsis" |
|||
style="font-size: 12px;color: #999;margin-top: 5px;width: calc(100vw - 182px);"> |
|||
{{item.time}}</text> |
|||
</view> |
|||
|
|||
<!-- 按钮 24 + 48 = 72px--> |
|||
<view :class="{ showBtn: !item.showBtn }" style="font-size: 12px;color:#fff;flex-shrink: 0; |
|||
border-radius: 15px; height: 30px;padding: 0px 12px;line-height: 30px;box-sizing: border-box; |
|||
background: -webkit-linear-gradient(left,#FF7405,#FFAD6D);">预约提货</view> |
|||
</view> |
|||
|
|||
<!-- 蔬菜礼包经典款+状态 --> |
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<text style="font-size: 15px;color: #FF7100;flex: 1;"> {{item.pname}}</text> |
|||
<text |
|||
style="margin-left: 10px;border-radius: 15px;padding: 3px 10px; font-size: 12px; color: #FF6000;flex-shrink: 0;"> |
|||
{{item.state}}</text> |
|||
</view> |
|||
<view v-if="item.list.length>0"> |
|||
<view style="height: 10px;"></view> |
|||
|
|||
<view v-for="(child,pos) in item.list" :key="pos" |
|||
style="display: flex;flex-direction: row;align-items: center;width: calc(100vw - 120px);padding-top: 5px;box-sizing: border-box;"> |
|||
<image src="../../static/tck_mx_icon.png" style="width: 9px;height: 9px;"> |
|||
</image> |
|||
<view |
|||
style="font-size: 11px;color: #E99D42;padding-left: 5px;flex: 1;overflow: hidden;text-overflow: ellipsis;white-space: nowrap"> |
|||
{{child.goodsName}} |
|||
</view> |
|||
<view style="font-size: 11px;color: #E99D42;flex-shrink: 0;margin-left: 23px;"> |
|||
{{child.content}} |
|||
</view> |
|||
<view style="font-size: 11px;color: #E99D42;min-width: 60px;text-align: right;padding-left: 5px;"> |
|||
{{child.remarks}} |
|||
</view> |
|||
</view> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
</z-paging> |
|||
|
|||
<!-- </view> --> |
|||
</view> |
|||
|
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
styleObject: { |
|||
'margin-top': '68vw', |
|||
'border-top-left-radius': '25px', |
|||
'border-top-right-radius': '25px', |
|||
'border-bottom-left-radius': '25px', |
|||
'border-bottom-right-radius': '25px', |
|||
'background': '#fff', |
|||
'padding-top': '10px', |
|||
'margin-bottom':"60px" |
|||
}, |
|||
page: { |
|||
remarks: '', |
|||
startHeight: 0, |
|||
endHeight: 0 |
|||
}, |
|||
data: [], |
|||
data2: [], |
|||
currentTab: 0, |
|||
} |
|||
}, |
|||
created() { |
|||
this.$bus.$on('order', msg => { |
|||
console.log("aaaaaaaaaaa4", msg) |
|||
this.$refs.paging.reload(true); |
|||
}); |
|||
}, |
|||
onLoad() { |
|||
|
|||
let info = uni.getSystemInfoSync(); |
|||
|
|||
this.page.startHeight = info.windowWidth * 0.6 |
|||
this.page.endHeight = info.windowWidth * 0.8 |
|||
}, |
|||
onShow() { |
|||
this.$refs.paging.reload(true); |
|||
if (typeof this.$mp.page.getTabBar === 'function' && this.$mp.page.getTabBar()) { |
|||
this.$mp.page.getTabBar().setData({ |
|||
selected: 1 |
|||
}) |
|||
|
|||
} |
|||
}, |
|||
onUnload() { |
|||
uni.$off('order'); |
|||
}, |
|||
onPageScroll(res) { |
|||
// 渐变 |
|||
this.$refs.nav.defaultColorBgAlpha(res) |
|||
}, |
|||
methods: { |
|||
// 分页的请求 |
|||
queryList(pageNo, pageSize) { |
|||
let _this = this |
|||
_this.$api.pickUpCardList({ |
|||
"current": pageNo, |
|||
"size": pageSize, |
|||
"params": { |
|||
"customerSid": getApp().globalData.sid |
|||
} |
|||
}).then((resp) => { |
|||
// 添加数据源 |
|||
this.$refs.paging.complete(resp.records) |
|||
}).catch(e => { |
|||
// 出错了，点击重试 |
|||
_this.$refs.paging.complete(false); |
|||
}) |
|||
}, |
|||
|
|||
bind() { |
|||
uni.navigateTo({ |
|||
url: '/pages/bind/bind_pickUpCard' |
|||
}) |
|||
|
|||
// uni.navigateTo({ |
|||
// url: '/pages/home/myHome' |
|||
// }) |
|||
}, |
|||
detail(item) { |
|||
console.log("aaa", item); |
|||
if (item.showBtn) { |
|||
// 正常 |
|||
|
|||
if (item.type == '1') { |
|||
console.log("111", item); |
|||
// 家庭卡 |
|||
uni.navigateTo({ |
|||
url: '/pages/detail/detail_family?sid=' + item.sid |
|||
}) |
|||
} |
|||
|
|||
if (item.type == '2') { |
|||
console.log("222", item); |
|||
// 亲情卡 |
|||
uni.navigateTo({ |
|||
url: '/pages/detail/detail_affeection?sid=' + item.sid |
|||
}) |
|||
} |
|||
|
|||
if (item.type == '3') { |
|||
console.log("333", item); |
|||
// 企业卡 |
|||
uni.navigateTo({ |
|||
url: '/pages/detail/detail_enterprise?sid=' + item.sid |
|||
}) |
|||
} |
|||
|
|||
|
|||
} else { |
|||
// 过期 已完成 |
|||
if (item.type == '1') { |
|||
// 家庭卡 |
|||
uni.navigateTo({ |
|||
url: '/pages/detail/detail_family2?sid=' + item.sid |
|||
}) |
|||
} |
|||
|
|||
if (item.type == '2') { |
|||
// 亲情卡 |
|||
uni.navigateTo({ |
|||
url: '/pages/detail/detail_affeection2?sid=' + item.sid |
|||
}) |
|||
} |
|||
|
|||
if (item.type == '3') { |
|||
// 企业卡 |
|||
uni.navigateTo({ |
|||
url: '/pages/detail/detail_enterprise2?sid=' + item.sid |
|||
}) |
|||
} |
|||
} |
|||
|
|||
}, |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
._ellipsis { |
|||
overflow-wrap: break-word; |
|||
} |
|||
|
|||
.top { |
|||
width: 100vw; |
|||
/* height: 126.66vw; */ |
|||
height: 85vw; |
|||
/* 加载背景图 */ |
|||
background-image: url(https://supervise.yxtsoft.com/lpk/image/home_bj1.png); |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
background-size: 100% 100%; |
|||
} |
|||
|
|||
.btn { |
|||
/* margin-top: 97.86vw; */ |
|||
margin-top: 60vw; |
|||
width: 83%; |
|||
background-color: #FFF; |
|||
border-radius: 45px; |
|||
display: flex; |
|||
/* height: 13vw; */ |
|||
flex-direction: row; |
|||
justify-content: center; |
|||
align-items: center; |
|||
/* 加载背景图 */ |
|||
/* background-image: url(https://supervise.yxtsoft.com/lpk/image/bindBtn_bj1.png); */ |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
/* background-size: 100% 100%; */ |
|||
} |
|||
|
|||
.item { |
|||
border-radius: 8px; |
|||
width: calc(100% - 5px); |
|||
background-color: rgba(255, 248, 248, 1); |
|||
color: rgba(16, 16, 16, 1); |
|||
box-shadow: 2px 3px 6px 0px rgba(255, 226, 222, 0.62); |
|||
} |
|||
|
|||
.item2 { |
|||
/* 加载背景图 */ |
|||
/* background-image: url(https://supervise.yxtsoft.com/lpk/image/home_itemBj_lose.png); */ |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
/* background-size: 100% 100%; */ |
|||
/* width: calc(100% - 5px); */ |
|||
|
|||
width: calc(100% - 5px); |
|||
border-radius: 8px; |
|||
background-color: rgba(255, 251, 248, 1); |
|||
color: rgba(16, 16, 16, 1); |
|||
box-shadow: 2px 3px 6px 0px rgba(238, 117, 47, 0.15); |
|||
} |
|||
|
|||
.item3 { |
|||
/* 加载背景图 */ |
|||
/* background-image: url(https://supervise.yxtsoft.com/lpk/image/home_itemBj_affection.png); */ |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
/* background-size: 100% 100%; */ |
|||
/* width: calc(100% - 5px); */ |
|||
|
|||
border-radius: 8px; |
|||
background-color: rgba(255, 254, 249, 1); |
|||
color: rgba(16, 16, 16, 1); |
|||
box-shadow: 2px 3px 6px 0px rgba(224, 218, 168, 0.24); |
|||
} |
|||
|
|||
.item4 { |
|||
/* 加载背景图 */ |
|||
/* background-image: url(https://supervise.yxtsoft.com/lpk/image/home_itemBj_lose.png); */ |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
/* background-size: 100% 100%; */ |
|||
/* width: calc(100% - 5px); */ |
|||
|
|||
width: calc(100% - 5px); |
|||
border-radius: 8px; |
|||
background-color: rgba(255, 251, 248, 1); |
|||
color: rgba(16, 16, 16, 1); |
|||
box-shadow: 2px 3px 6px 0px rgba(238, 117, 47, 0.15); |
|||
} |
|||
|
|||
|
|||
.item5 { |
|||
/* 加载背景图 */ |
|||
/* background-image: url(https://supervise.yxtsoft.com/lpk/image/home_itemBj_enterprise.png); */ |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
/* background-size: 100% 100%; */ |
|||
/* width: calc(100% - 5px); */ |
|||
|
|||
width: calc(100% - 5px); |
|||
border-radius: 8px; |
|||
background-color: rgba(255, 251, 248, 1); |
|||
color: rgba(16, 16, 16, 1); |
|||
box-shadow: 2px 3px 6px 0px rgba(238, 117, 47, 0.15); |
|||
} |
|||
|
|||
.item6 { |
|||
/* 加载背景图 */ |
|||
/* background-image: url(https://supervise.yxtsoft.com/lpk/image/home_itemBj_lose.png); */ |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
/* background-size: 100% 100%; */ |
|||
/* width: calc(100% - 5px); */ |
|||
|
|||
width: calc(100% - 5px); |
|||
border-radius: 8px; |
|||
background-color: rgba(255, 251, 248, 1); |
|||
color: rgba(16, 16, 16, 1); |
|||
box-shadow: 2px 3px 6px 0px rgba(238, 117, 47, 0.15); |
|||
} |
|||
|
|||
|
|||
.showBtn { |
|||
visibility: hidden; |
|||
} |
|||
|
|||
.use { |
|||
display: flex; |
|||
flex-direction: row; |
|||
border-top-left-radius: 20rpx; |
|||
border-top-right-radius: 20rpx; |
|||
color: #FFF; |
|||
align-items: center; |
|||
background: linear-gradient(89.8deg, rgba(218, 51, 33, 1) -3.76%, rgba(237, 113, 53, 0) 300.05%); |
|||
} |
|||
|
|||
.gray { |
|||
filter: grayscale(100%); |
|||
-webkit-filter: grayscale(100%); |
|||
transition: filter 0.2s; |
|||
} |
|||
|
|||
|
|||
|
|||
.oragin {} |
|||
|
|||
uni-page-body, |
|||
page { |
|||
background: #FFFFFF; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,268 @@ |
|||
<template> |
|||
<!-- 有列表的时候用 :auto='false' 需要你在onload等调用reload方法 --> |
|||
<z-paging ref="paging" v-model="data" @query="queryList" :pagingStyle='styleObject' :auto='true'> |
|||
|
|||
<view v-for="(item,index) in data" |
|||
style=" display: flex;flex-direction: column;margin-left: 10px;margin-right: 10px;"> |
|||
|
|||
<view v-show="item.type=='1'" > |
|||
<view class="item" :class="{ item2: item.state=='已提货' }" |
|||
style="display: flex;flex-direction: row;padding: 25px 15px; "> |
|||
|
|||
<view style="margin-left: 10px; margin-right: 10px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/personNormal.png" mode="aspectFill" |
|||
v-show="item.state=='未提货'" style="width: 50px;height: 50px;" /> |
|||
|
|||
<image src="https://supervise.yxtsoft.com/lpk/image/peronLose.png" mode="aspectFill" |
|||
v-show="item.state=='已提货'" style="width: 50px;height: 50px;" /> |
|||
|
|||
</view> |
|||
|
|||
|
|||
<view style=" display: flex;flex-direction: column;margin-right: 10px;"> |
|||
|
|||
<text style="color: #FE801A; font-size: 18px;">{{item.bagName}}</text> |
|||
|
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<text style="color: #333; font-size: 14px;">卡    号：</text> |
|||
<text style="color: #333; font-size: 14px;">{{item.serialNumber}}</text> |
|||
</view> |
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<text style="color: #333; font-size: 14px;">提货门店：</text> |
|||
<text style="color: #333; font-size: 14px;">{{item.store}}</text> |
|||
</view> |
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<text style="color: #333; font-size: 14px;">提货日期：</text> |
|||
<text style="color: #333; font-size: 14px;">{{item.reserveDate}}</text> |
|||
</view> |
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<text style="color: #333; font-size: 14px;">提 货 人：</text> |
|||
<text style="color: #333; font-size: 14px;">{{item.userName}}</text> |
|||
</view> |
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<text style="color: #333; font-size: 14px;">联系电话：</text> |
|||
<text style="color: #333; font-size: 14px;">{{item.userPhone}}</text> |
|||
</view> |
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<text style="color: #333; font-size: 14px;">状    态：</text> |
|||
<text style="font-size: 14px;" |
|||
:style="{color:(item.state=='未提货'? '#FE8128' : '#333')}">{{item.state}}</text> |
|||
</view> |
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<text style="color: #999; font-size: 12px;">- {{item.goods}}</text> |
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
|
|||
<view v-show="item.type=='2'"> |
|||
<view class="item3" :class="{ item4: item.state=='已提货' }" |
|||
style="display: flex;flex-direction: row;padding: 25px 15px;"> |
|||
|
|||
<view style="margin-left: 10px; margin-right: 10px;"> |
|||
|
|||
<image src="https://supervise.yxtsoft.com/lpk/image/giftNormal.png" mode="aspectFill" |
|||
v-show="item.state=='未提货'" style="width: 50px;height: 50px;" /> |
|||
|
|||
<image src="https://supervise.yxtsoft.com/lpk/image/giftLose.png" mode="aspectFill" |
|||
v-show="item.state=='已提货'" style="width: 50px;height: 50px;" /> |
|||
|
|||
</view> |
|||
|
|||
<view style=" display: flex;flex-direction: column; margin-right: 10px;"> |
|||
|
|||
<text style="color: #FE801A; font-size: 18px;">{{item.bagName}}</text> |
|||
|
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<text style="color: #333; font-size: 14px;">窖    号：</text> |
|||
<text style="color: #333; font-size: 14px;">{{item.serialNumber}}</text> |
|||
</view> |
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<text style="color: #333; font-size: 14px;">提货门店：</text> |
|||
<text style="color: #333; font-size: 14px;">{{item.store}}</text> |
|||
</view> |
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<text style="color: #333; font-size: 14px;">提货日期：</text> |
|||
<text style="color: #333; font-size: 14px;">{{item.reserveDate}}</text> |
|||
</view> |
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<text style="color: #333; font-size: 14px;">提 货 人：</text> |
|||
<text style="color: #333; font-size: 14px;">{{item.userName}}</text> |
|||
</view> |
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<text style="color: #333; font-size: 14px;">联系电话：</text> |
|||
<text style="color: #333; font-size: 14px;">{{item.userPhone}}</text> |
|||
</view> |
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<text style="color: #333; font-size: 14px;">状    态：</text> |
|||
<text style="font-size: 14px;" |
|||
:style="{color:(item.state=='未提货'? '#FE8128' : '#333')}">{{item.state}}</text> |
|||
</view> |
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<text style="color: #999; font-size: 12px;">- {{item.goods}}</text> |
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
</view> |
|||
|
|||
<view v-show="item.type=='3'"> |
|||
<view class="item5" :class="{ item6: item.state=='已提货' }" |
|||
style="display: flex;flex-direction: row;padding: 25px 15px;"> |
|||
|
|||
<view style="margin-left: 10px; margin-right: 10px;"> |
|||
|
|||
<image src="https://supervise.yxtsoft.com/lpk/image/enterpriseNormal.png" mode="aspectFill" |
|||
v-show="item.state=='未提货'" style="width: 50px;height: 50px;" /> |
|||
|
|||
<image src="https://supervise.yxtsoft.com/lpk/image/enterpriseLose.png" mode="aspectFill" |
|||
v-show="item.state=='已提货'" style="width: 50px;height: 50px;" /> |
|||
|
|||
</view> |
|||
|
|||
<view style=" display: flex;flex-direction: column; margin-right: 10px;"> |
|||
|
|||
<text style="color: #FE801A; font-size: 18px;">{{item.bagName}}</text> |
|||
|
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<text style="color: #333; font-size: 14px;">窖    号：</text> |
|||
<text style="color: #333; font-size: 14px;">{{item.serialNumber}}</text> |
|||
</view> |
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<text style="color: #333; font-size: 14px;">提货门店：</text> |
|||
<text style="color: #333; font-size: 14px;">{{item.store}}</text> |
|||
</view> |
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<text style="color: #333; font-size: 14px;">提货日期：</text> |
|||
<text style="color: #333; font-size: 14px;">{{item.reserveDate}}</text> |
|||
</view> |
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<text style="color: #333; font-size: 14px;">提 货 人：</text> |
|||
<text style="color: #333; font-size: 14px;">{{item.userName}}</text> |
|||
</view> |
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<text style="color: #333; font-size: 14px;">联系电话：</text> |
|||
<text style="color: #333; font-size: 14px;">{{item.userPhone}}</text> |
|||
</view> |
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<text style="color: #333; font-size: 14px;">状    态：</text> |
|||
<text style="font-size: 14px;" |
|||
:style="{color:(item.state=='未提货'? '#FE8128' : '#333')}">{{item.state}}</text> |
|||
</view> |
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<text style="color: #999; font-size: 12px;">- {{item.goods}}</text> |
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
|
|||
</z-paging> |
|||
|
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
styleObject:{ |
|||
'padding-top': '10px', |
|||
}, |
|||
data: [] |
|||
} |
|||
}, |
|||
created() { |
|||
// this.$bus.$on('order', msg => { |
|||
// console.log("aaaaaaaaaaa4", msg) |
|||
// this.$refs.paging.reload(true); |
|||
// }); |
|||
this.$bus.$on('order2', msg => { |
|||
console.log("aaaaaaaaaaa4", msg) |
|||
this.$refs.paging.reload(true); |
|||
}); |
|||
}, |
|||
methods: { |
|||
// 分页的请求 |
|||
queryList(pageNo, pageSize) { |
|||
let _this = this |
|||
_this.$api.orderListByUserSid({ |
|||
"current": pageNo, |
|||
"size": pageSize, |
|||
"params": { |
|||
"userSid": getApp().globalData.sid |
|||
} |
|||
}).then((resp) => { |
|||
// 添加数据源 |
|||
this.$refs.paging.complete(resp.records) |
|||
}).catch(e => { |
|||
// 出错了，点击重试 |
|||
_this.$refs.paging.complete(false); |
|||
}) |
|||
}, |
|||
detail(sid) { |
|||
uni.navigateTo({ |
|||
url: '/pages/card/card_record_detail?sid=' + sid |
|||
}) |
|||
}, |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
.item { |
|||
/* 加载背景图 */ |
|||
background-image: url(https://supervise.yxtsoft.com/lpk/image/record_perosn_item1.png); |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
background-size: 100% 100%; |
|||
} |
|||
|
|||
.item2 { |
|||
/* 加载背景图 */ |
|||
background-image: url(https://supervise.yxtsoft.com/lpk/image/record_person_item2.png); |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
background-size: 100% 100%; |
|||
} |
|||
|
|||
.item3 { |
|||
/* 加载背景图 */ |
|||
background-image: url(https://supervise.yxtsoft.com/lpk/image/record_gift_item3.png); |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
background-size: 100% 100%; |
|||
} |
|||
|
|||
.item4 { |
|||
/* 加载背景图 */ |
|||
background-image: url(https://supervise.yxtsoft.com/lpk/image/record_gift_item4.png); |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
background-size: 100% 100%; |
|||
} |
|||
|
|||
.item5 { |
|||
/* 加载背景图 */ |
|||
background-image: url(https://supervise.yxtsoft.com/lpk/image/record_enterprise_item5.png); |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
background-size: 100% 100%; |
|||
} |
|||
|
|||
.item6 { |
|||
/* 加载背景图 */ |
|||
background-image: url(https://supervise.yxtsoft.com/lpk/image/record_enterprise_item6.png); |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
background-size: 100% 100%; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,278 @@ |
|||
<template> |
|||
<view style="display: flex;flex-direction: column;height: 100vh;background: -webkit-linear-gradient(left,#FEA65F,#FB9440);"> |
|||
<!-- 有列表的时候用 :auto='false' 需要你在onload等调用reload方法 --> |
|||
<z-paging ref="paging" v-model="data" @query="queryList" :pagingStyle='styleObject' :auto='true'> |
|||
|
|||
<view v-for="(item,index) in data" |
|||
style=" display: flex;flex-direction: column;margin-left: 10px;margin-right: 10px;"> |
|||
|
|||
<view v-show="item.type=='1'"> |
|||
<view class="item" :class="{ item2: item.state=='已提货' }" |
|||
style="display: flex;flex-direction: row;padding: 25px 15px; "> |
|||
|
|||
<view style="margin-left: 10px; margin-right: 10px;"> |
|||
|
|||
<image src="https://supervise.yxtsoft.com/lpk/image/home_family.png" mode="aspectFill" |
|||
v-show="item.state=='未提货'" style="width: 50px;height: 50px;" /> |
|||
|
|||
<image src="https://supervise.yxtsoft.com/lpk/image/home_notFamily.png" mode="aspectFill" |
|||
v-show="item.state=='已提货'" style="width: 50px;height: 50px;" /> |
|||
|
|||
</view> |
|||
|
|||
|
|||
<view style=" display: flex;flex-direction: column;margin-right: 10px;"> |
|||
|
|||
<text style="color: #FE801A; font-size: 18px;">{{item.bagName}}</text> |
|||
|
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<text style="color: #333; font-size: 14px;">窖    号：</text> |
|||
<text style="color: #333; font-size: 14px;">{{item.serialNumber}}</text> |
|||
</view> |
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<text style="color: #333; font-size: 14px;">提货门店：</text> |
|||
<text style="color: #333; font-size: 14px;">{{item.store}}</text> |
|||
</view> |
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<text style="color: #333; font-size: 14px;">提货日期：</text> |
|||
<text style="color: #333; font-size: 14px;">{{item.reserveDate}}</text> |
|||
</view> |
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<text style="color: #333; font-size: 14px;">提 货 人：</text> |
|||
<text style="color: #333; font-size: 14px;">{{item.userName}}</text> |
|||
</view> |
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<text style="color: #333; font-size: 14px;">联系电话：</text> |
|||
<text style="color: #333; font-size: 14px;">{{item.userPhone}}</text> |
|||
</view> |
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<text style="color: #333; font-size: 14px;">状    态：</text> |
|||
<text style="font-size: 14px;" |
|||
:style="{color:(item.state=='未提货'? '#FE8128' : '#333')}">{{item.state}}</text> |
|||
</view> |
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<text style="color: #999; font-size: 12px;">- {{item.goods}}</text> |
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
|
|||
<view v-show="item.type=='2'"> |
|||
<view class="item3" :class="{ item4: item.state=='已提货' }" |
|||
style="display: flex;flex-direction: row;padding: 25px 15px;"> |
|||
|
|||
|
|||
<view style="margin-left: 10px; margin-right: 10px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/home_affection.png" mode="aspectFill" |
|||
v-show="item.state=='未提货'" style="width: 50px;height: 50px;" /> |
|||
|
|||
<image src="https://supervise.yxtsoft.com/lpk/image/home_notAffection.png" mode="aspectFill" |
|||
v-show="item.state=='已提货'" style="width: 50px;height: 50px;" /> |
|||
|
|||
</view> |
|||
|
|||
<view style=" display: flex;flex-direction: column; margin-right: 10px;"> |
|||
|
|||
<text style="color: #FE801A; font-size: 18px;">{{item.bagName}}</text> |
|||
|
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<text style="color: #333; font-size: 14px;">窖    号：</text> |
|||
<text style="color: #333; font-size: 14px;">{{item.serialNumber}}</text> |
|||
</view> |
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<text style="color: #333; font-size: 14px;">提货门店：</text> |
|||
<text style="color: #333; font-size: 14px;">{{item.store}}</text> |
|||
</view> |
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<text style="color: #333; font-size: 14px;">提货日期：</text> |
|||
<text style="color: #333; font-size: 14px;">{{item.reserveDate}}</text> |
|||
</view> |
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<text style="color: #333; font-size: 14px;">提 货 人：</text> |
|||
<text style="color: #333; font-size: 14px;">{{item.userName}}</text> |
|||
</view> |
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<text style="color: #333; font-size: 14px;">联系电话：</text> |
|||
<text style="color: #333; font-size: 14px;">{{item.userPhone}}</text> |
|||
</view> |
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<text style="color: #333; font-size: 14px;">状    态：</text> |
|||
<text style="font-size: 14px;" |
|||
:style="{color:(item.state=='未提货'? '#FE8128' : '#333')}">{{item.state}}</text> |
|||
</view> |
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<text style="color: #999; font-size: 12px;">- {{item.goods}}</text> |
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
</view> |
|||
|
|||
<view v-show="item.type=='3'"> |
|||
<view class="item5" :class="{ item6: item.state=='已提货' }" |
|||
style="display: flex;flex-direction: row;padding: 25px 15px;"> |
|||
|
|||
<view style="margin-left: 10px; margin-right: 10px;"> |
|||
|
|||
<image src="https://supervise.yxtsoft.com/lpk/image/home_enterprise.png" mode="aspectFill" |
|||
v-show="item.state=='未提货'" style="width: 50px;height: 50px;" /> |
|||
|
|||
<image src="https://supervise.yxtsoft.com/lpk/image/home_notEnterprise.png" |
|||
mode="aspectFill" v-show="item.state=='已提货'" style="width: 50px;height: 50px;" /> |
|||
|
|||
</view> |
|||
|
|||
<view style=" display: flex;flex-direction: column; margin-right: 10px;"> |
|||
|
|||
<text style="color: #FE801A; font-size: 18px;">{{item.bagName}}</text> |
|||
|
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<text style="color: #333; font-size: 14px;">窖    号：</text> |
|||
<text style="color: #333; font-size: 14px;">{{item.serialNumber}}</text> |
|||
</view> |
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<text style="color: #333; font-size: 14px;">提货门店：</text> |
|||
<text style="color: #333; font-size: 14px;">{{item.store}}</text> |
|||
</view> |
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<text style="color: #333; font-size: 14px;">提货日期：</text> |
|||
<text style="color: #333; font-size: 14px;">{{item.reserveDate}}</text> |
|||
</view> |
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<text style="color: #333; font-size: 14px;">提 货 人：</text> |
|||
<text style="color: #333; font-size: 14px;">{{item.userName}}</text> |
|||
</view> |
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<text style="color: #333; font-size: 14px;">联系电话：</text> |
|||
<text style="color: #333; font-size: 14px;">{{item.userPhone}}</text> |
|||
</view> |
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<text style="color: #333; font-size: 14px;">状    态：</text> |
|||
<text style="font-size: 14px;" |
|||
:style="{color:(item.state=='未提货'? '#FE8128' : '#333')}">{{item.state}}</text> |
|||
</view> |
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<text style="color: #999; font-size: 12px;">- {{item.goods}}</text> |
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
|
|||
</z-paging> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
styleObject: { |
|||
'padding-top': '10px', |
|||
'border-bottom-left-radius': '25px', |
|||
'border-bottom-right-radius': '25px', |
|||
'background': '#fff', |
|||
'margin-bottom': "60px" |
|||
}, |
|||
data: [] |
|||
} |
|||
}, |
|||
onShow() { |
|||
}, |
|||
created() { |
|||
// this.$bus.$on('order', msg => { |
|||
// console.log("aaaaaaaaaaa4", msg) |
|||
// this.$refs.paging.reload(true); |
|||
// }); |
|||
this.$bus.$on('order2', msg => { |
|||
console.log("aaaaaaaaaaa4", msg) |
|||
this.$refs.paging.reload(true); |
|||
}); |
|||
}, |
|||
methods: { |
|||
// 分页的请求 |
|||
queryList(pageNo, pageSize) { |
|||
let _this = this |
|||
_this.$api.orderListByUserSid({ |
|||
"current": pageNo, |
|||
"size": pageSize, |
|||
"params": { |
|||
"userSid": getApp().globalData.sid |
|||
} |
|||
}).then((resp) => { |
|||
// 添加数据源 |
|||
this.$refs.paging.complete(resp.records) |
|||
}).catch(e => { |
|||
// 出错了，点击重试 |
|||
_this.$refs.paging.complete(false); |
|||
}) |
|||
}, |
|||
detail(sid) { |
|||
uni.navigateTo({ |
|||
url: '/pages/card/card_record_detail?sid=' + sid |
|||
}) |
|||
}, |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
.item { |
|||
/* 加载背景图 */ |
|||
background-image: url(https://supervise.yxtsoft.com/lpk/image/record_family_item1.png); |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
background-size: 100% 100%; |
|||
|
|||
} |
|||
|
|||
.item2 { |
|||
/* 加载背景图 */ |
|||
background-image: url(https://supervise.yxtsoft.com/lpk/image/record_family_item2.png); |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
background-size: 100% 100%; |
|||
} |
|||
|
|||
.item3 { |
|||
/* 加载背景图 */ |
|||
background-image: url(https://supervise.yxtsoft.com/lpk/image/record_affection_item1.png); |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
background-size: 100% 100%; |
|||
} |
|||
|
|||
.item4 { |
|||
|
|||
/* 加载背景图 */ |
|||
background-image: url(https://supervise.yxtsoft.com/lpk/image/record_affection_item2.png); |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
background-size: 100% 100%; |
|||
} |
|||
|
|||
.item5 { |
|||
/* 加载背景图 */ |
|||
background-image: url(https://supervise.yxtsoft.com/lpk/image/record_enterprise_item1.png); |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
background-size: 100% 100%; |
|||
} |
|||
|
|||
.item6 { |
|||
/* 加载背景图 */ |
|||
background-image: url(https://supervise.yxtsoft.com/lpk/image/record_enterprise_item2.png); |
|||
/* 让背景图基于容器大小伸缩 */ |
|||
background-size: 100% 100%; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,243 @@ |
|||
<template> |
|||
<view> |
|||
<!-- 自定义导航栏 --> |
|||
<view class="navBarBox"> |
|||
<!-- 状态栏占位 --> |
|||
<view class="statusBar" :style="{ paddingTop: statusBarHeight + 'px' }"></view> |
|||
<!-- 真正的导航栏内容 --> |
|||
<view class="navBar"> |
|||
<view>绑定账号</view> |
|||
</view> |
|||
</view> |
|||
<view style="margin-top: 30rpx;"> |
|||
<view class="inputRow"> |
|||
<!-- <image src="../../static/baseIcon/username.png" mode="aspectFill" class="drawableLeft"></image> --> |
|||
<input type="number" maxlength="11" @input="phoneText" placeholder="请输入手机号" class="input" /> |
|||
<SendCodeItem :phoneNum="page.mobile" url="/v1/wxuser/sendVerificationCode" @click="send" |
|||
ref="wxCodeItem"></SendCodeItem> |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
<!-- <view class="inputRow"> |
|||
<image src="../../static/baseIcon/code.png" mode="aspectFill" class="drawableLeft"></image> |
|||
<input type="number" @input="codeText" maxlength="6" placeholder="请输入验证码" class="input" /> |
|||
</view> --> |
|||
|
|||
|
|||
<view class="btn" @click="next"> |
|||
<text class="btnText">绑定账号</text> |
|||
</view> |
|||
|
|||
<view v-show="!isShow"> |
|||
<view style="display: flex;flex-direction: column;justify-content: center;width: 100%;margin-top: 50px;"> |
|||
<text style="width: 100%;text-align: center;font-size: 35px;color: #f00;">抱歉！</text> |
|||
<text style="margin: 20px; text-align: center;font-size: 30px;color: #f00;">您的平台应用未被授权，请联系工作人员。</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
isShow: true, |
|||
// 状态栏高度 |
|||
statusBarHeight: 0, |
|||
// 导航栏高度 |
|||
navBarHeight: 82 + 11, |
|||
page: { |
|||
mobile: '', |
|||
openid: '', |
|||
code: '', |
|||
unionid: "" |
|||
} |
|||
}; |
|||
}, |
|||
|
|||
//第一次加载时调用 |
|||
created() { |
|||
//获取手机状态栏高度 |
|||
this.statusBarHeight = uni.getSystemInfoSync()['statusBarHeight']; |
|||
}, |
|||
onShow() { |
|||
/* #ifdef MP-WEIXIN */ |
|||
wx.hideHomeButton(); |
|||
/* #endif */ |
|||
}, |
|||
onLoad(options) { |
|||
console.log('=======', options) |
|||
this.page.openid = options.openid |
|||
this.page.unionid = options.unionid |
|||
console.log('this.page', this.page) |
|||
|
|||
}, |
|||
methods: { |
|||
next() { |
|||
var mobileLength = this.page.mobile.length; |
|||
var codeLength = this.page.code.length; |
|||
if (mobileLength == 0) { |
|||
uni.showToast({ |
|||
icon: 'error', |
|||
title: '手机号不能为空' |
|||
}) |
|||
return; |
|||
} |
|||
|
|||
let _this = this |
|||
console.log('1111', _this.page) |
|||
_this.$api.wxBindMobile(_this.page).then((resp) => { |
|||
// if (resp.success) { |
|||
console.log('1111', resp) |
|||
|
|||
getApp().globalData.sid = resp |
|||
// getApp().globalData.token = resp.token |
|||
// getApp().globalData.sid = resp.sid |
|||
// getApp().globalData.mobile = resp.mobile |
|||
// getApp().globalData.isLogin = true |
|||
|
|||
// _this.WritePreference("sysUserSid", res.data) |
|||
// _this.WritePreference("isLogin", true) |
|||
// getApp().globalData.isLogin = true |
|||
// getApp().globalData.sysUserSid = res.data |
|||
|
|||
uni.switchTab({ |
|||
url: '/pages/card/card' |
|||
}) |
|||
|
|||
// uni.switchTab({ |
|||
// url: '/pages/home/WorkFragment' |
|||
// }); |
|||
}).catch(e => { |
|||
console.log('eeeee', e) |
|||
// uni.showModal({ |
|||
// title: '温馨提示', |
|||
// content: '您的平台应用未被授权，请联系工作人员。', |
|||
// showCancel: false, |
|||
// success: function(res) { |
|||
// if (res.confirm) { |
|||
|
|||
// } else { |
|||
// console.log('点击了取消') |
|||
// } |
|||
// } |
|||
// }) |
|||
|
|||
}) |
|||
|
|||
|
|||
// this.HTTP({ |
|||
// url: 'aos/v1/aosUser/wxBindMobile', |
|||
// data: { |
|||
// mobile: this.page.phone, |
|||
// sysUserWxAuthSid: this.page.sysUserWxAuthSid, |
|||
// code: this.page.code |
|||
// }, |
|||
// method: 'POST', |
|||
// paramsType: "JSON", |
|||
// loading: true |
|||
// }).then((res) => { |
|||
// console.log('=======', res) |
|||
// if (res.code == 200) { |
|||
// // 保存 |
|||
// _this.WritePreference("sysUserSid", res.data) |
|||
// _this.WritePreference("isLogin", true) |
|||
// getApp().globalData.isLogin = true |
|||
// getApp().globalData.sysUserSid = res.data |
|||
// console.log( |
|||
// '=======1111111111111111111111111111111sdfasdf;kjasdfjkasdklfkasdjf;asdddddddddddddd', |
|||
// res) |
|||
// // $emit 触发事件 （主要返回给webviwew页面） |
|||
// // uni.$emit('login', res.data.memberSid) |
|||
// uni.navigateBack({ |
|||
// delta: 10 |
|||
// }); |
|||
|
|||
// } |
|||
// }); |
|||
|
|||
|
|||
}, |
|||
phoneText(e) { |
|||
//手机号 |
|||
this.page.mobile = e.detail.value; |
|||
}, |
|||
send(e) { //发送验证码 |
|||
console.log(e); |
|||
this.isShow = e.success |
|||
console.log("this.isShow", this.isShow); |
|||
|
|||
}, |
|||
codeText(e) { |
|||
//验证码 |
|||
this.page.code = e.detail.value; |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
|
|||
<style lang="scss"> |
|||
.navBarBox { |
|||
background: #007AFF; |
|||
} |
|||
|
|||
.navBarBox .statusBar {} |
|||
|
|||
.navBarBox .navBar { |
|||
padding-top: 15px; |
|||
padding-bottom: 13px; |
|||
display: flex; |
|||
font-size: 13px; |
|||
flex-direction: row; |
|||
color: #ffffff; |
|||
justify-content: center; |
|||
align-items: center; |
|||
} |
|||
|
|||
.inputRow { |
|||
display: flex; |
|||
margin-left: 30rpx; |
|||
margin-right: 30rpx; |
|||
margin-bottom: 10rpx; |
|||
margin-top: 10rpx; |
|||
padding-bottom: 10rpx; |
|||
border-bottom: 0.1px #F1F1F1 solid; |
|||
align-items: center; |
|||
|
|||
.input { |
|||
margin-left: 20rpx; |
|||
height: 70rpx; |
|||
flex: 1; |
|||
font-size: 32rpx; |
|||
} |
|||
|
|||
.drawableLeft { |
|||
width: 40rpx; |
|||
height: 40rpx; |
|||
margin: 20rpx; |
|||
} |
|||
} |
|||
|
|||
.btn { |
|||
display: flex; |
|||
width: 90%; |
|||
height: 80rpx; |
|||
flex-direction: column; |
|||
background-color: #007AFF; |
|||
margin-top: 80rpx; |
|||
margin-left: auto; |
|||
margin-right: auto; |
|||
align-items: center; |
|||
justify-content: center; |
|||
border-radius: 10rpx; |
|||
|
|||
.btnText { |
|||
color: #ffffff; |
|||
font-size: 33rpx; |
|||
} |
|||
} |
|||
</style> |
|||
@ -0,0 +1,261 @@ |
|||
<template> |
|||
|
|||
<view style="margin-left: 20px; margin-right: 20px;padding-bottom: 50px"> |
|||
|
|||
<view style="display: flex;width: 100%;"> |
|||
<view style="flex: 1;"></view> |
|||
<text style="size: 25px;font-family: sans-serif;font-weight: 600;color: white; |
|||
margin-top: 10px;margin-right: 5px;border: none; padding: 5px 15px; |
|||
border-radius: 5px 5px; |
|||
background: #0498FD;" @click="download"> |
|||
下载 |
|||
</text> |
|||
</view> |
|||
|
|||
|
|||
<view |
|||
style="display: flex;width: 100%;justify-content: center;size: 25px;font-family: sans-serif;font-weight: 600;margin-top: 10px;"> |
|||
每日回款审核报告 |
|||
</view> |
|||
|
|||
<view style="margin-top: 20px;font-family: sans-serif;font-weight: 600;">石家庄汇融农村合作银行振头支行：</view> |
|||
|
|||
<view style=" line-height: 30px; margin-top: 10px;text-indent:2em;"> |
|||
<text style="font-family: sans-serif;font-weight: 600;">{{info.companyName}}</text> |
|||
<text>昨日销售及今日回款情况如下：昨日销售总计：</text> |
|||
<text style="font-family: sans-serif;font-weight: 600;">{{info.totalSales}}</text> |
|||
<text> 元，今日应回款：</text> |
|||
<text style="font-family: sans-serif;font-weight: 600;">{{info.collection}}</text> |
|||
<text> 元，今日实际回款：</text> |
|||
<text style="font-family: sans-serif;font-weight: 600;">{{info.actualCollection}}</text> |
|||
<text> 元，回款差额：</text> |
|||
<text style="font-family: sans-serif;font-weight: 600;">{{info.difference}}</text> |
|||
<text> 元，未回款原因平台扣除手续费、服务费等。具体原因详见附件今日回款明细。</text> |
|||
|
|||
<view> |
|||
<text>截至</text> |
|||
<text style="font-family: sans-serif;font-weight: 600;">{{info.endTime}}</text> |
|||
<text>，今日支付完毕款项后，账户余额为：</text> |
|||
<text style="font-family: sans-serif;font-weight: 600;">{{info.balance}}</text> |
|||
<text> 元。</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view style="display: flex;flex-direction: column;margin-top: 15px; line-height: 30px;"> |
|||
<text style="size: 25px;font-family: sans-serif;font-weight: 600;">审核结果：</text> |
|||
<text style="text-indent:2em;">{{info.auditResult}}</text> |
|||
<!-- <view> |
|||
<text |
|||
style="margin-top: 10px;text-indent:2em;">实际回款资金已按要求回到{{info.companyName}}{{info.account}}（账号为</text> |
|||
<text style="font-family: sans-serif;font-weight: 600;">{{info.accountNumber}}</text> |
|||
<text>）。</text> |
|||
</view> --> |
|||
|
|||
</view> |
|||
|
|||
|
|||
<view style="display: flex;flex-direction: column;width: 100%;align-items: flex-end; margin-top: 30px;"> |
|||
|
|||
<text style="font-family: sans-serif;font-weight: 600;">{{info.reviewedBy}}</text> |
|||
<text style="margin-top:10px ; font-family: sans-serif;font-weight: 600;">{{info.date}}</text> |
|||
|
|||
</view> |
|||
|
|||
|
|||
<view style="margin-top: 50px; display: flex; flex-direction: column;"> |
|||
<text style="size: 25px;font-family: sans-serif;font-weight: 600;padding-bottom: 10px;">附件：今日回款明细</text> |
|||
<uni-table ref="table1" border stripe emptyText="暂无更多数据"> |
|||
<uni-tr> |
|||
<uni-th align="center">销售日期</uni-th> |
|||
<uni-th align="center">支付渠道</uni-th> |
|||
<uni-th align="center">金额（元）</uni-th> |
|||
<uni-th align="center">对应公司主体</uni-th> |
|||
<uni-th align="center">回款金额</uni-th> |
|||
<uni-th align="center">回款差额</uni-th> |
|||
<uni-th align="center">备注</uni-th> |
|||
</uni-tr> |
|||
<uni-tr v-for="(item, index) in tableData1" :key="index"> |
|||
<uni-td align="center">{{ item.salesDate }}</uni-td> |
|||
<uni-td align="center">{{ item.payChannels }}</uni-td> |
|||
<uni-td align="center">{{ item.money }}</uni-td> |
|||
<uni-td align="center">{{ item.mainBody }}</uni-td> |
|||
<uni-td align="center">{{ item.collection }}</uni-td> |
|||
<uni-td align="center">{{ item.different }}</uni-td> |
|||
<uni-td align="center">{{ item.notes }}</uni-td> |
|||
</uni-tr> |
|||
|
|||
</uni-table> |
|||
|
|||
</view> |
|||
|
|||
<view style="margin-top: 30px; display: flex; flex-direction: column;"> |
|||
<text style="size: 25px;font-family: sans-serif;font-weight: 600;padding-bottom: 10px;">附件：昨日销售报表</text> |
|||
|
|||
<uni-table ref="table2" border stripe emptyText="暂无更多数据"> |
|||
|
|||
<uni-tr> |
|||
<uni-th align="center">支付渠道</uni-th> |
|||
<uni-th align="center">金额（元）</uni-th> |
|||
<uni-th align="center">对应公司主体</uni-th> |
|||
<uni-th align="center">到账周期</uni-th> |
|||
</uni-tr> |
|||
<uni-tr v-for="(item, index) in tableData2" :key="index"> |
|||
<uni-td align="center">{{ item.payChannels }}</uni-td> |
|||
<uni-td align="center">{{ item.money }}</uni-td> |
|||
<uni-td align="center">{{ item.mainBody }}</uni-td> |
|||
<uni-td align="center">{{ item.cycle }}</uni-td> |
|||
</uni-tr> |
|||
|
|||
</uni-table> |
|||
</view> |
|||
|
|||
|
|||
|
|||
</view> |
|||
|
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
queryParams: { |
|||
dataDate: "2023-06-14", |
|||
companyName: "河北源蜂惠民科技集团有限公司" |
|||
}, |
|||
loading1: false, |
|||
loading2: false, |
|||
info: { |
|||
companyName: "", |
|||
totalSales: "", |
|||
collection: "", |
|||
actualCollection: "", |
|||
different: "", |
|||
endTime: "", |
|||
balance: "", |
|||
account: "", |
|||
accountNumber: "", |
|||
reviewedBy: "", |
|||
date: "", |
|||
}, |
|||
|
|||
tableData1: [ |
|||
// { |
|||
// "salesDate": "2023年6月7日", |
|||
// "payChannels": "批发-京东", |
|||
// "money": "397.09", |
|||
// "mainBody": "源蜂-汇融", |
|||
// "collection": "357.87", |
|||
// "different": "39.22", |
|||
// "notes": "6.7回小时购150.12" |
|||
// }, |
|||
], |
|||
tableData2: [ |
|||
// { |
|||
// "payChannels": "现金", |
|||
// "money": "63094.88", |
|||
// "mainBody": "-", |
|||
// "cycle": "每月19号归集" |
|||
// }, |
|||
], |
|||
|
|||
fileUrl: "" |
|||
}; |
|||
}, |
|||
onLoad(option) { |
|||
|
|||
// this.queryParams = { |
|||
// dataDate: option.dataDate, |
|||
// companyName: option.companyName |
|||
// } |
|||
|
|||
console.log('1111', this.queryParams) |
|||
this.getData() |
|||
|
|||
}, |
|||
onShow() { |
|||
wx.hideHomeButton() |
|||
}, |
|||
methods: { |
|||
|
|||
download() { |
|||
if (this.fileUrl == '') { |
|||
uni.showToast({ |
|||
title: "下载地址错误，请重新进入页面。", |
|||
duration: 5000 |
|||
}) |
|||
return |
|||
} |
|||
|
|||
uni.downloadFile({ |
|||
url: this.fileUrl, // 网络文档地址 |
|||
success: (data) => { |
|||
if (data.statusCode === 200) { |
|||
uni.saveFile({ |
|||
tempFilePath: data.tempFilePath, //临时路径 |
|||
success: function(res) { |
|||
// 保存路径 |
|||
uni.showToast({ |
|||
title: "文件已保存：" + res.savedFilePath, |
|||
duration: 5000 |
|||
}) |
|||
setTimeout(() => { |
|||
//打开文档查看 |
|||
uni.openDocument({ |
|||
filePath: res.savedFilePath, |
|||
showMenu: true, //右上角是否有可以转发分享的功能 |
|||
success: function(res) { |
|||
console.log('打开文档成功') |
|||
} |
|||
}) |
|||
}, 3000); |
|||
} |
|||
}); |
|||
} |
|||
}, |
|||
fail: (err) => { |
|||
uni.showToast({ |
|||
title: '失败请重新下载' |
|||
}); |
|||
}, |
|||
}); |
|||
|
|||
|
|||
}, |
|||
|
|||
getData() { |
|||
console.log('getData', this.queryParams) |
|||
this.$api.getReportInfo(this.queryParams).then((resp) => { |
|||
console.log('1111>>>>>>', resp) |
|||
this.fileUrl = resp.downloadUrl |
|||
this.info = resp |
|||
|
|||
}).catch(e => { |
|||
console.log('eeeee', e) |
|||
}) |
|||
|
|||
this.$api.getCsmReportTodayByComSid(this.queryParams).then((resp) => { |
|||
console.log('2222>>>>>>', resp) |
|||
this.loading1 = true |
|||
this.tableData1 = resp |
|||
|
|||
}).catch(e => { |
|||
console.log('eeeee', e) |
|||
}) |
|||
|
|||
this.$api.getCsmReportYesterdayByComSid(this.queryParams).then((resp) => { |
|||
console.log('3333>>>>>>', resp) |
|||
this.loading2 = true |
|||
this.tableData2 = resp |
|||
|
|||
}).catch(e => { |
|||
console.log('eeeee', e) |
|||
}) |
|||
}, |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
</style> |
|||
File diff suppressed because it is too large
@ -0,0 +1,284 @@ |
|||
<template> |
|||
<view class="pages"> |
|||
<uni-card title="36524快消品动产质押项目" :isFull="true" extra="点击下载Excel文件" :thumbnail="avatar" |
|||
style="padding-top: 10px;"> |
|||
<template v-slot:title> |
|||
<uni-section :title="logInfo.title" title-font-size="25" type="line"> |
|||
<template v-slot:decoration> |
|||
<uni-icons type="location-filled" size="18" color="green"></uni-icons> |
|||
</template> |
|||
<template v-slot:right> <uni-tag :inverted="true" text="下载Excel文件" type="primary" |
|||
@click="onClick" /> </template> |
|||
</uni-section> |
|||
</template> |
|||
|
|||
<view style="display: flex;flex-direction: row;"> |
|||
|
|||
<view style="flex: 1;"> |
|||
<text>上报日期：</text> |
|||
<text>{{logInfo.reportTime}}</text> |
|||
</view> |
|||
|
|||
<view style="flex: 1;"> |
|||
<text>货值总计：</text> |
|||
<text>{{logInfo.countAmount}}</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<!-- <uni-list> |
|||
<uni-list-item title="上报日期:" :rightText="logInfo.reportTime"></uni-list-item> |
|||
<uni-list-item title="货值总计:" :right-text="logInfo.countAmount"></uni-list-item> |
|||
</uni-list> --> |
|||
|
|||
<view v-for="(item, index) in tableData1" style="margin-top: 10px;"> |
|||
<view> |
|||
<uni-title type="h3" :title="item.storeType" color="#444"></uni-title> |
|||
<uni-row> |
|||
<uni-col :span="8"> |
|||
<view class="table-header tleft"><text>仓库数量</text></view> |
|||
</uni-col> |
|||
<uni-col :span="8"> |
|||
<view class="table-header"><text>品种数量</text></view> |
|||
</uni-col> |
|||
<uni-col :span="8"> |
|||
<view class="table-header"><text>品种货值</text></view> |
|||
</uni-col> |
|||
</uni-row> |
|||
<uni-row> |
|||
<uni-col :span="8"> |
|||
<view class="table-body tleft"><text>{{item.storeNumber}}</text></view> |
|||
</uni-col> |
|||
<uni-col :span="8"> |
|||
<view class="table-body"><text>{{item.productCountNumber}}</text></view> |
|||
</uni-col> |
|||
<uni-col :span="8"> |
|||
<view class="table-body"><text>{{item.productAmount}}</text></view> |
|||
</uni-col> |
|||
</uni-row> |
|||
|
|||
</view> |
|||
</view> |
|||
|
|||
</uni-card> |
|||
|
|||
<uni-collapse style="margin-top: 10px;"> |
|||
|
|||
<uni-collapse-item title="仓库库存明细表" style="font-size: 18px;" :open="true"> |
|||
|
|||
<view style="display: flex;flex-direction: row;margin-left: 16px;"> |
|||
|
|||
<view style="flex: 1;"> |
|||
<text>商品数量合计：</text> |
|||
<text>{{logInfo2.countProductNumber}}</text> |
|||
</view> |
|||
|
|||
<view style="flex: 1;"> |
|||
<text>商品货值合计：</text> |
|||
<text>{{logInfo2.countAmount}}</text> |
|||
</view> |
|||
|
|||
</view> |
|||
<view class="ttbale"style="margin-top: 10px;" > |
|||
<uni-row> |
|||
<uni-col :span="8"> |
|||
<view class="table-header tleft"><text>序号</text></view> |
|||
</uni-col> |
|||
<uni-col :span="16"> |
|||
<view class="table-header"><text>仓库名称</text></view> |
|||
</uni-col> |
|||
</uni-row> |
|||
<uni-row> |
|||
<uni-col :span="8"> |
|||
<view class="table-header tleft"><text>商品数量</text></view> |
|||
</uni-col> |
|||
<uni-col :span="8"> |
|||
<view class="table-header"><text>商品品种数量</text></view> |
|||
</uni-col> |
|||
<uni-col :span="8"> |
|||
<view class="table-header"><text>货值</text></view> |
|||
</uni-col> |
|||
</uni-row> |
|||
</view> |
|||
|
|||
<view v-for="(item, index) in tableData2" > |
|||
|
|||
<view class="ttbale"> |
|||
<uni-row> |
|||
<uni-col :span="8"> |
|||
<view class="table-body tleft"><text>{{index+1}}</text></view> |
|||
</uni-col> |
|||
<uni-col :span="16"> |
|||
<view class="table-body"><text>{{item.storeCodeName}}</text></view> |
|||
</uni-col> |
|||
</uni-row> |
|||
<uni-row> |
|||
<uni-col :span="8"> |
|||
<view class="table-body tleft"><text>{{ item.productCountNumber}}</text></view> |
|||
</uni-col> |
|||
<uni-col :span="8"> |
|||
<view class="table-body"><text>{{item.typeNumber}}</text></view> |
|||
</uni-col> |
|||
<uni-col :span="8"> |
|||
<view class="table-body"><text>{{item.productAmount}}</text></view> |
|||
</uni-col> |
|||
</uni-row> |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
</uni-collapse-item> |
|||
|
|||
</uni-collapse> |
|||
|
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
components: {}, |
|||
data() { |
|||
return { |
|||
date: "2023-06-25", |
|||
tableData1: [], |
|||
logInfo: { |
|||
title: "", |
|||
reportTime: "", |
|||
countAmount: "", |
|||
}, |
|||
tableData2: [], |
|||
logInfo2: { |
|||
countProductNumber: "", |
|||
countAmount: "", |
|||
}, |
|||
tableData3: [], |
|||
logInfo3: { |
|||
countProductNumber: "", |
|||
countAmount: "", |
|||
}, |
|||
|
|||
|
|||
} |
|||
}, |
|||
onLoad(option) { |
|||
|
|||
// this.date = option.orderDate |
|||
|
|||
// console.log('1111', this.queryParams) |
|||
this.getData() |
|||
|
|||
|
|||
|
|||
}, |
|||
methods: { |
|||
onClick(e) { |
|||
uni.showToast({ |
|||
title: '点击下载文件', |
|||
duration: 2000 |
|||
}); |
|||
console.log(e) |
|||
}, |
|||
actionsClick(text) { |
|||
uni.showToast({ |
|||
title: text, |
|||
icon: 'none' |
|||
}) |
|||
}, |
|||
getData() { |
|||
console.log('getData', this.date) |
|||
this.$api.getReportInventoryDayGather(this.date).then((resp) => { |
|||
console.log('1111>>>>>>', resp) |
|||
this.fileUrl = resp.downloadUrl |
|||
this.tableData1 = resp.list |
|||
this.logInfo = { |
|||
title: resp.title, |
|||
reportTime: resp.orderDate, |
|||
countAmount: resp.countAmount, |
|||
} |
|||
|
|||
}).catch(e => { |
|||
console.log('eeeee', e) |
|||
}) |
|||
|
|||
this.$api.getReportInventoryDayStore(this.date).then((resp) => { |
|||
console.log('2222>>>>>>', resp) |
|||
this.tableData2 = resp.list |
|||
this.logInfo2 = { |
|||
countProductNumber: resp.countProductNumber, |
|||
countAmount: resp.countAmount, |
|||
} |
|||
}).catch(e => { |
|||
console.log('eeeee', e) |
|||
}) |
|||
|
|||
// this.$api.getReportInventoryDayToStore(this.date).then((resp) => { |
|||
// console.log('3333>>>>>>', resp) |
|||
// this.tableData3 = resp.list |
|||
// this.logInfo3 = { |
|||
// countProductNumber: resp.countProductNumber, |
|||
// countAmount: resp.countAmount, |
|||
// } |
|||
// }).catch(e => { |
|||
// console.log('eeeee', e) |
|||
// }) |
|||
}, |
|||
|
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss"> |
|||
.pages {} |
|||
|
|||
$uni-success: #18bc37 !default; |
|||
|
|||
.table-header { |
|||
text-align: center; |
|||
border: 0.5px solid #ccc; |
|||
font-weight: bold; |
|||
font-size: 15px; |
|||
border-left: 0.0px; |
|||
padding: 5px; |
|||
} |
|||
|
|||
.table-body { |
|||
text-align: center; |
|||
border: 0.5px solid #ccc; |
|||
font-size: 13px; |
|||
padding: 5px; |
|||
border-left: 0.0px; |
|||
border-top: 0.0px; |
|||
} |
|||
|
|||
.tleft { |
|||
border-left: 0.5px solid #ccc; |
|||
} |
|||
|
|||
.ttbale { |
|||
margin: 0px 10px 0px 10px; |
|||
// border-bottom: 1px solid #ccc; |
|||
} |
|||
|
|||
.uni-wrap { |
|||
flex-direction: column; |
|||
/* #ifdef H5 */ |
|||
height: calc(100vh - 44px); |
|||
/* #endif */ |
|||
/* #ifndef H5 */ |
|||
height: 100vh; |
|||
/* #endif */ |
|||
flex: 1; |
|||
} |
|||
|
|||
.mb-10 { |
|||
margin-bottom: 10px; |
|||
} |
|||
|
|||
.decoration { |
|||
width: 8px; |
|||
height: 8px; |
|||
margin-right: 4px; |
|||
border-radius: 50%; |
|||
background-color: $uni-success; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,247 @@ |
|||
<template> |
|||
<view class="charts-box" style="padding-bottom: 50px;"> |
|||
|
|||
<view class="top" style="margin-top: 15px;"> |
|||
<text>企业名称：</text> |
|||
<text>{{queryParams.businessName}}</text> |
|||
</view> |
|||
<view class="top"> |
|||
<text>核查日期：</text> |
|||
<text>{{queryParams.executionTime}}</text> |
|||
</view> |
|||
<view class="top"> |
|||
<text>核查结果：</text> |
|||
<text>{{result}}</text> |
|||
</view> |
|||
|
|||
<view v-show="isShow"> |
|||
|
|||
<view class="top"> |
|||
<text>异常信息详情：</text> |
|||
</view> |
|||
|
|||
<block v-for="item in list" :key="item.index"> |
|||
<!-- 包裹图片+两行文字 id="{{index}}"是给按下了那个item记录--> |
|||
<view class="view_tupian_wenzi" @click="clickData(item.index)"> |
|||
<!-- 包裹两行文字 --> |
|||
<view class="view_wenzi2"> |
|||
<view class="top2"> |
|||
<text>列入日期：</text> |
|||
<text>{{item.addDate}}</text> |
|||
</view> |
|||
<view class="top2"> |
|||
<text>列入经营异常名录原因：</text> |
|||
<text>{{item.addReason}}</text> |
|||
</view> |
|||
<view class="top2"> |
|||
<text>作出决定机关：</text> |
|||
<text>{{item.decisionOffice}}</text> |
|||
</view> |
|||
<view class="top2"> |
|||
<text>移出日期：</text> |
|||
<text>{{item.removeDate}}</text> |
|||
</view> |
|||
<view class="top2"> |
|||
<text>移出经营异常名录原因：</text> |
|||
<text>{{item.romoveReason}}</text> |
|||
</view> |
|||
<view class="top2"> |
|||
<text>移出决定机关：</text> |
|||
<text>{{item.removeDecisionOffice}}</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</block> |
|||
|
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
title: "", |
|||
result: "", |
|||
isShow: false, |
|||
queryParams: { |
|||
businessName: "", |
|||
executionTime: "" |
|||
}, |
|||
list: [], |
|||
fileUrl:"", |
|||
}; |
|||
}, |
|||
onLoad(option) { |
|||
|
|||
// var data = JSON.stringify(option) |
|||
|
|||
this.queryParams = { |
|||
businessName: option.businessName, |
|||
executionTime: option.executionTime |
|||
} |
|||
|
|||
console.log('1111', this.queryParams) |
|||
|
|||
// this.setData({ |
|||
// queryParams: JSON.stringify(option) |
|||
// }) |
|||
|
|||
// console.log('setData', this.queryParams) |
|||
this.getData() |
|||
|
|||
// console.log('App onLoad', JSON.stringify(option)) |
|||
// this.title = JSON.stringify(option) |
|||
// wx.showToast({ |
|||
// title: 'onLoad成功>>>>>' + JSON.stringify(option), |
|||
// icon: 'none', |
|||
// duration: 5000 //持续的时间 |
|||
// }) |
|||
|
|||
}, |
|||
onShow() { |
|||
wx.hideHomeButton() |
|||
}, |
|||
methods: { |
|||
download() { |
|||
uni.downloadFile({ |
|||
url: this.fileUrl,// 网络文档地址 |
|||
success: (data) => { |
|||
if (data.statusCode === 200) { |
|||
uni.saveFile({ |
|||
tempFilePath: data.tempFilePath, //临时路径 |
|||
success: function(res) { |
|||
// 保存路径 |
|||
uni.showToast({ title: "文件已保存："+res.savedFilePath,duration:5000 }) |
|||
setTimeout(()=>{ |
|||
//打开文档查看 |
|||
uni.openDocument({ |
|||
filePath:res.savedFilePath, |
|||
showMenu: true,//右上角是否有可以转发分享的功能 |
|||
success:function(res){ |
|||
console.log('打开文档成功') |
|||
} |
|||
}) |
|||
}, 3000); |
|||
} |
|||
}); |
|||
} |
|||
}, |
|||
fail: (err) => { |
|||
uni.showToast({ |
|||
title: '失败请重新下载' |
|||
}); |
|||
}, |
|||
}); |
|||
|
|||
|
|||
}, |
|||
getData() { |
|||
console.log('getData', this.queryParams) |
|||
this.$api.selectBusinessRiskInfo(this.queryParams).then((resp) => { |
|||
console.log('1111>>>>>>', resp) |
|||
this.list = resp |
|||
console.log('2222>>>>>>', this.list.length) |
|||
this.result = this.list.length == 0 ? "无异常信息" : "共有" + this.list.length + "条异常信息" |
|||
this.isShow = this.list.length == 0 ? false : true |
|||
|
|||
}).catch(e => { |
|||
console.log('eeeee', e) |
|||
}) |
|||
}, |
|||
clickData(e) { |
|||
console.log("按了：", e.currentTarget.id) |
|||
} |
|||
|
|||
|
|||
}, |
|||
|
|||
}; |
|||
</script> |
|||
|
|||
<style lang="scss"> |
|||
.top { |
|||
margin-left: 25px; |
|||
margin-top: 5px; |
|||
} |
|||
|
|||
/* 包裹图片和两行文字 */ |
|||
|
|||
.view_tupian_wenzi { |
|||
display: flex; |
|||
flex-direction: row; |
|||
align-items: center; |
|||
|
|||
/* 圆角 */ |
|||
border-radius: 20rpx; |
|||
|
|||
/* 边 */ |
|||
border: 3rpx solid #E0E3DA; |
|||
box-shadow: 5rpx 5rpx 5rpx 5rpx #E0E3DA; |
|||
|
|||
background-color: #ffffff; |
|||
margin: 30rpx; |
|||
|
|||
/* padding使得文字和图片不至于贴着边框 */ |
|||
padding: 30rpx; |
|||
|
|||
} |
|||
|
|||
/* 图片 */ |
|||
|
|||
.image_1 { |
|||
width: 100rpx; |
|||
height: 100rpx; |
|||
} |
|||
|
|||
/* 包裹两行文字 */ |
|||
|
|||
.view_wenzi2 { |
|||
|
|||
width: 100%; |
|||
margin-left: 25rpx; |
|||
display: flex; |
|||
flex-direction: column; |
|||
|
|||
.top2 { |
|||
margin-top: 5px; |
|||
} |
|||
|
|||
.text1 { |
|||
font-size: 15px; |
|||
overflow: hidden; |
|||
text-overflow: ellipsis; |
|||
display: -webkit-box; |
|||
-webkit-line-clamp: 1; |
|||
-webkit-box-orient: vertical; |
|||
} |
|||
|
|||
.text2 { |
|||
flex: 1; |
|||
margin-top: 5px; |
|||
font-size: 12px; |
|||
} |
|||
|
|||
|
|||
} |
|||
|
|||
/* 小字 */ |
|||
|
|||
.text_small { |
|||
font-size: 30rpx; |
|||
word-break: break-all; |
|||
color: #7a7878; |
|||
margin-top: 10rpx |
|||
} |
|||
|
|||
.text_small2 { |
|||
font-size: 25rpx; |
|||
color: #f00; |
|||
margin-top: 10rpx |
|||
} |
|||
</style> |
|||
@ -0,0 +1,176 @@ |
|||
<template> |
|||
<view class="charts-box"> |
|||
|
|||
<view style="display: flex;justify-content: center; width: 100%; "> |
|||
<text style="padding-top: 10px;padding-bottom: 10px;color: blue;margin-left: 20px;" @click="jump(1)">1</text> |
|||
<text style="padding-top: 10px;padding-bottom: 10px;color: blue;margin-left: 20px;" @click="jump(2)">2</text> |
|||
<text style="padding-top: 10px;padding-bottom: 10px;color: blue;margin-left: 20px;" @click="jump(3)">3</text> |
|||
</view> |
|||
|
|||
<view style="margin-top: 20px;margin-left: 20px;"> |
|||
<text>当日数据1</text> |
|||
<text style="margin-left: 10px;">{{newDate}}</text> |
|||
|
|||
</view> |
|||
|
|||
<view style="margin-top: 15px;margin-left: 10px;margin-right: 10px;"> |
|||
<qiun-data-charts type="column" :opts="opts" :chartData="chartData" /> |
|||
</view> |
|||
|
|||
|
|||
<view style="margin-top: 25px;margin-left: 15px;margin-right: 15px;"> |
|||
|
|||
<uni-table ref="table" :border="true" stripe type="" emptyText="暂无更多数据"> |
|||
<uni-tr> |
|||
<uni-th align="center">现金流量-经营活动产生的现金流量(元)</uni-th> |
|||
<uni-th align="center">总额</uni-th> |
|||
</uni-tr> |
|||
<uni-tr v-for="(item, index) in tableData" :key="index"> |
|||
<uni-td align="center">{{ item.name }}</uni-td> |
|||
<uni-td align="center">{{ item.price }}</uni-td> |
|||
</uni-tr> |
|||
</uni-table> |
|||
|
|||
</view> |
|||
|
|||
<view style="margin-top: 25px;margin-left: 15px;margin-right: 15px;"> |
|||
|
|||
<uni-table ref="table" :border="true" stripe type="" emptyText="暂无更多数据"> |
|||
<uni-tr> |
|||
<uni-th width="200" align="center">销售渠道类别</uni-th> |
|||
<uni-th align="center">总额</uni-th> |
|||
<uni-th align="center">应收帐款</uni-th> |
|||
<uni-th align="center">扣除应收</uni-th> |
|||
</uni-tr> |
|||
<uni-tr v-for="(item, index) in tableData2" :key="index"> |
|||
<uni-td align="center">{{ item.name }}</uni-td> |
|||
<uni-td align="center">{{ item.totalAmount }}</uni-td> |
|||
<uni-td align="center">{{ item.accountsReceivable }}</uni-td> |
|||
<uni-td align="center">{{ item.deductionAccountsReceivable }}</uni-td> |
|||
</uni-tr> |
|||
</uni-table> |
|||
|
|||
|
|||
</view> |
|||
<navigator url="enterpriseRisk?businessName=aaaabbbb&executionTime=2023-03-15" hover-class="navigator-hover"> |
|||
<button type="default" style="margin-top: 20px;">测试企业经营页面</button> |
|||
</navigator> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
newDate: new Date().getFullYear() + "-" + (new Date().getMonth() + 1) + "-" + new Date().getDate(), |
|||
tableData: [{ |
|||
name: "销售商品收到的现金(元)", |
|||
price: "2000000", |
|||
}, |
|||
{ |
|||
name: "收到其他与经营活动有关的现金(元)", |
|||
price: "28700", |
|||
}, |
|||
{ |
|||
name: "本项合计", |
|||
price: "123456", |
|||
}, |
|||
], |
|||
tableData2: [{ |
|||
name: "销售商品收到的现金(元)", |
|||
totalAmount: "2000000", |
|||
accountsReceivable: "31914", |
|||
deductionAccountsReceivable: "35793" |
|||
}, |
|||
{ |
|||
name: "连锁内加盟", |
|||
totalAmount: "2000000", |
|||
accountsReceivable: "31914", |
|||
deductionAccountsReceivable: "35793" |
|||
}, |
|||
{ |
|||
name: "配送中心", |
|||
totalAmount: "2000000", |
|||
accountsReceivable: "31914", |
|||
deductionAccountsReceivable: "35793", |
|||
}, { |
|||
name: "连锁外加盟", |
|||
totalAmount: "2000000", |
|||
accountsReceivable: "31914", |
|||
deductionAccountsReceivable: "35793", |
|||
} |
|||
], |
|||
chartData: {}, |
|||
opts: { |
|||
xAxis: { |
|||
disableGrid: true |
|||
}, |
|||
yAxis: { |
|||
data: [{ |
|||
min: 0 |
|||
}] |
|||
}, |
|||
extra: { |
|||
column: { |
|||
type: "group" |
|||
} |
|||
} |
|||
} |
|||
}; |
|||
}, |
|||
onLoad() { |
|||
this.getServerData(); |
|||
|
|||
}, |
|||
methods: { |
|||
getServerData() { |
|||
setTimeout(() => { |
|||
//模拟服务器返回数据，如果数据格式和标准格式不同，需自行按下面的格式拼接 |
|||
let res = { |
|||
categories: ["2016", "2017", "2018", "2019", "2020", "2021"], |
|||
series: [{ |
|||
name: "分销商进货额", |
|||
data: [35, 36, 31, 33, 13, 34] |
|||
}, |
|||
{ |
|||
name: "实际发货额", |
|||
data: [18, 27, 21, 24, 6, 28] |
|||
} |
|||
] |
|||
}; |
|||
this.chartData = JSON.parse(JSON.stringify(res)); |
|||
}, 100); |
|||
}, |
|||
jump(index) { |
|||
console.log("index>>", index) |
|||
switch (index) { |
|||
case 1: |
|||
|
|||
break; |
|||
|
|||
case 2: |
|||
uni.navigateTo({ |
|||
url: 'index2' |
|||
}); |
|||
|
|||
break; |
|||
|
|||
case 3: |
|||
uni.navigateTo({ |
|||
url: 'index3' |
|||
}); |
|||
|
|||
break; |
|||
} |
|||
} |
|||
} |
|||
}; |
|||
</script> |
|||
|
|||
<style scoped> |
|||
/* 请根据实际需求修改父元素尺寸，组件自动识别宽高 */ |
|||
.charts-box { |
|||
width: 100%; |
|||
height: 300px; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,179 @@ |
|||
<template> |
|||
<view class="charts-box"> |
|||
|
|||
<view style="display: flex;justify-content: center; width: 100%; "> |
|||
<text style="padding-top: 10px;padding-bottom: 10px;color: blue;margin-left: 20px;" |
|||
@click="jump(1)">1</text> |
|||
<text style="padding-top: 10px;padding-bottom: 10px;color: blue;margin-left: 20px;" |
|||
@click="jump(2)">2</text> |
|||
<text style="padding-top: 10px;padding-bottom: 10px;color: blue;margin-left: 20px;" |
|||
@click="jump(3)">3</text> |
|||
</view> |
|||
|
|||
<view style="margin-top: 20px;margin-left: 20px;"> |
|||
<text>2当日数据</text> |
|||
<text style="margin-left: 10px;">{{newDate}}</text> |
|||
|
|||
</view> |
|||
|
|||
<view style="margin-top: 15px;margin-left: 10px;margin-right: 10px;"> |
|||
<qiun-data-charts type="pie" :opts="opts" :chartData="chartData" /> |
|||
</view> |
|||
|
|||
|
|||
<view style="margin-top: 25px;margin-left: 15px;margin-right: 15px;"> |
|||
<text>到货时间预警表</text> |
|||
</view> |
|||
|
|||
<view style="margin-top: 20px;margin-left: 15px;margin-right: 15px;"> |
|||
|
|||
<uni-table ref="table" :border="true" stripe type="" emptyText="暂无更多数据"> |
|||
<uni-tr> |
|||
<uni-th width="50" align="center">序号</uni-th> |
|||
<uni-th width="280" align="center">供应商名称</uni-th> |
|||
<uni-th align="center">到货日期</uni-th> |
|||
<uni-th align="center">是否延期</uni-th> |
|||
</uni-tr> |
|||
<uni-tr v-for="(item, index) in tableData2" :key="index"> |
|||
<uni-td align="center">{{ index+1 }}</uni-td> |
|||
<uni-td align="center">{{ item.supplierName }}</uni-td> |
|||
<uni-td align="center">{{ item.allArrivedDate }}</uni-td> |
|||
<uni-td align="center">{{ item.isDelay }}</uni-td> |
|||
</uni-tr> |
|||
</uni-table> |
|||
|
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
newDate: new Date().getFullYear() + "-" + (new Date().getMonth() + 1) + "-" + new Date().getDate(), |
|||
|
|||
tableData2: [{ |
|||
supplierName: "中粮可口可乐饮料（河北）有限公司", |
|||
allArrivedDate: "2022.12.29", |
|||
isDelay: "是", |
|||
}, |
|||
{ |
|||
supplierName: "中顺洁柔纸业股份有限公司", |
|||
allArrivedDate: "2022.12.29", |
|||
isDelay: "是", |
|||
}, |
|||
{ |
|||
supplierName: "今麦郎食品股份有限公司石家庄分公司", |
|||
allArrivedDate: "2022.12.29", |
|||
isDelay: "是", |
|||
}, { |
|||
supplierName: "农夫山泉股份有限公司", |
|||
allArrivedDate: "2022.12.29", |
|||
isDelay: "是", |
|||
}, { |
|||
supplierName: "北京百事可乐饮料有限公司", |
|||
allArrivedDate: "2022.12.29", |
|||
isDelay: "是", |
|||
}, { |
|||
supplierName: "今麦郎食品股份有限公司石家庄分公司", |
|||
allArrivedDate: "2022.12.29", |
|||
isDelay: "是", |
|||
}, { |
|||
supplierName: "农夫山泉股份有限公司", |
|||
allArrivedDate: "2022.12.29", |
|||
isDelay: "是", |
|||
}, { |
|||
supplierName: "北京百事可乐饮料有限公司", |
|||
allArrivedDate: "2022.12.29", |
|||
isDelay: "是", |
|||
} |
|||
], |
|||
chartData: {}, |
|||
opts: { |
|||
color: ["#1890FF", "#91CB74", "#FAC858", "#EE6666", "#73C0DE", "#3CA272", "#FC8452", "#9A60B4", |
|||
"#ea7ccc" |
|||
], |
|||
padding: [5, 5, 5, 5], |
|||
enableScroll: false, |
|||
extra: { |
|||
pie: { |
|||
activeOpacity: 0.5, |
|||
activeRadius: 10, |
|||
offsetAngle: 0, |
|||
labelWidth: 15, |
|||
border: true, |
|||
borderWidth: 3, |
|||
borderColor: "#FFFFFF", |
|||
linearType: "custom" |
|||
} |
|||
} |
|||
} |
|||
}; |
|||
}, |
|||
onLoad() { |
|||
this.getServerData(); |
|||
}, |
|||
methods: { |
|||
getServerData() { |
|||
//模拟从服务器获取数据时的延时 |
|||
setTimeout(() => { |
|||
//模拟服务器返回数据，如果数据格式和标准格式不同，需自行按下面的格式拼接 |
|||
let res = { |
|||
series: [{ |
|||
data: [{ |
|||
"name": "一班", |
|||
"value": 50 |
|||
}, { |
|||
"name": "二班", |
|||
"value": 30 |
|||
}, { |
|||
"name": "三班", |
|||
"value": 20 |
|||
}, { |
|||
"name": "四班", |
|||
"value": 18 |
|||
}, { |
|||
"name": "五班", |
|||
"value": 8 |
|||
}] |
|||
}] |
|||
}; |
|||
this.chartData = JSON.parse(JSON.stringify(res)); |
|||
}, 500); |
|||
}, |
|||
jump(index) { |
|||
console.log("index>>2",index) |
|||
switch (index) { |
|||
case 1: |
|||
uni.navigateTo({ |
|||
url: 'index' |
|||
}); |
|||
|
|||
break; |
|||
|
|||
case 2: |
|||
|
|||
break; |
|||
|
|||
case 3: |
|||
uni.navigateTo({ |
|||
url: 'index3' |
|||
}); |
|||
|
|||
break; |
|||
} |
|||
} |
|||
}, |
|||
|
|||
} |
|||
</script> |
|||
|
|||
<style scoped> |
|||
/* 请根据实际需求修改父元素尺寸，组件自动识别宽高 */ |
|||
.charts-box { |
|||
width: 100%; |
|||
height: 300px; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,236 @@ |
|||
<template> |
|||
<view class="charts-box"> |
|||
|
|||
<view style="display: flex;justify-content: center; width: 100%; "> |
|||
<text style="padding-top: 10px;padding-bottom: 10px;color: blue;margin-left: 20px;" |
|||
@click="jump(1)">1</text> |
|||
<text style="padding-top: 10px;padding-bottom: 10px;color: blue;margin-left: 20px;" |
|||
@click="jump(2)">2</text> |
|||
<text style="padding-top: 10px;padding-bottom: 10px;color: blue;margin-left: 20px;" |
|||
@click="jump(3)">3</text> |
|||
</view> |
|||
|
|||
<view style="margin-top: 20px;margin-left: 20px;"> |
|||
<text>3当日数据</text> |
|||
<text style="margin-left: 10px;">{{newDate}}</text> |
|||
|
|||
</view> |
|||
|
|||
<view style="margin-top: 15px;margin-left: 10px;"> |
|||
<qiun-data-charts type="mix" :opts="opts" :chartData="chartData" /> |
|||
</view> |
|||
|
|||
|
|||
<view style="margin-top: 25px;margin-left: 15px;margin-right: 15px;"> |
|||
|
|||
<uni-table ref="table" :border="true" stripe type="" emptyText="暂无更多数据"> |
|||
<uni-tr> |
|||
<uni-th align="center">现金流量-经营活动产生的现金流量(元)</uni-th> |
|||
<uni-th align="center">总额</uni-th> |
|||
</uni-tr> |
|||
<uni-tr v-for="(item, index) in tableData" :key="index"> |
|||
<uni-td align="center">{{ item.name }}</uni-td> |
|||
<uni-td align="center">{{ item.price }}</uni-td> |
|||
</uni-tr> |
|||
</uni-table> |
|||
|
|||
</view> |
|||
|
|||
<view style="margin-top: 25px;margin-left: 15px;margin-right: 15px;"> |
|||
|
|||
<uni-table ref="table" :border="true" stripe type="" emptyText="暂无更多数据"> |
|||
<uni-tr> |
|||
<uni-th width="200" align="center">销售渠道类别</uni-th> |
|||
<uni-th align="center">总额</uni-th> |
|||
<uni-th align="center">应收帐款</uni-th> |
|||
<uni-th align="center">扣除应收</uni-th> |
|||
</uni-tr> |
|||
<uni-tr v-for="(item, index) in tableData2" :key="index"> |
|||
<uni-td align="center">{{ item.name }}</uni-td> |
|||
<uni-td align="center">{{ item.totalAmount }}</uni-td> |
|||
<uni-td align="center">{{ item.accountsReceivable }}</uni-td> |
|||
<uni-td align="center">{{ item.deductionAccountsReceivable }}</uni-td> |
|||
</uni-tr> |
|||
</uni-table> |
|||
|
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
newDate: new Date().getFullYear() + "-" + (new Date().getMonth() + 1) + "-" + new Date().getDate(), |
|||
tableData: [{ |
|||
name: "销售商品收到的现金(元)", |
|||
price: "2000000", |
|||
}, |
|||
{ |
|||
name: "收到其他与经营活动有关的现金(元)", |
|||
price: "28700", |
|||
}, |
|||
{ |
|||
name: "本项合计", |
|||
price: "123456", |
|||
}, |
|||
], |
|||
tableData2: [{ |
|||
name: "销售商品收到的现金(元)", |
|||
totalAmount: "2000000", |
|||
accountsReceivable: "31914", |
|||
deductionAccountsReceivable: "35793" |
|||
}, |
|||
{ |
|||
name: "连锁内加盟", |
|||
totalAmount: "2000000", |
|||
accountsReceivable: "31914", |
|||
deductionAccountsReceivable: "35793" |
|||
}, |
|||
{ |
|||
name: "配送中心", |
|||
totalAmount: "2000000", |
|||
accountsReceivable: "31914", |
|||
deductionAccountsReceivable: "35793", |
|||
}, { |
|||
name: "连锁外加盟", |
|||
totalAmount: "2000000", |
|||
accountsReceivable: "31914", |
|||
deductionAccountsReceivable: "35793", |
|||
} |
|||
], |
|||
chartData: {}, |
|||
opts: { |
|||
color: ["#1890FF", "#91CB74", "#FAC858", "#EE6666", "#73C0DE", "#3CA272", "#FC8452", "#9A60B4", |
|||
"#ea7ccc" |
|||
], |
|||
padding: [15, 15, 0, 15], |
|||
enableScroll: false, |
|||
legend: {}, |
|||
xAxis: { |
|||
disableGrid: true, |
|||
title: "" |
|||
}, |
|||
yAxis: { |
|||
disabled: false, |
|||
disableGrid: false, |
|||
splitNumber: 5, |
|||
gridType: "dash", |
|||
dashLength: 4, |
|||
gridColor: "#CCCCCC", |
|||
padding: 10, |
|||
showTitle: true, |
|||
data: [{ |
|||
position: "left", |
|||
title: "折线" |
|||
}, |
|||
{ |
|||
position: "right", |
|||
min: 0, |
|||
max: 200, |
|||
title: "柱状图", |
|||
textAlign: "left" |
|||
}, |
|||
] |
|||
}, |
|||
extra: { |
|||
mix: { |
|||
column: { |
|||
width: 20 |
|||
} |
|||
} |
|||
} |
|||
} |
|||
}; |
|||
}, |
|||
onLoad() { |
|||
this.getServerData(); |
|||
}, |
|||
methods: { |
|||
getServerData() { |
|||
//模拟从服务器获取数据时的延时 |
|||
setTimeout(() => { |
|||
//模拟服务器返回数据，如果数据格式和标准格式不同，需自行按下面的格式拼接 |
|||
let res = { |
|||
categories: ["2018", "2019", "2020", "2021", "2022", "2023"], |
|||
series: [{ |
|||
name: "仓库货值", |
|||
index: 1, |
|||
type: "column", |
|||
data: [40, { |
|||
"value": 30, |
|||
"color": "#f04864" |
|||
}, 55, 110, 24, 58] |
|||
}, |
|||
{ |
|||
name: "在途货值", |
|||
index: 1, |
|||
type: "column", |
|||
data: [50, 20, 75, 60, 34, 38] |
|||
}, { |
|||
name: "门店货值", |
|||
index: 1, |
|||
type: "column", |
|||
data: [50, 20, 75, 60, 34, 38] |
|||
}, { |
|||
name: "账户余额", |
|||
index: 1, |
|||
type: "column", |
|||
data: [50, 20, 75, 60, 34, 38] |
|||
}, { |
|||
name: "应收账款", |
|||
index: 1, |
|||
type: "column", |
|||
data: [50, 20, 75, 60, 34, 38] |
|||
}, { |
|||
name: "借款金额", |
|||
index: 1, |
|||
type: "column", |
|||
data: [50, 20, 75, 60, 34, 38] |
|||
}, |
|||
{ |
|||
name: "折线", |
|||
type: "line", |
|||
color: "#D33682", |
|||
data: [120, 140, 105, 170, 95, 160] |
|||
}, |
|||
] |
|||
}; |
|||
this.chartData = JSON.parse(JSON.stringify(res)); |
|||
}, 500); |
|||
}, |
|||
jump(index) { |
|||
console.log("index>>3", index) |
|||
switch (index) { |
|||
case 1: |
|||
uni.navigateTo({ |
|||
url: 'index' |
|||
}); |
|||
break; |
|||
|
|||
case 2: |
|||
uni.navigateTo({ |
|||
url: 'index2' |
|||
}); |
|||
|
|||
break; |
|||
|
|||
case 3: |
|||
|
|||
break; |
|||
} |
|||
} |
|||
}, |
|||
|
|||
}; |
|||
</script> |
|||
|
|||
<style scoped> |
|||
/* 请根据实际需求修改父元素尺寸，组件自动识别宽高 */ |
|||
.charts-box { |
|||
width: 100%; |
|||
height: 300px; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,268 @@ |
|||
<template> |
|||
|
|||
<view style="margin-left: 20px; margin-right: 20px;padding-bottom: 50px"> |
|||
|
|||
<view style="display: flex;width: 100%;"> |
|||
<view style="flex: 1;"></view> |
|||
<text style="size: 25px;font-family: sans-serif;font-weight: 600;color: white; |
|||
margin-top: 10px;margin-right: 5px;border: none; padding: 5px 15px; |
|||
border-radius: 5px 5px; |
|||
background: #0498FD;" @click="download"> |
|||
下载 |
|||
</text> |
|||
</view> |
|||
|
|||
|
|||
<view |
|||
style="display: flex; width: 100%;justify-content: center; size: 25px;font-family: sans-serif;font-weight: 600;margin: 10px;"> |
|||
{{date}} |
|||
</view> |
|||
|
|||
<view style="margin-top: 20px; display: flex; flex-direction: column;"> |
|||
<text style="size: 25px;font-family: sans-serif;font-weight: 600;padding-bottom: 10px;">库存日报汇总表</text> |
|||
<text>编号:{{logInfo.serialNumber}}</text> |
|||
<text>上报时间:{{logInfo.reportTime}}</text> |
|||
<text style="margin-bottom: 10px;">货值合计:{{logInfo.countAmount}}</text> |
|||
|
|||
<uni-table ref="table1" border stripe emptyText="暂无更多数据"> |
|||
<uni-tr> |
|||
<!-- <uni-th align="center">序号</uni-th> --> |
|||
<uni-th align="center" width="180">仓库类型</uni-th> |
|||
<uni-th align="center" width="80">仓库数量</uni-th> |
|||
<uni-th align="center" width="80">品种数量</uni-th> |
|||
<uni-th align="center" width="100">品种货值</uni-th> |
|||
</uni-tr> |
|||
<uni-tr v-for="(item, index) in tableData1" :key="index"> |
|||
<!-- <uni-td align="center">{{ index+1}}</uni-td> --> |
|||
<uni-td align="center">{{ item.storeType }}</uni-td> |
|||
<uni-td align="center">{{ item.storeNumber }}</uni-td> |
|||
<uni-td align="center">{{ item.productCountNumber }}</uni-td> |
|||
<uni-td align="center">{{ item.productAmount }}</uni-td> |
|||
</uni-tr> |
|||
|
|||
</uni-table> |
|||
|
|||
</view> |
|||
|
|||
<view style="margin-top: 50px; display: flex; flex-direction: column;"> |
|||
<text style="size: 25px;font-family: sans-serif;font-weight: 600;padding-bottom: 10px;">仓库库存明细表</text> |
|||
<text>商品数量合计:{{logInfo2.countProductNumber}}</text> |
|||
<text style="margin-bottom: 10px;">商品货值合计:{{logInfo2.countAmount}}</text> |
|||
<uni-table ref="table1" border stripe emptyText="暂无更多数据"> |
|||
<uni-tr> |
|||
<!-- <uni-th align="center" width="50">序号</uni-th> --> |
|||
<uni-th align="center" width="180">仓库名称</uni-th> |
|||
<uni-th align="center" width="80">商品数量</uni-th> |
|||
<uni-th align="center" width="100">商品货值</uni-th> |
|||
</uni-tr> |
|||
<uni-tr v-for="(item, index) in tableData2" :key="index"> |
|||
<!-- <uni-td align="center">{{ index+1 }}</uni-td> --> |
|||
<uni-td align="center">{{ item.storeCodeName }}</uni-td> |
|||
<uni-td align="center">{{ item.productCountNumber }}</uni-td> |
|||
<uni-td align="center">{{ item.productAmount }}</uni-td> |
|||
</uni-tr> |
|||
|
|||
</uni-table> |
|||
|
|||
</view> |
|||
|
|||
<view style="margin-top: 50px; display: flex; flex-direction: column;"> |
|||
<text style="size: 25px;font-family: sans-serif;font-weight: 600;padding-bottom: 10px;">烟草库存明细表</text> |
|||
<text>商品数量合计:{{logInfo3.countProductNumber}}</text> |
|||
<text style="margin-bottom: 10px;">商品货值合计:{{logInfo3.countAmount}}</text> |
|||
<uni-table ref="table1" border stripe emptyText="暂无更多数据"> |
|||
<uni-tr> |
|||
<!-- <uni-th align="center">序号</uni-th> --> |
|||
<uni-th align="center" width="180">仓库名称</uni-th> |
|||
<uni-th align="center" width="80">品种数量</uni-th> |
|||
<uni-th align="center" width="100">品种货值</uni-th> |
|||
</uni-tr> |
|||
<uni-tr v-for="(item, index) in tableData3" :key="index"> |
|||
<!-- <uni-td align="center">{{ index+1 }}</uni-td> --> |
|||
<uni-td align="center">{{ item.storeCodeName }}</uni-td> |
|||
<uni-td align="center">{{ item.productCountNumber }}</uni-td> |
|||
<uni-td align="center">{{ item.productAmount }}</uni-td> |
|||
</uni-tr> |
|||
|
|||
</uni-table> |
|||
|
|||
</view> |
|||
</view> |
|||
|
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
date: "2023-07-26", |
|||
logInfo: { |
|||
serialNumber: "", |
|||
reportTime: "", |
|||
countAmount: "", |
|||
}, |
|||
logInfo2: { |
|||
countProductNumber: "", |
|||
countAmount: "", |
|||
}, |
|||
logInfo3: { |
|||
countProductNumber: "", |
|||
countAmount: "", |
|||
}, |
|||
tableData1: [], |
|||
tableData2: [], |
|||
tableData3: [], |
|||
tempFilePath: "", |
|||
// fileUrl:"https://desk-fd.zol-img.com.cn/t_s960x600c5/g5/M00/01/0F/ChMkJlbKwtmINC3iAAx4ozyK5jAAALGuAMGw3cADHi7853.jpg" |
|||
fileUrl: "" |
|||
}; |
|||
}, |
|||
onLoad(option) { |
|||
|
|||
// this.date = option.orderDate |
|||
|
|||
// console.log('1111', this.queryParams) |
|||
this.getData() |
|||
|
|||
|
|||
|
|||
}, |
|||
onShow() { |
|||
wx.hideHomeButton() |
|||
}, |
|||
methods: { |
|||
download() { |
|||
if (this.fileUrl == '') { |
|||
uni.showToast({ |
|||
title: "下载地址错误，请重新进入页面。", |
|||
duration: 5000 |
|||
}) |
|||
return |
|||
} |
|||
|
|||
|
|||
uni.downloadFile({ |
|||
url: this.fileUrl, // 网络文档地址 |
|||
success: (data) => { |
|||
if (data.statusCode === 200) { |
|||
uni.saveFile({ |
|||
tempFilePath: data.tempFilePath, //临时路径 |
|||
success: function(res) { |
|||
// 保存路径 |
|||
uni.showToast({ |
|||
title: "文件已保存：" + res.savedFilePath, |
|||
duration: 5000 |
|||
}) |
|||
setTimeout(() => { |
|||
//打开文档查看 |
|||
uni.openDocument({ |
|||
filePath: res.savedFilePath, |
|||
showMenu: true, //右上角是否有可以转发分享的功能 |
|||
success: function(res) { |
|||
console.log('打开文档成功') |
|||
} |
|||
}) |
|||
}, 3000); |
|||
} |
|||
}); |
|||
} |
|||
}, |
|||
fail: (err) => { |
|||
uni.showToast({ |
|||
title: '失败请重新下载' |
|||
}); |
|||
}, |
|||
}); |
|||
|
|||
|
|||
}, |
|||
getData() { |
|||
console.log('getData', this.date) |
|||
this.$api.getReportInventoryDayGather(this.date).then((resp) => { |
|||
console.log('1111>>>>>>', resp) |
|||
this.fileUrl = resp.downloadUrl |
|||
this.tableData1 = resp.list |
|||
this.logInfo = { |
|||
serialNumber: resp.serialNumber, |
|||
reportTime: resp.reportTime, |
|||
countAmount: resp.countAmount, |
|||
} |
|||
|
|||
}).catch(e => { |
|||
console.log('eeeee', e) |
|||
}) |
|||
|
|||
this.$api.getReportInventoryDayStore(this.date).then((resp) => { |
|||
console.log('2222>>>>>>', resp) |
|||
this.tableData2 = resp.list |
|||
this.logInfo2 = { |
|||
countProductNumber: resp.countProductNumber, |
|||
countAmount: resp.countAmount, |
|||
} |
|||
}).catch(e => { |
|||
console.log('eeeee', e) |
|||
}) |
|||
|
|||
this.$api.getReportInventoryDayToStore(this.date).then((resp) => { |
|||
console.log('3333>>>>>>', resp) |
|||
this.tableData3 = resp.list |
|||
this.logInfo3 = { |
|||
countProductNumber: resp.countProductNumber, |
|||
countAmount: resp.countAmount, |
|||
} |
|||
}).catch(e => { |
|||
console.log('eeeee', e) |
|||
}) |
|||
}, |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss"> |
|||
.title { |
|||
width: 100%; |
|||
height: 100rpx; |
|||
background: white; |
|||
display: flex; |
|||
align-items: center; |
|||
justify-content: space-around; |
|||
} |
|||
|
|||
.titleSel { |
|||
color: #5f6fee; |
|||
font-size: 32rpx; |
|||
display: flex; |
|||
flex-direction: column; |
|||
align-items: center; |
|||
} |
|||
|
|||
|
|||
.headerLineSel { |
|||
background: #5f6fee; |
|||
height: 6rpx; |
|||
width: 220rpx; |
|||
margin-top: 10rpx; |
|||
} |
|||
|
|||
.headerLineUnsel { |
|||
background: #fff; |
|||
height: 6rpx; |
|||
width: 40rpx; |
|||
position: relative; |
|||
margin-top: 10rpx; |
|||
} |
|||
|
|||
.swiper { |
|||
width: 100%; |
|||
flex: 1; |
|||
height: 100vh; |
|||
overflow: scroll; |
|||
} |
|||
|
|||
.recordItem { |
|||
margin-top: 10rpx; |
|||
background-color: white; |
|||
padding-bottom: 20rpx; |
|||
padding-top: 20rpx; |
|||
} |
|||
</style> |
|||
File diff suppressed because it is too large
@ -0,0 +1,189 @@ |
|||
<template> |
|||
<view class="container"> |
|||
<uni-load-more :status="status" :contentText="contentText" @clickLoadMore="loadMore"></uni-load-more> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
import { |
|||
stringIsNotEmpty |
|||
} from '../../common/empty' |
|||
export default { |
|||
data() { |
|||
return { |
|||
status: "loading", |
|||
contentText: { |
|||
contentdown: "获取信息失败，点击重试", |
|||
contentrefresh: "获取信息中，请稍后", |
|||
contentnomore: "没有更多数据了" |
|||
}, |
|||
// 中间件数据，不用改 |
|||
middleware: null |
|||
} |
|||
}, |
|||
onLoad(options) { |
|||
|
|||
// 不用改 |
|||
if (options != undefined && options.data != undefined) { |
|||
let shareData; |
|||
try { |
|||
// 跳转携带数据 |
|||
shareData = JSON.parse(options.data) |
|||
} catch (e) { |
|||
shareData = JSON.parse(decodeURIComponent(options.data)) |
|||
} |
|||
this.middleware = shareData |
|||
} |
|||
|
|||
this.getWxCode() |
|||
}, |
|||
methods: { |
|||
loadMore(e) { |
|||
if ('more' === e.detail.status) { |
|||
// 重新获取 |
|||
this.getWxCode() |
|||
} |
|||
}, |
|||
getWxCode() { |
|||
|
|||
this.status = "loading" |
|||
let _this = this; |
|||
|
|||
|
|||
wx.login({ |
|||
success: function(res) { |
|||
uni.request({ |
|||
// 组装请求地址 |
|||
url: getApp().globalData.wxSilentLoginURL + "?wxCode=" + res.code, |
|||
method: "GET", |
|||
header: { |
|||
'content-type': "application/x-www-form-urlencoded" |
|||
}, |
|||
data: { |
|||
"wxCode": res.code |
|||
}, |
|||
success: res => { |
|||
if (res.statusCode == 200) { |
|||
if (!res.data.success) { |
|||
if (res.data.code == "110") { |
|||
// 需要绑定手机号 |
|||
uni.reLaunch({ |
|||
url: '/pages/index/BindPhone?openid=' + |
|||
res.data.data.wxMpOpenid |
|||
}) |
|||
} else { |
|||
_this.status = 'more' |
|||
// _this.contentText.contentdown = res.data.msg+"，点击重试" |
|||
} |
|||
} else { |
|||
// 成功后跳转主页 |
|||
getApp().globalData.sid = res.data.data.sid |
|||
getApp().globalData.token = res.data.data.token |
|||
getApp().globalData.isNewUser = res.data.data.isNewUser |
|||
getApp().globalData.isPurchase = res.data.data |
|||
.isPurchase |
|||
getApp().globalData.mobile = res.data.data.mobile |
|||
uni.setStorageSync("satoken", res.data.data.token) |
|||
console.log("人员sid", res.data.data.sid); |
|||
console.log("token", res.data.data.token); |
|||
console.log("mobile", res.data.data.mobile); |
|||
|
|||
|
|||
console.log("middleware>>>>>>>>>>>>", _this.middleware); |
|||
|
|||
if (_this.middleware != null) { |
|||
// 走中间件的逻辑 |
|||
if ('share' == _this.middleware.functionName) { |
|||
uni.reLaunch({ |
|||
url: _this.middleware.url |
|||
}); |
|||
} else if ('bindCard' == _this.middleware |
|||
.functionName) { |
|||
|
|||
uni.reLaunch({ |
|||
url: _this.middleware.url |
|||
}); |
|||
// _this.middleware.params.customerSid = res.data.data |
|||
// .sid |
|||
|
|||
// _this.$api.pickUpCardBind(_this.middleware.params) |
|||
// .then((resp) => { |
|||
// uni.reLaunch({ |
|||
// url: _this.middleware.url |
|||
// }); |
|||
// }).catch(e => { |
|||
// uni.showModal({ |
|||
// title: '提示', |
|||
// content: e.msg, |
|||
// showCancel: false, |
|||
// success: function(res) { |
|||
// uni.switchTab({ |
|||
// url: '/pages/home/pickUpCard' |
|||
// }) |
|||
// } |
|||
// }); |
|||
// }) |
|||
|
|||
} else { |
|||
uni.showModal({ |
|||
title: '提示', |
|||
content: '版本过低', |
|||
showCancel: false, |
|||
success: function(res) { |
|||
uni.switchTab({ |
|||
url: '/pages/home/myCellar' |
|||
}) |
|||
} |
|||
}); |
|||
} |
|||
|
|||
} else { |
|||
uni.switchTab({ |
|||
// url: '/pages/home/pickUpCard', |
|||
// url: '/pages/home/myHome', |
|||
url: '/pages/home/myCellar', |
|||
}) |
|||
} |
|||
|
|||
if (_this.stringIsNotEmpty(_this.shareUrl)) { |
|||
|
|||
} else { |
|||
|
|||
} |
|||
} |
|||
} else { |
|||
_this.status = 'more' |
|||
} |
|||
}, |
|||
fail: (err) => { |
|||
_this.status = 'more' |
|||
} |
|||
}); |
|||
}, |
|||
fail: function(res) { |
|||
_this.status = 'more' |
|||
} |
|||
}); |
|||
|
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
.container { |
|||
width: 100%; |
|||
height: 90vh; |
|||
display: flex; |
|||
flex-direction: row; |
|||
align-items: center; |
|||
justify-content: center; |
|||
} |
|||
|
|||
uni-page-body, |
|||
page { |
|||
width: 100%; |
|||
height: 100%; |
|||
height: calc(100% + var(--window-bottom); ); |
|||
} |
|||
</style> |
|||
@ -0,0 +1,334 @@ |
|||
<template> |
|||
<view style="padding: 30rpx;"> |
|||
<p style="text-align:center"> |
|||
<span style=";font-family:黑体;font-size:21px">汇融云眼程序隐私政策</span> |
|||
</p> |
|||
<p style="text-indent:28px; margin-top: 20rpx;"> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
<span style="font-family:微软雅黑">欢迎使用汇融云眼</span> |
|||
</span> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px">。</span> |
|||
</p> |
|||
<p style="text-indent:28px"> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
请您务必仔细阅读和理解以下条款。若您一旦接受我公司产品或服务，则表示您同意接受我公司约定的以下各项条款的约束。若您不接受以下条款，请您立即停止使用我公司的产品及服务。 |
|||
</span> |
|||
</p> |
|||
<p style="text-indent:28px"> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
<span style="font-family:微软雅黑"> |
|||
为了使您充分理解本协议，本协议中与您的权益存在或可能存在重大关系的部分，我们已采用下划线、加粗等方式提示您注意。您点击 |
|||
</span> |
|||
"确认"或进行类似操作后，即表示您已同意我们按照本协议来使用和保护您的信息。 |
|||
</span> |
|||
</p> |
|||
<p><span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px">一、声明与承诺</span></p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
（一）您理解并承诺，在您接受我公司的产品或服务前，您已充分阅读、理解并接受本协议的全部内容，您接受我公司的产品或服务，即表示您同意遵循本协议之所有约定。您理解并同意本协议规定的内容，并对相关法律法规有适当的了解，如您不能清楚地知晓或理解国家相关法律法规规定的内容，您应当咨询相关法律专业人士后再决定是否接受本协议。 |
|||
</span> |
|||
</p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
（二）您在此确认知悉并同意，我公司有权依据国家法律法规及运营需求，对本协议条款不时地进行修改。我公司如更新本协议相关条款，将采用在“一诺云网”（www.enuoyun |
|||
.com）上公布，通知您该等修改、增加或删减的内容，以便您随时了解我公司产品或服务对您信息资料的收集和使用方法。一经公告，即视为上述内容已经通知到您。若您在本协议及各类规则变更后继续使用我公司产品或服务的，视为您已仔细认真阅读、充分理解并同意接受修改后的协议条款及各类规则。您有义务不时关注并阅读最新版的协议及网站公告等。如您不同意更新后的协议，应立即停止接受我公司产品或服务，否则视为您同意接受更新后的协议。 |
|||
</span> |
|||
</p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
（三）您保证，作为自然人，在您同意接受本协议时，您已经年满16周岁；作为企业、事业单位等组织，您在中华人民共和国（“中国”）大陆地区（不含香港、台湾、澳门地区）合法开展经营活动或其他业务，或依照中国大陆地区（不含香港、台湾、澳门地区）法律登记注册成立；本协议内容不受您所属国家或地区法律的约束。不具备前述条件的，您应立即停止使用本软件提供的服务。 |
|||
</span> |
|||
</p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
（四）我公司为遵守国家法律法规、向您提供服务、保护您的隐私及提升服务质量的目的，将按照本协议收集、使用您的信息（包括但不限于我公司认为了解您的需求和开展业务所必需的相关资料），本协议包含了我们收集、存储、保护、使用您的信息的条款，请您完整地阅读本协议项下各条款。 |
|||
</span> |
|||
</p> |
|||
<p><span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px">二、信息收集</span></p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
您在此不可撤销地同意并授权我公司收集以下信息： |
|||
</span> |
|||
</p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
1.在您使用或接受我公司产品或服务时，我们会获取您的信息，包括但不限于基本信息、企业经营、商务交易信息等。 |
|||
</span> |
|||
</p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
2.设备信息：我公司产品或服务会接收并记录您所使用的设备相关信息（例如设备型号、操作系统版本、设备设置、唯一设备标识符、设备环境等软硬件特征信息）、设备所在位置相关信息（例如IP |
|||
地址、GPS位置以及能够提供相关信息的WLAN接入点、蓝牙和基站等传感器信息）及您所授予的设备权限使用所获信息。 |
|||
</span> |
|||
</p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
3.服务日志信息：当您接受我公司提供的产品或服务时，我们会自动收集您对我们服务的详细使用情况，作为有关网络日志保存。例如搜索查询内容、IP地址、浏览器的类型、电信运营商、使用的语言、访问日期和时间及您访问的网页记录等。 |
|||
</span> |
|||
</p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
4.发票信息：当您接受我公司提供的产品或服务时，我们会收集您在使用我公司产品或服务时，主动提供的以及通过自动化方式收集您在使用功能或接受服务过程中产生的增值税发票信息，以及开具增值税发票需要的业务信息。 |
|||
</span> |
|||
</p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
5.为了更好地为您提供服务，经您授权通过合法途径从我公司产品或我公司提供的服务过程中获取的其他您信息。 |
|||
</span> |
|||
</p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
6.在法律、行政法规允许的范围内采集的您的您信息。 |
|||
</span> |
|||
</p> |
|||
<p><span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px">三、除外信息</span></p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
您了解并同意，以下信息属于您自愿、主动在公开领域传播的信息，我公司存储、使用以下信息无需您授权： |
|||
</span> |
|||
</p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
1)您在使用我公司产品提供的搜索服务时，输入的关键字信息； |
|||
</span> |
|||
</p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
2)您在使用我公司产品或接受我公司服务时所产生的信息； |
|||
</span> |
|||
</p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
3)您违反法律规定或违反我公司产品规则的行为，以及我公司已对您采取的措施。 |
|||
</span> |
|||
</p> |
|||
<p><span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px">四、信息使用</span></p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
一旦您使用我公司的产品或服务，我公司即有权依照自行设立的模型、模式、格式、规则、流程等对您的您信息进行整理、保存、加工。 |
|||
</span> |
|||
</p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
我公司将以高度的勤勉、审慎义务对待您信息，您不可撤销地授权并同意我公司将收集到的您信息用于以下用途： |
|||
</span> |
|||
</p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
1)将信息进行整合和处理，以便更好地为您提供服务，并依此对我公司的产品或服务进行改进，保存、整理、加工您信息； |
|||
</span> |
|||
</p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
2)为达到服务您的目的，我公司可能通过使用您信息，向您提供您感兴趣的通知、营销活动及其他商业性电子信息； |
|||
</span> |
|||
</p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
3)经您明确同意并授权的其他用途； |
|||
</span> |
|||
</p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
4)除本协议明确阐述和相关法律法规规定外，我公司不会向任何无关第三方提供、出售、出租或交易您的信息； |
|||
</span> |
|||
</p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
5)我公司不允许任何第三方以任何手段收集、编辑、出售或者传播您的信息。如您从事上述活动，一经发现，我公司有权立即终止与该您的服务协议，并要求赔偿相应损失。 |
|||
</span> |
|||
</p> |
|||
<p><span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px">五、信息保护</span></p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
我们致力于维护您对我公司的产品或服务的信任，因此我公司会使用商业上合理的技术和其他措施，防止您信息的丢失和被盗用，并对您信息的保护情况不定期进行自查，记录自查情况，以便及时消除自查中发现的安全隐患。为尽可能地保护您的信息安全，我公司提请您注意： |
|||
</span> |
|||
</p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
1)我公司的产品账号均有安全保护功能，请妥善保管您的账号及密码信息。我公司将通过对您密码进行加密等安全措施确保您的信息不丢失，不被滥用和变造。尽管有前述安全措施，但同时也请您注意在信息网络上不存在“完善的安全措施”，您信息仍存在丢失、被盗用的可能，非因我公司过错而发生上述情况，我公司不承担任何责任； |
|||
</span> |
|||
</p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
2)请您妥善保护自己的信息，仅在必要的情形下向他人提供。如您发现信息泄露，尤其是您的账户及密码发生泄露，请您立即联络客服，以便采取相应措施。 |
|||
</span> |
|||
</p> |
|||
<p><span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px">六、服务使用限制</span></p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
（一）您在使用我公司产品或服务时，应遵守中华人民共和国相关法律法规，不将本服务用于任何非法目的，也不以任何非法方式使用我公司产品或服务。 |
|||
</span> |
|||
</p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
（二）您不得利用我公司产品或服务从事侵害他人合法权益之行为， |
|||
否则我们有权拒绝提供相关服务，且您应承担所有相关法律责任，因此导致我公司受损的，您应承担赔偿责任。 |
|||
</span> |
|||
</p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
（三）您理解并同意，我公司不对因下述任一情况导致的任何损害赔偿承担责任，包括但不限于利润、商誉、数据等方面的损失或其他无形损失的损害赔偿（无论我公司是否已被告知该等损害赔偿的可能性）： |
|||
</span> |
|||
</p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
1、如果您违反本协议的明文规定及精神，我们可能对您暂停、中断或终止提供本服务或其任何部分，但我们会在法律允许的范围内继续持有、保存您的您信息与使用本服务的记录。 |
|||
</span> |
|||
</p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
2、在发现我公司产品或服务被异常使用，或对我公司产品或服务的使用有合理疑义，或对我公司产品或服务的使用有违反法律规定或本协议约定之虞时，我公司有权不经通知先行暂停或终止您对于本服务使用。具体可能导致暂停或终止本软件服务的情形包括但不限于： |
|||
</span> |
|||
</p> |
|||
<p><span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> 1）根据本协议的约定；</span></p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
2）根据法律法规及法律文书的规定； |
|||
</span> |
|||
</p> |
|||
<p><span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> 3）根据有权机关的要求；</span></p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
4）您使用我公司的产品或服务的行为涉嫌违反国家法律法规及行政规定的； |
|||
</span> |
|||
</p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
5）本公司依据自行合理判断认为可能产生风险的； |
|||
</span> |
|||
</p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
6）您遭到他人投诉，且对方已经提供了一定证据的。 |
|||
</span> |
|||
</p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
（四）若您停止使用我公司的产品或服务，我公司仍可能保有您的相关信息。 |
|||
</span> |
|||
</p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
（五）禁止反向工程、反向编译和反向汇编：您不得对本软件产品进行反向工程（ReverseEngineer）、反向编译（Decompile）或反向汇编（Disassemble），同时不得改动编译在程序文件内部的任何资源。除法律、法规明文规定允许上述活动外，您必须遵守此协议限制。 |
|||
</span> |
|||
</p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
（六） |
|||
组件分割:我公司的产品或服务是作为一个单一产品而被授予许可使用,您不得将各个部分分开用于任何目的。 |
|||
</span> |
|||
</p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
（七）个别授权:如需进行商业性的销售、复制、分发，包括但不限于软件销售、预装、捆绑等，必须获得我公司的书面授权和许可。 |
|||
</span> |
|||
</p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
（八）保留权利：本协议未明示授权的其他一切权利仍归我公司所有，您使用其他权利时必须获得我公司的书面同意。 |
|||
</span> |
|||
</p> |
|||
<p><span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px">七、信息披露</span></p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
我公司对您提供的信息严格保密，除具备下列情形外，不会向任何外部机构披露： |
|||
</span> |
|||
</p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
1)经过您事先同意而对外披露的您信息； |
|||
</span> |
|||
</p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
2)应法律法规或公权力部门（如法院、政府部门、上级监管机构等执法机构）的要求而披露的您信息； |
|||
</span> |
|||
</p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
3)当我公司涉及合并、收购或资产出售等重大交易时，我公司有权依据交易的需要将您信息提供给交易相对方及交易各方聘请的各中介机构(包括但不限于律师、会计师等)，我们会在任何信息进行转让或受其他隐私权政策约束之前，继续确保其保密性并及时通知受影响方； |
|||
</span> |
|||
</p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
4)我公司可能会为了保护我公司产品自身、我公司员工和客户、我公司合作伙伴和其他公众的合法权利、利益和安全而披露您的信息； |
|||
</span> |
|||
</p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
<span style="font-family:微软雅黑">八、</span> |
|||
Cookies的使用 |
|||
</span> |
|||
</p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
1)在您未拒绝接受cookies的情况下，我公司的产品或服务会在您的客户端设定或取用cookies，以便您能登录或使用依赖于cookies的产品或服务。我公司的产品或服务使用cookies可为您提供更加周到的个性化服务，包括推广服务； |
|||
</span> |
|||
</p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
2)您有权选择接受或拒绝接受cookies。您可以通过修改设置的方式拒绝接受cookies。但如果您选择拒绝接受cookies，则您可能无法登录或使用依赖于cookies的产品的网络服务或功能； |
|||
</span> |
|||
</p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
3)通过我公司的产品或服务所设cookies所取得的有关信息，将适用本协议。 |
|||
</span> |
|||
</p> |
|||
<p><span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px">九、法律管辖和适用</span></p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
本协议的订立、履行和解释及争议的解决均应适用中华人民共和国大陆地区适用之有效法律（但不包括其冲突法规则）。协议履行期间，凡因本协议引起的或与本协议有关的一切争议、纠纷，双方应首先友好协商解决；协商不成，您在此完全同意将纠纷或争议提交被告住所地人民法院管辖。 |
|||
</span> |
|||
</p> |
|||
<p><span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px">十、其他</span></p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
1)因台风、地震、海啸、洪水、战争、计算机病毒感染、黑客攻击、网络通信故障等不能预见、不能控制的不可抗力因素，造成本我公司产品不能正常向您提供服务而可能导致的损失，我公司不承担责任； |
|||
</span> |
|||
</p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
2)您理解并同意，鉴于网络服务的特殊性，本协议可在您接受我公司产品或服务的过程中多次使用，未来为您提供服务时再次涉及到本协议服务内容时无需您另行签署； |
|||
</span> |
|||
</p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
3)知识产权，与我公司产品及服务相关的任何内容和资源的知识产权均属于我公司所有。未经我公司书面明确许可，任何单位和个人不得以任何方式将我公司产品或服务之内容和相关资源作全部或部分复制、转载、引用、编辑； |
|||
</span> |
|||
</p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
4)我公司产品或服务仅在您接受本协议条款并依此提供您信息且授权我公司产品按照上述条款的规定获取您信息的基础上提供服务，如您不同意本协议条款或不同意进行相应操作，则您将无法使用我公司产品的全部服务或相应部分服务； |
|||
</span> |
|||
</p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
5)若本协议中任何一条无论因何种原因完全或部分无效或不具有执行力，本协议的其他条款仍继续有效； |
|||
</span> |
|||
</p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
6)您在本协议项下对我公司的产品或服务的授权，将视为对我公司的授权。 |
|||
</span> |
|||
</p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
7)您如需更正所提供的信息，或希望停止接受我公司的产品或服务，或对本协议有任何疑问，请通过联系我公司在线客服或直接拨打客服电话： |
|||
95113 的途径联系处理。 |
|||
</span> |
|||
</p> |
|||
<p> |
|||
<span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> |
|||
8)我公司对本协议有最终解释权。 |
|||
</span> |
|||
</p> |
|||
<p><span style="font-family: 微软雅黑;letter-spacing: 0;font-size: 14px"> </span></p> |
|||
<p><br /></p> |
|||
</view> |
|||
</template> |
|||
|
|||
<script></script> |
|||
|
|||
<style></style> |
|||
@ -0,0 +1,211 @@ |
|||
<template> |
|||
|
|||
<view> |
|||
|
|||
<NavBar ref="nav" navTitle="真实信息" :showIcon="true" :supportChange="false"> |
|||
</NavBar> |
|||
|
|||
<loading-state ref="pageView" @request="request"> |
|||
|
|||
<view @click="remark()" class="menu-item"> |
|||
<text class="text">姓名</text> |
|||
<text class="explain">{{page.realName}}</text> |
|||
<image class="more" src="../../static/more.png"></image> |
|||
</view> |
|||
|
|||
<view class="line-thin"></view> |
|||
|
|||
<view @click="clickSex()" class="menu-item"> |
|||
<text class="text">性别</text> |
|||
<text class="explain">{{page.sex}}</text> |
|||
<image class="more" src="../../static/more.png"></image> |
|||
</view> |
|||
|
|||
<view class="line-thin"></view> |
|||
|
|||
<uni-datetime-picker style="flex: 1;margin-top: 1px;" type="date" :value="page.birthDay" :start="startDate" |
|||
:end="endData" v-model="page.birthDay"> |
|||
<view class="menu-item"> |
|||
<text class="text">生日</text> |
|||
<text class="explain">{{stringIsEmpty(page.birthDay) ?"请选择生日":page.birthDay}}</text> |
|||
<image class="more" src="../../static/more.png"></image> |
|||
</view> |
|||
</uni-datetime-picker> |
|||
|
|||
<view class="line-thin"></view> |
|||
<pick-regions :defaultRegion="defaultRegionCode" @getRegion="handleGetRegion"> |
|||
<view class="menu-item"> |
|||
<text class="text">地区</text> |
|||
<text class="explain">{{stringIsEmpty(page.regionName) ?"请选择地区":page.regionName}}</text> |
|||
<image class="more" src="../../static/more.png"></image> |
|||
</view> |
|||
</pick-regions> |
|||
|
|||
<view style="background: -webkit-linear-gradient(left,#FFB176,#FE923B); position: absolute; bottom: 30px; |
|||
width: 90%;border-radius: 100rpx;height: 80rpx;display: flex;margin-left: 5%; |
|||
flex-direction: column;align-items: center;line-height: 80rpx;color: #FFFFFF;font-size: 36rpx;" |
|||
@click="realInfoAttestation"> |
|||
保存</view> |
|||
|
|||
</loading-state> |
|||
|
|||
<uni-popup ref="inputDialog" type="dialog"> |
|||
<uni-popup-dialog ref="inputClose" mode="input" title="修改姓名" :value="page.realName" placeholder="请输入内容" |
|||
@confirm="dialogInputConfirm"></uni-popup-dialog> |
|||
</uni-popup> |
|||
|
|||
</view> |
|||
|
|||
|
|||
</template> |
|||
|
|||
<script> |
|||
import pickRegions from '@/components/pick-regions/pick-regions.vue' |
|||
export default { |
|||
components: { |
|||
pickRegions |
|||
}, |
|||
created() { |
|||
this.startDate = this.TimeFormat(this.CurrentMillions() - 100 * 365 * 24 * 60 * 60 * 1000); |
|||
this.endData = this.TimeFormat(this.CurrentMillions()); |
|||
}, |
|||
data() { |
|||
return { |
|||
region: [], |
|||
defaultRegion: ['北京市', '市辖区', '东城区'], |
|||
defaultRegionCode: '110101', |
|||
region_sid_path: "", |
|||
address_path: "北京市/市辖区/东城区", |
|||
startDate: "1921-01-01", |
|||
endData: "", |
|||
pickerDate: "", |
|||
page: { |
|||
"birthDay": "", |
|||
"realName": "", |
|||
"regionCode": "", |
|||
"regionName": "", |
|||
"sex": "" |
|||
}, |
|||
contorl: { |
|||
listSex: ["男", "女"] |
|||
}, |
|||
} |
|||
}, |
|||
onLoad(options) { |
|||
this.request() |
|||
}, |
|||
methods: { |
|||
// 修改姓名 |
|||
remark() { |
|||
this.$refs.inputDialog.open() |
|||
}, |
|||
dialogInputConfirm(val) { |
|||
this.page.realName = val |
|||
}, |
|||
request() { |
|||
let _this = this |
|||
_this.$api.getRealInfo(getApp().globalData.sid).then((resp) => { |
|||
console.log(JSON.stringify(resp)); |
|||
_this.page = resp |
|||
_this.$nextTick(() => { |
|||
_this.$refs.pageView.setLoadState(2) |
|||
}) |
|||
}).catch(e => { |
|||
_this.$nextTick(() => { |
|||
_this.$refs.pageView.setLoadState(1) |
|||
}) |
|||
}) |
|||
}, |
|||
clickSex() { |
|||
let _this = this; |
|||
uni.showActionSheet({ |
|||
itemList: this.contorl.listSex, |
|||
success: function(res) { |
|||
_this.selectSex(res.tapIndex + 1) |
|||
} |
|||
}); |
|||
}, |
|||
selectSex(id) { |
|||
let _this = this |
|||
switch (id) { |
|||
case 1: |
|||
this.page.sex = '男' |
|||
break; |
|||
case 2: |
|||
this.page.sex = '女' |
|||
break; |
|||
case 3: |
|||
break |
|||
} |
|||
}, |
|||
modibirthDay(e) { |
|||
this.page.birthDay = e |
|||
}, |
|||
realInfoAttestation() { |
|||
this.page.userSid = getApp().globalData.sid |
|||
let _this = this |
|||
_this.$api.saveRealInfo(this.page).then((resp) => { |
|||
uni.$emit("real-info") |
|||
uni.navigateBack() |
|||
}).catch(e => { |
|||
console.log(e); |
|||
}) |
|||
}, |
|||
// 获取选择的地区 |
|||
handleGetRegion(region) { |
|||
let code = region.map(item => item.code) |
|||
let name = region.map(item => item.name) |
|||
this.page.regionCode = code[2] |
|||
this.page.regionName = name[0] + "/" + name[1] + "/" + name[2] |
|||
} |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss"> |
|||
page { |
|||
background-color: #f1f2f3; |
|||
} |
|||
|
|||
|
|||
.menu-item { |
|||
height: 112rpx; |
|||
width: auto; |
|||
display: flex; |
|||
flex-direction: row; |
|||
background-color: #fff; |
|||
align-items: center; |
|||
padding-left: 36rpx; |
|||
padding-right: 36rpx; |
|||
} |
|||
|
|||
.more { |
|||
width: 35rpx; |
|||
height: 35rpx; |
|||
float: right; |
|||
} |
|||
|
|||
.menu-item .icon { |
|||
width: 69rpx; |
|||
height: 35rpx; |
|||
} |
|||
|
|||
.menu-item .text { |
|||
font-size: 32rpx; |
|||
color: #101010; |
|||
flex: 1; |
|||
float: left; |
|||
} |
|||
|
|||
.menu-item .explain { |
|||
font-size: 28rpx; |
|||
color: #828282; |
|||
margin-right: 10rpx; |
|||
} |
|||
|
|||
.line-thin { |
|||
height: 1rpx; |
|||
width: 100%; |
|||
background-color: #eee; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,327 @@ |
|||
<template> |
|||
<view class="page"> |
|||
|
|||
<view style="height: 80vh;overflow: hidden;overflow-y: auto;padding: 12px;"> |
|||
|
|||
<view class="top"> |
|||
|
|||
<view class="top-item"> |
|||
|
|||
<text class="item-text">发票类型</text> |
|||
|
|||
<radio-group @change="radioChange"> |
|||
<radio style="transform:scale(0.8);font-size: 20px;" color="#FF9900" value="普通发票" |
|||
:checked="info.invoiceType=='普通发票'">普通发票</radio> |
|||
<radio style="transform:scale(0.8);font-size: 20px;" color="#FF9900" value="增值税发票" |
|||
:checked="info.invoiceType=='增值税发票'">增值税发票</radio> |
|||
</radio-group> |
|||
</view> |
|||
|
|||
<view class="top-item" style="margin-top: 24px;"> |
|||
|
|||
<text class="item-text">抬头类型</text> |
|||
|
|||
<radio-group @change="radioChange2"> |
|||
<radio style="transform:scale(0.8);font-size: 20px;" color="#FF9900" value="个人或事业单位" |
|||
:checked="info.headingType=='个人或事业单位'">个人或事业单位 |
|||
</radio> |
|||
<radio style="transform:scale(0.8);font-size: 20px;" color="#FF9900" value="企业" |
|||
:checked="info.headingType=='企业'">企业</radio> |
|||
</radio-group> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view class="bom"> |
|||
|
|||
<view class="bom-item"> |
|||
|
|||
<text class="item-text">发票抬头</text> |
|||
|
|||
<view class="item-right"> |
|||
<view style="width: 100%;margin-left: 20px;padding-left: 5px;"> |
|||
<input class="input" type="text" placeholder="填写抬头名称" v-model="info.invoiceHeader" /> |
|||
</view> |
|||
|
|||
</view> |
|||
</view> |
|||
|
|||
<view v-if="isPerson"> |
|||
<view style="display: flex;flex-direction: column;" v-if="showDetail"> |
|||
|
|||
<view class="bom-item" style="margin-top: 12px;"> |
|||
|
|||
<text class="item-text">税号</text> |
|||
|
|||
<view class="item-right" style="width: 100%;margin-left: 20px;padding-left: 5px;"> |
|||
<input class="input" type="text" placeholder="纳税人识别号或社会统一征信代码" |
|||
v-model="info.dutyParagraph" /> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="bom-item" style="margin-top: 12px;"> |
|||
|
|||
<text class="item-text">开户银行</text> |
|||
|
|||
<view class="item-right" style="width: 100%;margin-left: 20px;padding-left: 5px;"> |
|||
<input class="input" type="text" placeholder="选填" v-model="info.bankOfDeposit" /> |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
<view class="bom-item" style="margin-top: 12px;"> |
|||
|
|||
<text class="item-text">银行账号</text> |
|||
|
|||
<view class="item-right" style="width: 100%;margin-left: 20px;padding-left: 5px;"> |
|||
<input class="input" type="text" placeholder="选填" v-model="info.bankAccount" /> |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
<view class="bom-item" style="margin-top: 12px;"> |
|||
|
|||
<text class="item-text">企业地址</text> |
|||
|
|||
<view class="item-right" style="width: 100%;margin-left: 20px;padding-left: 5px;"> |
|||
<input class="input" type="text" placeholder="选填" v-model="info.enterpriseAddress" /> |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
<view class="bom-item" style="margin-top: 12px;"> |
|||
|
|||
<text class="item-text">企业电话</text> |
|||
|
|||
<view class="item-right" style="width: 100%;margin-left: 20px;padding-left: 5px;"> |
|||
<input class="input" type="text" placeholder="选填" v-model="info.enterprisePhone" /> |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
|
|||
<view class="item_btn" v-if="!showDetail" @click="showDetailClick(item)"> |
|||
<text style="font-size: 12px;color: #999; margin-right: 5px;">展开</text> |
|||
<image src="../../static/zhankai.png" style="width: 15px;height: 15px;"></image> |
|||
</view> |
|||
|
|||
<view class="item_btn" v-if="showDetail" @click="showDetailClick(item)"> |
|||
<text style="font-size: 12px;color: #999; margin-right: 5px;">收起</text> |
|||
<image src="../../static/shouqi.png" style="width: 15px;height: 15px;"></image> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view class="default"> |
|||
|
|||
<text class="item-text">设为默认</text> |
|||
|
|||
<radio :checked="radioDefault" @click="radioDefaultClick" style="transform:scale(0.8);" color="#FF9900"> |
|||
</radio> |
|||
</view> |
|||
|
|||
</view> |
|||
<view style="position: absolute; bottom: 20px; display: flex;flex-direction: column;width: 100%; |
|||
box-sizing: border-box;padding-left: 40px;padding-right: 40px; "> |
|||
<view style="background: -webkit-linear-gradient(left,#FFB176,#FE923B); |
|||
width: 100%;border-radius: 25px;height: 50px;text-align: center; |
|||
line-height: 50px;color: #FFFFFF;font-size: 16px;" @click="save"> |
|||
完成</view> |
|||
</view> |
|||
|
|||
|
|||
|
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
//引入bus |
|||
import bus from '@/common/bus'; |
|||
export default { |
|||
data() { |
|||
return { |
|||
isPerson: true, |
|||
showDetail: false, |
|||
radioDefault: false, |
|||
info: { |
|||
sid: "", |
|||
invoiceType: "", //发票类型 |
|||
headingType: "", //抬头类型 |
|||
invoiceHeader: "", //发票抬头 |
|||
dutyParagraph: "", //税号 |
|||
bankOfDeposit: "", //开户行 |
|||
bankAccount: "", //账号 |
|||
enterpriseAddress: "", //企业地址 |
|||
enterprisePhone: "", //企业电话 |
|||
isDefault: "0", //是否默认 1 为默认 |
|||
customerSid: getApp().globalData.sid, |
|||
} |
|||
} |
|||
}, |
|||
onLoad(options) { |
|||
console.log("options", options); |
|||
|
|||
if (JSON.stringify(options) != '{}') { |
|||
let userInfo = JSON.parse(decodeURIComponent(options.info)); |
|||
console.log('userInfo', userInfo); |
|||
this.info = userInfo |
|||
this.radioDefault = this.info.isDefault == '1' |
|||
this.isPerson = this.info.headingType != '个人或事业单位' |
|||
} |
|||
|
|||
|
|||
}, |
|||
methods: { |
|||
|
|||
radioChange(val) { |
|||
console.log("radioChange", val); |
|||
this.info.invoiceType = val.detail.value |
|||
}, |
|||
radioChange2(val) { |
|||
console.log("radioChange2", val); |
|||
|
|||
this.info.headingType = val.detail.value |
|||
|
|||
this.isPerson = val.detail.value != "个人或事业单位" |
|||
|
|||
|
|||
}, |
|||
showDetailClick() { |
|||
this.showDetail = !this.showDetail |
|||
}, |
|||
radioDefaultClick() { |
|||
this.radioDefault = !this.radioDefault |
|||
|
|||
this.info.isDefault = this.radioDefault ? "1" : "0" |
|||
|
|||
}, |
|||
save() { |
|||
|
|||
console.log("save", this.info); |
|||
|
|||
if (this.stringIsEmpty(this.info.invoiceType)) { |
|||
this.shortToast('请选择发票类型') |
|||
return |
|||
} |
|||
if (this.stringIsEmpty(this.info.headingType)) { |
|||
this.shortToast('请选择抬头类型') |
|||
return |
|||
} |
|||
if (this.stringIsEmpty(this.info.invoiceHeader)) { |
|||
this.shortToast('发票抬头不能为空') |
|||
return |
|||
} |
|||
|
|||
if (this.isPerson) { |
|||
if (this.stringIsEmpty(this.info.dutyParagraph)) { |
|||
this.shortToast('税号不能为空') |
|||
return |
|||
} |
|||
} |
|||
|
|||
this.$api.saveOrUpdateInvoice(this.info).then((resp) => { |
|||
this.info.sid = resp |
|||
bus.$emit('invoice', this.info); |
|||
uni.navigateBack() |
|||
}).catch(e => { |
|||
|
|||
}) |
|||
}, |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
.page { |
|||
background: #F7F7F7; |
|||
height: 100vh; |
|||
|
|||
.top { |
|||
display: flex; |
|||
flex-direction: column; |
|||
background: #fff; |
|||
border-radius: 10px; |
|||
padding: 16px 12px; |
|||
|
|||
.top-item { |
|||
display: flex; |
|||
flex-direction: row; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
|
|||
.item-text { |
|||
font-size: 16px; |
|||
} |
|||
|
|||
.item-right { |
|||
flex: 1; |
|||
display: flex; |
|||
flex-direction: row; |
|||
align-items: center; |
|||
|
|||
} |
|||
} |
|||
|
|||
} |
|||
|
|||
.bom { |
|||
margin-top: 12px; |
|||
display: flex; |
|||
flex-direction: column; |
|||
background: #fff; |
|||
border-radius: 10px; |
|||
padding: 16px 12px; |
|||
|
|||
.bom-item { |
|||
width: 100%; |
|||
display: flex; |
|||
flex-direction: row; |
|||
align-items: center; |
|||
|
|||
.item-text { |
|||
font-size: 16px; |
|||
} |
|||
|
|||
.item-right { |
|||
flex: 1; |
|||
display: flex; |
|||
flex-direction: row; |
|||
align-items: center; |
|||
justify-content: flex-end; |
|||
|
|||
.input { |
|||
width: 100%; |
|||
text-align: right; |
|||
pointer-events: auto; |
|||
} |
|||
} |
|||
} |
|||
|
|||
.item_btn { |
|||
margin-top: 10px; |
|||
display: flex; |
|||
flex-direction: row; |
|||
align-items: center; |
|||
width: 100%; |
|||
justify-content: center; |
|||
} |
|||
|
|||
} |
|||
|
|||
.default { |
|||
margin-top: 12px; |
|||
display: flex; |
|||
flex-direction: row; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
background: #fff; |
|||
border-radius: 10px; |
|||
padding: 16px 12px; |
|||
|
|||
} |
|||
} |
|||
</style> |
|||
@ -0,0 +1,200 @@ |
|||
<template> |
|||
|
|||
<view style="display: flex;flex-direction: column;height: 100vh; background: #F7F7F7;"> |
|||
<loading-state ref="pageView" @request="request"> |
|||
<view style="height: 100vh;overflow: hidden;overflow-y: auto;"> |
|||
<view |
|||
style="background: #fff;border-radius: 10px;display: flex;flex-direction: column;padding: 15px;margin-top: 15px; margin-left: 10px;margin-right: 10px;"> |
|||
|
|||
<text style="font-size: 18px;font-weight: 600;font-family: serif;margin-bottom: 10px;">退款商品</text> |
|||
|
|||
<view v-for="(item,index) in data.ordOrderDetails" |
|||
style=" display: flex;flex-direction: row;align-items: center; margin-bottom: 10px;"> |
|||
|
|||
<image :src="item.picUrl" @click="itemClick(item.goodsSid)" |
|||
style="width: 70px;height: 70px;border-radius: 15px;" mode="scaleToFill"> |
|||
</image> |
|||
|
|||
<view style="margin-left: 10px;display: flex;flex-direction: column;flex: 1;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;width: 100%;"> |
|||
|
|||
<text style="flex: 1;font-weight: 600;font-family: sans-serif;font-size: 14px;" |
|||
@click="itemClick(item.goodsSid)">{{item.goodsName}}</text> |
|||
<text |
|||
style="font-weight: 600;font-family: sans-serif;font-size: 14px;">￥{{item.priceUnit}}</text> |
|||
</view> |
|||
|
|||
<!-- <text style="margin-top: 10px;font-size: 12px;color: #999;">{{item.remarks}}</text> --> |
|||
|
|||
<view style="margin-top: 8px;display: flex;flex-direction: column;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<!-- <text style="border: 1px #EE752F solid; border-radius: 5px; padding: 0px 8px; |
|||
font-size: 10px;color: #EE752F;">{{item.priceUnit}}元/{{item.specificationUnit}}</text> --> |
|||
<text |
|||
style="border: 1px #EE752F solid; border-radius: 5px; padding: 0px 8px; |
|||
font-size: 10px;color: #EE752F; argin-right: 10px; ">{{item.numofPart}}{{item.specificationUnit}}/{{item.unitName}}</text> |
|||
</view> |
|||
|
|||
<text |
|||
style="margin-top: 12px;font-size: 12px;color: #999;">份数：{{item.partNumber}}</text> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view style="background: #fff;border-radius: 10px;margin-top: 12px;margin-left: 10px;margin-right: 10px; |
|||
display: flex;flex-direction: column;padding: 12px 16px;"> |
|||
|
|||
<text style="font-size: 16px;">订单信息</text> |
|||
|
|||
<view style="display: flex;flex-direction: column;margin-top: 15px; "> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
|
|||
<text style="font-size: 14px;color: #999;">订单编号</text> |
|||
<text |
|||
style="margin-left: 15px;font-size: 14px;color: #333;word-break: break-all;">{{data.outTradeNo}}</text> |
|||
</view> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 8px;"> |
|||
|
|||
<text style="font-size: 14px;color: #999;">下单时间</text> |
|||
<text style="margin-left: 15px;font-size: 14px;color: #333;">{{data.createTime}}</text> |
|||
</view> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 8px;"> |
|||
|
|||
<text style="font-size: 14px;color: #999;">支付方式</text> |
|||
<text style="margin-left: 15px;font-size: 14px;color: #333;">{{data.payType}}</text> |
|||
</view> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 8px;" |
|||
v-if="data.payStatus=='4'"> |
|||
|
|||
<text style="font-size: 14px;color: #999;">付款时间</text> |
|||
<text style="margin-left: 15px;font-size: 14px;color: #333;">{{data.payTime}}</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view style="background: #fff;border-radius: 10px;margin-top: 12px;margin-left: 10px;margin-right: 10px; |
|||
display: flex;flex-direction: column;padding: 12px 16px;margin-bottom: 100px; box-sizing: border-box;"> |
|||
|
|||
<view style="display: flex;flex-direction: row; align-items: center;"> |
|||
<text style="font-size: 16px;font-weight: 600;font-family: serif;">退款原因</text> |
|||
<text style="font-size: 16px;color: #FF9900;margin-left: 5px;">(必填)</text> |
|||
|
|||
</view> |
|||
|
|||
<textarea type="text" v-model="reason" placeholder="补充详细退款原因，有利于商家更快的帮您处理。" |
|||
style="margin-top: 12px; box-sizing: border-box; width: 100%; background: #FAFAFA;color: #999;font-size: 16px;min-height: 150px; padding: 12px 16px;" /> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
</loading-state> |
|||
|
|||
<view |
|||
style="position: absolute; bottom: 0px; display: flex;flex-direction: row;width: 100%;align-items: center; |
|||
box-sizing: border-box; padding-left: 16px;padding-right: 16px;background: #fff; height: 8vh;border-top: 1px solid #EFEFEF;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;flex: 1; margin-right: 20px;"> |
|||
<view style="flex: 1;"></view> |
|||
<text style="font-size: 14px;">退款金额：</text> |
|||
<text style="font-size: 18px;color: #FF5006;">￥{{data.totalTee}}</text> |
|||
|
|||
</view> |
|||
<text style="font-size: 16px;color: #fff; background-color: #FF9900; height: 5vh;line-height: 5vh; |
|||
padding: 0px 20px;border-radius: 20px;" @click="submitApply">提交申请</text> |
|||
|
|||
</view> |
|||
|
|||
|
|||
|
|||
|
|||
|
|||
</view> |
|||
|
|||
|
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
page: { |
|||
sid: "" |
|||
}, |
|||
data: {}, |
|||
reason: "" |
|||
} |
|||
}, |
|||
onLoad(options) { |
|||
this.page.sid = options.sid |
|||
this.request() |
|||
}, |
|||
methods: { |
|||
|
|||
// 获取数据 |
|||
request() { |
|||
|
|||
let _this = this |
|||
|
|||
_this.$api.orderDetails(_this.page.sid).then((resp) => { |
|||
_this.data = resp |
|||
_this.$nextTick(() => { |
|||
_this.$refs.pageView.setLoadState(2) |
|||
}) |
|||
|
|||
}).catch(e => { |
|||
_this.$nextTick(() => { |
|||
_this.$refs.pageView.setLoadState(1) |
|||
}) |
|||
}) |
|||
}, |
|||
itemClick(goodsSid) { |
|||
uni.navigateTo({ |
|||
url: '/pages/good/goodsDetail2?sid=' + goodsSid |
|||
}) |
|||
}, |
|||
|
|||
submitApply() { |
|||
let _this = this |
|||
if (this.stringIsEmpty(this.reason)) { |
|||
this.shortToast('请填写退款原图') |
|||
return |
|||
} |
|||
|
|||
var params = { |
|||
sid: this.page.sid, |
|||
reason: this.reason, |
|||
customerSid: getApp().globalData.sid |
|||
} |
|||
console.log("submitApply", params); |
|||
|
|||
_this.$api.orderRetrun(params).then((resp) => { |
|||
|
|||
uni.redirectTo({ |
|||
url: '/pages/me/refundDetail?sid=' + _this.page.sid |
|||
}) |
|||
}).catch(e => { |
|||
|
|||
}) |
|||
|
|||
}, |
|||
|
|||
} |
|||
|
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
</style> |
|||
@ -0,0 +1,95 @@ |
|||
<template> |
|||
<view style="display: flex;flex-direction: column;width: 100%;height: 100vh;background: #FEA75E;"> |
|||
|
|||
<NavBar ref="nav" navTitle="企业认证" :showIcon="true" :supportChange="false"> |
|||
</NavBar> |
|||
|
|||
<!-- <loading-state ref="pageView" @request="request"> --> |
|||
|
|||
<view style="width: 100%;height: 100vh;background: #F7F7F7; border-radius: 20px;display: flex;flex-direction: column; |
|||
padding-left: 16px;padding-right: 16px;padding-top: 8px;box-sizing: border-box;"> |
|||
|
|||
<text class="text">企业名称</text> |
|||
<input placeholder="请输入" class="input" v-model="authenticationInfo.enterpriseName" /> |
|||
|
|||
<text class="text">配送地址</text> |
|||
<input placeholder="请输入" class="input" v-model="authenticationInfo.shippingAddress" /> |
|||
|
|||
<text class="text">联系人</text> |
|||
<input placeholder="请输入" class="input" v-model="authenticationInfo.contacts" /> |
|||
|
|||
<text class="text">联系电话</text> |
|||
<input placeholder="请输入" class="input" v-model="authenticationInfo.telephone" /> |
|||
|
|||
|
|||
<!-- <text style="position: absolute; bottom: 24px; display: flex;flex-direction: column;width: 100%;text-align: center; |
|||
|
|||
box-sizing: border-box;color: #fff;background: #FF9900; border-radius: 25px; line-height: 40px;height: 40px;">确认</text> --> |
|||
|
|||
|
|||
|
|||
</view> |
|||
|
|||
<view style="position: absolute; bottom: 24px; display: flex;flex-direction: column;width: 100%; |
|||
box-sizing: border-box; padding-left: 16px;padding-right: 16px;"> |
|||
|
|||
<view style="background: -webkit-linear-gradient(left,#FFB176,#FE923B); |
|||
width: 100%;border-radius: 25px;height: 50px;text-align: center; |
|||
line-height: 50px;color: #FFFFFF;font-size: 16px;" @click="save"> |
|||
确认</view> |
|||
</view> |
|||
<!-- </loading-state> --> |
|||
|
|||
|
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
authenticationInfo:{ |
|||
customerSid:getApp().globalData.sid, |
|||
enterpriseName:"", |
|||
shippingAddress:"", |
|||
contacts:"", |
|||
telephone:"", |
|||
|
|||
}, |
|||
|
|||
} |
|||
}, |
|||
|
|||
methods: { |
|||
// 获取数据 |
|||
save() { |
|||
|
|||
this.$api.saveAuthentication(this.authenticationInfo).then((resp) => { |
|||
uni.navigateBack() |
|||
}).catch(e => { |
|||
|
|||
}) |
|||
}, |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style scoped> |
|||
|
|||
.text{ |
|||
font-size: 16px; |
|||
color: #101010; |
|||
margin-top: 17px; |
|||
font-weight: 600; |
|||
font-family: sans-serif; |
|||
} |
|||
.input{ |
|||
margin-top: 12px; |
|||
border: 1px #999999 solid; |
|||
border-radius: 6px; |
|||
font-size: 14px; |
|||
height: 40px; |
|||
line-height: 40px; |
|||
padding-left: 10px; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,269 @@ |
|||
<template> |
|||
|
|||
<view style="display: flex;flex-direction: column;"> |
|||
|
|||
<NavBar ref="nav" navTitle="个人信息" :showIcon="true" :supportChange="false"> |
|||
</NavBar> |
|||
|
|||
<loading-state ref="pageView" @request="request"> |
|||
|
|||
<view @click="uploadHeadImage()" class="menu-item"> |
|||
<text class="text">头像</text> |
|||
<image :src="page.photo" style="width: 70rpx;height: 70rpx;margin-right: 10rpx;"></image> |
|||
<image class="more" src="../../static/more.png"></image> |
|||
</view> |
|||
<view class="line-thin"></view> |
|||
<view @click="remark()" class="menu-item"> |
|||
<text class="text">昵称</text> |
|||
<text class="explain">{{page.nick}}</text> |
|||
<image class="more" src="../../static/more.png"></image> |
|||
</view> |
|||
<view class="line-thin"></view> |
|||
<view class="menu-item"> |
|||
<text class="text">手机号</text> |
|||
<text class="explain"></text> |
|||
<button open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">{{page.phone}}</button> |
|||
<image class="more" src="../../static/more.png"></image> |
|||
</view> |
|||
|
|||
<view class="line-thin"></view> |
|||
<view @click="toRealInfo()" class="menu-item"> |
|||
<text class="text">实名信息</text> |
|||
<text class="explain">{{page.realAttestationExplain}}</text> |
|||
<image class="more" src="../../static/more.png"></image> |
|||
</view> |
|||
|
|||
<!-- <view class="line-thin"></view> |
|||
<view @click="bank()" class="menu-item"> |
|||
<text class="text">推荐支行</text> |
|||
|
|||
<zqs-select class="explain2" :multiple="false" :list="options" label-key="bankName" value-key="bankSid" |
|||
title="选择支行" clearable v-model="page.customerBankName" placeholder=" 请选择支行" @search="searchEvent" |
|||
@change="selectChange2"></zqs-select> |
|||
|
|||
</view> --> |
|||
|
|||
</loading-state> |
|||
|
|||
<uni-popup ref="inputDialog" type="dialog"> |
|||
<uni-popup-dialog ref="inputClose" mode="input" title="修改昵称" :value="page.nick" placeholder="请输入内容" |
|||
@confirm="dialogInputConfirm"></uni-popup-dialog> |
|||
</uni-popup> |
|||
|
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
options: [{ |
|||
label: '沃尔玛（WALMART)', |
|||
value: '0', |
|||
}, |
|||
{ |
|||
label: '国家电网有限公司（STATE GRID)', |
|||
value: '1', |
|||
}, |
|||
{ |
|||
label: '中国石油天然气集团有限公司', |
|||
value: '2', |
|||
}, |
|||
{ |
|||
label: '苹果公司（APPLE)', |
|||
value: '3', |
|||
}, |
|||
{ |
|||
label: 'CVSHealth公司（CVS HEALTH)', |
|||
value: '4', |
|||
}, |
|||
{ |
|||
label: '联合健康集团（UNITEDHEALTH GROUP)', |
|||
value: '5', |
|||
}, |
|||
{ |
|||
label: '丰田汽车公司（TOYOTA MOTOR)', |
|||
value: '6', |
|||
} |
|||
], |
|||
page: {} |
|||
} |
|||
}, |
|||
onLoad(options) { |
|||
this.request() |
|||
uni.$on("real-info", (e) => { |
|||
this.$nextTick(() => { |
|||
this.$refs.pageView.setLoadState(0) |
|||
}) |
|||
this.request(); |
|||
}) |
|||
}, |
|||
onUnload() { |
|||
uni.$off('real-info'); |
|||
}, |
|||
methods: { |
|||
// 获取数据 |
|||
request() { |
|||
let _this = this |
|||
_this.$api.getBaseInfo(getApp().globalData.sid).then((resp) => { |
|||
_this.page = resp |
|||
_this.$nextTick(() => { |
|||
_this.$refs.pageView.setLoadState(2) |
|||
_this.options = resp.customerBankList |
|||
}) |
|||
|
|||
}).catch(e => { |
|||
_this.$nextTick(() => { |
|||
_this.$refs.pageView.setLoadState(1) |
|||
}) |
|||
}) |
|||
}, |
|||
uploadHeadImage() { |
|||
let _this = this |
|||
uni.chooseImage({ |
|||
success: (chooseImageRes) => { |
|||
const tempFilePaths = chooseImageRes.tempFilePaths; |
|||
uni.uploadFile({ |
|||
url: _this.$api.headerUpload, |
|||
filePath: tempFilePaths[0], |
|||
name: 'file', |
|||
formData: { |
|||
'userSid': getApp().globalData.sid |
|||
}, |
|||
success: (uploadFileRes) => { |
|||
_this.page.photo = JSON.parse(uploadFileRes.data).data; |
|||
} |
|||
}); |
|||
} |
|||
}); |
|||
}, |
|||
// 修改昵称 |
|||
remark() { |
|||
this.$refs.inputDialog.open() |
|||
}, |
|||
dialogInputConfirm(val) { |
|||
let _this = this |
|||
_this.$api.changeNick({ |
|||
userSid: getApp().globalData.sid, |
|||
userNickName: val |
|||
}).then((resp) => { |
|||
_this.page.nick = val |
|||
}).catch(e => { |
|||
console.log(e); |
|||
}) |
|||
}, |
|||
getPhoneNumber(e) { |
|||
let _this = this |
|||
console.log(e.detail.code) |
|||
_this.$api.getPhone({ |
|||
userSid: getApp().globalData.sid, |
|||
code: e.detail.code |
|||
}).then((resp) => { |
|||
_this.page.phone = resp |
|||
}).catch(e => { |
|||
console.log(e); |
|||
}) |
|||
}, |
|||
toRealInfo() { |
|||
uni.navigateTo({ |
|||
url: '/pages/me/RealInfo' |
|||
}) |
|||
}, |
|||
bank() {}, |
|||
selectChange2(e) { |
|||
// 此处为点击的事件 |
|||
let param = { |
|||
userSid: getApp().globalData.sid, |
|||
customerBankSid: e.bankSid |
|||
} |
|||
let _this = this |
|||
_this.$api.saveTuiJianZhiHang(param).then((resp) => { |
|||
_this.request() |
|||
}).catch(e => { |
|||
_this.request() |
|||
}) |
|||
}, |
|||
searchEvent(val) { |
|||
let _this = this |
|||
_this.$api.searchTuiJianZhiHang({ |
|||
name: val |
|||
}).then((resp) => { |
|||
_this.options = resp |
|||
}).catch(e => { |
|||
console.log("===", e); |
|||
}) |
|||
}, |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss"> |
|||
button { |
|||
color: #828282; |
|||
background-color: #fff; |
|||
font-size: 28rpx; |
|||
padding-right: 10rpx; |
|||
} |
|||
|
|||
|
|||
button::after { |
|||
border: 0; |
|||
} |
|||
|
|||
// 修改点击时的样式 |
|||
.button-hover { |
|||
color: #F85959; |
|||
background-color: #fff; |
|||
} |
|||
|
|||
page { |
|||
background-color: #f1f2f3; |
|||
} |
|||
|
|||
|
|||
.menu-item { |
|||
height: 112rpx; |
|||
width: auto; |
|||
display: flex; |
|||
flex-direction: row; |
|||
background-color: #fff; |
|||
align-items: center; |
|||
padding-left: 36rpx; |
|||
padding-right: 36rpx; |
|||
} |
|||
|
|||
.more { |
|||
width: 35rpx; |
|||
height: 35rpx; |
|||
float: right; |
|||
} |
|||
|
|||
.menu-item .icon { |
|||
width: 69rpx; |
|||
height: 35rpx; |
|||
} |
|||
|
|||
.menu-item .text { |
|||
font-size: 32rpx; |
|||
color: #101010; |
|||
flex: 1; |
|||
float: left; |
|||
} |
|||
|
|||
.menu-item .explain { |
|||
font-size: 28rpx; |
|||
color: #828282; |
|||
margin-right: 10rpx; |
|||
} |
|||
|
|||
.menu-item .explain2 { |
|||
font-size: 28rpx; |
|||
color: #828282; |
|||
} |
|||
|
|||
.line-thin { |
|||
height: 1rpx; |
|||
width: 100%; |
|||
background-color: #eee; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,486 @@ |
|||
<template> |
|||
<view class="page"> |
|||
|
|||
<view style="height: 80vh;overflow: hidden;overflow-y: auto;padding: 12px;"> |
|||
|
|||
<view class="top"> |
|||
|
|||
<view class="top-item" style="margin-top: 0px;"> |
|||
|
|||
<text class="item-text">发票类型</text> |
|||
|
|||
<radio-group @change="radioChange"> |
|||
<radio style="transform:scale(0.8);font-size: 20px;" color="#FF9900" value="普通发票" |
|||
:checked="info.invoiceType=='普通发票'">普通发票</radio> |
|||
<radio style="transform:scale(0.8);font-size: 20px;" color="#FF9900" value="增值税发票" |
|||
:checked="info.invoiceType=='增值税发票'">增值税发票</radio> |
|||
</radio-group> |
|||
</view> |
|||
|
|||
<view class="top-item"> |
|||
|
|||
<text class="item-text">抬头类型</text> |
|||
|
|||
<radio-group @change="radioChange2"> |
|||
<radio style="transform:scale(0.8);font-size: 20px;" color="#FF9900" value="个人或事业单位" |
|||
:checked="info.headingType=='个人或事业单位'">个人或事业单位 |
|||
</radio> |
|||
<radio style="transform:scale(0.8);font-size: 20px;" color="#FF9900" value="企业" |
|||
:checked="info.headingType=='企业'">企业</radio> |
|||
</radio-group> |
|||
|
|||
</view> |
|||
|
|||
<view class="top-item"> |
|||
|
|||
<text class="item-text">发票抬头</text> |
|||
|
|||
<view class="item-right"> |
|||
<view style="width: 100%;margin-left: 20px;padding-left: 5px;"> |
|||
<input class="input" type="text" placeholder="填写抬头名称" v-model="info.invoiceHeader" /> |
|||
</view> |
|||
<image src="../../static/more.png" style="width: 15px;height: 15px;margin-left: 5px;" |
|||
@click="showList"></image> |
|||
|
|||
</view> |
|||
</view> |
|||
|
|||
<view class="top-item"> |
|||
|
|||
<text class="item-text">电子邮箱</text> |
|||
|
|||
<view class="item-right" style="width: 100%;margin-left: 20px;padding-left: 5px;"> |
|||
<input class="input" type="text" placeholder="选填" v-model="info.email" /> |
|||
</view> |
|||
</view> |
|||
|
|||
<view v-if="isPerson"> |
|||
<view style="display: flex;flex-direction: column;" v-if="showDetail"> |
|||
|
|||
<view class="top-item"> |
|||
|
|||
<text class="item-text">税号</text> |
|||
|
|||
<view class="item-right" style="width: 100%;margin-left: 20px;padding-left: 5px;"> |
|||
<input class="input" type="text" placeholder="纳税人识别号或社会统一征信代码" |
|||
v-model="info.dutyParagraph" /> |
|||
</view> |
|||
</view> |
|||
|
|||
<view class="top-item"> |
|||
|
|||
<text class="item-text">开户银行</text> |
|||
|
|||
<view class="item-right" style="width: 100%;margin-left: 20px;padding-left: 5px;"> |
|||
<input class="input" type="text" placeholder="选填" v-model="info.bankOfDeposit" /> |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
<view class="top-item"> |
|||
|
|||
<text class="item-text">银行账号</text> |
|||
|
|||
<view class="item-right" style="width: 100%;margin-left: 20px;padding-left: 5px;"> |
|||
<input class="input" type="text" placeholder="选填" v-model="info.bankAccount" /> |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
<view class="top-item"> |
|||
|
|||
<text class="item-text">企业地址</text> |
|||
|
|||
<view class="item-right" style="width: 100%;margin-left: 20px;padding-left: 5px;"> |
|||
<input class="input" type="text" placeholder="选填" v-model="info.enterpriseAddress" /> |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
<view class="top-item"> |
|||
|
|||
<text class="item-text">企业电话</text> |
|||
|
|||
<view class="item-right" style="width: 100%;margin-left: 20px;padding-left: 5px;"> |
|||
<input class="input" type="text" placeholder="选填" v-model="info.enterprisePhone" /> |
|||
</view> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view class="item_btn" v-if="!showDetail" @click="showDetailClick(item)"> |
|||
<text style="font-size: 12px;color: #999; margin-right: 5px;">展开</text> |
|||
<image src="../../static/zhankai.png" style="width: 15px;height: 15px;"></image> |
|||
</view> |
|||
|
|||
<view class="item_btn" v-if="showDetail" @click="showDetailClick(item)"> |
|||
<text style="font-size: 12px;color: #999; margin-right: 5px;">收起</text> |
|||
<image src="../../static/shouqi.png" style="width: 15px;height: 15px;"></image> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
<view style="position: absolute; bottom: 20px; display: flex;flex-direction: column;width: 100%; |
|||
box-sizing: border-box;padding-left: 40px;padding-right: 40px; "> |
|||
<view style="background: -webkit-linear-gradient(left,#FFB176,#FE923B); |
|||
width: 100%;border-radius: 25px;height: 50px;text-align: center; |
|||
line-height: 50px;color: #FFFFFF;font-size: 16px;" @click="save"> |
|||
提交申请</view> |
|||
</view> |
|||
|
|||
<!-- 弹窗蒙版 --> |
|||
<view class="model" catchtouchmove='preventTouchMove' v-if='showModal'></view> |
|||
<view class="modalDlg" id="modalDlg" catchtouchmove='preventTouchMove' v-if='showModal'> |
|||
|
|||
<view style="display: flex;flex-direction: column;padding: 12px;"> |
|||
|
|||
<view |
|||
style="display: flex;flex-direction: row;align-items: center;justify-content: space-between; width: 100%;"> |
|||
|
|||
<text style="font-size: 16px;font-weight: 600;font-family: sans-serif;margin-left: 5px;">选择抬头</text> |
|||
<image src="../../static/close2.png" style="width: 25px;height: 25px;" @click.stop="colseDialog()"> |
|||
</image> |
|||
|
|||
</view> |
|||
|
|||
<scroll-view scroll-y="true" :show-scrollbar="false" |
|||
style="margin-top: 10px;padding-left: 12px;padding-right: 12px;box-sizing: border-box;" |
|||
:style="'height:'+viewHeight+'px'"> |
|||
|
|||
<view v-for="(item,index) in data" :key="index" style="display: flex;flex-direction: column;" |
|||
v-if="showData"> |
|||
|
|||
<view style="display: flex;flex-direction: row;justify-content: center;align-items: center; |
|||
background: #fff; border-radius: 10px; margin-top: 12px;padding: 20px 12px;" @click="itemClick(item)"> |
|||
|
|||
<view style="flex: 1;display: flex;flex-direction: column;"> |
|||
|
|||
<view style="flex: 1;display: flex;flex-direction: row;align-items: center;"> |
|||
<text |
|||
style="font-size: 16px;font-weight: 600;font-family: sans-serif;">{{item.invoiceHeader}}</text> |
|||
<text v-if="item.isDefault==1" style="background: #FFF0DA; color: #FF7200; |
|||
font-size: 10px;margin-left: 6px;border-radius: 5px;padding: 2px 5px;">默认</text> |
|||
</view> |
|||
|
|||
<text style="font-size: 12px;color: #999;margin-top: 5px;"> |
|||
{{item.invoiceType}} - {{item.headingType}}</text> |
|||
|
|||
</view> |
|||
|
|||
<text style="font-size: 12px;color: #999;" @click.stop="editItem(item)">编辑</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view v-if="notData" style="display: flex;flex-direction: column;align-items: center;"> |
|||
|
|||
<image src="https://supervise.yxtsoft.com/lpk/image/notData.png" mode="aspectFit" |
|||
style="width: 100px;height: 100px;"></image> |
|||
<view style="display: flex;flex-direction: column;align-items: center;margin-top: 10px;"> |
|||
<text style="font-size: 14px; color: #999;margin-right: 5px;">暂无数据</text> |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
</scroll-view> |
|||
|
|||
|
|||
</view> |
|||
|
|||
<view style="position: absolute; bottom: 20px; display: flex;flex-direction: column;width: 100%; |
|||
box-sizing: border-box;padding-left: 40px;padding-right: 40px; "> |
|||
<view style="background: -webkit-linear-gradient(left,#FFB176,#FE923B); |
|||
width: 100%;border-radius: 25px;height: 50px;text-align: center; |
|||
line-height: 50px;color: #FFFFFF;font-size: 16px;" @click="addInviice"> |
|||
添加新的抬头</view> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
showModal: false, |
|||
showData: false, |
|||
notData: true, |
|||
viewHeight: "", |
|||
page: { |
|||
sid: "" |
|||
}, |
|||
isPerson: true, |
|||
showDetail: false, |
|||
radioDefault: false, |
|||
info: { |
|||
sid: "", |
|||
invoiceType: "", //发票类型 |
|||
headingType: "", //抬头类型 |
|||
invoiceHeader: "", //发票抬头 |
|||
dutyParagraph: "", //税号 |
|||
bankOfDeposit: "", //开户行 |
|||
bankAccount: "", //账号 |
|||
enterpriseAddress: "", //企业地址 |
|||
enterprisePhone: "", //企业电话 |
|||
email: "", //电子邮箱 |
|||
isDefault: "0", //是否默认 1 为默认 |
|||
customerSid: getApp().globalData.sid, |
|||
orderSid: "" // 订单sid |
|||
}, |
|||
data: [] |
|||
} |
|||
}, |
|||
onLoad(options) { |
|||
this.page.sid = options.sid |
|||
this.getData() |
|||
//隐藏加载框 |
|||
// uni.hideLoading(); |
|||
}, |
|||
onShow() { |
|||
// this.getData() |
|||
// //隐藏加载框 |
|||
// uni.hideLoading(); |
|||
}, |
|||
created() { |
|||
var _this = this |
|||
this.$bus.$on('invoice', msg => { |
|||
console.log("aaaaaaaaaaa4", msg) |
|||
|
|||
const index = _this.data.findIndex(item => item.sid == msg.sid) |
|||
console.log(">>>>", index) |
|||
if (index != -1) { |
|||
// 替换 已修改过 |
|||
_this.data.splice(index, 1, msg) |
|||
} else { |
|||
// 刚新增的 |
|||
_this.data.push(msg) |
|||
} |
|||
|
|||
|
|||
}); |
|||
}, |
|||
methods: { |
|||
getData() { |
|||
|
|||
this.$api.getInvoiceList(getApp().globalData.sid).then((resp) => { |
|||
console.log("getInvoiceList>>>" + resp); |
|||
this.data = resp |
|||
|
|||
const arr1 = this.data.filter(item => item.isDefault == 1) |
|||
console.log(">>>>", arr1) |
|||
|
|||
if (arr1.length > 0) { |
|||
this.info = arr1[0] |
|||
this.isPerson = this.info.headingType != '个人或事业单位' |
|||
} |
|||
|
|||
}).catch(e => { |
|||
|
|||
}) |
|||
|
|||
}, |
|||
showList() { |
|||
this.showModal = true |
|||
uni.showLoading({ |
|||
title: '加载中' |
|||
}) |
|||
setTimeout(() => { |
|||
const query = uni.createSelectorQuery().in(this); |
|||
query.select('.modalDlg').boundingClientRect(data => { |
|||
console.log("得到布局位置信息" + JSON.stringify(data)); |
|||
console.log("节点离页面顶部的距离为" + data.top); |
|||
console.log("节点离页面顶部的距离为" + data.height); |
|||
this.viewHeight = data.height - 135 |
|||
this.showData = this.data.length > 0 |
|||
this.notData = this.data.length == 0 |
|||
|
|||
console.log("showData2" + this.showData); |
|||
console.log("notData2" + this.notData); |
|||
|
|||
//隐藏加载框 |
|||
uni.hideLoading(); |
|||
}).exec(); |
|||
|
|||
}, 500) |
|||
|
|||
}, |
|||
|
|||
itemClick(item) { |
|||
console.log("itemClick", item); |
|||
|
|||
this.info = item |
|||
this.isPerson = this.info.headingType != '个人或事业单位' |
|||
this.colseDialog() |
|||
|
|||
}, |
|||
editItem(item) { |
|||
console.log("editItem", item); |
|||
|
|||
uni.navigateTo({ |
|||
url: "/pages/me/addInvoice?info=" + encodeURIComponent(JSON.stringify(item)) |
|||
}) |
|||
}, |
|||
colseDialog() { |
|||
this.showModal = false |
|||
}, |
|||
addInviice() { |
|||
uni.navigateTo({ |
|||
url: "/pages/me/addInvoice" |
|||
}) |
|||
}, |
|||
radioChange(val) { |
|||
console.log("radioChange", val); |
|||
this.info.invoiceType = val.detail.value |
|||
}, |
|||
radioChange2(val) { |
|||
console.log("radioChange2", val); |
|||
|
|||
this.info.headingType = val.detail.value |
|||
|
|||
this.isPerson = val.detail.value != "个人或事业单位" |
|||
|
|||
|
|||
}, |
|||
showDetailClick() { |
|||
this.showDetail = !this.showDetail |
|||
}, |
|||
radioDefaultClick() { |
|||
this.radioDefault = !this.radioDefault |
|||
|
|||
this.info.isDefault = this.radioDefault ? "1" : "0" |
|||
|
|||
}, |
|||
save() { |
|||
|
|||
console.log("save", this.info); |
|||
|
|||
if (this.stringIsEmpty(this.info.invoiceType)) { |
|||
this.shortToast('请选择发票类型') |
|||
return |
|||
} |
|||
if (this.stringIsEmpty(this.info.headingType)) { |
|||
this.shortToast('请选择抬头类型') |
|||
return |
|||
} |
|||
if (this.stringIsEmpty(this.info.invoiceHeader)) { |
|||
this.shortToast('发票抬头不能为空') |
|||
return |
|||
} |
|||
|
|||
if (this.isPerson) { |
|||
if (this.stringIsEmpty(this.info.dutyParagraph)) { |
|||
this.shortToast('税号不能为空') |
|||
return |
|||
} |
|||
} |
|||
this.info.orderSid = this.page.sid |
|||
|
|||
console.log("info", this.info); |
|||
|
|||
this.$api.submitInvoice(this.info).then((resp) => { |
|||
uni.navigateBack() |
|||
}).catch(e => { |
|||
|
|||
}) |
|||
}, |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
::-webkit-scrollbar { |
|||
display: none; |
|||
width: 0; |
|||
height: 0; |
|||
color: transparent; |
|||
} |
|||
|
|||
.page { |
|||
background: #F7F7F7; |
|||
height: 100vh; |
|||
|
|||
.top { |
|||
display: flex; |
|||
flex-direction: column; |
|||
background: #fff; |
|||
border-radius: 10px; |
|||
padding: 16px 12px; |
|||
|
|||
.top-item { |
|||
margin-top: 24px; |
|||
display: flex; |
|||
flex-direction: row; |
|||
justify-content: space-between; |
|||
align-items: center; |
|||
|
|||
.item-text { |
|||
font-size: 16px; |
|||
} |
|||
|
|||
.item-right { |
|||
flex: 1; |
|||
display: flex; |
|||
flex-direction: row; |
|||
align-items: center; |
|||
justify-content: flex-end; |
|||
|
|||
.input { |
|||
width: 100%; |
|||
text-align: right; |
|||
pointer-events: auto; |
|||
} |
|||
} |
|||
} |
|||
|
|||
.item_btn { |
|||
margin-top: 10px; |
|||
display: flex; |
|||
flex-direction: row; |
|||
align-items: center; |
|||
width: 100%; |
|||
justify-content: center; |
|||
} |
|||
|
|||
} |
|||
|
|||
|
|||
} |
|||
|
|||
/* 弹窗样式 */ |
|||
.model { |
|||
position: absolute; |
|||
width: 100%; |
|||
height: 100%; |
|||
background: #000; |
|||
z-index: 1; |
|||
opacity: 0.5; |
|||
top: 0; |
|||
left: 0; |
|||
} |
|||
|
|||
.modalDlg { |
|||
/* 设置超出滚动 */ |
|||
overflow: auto; |
|||
width: 100%; |
|||
position: fixed; |
|||
top: 70vw; |
|||
left: 0; |
|||
right: 0; |
|||
bottom: 0; |
|||
z-index: 1000; |
|||
background-color: #F7F7F7; |
|||
border-top-right-radius: 20px; |
|||
border-top-left-radius: 20px; |
|||
display: flex; |
|||
flex-direction: column; |
|||
} |
|||
|
|||
button::after { |
|||
border: 0; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,181 @@ |
|||
<template> |
|||
|
|||
<view style="display: flex;flex-direction: column;height: 100vh; background: #F7F7F7;"> |
|||
<loading-state ref="pageView" @request="request"> |
|||
<view style="height: 100vh;overflow: hidden;overflow-y: auto;"> |
|||
|
|||
<view style="background: #fff;border-radius: 10px;margin-top: 12px;margin-left: 10px;margin-right: 10px; |
|||
display: flex;flex-direction: column;padding: 12px 16px;"> |
|||
|
|||
<view |
|||
style="display: flex;flex-direction: column; border-bottom: 1px #F7F7F7 solid; padding-bottom: 10px;"> |
|||
|
|||
<text style="font-size: 20px;color: #000;" v-show="data.payStatus=='5'">退款中</text> |
|||
<text style="font-size: 14px;color: #999;margin-top: 5px;" |
|||
v-show="data.payStatus=='5'">您已提交退款申请，请等待处理</text> |
|||
|
|||
<text style="font-size: 20px;color: #000;" v-show="data.payStatus=='6'">退款成功</text> |
|||
<text style="font-size: 14px;color: #999;margin-top: 5px;" |
|||
v-show="data.payStatus=='6'">已退回至原支付方</text> |
|||
|
|||
</view> |
|||
|
|||
<view |
|||
style="display: flex;flex-direction:row;justify-content: space-between;align-items: center;margin-top: 10px;"> |
|||
<text style="font-size: 16px;color: #666;">退款金额</text> |
|||
<text style="font-size: 16px;color: #FF5006;">￥{{data.totalTee}}</text> |
|||
</view> |
|||
|
|||
<view |
|||
style="display: flex;flex-direction:row;justify-content: space-between;align-items: center;margin-top: 10px;"> |
|||
<text style="font-size: 16px;color: #666;">退款账户</text> |
|||
<text style="font-size: 13px;color: #999;">原支付账户</text> |
|||
</view> |
|||
|
|||
<view |
|||
style="display: flex;flex-direction:row;justify-content: space-between;align-items: center;margin-top: 10px;"> |
|||
<text style="font-size: 16px;color: #666;">退款原因</text> |
|||
<text style="font-size: 13px;color: #999;">{{data.reason}}</text> |
|||
</view> |
|||
</view> |
|||
|
|||
|
|||
<view |
|||
style="background: #fff;border-radius: 10px;display: flex;flex-direction: column;padding: 15px;margin-top: 15px; margin-left: 10px;margin-right: 10px;"> |
|||
|
|||
<text style="font-size: 18px;font-weight: 600;font-family: serif;margin-bottom: 10px;">退款商品</text> |
|||
|
|||
<view v-for="(item,index) in data.ordOrderDetails" |
|||
style=" display: flex;flex-direction: row;align-items: center; margin-bottom: 10px;"> |
|||
|
|||
<image :src="item.picUrl" @click="itemClick(item.goodsSid)" |
|||
style="width: 70px;height: 70px;border-radius: 15px;" mode="scaleToFill"> |
|||
</image> |
|||
|
|||
<view style="margin-left: 10px;display: flex;flex-direction: column;flex: 1;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;width: 100%;"> |
|||
|
|||
<text style="flex: 1;font-weight: 600;font-family: sans-serif;font-size: 14px;" |
|||
@click="itemClick(item.goodsSid)">{{item.goodsName}}</text> |
|||
<text |
|||
style="font-weight: 600;font-family: sans-serif;font-size: 14px;">￥{{item.priceUnit}}</text> |
|||
</view> |
|||
|
|||
<!-- <text style="margin-top: 10px;font-size: 12px;color: #999;">{{item.remarks}}</text> --> |
|||
|
|||
<view style="margin-top: 8px;display: flex;flex-direction: column;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<!-- <text style="border: 1px #EE752F solid; border-radius: 5px; padding: 0px 8px; |
|||
font-size: 10px;color: #EE752F;">{{item.priceUnit}}元/{{item.specificationUnit}}</text> --> |
|||
<text |
|||
style="border: 1px #EE752F solid; border-radius: 5px; padding: 0px 8px; |
|||
font-size: 10px;color: #EE752F; margin-right: 10px; ">{{item.numofPart}}{{item.specificationUnit}}/{{item.unitName}}</text> |
|||
</view> |
|||
|
|||
<text |
|||
style="margin-top: 12px;font-size: 12px;color: #999;">份数：{{item.partNumber}}</text> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view style="background: #fff;border-radius: 10px;margin-top: 12px;margin-left: 10px;margin-right: 10px; |
|||
display: flex;flex-direction: column;padding: 12px 16px;margin-bottom: 100px;"> |
|||
|
|||
<text style="font-size: 16px;">订单信息</text> |
|||
|
|||
<view style="display: flex;flex-direction: column;margin-top: 15px; "> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
|
|||
<text style="font-size: 14px;color: #999;">订单编号</text> |
|||
<text |
|||
style="margin-left: 15px;font-size: 14px;color: #333;word-break: break-all;">{{data.outTradeNo}}</text> |
|||
</view> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 8px;"> |
|||
|
|||
<text style="font-size: 14px;color: #999;">下单时间</text> |
|||
<text style="margin-left: 15px;font-size: 14px;color: #333;">{{data.createTime}}</text> |
|||
</view> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 8px;"> |
|||
|
|||
<text style="font-size: 14px;color: #999;">支付方式</text> |
|||
<text style="margin-left: 15px;font-size: 14px;color: #333;">{{data.payType}}</text> |
|||
</view> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 8px;" |
|||
v-if="data.payStatus=='4'"> |
|||
|
|||
<text style="font-size: 14px;color: #999;">付款时间</text> |
|||
<text style="margin-left: 15px;font-size: 14px;color: #333;">{{data.payTime}}</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
</loading-state> |
|||
|
|||
|
|||
</view> |
|||
|
|||
|
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
page: { |
|||
sid: "" |
|||
}, |
|||
data: {}, |
|||
reason: "" |
|||
} |
|||
}, |
|||
onLoad(options) { |
|||
this.page.sid = options.sid |
|||
this.request() |
|||
}, |
|||
methods: { |
|||
|
|||
// 获取数据 |
|||
request() { |
|||
|
|||
|
|||
let _this = this |
|||
|
|||
_this.$api.orderDetails(_this.page.sid).then((resp) => { |
|||
_this.data = resp |
|||
_this.$nextTick(() => { |
|||
_this.$refs.pageView.setLoadState(2) |
|||
}) |
|||
|
|||
}).catch(e => { |
|||
_this.$nextTick(() => { |
|||
_this.$refs.pageView.setLoadState(1) |
|||
}) |
|||
}) |
|||
}, |
|||
itemClick(goodsSid) { |
|||
uni.navigateTo({ |
|||
url: '/pages/good/goodsDetail2?sid=' + goodsSid |
|||
}) |
|||
}, |
|||
|
|||
} |
|||
|
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
</style> |
|||
@ -0,0 +1,107 @@ |
|||
<template> |
|||
<view |
|||
style="display: flex;flex-direction: column;height: 100vh;background: -webkit-linear-gradient(left,#FEA65F,#FB9440);" |
|||
class="app"> |
|||
<!-- 有列表的时候用 :auto='false' 需要你在onload等调用reload方法 --> |
|||
<z-paging ref="paging" v-model="data" @query="queryList" :pagingStyle='styleObject' :auto='true'> |
|||
|
|||
<view v-for="(item,index) in data" style=" display: flex;flex-direction: column;margin-left: 10px;margin-right: 10px; |
|||
padding: 5px 0px;"> |
|||
|
|||
<view class="item"> |
|||
|
|||
<view class="item_left"> |
|||
|
|||
<text class="item_left_text1">{{item.name}}</text> |
|||
<text class="item_left_text2">失效时间：{{item.periodValidity}}</text> |
|||
|
|||
</view> |
|||
|
|||
<text class="item_right">份数：{{item.goodsNumber}}</text> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</z-paging> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
styleObject: { |
|||
'padding-top': '10px', |
|||
'padding-bottom': '10px', |
|||
'background': '#F7F7F7' |
|||
}, |
|||
data: [] |
|||
} |
|||
}, |
|||
|
|||
onLoad() { |
|||
|
|||
}, |
|||
|
|||
methods: { |
|||
// 分页的请求 |
|||
queryList(pageNo, pageSize) { |
|||
let _this = this |
|||
_this.$api.vegeCellarInvalidList({ |
|||
"current": pageNo, |
|||
"size": pageSize, |
|||
"params": { |
|||
"customerSid": getApp().globalData.sid |
|||
|
|||
} |
|||
}).then((resp) => { |
|||
// 添加数据源 |
|||
this.$refs.paging.complete(resp.records) |
|||
}).catch(e => { |
|||
// 出错了，点击重试 |
|||
_this.$refs.paging.complete(false); |
|||
}) |
|||
}, |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
.app { |
|||
--bgcolor: #f2f2f2; |
|||
|
|||
} |
|||
|
|||
.item { |
|||
display: flex; |
|||
flex-direction: row; |
|||
align-items: center; |
|||
background: #fff; |
|||
border-radius: 8px; |
|||
padding: 12px; |
|||
|
|||
.item_left { |
|||
flex: 1; |
|||
display: flex; |
|||
flex-direction: column; |
|||
|
|||
.item_left_text1 { |
|||
font-size: 14px; |
|||
color: #333; |
|||
} |
|||
|
|||
.item_left_text2 { |
|||
margin-top: 8px; |
|||
font-size: 12px; |
|||
color: #E36443; |
|||
} |
|||
|
|||
} |
|||
|
|||
.item_right { |
|||
font-size: 12px; |
|||
color: #999; |
|||
} |
|||
} |
|||
</style> |
|||
@ -0,0 +1,350 @@ |
|||
<template> |
|||
<view style="display: flex;flex-direction: column;height: 100vh; background: #F7F7F7;"> |
|||
<loading-state ref="pageView" @request="request"> |
|||
<view style="height: 100vh;overflow: hidden;overflow-y: auto;"> |
|||
<view v-if="data.payStatus=='2'" |
|||
style="display: flex;flex-direction: row;align-items: center;width: 100%;justify-content: center;margin-top: 10px;padding: 10px;"> |
|||
<text style="font-size: 14px;">还剩</text> |
|||
<text |
|||
style="font-weight: 600;color: #FF5006;font-size: 18px;margin-left: 2px;margin-right: 2px;">{{page.countdown}}</text> |
|||
<text style="font-size: 14px;">订单自动取消</text> |
|||
|
|||
</view> |
|||
|
|||
<view |
|||
style="background: #fff;border-radius: 10px;display: flex;flex-direction: column;padding: 15px;margin-top: 15px; margin-left: 10px;margin-right: 10px;"> |
|||
|
|||
<view v-for="(item,index) in data.ordOrderDetails" |
|||
style=" display: flex;flex-direction: row;align-items: center; margin-bottom: 15px;"> |
|||
|
|||
<image :src="item.picUrl" @click="itemClick(item.goodsSid)" |
|||
style="width: 70px;height: 70px;border-radius: 15px;" mode="scaleToFill"> |
|||
</image> |
|||
|
|||
<view style="margin-left: 10px;display: flex;flex-direction: column;flex: 1;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;width: 100%;"> |
|||
|
|||
<text style="flex: 1;font-weight: 600;font-family: sans-serif;font-size: 14px;" |
|||
@click="itemClick(item.goodsSid)">{{item.goodsName}}</text> |
|||
<text |
|||
style="font-weight: 600;font-family: sans-serif;font-size: 14px;">￥{{item.priceUnit}}</text> |
|||
</view> |
|||
|
|||
<!-- <text style="margin-top: 10px;font-size: 12px;color: #999;">{{item.remarks}}</text> --> |
|||
|
|||
<view style="margin-top: 8px;display: flex;flex-direction: column;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<!-- <text style="border: 1px #EE752F solid; border-radius: 5px; padding: 0px 8px; |
|||
font-size: 10px;color: #EE752F;">{{item.priceUnit}}元/{{item.unitName}}</text> --> |
|||
<text |
|||
style="border: 1px #EE752F solid; border-radius: 5px; padding: 0px 8px; |
|||
font-size: 10px;color: #EE752F; margin-right: 10px; ">{{item.numofPart}}{{item.specificationUnit}}/{{item.unitName}}</text> |
|||
</view> |
|||
|
|||
<text |
|||
style="margin-top: 12px;font-size: 12px;color: #999;">份数：{{item.partNumber}}</text> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view style="display: flex;flex-direction: column; |
|||
border-top: 1px solid #EFEFEF;padding-top: 15px;"> |
|||
|
|||
<view |
|||
style="display: flex;flex-direction: row;align-items: center;justify-content: space-between;"> |
|||
<text>商品总额</text> |
|||
<text>￥{{data.totalTee}}</text> |
|||
</view> |
|||
|
|||
<!-- <view |
|||
style="display: flex;flex-direction: row;align-items: center;justify-content: space-between;margin-top: 15px;"> |
|||
<text>附加费</text> |
|||
<text>￥{{data.surcharge}}</text> |
|||
</view> --> |
|||
|
|||
</view> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center; |
|||
border-top: 1px solid #EFEFEF;padding-top: 15px;margin-top: 15px;"> |
|||
|
|||
<view style="flex: 1;"> |
|||
</view> |
|||
|
|||
<view v-if="data.payStatus=='4'" |
|||
style="display: flex;flex-direction: row;align-items: center;justify-content: space-between;"> |
|||
<text>实付</text> |
|||
<text style="font-size: 16px;font-weight: 600;color: #FF5006;">￥{{data.totalTee}}</text> |
|||
</view> |
|||
|
|||
<view v-if="data.payStatus=='2'" |
|||
style="display: flex;flex-direction: row;align-items: center;justify-content: space-between;"> |
|||
<text style="color: #FF5006;margin-right: 3px;font-size: 14px;">需付款</text> |
|||
<text style="color: #FF5006;font-size: 16px;font-weight: 600;">￥{{data.totalTee}}</text> |
|||
</view> |
|||
|
|||
<view v-if="data.payStatus=='3'" |
|||
style="display: flex;flex-direction: row;align-items: center;justify-content: space-between;"> |
|||
<text style="color: #666;margin-right: 3px;font-size: 14px;">需付款</text> |
|||
<text style="color: #666;font-size: 16px;font-weight: 600;">￥{{data.totalTee}}</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
|
|||
<view style="background: #fff;border-radius: 10px;margin-top: 12px;margin-left: 10px;margin-right: 10px; |
|||
display: flex;flex-direction: column;padding: 12px 16px;margin-bottom: 100px;"> |
|||
|
|||
<text style="font-size: 16px;">订单信息</text> |
|||
|
|||
<view style="display: flex;flex-direction: column;margin-top: 15px; "> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
|
|||
<text style="font-size: 14px;color: #999;">订单编号</text> |
|||
<text |
|||
style="margin-left: 15px;font-size: 14px;color: #333;word-break: break-all;">{{data.outTradeNo}}</text> |
|||
</view> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 8px;"> |
|||
|
|||
<text style="font-size: 14px;color: #999;">下单时间</text> |
|||
<text style="margin-left: 15px;font-size: 14px;color: #333;">{{data.createTime}}</text> |
|||
</view> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 8px;"> |
|||
|
|||
<text style="font-size: 14px;color: #999;">支付方式</text> |
|||
<text style="margin-left: 15px;font-size: 14px;color: #333;">{{data.payType}}</text> |
|||
</view> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 8px;" |
|||
v-if="data.payStatus=='4'"> |
|||
|
|||
<text style="font-size: 14px;color: #999;">付款时间</text> |
|||
<text style="margin-left: 15px;font-size: 14px;color: #333;">{{data.payTime}}</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
</loading-state> |
|||
|
|||
<view v-if="data.payStatus=='2'||data.payStatus=='4'" |
|||
style="position: absolute; bottom: 0px; display: flex;flex-direction: row;width: 100%;align-items: center; |
|||
box-sizing: border-box; padding-left: 16px;padding-right: 16px;background: #fff; height: 8vh;border-top: 1px solid #EFEFEF;"> |
|||
|
|||
<view style="flex: 1;"></view> |
|||
|
|||
<text style="font-size: 16px;color: #fff; background-color: #FF9900; height: 5vh;line-height: 5vh; |
|||
padding: 0px 20px;border-radius: 20px;margin-right: 10px;" @click="continuePy" |
|||
v-if="data.payStatus=='2'">继续付款</text> |
|||
|
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;" v-if="data.payStatus=='4'"> |
|||
<text style="font-size: 16px;color: #fff; background-color: #FF9900; height: 5vh;line-height: 5vh; |
|||
padding: 0px 20px;border-radius: 20px;margin-right: 10px;" @click="refund">申请退款</text> |
|||
|
|||
<text style="font-size: 16px;color: #666; border: 1px #D3D3D3 solid; height: 5vh;line-height: 5vh; |
|||
padding: 0px 20px;border-radius: 20px;" @click="makeInvoice(data.sid)" v-if="data.invoiceStatus=='0'">开具发票</text> |
|||
<text style="font-size: 16px;color: #666; border: 1px #D3D3D3 solid; height: 5vh;line-height: 5vh; |
|||
padding: 0px 20px;border-radius: 20px;" v-if="data.invoiceStatus=='1'">发票开具中</text> |
|||
</view> |
|||
</view> |
|||
|
|||
<!-- <view v-if="data.payStatus=='4'&&data.invoiceStatus=='3'" |
|||
style="position: absolute; bottom: 0px; display: flex;flex-direction: row;width: 100%;align-items: center; |
|||
box-sizing: border-box; padding-left: 16px;padding-right: 16px;background: #fff; height: 8vh;border-top: 1px solid #EFEFEF;"> |
|||
|
|||
<view style="flex: 1;"></view> |
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<text style="font-size: 16px;color: #666; border: 1px #D3D3D3 solid; height: 5vh;line-height: 5vh; |
|||
padding: 0px 20px;border-radius: 20px;" @click="makeInvoice(data.sid)">重新开票</text> |
|||
</view> |
|||
</view> --> |
|||
|
|||
<!-- <view v-if="data.payStatus=='2'" |
|||
style="position: absolute; bottom: 0px; display: flex;flex-direction: row;width: 100%;align-items: center; |
|||
box-sizing: border-box; padding-left: 16px;padding-right: 16px;background: #fff; height: 8vh;border-top: 1px solid #EFEFEF;"> |
|||
|
|||
<view style="flex: 1;"></view> |
|||
<text style="font-size: 16px;color: #fff; background-color: #FF9900; height: 5vh;line-height: 5vh; |
|||
padding: 0px 20px;border-radius: 20px;" @click="continuePy">继续付款</text> |
|||
|
|||
</view --> |
|||
|
|||
|
|||
|
|||
</view> |
|||
|
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
page: { |
|||
sid: "", |
|||
countdown: "", |
|||
nowDate: "" |
|||
}, |
|||
data: {} |
|||
} |
|||
}, |
|||
onLoad(options) { |
|||
|
|||
this.page.sid = options.sid |
|||
|
|||
}, |
|||
onShow() { |
|||
this.request() |
|||
}, |
|||
methods: { |
|||
itemClick(goodsSid) { |
|||
uni.navigateTo({ |
|||
url: '/pages/good/goodsDetail?sid=' + goodsSid |
|||
}) |
|||
}, |
|||
// 获取数据 |
|||
request() { |
|||
|
|||
let _this = this |
|||
|
|||
_this.$api.orderDetails(_this.page.sid).then((resp) => { |
|||
_this.data = resp |
|||
_this.page.nowDate = resp.nowDate |
|||
|
|||
if (_this.data.payStatus == 2) |
|||
_this.countTime() // 倒计时 |
|||
|
|||
_this.$nextTick(() => { |
|||
_this.$refs.pageView.setLoadState(2) |
|||
}) |
|||
|
|||
}).catch(e => { |
|||
_this.$nextTick(() => { |
|||
_this.$refs.pageView.setLoadState(1) |
|||
}) |
|||
}) |
|||
}, |
|||
continuePy() { |
|||
|
|||
var list = this.page.countdown.split(":") |
|||
var mm = list[0] // 获取分钟数 |
|||
var ss = list[1] // 获取秒数 |
|||
|
|||
var totalSeconds = Number(mm) * 60 + Number(ss) |
|||
|
|||
this.data.result.remainder = totalSeconds |
|||
// console.log("==============",this.data.result.remainder); |
|||
this.$pay(this.data.result) |
|||
}, |
|||
countTime() { |
|||
var that = this; |
|||
// var date = new Date(); |
|||
// var now = date.getTime(); |
|||
// var now = that.data.nowDate; |
|||
// console.log("now", that.page.nowDate); |
|||
var endDate = new Date(that.data.endTime); //设置截止时间 |
|||
var end = endDate.getTime(); |
|||
// console.log("end", end); |
|||
var leftTime = end - that.page.nowDate; //时间差 |
|||
var d, h, m, s, ms; |
|||
// console.log("leftTime", leftTime); |
|||
|
|||
if (leftTime >= 0) { |
|||
d = Math.floor(leftTime / 1000 / 60 / 60 / 24); |
|||
h = Math.floor(leftTime / 1000 / 60 / 60 % 24); |
|||
m = Math.floor(leftTime / 1000 / 60 % 60); |
|||
s = Math.floor(leftTime / 1000 % 60); |
|||
ms = Math.floor(leftTime % 1000); |
|||
ms = ms < 100 ? "0" + ms : ms |
|||
s = s < 10 ? "0" + s : s |
|||
m = m < 10 ? "0" + m : m |
|||
h = h < 10 ? "0" + h : h |
|||
that.page.countdown = m + ":" + s |
|||
//递归每秒调用countTime方法，显示动态时间效果 |
|||
that.page.nowDate = that.page.nowDate + 1000 |
|||
setTimeout(that.countTime, 1000); |
|||
} else { |
|||
that.page.countdown = '00:00:00' |
|||
that.data.payStatus = '3' |
|||
that.changePayState() |
|||
} |
|||
}, |
|||
changePayState() { |
|||
let _this = this |
|||
_this.$api.changePayState(_this.page.sid).then((resp) => { |
|||
|
|||
}).catch(e => { |
|||
|
|||
}) |
|||
}, |
|||
makeInvoice(sid) { |
|||
// let _this = this |
|||
|
|||
// var params = { |
|||
// outTradeNo: _this.data.outTradeNo, |
|||
// totalTee: _this.data.totalTee, |
|||
// // phone: getApp().globalData.mobile, |
|||
// } |
|||
|
|||
// console.log("makeInvoice", params); |
|||
|
|||
// _this.$api.wxElectronicInvoice(params).then((resp) => { |
|||
|
|||
// console.log("wxElectronicInvoice", resp); |
|||
|
|||
// wx.navigateToMiniProgram({ |
|||
// appId: resp.appid, |
|||
// path: resp.auth_url, |
|||
// success(res) { |
|||
// console.log('navigateToMiniProgram success:', res) |
|||
// }, |
|||
// fail(error) { |
|||
// console.log('navigateToMiniProgram fail:', error) |
|||
// }, |
|||
// complete(res) { |
|||
// console.log('navigateToMiniProgram complete:', res) |
|||
// } |
|||
// }) |
|||
|
|||
// }).catch(e => { |
|||
|
|||
// }) |
|||
|
|||
|
|||
uni.navigateTo({ |
|||
url: "/pages/me/makeInvoice?sid=" + sid |
|||
}) |
|||
|
|||
}, |
|||
|
|||
refund() { |
|||
|
|||
uni.navigateTo({ |
|||
url: "/pages/me/applyRefund?sid=" + this.page.sid |
|||
}) |
|||
|
|||
// uni.navigateTo({ |
|||
// url: "/pages/me/refundDetail?sid=" + this.page.sid |
|||
// }) |
|||
} |
|||
|
|||
} |
|||
|
|||
|
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
|
|||
</style> |
|||
@ -0,0 +1,161 @@ |
|||
<template> |
|||
<view style="display: flex;flex-direction: column;height: 100vh;background: #f7f7f7; |
|||
padding: 10px;"> |
|||
<!-- 有列表的时候用 :auto='false' 需要你在onload等调用reload方法 --> |
|||
<view style="display: flex;flex-direction: row;align-items: center; |
|||
padding-left: 10px;padding-bottom: 10px; overflow-x: auto; "> |
|||
|
|||
<text class="label" :class="{'label2':selectIndex===0}" @click="tab(0)">全部</text> |
|||
<text class="label" :class="{'label2':selectIndex===1}" @click="tab(1)">待付款</text> |
|||
<text class="label" :class="{'label2':selectIndex===2}" @click="tab(2)">已付款</text> |
|||
<text class="label" :class="{'label2':selectIndex===3}" @click="tab(3)">已失效</text> |
|||
<text class="label" :class="{'label2':selectIndex===4}" @click="tab(4)">售后/退款</text> |
|||
</view> |
|||
<z-paging ref="paging" v-model="data" @query="queryList" :pagingStyle='styleObject' :use-page-scroll='false'> |
|||
|
|||
<view v-for="(item,index) in data" style=" display: flex;flex-direction: column;margin-left: 10px;margin-right: 10px;background: #fff;margin-top: 10px; |
|||
border-radius: 10px;padding: 15px;box-sizing: border-box;" @click="itemClick(item)"> |
|||
|
|||
<view style="display: flex;flex-direction: row;justify-content: space-between;"> |
|||
|
|||
<text style="font-size: 16px;color: #333;">{{item.createTime}}</text> |
|||
<view style="display: flex;flex-direction: row;align-items: center;justify-content: center;"> |
|||
<text v-if="item.payStatus=='2'" style="font-size: 14px;color: #FF9900;">待付款</text> |
|||
<text v-if="item.payStatus=='4'" style="font-size: 14px;color: #666;">已完成</text> |
|||
<text v-if="item.payStatus=='3'" style="font-size: 14px;color: #999;">已失效</text> |
|||
<text v-if="item.payStatus=='5'" style="font-size: 14px;color: #999;">退款中</text> |
|||
<text v-if="item.payStatus=='6'" style="font-size: 14px;color: #999;">已退款</text> |
|||
<text v-if="item.payStatus=='7'" style="font-size: 14px;color: #999;">退款失败</text> |
|||
<image src="../../static/more.png" style="width: 15px;height: 15px;"></image> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<scroll-view scroll-x="true" style=" white-space: nowrap; display: flex;margin-top: 15px;" |
|||
bindscrolltoupper="upper" bindscrolltolower="lower" bindscroll="scroll"> |
|||
|
|||
<view v-for="(children,pos) in item.picUrls" style="display: inline-block;"> |
|||
|
|||
<image :src="children" style="margin-right: 10px; width: 70px;height: 70px;border-radius: 10px;" |
|||
mode="scaleToFill"></image> |
|||
|
|||
</view> |
|||
|
|||
</scroll-view> |
|||
|
|||
<view |
|||
style="display: flex;flex-direction: row;align-items: center;justify-content: center;margin-top: 15px;"> |
|||
|
|||
<view style="flex: 1;"></view> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;justify-content: center;"> |
|||
<text style="font-size: 14px;color: #333;margin-right: 20px;">共{{item.count}}种商品</text> |
|||
<text style="font-size: 12px;color: #333;margin-right: 5px;">实付</text> |
|||
<text |
|||
style="font-size: 18px;color: #333;font-weight: 6000;font-family: sans-serif;">￥{{item.totalTee}}</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</z-paging> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
selectIndex: 0, |
|||
orderState: "", |
|||
styleObject: { |
|||
'padding-bottom': '10px', |
|||
'background': '#f7f7f7', |
|||
'margin-top': '40px' |
|||
}, |
|||
data: [] |
|||
} |
|||
}, |
|||
methods: { |
|||
tab(index) { |
|||
this.selectIndex = index |
|||
if (index == 0) |
|||
this.orderState = "" |
|||
if (index == 1) |
|||
this.orderState = "2" |
|||
if (index == 2) |
|||
this.orderState = "4" |
|||
if (index == 3) |
|||
this.orderState = "3" |
|||
if (index == 4) |
|||
this.orderState = "99" |
|||
|
|||
this.$refs.paging.reload() |
|||
}, |
|||
// 分页的请求 |
|||
queryList(pageNo, pageSize) { |
|||
let _this = this |
|||
|
|||
_this.$api.ordersList({ |
|||
"current": pageNo, |
|||
"size": pageSize, |
|||
"params": { |
|||
"customerSid": getApp().globalData.sid, |
|||
"state": _this.orderState, //2 待付款 3已取消 4支付成功 5已退款 |
|||
|
|||
} |
|||
}).then((resp) => { |
|||
// 添加数据源 |
|||
_this.$refs.paging.complete(resp.records) |
|||
}).catch(e => { |
|||
// 出错了，点击重试 |
|||
_this.$refs.paging.complete(false); |
|||
}) |
|||
}, |
|||
itemClick(item) { |
|||
|
|||
if (item.payStatus == '7') { |
|||
uni.navigateTo({ |
|||
url: "/pages/me/applyRefund?sid=" + item.sid |
|||
}) |
|||
} else if (item.payStatus == '5' || item.payStatus == '6') { |
|||
uni.navigateTo({ |
|||
url: "/pages/me/refundDetail?sid=" + item.sid |
|||
}) |
|||
|
|||
} else { |
|||
uni.navigateTo({ |
|||
url: "/pages/records/orderDetail?sid=" + item.sid |
|||
}) |
|||
|
|||
} |
|||
|
|||
} |
|||
|
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style scoped> |
|||
.label { |
|||
color: #666; |
|||
font-size: 14px; |
|||
margin-right: 30px; |
|||
flex-shrink: 0; |
|||
} |
|||
|
|||
.label2 { |
|||
color: #FF9900; |
|||
font-size: 14px; |
|||
border-bottom: 1px #FF9900 solid; |
|||
padding-bottom: 5px; |
|||
margin-right: 30px; |
|||
flex-shrink: 0; |
|||
} |
|||
|
|||
::-webkit-scrollbar { |
|||
/* 隐藏滚动条 */ |
|||
display: none; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,60 @@ |
|||
<template> |
|||
<view style="display: flex;flex-direction: column; background: #F9F9F8;"> |
|||
|
|||
<NavBar ref="nav" navTitle=" " :showIcon="true"> |
|||
</NavBar> |
|||
|
|||
<image src="https://supervise.yxtsoft.com/lpk/image/recommend_icon.png" style="width: 100%;height: 60vw;"> |
|||
</image> |
|||
|
|||
<view style="margin-bottom: 50px; min-height: 70vh; background: #fff; margin-left: 15px;margin-right: 15px;margin-top: -20vw; |
|||
border-radius: 15px;"> |
|||
<!-- 滚动视图 --> |
|||
<scroll-view scroll-y="true" style="padding: 10px; width: 100%; height: 100%;" bindscrolltoupper="upper" bindscrolltolower="lower" |
|||
bindscroll="scroll"> |
|||
|
|||
</scroll-view> |
|||
</view> |
|||
|
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
styleObject: { |
|||
'padding-top': '10px', |
|||
'padding-bottom': '10px', |
|||
'border-radius': '15px', |
|||
'background': '#f2f2f2' |
|||
}, |
|||
} |
|||
}, |
|||
methods: { |
|||
// 分页的请求 |
|||
queryList(pageNo, pageSize) { |
|||
let _this = this |
|||
_this.$api.myOrderListByUserSid({ |
|||
"current": pageNo, |
|||
"size": pageSize, |
|||
"params": { |
|||
"customerSid": getApp().globalData.sid, |
|||
"state": '1', //0 未提货 1 已提货 |
|||
|
|||
} |
|||
}).then((resp) => { |
|||
// 添加数据源 |
|||
this.$refs.paging.complete(resp.records) |
|||
}).catch(e => { |
|||
// 出错了，点击重试 |
|||
_this.$refs.paging.complete(false); |
|||
}) |
|||
}, |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style> |
|||
|
|||
</style> |
|||
@ -0,0 +1,102 @@ |
|||
<template> |
|||
<view |
|||
style="display: flex;flex-direction: column;height: 100vh;background: -webkit-linear-gradient(left,#FEA65F,#FB9440);"> |
|||
<!-- 有列表的时候用 :auto='false' 需要你在onload等调用reload方法 --> |
|||
<z-paging ref="paging" v-model="data" @query="queryList" :pagingStyle='styleObject' :auto='true'> |
|||
|
|||
<view v-for="(item,index) in data" style=" display: flex;flex-direction: column;margin-left: 10px;margin-right: 10px;background: #fff;margin-top: 10px; |
|||
border-radius: 10px;padding: 10px 20px;"> |
|||
|
|||
<view class="item"> |
|||
<text class="item_left">预约单号：</text> |
|||
<text class="item_rifht">{{item.reserveCode}}</text> |
|||
</view> |
|||
<view class="item"> |
|||
<text class="item_left">菜窖类型：</text> |
|||
<text class="item_rifht">{{item.affiliationValue}}</text> |
|||
</view> |
|||
<view class="item"> |
|||
<text class="item_left">预约日期：</text> |
|||
<text class="item_rifht">{{item.reserveDate}}</text> |
|||
</view> |
|||
<view class="item"> |
|||
<text class="item_left">提货门店：</text> |
|||
<text class="item_rifht">{{item.storeName}}</text> |
|||
</view> |
|||
<view class="item"> |
|||
<text class="item_left">门店地址：</text> |
|||
<text class="item_rifht">{{item.address}}</text> |
|||
</view> |
|||
<view class="item"> |
|||
<text class="item_left">提 货 人：</text> |
|||
<text class="item_rifht">{{item.userName}}</text> |
|||
</view> |
|||
<view class="item"> |
|||
<text class="item_left">联系电话：</text> |
|||
<text class="item_rifht">{{item.userPhone}}</text> |
|||
</view> |
|||
<view class="item"> |
|||
<text class="item_left">状    态：</text> |
|||
<text class="item_rifht">{{item.stateValue}}</text> |
|||
</view> |
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<text style="color: #999; font-size: 12px;">- {{item.goodss}}</text> |
|||
</view> |
|||
</view> |
|||
|
|||
</z-paging> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
styleObject: { |
|||
'padding-top': '10px', |
|||
'padding-bottom': '10px', |
|||
'border-radius': '15px', |
|||
'background': '#f2f2f2' |
|||
}, |
|||
data: [] |
|||
} |
|||
}, |
|||
methods: { |
|||
// 分页的请求 |
|||
queryList(pageNo, pageSize) { |
|||
let _this = this |
|||
_this.$api.myOrderListByUserSid({ |
|||
"current": pageNo, |
|||
"size": pageSize, |
|||
"params": { |
|||
"customerSid": getApp().globalData.sid, |
|||
"state": '0', //0 未提货 1 已提货 |
|||
|
|||
} |
|||
}).then((resp) => { |
|||
// 添加数据源 |
|||
this.$refs.paging.complete(resp.records) |
|||
}).catch(e => { |
|||
// 出错了，点击重试 |
|||
_this.$refs.paging.complete(false); |
|||
}) |
|||
}, |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style scoped> |
|||
.item { |
|||
margin-top: 5px; |
|||
} |
|||
|
|||
.item_left { |
|||
font-size: 14px; |
|||
color: #333; |
|||
} |
|||
|
|||
.item_rifht { |
|||
font-size: 13px; |
|||
color: #666; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,102 @@ |
|||
<template> |
|||
<view |
|||
style="display: flex;flex-direction: column;height: 100vh;background: -webkit-linear-gradient(left,#FEA65F,#FB9440);"> |
|||
<!-- 有列表的时候用 :auto='false' 需要你在onload等调用reload方法 --> |
|||
<z-paging ref="paging" v-model="data" @query="queryList" :pagingStyle='styleObject' :auto='true'> |
|||
|
|||
<view v-for="(item,index) in data" style=" display: flex;flex-direction: column;margin-left: 10px;margin-right: 10px;background: #fff;margin-top: 10px; |
|||
border-radius: 10px;padding: 10px 20px;"> |
|||
|
|||
<view class="item"> |
|||
<text class="item_left">预约单号：</text> |
|||
<text class="item_rifht">{{item.reserveCode}}</text> |
|||
</view> |
|||
<view class="item"> |
|||
<text class="item_left">菜窖类型：</text> |
|||
<text class="item_rifht">{{item.affiliationValue}}</text> |
|||
</view> |
|||
<view class="item"> |
|||
<text class="item_left">预约日期：</text> |
|||
<text class="item_rifht">{{item.reserveDate}}</text> |
|||
</view> |
|||
<view class="item"> |
|||
<text class="item_left">提货门店：</text> |
|||
<text class="item_rifht">{{item.storeName}}</text> |
|||
</view> |
|||
<view class="item"> |
|||
<text class="item_left">门店地址：</text> |
|||
<text class="item_rifht">{{item.address}}</text> |
|||
</view> |
|||
<view class="item"> |
|||
<text class="item_left">提 货 人：</text> |
|||
<text class="item_rifht">{{item.userName}}</text> |
|||
</view> |
|||
<view class="item"> |
|||
<text class="item_left">联系电话：</text> |
|||
<text class="item_rifht">{{item.userPhone}}</text> |
|||
</view> |
|||
<view class="item"> |
|||
<text class="item_left">状    态：</text> |
|||
<text class="item_rifht">{{item.stateValue}}</text> |
|||
</view> |
|||
<view style=" display: flex;flex-direction: row;align-items: center;margin-top: 5px;"> |
|||
<text style="color: #999; font-size: 12px;">- {{item.goodss}}</text> |
|||
</view> |
|||
</view> |
|||
|
|||
</z-paging> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
styleObject: { |
|||
'padding-top': '10px', |
|||
'padding-bottom': '10px', |
|||
'border-radius': '15px', |
|||
'background': '#f2f2f2' |
|||
}, |
|||
data: [] |
|||
} |
|||
}, |
|||
methods: { |
|||
// 分页的请求 |
|||
queryList(pageNo, pageSize) { |
|||
let _this = this |
|||
_this.$api.myOrderListByUserSid({ |
|||
"current": pageNo, |
|||
"size": pageSize, |
|||
"params": { |
|||
"customerSid": getApp().globalData.sid, |
|||
"state": '1', //0 未提货 1 已提货 |
|||
|
|||
} |
|||
}).then((resp) => { |
|||
// 添加数据源 |
|||
this.$refs.paging.complete(resp.records) |
|||
}).catch(e => { |
|||
// 出错了，点击重试 |
|||
_this.$refs.paging.complete(false); |
|||
}) |
|||
}, |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style scoped> |
|||
.item { |
|||
margin-top: 5px; |
|||
} |
|||
|
|||
.item_left { |
|||
font-size: 14px; |
|||
color: #333; |
|||
} |
|||
|
|||
.item_rifht { |
|||
font-size: 13px; |
|||
color: #666; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,330 @@ |
|||
<template> |
|||
<view |
|||
style="display: flex;flex-direction: column;height: 100vh;background: -webkit-linear-gradient(left,#FEA65F,#FB9440);" |
|||
class="app"> |
|||
<!-- 有列表的时候用 :auto='false' 需要你在onload等调用reload方法 --> |
|||
<z-paging ref="paging" v-model="data" @query="queryList" :pagingStyle='styleObject' :auto='true'> |
|||
|
|||
<view v-for="(item,index) in data" style=" display: flex;flex-direction: column;margin-left: 10px;margin-right: 10px;background: #FBE9CB;margin-top: 10px; |
|||
padding: 12px 0px; |
|||
border-radius: 15px;"> |
|||
|
|||
<view class="item"> |
|||
<!-- <view class="left-circle"></view> |
|||
<view class="right-circle"></view> |
|||
<view class="item-line"></view> --> |
|||
|
|||
<view class="item-top" style="margin-left: 16px;margin-right: 16px;"> |
|||
|
|||
<text class="item-top-code">预约单号：{{item.newCode}}</text> |
|||
<text class="item-top-state">{{item.stateValue}}</text> |
|||
</view> |
|||
|
|||
<view |
|||
style="display: flex;flex-direction: row;align-items: center;margin-left: 16px;margin-right: 16px;margin-top: 15px;"> |
|||
<text |
|||
style="font-size: 16px;margin-right: 8px;flex: 1;margin-right: 15px;">{{item.storeName}}</text> |
|||
|
|||
<!-- <view style="display: flex;flex-direction: row;align-items: center;" |
|||
@click="makePhoneCall(item.linkPhone)"> |
|||
<image src="../../static/phone-2.png" style="width: 20px;height: 20px;margin-right: 5px;"> |
|||
</image> |
|||
<text>咨询电话</text> |
|||
</view> --> |
|||
|
|||
</view> |
|||
|
|||
|
|||
<view |
|||
style="display: flex;flex-direction: row;align-items: center;margin-left: 16px;margin-right: 16px;margin-top: 6px;"> |
|||
<image src="../../static/dingwei.png" style="width: 20px;height: 20px;margin-right: 5px;" |
|||
mode="aspectFit"> |
|||
</image> |
|||
<text style="font-size: 12px;color: #666;">{{item.address}}</text> |
|||
</view> |
|||
|
|||
<view class="item-bom" style="margin-left: 16px;margin-right: 16px;margin-top: 10px;"> |
|||
|
|||
<view class="item-bom-left"> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;"> |
|||
<text style="font-size: 12px;color: #666; margin-right: 5px;">提货日期：</text> |
|||
<text style="font-size: 12px;color: #FD6D2B;">{{item.reserveDate}}</text> |
|||
</view> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 16px;"> |
|||
<text style="font-size: 12px;color: #666; margin-right: 5px;">提货人：</text> |
|||
<text style="font-size: 12px;color: #333; margin-right: 5px;">{{item.userName}}</text> |
|||
<text style="font-size: 12px;color: #333; ">{{item.userPhone}}</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view class="item-bom_right"> |
|||
|
|||
<image src="https://supervise.yxtsoft.com/lpk/image/daiticai.png" |
|||
style="width: 80px; height: 80px;z-index: 100;border-radius: 20px;"> |
|||
</image> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;width: 100%;margin-top: 15px;"> |
|||
|
|||
<view |
|||
style="display: flex;flex-direction: column;justify-content: center;align-items: center;flex: 1;" |
|||
@click="cancelReservation(item)"> |
|||
<image src="../../static/close3.png" style="width: 32px;height: 32px;"></image> |
|||
<text style="font-size: 12px;color: #666;margin-top: 5px;">取消预约</text> |
|||
</view> |
|||
|
|||
<view style="background: #E0DBD0; height: 30px;width: 1px;"></view> |
|||
|
|||
<view |
|||
style="display: flex;flex-direction: column;justify-content: center;align-items: center;flex: 1;" |
|||
@click="makePhoneCall(item.linkPhone)"> |
|||
<image src="../../static/phone-3.png" style="width: 32px;height: 32px;"></image> |
|||
<text style="font-size: 12px;color: #666;margin-top: 5px;">电话咨询</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
|
|||
<view style=" |
|||
height: 30px;margin-top: 5px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/reservationRecords_icon1.png" |
|||
style="width: 100%;height: 100%;" mode="scaleToFill"></image> |
|||
|
|||
</view> |
|||
|
|||
|
|||
<view class="item_list" v-if="item.showLsit" style="margin-left: 16px;margin-right: 16px;"> |
|||
|
|||
<view v-for="(child,index) in item.goodsVo" |
|||
style="display: flex;flex-direction: row;width: 100%;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;justify-content: space-between;width: 100%; |
|||
padding-left: 10px;padding-right: 10px;margin-bottom: 8px;"> |
|||
<text style="font-size: 12px;color: #666;">{{child.goodName}}</text> |
|||
<text style="font-size: 12px;color: #666;">{{child.num}}{{child.unitName}}</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view class="item_btn" v-if="!item.showLsit" @click="showList(item)"> |
|||
<text style="font-size: 12px;color: #999; margin-right: 5px;">展开</text> |
|||
<image src="../../static/zhankai.png" style="width: 15px;height: 15px;"></image> |
|||
</view> |
|||
|
|||
<view class="item_btn" v-if="item.showLsit" @click="showList(item)"> |
|||
<text style="font-size: 12px;color: #999; margin-right: 5px;">收起</text> |
|||
<image src="../../static/shouqi.png" style="width: 15px;height: 15px;"></image> |
|||
</view> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</z-paging> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
styleObject: { |
|||
'padding-top': '10px', |
|||
'padding-bottom': '10px', |
|||
'border-radius': '15px', |
|||
'background': '#F9F9F9' |
|||
}, |
|||
data: [] |
|||
} |
|||
}, |
|||
|
|||
onLoad() { |
|||
// this.$refs.paging.complete(_this.data) |
|||
// this.$refs.paging.complete(true) |
|||
}, |
|||
|
|||
methods: { |
|||
cancelReservation(item) { |
|||
var _this = this |
|||
console.log("item", item); |
|||
if (item.cancel) { |
|||
// 可取消 |
|||
uni.showModal({ |
|||
title: '', |
|||
content: '确认要取消预约吗？', |
|||
cancelText: "取消", |
|||
confirmText: "确定", |
|||
confirmColor: "#FF9900", |
|||
success(res) { |
|||
if (res.confirm) { |
|||
// console.log('用户点击确定') |
|||
|
|||
_this.$api.cancelReservation(item.reserveCode).then((resp) => { |
|||
|
|||
const index = _this.data.findIndex((info) => info.sid === item.sid) |
|||
console.log("index》》》》", index) |
|||
_this.data.splice(index, 1) |
|||
|
|||
}).catch(e => { |
|||
|
|||
}) |
|||
|
|||
} else if (res.cancel) { |
|||
// console.log('用户点击取消') |
|||
} |
|||
} |
|||
}) |
|||
|
|||
} else { |
|||
// 超出时限 不可取消 |
|||
this.shortToast('已超出可取消预约提货时间。') |
|||
return |
|||
} |
|||
|
|||
}, |
|||
|
|||
makePhoneCall(phone) { |
|||
if (this.stringIsNotEmpty(phone)) |
|||
wx.makePhoneCall({ |
|||
|
|||
phoneNumber: phone, |
|||
|
|||
}) |
|||
}, |
|||
showList(item) { |
|||
item.showLsit = !item.showLsit |
|||
}, |
|||
// 分页的请求 |
|||
queryList(pageNo, pageSize) { |
|||
let _this = this |
|||
_this.$api.myOrderListByUserSid({ |
|||
"current": pageNo, |
|||
"size": pageSize, |
|||
"params": { |
|||
"customerSid": getApp().globalData.sid, |
|||
"state": '0', //0 未提货 1 已提货 |
|||
|
|||
} |
|||
}).then((resp) => { |
|||
// 添加数据源 |
|||
this.$refs.paging.complete(resp.records) |
|||
}).catch(e => { |
|||
// 出错了，点击重试 |
|||
_this.$refs.paging.complete(false); |
|||
}) |
|||
}, |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
.app { |
|||
--bgcolor: #f2f2f2; |
|||
|
|||
} |
|||
|
|||
.item { |
|||
position: relative; |
|||
box-sizing: border-box; |
|||
display: flex; |
|||
box-sizing: border-box; |
|||
flex-direction: column; |
|||
// /*最重要的部分如下：*/ |
|||
// background-image: radial-gradient(circle at left 50%, #f2f2f2, #f2f2f2 12px, transparent 12px), |
|||
// radial-gradient(circle at right 50%, #f2f2f2, #f2f2f2 12px, transparent 12px); |
|||
|
|||
.item-line { |
|||
width: 96%; |
|||
display: flex; |
|||
flex-direction: row; |
|||
box-sizing: border-box; |
|||
margin-left: 7px; |
|||
margin-right: 7px; |
|||
border-bottom: 2rpx dashed #f0f; |
|||
position: absolute; |
|||
height: 20rpx; |
|||
top: 150px; |
|||
} |
|||
|
|||
.left-circle { |
|||
background-color: var(--bgcolor); |
|||
position: absolute; |
|||
width: 50rpx; |
|||
height: 50rpx; |
|||
border-radius: 50%; |
|||
top: 150px; |
|||
left: -50px; |
|||
} |
|||
|
|||
|
|||
.right-circle { |
|||
background-color: var(--bgcolor); |
|||
position: absolute; |
|||
width: 50rpx; |
|||
height: 50rpx; |
|||
border-radius: 50%; |
|||
top: 150px; |
|||
right: -50px; |
|||
} |
|||
|
|||
.item-top { |
|||
position: relative; //添加的定位 |
|||
z-index: 100; |
|||
display: flex; |
|||
flex-direction: row; |
|||
align-items: center; |
|||
justify-content: space-between; |
|||
|
|||
.item-top-code { |
|||
font-size: 14px; |
|||
color: #333; |
|||
} |
|||
|
|||
.item-top-state { |
|||
font-size: 14px; |
|||
color: #FF9900; |
|||
} |
|||
} |
|||
|
|||
.item-bom { |
|||
position: relative; //添加的定位 |
|||
z-index: 100; |
|||
display: flex; |
|||
flex-direction: row; |
|||
align-items: center; |
|||
justify-content: space-between; |
|||
|
|||
.item-bom-left { |
|||
display: flex; |
|||
flex-direction: column; |
|||
} |
|||
|
|||
.item-bom_right { |
|||
|
|||
border-radius: 20px; |
|||
} |
|||
} |
|||
|
|||
.item_list { |
|||
position: relative; //添加的定位 |
|||
z-index: 100; |
|||
margin-top: 5px; |
|||
} |
|||
|
|||
.item_btn { |
|||
z-index: 100; |
|||
display: flex; |
|||
flex-direction: row; |
|||
align-items: center; |
|||
width: 100%; |
|||
justify-content: center; |
|||
} |
|||
} |
|||
</style> |
|||
@ -0,0 +1,280 @@ |
|||
<template> |
|||
<view |
|||
style="display: flex;flex-direction: column;height: 100vh;background: -webkit-linear-gradient(left,#FEA65F,#FB9440);" |
|||
class="app"> |
|||
<!-- 有列表的时候用 :auto='false' 需要你在onload等调用reload方法 --> |
|||
<z-paging ref="paging" v-model="data" @query="queryList" :pagingStyle='styleObject' :auto='true'> |
|||
|
|||
<view v-for="(item,index) in data" style=" display: flex;flex-direction: column;margin-left: 10px;margin-right: 10px;background: #fff;margin-top: 10px; |
|||
padding: 10px 0px; |
|||
border-radius: 15px;"> |
|||
|
|||
<view class="item"> |
|||
<!-- <view class="left-circle"></view> |
|||
<view class="right-circle"></view> |
|||
<view class="item-line"></view> --> |
|||
|
|||
<view class="item-top" style="margin-left: 16px;margin-right: 16px;"> |
|||
|
|||
<text class="item-top-code">预约单号：{{item.newCode}}</text> |
|||
<text class="item-top-state">{{item.stateValue}}</text> |
|||
</view> |
|||
<view |
|||
style="display: flex;flex-direction: row;align-items: center;margin-left: 16px;margin-right: 16px;margin-top: 15px;"> |
|||
<text |
|||
style="font-size: 16px;margin-right: 8px;color: #bbb;flex: 1;margin-right: 15px;">{{item.storeName}}</text> |
|||
<view style="display: flex;flex-direction: row;align-items: center;" |
|||
@click="makePhoneCall(item.linkPhone)"> |
|||
<image src="../../static/phone-2.png" style="width: 20px;height: 20px;margin-right: 5px;"> |
|||
</image> |
|||
<text style="">咨询电话</text> |
|||
</view> |
|||
|
|||
</view> |
|||
<view |
|||
style="display: flex;flex-direction: row;align-items: center;margin-left: 16px;margin-right: 16px;margin-top: 6px;"> |
|||
<image src="../../static/dingwei.png" style="width: 20px;height: 20px;margin-right: 5px;" |
|||
mode="aspectFit"> |
|||
</image> |
|||
<text style="font-size: 12px;color: #BBBBBB;">{{item.address}}</text> |
|||
</view> |
|||
|
|||
|
|||
<view class="item-bom" style="margin-left: 16px;margin-right: 16px;margin-top: 10px;"> |
|||
|
|||
<view class="item-bom-left"> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 8px;"> |
|||
<image src="../../static/time.png" style="width: 15px;height: 15px;margin-right: 5px;"> |
|||
</image> |
|||
<text style="font-size: 12px;color: #BBBBBB; margin-right: 5px;">提货日期：</text> |
|||
<text style="font-size: 12px;color: #BBBBBB;">{{item.reserveDate}}</text> |
|||
</view> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 8px;"> |
|||
<text style="font-size: 12px;color: #BBBBBB; margin-right: 5px;">提货人：</text> |
|||
<text |
|||
style="font-size: 12px;color: #BBBBBB; margin-right: 5px;">{{item.userName}}</text> |
|||
<text style="font-size: 12px;color: #BBBBBB; ">{{item.userPhone}}</text> |
|||
</view> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;margin-top: 8px;"> |
|||
<text style="font-size: 12px;color: #BBBBBB; margin-right: 5px;">预约日期：</text> |
|||
<text style="font-size: 12px;color: #BBBBBB;">{{item.reserveDate}}</text> |
|||
</view> |
|||
|
|||
|
|||
</view> |
|||
|
|||
<view class="item-bom_right" style="box-sizing: border-box;"> |
|||
|
|||
<text style="opacity: 0.7;font-size: 18px;font-weight: 800;font-family: sans-serif;z-index: 101; |
|||
width: 104px; height: 104px;line-height: 104px; text-align: center; background: #666; |
|||
position: absolute;border-radius: 20px;color: #fff;">已提货</text> |
|||
|
|||
<image src="https://supervise.yxtsoft.com/lpk/image/daiticai.png" |
|||
style="width: 104px; height: 104px;z-index: 100;border-radius: 20px;"> |
|||
</image> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view style=" |
|||
height: 30px;margin-top: 5px;"> |
|||
<image src="https://supervise.yxtsoft.com/lpk/image/reservationRecords_icon2.png" |
|||
style="width: 100%;height: 100%;" mode="scaleToFill"></image> |
|||
|
|||
</view> |
|||
|
|||
|
|||
|
|||
<view class="item_list" v-if="item.showLsit" style="margin-left: 16px;margin-right: 16px;"> |
|||
|
|||
<view v-for="(child,index) in item.goodsVo" |
|||
style="display: flex;flex-direction: row;width: 100%;"> |
|||
|
|||
<view style="display: flex;flex-direction: row;align-items: center;justify-content: space-between;width: 100%; |
|||
padding-left: 10px;padding-right: 10px;margin-bottom: 8px;"> |
|||
<text style="font-size: 12px;color: #BBBBBB;">{{child.goodName}}</text> |
|||
<text style="font-size: 12px;color: #BBBBBB;">{{child.num}}{{child.unitName}}</text> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
<view class="item_btn" v-if="!item.showLsit" @click="showList(item)"> |
|||
<text style="font-size: 12px;color: #999; margin-right: 5px;">展开</text> |
|||
<image src="../../static/zhankai.png" style="width: 15px;height: 15px;"></image> |
|||
</view> |
|||
|
|||
<view class="item_btn" v-if="item.showLsit" @click="showList(item)"> |
|||
<text style="font-size: 12px;color: #999; margin-right: 5px;">收起</text> |
|||
<image src="../../static/shouqi.png" style="width: 15px;height: 15px;"></image> |
|||
</view> |
|||
</view> |
|||
|
|||
</view> |
|||
|
|||
</z-paging> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
styleObject: { |
|||
'padding-top': '10px', |
|||
'padding-bottom': '10px', |
|||
'border-radius': '15px', |
|||
'background': '#F9F9F9' |
|||
}, |
|||
data: [] |
|||
} |
|||
}, |
|||
|
|||
onLoad() { |
|||
// this.$refs.paging.complete(_this.data) |
|||
// this.$refs.paging.complete(true) |
|||
}, |
|||
|
|||
methods: { |
|||
makePhoneCall(phone) { |
|||
|
|||
if (this.stringIsNotEmpty(phone)) |
|||
|
|||
wx.makePhoneCall({ |
|||
|
|||
phoneNumber: phone, |
|||
|
|||
}) |
|||
}, |
|||
showList(item) { |
|||
item.showLsit = !item.showLsit |
|||
}, |
|||
// 分页的请求 |
|||
queryList(pageNo, pageSize) { |
|||
let _this = this |
|||
_this.$api.myOrderListByUserSid({ |
|||
"current": pageNo, |
|||
"size": pageSize, |
|||
"params": { |
|||
"customerSid": getApp().globalData.sid, |
|||
"state": '1', //0 未提货 1 已提货 |
|||
|
|||
} |
|||
}).then((resp) => { |
|||
// 添加数据源 |
|||
this.$refs.paging.complete(resp.records) |
|||
}).catch(e => { |
|||
// 出错了，点击重试 |
|||
_this.$refs.paging.complete(false); |
|||
}) |
|||
}, |
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style lang="scss" scoped> |
|||
.app { |
|||
--bgcolor: #f2f2f2; |
|||
|
|||
} |
|||
|
|||
.item { |
|||
position: relative; |
|||
box-sizing: border-box; |
|||
display: flex; |
|||
box-sizing: border-box; |
|||
flex-direction: column; |
|||
// /*最重要的部分如下：*/ |
|||
// background-image: radial-gradient(circle at left 50%, #f2f2f2, #f2f2f2 12px, transparent 12px), |
|||
// radial-gradient(circle at right 50%, #f2f2f2, #f2f2f2 12px, transparent 12px); |
|||
|
|||
.item-line { |
|||
width: 100%; |
|||
border-bottom: 10rpx dashed #EAEAEA; |
|||
position: absolute; |
|||
height: 20rpx; |
|||
top: 50%; |
|||
} |
|||
|
|||
.left-circle { |
|||
background-color: var(--bgcolor); |
|||
position: absolute; |
|||
width: 40rpx; |
|||
height: 40rpx; |
|||
border-radius: 50%; |
|||
top: 50%; |
|||
left: -50rpx; |
|||
} |
|||
|
|||
|
|||
.right-circle { |
|||
background-color: var(--bgcolor); |
|||
position: absolute; |
|||
width: 40rpx; |
|||
height: 40rpx; |
|||
border-radius: 50%; |
|||
top: 50%; |
|||
right: -50rpx; |
|||
} |
|||
|
|||
.item-top { |
|||
position: relative; //添加的定位 |
|||
z-index: 100; |
|||
display: flex; |
|||
flex-direction: row; |
|||
align-items: center; |
|||
justify-content: space-between; |
|||
// padding-bottom: 8px; |
|||
// border-bottom: 1px solid #eee; |
|||
|
|||
.item-top-code { |
|||
font-size: 14px; |
|||
color: #BBBBBB; |
|||
} |
|||
|
|||
.item-top-state { |
|||
font-size: 14px; |
|||
color: #999999; |
|||
} |
|||
} |
|||
|
|||
.item-bom { |
|||
position: relative; //添加的定位 |
|||
z-index: 100; |
|||
display: flex; |
|||
flex-direction: row; |
|||
align-items: center; |
|||
justify-content: space-between; |
|||
|
|||
.item-bom-left { |
|||
display: flex; |
|||
flex-direction: column; |
|||
} |
|||
|
|||
.item-bom_right { |
|||
// position: relative; |
|||
// border-radius: 20px; |
|||
} |
|||
} |
|||
|
|||
.item_list { |
|||
position: relative; //添加的定位 |
|||
z-index: 100; |
|||
margin-top: 5px; |
|||
} |
|||
|
|||
.item_btn { |
|||
z-index: 100; |
|||
display: flex; |
|||
flex-direction: row; |
|||
align-items: center; |
|||
width: 100%; |
|||
justify-content: center; |
|||
} |
|||
} |
|||
</style> |
|||
@ -0,0 +1,151 @@ |
|||
<template> |
|||
<view |
|||
style="display: flex;flex-direction: column;height: 100vh;background: -webkit-linear-gradient(left,#FEA65F,#FB9440);"> |
|||
<!-- 有列表的时候用 :auto='false' 需要你在onload等调用reload方法 --> |
|||
<z-paging ref="paging" v-model="data" @query="queryList" :pagingStyle='styleObject' :auto='true'> |
|||
|
|||
<view v-for="(item,index) in data" style=" display: flex;flex-direction: column;margin-left: 10px;margin-right: 10px;background: #fff;margin-top: 10px; |
|||
border-radius: 10px;padding: 10px 20px;"> |
|||
|
|||
<view class="item"> |
|||
<text class="item_left">转赠单号：</text> |
|||
<text class="item_rifht">{{item.newCode}}</text> |
|||
</view> |
|||
<view class="item"> |
|||
<text class="item_left">转赠时间：</text> |
|||
<text class="item_rifht">{{item.createTime}}</text> |
|||
</view> |
|||
<view class="item"> |
|||
<text class="item_left">转赠留言：</text> |
|||
<text class="item_rifht">{{item.remarks}}</text> |
|||
</view> |
|||
<view class="item"> |
|||
<text class="item_left">领取人员：</text> |
|||
<text class="item_rifht">{{item.lqNick}}</text> |
|||
</view> |
|||
<view |
|||
style="display: flex;flex-direction: row;margin-top: 5px;align-items: center;justify-content: space-between;width: 100%;"> |
|||
<text style="flex: 1;font-size: 12px; color: #A5A5A5; margin-right: 10px;">- {{item.goodss}}</text> |
|||
<button v-show="item.state=='1'" class='sharebtn' :data-info="item" open-type="share">待转赠</button> |
|||
<button v-show="item.state=='2'" class='sharebtn2'>转赠成功</button> |
|||
|
|||
</view> |
|||
</view> |
|||
|
|||
</z-paging> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
styleObject: { |
|||
'padding-top': '10px', |
|||
'padding-bottom': '10px', |
|||
'border-radius': '15px', |
|||
'background': '#f2f2f2' |
|||
}, |
|||
data: [] |
|||
} |
|||
}, |
|||
methods: { |
|||
// 分页的请求 |
|||
queryList(pageNo, pageSize) { |
|||
let _this = this |
|||
_this.$api.transferRecordsList({ |
|||
"current": pageNo, |
|||
"size": pageSize, |
|||
"params": { |
|||
"customerSid": getApp().globalData.sid, |
|||
"state": '1', //1 我转赠的 2 赠与我的 |
|||
|
|||
} |
|||
}).then((resp) => { |
|||
// 添加数据源 |
|||
this.$refs.paging.complete(resp.records) |
|||
}).catch(e => { |
|||
// 出错了，点击重试 |
|||
_this.$refs.paging.complete(false); |
|||
}) |
|||
}, |
|||
onShareAppMessage: function(res) { |
|||
console.log("res", res) |
|||
console.log("data", res.target.dataset) |
|||
var data = res.target.dataset.info |
|||
// this.shareCard(data.sid) |
|||
// ① |
|||
let shareData = JSON.stringify({ |
|||
params: { |
|||
code: data.transferCode, |
|||
codeKey: data.sid |
|||
}, |
|||
functionName: 'bindCard', |
|||
url: '/pages/bind/bind_cloudCard?code=' + data |
|||
.transferCode + "&codeKey=" + data.sid |
|||
|
|||
// url:'/pages/bind/bind_pickUpCard?code=' + + &codeKey=' + data.codeKey, |
|||
// FunctionName:'share! |
|||
}) |
|||
// 转码传输 |
|||
let value = encodeURIComponent(shareData) |
|||
|
|||
return { |
|||
title: '汇融农链-云菜窖', |
|||
// ② |
|||
path: '/pages/login/login?data=' + value, |
|||
imageUrl: 'https://supervise.yxtsoft.com/lpk/image/share_transfer.png', //自定义图片路径，显示图片长宽比是 5:4。 |
|||
success: function(res) { |
|||
console.log('aaaa', "分享成功") |
|||
}, |
|||
fail: function(res) { |
|||
// 转发失败 |
|||
console.log('aaaa', "用户点击了取消") |
|||
} |
|||
} |
|||
}, |
|||
|
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style scoped> |
|||
.item { |
|||
margin-top: 5px; |
|||
} |
|||
|
|||
.item_left { |
|||
font-size: 14px; |
|||
color: #333; |
|||
} |
|||
|
|||
.item_rifht { |
|||
font-size: 13px; |
|||
color: #666; |
|||
} |
|||
|
|||
.sharebtn { |
|||
background: #FE9039; |
|||
font-size: 12px; |
|||
color: #fff; |
|||
width: 30vw; |
|||
border-radius: 20px; |
|||
} |
|||
|
|||
|
|||
.sharebtn::after { |
|||
border: none; |
|||
} |
|||
|
|||
.sharebtn2 { |
|||
background: #CFCFCF; |
|||
width: 30vw; |
|||
font-size: 12px; |
|||
color: #fff; |
|||
border-radius: 20px; |
|||
} |
|||
|
|||
.sharebtn2::after { |
|||
border: none; |
|||
} |
|||
</style> |
|||
@ -0,0 +1,162 @@ |
|||
<template> |
|||
<view |
|||
style="display: flex;flex-direction: column;height: 100vh;background: -webkit-linear-gradient(left,#FEA65F,#FB9440);"> |
|||
<!-- 有列表的时候用 :auto='false' 需要你在onload等调用reload方法 --> |
|||
<z-paging ref="paging" v-model="data" @query="queryList" :pagingStyle='styleObject' :auto='true'> |
|||
|
|||
<view v-for="(item,index) in data" style=" display: flex;flex-direction: column;margin-left: 10px;margin-right: 10px;background: #fff;margin-top: 10px; |
|||
border-radius: 10px;padding: 10px 20px;"> |
|||
|
|||
<view class="item"> |
|||
<text class="item_left">转赠单号：</text> |
|||
<text class="item_rifht">{{item.newCode}}</text> |
|||
</view> |
|||
<view class="item"> |
|||
<text class="item_left">转赠时间：</text> |
|||
<text class="item_rifht">{{item.createTime}}</text> |
|||
</view> |
|||
<view class="item"> |
|||
<text class="item_left">转赠人员：</text> |
|||
<text class="item_rifht">{{item.fxNick}}</text> |
|||
</view> |
|||
<view class="item"> |
|||
<text class="item_left">转赠留言：</text> |
|||
<text class="item_rifht">{{item.remarks}}</text> |
|||
</view> |
|||
<view |
|||
style="display: flex;flex-direction: row;margin-top: 5px;align-items: center;justify-content: space-between;width: 100%;"> |
|||
<text style="flex: 1;font-size: 12px; color: #A5A5A5; margin-right: 10px;">- {{item.goodss}}</text> |
|||
|
|||
|
|||
</view> |
|||
</view> |
|||
|
|||
</z-paging> |
|||
</view> |
|||
</template> |
|||
|
|||
<script> |
|||
export default { |
|||
data() { |
|||
return { |
|||
styleObject: { |
|||
'padding-top': '10px', |
|||
'padding-bottom': '10px', |
|||
'border-radius': '15px', |
|||
'background': '#f2f2f2' |
|||
}, |
|||
data: [] |
|||
} |
|||
}, |
|||
methods: { |
|||
// 分页的请求 |
|||
queryList(pageNo, pageSize) { |
|||
let _this = this |
|||
_this.$api.transferRecordsList({ |
|||
"current": pageNo, |
|||
"size": pageSize, |
|||
"params": { |
|||
"customerSid": getApp().globalData.sid, |
|||
"state": '2', //1 我转赠的 2 赠与我的 |
|||
|
|||
} |
|||
}).then((resp) => { |
|||
// 添加数据源 |
|||
this.$refs.paging.complete(resp.records) |
|||
}).catch(e => { |
|||
// 出错了，点击重试 |
|||
_this.$refs.paging.complete(false); |
|||
}) |
|||
}, |
|||
onShareAppMessage: function(res) { |
|||
console.log("res", res) |
|||
console.log("data", res.target.dataset) |
|||
var data = res.target.dataset.info |
|||
// this.shareCard(data.sid) |
|||
// ① |
|||
let shareData = JSON.stringify({ |
|||
params: { |
|||
code: data.code, |
|||
codeKey: data.codeKey, |
|||
customerSid: '' |
|||
}, |
|||
functionName: 'bindCard', |
|||
url: '/pages/detail/detail_affeection?sid=' + data.sid |
|||
|
|||
// url:'/pages/bind/bind_pickUpCard?code=' + + &codeKey=' + data.codeKey, |
|||
// FunctionName:'share! |
|||
}) |
|||
// 转码传输 |
|||
let value = encodeURIComponent(shareData) |
|||
|
|||
return { |
|||
title: '汇融农链-云菜窖', |
|||
// ② |
|||
path: '/pages/login/login?data=' + value, |
|||
imageUrl: 'https://supervise.yxtsoft.com/lpk/image/shareAffeection.png', //自定义图片路径，显示图片长宽比是 5:4。 |
|||
success: function(res) { |
|||
console.log('aaaa', "分享成功") |
|||
}, |
|||
fail: function(res) { |
|||
// 转发失败 |
|||
console.log('aaaa', "用户点击了取消") |
|||
} |
|||
} |
|||
}, |
|||
|
|||
} |
|||
} |
|||
</script> |
|||
|
|||
<style scoped> |
|||
.item { |
|||
margin-top: 5px; |
|||
} |
|||
|
|||
.item_left { |
|||
font-size: 14px; |
|||
color: #333; |
|||
} |
|||
|
|||
.item_rifht { |
|||
font-size: 13px; |
|||
color: #666; |
|||
} |
|||
|
|||
.sharebtn { |
|||
background: #FF4727; |
|||
font-size: 12px; |
|||
color: #fff; |
|||
width: 30vw; |
|||
border-radius: 20px; |
|||
} |
|||
|
|||
|
|||
.sharebtn::after { |
|||
border: none; |
|||
} |
|||
|
|||
.sharebtn2 { |
|||
background: #FF7165; |
|||
width: 30vw; |
|||
font-size: 12px; |
|||
color: #fff; |
|||
border-radius: 20px; |
|||
} |
|||
|
|||
.sharebtn2::after { |
|||
border: none; |
|||
} |
|||
|
|||
.sharebtn3 { |
|||
background: #CFCFCF; |
|||
width: 30vw; |
|||
font-size: 12px; |
|||
color: #fff; |
|||
border-radius: 20px; |
|||
} |
|||
|
|||
.sharebtn3::after { |
|||
border: none; |
|||
} |
|||
</style> |
|||
Some files were not shown because too many files changed in this diff
Loading…
Reference in new issue