fix: app支付完成

This commit is contained in:
whitechiina 2025-10-17 16:46:10 +08:00
parent ea6a631118
commit 6fcfd499d0
60 changed files with 170150 additions and 89 deletions

View File

@ -1,24 +1,27 @@
{ // launch.json configurations app-plus/h5/mp-weixin/mp-baidu/mp-alipay/mp-qq/mp-toutiao/mp-360/ {
// launch.json configurations app-plus/h5/mp-weixin/mp-baidu/mp-alipay/mp-qq/mp-toutiao/mp-360/
// launchtypelocalremote, localremote // launchtypelocalremote, localremote
"version": "0.0", "version" : "0.0",
"configurations": [{ "configurations" : [
"app-plus" :
{ {
"app-plus" : {
"launchtype" : "local" "launchtype" : "local"
}, },
"default" : "default" : {
{
"launchtype" : "local" "launchtype" : "local"
}, },
"h5" : "h5" : {
{
"launchtype" : "local" "launchtype" : "local"
}, },
"mp-weixin" : "mp-weixin" : {
{
"launchtype" : "local" "launchtype" : "local"
}, },
"type" : "uniCloud" "type" : "uniCloud"
},
{
"customPlaygroundType" : "device",
"playground" : "custom",
"type" : "uni-app:app-android"
} }
] ]
} }

View File

@ -110,6 +110,7 @@
} }
} }
this['globalData']['parameters'] = { ...querys['userinfor'], ...querys['query'], timestamp:querys['timestamp']}; this['globalData']['parameters'] = { ...querys['userinfor'], ...querys['query'], timestamp:querys['timestamp']};
if (this['globalData']['parameters']['query']) { if (this['globalData']['parameters']['query']) {
@ -147,6 +148,9 @@
special: false, special: false,
distance: this['globalData']['parameters'].distance distance: this['globalData']['parameters'].distance
}) })
store.commit('SETISAPP', this['globalData']['parameters']['isApp']);
store.commit('SETTOKEN', this['globalData']['parameters']['token']); store.commit('SETTOKEN', this['globalData']['parameters']['token']);
}; };
} }
@ -179,7 +183,8 @@
methods: { methods: {
...mapMutations({ ...mapMutations({
SETSPREAD:'SETSPREAD', SETSPREAD:'SETSPREAD',
SETTOKEN: 'SETTOKEN' SETTOKEN: 'SETTOKEN',
SETISAPP: 'SETISAPP',
}), }),
getParams(url) { getParams(url) {
const searchParams = new URLSearchParams(url.split("?")[1]); const searchParams = new URLSearchParams(url.split("?")[1]);

View File

@ -224,7 +224,8 @@
mapGetters, mapGetters,
} from 'vuex'; } from 'vuex';
// //
import bRxCommodityItem from '@/components/b-rx-commodity-item/b-rx-commodity-item.vue' import bRxCommodityItem from '@/components/b-rx-commodity-item/b-rx-commodity-item.vue';
import { launchWechatMiniProgram } from '@/utils/index.js';
let self; let self;
export default { export default {
@ -307,6 +308,7 @@
GetShopInfor: 'shopping/GetShopInfor', GetShopInfor: 'shopping/GetShopInfor',
// Id // Id
BrandInfor: 'shopping/BrandInfor', BrandInfor: 'shopping/BrandInfor',
GetIsApp: 'GetIsApp'
}), }),
}, },
methods: { methods: {
@ -455,6 +457,9 @@
}) })
uni.hideLoading(); uni.hideLoading();
}, 1000) }, 1000)
} else {
if (this.GetIsApp) {
launchWechatMiniProgram(res.data.miniProgramOrgId, 0, res.data.prePayTn);
} else { } else {
wx.miniProgram.getEnv((wx) => { wx.miniProgram.getEnv((wx) => {
if (wx.miniprogram) { if (wx.miniprogram) {
@ -483,6 +488,7 @@
window.location.href = `${HTTP_REQUEST_URL}/h5_pay/?token=${this.removeBearerPrefix(state['getters']['GetToken'])}&dat=${encodeURIComponent(JSON.stringify(res.data))}&orderData=${encodeURIComponent(JSON.stringify(orderData))}&tabIndex=1&from_type=food`; window.location.href = `${HTTP_REQUEST_URL}/h5_pay/?token=${this.removeBearerPrefix(state['getters']['GetToken'])}&dat=${encodeURIComponent(JSON.stringify(res.data))}&orderData=${encodeURIComponent(JSON.stringify(orderData))}&tabIndex=1&from_type=food`;
} }
}) })
}
uni.hideLoading(); uni.hideLoading();
} }

View File

@ -246,6 +246,8 @@
computedOfflineOrder, computedOfflineOrder,
createFoodOrder createFoodOrder
} from '@/request/restaurant/index.js'; } from '@/request/restaurant/index.js';
import { mapGetters } from 'vuex';
import { launchWechatMiniProgram } from '@/utils/index.js';
let self; let self;
export default { export default {
@ -314,6 +316,11 @@
onShow() { onShow() {
const value = uni.getStorageSync('isWechatStorage'); const value = uni.getStorageSync('isWechatStorage');
}, },
computed: {
...mapGetters({
GetIsApp: 'GetIsApp'
}),
},
methods: { methods: {
init() { init() {
// //
@ -460,6 +467,9 @@
}) })
uni.hideLoading(); uni.hideLoading();
}, 1000) }, 1000)
} else {
if (this.GetIsApp) {
launchWechatMiniProgram(res.data.miniProgramOrgId, 0, res.data.prePayTn);
} else { } else {
wx.miniProgram.getEnv((wx) => { wx.miniProgram.getEnv((wx) => {
if (wx.miniprogram) { if (wx.miniprogram) {
@ -491,6 +501,7 @@
// window.location.href = `http://10.210.254.149:8080/h5_pay/?token=${this.removeBearerPrefix(state['getters']['GetToken'])}&dat=${encodeURIComponent(JSON.stringify(res.data))}&orderData=${encodeURIComponent(JSON.stringify(orderData))}&from_type=food`; // window.location.href = `http://10.210.254.149:8080/h5_pay/?token=${this.removeBearerPrefix(state['getters']['GetToken'])}&dat=${encodeURIComponent(JSON.stringify(res.data))}&orderData=${encodeURIComponent(JSON.stringify(orderData))}&from_type=food`;
} }
}) })
}
uni.hideLoading(); uni.hideLoading();
} }
}) })

View File

@ -204,6 +204,12 @@ class Request {
} }
}) })
if (state['getters']['GetIsApp']) {
config['header']['form-type'] = 'app';
}
config['header']['form-type'] = 'app';
console.log(cityInfor, '定位信息头') console.log(cityInfor, '定位信息头')
if (cityInfor?.adcode) { if (cityInfor?.adcode) {
// config['header']['city'] = encodeURIComponent(cityInfor['city']); // config['header']['city'] = encodeURIComponent(cityInfor['city']);

View File

@ -7,7 +7,8 @@ import {
SETCITYCODE, SETCITYCODE,
SETFILMDATA, SETFILMDATA,
SETSPREAD, SETSPREAD,
SETTOKEN SETTOKEN,
SETISAPP
} from './mutation-types.js' } from './mutation-types.js'
import card from './module/card'; import card from './module/card';
// import brand from './module/brand'; // import brand from './module/brand';
@ -64,7 +65,8 @@ const store = new Vuex.Store({
regionId: "" // 区ID regionId: "" // 区ID
}, },
token: '', token: '',
spread: '' spread: '',
isApp: false
}, },
getters: { getters: {
// 获取操作端 // 获取操作端
@ -79,7 +81,8 @@ const store = new Vuex.Store({
GetFilmData: state => state['FilmCityDate'], GetFilmData: state => state['FilmCityDate'],
GetToken: state => state['token'], GetToken: state => state['token'],
GetSpread: state => state['spread'] GetSpread: state => state['spread'],
GetIsApp: state => state['isApp'],
}, },
mutations: { mutations: {
// 用户自主选择位置之后 // 用户自主选择位置之后
@ -99,6 +102,9 @@ const store = new Vuex.Store({
[SETTOKEN](state, data) { [SETTOKEN](state, data) {
state['token'] = data; state['token'] = data;
}, },
[SETISAPP](state, data) {
state['isApp'] = data;
},
// 设置电影城市数据 // 设置电影城市数据
SETFILMDATA(state, data) { SETFILMDATA(state, data) {
console.log(data, 'vuex设置电影城市数据') console.log(data, 'vuex设置电影城市数据')

View File

@ -1,5 +1,6 @@
// 设置用户信息方法名 // 设置用户信息方法名
export const SER_USERINFOR = 'SER_USERINFOR'; export const SER_USERINFOR = 'SER_USERINFOR';
export const SETISAPP = 'SETISAPP';
// 添加购物车 // 添加购物车
export const ADD_CART = 'ADD_CART'; export const ADD_CART = 'ADD_CART';
// 移除购物车 // 移除购物车

View File

File diff suppressed because one or more lines are too long

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.7 KiB

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.0 KiB

View File

@ -0,0 +1,25 @@
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8" />
<script>
var __UniViewStartTime__ = Date.now();
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>View</title>
<link rel="stylesheet" href="view.css" />
</head>
<body>
<div id="app"></div>
<script src="__uniappes6.js"></script>
<script src="view.umd.min.js"></script>
<script src="app-view.js"></script>
</body>
</html>

File diff suppressed because one or more lines are too long

View File

@ -0,0 +1,154 @@
/******/ (function(modules) { // webpackBootstrap
/******/ // install a JSONP callback for chunk loading
/******/ function webpackJsonpCallback(data) {
/******/ var chunkIds = data[0];
/******/ var moreModules = data[1];
/******/ var executeModules = data[2];
/******/
/******/ // add "moreModules" to the modules object,
/******/ // then flag all "chunkIds" as loaded and fire callback
/******/ var moduleId, chunkId, i = 0, resolves = [];
/******/ for(;i < chunkIds.length; i++) {
/******/ chunkId = chunkIds[i];
/******/ if(Object.prototype.hasOwnProperty.call(installedChunks, chunkId) && installedChunks[chunkId]) {
/******/ resolves.push(installedChunks[chunkId][0]);
/******/ }
/******/ installedChunks[chunkId] = 0;
/******/ }
/******/ for(moduleId in moreModules) {
/******/ if(Object.prototype.hasOwnProperty.call(moreModules, moduleId)) {
/******/ modules[moduleId] = moreModules[moduleId];
/******/ }
/******/ }
/******/ if(parentJsonpFunction) parentJsonpFunction(data);
/******/
/******/ while(resolves.length) {
/******/ resolves.shift()();
/******/ }
/******/
/******/ // add entry modules from loaded chunk to deferred list
/******/ deferredModules.push.apply(deferredModules, executeModules || []);
/******/
/******/ // run deferred modules when all chunks ready
/******/ return checkDeferredModules();
/******/ };
/******/ function checkDeferredModules() {
/******/ var result;
/******/ for(var i = 0; i < deferredModules.length; i++) {
/******/ var deferredModule = deferredModules[i];
/******/ var fulfilled = true;
/******/ for(var j = 1; j < deferredModule.length; j++) {
/******/ var depId = deferredModule[j];
/******/ if(installedChunks[depId] !== 0) fulfilled = false;
/******/ }
/******/ if(fulfilled) {
/******/ deferredModules.splice(i--, 1);
/******/ result = __webpack_require__(__webpack_require__.s = deferredModule[0]);
/******/ }
/******/ }
/******/
/******/ return result;
/******/ }
/******/
/******/ // The module cache
/******/ var installedModules = {};
/******/
/******/ // object to store loaded and loading chunks
/******/ // undefined = chunk not loaded, null = chunk preloaded/prefetched
/******/ // Promise = chunk loading, 0 = chunk loaded
/******/ var installedChunks = {
/******/ "app-config": 0
/******/ };
/******/
/******/ var deferredModules = [];
/******/
/******/ // The require function
/******/ function __webpack_require__(moduleId) {
/******/
/******/ // Check if module is in cache
/******/ if(installedModules[moduleId]) {
/******/ return installedModules[moduleId].exports;
/******/ }
/******/ // Create a new module (and put it into the cache)
/******/ var module = installedModules[moduleId] = {
/******/ i: moduleId,
/******/ l: false,
/******/ exports: {}
/******/ };
/******/
/******/ // Execute the module function
/******/ modules[moduleId].call(module.exports, module, module.exports, __webpack_require__);
/******/
/******/ // Flag the module as loaded
/******/ module.l = true;
/******/
/******/ // Return the exports of the module
/******/ return module.exports;
/******/ }
/******/
/******/
/******/ // expose the modules object (__webpack_modules__)
/******/ __webpack_require__.m = modules;
/******/
/******/ // expose the module cache
/******/ __webpack_require__.c = installedModules;
/******/
/******/ // define getter function for harmony exports
/******/ __webpack_require__.d = function(exports, name, getter) {
/******/ if(!__webpack_require__.o(exports, name)) {
/******/ Object.defineProperty(exports, name, { enumerable: true, get: getter });
/******/ }
/******/ };
/******/
/******/ // define __esModule on exports
/******/ __webpack_require__.r = function(exports) {
/******/ if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {
/******/ Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
/******/ }
/******/ Object.defineProperty(exports, '__esModule', { value: true });
/******/ };
/******/
/******/ // create a fake namespace object
/******/ // mode & 1: value is a module id, require it
/******/ // mode & 2: merge all properties of value into the ns
/******/ // mode & 4: return value when already ns object
/******/ // mode & 8|1: behave like require
/******/ __webpack_require__.t = function(value, mode) {
/******/ if(mode & 1) value = __webpack_require__(value);
/******/ if(mode & 8) return value;
/******/ if((mode & 4) && typeof value === 'object' && value && value.__esModule) return value;
/******/ var ns = Object.create(null);
/******/ __webpack_require__.r(ns);
/******/ Object.defineProperty(ns, 'default', { enumerable: true, value: value });
/******/ if(mode & 2 && typeof value != 'string') for(var key in value) __webpack_require__.d(ns, key, function(key) { return value[key]; }.bind(null, key));
/******/ return ns;
/******/ };
/******/
/******/ // getDefaultExport function for compatibility with non-harmony modules
/******/ __webpack_require__.n = function(module) {
/******/ var getter = module && module.__esModule ?
/******/ function getDefault() { return module['default']; } :
/******/ function getModuleExports() { return module; };
/******/ __webpack_require__.d(getter, 'a', getter);
/******/ return getter;
/******/ };
/******/
/******/ // Object.prototype.hasOwnProperty.call
/******/ __webpack_require__.o = function(object, property) { return Object.prototype.hasOwnProperty.call(object, property); };
/******/
/******/ // __webpack_public_path__
/******/ __webpack_require__.p = "/";
/******/
/******/ var jsonpArray = this["webpackJsonp"] = this["webpackJsonp"] || [];
/******/ var oldJsonpFunction = jsonpArray.push.bind(jsonpArray);
/******/ jsonpArray.push = webpackJsonpCallback;
/******/ jsonpArray = jsonpArray.slice();
/******/ for(var i = 0; i < jsonpArray.length; i++) webpackJsonpCallback(jsonpArray[i]);
/******/ var parentJsonpFunction = oldJsonpFunction;
/******/
/******/
/******/ // run deferred modules from other chunks
/******/ checkDeferredModules();
/******/ })
/************************************************************************/
/******/ ([]);

96953
unpackage/dist/dev/app-plus/app-service.js vendored Normal file

File diff suppressed because one or more lines are too long

62609
unpackage/dist/dev/app-plus/app-view.js vendored Normal file

File diff suppressed because one or more lines are too long

View File

@ -0,0 +1 @@
{"@platforms":["android","iPhone","iPad"],"id":"__UNI__A669A40","name":"在线点餐","version":{"name":"1.0.1","code":"100"},"description":"","launch_path":"__uniappview.html","developer":{"name":"","email":"","url":""},"permissions":{"UniNView":{"description":"UniNView原生渲染"}},"plus":{"useragent":{"value":"uni-app","concatenate":true},"splashscreen":{"target":"id:1","autoclose":true,"waiting":true,"delay":0},"popGesture":"close","launchwebview":{"render":"always","id":"1","kernel":"WKWebview"},"statusbar":{"immersed":"supportedDevice","style":"dark","background":"#F8F8F8"},"usingComponents":true,"nvueStyleCompiler":"uni-app","compilerVersion":3,"distribute":{"google":{"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\"/>"]},"apple":{},"plugins":{"audio":{"mp3":{"description":"Android平台录音支持MP3格式文件"}}}},"uniStatistics":{"enable":false},"allowsInlineMediaPlayback":true,"uni-app":{"compilerVersion":"4.76","control":"uni-v3","nvueCompiler":"uni-app","renderer":"auto","nvue":{"flex-direction":"column"},"nvueLaunchMode":"normal"},"launch_path":"__uniappview.html"}}

File diff suppressed because one or more lines are too long

View File

@ -0,0 +1,38 @@
// 该文件为点餐css配置文件
// 肯德基主题颜色
$THEMECOLOR1:#FF3232;
$THEMECOLOR2:#C63836;
// 瑞幸咖啡
$THEMECOLOR6:#4A6FE7;
// 星巴克
$THEMECOLOR7:#00AF66;
$THEMECOLOR3:#000000;
$THEMECOLOR4:#333333;
$THEMECOLOR5:#777777;
// 弹框提示/文字提示颜色
$PROMPTTEXTCOLOR:#666666;
// 主要几个文字大小
// 标题类文字大小
$FONTSIZE46:46rpx;
$FONTSIZE36:36rpx;
$FONTSIZE34:34rpx;
$FONTSIZE32:32rpx;
$FONTSIZE30:30rpx;
$FONTSIZE28:28rpx;
$FONTSIZE26:26rpx;
$FONTSIZE25:25rpx;
$FONTSIZE24:24rpx;
$FONTSIZE22:22rpx;
$FONTSIZE20:20rpx;
$FONTSIZE16:16rpx;
// 骨架屏样式
.skeleton{
background-color: #f1f2f4 !important;
color: #f1f2f4 !important;
margin: var(--skeleton);
}

View File

@ -0,0 +1,81 @@
.flex{
display: flex;
}
.flex-space-between{
justify-content: space-between;
}
.flbtn{
display: flex;
justify-content: space-between;
}
.flex-space-around{
justify-content: space-around;
}
.flex-center{
justify-content: center;
}
.flex-left{
justify-content: start;
}
.flex-right{
justify-content: end;
}
.mt-30{
margin: 0 30rpx;
}
.align-item-center{
align-items: center;
}
.clearBtn{
border: none;
background: none;
padding: 0;
margin: 0;
/* #ifdef MP-ALIPAY */
display: flex;
align-items:center;
/* #endif */
}
.clearBtn:after{
border: none;
padding: 0;
margin: 0;
}
.min-body{
background-color: #f5f5f5;
min-height: 100vh;
}
.lit-999{
font-size: 24rpx;
color: #999;
}
.lit-666{
font-size: 24rpx;
color: #666;
}
.overtext{
overflow: hidden; /*超出隐藏*/
text-overflow: ellipsis;/*隐藏后添加省略号*/
white-space: nowrap;/*强制不换行*/
}
.lit-333{
font-size: 24rpx;
color: #333;
}
.big-333{
font-size: 28rpx;
color: #333;
}
.big-999{
font-size: 28rpx;
color: #999;
}
.big-666{
font-size: 28rpx;
color: #666;
}
.bold{
font-weight: bold;
}

View File

@ -0,0 +1,539 @@
/* Logo 字体 */
@font-face {
font-family: "iconfont logo";
src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834');
src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834#iefix') format('embedded-opentype'),
url('https://at.alicdn.com/t/font_985780_km7mi63cihi.woff?t=1545807318834') format('woff'),
url('https://at.alicdn.com/t/font_985780_km7mi63cihi.ttf?t=1545807318834') format('truetype'),
url('https://at.alicdn.com/t/font_985780_km7mi63cihi.svg?t=1545807318834#iconfont') format('svg');
}
.logo {
font-family: "iconfont logo";
font-size: 160px;
font-style: normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
/* tabs */
.nav-tabs {
position: relative;
}
.nav-tabs .nav-more {
position: absolute;
right: 0;
bottom: 0;
height: 42px;
line-height: 42px;
color: #666;
}
#tabs {
border-bottom: 1px solid #eee;
}
#tabs li {
cursor: pointer;
width: 100px;
height: 40px;
line-height: 40px;
text-align: center;
font-size: 16px;
border-bottom: 2px solid transparent;
position: relative;
z-index: 1;
margin-bottom: -1px;
color: #666;
}
#tabs .active {
border-bottom-color: #f00;
color: #222;
}
.tab-container .content {
display: none;
}
/* 页面布局 */
.main {
padding: 30px 100px;
width: 960px;
margin: 0 auto;
}
.main .logo {
color: #333;
text-align: left;
margin-bottom: 30px;
line-height: 1;
height: 110px;
margin-top: -50px;
overflow: hidden;
*zoom: 1;
}
.main .logo a {
font-size: 160px;
color: #333;
}
.helps {
margin-top: 40px;
}
.helps pre {
padding: 20px;
margin: 10px 0;
border: solid 1px #e7e1cd;
background-color: #fffdef;
overflow: auto;
}
.icon_lists {
width: 100% !important;
overflow: hidden;
*zoom: 1;
}
.icon_lists li {
width: 100px;
margin-bottom: 10px;
margin-right: 20px;
text-align: center;
list-style: none !important;
cursor: default;
}
.icon_lists li .code-name {
line-height: 1.2;
}
.icon_lists .icon {
display: block;
height: 100px;
line-height: 100px;
font-size: 42px;
margin: 10px auto;
color: #333;
-webkit-transition: font-size 0.25s linear, width 0.25s linear;
-moz-transition: font-size 0.25s linear, width 0.25s linear;
transition: font-size 0.25s linear, width 0.25s linear;
}
.icon_lists .icon:hover {
font-size: 100px;
}
.icon_lists .svg-icon {
/* 通过设置 font-size 来改变图标大小 */
width: 1em;
/* 图标和文字相邻时,垂直对齐 */
vertical-align: -0.15em;
/* 通过设置 color 来改变 SVG 的颜色/fill */
fill: currentColor;
/* path stroke 溢出 viewBox 部分在 IE 下会显示
normalize.css 中也包含这行 */
overflow: hidden;
}
.icon_lists li .name,
.icon_lists li .code-name {
color: #666;
}
/* markdown 样式 */
.markdown {
color: #666;
font-size: 14px;
line-height: 1.8;
}
.highlight {
line-height: 1.5;
}
.markdown img {
vertical-align: middle;
max-width: 100%;
}
.markdown h1 {
color: #404040;
font-weight: 500;
line-height: 40px;
margin-bottom: 24px;
}
.markdown h2,
.markdown h3,
.markdown h4,
.markdown h5,
.markdown h6 {
color: #404040;
margin: 1.6em 0 0.6em 0;
font-weight: 500;
clear: both;
}
.markdown h1 {
font-size: 28px;
}
.markdown h2 {
font-size: 22px;
}
.markdown h3 {
font-size: 16px;
}
.markdown h4 {
font-size: 14px;
}
.markdown h5 {
font-size: 12px;
}
.markdown h6 {
font-size: 12px;
}
.markdown hr {
height: 1px;
border: 0;
background: #e9e9e9;
margin: 16px 0;
clear: both;
}
.markdown p {
margin: 1em 0;
}
.markdown>p,
.markdown>blockquote,
.markdown>.highlight,
.markdown>ol,
.markdown>ul {
width: 80%;
}
.markdown ul>li {
list-style: circle;
}
.markdown>ul li,
.markdown blockquote ul>li {
margin-left: 20px;
padding-left: 4px;
}
.markdown>ul li p,
.markdown>ol li p {
margin: 0.6em 0;
}
.markdown ol>li {
list-style: decimal;
}
.markdown>ol li,
.markdown blockquote ol>li {
margin-left: 20px;
padding-left: 4px;
}
.markdown code {
margin: 0 3px;
padding: 0 5px;
background: #eee;
border-radius: 3px;
}
.markdown strong,
.markdown b {
font-weight: 600;
}
.markdown>table {
border-collapse: collapse;
border-spacing: 0px;
empty-cells: show;
border: 1px solid #e9e9e9;
width: 95%;
margin-bottom: 24px;
}
.markdown>table th {
white-space: nowrap;
color: #333;
font-weight: 600;
}
.markdown>table th,
.markdown>table td {
border: 1px solid #e9e9e9;
padding: 8px 16px;
text-align: left;
}
.markdown>table th {
background: #F7F7F7;
}
.markdown blockquote {
font-size: 90%;
color: #999;
border-left: 4px solid #e9e9e9;
padding-left: 0.8em;
margin: 1em 0;
}
.markdown blockquote p {
margin: 0;
}
.markdown .anchor {
opacity: 0;
transition: opacity 0.3s ease;
margin-left: 8px;
}
.markdown .waiting {
color: #ccc;
}
.markdown h1:hover .anchor,
.markdown h2:hover .anchor,
.markdown h3:hover .anchor,
.markdown h4:hover .anchor,
.markdown h5:hover .anchor,
.markdown h6:hover .anchor {
opacity: 1;
display: inline-block;
}
.markdown>br,
.markdown>p>br {
clear: both;
}
.hljs {
display: block;
background: white;
padding: 0.5em;
color: #333333;
overflow-x: auto;
}
.hljs-comment,
.hljs-meta {
color: #969896;
}
.hljs-string,
.hljs-variable,
.hljs-template-variable,
.hljs-strong,
.hljs-emphasis,
.hljs-quote {
color: #df5000;
}
.hljs-keyword,
.hljs-selector-tag,
.hljs-type {
color: #a71d5d;
}
.hljs-literal,
.hljs-symbol,
.hljs-bullet,
.hljs-attribute {
color: #0086b3;
}
.hljs-section,
.hljs-name {
color: #63a35c;
}
.hljs-tag {
color: #333333;
}
.hljs-title,
.hljs-attr,
.hljs-selector-id,
.hljs-selector-class,
.hljs-selector-attr,
.hljs-selector-pseudo {
color: #795da3;
}
.hljs-addition {
color: #55a532;
background-color: #eaffea;
}
.hljs-deletion {
color: #bd2c00;
background-color: #ffecec;
}
.hljs-link {
text-decoration: underline;
}
/* 代码高亮 */
/* PrismJS 1.15.0
https://prismjs.com/download.html#themes=prism&languages=markup+css+clike+javascript */
/**
* prism.js default theme for JavaScript, CSS and HTML
* Based on dabblet (http://dabblet.com)
* @author Lea Verou
*/
code[class*="language-"],
pre[class*="language-"] {
color: black;
background: none;
text-shadow: 0 1px white;
font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
text-align: left;
white-space: pre;
word-spacing: normal;
word-break: normal;
word-wrap: normal;
line-height: 1.5;
-moz-tab-size: 4;
-o-tab-size: 4;
tab-size: 4;
-webkit-hyphens: none;
-moz-hyphens: none;
-ms-hyphens: none;
hyphens: none;
}
pre[class*="language-"]::-moz-selection,
pre[class*="language-"] ::-moz-selection,
code[class*="language-"]::-moz-selection,
code[class*="language-"] ::-moz-selection {
text-shadow: none;
background: #b3d4fc;
}
pre[class*="language-"]::selection,
pre[class*="language-"] ::selection,
code[class*="language-"]::selection,
code[class*="language-"] ::selection {
text-shadow: none;
background: #b3d4fc;
}
@media print {
code[class*="language-"],
pre[class*="language-"] {
text-shadow: none;
}
}
/* Code blocks */
pre[class*="language-"] {
padding: 1em;
margin: .5em 0;
overflow: auto;
}
:not(pre)>code[class*="language-"],
pre[class*="language-"] {
background: #f5f2f0;
}
/* Inline code */
:not(pre)>code[class*="language-"] {
padding: .1em;
border-radius: .3em;
white-space: normal;
}
.token.comment,
.token.prolog,
.token.doctype,
.token.cdata {
color: slategray;
}
.token.punctuation {
color: #999;
}
.namespace {
opacity: .7;
}
.token.property,
.token.tag,
.token.boolean,
.token.number,
.token.constant,
.token.symbol,
.token.deleted {
color: #905;
}
.token.selector,
.token.attr-name,
.token.string,
.token.char,
.token.builtin,
.token.inserted {
color: #690;
}
.token.operator,
.token.entity,
.token.url,
.language-css .token.string,
.style .token.string {
color: #9a6e3a;
background: hsla(0, 0%, 100%, .5);
}
.token.atrule,
.token.attr-value,
.token.keyword {
color: #07a;
}
.token.function,
.token.class-name {
color: #DD4A68;
}
.token.regex,
.token.important,
.token.variable {
color: #e90;
}
.token.important,
.token.bold {
font-weight: bold;
}
.token.italic {
font-style: italic;
}
.token.entity {
cursor: help;
}

View File

@ -0,0 +1,648 @@
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>iconfont Demo</title>
<link rel="shortcut icon" href="//img.alicdn.com/imgextra/i4/O1CN01Z5paLz1O0zuCC7osS_!!6000000001644-55-tps-83-82.svg" type="image/x-icon"/>
<link rel="icon" type="image/svg+xml" href="//img.alicdn.com/imgextra/i4/O1CN01Z5paLz1O0zuCC7osS_!!6000000001644-55-tps-83-82.svg"/>
<link rel="stylesheet" href="https://g.alicdn.com/thx/cube/1.3.2/cube.min.css">
<link rel="stylesheet" href="demo.css">
<link rel="stylesheet" href="iconfont.css">
<script src="iconfont.js"></script>
<!-- jQuery -->
<script src="https://a1.alicdn.com/oss/uploads/2018/12/26/7bfddb60-08e8-11e9-9b04-53e73bb6408b.js"></script>
<!-- 代码高亮 -->
<script src="https://a1.alicdn.com/oss/uploads/2018/12/26/a3f714d0-08e6-11e9-8a15-ebf944d7534c.js"></script>
<style>
.main .logo {
margin-top: 0;
height: auto;
}
.main .logo a {
display: flex;
align-items: center;
}
.main .logo .sub-title {
margin-left: 0.5em;
font-size: 22px;
color: #fff;
background: linear-gradient(-45deg, #3967FF, #B500FE);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
</style>
</head>
<body>
<div class="main">
<h1 class="logo"><a href="https://www.iconfont.cn/" title="iconfont 首页" target="_blank">
<img width="200" src="https://img.alicdn.com/imgextra/i3/O1CN01Mn65HV1FfSEzR6DKv_!!6000000000514-55-tps-228-59.svg">
</a></h1>
<div class="nav-tabs">
<ul id="tabs" class="dib-box">
<li class="dib active"><span>Unicode</span></li>
<li class="dib"><span>Font class</span></li>
<li class="dib"><span>Symbol</span></li>
</ul>
<a href="https://www.iconfont.cn/manage/index?manage_type=myprojects&projectId=3770712" target="_blank" class="nav-more">查看项目</a>
</div>
<div class="tab-container">
<div class="content unicode" style="display: block;">
<ul class="icon_lists dib-box">
<li class="dib">
<span class="icon iconfont">&#xe671;</span>
<div class="name">步骤条</div>
<div class="code-name">&amp;#xe671;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe731;</span>
<div class="name">圆形选中</div>
<div class="code-name">&amp;#xe731;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe60d;</span>
<div class="name">选择_选中</div>
<div class="code-name">&amp;#xe60d;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe649;</span>
<div class="name">单选-选中</div>
<div class="code-name">&amp;#xe649;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe6b6;</span>
<div class="name">添加商品</div>
<div class="code-name">&amp;#xe6b6;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe606;</span>
<div class="name">减去</div>
<div class="code-name">&amp;#xe606;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe605;</span>
<div class="name">扫码</div>
<div class="code-name">&amp;#xe605;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe603;</span>
<div class="name">购物车满</div>
<div class="code-name">&amp;#xe603;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe604;</span>
<div class="name">购物车空</div>
<div class="code-name">&amp;#xe604;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe62d;</span>
<div class="name">箭头 右</div>
<div class="code-name">&amp;#xe62d;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe618;</span>
<div class="name">勾选</div>
<div class="code-name">&amp;#xe618;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xeb99;</span>
<div class="name">全屏_o</div>
<div class="code-name">&amp;#xeb99;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe632;</span>
<div class="name">修改</div>
<div class="code-name">&amp;#xe632;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe8cf;</span>
<div class="name">修改</div>
<div class="code-name">&amp;#xe8cf;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe601;</span>
<div class="name">向上</div>
<div class="code-name">&amp;#xe601;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe602;</span>
<div class="name">向下</div>
<div class="code-name">&amp;#xe602;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe6dc;</span>
<div class="name">tab_下拉</div>
<div class="code-name">&amp;#xe6dc;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xed1d;</span>
<div class="name">对勾_块</div>
<div class="code-name">&amp;#xed1d;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xeb65;</span>
<div class="name">警告</div>
<div class="code-name">&amp;#xeb65;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe600;</span>
<div class="name">购物车满</div>
<div class="code-name">&amp;#xe600;</div>
</li>
</ul>
<div class="article markdown">
<h2 id="unicode-">Unicode 引用</h2>
<hr>
<p>Unicode 是字体在网页端最原始的应用方式,特点是:</p>
<ul>
<li>支持按字体的方式去动态调整图标大小,颜色等等。</li>
<li>默认情况下不支持多色,直接添加多色图标会自动去色。</li>
</ul>
<blockquote>
<p>注意:新版 iconfont 支持两种方式引用多色图标SVG symbol 引用方式和彩色字体图标模式。(使用彩色字体图标需要在「编辑项目」中开启「彩色」选项后并重新生成。)</p>
</blockquote>
<p>Unicode 使用步骤如下:</p>
<h3 id="-font-face">第一步:拷贝项目下面生成的 <code>@font-face</code></h3>
<pre><code class="language-css"
>@font-face {
font-family: 'iconfont';
src: url('iconfont.woff2?t=1682049564668') format('woff2'),
url('iconfont.woff?t=1682049564668') format('woff'),
url('iconfont.ttf?t=1682049564668') format('truetype');
}
</code></pre>
<h3 id="-iconfont-">第二步:定义使用 iconfont 的样式</h3>
<pre><code class="language-css"
>.iconfont {
font-family: "iconfont" !important;
font-size: 16px;
font-style: normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
</code></pre>
<h3 id="-">第三步:挑选相应图标并获取字体编码,应用于页面</h3>
<pre>
<code class="language-html"
>&lt;span class="iconfont"&gt;&amp;#x33;&lt;/span&gt;
</code></pre>
<blockquote>
<p>"iconfont" 是你项目下的 font-family。可以通过编辑项目查看默认是 "iconfont"。</p>
</blockquote>
</div>
</div>
<div class="content font-class">
<ul class="icon_lists dib-box">
<li class="dib">
<span class="icon iconfont icon-buzhoutiao"></span>
<div class="name">
步骤条
</div>
<div class="code-name">.icon-buzhoutiao
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-yuanxingxuanzhong"></span>
<div class="name">
圆形选中
</div>
<div class="code-name">.icon-yuanxingxuanzhong
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-xuanze_xuanzhong"></span>
<div class="name">
选择_选中
</div>
<div class="code-name">.icon-xuanze_xuanzhong
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-danxuan-xuanzhong"></span>
<div class="name">
单选-选中
</div>
<div class="code-name">.icon-danxuan-xuanzhong
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-tianjiashangpin"></span>
<div class="name">
添加商品
</div>
<div class="code-name">.icon-tianjiashangpin
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-jianqu"></span>
<div class="name">
减去
</div>
<div class="code-name">.icon-jianqu
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-iconfontscan"></span>
<div class="name">
扫码
</div>
<div class="code-name">.icon-iconfontscan
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-gouwucheman1"></span>
<div class="name">
购物车满
</div>
<div class="code-name">.icon-gouwucheman1
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-gouwuchekong"></span>
<div class="name">
购物车空
</div>
<div class="code-name">.icon-gouwuchekong
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-jiantouyou"></span>
<div class="name">
箭头 右
</div>
<div class="code-name">.icon-jiantouyou
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-gouxuan"></span>
<div class="name">
勾选
</div>
<div class="code-name">.icon-gouxuan
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-quanping_o"></span>
<div class="name">
全屏_o
</div>
<div class="code-name">.icon-quanping_o
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-xiugai1"></span>
<div class="name">
修改
</div>
<div class="code-name">.icon-xiugai1
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-xiugai"></span>
<div class="name">
修改
</div>
<div class="code-name">.icon-xiugai
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-xiangshang"></span>
<div class="name">
向上
</div>
<div class="code-name">.icon-xiangshang
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-xiangxia"></span>
<div class="name">
向下
</div>
<div class="code-name">.icon-xiangxia
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-tabxiala"></span>
<div class="name">
tab_下拉
</div>
<div class="code-name">.icon-tabxiala
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-duigou_kuai"></span>
<div class="name">
对勾_块
</div>
<div class="code-name">.icon-duigou_kuai
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-jinggao"></span>
<div class="name">
警告
</div>
<div class="code-name">.icon-jinggao
</div>
</li>
<li class="dib">
<span class="icon iconfont icon-gouwucheman"></span>
<div class="name">
购物车满
</div>
<div class="code-name">.icon-gouwucheman
</div>
</li>
</ul>
<div class="article markdown">
<h2 id="font-class-">font-class 引用</h2>
<hr>
<p>font-class 是 Unicode 使用方式的一种变种,主要是解决 Unicode 书写不直观,语意不明确的问题。</p>
<p>与 Unicode 使用方式相比,具有如下特点:</p>
<ul>
<li>相比于 Unicode 语意明确,书写更直观。可以很容易分辨这个 icon 是什么。</li>
<li>因为使用 class 来定义图标,所以当要替换图标时,只需要修改 class 里面的 Unicode 引用。</li>
</ul>
<p>使用步骤如下:</p>
<h3 id="-fontclass-">第一步:引入项目下面生成的 fontclass 代码:</h3>
<pre><code class="language-html">&lt;link rel="stylesheet" href="./iconfont.css"&gt;
</code></pre>
<h3 id="-">第二步:挑选相应图标并获取类名,应用于页面:</h3>
<pre><code class="language-html">&lt;span class="iconfont icon-xxx"&gt;&lt;/span&gt;
</code></pre>
<blockquote>
<p>"
iconfont" 是你项目下的 font-family。可以通过编辑项目查看默认是 "iconfont"。</p>
</blockquote>
</div>
</div>
<div class="content symbol">
<ul class="icon_lists dib-box">
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-buzhoutiao"></use>
</svg>
<div class="name">步骤条</div>
<div class="code-name">#icon-buzhoutiao</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-yuanxingxuanzhong"></use>
</svg>
<div class="name">圆形选中</div>
<div class="code-name">#icon-yuanxingxuanzhong</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-xuanze_xuanzhong"></use>
</svg>
<div class="name">选择_选中</div>
<div class="code-name">#icon-xuanze_xuanzhong</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-danxuan-xuanzhong"></use>
</svg>
<div class="name">单选-选中</div>
<div class="code-name">#icon-danxuan-xuanzhong</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-tianjiashangpin"></use>
</svg>
<div class="name">添加商品</div>
<div class="code-name">#icon-tianjiashangpin</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-jianqu"></use>
</svg>
<div class="name">减去</div>
<div class="code-name">#icon-jianqu</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-iconfontscan"></use>
</svg>
<div class="name">扫码</div>
<div class="code-name">#icon-iconfontscan</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-gouwucheman1"></use>
</svg>
<div class="name">购物车满</div>
<div class="code-name">#icon-gouwucheman1</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-gouwuchekong"></use>
</svg>
<div class="name">购物车空</div>
<div class="code-name">#icon-gouwuchekong</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-jiantouyou"></use>
</svg>
<div class="name">箭头 右</div>
<div class="code-name">#icon-jiantouyou</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-gouxuan"></use>
</svg>
<div class="name">勾选</div>
<div class="code-name">#icon-gouxuan</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-quanping_o"></use>
</svg>
<div class="name">全屏_o</div>
<div class="code-name">#icon-quanping_o</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-xiugai1"></use>
</svg>
<div class="name">修改</div>
<div class="code-name">#icon-xiugai1</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-xiugai"></use>
</svg>
<div class="name">修改</div>
<div class="code-name">#icon-xiugai</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-xiangshang"></use>
</svg>
<div class="name">向上</div>
<div class="code-name">#icon-xiangshang</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-xiangxia"></use>
</svg>
<div class="name">向下</div>
<div class="code-name">#icon-xiangxia</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-tabxiala"></use>
</svg>
<div class="name">tab_下拉</div>
<div class="code-name">#icon-tabxiala</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-duigou_kuai"></use>
</svg>
<div class="name">对勾_块</div>
<div class="code-name">#icon-duigou_kuai</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-jinggao"></use>
</svg>
<div class="name">警告</div>
<div class="code-name">#icon-jinggao</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#icon-gouwucheman"></use>
</svg>
<div class="name">购物车满</div>
<div class="code-name">#icon-gouwucheman</div>
</li>
</ul>
<div class="article markdown">
<h2 id="symbol-">Symbol 引用</h2>
<hr>
<p>这是一种全新的使用方式,应该说这才是未来的主流,也是平台目前推荐的用法。相关介绍可以参考这篇<a href="">文章</a>
这种用法其实是做了一个 SVG 的集合,与另外两种相比具有如下特点:</p>
<ul>
<li>支持多色图标了,不再受单色限制。</li>
<li>通过一些技巧,支持像字体那样,通过 <code>font-size</code>, <code>color</code> 来调整样式。</li>
<li>兼容性较差,支持 IE9+,及现代浏览器。</li>
<li>浏览器渲染 SVG 的性能一般,还不如 png。</li>
</ul>
<p>使用步骤如下:</p>
<h3 id="-symbol-">第一步:引入项目下面生成的 symbol 代码:</h3>
<pre><code class="language-html">&lt;script src="./iconfont.js"&gt;&lt;/script&gt;
</code></pre>
<h3 id="-css-">第二步:加入通用 CSS 代码(引入一次就行):</h3>
<pre><code class="language-html">&lt;style&gt;
.icon {
width: 1em;
height: 1em;
vertical-align: -0.15em;
fill: currentColor;
overflow: hidden;
}
&lt;/style&gt;
</code></pre>
<h3 id="-">第三步:挑选相应图标并获取类名,应用于页面:</h3>
<pre><code class="language-html">&lt;svg class="icon" aria-hidden="true"&gt;
&lt;use xlink:href="#icon-xxx"&gt;&lt;/use&gt;
&lt;/svg&gt;
</code></pre>
</div>
</div>
</div>
</div>
<script>
$(document).ready(function () {
$('.tab-container .content:first').show()
$('#tabs li').click(function (e) {
var tabContent = $('.tab-container .content')
var index = $(this).index()
if ($(this).hasClass('active')) {
return
} else {
$('#tabs li').removeClass('active')
$(this).addClass('active')
tabContent.hide().eq(index).fadeIn()
}
})
})
</script>
</body>
</html>

View File

@ -0,0 +1,95 @@
@font-face {
font-family: "iconfont"; /* Project id 3770712 */
src: url('@/static/css/icon/iconfont.woff2?t=1682049564668') format('woff2'),
url('@/static/css/icon/iconfont.woff?t=1682049564668') format('woff'),
url('@/static/css/icon/iconfont.ttf?t=1682049564668') format('truetype');
}
.iconfont {
font-family: "iconfont" !important;
font-size: 16px;
font-style: normal;
-webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale;
}
.icon-buzhoutiao:before {
content: "\e671";
}
.icon-yuanxingxuanzhong:before {
content: "\e731";
}
.icon-xuanze_xuanzhong:before {
content: "\e60d";
}
.icon-danxuan-xuanzhong:before {
content: "\e649";
}
.icon-tianjiashangpin:before {
content: "\e6b6";
}
.icon-jianqu:before {
content: "\e606";
}
.icon-iconfontscan:before {
content: "\e605";
}
.icon-gouwucheman1:before {
content: "\e603";
}
.icon-gouwuchekong:before {
content: "\e604";
}
.icon-jiantouyou:before {
content: "\e62d";
}
.icon-gouxuan:before {
content: "\e618";
}
.icon-quanping_o:before {
content: "\eb99";
}
.icon-xiugai1:before {
content: "\e632";
}
.icon-xiugai:before {
content: "\e8cf";
}
.icon-xiangshang:before {
content: "\e601";
}
.icon-xiangxia:before {
content: "\e602";
}
.icon-tabxiala:before {
content: "\e6dc";
}
.icon-duigou_kuai:before {
content: "\ed1d";
}
.icon-jinggao:before {
content: "\eb65";
}
.icon-gouwucheman:before {
content: "\e600";
}

File diff suppressed because one or more lines are too long

View File

@ -0,0 +1,149 @@
{
"id": "3770712",
"name": "白马晶选小程序",
"font_family": "iconfont",
"css_prefix_text": "icon-",
"description": "",
"glyphs": [
{
"icon_id": "34473350",
"name": "步骤条",
"font_class": "buzhoutiao",
"unicode": "e671",
"unicode_decimal": 58993
},
{
"icon_id": "577324",
"name": "圆形选中",
"font_class": "yuanxingxuanzhong",
"unicode": "e731",
"unicode_decimal": 59185
},
{
"icon_id": "9509947",
"name": "选择_选中",
"font_class": "xuanze_xuanzhong",
"unicode": "e60d",
"unicode_decimal": 58893
},
{
"icon_id": "7408738",
"name": "单选-选中",
"font_class": "danxuan-xuanzhong",
"unicode": "e649",
"unicode_decimal": 58953
},
{
"icon_id": "12263519",
"name": "添加商品",
"font_class": "tianjiashangpin",
"unicode": "e6b6",
"unicode_decimal": 59062
},
{
"icon_id": "21009384",
"name": "减去",
"font_class": "jianqu",
"unicode": "e606",
"unicode_decimal": 58886
},
{
"icon_id": "162869",
"name": "扫码",
"font_class": "iconfontscan",
"unicode": "e605",
"unicode_decimal": 58885
},
{
"icon_id": "1305",
"name": "购物车满",
"font_class": "gouwucheman1",
"unicode": "e603",
"unicode_decimal": 58883
},
{
"icon_id": "1306",
"name": "购物车空",
"font_class": "gouwuchekong",
"unicode": "e604",
"unicode_decimal": 58884
},
{
"icon_id": "2674928",
"name": "箭头 右",
"font_class": "jiantouyou",
"unicode": "e62d",
"unicode_decimal": 58925
},
{
"icon_id": "1257699",
"name": "勾选",
"font_class": "gouxuan",
"unicode": "e618",
"unicode_decimal": 58904
},
{
"icon_id": "5387948",
"name": "全屏_o",
"font_class": "quanping_o",
"unicode": "eb99",
"unicode_decimal": 60313
},
{
"icon_id": "12203732",
"name": "修改",
"font_class": "xiugai1",
"unicode": "e632",
"unicode_decimal": 58930
},
{
"icon_id": "2076418",
"name": "修改",
"font_class": "xiugai",
"unicode": "e8cf",
"unicode_decimal": 59599
},
{
"icon_id": "1348",
"name": "向上",
"font_class": "xiangshang",
"unicode": "e601",
"unicode_decimal": 58881
},
{
"icon_id": "1351",
"name": "向下",
"font_class": "xiangxia",
"unicode": "e602",
"unicode_decimal": 58882
},
{
"icon_id": "676771",
"name": "tab_下拉",
"font_class": "tabxiala",
"unicode": "e6dc",
"unicode_decimal": 59100
},
{
"icon_id": "7954334",
"name": "对勾_块",
"font_class": "duigou_kuai",
"unicode": "ed1d",
"unicode_decimal": 60701
},
{
"icon_id": "3868273",
"name": "警告",
"font_class": "jinggao",
"unicode": "eb65",
"unicode_decimal": 60261
},
{
"icon_id": "5030",
"name": "购物车满",
"font_class": "gouwucheman",
"unicode": "e600",
"unicode_decimal": 58880
}
]
}

Binary file not shown.

Binary file not shown.

Binary file not shown.

View File

@ -0,0 +1,181 @@
// 麦当劳主题文字颜色类名
.themeColor-5 {
color: $themeColor-5-1 !important;
}
// 麦当劳主题背景颜色类名
.themeBackColor-5 {
background-color: $themeBackColor-5-1 !important;
};
// 麦当劳主题联合自定义类名
// 商家列表选择就餐激活样式
// 店铺详情添加商品增加按钮样式
.theme-Union-Class-5-1 {
background-color: $themeBackColor-5-1 !important;
color: #ffffff !important;
border: 1rpx solid $themeBackColor-5-1 !important;
};
// 店铺详情添加商品减少按钮样式
.theme-Union-Class-5-2 {
color: $themeColor-5-1 !important;
border: 1rpx solid $themeBackColor-5-1 !important;
};
// 店铺详情添加商品减少按钮样式
.theme-Union-Class-5-3 {
border: 1rpx solid $themeBackColor-5-1 !important;
};
// 肯德基主题文字颜色类名
.themeColor-1 {
color: $themeColor-1-1 !important;
}
// 肯德基主题背景颜色类名
.themeBackColor-1 {
background-color: $themeBackColor-1-1 !important;
}
// 商家列表选择就餐激活样式
// 店铺详情添加商品增加按钮样式
.theme-Union-Class-1-1 {
background-color: $themeBackColor-1-1 !important;
color: #ffffff !important;
border: 1rpx solid $themeBackColor-1-1 !important;
};
// 店铺详情添加商品减少按钮样式
.theme-Union-Class-1-2 {
color: $themeColor-1-1 !important;
border: 1rpx solid $themeBackColor-1-1 !important;
};
// 店铺详情添加商品减少按钮样式
.theme-Union-Class-1-3 {
border: 1rpx solid $themeBackColor-1-1 !important;
};
// 星巴克主题文字颜色类名
.themeColor-10 {
color: $themeColor-10-1 !important;
}
// 星巴克主题背景颜色类名
.themeBackColor-10 {
background-color: $themeBackColor-10-1 !important;
}
// 商家列表选择就餐激活样式
// 店铺详情添加商品增加按钮样式
.theme-Union-Class-10-1 {
background-color: $themeBackColor-10-1 !important;
color: #ffffff !important;
border: 1rpx solid $themeBackColor-10-1 !important;
};
// 店铺详情添加商品减少按钮样式
.theme-Union-Class-10-2 {
color: $themeColor-10-1 !important;
border: 1rpx solid $themeBackColor-10-1 !important;
};
// 店铺详情添加商品减少按钮样式
.theme-Union-Class-10-3 {
border: 1rpx solid $themeBackColor-10-1 !important;
};
// 星巴克主题文字颜色类名
.themeColor-13 {
color: $themeColor-13-1 !important;
}
// 星巴克主题背景颜色类名
.themeBackColor-13 {
background-color: $themeBackColor-13-1 !important;
}
// 商家列表选择就餐激活样式
// 店铺详情添加商品增加按钮样式
.theme-Union-Class-13-1 {
background-color: $themeBackColor-13-1 !important;
color: #ffffff !important;
border: 1rpx solid $themeBackColor-13-1 !important;
};
// 店铺详情添加商品减少按钮样式
.theme-Union-Class-13-2 {
color: $themeColor-13-1 !important;
border: 1rpx solid $themeBackColor-13-1 !important;
};
// 店铺详情添加商品减少按钮样式
.theme-Union-Class-13-3 {
border: 1rpx solid $themeBackColor-13-1 !important;
};
// 奈雪主题文字颜色类名
.themeColor-2 {
color: $themeColor-2-1 !important;
}
// 奈雪主题背景颜色类名
.themeBackColor-2 {
background-color: $themeBackColor-2-1 !important;
}
// 商家列表选择就餐激活样式
// 店铺详情添加商品增加按钮样式
.theme-Union-Class-2-1 {
background-color: $themeBackColor-2-1 !important;
color: #ffffff !important;
border: 1rpx solid $themeBackColor-2-1 !important;
};
// 店铺详情添加商品减少按钮样式
.theme-Union-Class-2-2 {
color: $themeColor-2-1 !important;
border: 1rpx solid $themeBackColor-2-1 !important;
};
// 店铺详情添加商品减少按钮样式
.theme-Union-Class-2-3 {
border: 1rpx solid $themeBackColor-2-1 !important;
};
// 添加按钮样式
.Add-Button{
width: 42rpx;
height: 42rpx;
font-size: 34rpx;
border-radius: 50rpx;
display: flex;
justify-content: center;
font-weight: 800;
flex-direction: column;
align-items: center;
}
.Reduce-Button{
width: 42rpx;
height: 42rpx;
font-size: 34rpx;
border-radius: 50rpx;
display: flex;
justify-content: center;
font-weight: 800;
flex-direction: column;
align-items: center;
}
// 规格样式
.commodity-sku-option-item {
height: auto !important;
.commodity-sku-option-item-values-item {
height: 72rpx !important;
padding: 0rpx 20rpx !important;
}
}
.commodity-sku-option-item-values {
display: flex;
flex-wrap: wrap;
}

View File

@ -0,0 +1,896 @@
// 点餐系统统一配置文件
// 将写死的数据,并且后期可能会改变但不会动态改变的数据放入该文件,后期可写为Class方法并且统一继承
import state from '@/store/index.js';
let name = state['state']['shopping']['BInfor']['brand_name'];
// 客服链接
import {
KFCSERVICE
} from '@/static/js/serviceurl.js';
const config = {
// 进入店铺详情前的提示
KFCShopHint: {
title: '温馨提示',
content: `${name}点餐为第三方供应商提供的代下单服务,当您支付后,请凭借取餐码等候门店屏幕的显示即可取餐。如有疑问请在订单列表里联系客服。`
},
// 肯德基配置
Brand_1: {
BrandName:'肯德基',
// 主题色
ThemeColor: '#C63836',
// 底部导航配置
tabBar: {
// 文字颜色
color: '#999999',
// 选中文字颜色
selectedColor: '#C63836',
// 底部导航背景色
backgroundColor: '#FFFFFF',
// 选项
list: [{
// 标题
title: '选择餐厅',
// 图片路径
iconPath: 'https://img.agrimedia.cn/chwl/navb.png',
// 激活的图片路径
selectedIconPath: 'https://img.agrimedia.cn/chwl/nava.png'
}, {
// 标题
title: '我的订单(查看取餐码)',
// 图片路径
iconPath: 'https://img.agrimedia.cn/chwl/navd.png',
// 激活的图片路径
selectedIconPath: 'https://img.agrimedia.cn/chwl/navc.png',
}],
},
// 自定义样式
customStyle: {
BtnStyle: [{
color: '#FFFFFF',
backgroundColor: '#C63836',
}],
// 订单按钮样式
OrderBtnStyle: {
// 未支付-按钮样式
orderbtn_0: [{
text: '取消订单',
state: 'cancel',
style: {
border: '1px solid #E3E3E3 !important',
color: '#666666 !important',
backgroundColor: '#FFFFFF !important'
}
},
{
text: '立即支付',
state: 'pay',
style: {
border: '1px solid #DC7473 !important',
color: '#C63836 !important',
backgroundColor: '#FFFFFF !important'
}
}
],
// 订单关闭-按钮样式
orderbtn_5: [{
text: '重新下单',
state: 'again',
style: {
border: '1px solid #E3E3E3 !important',
color: '#666666 !important',
backgroundColor: '#FFFFFF !important'
}
}],
// 待出餐-按钮样式
orderbtn_1: [{
text: '联系客服',
state: 'service',
style: {
border: '1px solid #E3E3E3 !important',
color: '#666666 !important',
backgroundColor: '#FFFFFF !important'
}
}],
// 已出餐-按钮样式
orderbtn_2: [{
text: '查看取餐码',
state: 'code',
style: {
border: '1px solid #DC7473 !important',
color: '#C63836 !important',
backgroundColor: '#FFFFFF !important'
}
}],
// 已出餐-部分退款-按钮样式
orderbtn_4: [{
text: '查看取餐码',
state: 'code',
style: {
border: '1px solid #DC7473 !important',
color: '#C63836 !important',
backgroundColor: '#FFFFFF !important'
}
}],
// 已退款-按钮样式
orderbtn_3: [{
text: '联系客服',
state: 'service',
style: {
border: '1px solid #E3E3E3 !important',
color: '#666666 !important',
backgroundColor: '#FFFFFF !important'
}
}],
}
},
service:()=>{
const isWechat = getApp()['globalData']['parameters']?.isWechat;
console.log('是否小程序环境', getApp()['globalData']['parameters']);
if (isWechat) {
wx.miniProgram.navigateTo({
url: `/pages/wxpay/openCustomerServiceChat?url=${KFCSERVICE}`
});
return;
};
location.href = `https://work.weixin.qq.com/kfid/kfc2f4d0cb26562ffe1`;
},
share:()=>{
wx.miniProgram.postMessage({
data:{
title: '这里有一份超值肯德基补贴券,分享给你哦!生活好滋味,尽在肯德基。',
imageUrl:'https://img.agrimedia.cn/chwl/v2/KFC_share.jpg',
ISH5:true,
CallbackUrl:'https://jc.agrimedia.cn/privilege/pages/restaurant/index/index_kdj',
}
});
},
},
// 奈雪的茶配置
Brand_2: {
BrandName:'奈雪的茶',
ThemeColor: '#a7d500',
tabBar: {
// 文字颜色
color: '#999999',
// 选中文字颜色
selectedColor: '#a7d500',
// 底部导航背景色
backgroundColor: '#FFFFFF',
// 选项
list: [{
// 标题
title: '选择餐厅',
// 图片路径
iconPath: 'https://img.agrimedia.cn/chwl/xbk/xbk_home.png',
// 激活的图片路径
selectedIconPath: 'https://img.agrimedia.cn/chwl/xbk/xbk_home.png'
}, {
// 标题
title: '我的订单(查看口令)',
// 图片路径
iconPath: 'https://img.agrimedia.cn/chwl/xbk/xbk_orders.png',
// 激活的图片路径
selectedIconPath: 'https://img.agrimedia.cn/chwl/xbk/xbk_orders.png',
}],
},
// 自定义样式
customStyle: {
// 自定义普通按钮样式
BtnStyle: [{
color: '#FFFFFF',
backgroundColor: '#a7d500',
}],
// 订单图标,订单详情中展示的(仅支持星巴克/瑞星类似样式)
OrderStatus: {
// 七牛云标识
http: 'xbk',
// 待出餐
OrderStatus1: 'Unpaid.png',
// 待结算
OrderStatus0: 'Unpaid.png',
// 已经关闭
OrderStatus5: 'cancel.png',
},
// 订单按钮样式
OrderBtnStyle: {
// 未支付-按钮样式
orderbtn_0: [{
text: '取消订单',
state: 'cancel',
style: {
border: '1px solid #E3E3E3 !important',
color: '#666666 !important',
backgroundColor: '#FFFFFF !important'
}
},
{
text: '立即支付',
state: 'pay',
style: {
border: '1px solid #a7d500 !important',
color: '#FFFFFF !important',
backgroundColor: '#a7d500 !important'
}
}
],
// 订单关闭-按钮样式
orderbtn_5: [{
text: '联系客服',
state: 'service',
style: {
border: '1px solid #E3E3E3 !important',
color: '#666666 !important',
backgroundColor: '#FFFFFF !important'
}
}, {
text: '重新下单',
state: 'again',
style: {
border: '1px solid #a7d500 !important',
color: '#FFFFFF !important',
backgroundColor: '#a7d500 !important'
}
}],
// 待出餐-按钮样式
orderbtn_1: [{
text: '联系客服',
state: 'service',
style: {
border: '1px solid #E3E3E3 !important',
color: '#666666 !important',
backgroundColor: '#FFFFFF !important'
}
}],
// 已出餐-按钮样式
orderbtn_2: [{
text: '查看口令',
state: 'code',
style: {
border: '1px solid #a7d500 !important',
color: '#FFFFFF !important',
backgroundColor: '#a7d500 !important'
}
}],
// 已出餐-部分退款-按钮样式
orderbtn_4: [{
text: '查看口令',
state: 'code',
style: {
border: '1px solid #a7d500 !important',
color: '#FFFFFF !important',
backgroundColor: '#a7d500 !important'
}
}],
// 已退款-按钮样式
orderbtn_3: [{
text: '联系客服',
state: 'service',
style: {
border: '1px solid #E3E3E3 !important',
color: '#666666 !important',
backgroundColor: '#FFFFFF !important'
}
}],
}
},
service:()=>{
const isWechat = getApp()['globalData']['parameters']?.isWechat;
console.log('是否小程序环境', getApp()['globalData']['parameters']);
if (isWechat) {
wx.miniProgram.navigateTo({
url: `/pages/wxpay/openCustomerServiceChat?url=${KFCSERVICE}`
});
return;
};
location.href = `https://work.weixin.qq.com/kfid/kfc2f4d0cb26562ffe1`;
},
share:()=>{
wx.miniProgram.postMessage({
data:{
title: '奈雪的茶——人生亦如茶,经历沉浮,方能回甘,喝奈雪,点这里',
imageUrl:'https://img.agrimedia.cn/chwl/nx/nxshare.jpg',
ISH5:true,
CallbackUrl:'https://jc.agrimedia.cn/privilege/pages/restaurant/index/index_nx',
}
});
},
},
// 麦当劳配置配置
Brand_5: {
BrandName:'麦当劳',
ThemeColor: '#FFBC0F',
tabBar: {
// 文字颜色
color: '#999999',
// 选中文字颜色
selectedColor: '#FFBC0F',
// 底部导航背景色
backgroundColor: '#FFFFFF',
// 选项
list: [{
// 标题
title: '选择餐厅',
// 图片路径
iconPath: 'https://img.agrimedia.cn/chwl/mdl/navb.png',
// 激活的图片路径
selectedIconPath: 'https://img.agrimedia.cn/chwl/mdl/nava.png'
}, {
// 标题
title: '我的订单(查看取餐码)',
// 图片路径
iconPath: 'https://img.agrimedia.cn/chwl/mdl/navd.png',
// 激活的图片路径
selectedIconPath: 'https://img.agrimedia.cn/chwl/mdl/navc.png',
}],
},
// 自定义样式
customStyle: {
BtnStyle: [{
color: '#FFFFFF',
backgroundColor: '#FFBC0D',
}],
// 订单按钮样式
OrderBtnStyle: {
// 未支付-按钮样式
orderbtn_0: [{
text: '取消订单',
state: 'cancel',
style: {
border: '1px solid #E3E3E3 !important',
color: '#666666 !important',
backgroundColor: '#FFFFFF !important'
}
},
{
text: '立即支付',
state: 'pay',
style: {
border: '1px solid #FFBC0D !important',
color: '#333333 !important',
backgroundColor: '#FFBC0D !important'
}
}
],
// 订单关闭-按钮样式
orderbtn_5: [{
text: '重新下单',
state: 'again',
style: {
border: '1px solid #E3E3E3 !important',
color: '#666666 !important',
backgroundColor: '#FFFFFF !important'
}
}],
// 待出餐-按钮样式
orderbtn_1: [{
text: '联系客服',
state: 'service',
style: {
border: '1px solid #E3E3E3 !important',
color: '#666666 !important',
backgroundColor: '#FFFFFF !important'
}
}],
// 已出餐-按钮样式
orderbtn_2: [{
text: '查看取餐码',
state: 'code',
style: {
border: '1px solid #FFBC0D !important',
color: '#333333 !important',
backgroundColor: '#FFBC0D !important'
}
}],
// 已出餐-部分退款-按钮样式
orderbtn_4: [{
text: '查看取餐码',
state: 'code',
style: {
border: '1px solid #FFBC0D !important',
color: '#333333 !important',
backgroundColor: '#FFBC0D !important'
}
}],
// 已退款-按钮样式
orderbtn_3: [{
text: '联系客服',
state: 'service',
style: {
border: '1px solid #E3E3E3 !important',
color: '#666666 !important',
backgroundColor: '#FFFFFF !important'
}
}],
}
},
service:()=>{
const isWechat = getApp()['globalData']['parameters']?.isWechat;
console.log('是否小程序环境', getApp()['globalData']['parameters']);
if (isWechat) {
wx.miniProgram.navigateTo({
url: `/pages/wxpay/openCustomerServiceChat?url=${KFCSERVICE}`
});
return;
};
location.href = `https://work.weixin.qq.com/kfid/kfc2f4d0cb26562ffe1`;
},
share:()=>{
wx.miniProgram.postMessage({
data:{
title: '麦当劳——欢欢笑笑常常麦当劳,点这里,享优惠哦~',
imageUrl:'https://img.agrimedia.cn/chwl/mdl/mdlshare.jpg',
ISH5:true,
CallbackUrl:'https://jc.agrimedia.cn/privilege/pages/restaurant/index/index_kdj',
}
});
},
},
// 星巴克
Brand_10: {
BrandName:'星巴克',
ThemeColor: '#00AF66',
tabBar: {
// 文字颜色
color: '#999999',
// 选中文字颜色
selectedColor: '#00AF66',
// 底部导航背景色
backgroundColor: '#FFFFFF',
// 选项
list: [{
// 标题
title: '选择餐厅',
// 图片路径
iconPath: 'https://img.agrimedia.cn/chwl/xbk/xbk_home.png',
// 激活的图片路径
selectedIconPath: 'https://img.agrimedia.cn/chwl/xbk/xbk_home.png'
}, {
// 标题
title: '我的订单(查看口令)',
// 图片路径
iconPath: 'https://img.agrimedia.cn/chwl/xbk/xbk_orders.png',
// 激活的图片路径
selectedIconPath: 'https://img.agrimedia.cn/chwl/xbk/xbk_orders.png',
}],
},
// 自定义样式
customStyle: {
// 自定义普通按钮样式
BtnStyle: [{
color: '#FFFFFF',
backgroundColor: '#00AF66',
}],
// 订单图标,订单详情中展示的(仅支持星巴克/瑞星类似样式)
OrderStatus: {
// 七牛云标识
http: 'xbk',
// 待出餐
OrderStatus1: 'Unpaid.png',
// 待结算
OrderStatus0: 'Unpaid.png',
// 已经关闭
OrderStatus5: 'cancel.png',
},
// 订单按钮样式
OrderBtnStyle: {
// 未支付-按钮样式
orderbtn_0: [{
text: '取消订单',
state: 'cancel',
style: {
border: '1px solid #E3E3E3 !important',
color: '#666666 !important',
backgroundColor: '#FFFFFF !important'
}
},
{
text: '立即支付',
state: 'pay',
style: {
border: '1px solid #00AF66 !important',
color: '#FFFFFF !important',
backgroundColor: '#00AF66 !important'
}
}
],
// 订单关闭-按钮样式
orderbtn_5: [{
text: '联系客服',
state: 'service',
style: {
border: '1px solid #E3E3E3 !important',
color: '#666666 !important',
backgroundColor: '#FFFFFF !important'
}
}, {
text: '重新下单',
state: 'again',
style: {
border: '1px solid #00AF66 !important',
color: '#FFFFFF !important',
backgroundColor: '#00AF66 !important'
}
}],
// 待出餐-按钮样式
orderbtn_1: [{
text: '联系客服',
state: 'service',
style: {
border: '1px solid #E3E3E3 !important',
color: '#666666 !important',
backgroundColor: '#FFFFFF !important'
}
}],
// 已出餐-按钮样式
orderbtn_2: [{
text: '查看口令',
state: 'code',
style: {
border: '1px solid #00AF66 !important',
color: '#FFFFFF !important',
backgroundColor: '#00AF66 !important'
}
}],
// 已出餐-部分退款-按钮样式
orderbtn_4: [{
text: '查看口令',
state: 'code',
style: {
border: '1px solid #00AF66 !important',
color: '#FFFFFF !important',
backgroundColor: '#00AF66 !important'
}
}],
// 已退款-按钮样式
orderbtn_3: [{
text: '联系客服',
state: 'service',
style: {
border: '1px solid #E3E3E3 !important',
color: '#666666 !important',
backgroundColor: '#FFFFFF !important'
}
}],
}
},
service:()=>{
const isWechat = getApp()['globalData']['parameters']?.isWechat;
console.log('是否小程序环境', getApp()['globalData']['parameters']);
if (isWechat) {
wx.miniProgram.navigateTo({
url: `/pages/wxpay/openCustomerServiceChat?url=${KFCSERVICE}`
});
return;
};
location.href = `https://work.weixin.qq.com/kfid/kfc2f4d0cb26562ffe1`;
},
share:()=>{
wx.miniProgram.postMessage({
data:{
title: '和你一起来享受星巴克时光 ,美好生活快来点这里有折扣哦',
imageUrl:'https://img.agrimedia.cn/chwl/xbk/xbk_sharing.jpg',
ISH5:true,
CallbackUrl:'https://jc.agrimedia.cn/privilege/pages/restaurant/index/index_xbk',
}
});
},
},
// 瑞幸
Brand_13: {
BrandName:'瑞幸咖啡',
ThemeColor: '#4A6FE7',
tabBar: {
// 文字颜色
color: '#999999',
// 选中文字颜色
selectedColor: '#4A6FE7',
// 底部导航背景色
backgroundColor: '#FFFFFF',
// 选项
list: [{
// 标题
title: '选择餐厅',
// 图片路径
iconPath: 'https://img.agrimedia.cn/chwl/rx/rx_home2.png',
// 激活的图片路径
selectedIconPath: 'https://img.agrimedia.cn/chwl/rx/rx_home1.png'
}, {
// 标题
title: '我的订单(查看口令)',
// 图片路径
iconPath: 'https://img.agrimedia.cn/chwl/rx/rx_order2.png',
// 激活的图片路径
selectedIconPath: 'https://img.agrimedia.cn/chwl/rx/rx_order1.png',
}],
},
// 自定义样式
customStyle: {
// 自定义普通按钮样式
BtnStyle: [{
color: '#FFFFFF',
background: 'linear-gradient(-77deg, #4A6FE7, #83ACFF)',
}],
// 订单图标,订单详情中展示的(仅支持星巴克/瑞星类似样式)
OrderStatus: {
// 七牛云标识
http: 'rx',
// 待出餐
OrderStatus1: 'NotServed.png',
// 待结算
OrderStatus0: 'Unpaid.png',
// 已经关闭
OrderStatus5: 'cancel.png',
},
// 订单按钮样式
OrderBtnStyle: {
// 未支付-按钮样式
orderbtn_0: [{
text: '取消订单',
state: 'cancel',
style: {
border: '1px solid #E3E3E3 !important',
color: '#666666 !important',
backgroundColor: '#FFFFFF !important'
}
},
{
text: '立即支付',
state: 'pay',
style: {
border: '1px solid #4A6FE7 !important',
color: '#4A6FE7 !important',
backgroundColor: '#FFFFFF !important'
}
}
],
// 订单关闭-按钮样式
orderbtn_5: [{
text: '联系客服',
state: 'service',
style: {
border: '1px solid #E3E3E3 !important',
color: '#666666 !important',
backgroundColor: '#FFFFFF !important'
}
}, {
text: '重新下单',
state: 'again',
style: {
border: '1px solid #4A6FE7 !important',
color: '#4A6FE7 !important',
backgroundColor: '#FFFFFF !important'
}
}],
// 待出餐-按钮样式
orderbtn_1: [{
text: '联系客服',
state: 'service',
style: {
border: '1px solid #E3E3E3 !important',
color: '#666666 !important',
backgroundColor: '#FFFFFF !important'
}
}],
// 已出餐-按钮样式
orderbtn_2: [{
text: '查看口令',
state: 'code',
style: {
border: '1px solid #4A6FE7 !important',
color: '#4A6FE7 !important',
backgroundColor: '#FFFFFF !important'
}
}],
// 已出餐-部分退款-按钮样式
orderbtn_4: [{
text: '查看口令',
state: 'code',
style: {
border: '1px solid #4A6FE7 !important',
color: '#4A6FE7 !important',
backgroundColor: '#FFFFFF !important'
}
}],
// 已退款-按钮样式
orderbtn_3: [{
text: '联系客服',
state: 'service',
style: {
border: '1px solid #E3E3E3 !important',
color: '#666666 !important',
backgroundColor: '#FFFFFF !important'
}
}],
}
},
service:()=>{
const isWechat = getApp()['globalData']['parameters']?.isWechat;
console.log('是否小程序环境', getApp()['globalData']['parameters']);
if (isWechat) {
wx.miniProgram.navigateTo({
url: `/pages/wxpay/openCustomerServiceChat?url=${KFCSERVICE}`
});
return;
};
location.href = `https://work.weixin.qq.com/kfid/kfc2f4d0cb26562ffe1`;
},
share:()=>{
wx.miniProgram.postMessage({
data:{
title: '美好时光一起小蓝杯一起瑞幸点击这里尽享5折哦',
imageUrl:'https://img.agrimedia.cn/chwl/rx/RX_share.jpg',
ISH5:true,
CallbackUrl:'https://jc.agrimedia.cn/privilege/pages/restaurant/index/index_rx',
}
});
},
},
// 定制DIY
Brand_30: {
BrandName:'定制',
ThemeColor: '#4A6FE7',
tabBar: {
// 文字颜色
color: '#999999',
// 选中文字颜色
selectedColor: '#4A6FE7',
// 底部导航背景色
backgroundColor: '#FFFFFF',
// 选项
list: [{
// 标题
title: '选择餐厅',
// 图片路径
iconPath: 'https://img.agrimedia.cn/chwl/rx/rx_home2.png',
// 激活的图片路径
selectedIconPath: 'https://img.agrimedia.cn/chwl/rx/rx_home1.png'
}, {
// 标题
title: '我的订单(查看口令)',
// 图片路径
iconPath: 'https://img.agrimedia.cn/chwl/rx/rx_order2.png',
// 激活的图片路径
selectedIconPath: 'https://img.agrimedia.cn/chwl/rx/rx_order1.png',
}],
},
// 自定义样式
customStyle: {
// 自定义普通按钮样式
BtnStyle: [{
color: '#FFFFFF',
background: 'linear-gradient(-77deg, #4A6FE7, #83ACFF)',
}],
// 订单图标,订单详情中展示的(仅支持星巴克/瑞星类似样式)
OrderStatus: {
// 七牛云标识
http: 'diy',
// 待付款
OrderStatus0: 'Tobepaid.png',
// 待发货
OrderStatus1: 'Consignment.png',
// 已发货
OrderStatus2: 'Shipped.png',
// 已取消
OrderStatus3: 'cancel.png',
// 已完成
OrderStatus5: 'complete.png',
// 已退款
OrderStatus6: 'refund.png',
},
// 订单按钮样式
OrderBtnStyle: {
// 未支付-按钮样式
orderbtn_0: [{
text: '取消订单',
state: 'cancel',
style: {
border: '1px solid #E3E3E3 !important',
color: '#666666 !important',
backgroundColor: '#FFFFFF !important'
}
},
{
text: '立即支付',
state: 'pay',
style: {
border: '1px solid #4A6FE7 !important',
color: '#4A6FE7 !important',
backgroundColor: '#FFFFFF !important'
}
}
],
// 订单关闭-按钮样式
orderbtn_5: [{
text: '联系客服',
state: 'service',
style: {
border: '1px solid #E3E3E3 !important',
color: '#666666 !important',
backgroundColor: '#FFFFFF !important'
}
}],
// 已退款-按钮样式
orderbtn_6: [{
text: '联系客服',
state: 'service',
style: {
border: '1px solid #E3E3E3 !important',
color: '#666666 !important',
backgroundColor: '#FFFFFF !important'
}
}],
}
},
service:()=>{
const isWechat = getApp()['globalData']['parameters']?.isWechat;
console.log('是否小程序环境', getApp()['globalData']['parameters']);
if (isWechat) {
wx.miniProgram.navigateTo({
url: `/pages/wxpay/openCustomerServiceChat?url=${KFCSERVICE}`
});
return;
};
location.href = `https://work.weixin.qq.com/kfid/kfc2f4d0cb26562ffe1`;
}
},
// 因为点餐底部导航原因所以将所有一级页面写为选项卡切换类型,此时顶部导航需要根据切换页面经行变更
btnnav: [{
title: '选择餐厅',
icon: 'https://img.agrimedia.cn/chwl/navb.png',
activation: 'https://img.agrimedia.cn/chwl/nava.png',
},
{
title: '我的订单',
icon: 'https://img.agrimedia.cn/chwl/navd.png',
activation: 'https://img.agrimedia.cn/chwl/navc.png',
}
],
mdlbtnnav: [{
title: '选择餐厅',
icon: 'https://img.agrimedia.cn/chwl/mdl/navb.png',
activation: 'https://img.agrimedia.cn/chwl/mdl/nava.png',
},
{
title: '我的订单',
icon: 'https://img.agrimedia.cn/chwl/mdl/navd.png',
activation: 'https://img.agrimedia.cn/chwl/mdl/navc.png',
}
],
// 星巴克底部导航
xbkbtnnav: [{
title: '选择餐厅',
activation: 'https://img.agrimedia.cn/chwl/xbk/xbk_home.png'
},
{
title: '我的订单',
activation: 'https://img.agrimedia.cn/chwl/xbk/xbk_orders.png'
}
],
// 餐厅暂停营业默认提示
suspend: {
show: false,
content: '为保障健康、安全与质量的服务,本餐厅即时起暂停营业,恢复日期将另行通知,感谢您的谅解。'
},
// 肯德基店铺详情首次进入提示
KFCShopHint: {
title: '温馨提示',
content: '肯德基点餐为第三方供应商提供的代下单服务,当您支付后,请凭借取餐码等候门店屏幕的显示即可取餐。如有疑问请在订单列表里联系客服。'
}
};
export default config

View File

@ -0,0 +1,27 @@
import Vue from 'vue';
Vue.directive('skeleton', {
inserted: function(el, binding, vnode, oldVnode) {
// console.log(el, 'inserted');
// console.log(binding, 'inserted');
// console.log(vnode, 'inserted');
// console.log(oldVnode, 'inserted');
},
bind: function(el, binding, vnode, oldVnode) {
console.log(el, 'bind');
console.log(binding, 'bind');
console.log(vnode, 'bind');
console.log(oldVnode, 'bind');
},
unbind: function(el, binding, vnode, oldVnode) {
console.log(el, 'unbind');
console.log(binding, 'unbind');
console.log(vnode, 'unbind');
console.log(oldVnode, 'unbind');
},
componentUpdated: function(el, binding, vnode, oldVnode) {
console.log(el, 'componentUpdated');
console.log(binding, 'componentUpdated');
console.log(vnode, 'componentUpdated');
console.log(oldVnode, 'componentUpdated');
},
})

View File

@ -0,0 +1,20 @@
const _H5 = class H5 {
navigateTo({ url, para}) {
// 组合参数
if (typeof para !== 'undefined') {
for (let key in para) {
if (url.indexOf('?') == -1) {
url += `?${key}=${para[key]}`;
continue;
};
url += `&${key}=${para[key]}`
}
};
wx.miniProgram.navigateTo({
url
});
}
}
uni.uH5 = new _H5();

View File

@ -0,0 +1,61 @@
let Detectionlocations = class Detectionlocation{
SystemInfo = '';
/**
* @获取设备GPS是否开启
*/
GetSystemInfoGps(){
this['SystemInfo'] = uni.getSystemInfoSync();
console.log(this['SystemInfo'],this['SystemInfo']['locationEnabled'],'检查设备是否开启GPS');
let self = this;
if (!this['SystemInfo']['locationEnabled']){
console.log('未开启GPS')
uni.showModal({
title: "温馨提示",
content: "亲我们未获得您的位置信息授权请确认手机GPS是否开启",
confirmText: '我已开启',
showCancel: false,
success(res) {
if (res.confirm == true) {
// 点击已开启之后检测系统定位是否真正开启
self.GetSystemInfoGps();
}
}
})
}else{
console.log('已未开启GPS')
this.WXlocationAuthorized();
}
}
/**
* @微信是否开启定位权限
*/
WXlocationAuthorized(){
console.log('检查微信应用是否开启定位权限');
if(!this['SystemInfo']['locationAuthorized']){
console.log('微信应用未开启定位权限');
uni.showModal({
title: "温馨提示",
content: "您的微信应用未开启定位权限,请开启后再试",
confirmText: '好的',
showCancel: false,
success(res) {
if (res.confirm == true) {
console.log(self,'未开启')
// 点击已开启之后检测系统定位是否真正开启
self.WXlocationAuthorized();
}
}
})
}else{
console.log('微信应用已开启定位权限');
}
}
}
export default Detectionlocations;

View File

@ -0,0 +1,286 @@
// var jweixin = require('jweixin-module');
import {
GetPaypackageInfor,
makeMinUrlAPI,
getPayParamsAPI
} from '@/request/pay/index.js';
import store from '@/store/index';
import state from '@/store/index';
class Payment {
static order_sn = 0
/**
* @param {String} pay_price 支付金额
* @param {String} order_sn 订单号
* @param {String} type 支付类型
* @param {String} return_url 支付时H5内部跳转路径
* @param {String} redirect 是否关闭调起支付的页面
* 该方法没有支付失败和成功回调函数必须由微信支付完成之后跳转至指定页面去查询订单状态然后根据订单状态再跳转值业务页面
*/
// H5拉起微信支付
H5TOWX_Payment(data) {
console.log(data, '111111')
uni.showLoading({
title: '支付中...'
});
const {
datas,
shopInfo,
computedTotal,
GetShopInfor,
amountInfo,
return_url,
payData,
HeadersData,
redirect=false,
PAY_TYPE='1',
success = () => {},
file = () => {}
} = data;
// 下单信息
const OrderData = datas;
const ShopInfo = shopInfo;
// 判断是微信支付还是支付宝支付
if(PAY_TYPE == '1'){
// 微信内嵌WEBVIEW方式进入H5页面
OrderData['WechatRetreat'] = true;
// 先跳转至微信支付页面
try{
// 地区码带入
if (data.HeadersData && state.getters?.GetcityInfor?.adcode) {
data.HeadersData.adcode = state.getters.GetcityInfor.adcode;
}
const navigateParams = {
data: OrderData,
shopInfo: shopInfo,
GetShopInfor: GetShopInfor,
amountInfo: amountInfo,
token: store.getters.GetToken,
payData: data.payData,
HeadersData: data.HeadersData
};
const queryString = Object.entries(navigateParams)
.map(([key, value]) => `${key}=${encodeURIComponent(JSON.stringify(value))}`)
.join('&');
wx.miniProgram.navigateTo({
url: `/pages/extension/shop/wxPay/wxPay?${queryString}`
});
setTimeout(()=>{
uni.hideLoading();
// 支付完成返回点餐首页
window.history.back();
// if(return_url){
// // 是否需要关闭调起支付的页面
// if(redirect){
// uni.redirectTo({
// url:return_url
// });
// }else{
// uni.navigateTo({
// url:return_url
// })
// }
// }
uni.hideLoading();
},2000)
}catch(e){
console.log(e)
uni.hideLoading();
//TODO handle the exception
uni.showToast({
title:'支付错误',
icon:'none'
})
}
}else{
OrderData['WechatRetreat'] = true;
window.location.href=`https://ds.alipay.com/?scheme=${encodeURIComponent(`alipays://platformapi/startapp?appId=2021003130603407&page=pages/wxpay/h5pay/h5pay?data=${encodeURIComponent(JSON.stringify(OrderData))}`)}`
// window.location.href = `https://ds.alipay.com/?scheme=alipays://platformapi/startapp?appId=2021003130603407&page=pages/wxpay/h5pay/h5pay?data=${encodeURIComponent(JSON.stringify(OrderData))}`;
// 支付宝支付
// this.WX_Pay(data);
}
}
/**
* @param {String} data 支付参数
* H5跳转收银台
*/
H5TOWX_WEB(data) {
// window.location.href = ` http://10.210.254.149:8081/h5_pay/?token=${store.state.app.token}&order_id=${res.data.result.orderId}&from_type=order`;
}
/**
* @param {String} pay_price 支付金额
* @param {String} order_sn 订单号
* @param {String} type 支付类型
* @param {String} return_url 支付时H5内部跳转路径
* @param {String} redirect 是否关闭调起支付的页面
* 该方法没有支付失败和成功回调函数必须由微信支付完成之后跳转至指定页面去查询订单状态然后根据订单状态再跳转值业务页面
*/
H5_Payment(data) {
uni.showLoading({
title: '支付中...'
});
const {
pay_price,
order_sn,
type,
return_url,
openid,
redirect=false,
PAY_TYPE = '1',
success = () => {},
file = () => {}
} = data;
if (!pay_price) throw new Error('缺少支付金额');
if (!order_sn) throw new Error('缺少订单号');
if (!type) throw new Error('缺少支付类型');
// 下单信息
const OrderData = {
pay_price,
order_sn,
type,
openid
};
// 判断是微信支付还是支付宝支付
if(PAY_TYPE == '1'){
// 微信内嵌WEBVIEW方式进入H5页面
if(getApp()['globalData']['parameters']?.isWechat){
OrderData['WechatRetreat'] = true;
// 先跳转至微信支付页面
try{
// wx.miniProgram.navigateTo({
// url: `/pages/wxpay/h5pay/h5pay?data=${encodeURIComponent(JSON.stringify(OrderData))}`
// });
wx.miniProgram.navigateTo({
url: `/pages/extension/shop/wxPay/wxPay?data=${encodeURIComponent(JSON.stringify(OrderData))}`
}); // Jin
// 延迟两秒后H5内部跳转
setTimeout(()=>{
uni.hideLoading();
if(return_url){
// 是否需要关闭调起支付的页面
if(redirect){
uni.redirectTo({
url:return_url
});
}else{
uni.navigateTo({
url:return_url
})
}
}
},2000)
}catch(e){
uni.hideLoading();
//TODO handle the exception
uni.showToast({
title:'支付错误',
icon:'none'
})
}
}else{
OrderData['WechatRetreat'] = false;
openMiniProgram({
path: `pages/wxpay/h5pay/h5pay?data=${encodeURIComponent(JSON.stringify(OrderData))}`,
id: 'gh_faaea9b90759',
// type: 'release',
type: 'preview'
})
// 其他方式进入H5页面(APP)
// 反之使用跳转连接进入
// makeMinUrlAPI({
// path :'/pages/wxpay/h5pay/h5pay',
// query:`data=${encodeURIComponent(JSON.stringify(OrderData))}`,
// // uu_id:17551,
// // release 正式版
// // trial 测试版
// // develop 开发板
// env_version:'develop',
// }).then(res=>{
// // console.log(res);
// console.log(res['data']['openlink'],'openlink');
// // return
// location.href = res['data']['openlink'];
// // 延迟两秒后H5内部跳转
setTimeout(()=>{
uni.hideLoading();
if(return_url){
// 是否需要关闭调起支付的页面
if(redirect){
uni.redirectTo({
url:return_url
});
}else{
uni.navigateTo({
url:return_url
})
}
}
},2000)
// })
}
}else{
OrderData['WechatRetreat'] = true;
window.location.href=`https://ds.alipay.com/?scheme=${encodeURIComponent(`alipays://platformapi/startapp?appId=2021003130603407&page=pages/wxpay/h5pay/h5pay?data=${encodeURIComponent(JSON.stringify(OrderData))}`)}`
// window.location.href = `https://ds.alipay.com/?scheme=alipays://platformapi/startapp?appId=2021003130603407&page=pages/wxpay/h5pay/h5pay?data=${encodeURIComponent(JSON.stringify(OrderData))}`;
// 支付宝支付
// this.WX_Pay(data);
}
}
// 支付宝支付
App_Pay(){
// 获取支付包信息
}
// 再次支付
/**
* @param {String} order_sn 再次支付订单号
* @param {String} type 再次支付订单类型
* @param {String} return_url 再次支付回跳地址
*/
Repayment(data){
getPayParamsAPI({
order_sn:data['order_sn'],
type:data['type']
}).then(res=>{
console.log({});
this.H5_Payment({
// 此处将传入数据与接口数据合并,重复则替换为后者
...data,...res['data']
})
})
}
set PayOrder(value){
this['order_sn'] = value;
}
// 获取当前执行支付的订单号
get PayOrder(){
return this['order_sn']
}
}
const install = (Vue) => {
Vue.prototype.$Payment = new Payment();
}
export default {
install
};

View File

@ -0,0 +1,175 @@
// 点餐结算页面的优惠结算逻辑
// 原价
let prices = 0;
// 实际付款
let payments = 0;
// 消费卡抵扣金额
let Actualamounts = 0;
export default {
computed: {
// 核心计算
calculationamount() {
console.log('进入计算');
// 该计算中所输出的打印均为出问题之后方便调试勿删
/**
* @param {already_deduction_amount} 属性是为了构建逻辑计算展示该商品实际抵扣的金额
* @param {deduction_amount} 需要提交给后台的单个商品优化价格
* @param {Discountarrcondition} 是否显示余额不足提示
* @param {max_deduction} 每个商品的最大优惠价格
* @param {is_deduction} 单个商品是否优惠
* @param {FormData['is_deduction']} 整个订单是否有优惠
* @param {FormData['deduction_amount_total']} 整个订单的优惠价格
* */
if (this['FormInfor']['products'] <= 0) return {
// 原价
prices,
// 实际付款
payments,
// 消费卡抵扣金额
Actualamounts,
};
let amount = this['amount'];
console.log(this['FormInfor']['products'],'products');
// 取出当前勾选的商品
let Deductionarr = this['FormInfor']['products'].filter(item => {
if (item['is_deduction']) {
return item
}
});
// 取出当前未勾选的商品
let noDeductionarr = this['FormInfor']['products'].filter(item => {
if (!item['is_deduction']) {
// 将未选择优惠的商品的实际抵扣价格补回余额中
amount += item['deduction_amount'];
// 将实际补扣优惠归零
item['deduction_amount'] = 0;
return item
}
});
// 勾选商品计算逻辑
for (var i = 0; i < Deductionarr['length']; i++) {
let item = Deductionarr[i];
let max_deduction = (item['max_deduction'] * item['num']);
// item['is_deduction'] = 1;
console.log('当前选择优惠商品', item);
console.log('当前余额', amount)
/**
* @如果当前商品的实际抵扣金额大于等于最大优惠金额则代表已经计算过了直接跳过当前循环进入下一个循环
* */
if (item['deduction_amount'] >= max_deduction) {
console.log('当前选择优惠商品优惠条件满足跳出');
console.log(`当前选择优惠商品实际抵扣金额${item['deduction_amount']}`);
console.log(`当前选择优惠商品展示优惠金额${item['already_deduction_amount']}`);
item['Discountarrcondition'] = false;
continue;
};
/**
* @如果当前商品的实际抵扣金额小于最大优惠金额则代表当前商品为余额不足状态
* */
if (item['deduction_amount'] < max_deduction) {
console.log('当前选择优惠商品为不足抵扣状态');
console.log(`当前商品实际抵扣金额${item['deduction_amount']}`);
/**
* @最大抵扣金额减去已经抵扣的金额得到需要补的优惠金额
* */
let repair = max_deduction - item['deduction_amount'];
console.log(`当前商品需补优惠金额${repair}`);
if (amount >= repair) {
console.log('当前余额大于需要补的优惠金额');
item['deduction_amount'] += repair;
item['Discountarrcondition'] = false;
amount -= repair;
} else if (amount < repair) {
console.log('当前余额小于于需要补的优惠金额');
item['deduction_amount'] += amount;
item['Discountarrcondition'] = true;
amount = 0;
}
// 展示金额最后计算完毕之后再设置,一切以deduction_amount实际抵扣金额为标准
item['already_deduction_amount'] = item['deduction_amount'];
console.log(`当前商品补完优惠金额之后剩余余额${amount}`);
console.log(`当前商品补完优惠金额之后的实际补贴金额${item['deduction_amount']}`);
console.log(`当前商品补完优惠金额之后的展示补贴金额${item['already_deduction_amount']}`);
}
};
// 未勾选商品计算逻辑
for (var i = 0; i < noDeductionarr['length']; i++) {
let item = noDeductionarr[i];
let max_deduction = (item['max_deduction'] * item['num']);
console.log('当前未选择优惠商品', item);
console.log('当前余额', amount)
/**
* @剩余余额足够抵扣当前商品则展示可抵扣金额
* */
if (amount >= max_deduction) {
console.log(`当前余额足够抵扣未勾选优惠的第${i}个商品`);
item['already_deduction_amount'] = max_deduction;
// 隐藏余额不足提示
item['Discountarrcondition'] = false;
} else {
console.log(`当前余额不足够抵扣未勾选优惠的第${i}个商品`);
// 剩余余额不足够抵扣当前商品则将剩余余额补到展示抵扣上
item['already_deduction_amount'] = amount;
item['Discountarrcondition'] = true;
}
console.log(
`当前未勾选优惠的第${i}个商品的展示优惠${item['already_deduction_amount']}和实际抵扣优惠${item['deduction_amount']}`);
}
// 计算消费卡抵扣
Actualamounts = this['FormInfor']['products'].map(item => {
if (item['is_deduction']) {
return item['deduction_amount'];
}
return 0
}).reduce((total, currentValue) => {
return total + currentValue;
});
// 计算原价
prices = this['FormInfor']['products'].map(item => {
return item['bt_price'] * item['num']
// if(this['BrandInfor']['brand_id'] == 10 || this['BrandInfor']['brand_id'] == 2){
// ;
// }else{
// return item['pay_price'] * item['num'];
// }
}).reduce((total, currentValue) => {
return total + currentValue;
});
this['amount'] = amount;
this['FormInfor']['is_deduction'] = Deductionarr['length'] > 0 ? 1 : 0;
this['FormInfor']['deduction_amount_total'] = Actualamounts;
payments = prices - Actualamounts;
return {
// 原价
prices,
// 实际付款
payments,
// 消费卡抵扣金额
Actualamounts,
};
},
// 计算佣金
commission() {
try {
let _m = this['FormInfor']['products'].map(item => {
return item['self_commission'] * item['num']
}).reduce((total, currentValue) => {
return total + currentValue;
});
return this.RetainDecimalPoints({
num:String(_m),
toFixed:4,
iscarry:false
})
} catch (e) {
return 0
}
},
}
}

View File

@ -0,0 +1,102 @@
import {
mapGetters,
mapMutations,
mapActions,
mapState
} from 'vuex';
export default {
computed: {},
methods: {
// 判断时间是否超过一个小时
isMoreOneTime(time) {
let a = new Date(time).getTime()
let b = new Date().getTime()
let hours = parseInt((a - b));
if (hours > 3600000) { // 超过
return true
} else {
return false
}
},
// 日期转时间戳
getUnixTime(dateStr){
var date = new Date(dateStr);
var time_str = date.getTime().toString();
return time_str.substr(0, 10);
},
// 日期排序
ReverseRankingDate(data, p) {
if (data) {
for (let i = 0; i < data.length - 1; i++) {
for (let j = 0; j < data.length - 1 - i; j++) {
if (Date.parse(data[j][p]) > Date.parse(data[j+1][p])) {
var temp = data[j];
data[j] = data[j + 1];
data[j + 1] = temp;
}
}
}
return data;
}
},
//时间格式进行处理
getTime(strtime) {
let date = new Date(strtime.replace(/-/g, "/"));
// date 预计送达时间戳
date = Date.parse(date);
// 转为国际标准时间
let time = new Date(parseInt(date));
// 一共相差几天
let days = parseInt((date - new Date().getTime()) / 86400000);
// 今天是几号
let today = new Date().getDate();
let mouth = time.getMonth() + 1;
// 预计送达是几号
let day = time.getDate();
let hour = time.getHours() < 10 ? "0" + time.getHours() : time.getHours();
let min = time.getMinutes() < 10 ? "0" + time.getMinutes() : time.getMinutes();
// offset 送达日期-今天日期差
let offset = Math.abs(day - today);
let obj = {
month: `${mouth}${day}`,
// 转义
date: "",
// 具体时间
time: hour + ":" + min,
};
// 这里双重判断第一个判断days < 3是验证是否在同一个月第二个offset < 3是判断是验证相差是几天
if (days < 3 && offset < 3) {
if (offset === 0) {
obj.date = "今天";
} else if (offset === 1) {
obj.date = "明天";
} else if (offset === 2) {
obj.date = "后天";
}
} else {
obj.date = mouth + "月" + day + "日"
}
return obj;
},
// 打开微信内置地图导航
openLocation(latitude = (+this.cinemaData.latitude), longitude = (+this.cinemaData.longitude)) {
console.log(latitude, longitude);
uni.openLocation({
latitude,
longitude,
success: function() {
console.log('success');
}
});
},
},
}

View File

@ -0,0 +1,759 @@
import {
payH5API,
alipayH5API
} from '@/request/index/index.js';
import {
WXpayAPI,
WXpayDYPAPI
} from '@/request/restaurant/index.js';
import {
WXpayH5API
} from '@/request/recharge/index.js';
import {
mapMutations,
} from 'vuex';
// 客服链接
import {
RXSERVICE
} from '@/static/js/serviceurl.js';
// 公共mixins
export default {
computed: {},
// 方法
methods: {
...mapMutations(['GetState']),
// 七牛云地址拼接
qnyurl(src, address = 'v2') {
// 瑞幸咖啡图片链接
return `https://img.agrimedia.cn/chwl/${address}/${src}`;
// switch (address) {
// case 'rx':
// // 瑞幸咖啡图片链接
// return `https://img.agrimedia.cn/chwl/rx/${src}`;
// case 'xbk':
// // 瑞幸咖啡图片链接
// return `https://img.agrimedia.cn/chwl/xbk/${src}`;
// case 'mdl':
// // 麦当劳图片链接
// return `https://img.agrimedia.cn/chwl/mdl/${src}`;
// case 'fuel':
// // 加油图片连接地址
// return `https://img.agrimedia.cn/chwl/fuel/${src}`;
// case 'dyp':
// // 电影票图片连接地址
// return `https://img.agrimedia.cn/chwl/dyp/${src}`;
// default:
// // 默认返回链接
// return `https://img.agrimedia.cn/chwl/v2/${src}`;
// }
// // 注意七牛云上传地址
// return `https://img.agrimedia.cn/chwl/v2/${src}`
},
// 保留小数点
RetainDecimalPoint(num = 0, iscarry = true) {
// 保留小数点后几位
let r = 2;
// 因为该函数分为用户手动输入和后台传入方式
// 当用户手动输入的价格则不需要除以100
// 后台传入的价格是以分传入,所以需要除以一百
if (iscarry) {
num = num / 100;
}
// 转换之后的num
let s = '' + num;
// 检测传入参数是否为带小数点参数
if (s.indexOf('.') != -1) {
// 传入参数小数点不足所指定位数则补位
// 获取小数点位置
let index = s.indexOf('.');
// 拿到小数点之后有几位
let t = s.substring(index + 1, s.length);
// 如果小数点之后位数小于指定位数则补齐
if (t['length'] < r) {
for (let i = 0; i < r - t['length']; i++) {
s += '0';
}
} else {
return s.substring(0, index + 3);
}
return s;
} else {
// 是否正数
let number = /(^[1-9]\d*$)/;
// 是否为正数
if (number.test(num)) {
// 定义数组
let a = [];
// 结果
let n = '';
// 将初始值循环至数组
for (let key = 0; key < s['length']; key++) {
a.push(s[key]);
};
// 取最终值
for (let i = 0; i < a.length; i++) {
n += a[i];
if (i >= a.length - 1) {
n += '.'
for (let i = 0; i < r; i++) {
n += '0';
}
}
};
return n
} else {
return s
}
}
},
// 保留小数点2.0
// 前一个方法局限性太低,但又因为很多地方使用所以再开一个方法
/**
* @param {String} num需要处理的数据(不管是数字还是字符串最终都会先被处理成字符串)
* @param {Boolean} iscarry是否需要对数据经行除以一百此处属性用于传入的数据是价格且为单位
* @param {Number} toFixed是否需要对数据经行小数点保留处理保留的位数
* 注意:若使用了try catch,则将不会显示错误信息
*/
RetainDecimalPoints({
num = 0,
iscarry = true,
toFixed = 2
}) {
console.log(num.__proto__.constructor.name, 'numnum')
if (num.__proto__.constructor.name !== 'string' && typeof num !== 'string') {
throw '所传参数不是字符串';
return;
}
// 保留小数点后几位
toFixed = Number(toFixed)
// 因为该函数分为用户手动输入和后台传入方式
// 当用户手动输入的价格则不需要除以100
// 后台传入的价格是以分传入,所以需要除以一百
if (iscarry) {
num = '' + (num / 100);
};
// 检测传入参数是否为带小数点参数
let index = num.indexOf('.');
// 传入数据携带小数点
if (index != -1) {
// 返回数据是否需要携带小数点
if (toFixed > 0) {
// 拿到现有数据小数点之后存在几位
let _l = num.substring(index + 1, num.length);
// 如果当前数据小数点之后现存位数大于给定返回位数则截取
if (_l['length'] > toFixed) {
num = num.substring(0, (index + 1) + toFixed);
} else {
// 如果当前数据小数点之后现存位数小于给定返回位数则循环补位
for (let _i = 0; _i < toFixed - _l['length']; _i++) {
num += '0';
}
}
} else {
num = num.substring(0, index);
}
} else {
// 是否正数
let number = /(^[1-9]\d*$)/;
// 是否为正数
if (number.test(num)) {
// 定义数组
let a = [];
// 结果
let n = '';
// 将初始数值赋值至数组
a = num.split("");
// 取最终值
for (let i = 0; i < a.length; i++) {
n += a[i];
if (i >= a.length - 1) {
n += '.';
for (let i = 0; i < toFixed; i++) {
n += '0';
}
}
};
num = n;
}
};
return num;
},
// 佣金格式化
_commission(num) {
return this.RetainDecimalPoints({
num: String(num),
iscarry: false,
toFixed: 4
})
},
_fixed(num) {
return num.toFixed(2)
},
// 金额格式化(iscarrytrue)
_amount(num) {
return this.RetainDecimalPoints({
num: String(num),
iscarry: true,
toFixed: 2
})
},
// 金额格式化(iscarryfalse)
__amount(num) {
return this.RetainDecimalPoints({
num: String(num),
iscarry: false,
toFixed: 2
})
},
_deduction_prop_(deduction_price, price, key) {
// console.log(deduction_price,price,'接收');
// 补贴价格(补贴了多少钱)
const Subsidyprice = this.RetainDecimalPoints({
num: String(price * (deduction_price / 100)),
iscarry: false,
toFixed: 0
});
console.log(Subsidyprice, '补贴了多少');
// console.log(Subsidyprice,this.RetainDecimalPoints({num:Subsidyprice,iscarry:true,toFixed:2}),'Subsidyprice');
// 补贴后的价格
const AfterSubsidy = this.RetainDecimalPoints({
num: String(price - Subsidyprice),
iscarry: true,
toFixed: 2
});
console.log(AfterSubsidy, '补贴后的价格');
// console.log(AfterSubsidy,'AfterSubsidy');
const _D = {
Subsidyprice: this.RetainDecimalPoints({
num: String(Subsidyprice),
iscarry: true,
toFixed: 2
}),
AfterSubsidy
}
if (key) return _D[key];
return _D;
},
// 解决小数点精度丢失问题
calc(num1, num2, calcStr) {
var str1, // 转换为字符串的数字
str2,
ws1 = 0, // ws1ws2 用来存储传入的num的小数点后的数字的位数
ws2 = 0, // 赋默认值,解决当整数和小数运算时倍数计算错误导致的结果误差
bigger, // bigger和smaller用于加除法找出小的那个数字给后面补0解决位数不对从而造成的计算错误的问题乘法需要将结果除两个数字的倍数之和
smaller, // 例如加减除法中1.001 + 2.03 如果不给2.03进行补0最后会变成1001+203数字错位导致结果错误乘法中1.12*1.1会放大为112*11所以结果需要除以1000才会是正确的结果112*11/1000=1.232
zeroCount, // 需要补充0的个数
isExistDot1, // 传入的数字是否存在小数点
isExistDot2,
sum,
beishu = 1;
// 将数字转换为字符串
str1 = num1.toString();
str2 = num2.toString();
// 是否存在小数点(判断需要计算的数字是不是包含小数)
isExistDot1 = str1.indexOf('.') != -1 ? true : false;
isExistDot2 = str2.indexOf('.') != -1 ? true : false;
// 取小数点后面的位数
if (isExistDot1) {
ws1 = str1.split('.')[1].length;
}
if (isExistDot2) {
ws2 = str2.split('.')[1].length;
}
// 如ws1 和 ws2 无默认值如果num1 或 num2 不是小数的话则 ws1 或 ws2 的值将为 undefined
// bigger 和 smaller 的值会和预期不符
bigger = ws1 > ws2 ? ws1 : ws2;
smaller = ws1 < ws2 ? ws1 : ws2;
switch (calcStr) {
// 加减法找出小的那个数字给后面补0解决位数不对从而造成的计算错误的问题
// 例如1.001 + 2.03 如果不给2.03进行补0最后会变成1001+203数字错位导致结果错误
case "+":
case "-":
case "/":
zeroCount = bigger - smaller;
for (var i = 0; i < zeroCount; i++) {
if (ws1 == smaller) {
str1 += "0";
} else {
str2 += "0";
}
}
break;
case "*":
// 乘法需要将结果除两个数字的倍数之和
bigger = bigger + smaller;
break;
default:
return "暂不支持的计算类型,现已支持的有加法、减法、乘法、除法";
break;
}
// 去除数字中的小数点
str1 = str1.replace('.', '');
str2 = str2.replace('.', '');
// 计算倍数例如1.001小数点后有三位,则需要乘 1000 变成 1001变成整数后精度丢失问题则不会存在
for (var i = 0; i < bigger; i++) {
beishu *= 10; // 等价于beishu = beishu * 10;
}
num1 = parseInt(str1);
num2 = parseInt(str2);
// 进行最终计算并除相应倍数
switch (calcStr) {
case "+":
sum = (num1 + num2) / beishu;
break;
case "-":
sum = (num1 - num2) / beishu;
break;
case "*":
sum = (num1 * num2) / beishu;
break;
case "/":
sum = num1 / num2;
/*
所以对数字进行放大对应倍数并进行补0操作后不用另对倍数做处理 */
break;
default:
return "暂不支持的计算类型,现已支持的有加法、减法、乘法、除法";
}
return sum;
},
// 返回页面
leftClick(page, url) {
if (page) {
uni.redirectTo({
url
});
} else {
uni.navigateBack({
delta: 1
});
}
},
// H5客服连接
location() {
const isWechat = getApp()['globalData']['parameters']?.isWechat;
console.log('是否小程序环境', getApp()['globalData']['parameters']);
if (isWechat) {
wx.miniProgram.navigateTo({
url: `/pages/wxpay/openCustomerServiceChat?url=${RXSERVICE}`
});
return;
};
location.href = `https://work.weixin.qq.com/kfid/kfc2f4d0cb26562ffe1`;
},
// 用于无前缀图片拼接
ImgSplicing(name) {
return `https://img.agrimedia.cn/chwl/H5card/${name}`;
},
// 点击店铺导航
openLocation() {
uni.showToast({
title: '定位功能正在维护',
icon: 'none'
})
},
// 支付
payment(data) {
uni.showLoading({
title: '加载中'
});
/**
* @param {String} order_sn订单号
* @param {Number} type订单类型
* @param {String} redirect_url回调地址
* @param {Object} money微信支付时需要的参数(该参数只在微信环境进入H5时才会存在)
* @payment方法的回调地址是查询完订单状态之后要进入的页面
*/
let {
order_sn,
type,
redirect_url = '',
} = data;
console.log(order_sn, type, redirect_url, '支付方法参数1');
// 微信跳转H5下单支付时需要先获取支付参数然后跳转微信小程序支付
if (getApp()['globalData']['parameters']?.isWechat) {
console.log("呼呼1")
this._H5WXPAY(data).then(res => {
uni.hideLoading();
console.log(res['data'], '微信支付参数');
const miniPayRequest = {
timeStamp: encodeURIComponent(res['data']['result']['timestamp']),
nonceStr: encodeURIComponent(res['data']['result']['nonceStr']),
package: encodeURIComponent(res['data']['result']['package']),
signType: encodeURIComponent(res['data']['result']['signType']),
paySign: encodeURIComponent(res['data']['result']['paySign']),
order_sn: res['data']['out_trade_no'],
type,
business: 'H5Environment',
// 微信结算付款页面需要return_url字段
return_url: redirect_url
};
console.log(encodeURIComponent(JSON.stringify(miniPayRequest)), '编码');
// return
wx.miniProgram.navigateTo({
url: `/pages/wxpay/wxpay?data=${encodeURIComponent(JSON.stringify(miniPayRequest))}&isencodeURL=true`
});
})
// // 电影票支付与点餐支付接口不同此处做出区分
// if(type == 4){
// WXpayDYPAPI({
// orderNo:order_sn,
// })
// }else{
// WXpayAPI({
// out_order_num:order_sn,
// money
// }).then(res => {
// uni.hideLoading();
// console.log(res['data'],'微信支付参数');
// const miniPayRequest = {
// timeStamp: encodeURIComponent(res['data']['result']['timestamp']),
// nonceStr: encodeURIComponent(res['data']['result']['nonceStr']),
// package: encodeURIComponent(res['data']['result']['package']),
// signType: encodeURIComponent(res['data']['result']['signType']),
// paySign: encodeURIComponent(res['data']['result']['paySign']),
// order_sn:res['data']['out_trade_no'],
// type,
// business:'restaurant',
// // 微信结算付款页面需要return_url字段
// return_url:redirect_url
// };
// console.log(encodeURIComponent(JSON.stringify(miniPayRequest)),'编码');
// wx.miniProgram.navigateTo({
// url: `/pages/wxpay/wxpay?data=${encodeURIComponent(JSON.stringify(miniPayRequest))}&isencodeURL=true`
// });
// })
// }
} else {
console.log("呼呼2")
// 测试
// location.href = `/pages/pay/index?order_sn=${order_sn}&type=${type}&redirect_url=${redirect_url}`;
// return
// 反之直接获取支付链接
// 回调地址添加标识。用于点击返回上一页
// redirect_url = `${redirect_url}`;
WXpayH5API({
order_sn,
type,
redirect_url: `${getApp()['globalData']['urlfileName']}/pages/pay/index?order_sn=${order_sn}&type=${type}&redirect_url=${redirect_url}`
}).then(res => {
console.log(
`${getApp()['globalData']['urlfileName']}/pages/pay/index?order_sn=${order_sn}&type=${type}&redirect_url=${redirect_url}`
)
console.log(res['data']['redirect_url'], '支付方法地址');
// location.href = ;
window.location.replace(res['data']['redirect_url'])
})
}
},
// H5在小程序环境下支付时每个接口不同所以封装为统一方法
_H5WXPAY(PayPara) {
// 点餐微信支付接口
if (PayPara['type'] == 3) {
let {
order_sn: out_order_num,
money
} = PayPara;
return WXpayAPI({
out_order_num,
money
});
};
// 电影票微信支付接口
if (PayPara['type'] == 4) {
let {
order_sn: orderNo
} = PayPara;
return WXpayDYPAPI({
orderNo
});
}
//vip充值
if (PayPara['type'] == 7) {
let {
order_sn,
type,
redirect_url
} = PayPara;
return WXpayH5API({
order_sn,
type,
redirect_url
});
}
},
/**
* @支付回调统一管理方法
* @查询订单状态完成之后的回调地址redirect_url
*/
pay_statepage(parameters, redirect_url) {
// console.log(order_sn,'pay_statepage方法参数');
let url = '';
url += redirect_url;
console.log(url, '判断跳转链接');
/**
* @拼接参数
*/
console.log('拼接参数')
if (typeof parameters !== 'undefined') {
for (let key in parameters) {
if (url.indexOf('?') == -1) {
url += `?${key}=${parameters[key]}`;
continue;
};
url += `&${key}=${parameters[key]}`
}
};
console.log(url, '地址');
if (redirect_url) {
// location.href = url;
uni.redirectTo({
url
})
}
// uni.redirectTo({
// url
// });
},
// 获取除去指定元素之外的高度
// bottomlb 底部留白距离
initScrollView({
el,
bottomlb = 0
} = data) {
let self = this;
return new Promise((resolve, reject) => {
uni.getSystemInfo({
success: (res) => {
if (typeof el === 'string') {
uni.createSelectorQuery().in(self).select(`.${el}`)
.boundingClientRect(
data => {
console.log(data, self['NAVHEIGHT'], bottomlb, '元素高度');
// 有时候无法获取到订单顶部的切换类型元素高度,所以当获取不到时在此处直接赋值
if (data['height'] == 0 && el == 'OrderToggleType') {
bottomlb = 45;
}
// 注意这里获得的高度宽度都是px需要转换rpx
// 可使用窗口高度将px转换rpx
resolve(((res.windowHeight - (data['height'] + self[
'NAVHEIGHT'] + bottomlb)) * (750 / res[
'windowWidth'])))
}).exec()
} else if (typeof el === 'object') {
let hs = [];
for (let i = 0; i < el['length']; i++) {
uni.createSelectorQuery().in(self).select(`.${el[i]}`)
.boundingClientRect(
data => {
hs.push(data['height'])
console.log(hs, '高度');
}).exec()
};
// // 宏任务执行完毕之后执行微任务
// setTimeout(() => {
// console.log(this.sum(hs), '求和');
// resolve(((res.windowHeight - this.sum(hs)) * (750 /
// res['windowWidth'])))
// }, 0)
}
}
})
// setTimeout(() => {
// uni.getSystemInfo({
// success: (res) => {
// // 因为支付宝平台不支持createSelectorQuery
// // #ifdef MP-WEIXIN
// uni.createSelectorQuery().in(self).select(".tabbars")
// .boundingClientRect(
// data => {
// console.log(data, '高度');
// // 注意这里获得的高度宽度都是px需要转换rpx
// // 可使用窗口高度将px转换rpx
// self.scrollHeight = ((res.windowHeight) * (750 /
// res['windowWidth']));
// resolve();
// }).exec()
// // #endif
// // 支付宝通过组件中获取到的元素信息经行计算
// // #ifdef MP-ALIPAY
// // -
// self.scrollHeight = ((res.windowHeight - self['$refs'][
// 'tabbars'
// ]['tabbarsHeight']) * (750 / res
// .windowWidth));
// resolve();
// // #endif
// }
// })
// }, 500)
});
},
// 深拷贝
deepClone(source) {
if (!source || typeof source !== 'object') {
throw new Error('error arguments', 'shallowClone');
}
var targetObj = source.constructor === Array ? [] : {};
for (var keys in source) {
if (source.hasOwnProperty(keys)) {
if (source[keys] && typeof source[keys] === 'object') {
targetObj[keys] = source[keys].constructor === Array ? [] : {};
targetObj[keys] = deepClone(source[keys]);
} else {
targetObj[keys] = source[keys];
}
}
}
return targetObj;
},
// 复制到粘贴版
Copy(e) {
uni.setClipboardData({
data: e,
success: function() {
uni.showToast({
title: '复制成功',
icon: 'none'
})
}
})
},
//
/**
* @选择地址之后返回用户位置信息
*/
GetUserchooseLocation() {
return new Promise((resolve, reject) => {
uni.chooseLocation({
success: function(res) {
getCityName2(res['latitude'], res['longitude']).then(e => {
console.log(e, 'eeeeeeeeeee');
let {
result: {
address,
ad_info: {
province,
city,
district,
location,
city_code,
name
},
formatted_addresses: {
recommend
}
}
} = e;
resolve({
province,
city,
district,
location,
city_code,
name,
recommend,
address
});
}).catch(e => {
reject(e);
})
}
});
})
},
// H5打开地图
handleOpen() {
},
//元转分
regYuanToFen(yuan, digit) {
var m = 0,
s1 = yuan.toString(),
s2 = digit.toString();
try {
m += s1.split(".")[1].length
} catch (e) {}
try {
m += s2.split(".")[1].length
} catch (e) {}
return Number(s1.replace(".", "")) * Number(s2.replace(".", "")) / Math.pow(10, m)
},
//获取url参数
getUrlParams(url) {
try {
// 通过 ? 分割获取后面的参数字符串
let urlStr = url.split('?')[1]
// 创建空对象存储参数
let obj = {};
// 再通过 & 将每一个参数单独分割出来
let paramsArr = urlStr.split('&')
for (let i = 0, len = paramsArr.length; i < len; i++) {
// 再通过 = 将每一个参数分割为 key:value 的形式
let arr = paramsArr[i].split('=')
obj[arr[0]] = arr[1];
}
return obj
} catch {
return false
}
},
},
filters: {
OrderState(v) {
switch (v) {
case 0:
return '待支付';
case 1:
return '待发货';
case 2:
return '待收货';
case 3:
return '已退款';
case 4:
return '已取消';
case 5:
return '完成';
}
}
}
}

View File

@ -0,0 +1,181 @@
import {
payH5API,
alipayH5API
} from '@/request/index/index.js';
import {
WXpayAPI,
WXpayDYPAPI
} from '@/request/restaurant/index.js';
import {
WXpayH5API
} from '@/request/recharge/index.js';
import {
// createOrderNewAPI,
agOrderPayAPI,
} from '@/request/restaurant/index.js';
// 获取配置文件
import config from '@/static/js/config.js';
import {
mapGetters,
} from 'vuex';
// 公共mixins
export default {
computed:{
...mapGetters({
// 获取品牌Id
BrandInfor: 'shopping/BrandInfor',
}),
},
// 方法
methods: {
// 获取当前品牌配置
Brand() {
// console.log( this['BrandInfor'],'11111111111111');
return config[`Brand_${this['BrandInfor']['brand_id']}`]
},
// 支付
payment(data) {
uni.showLoading({
title: '加载中'
});
/**
* @param {String} order_sn订单号
* @param {Number} type订单类型
* @param {String} redirect_url回调地址(查询支付状态完成之后的回调地址,并非请求支付接口时的回调地址)
* @payment方法的回调地址是查询完订单状态之后要进入的页面
*/
let {
type = 1,
Number = 0,
order_sn = '',
redirect_url = '',
} = data;
console.log(data, '新支付方法参数');
// 微信跳转H5下单支付时需要先获取支付参数然后跳转微信小程序支付
if (getApp()['globalData']['parameters']?.isWechat) {
this._H5WXPAY(data).then(res => {
uni.hideLoading();
console.log(res['data'], '微信支付参数');
const miniPayRequest = {
timeStamp: encodeURIComponent(res['data']['result']['timestamp']),
nonceStr: encodeURIComponent(res['data']['result']['nonceStr']),
package: encodeURIComponent(res['data']['result']['package']),
signType: encodeURIComponent(res['data']['result']['signType']),
paySign: encodeURIComponent(res['data']['result']['paySign']),
order_sn: res['data']['out_trade_no'],
type,
business: 'restaurant',
// 微信结算付款页面需要return_url字段
return_url: redirect_url
};
console.log(encodeURIComponent(JSON.stringify(miniPayRequest)), '编码');
// return
wx.miniProgram.navigateTo({
url: `/pages/wxpay/wxpay?data=${encodeURIComponent(JSON.stringify(miniPayRequest))}&isencodeURL=true`
});
})
} else {
// 测试
// location.href = `/pages/pay/index?order_sn=${order_sn}&type=${type}&redirect_url=${redirect_url}`;
// return
// 反之直接获取支付链接
// 回调地址添加标识。用于点击返回上一页
// redirect_url = `${redirect_url}`;
WXpayH5API({
order_sn,
type,
redirect_url: `${getApp()['globalData']['urlfileName']}/pages/pay/index?order_sn=${order_sn}&type=${type}&redirect_url=${redirect_url}`
}).then(res => {
console.log(
`${getApp()['globalData']['urlfileName']}/pages/pay/index?order_sn=${order_sn}&type=${type}&redirect_url=${redirect_url}`
)
console.log(res['data']['redirect_url'], '支付方法地址');
location.href = res['data']['redirect_url'];
})
}
},
// H5在小程序环境下支付时每个接口不同所以封装为统一方法
_H5WXPAY(PayPara) {
// 点餐微信支付接口
if (PayPara['type'] == 3) {
let { order_sn: out_order_num, money } = PayPara;
return WXpayAPI({ out_order_num, money });
};
// 电影票微信支付接口
if (PayPara['type'] == 4) {
let { order_sn: orderNo } = PayPara;
return WXpayDYPAPI({ orderNo });
}
},
/**
* @支付回调统一管理方法
* @查询订单状态完成之后的回调地址redirect_url
*/
pay_statepage(parameters, redirect_url) {
// console.log(order_sn,'pay_statepage方法参数');
let url = '';
url += redirect_url;
console.log(url, '判断跳转链接');
// 拼接参数将对象转换为URL参数
console.log('拼接参数')
if (typeof parameters !== 'undefined') {
for (let key in parameters) {
if (url.indexOf('?') == -1) {
url += `?${key}=${parameters[key]}`;
continue;
};
url += `&${key}=${parameters[key]}`
}
};
console.log(url, '地址');
if (redirect_url) {
uni.redirectTo({
url
})
}
},
// 订单立即支付
againpayment(order_sn,money = 0) {
console.log(this['BrandInfor']['brand_id'], '品牌ID');
let redirect_url;
// 肯德基
if (this['BrandInfor']['brand_id'] == 1 || this['BrandInfor']['brand_id'] == 5) {
redirect_url = `/pages/restaurant/order/order-status/order-status`;
} else if (this['BrandInfor']['brand_id'] == 10 || this['BrandInfor']['brand_id'] == 13) {
redirect_url = `/pages/restaurant/order/order-details/details`
}
// 小程序再次支付
// 微信跳转H5后的逻辑为必须携带token
const isWechat = getApp()['globalData']['parameters']?.isWechat;
if(isWechat){
this.payment({
order_sn,
type:3,
redirect_url,
money,
});
}else{
// H5再次支付
agOrderPayAPI({
order_sn,
type: 3,
redirect_url: `${getApp()['globalData']['urlfileName']}/pages/pay/index?order_sn=${order_sn}&type=${3}&redirect_url=${redirect_url}`
}).then(data => {
location.href = data['data']['redirect_url'];
})
}
},
},
}

View File

@ -0,0 +1,455 @@
import {
SER_USERINFOR
} from '@/store/mutation-types.js';
// 获取配置文件
import config from '@/static/js/config.js';
// vuex
import {
mapGetters,
mapMutations,
mapActions,
mapState
} from 'vuex';
// 请求
import {
// createOrderNewAPI,
agOrderPayAPI,
computedOfflineOrder
} from '@/request/restaurant/index.js';
const restaurantmixins = {
data() {
return {
shopid: 0,
countDown: 0,
wait_for: '',
SER_USERINFOR,
// 0:待支付;1:待出餐(WAIT_OUT_MEAL);2:已出餐(OUT_MEAL);3:订单失败(FAIL);4:已出餐(部分退款)(OUT_MEAL_PART);5:取消
OrderStatus0: 0,
OrderStatus1: 1,
OrderStatus2: 2,
OrderStatus3: 3,
OrderStatus4: 4,
OrderStatus5: 5,
}
},
filters: {
// 订单状态
OrderState(v) {
switch (v) {
case 0:
return '待支付';
case 1:
return '待出餐';
case 2:
return '已出餐';
case 3:
return '已退款';
case 4:
return '已出餐(部分退款)';
case 5:
return '已关闭';
}
},
// 订单状态对应文字
OrderStateText(v) {
switch (v) {
case 0:
return '待支付';
case 1:
return '实付';
case 2:
return '实付';
case 3:
return '实付';
case 4:
return '实付';
case 5:
return '待支付';
}
}
},
computed: {
BrandStyle() {},
...mapState({
cartList: 'shopping/cartList'
}),
...mapGetters({
// 获取用户自主改变的地址
UserArae1: 'GetUserArae',
// 获取用户设备定位的地址
GetcityInfor: 'GetcityInfor',
// 获取用户设备定位的地址
UserArae2: 'GetcityInfor',
// 获取用户切换的城市code
GetCityCode: 'GetCityCode',
// 获取品牌Id
BrandInfor: 'shopping/BrandInfor',
// 获取店铺信息
GetShopInfor: 'shopping/GetShopInfor',
// 获取导航索引
Getnavindex: 'shopping/Getnavindex',
// 获取购物车
GetCartList: 'shopping/GetCartList',
// 获取购物车
GetCartList2: 'shopping/Getshopshopping',
// 获取就餐方式
GetMODE: 'shopping/GetMODE',
getPhone: 'shopping/getPhone',
}),
},
methods: {
...mapMutations({
SetcommodityInfor: 'shopping/SETINFOR',
// 设置底部导航索引
SETNAVINDEX: 'shopping/SETNAVINDEX',
// 选择餐厅时保存餐厅信息
SETSHOPDETAIL: 'shopping/SETSHOPDETAIL',
// 肯德基首次进入存入弹框变量
MODEAL: 'shopping/MODEAL',
// 结算清单
SETREPLACE: 'shopping/SETREPLACE',
// 设置品牌信息
SETBRANDINFOR: 'shopping/SETBRANDINFOR',
// 获取本地购物车数据
INIT_BUYCART: 'shopping/INIT_BUYCART',
// 设置就餐方式
SETMODE: 'shopping/SETMODE',
// 设置手机号
SETPHONE:'shopping/SETPHONE'
}),
...mapActions({
// 清空当前购物车
EMPTY: 'shopping/EMPTY',
// 商品加入购物车
ADD_CART: 'shopping/ADD_CART',
// 移除商品
REDUCE_CART: 'shopping/REDUCE_CART',
}),
Brand() {
return config[`Brand_${this['BrandInfor']['brand_id']}`]
},
// 主题色方法
// themeColor(){
// // 肯德基主题色
// if(BrandInfor['brand_id'] == 1){
// }
// }
// 待支付倒计时
/**
* @param {Number} status 订单的状态
* @param {Number} createtime 下单时间
*/
tiem(status, createtime, order_sn) {
if (status !== 0) return;
// 获取15分钟之后的时间
let date = new Date(createtime * 1000);
date.setMinutes(date.getMinutes() + 15);
this['countDown'] = setTimeout(() => {
// 最终停止时间时间戳
let end = date.getTime();
// 当前时间时间戳
let start = new Date().getTime();
let x = new Date(end - start);
console.log(end - start, '执行2', order_sn);
if ((end - start) <= 0) {
try {
this['InforData']['status'] = 5;
} catch (e) {
//TODO handle the exception
}
return;
};
this.tiem(status, createtime, order_sn)
let m = x.getMinutes();
m = m > 9 ? m : `0${m}`;
let s = x.getSeconds();
s = s > 9 ? s : `0${s}`;
this['wait_for'] = `${m}:${s}`;
}, 1000)
},
// 打开微信内置地图导航
openLocation(latitude = (+this['GetShopInfor']['latitude']), longitude = (+this['GetShopInfor'][
'longitude'
])) {
console.log(latitude, longitude);
uni.openLocation({
latitude,
longitude,
success: function() {
console.log('success');
}
});
},
/**
* @瑞幸筛选出当前选择的高亮规格
* */
screensku_rx() {
let r = [];
let t = this['skuinfor']['details']['specifications'];
for (let i = 0; i < t['length']; i++) {
let item = t[i];
r.push(...item['ingredients']);
};
let newarr = r.filter(item => item['checked']).map(item => item['name']);
return {
sku: newarr,
text: newarr.join('/')
}
},
/**
* @星巴克筛选出当前选择的高亮规格
* @param { Array } optional规格数组
* @param { Number } pay_price原价
* */
screensku_xbk(optional = this['skuinfor']['details']['optional'], pay_price = this['skuinfor'][
'pay_price'
]) {
let add_price = 0;
let r = [];
let sku_code = [];
// JSON.parse与JSON.stringify方法深拷贝将双向数据解除
// RetainDecimalPoint方法转为正常价格后台返回的是按照 分 划分的)
// let pay = +this.RetainDecimalPoint(JSON.parse(JSON.stringify(this['skuinfor']['pay_price'])));
let pay = +JSON.parse(JSON.stringify(pay_price));
// let t = this['skuinfor']['details']['optional'];
let t = optional;
for (let i = 0; i < t['length']; i++) {
let item = t[i];
r.push(...item['sku_infos']);
};
let newarr = r.filter(item => {
if (item['checked']) {
if (item?.price) {
add_price = item['price'] * 100;
// 商品的原价与配料价格相加
pay += add_price
};
return item;
}
}).map(item => item['name']);
// 数组格式
// sku_code = t.map(item=>{
// return {
// specification_id:item['id'],
// sku_id:item['sku_infos'].find(it=>{
// return it['checked'];
// })['id']
// }
// });
// 字符串格式
// let str = []; {
// for (let i = 0; i < t['length']; i++) {
// str.push(`${t[i]['id']}_${t[i]['sku_infos'].find(item=>item['checked'])['id']}`)
// };
// }
// this['skuinfor']['sku_code'] = str.join(',');
// this['skuinfor']['sku'] = newarr;
// this['skuinfor']['pay'] = pay;
// console.log(pay, '方法pay');
return {
// sku_code: str.join(','),
sku: newarr,
pay,
add_price
}
},
// 因为点餐模块中的底部导航是自定义的所以需要从内多层页面跳转到订单或者首页时使用这个方法
/**
* @param {Number} delta 回退页数
* @param {Boolean} istab 是否设置导航
* @param {Number} index 导航所以为几
*/
navigateBack(delta, istab = false, index = 0) {
if (istab) {
this.SETNAVINDEX(index)
}
uni.navigateBack({
delta
});
},
// 订单立即支付
againpayment(order_sn,money = 0) {
console.log(this['BrandInfor']['brand_id'], '品牌ID');
let redirect_url;
// 肯德基
if (this['BrandInfor']['brand_id'] == 1 || this['BrandInfor']['brand_id'] == 5) {
redirect_url = `/pages/restaurant/order/order-status/order-status`;
}else{
redirect_url = `/pages/restaurant/order/order-details/details`
}
// 小程序再次支付
// 微信跳转H5后的逻辑为必须携带token
const isWechat = getApp()['globalData']['parameters']?.isWechat;
if(isWechat){
this.payment({
order_sn,
type:3,
redirect_url,
money,
});
}else{
// H5再次支付
agOrderPayAPI({
order_sn,
type: 3,
redirect_url: `${getApp()['globalData']['urlfileName']}/pages/pay/index?order_sn=${order_sn}&type=${3}&redirect_url=${redirect_url}`
}).then(data => {
location.href = data['data']['redirect_url'];
})
}
},
// 计算佣金
computedOrder() {
// 佣金计算
computedOfflineOrder(this.FormInfor).then(res => {
this.loading = false;
// 0元购弹窗数据
this.realPayment = res.data.real_pay_price;
this.ZeroData = res.data;
this.computedTotal = res.data;
/*
* 仅赋值一次
*/
if (this.hasAssigned) return;
this.YingPrice = res.data.real_pay_price;
this.hasAssigned = true;
}).catch(res => {
this.loading = false;
uni.showToast({
title:res,
icon:'none'
})
})
},
// 重新下单
Reorder(commodity) {
console.log(commodity, '重新下单商品');
uni.showLoading({
title: '加载中...',
})
let self = this;
let index = 0;
// 创建进入餐厅所需要的参数对象
let {
restaurant_id,
latitude,
longitude,
restaurant_address,
restaurant_name
} = commodity[0];
// 进入餐厅时设置的参数
this.SETSHOPDETAIL({
city_name: "",
close_time: "",
distance: "",
open_time: "",
province_name: "",
regoin_name: "",
special: false,
latitude,
longitude,
restaurant_address,
restaurant_id,
restaurant_name,
});
let add = function() {
console.log(`${index}个,总共有${commodity['length']}`);
console.log(commodity[index]['sku_code'],'sku_code');
self.ADD_CART({
commodity: commodity[index],
quantity:commodity[index]['num']
}).then(() => {
if (index >= commodity['length'] - 1) {
uni.hideLoading();
uni.navigateTo({
url: `/pages/restaurant/home/shop_home/shop_home?restaurant_id=${restaurant_id}`
});
return;
};
index += 1;
add();
})
}
this.EMPTY(commodity[0]['restaurant_id']).then(res => {
console.log(res);
setTimeout(() => {
add();
}, 1000);
})
},
/**
* @param {type} 路线规划方式参数公交bus 驾车drive 步行walk 骑行bike
* @param {from} 起点名称
* @param {fromcoord} 起点坐标(lat,lng) / CurrentLocation (使用定位点作为起点坐标)
* @param {to} 终点名称
* @param {tocoord} 终点坐标
*
*/
MPAPI(latitude, longitude, name) {
let url = "";
if (plus.os.name == "Android") {
let hasBaiduMap = plus.runtime.isApplicationExist({
pname: 'com.baidu.BaiduMap',
action: 'baidumap://'
});
let urlBaiduMap =
`baidumap://map/marker?location=${latitude},${longitude}&title=${name}&coord_type=gcj02&src=andr.baidu.openAPIdemo`
if (hasBaiduMap) {
plus.runtime.openURL(urlBaiduMap);
} else {
plus.nativeUI.alert("未安装地图APP");
}
} else {
plus.nativeUI.actionSheet({
title: "选择地图应用",
cancel: "取消",
buttons: [{
title: "Apple地图"
}, {
title: "百度地图"
}]
},
function(e) {
switch (e.index) {
case 1:
url =
`http://maps.apple.com/?q=%e6%95%b0%e5%ad%97%e5%a4%a9%e5%a0%82&ll=${latitude},${longitude}&spn=0.008766,0.019441`;
break;
case 2:
url =
`baidumap://map/marker?location=${latitude},${longitude}&title=${name}&content=${name}&src=ios.baidu.openAPIdemo&coord_type=gcj02`;
break;
default:
break;
}
if (url != "") {
plus.runtime.openURL(url, function(e) {
plus.nativeUI.alert("未安装地图APP");
});
}
})
}
}
},
beforeDestroy() {
clearTimeout(this['countDown']);
},
};
export default restaurantmixins;

View File

@ -0,0 +1,235 @@
/**
* 该文件为整个项目的方法配置文件
* 以下方法使用前必须在/static/js/config.js中配置好属性
*/
import store from '../../store/index.js';
// 获取配置文件
import config from '@/static/js/config.js';
import { WXpayAPI, WXpayDYPAPI, WXpayDIYAPI, createOrderNewAPI, agOrderPayAPI, cancelOrderAPI} from '@/request/restaurant/index.js';
import {
WXpayH5API
} from '@/request/recharge/index.js';
// 项目通用方法类型
class project{
constructor(){}
// 获取当前环境
get environment(){
return getApp()['globalData']['parameters']?.isWechat;
}
// 获取当前品牌
get Brand(){
return store['getters']['shopping/BrandInfor']['brand_id'];
}
}
// 订单功能模块的方法类
class OrderConfig extends project{
// 获取订单状态图片
OrderStateImg(status = 0){
// 当前品牌
// 状态图标名称
console.log(config[`Brand_${this['Brand']}`],'StatusImg');
const StatusImg = config[`Brand_${this['Brand']}`]['customStyle']['OrderStatus'][`OrderStatus${status}`];
// 存放与https://img.agrimedia.cn/chwl域名下的哪个文件夹
const file = config[`Brand_${this['Brand']}`]['customStyle']['OrderStatus']['http'];
return `https://img.agrimedia.cn/chwl/${file}/${StatusImg}`;
}
// 取消订单
// OrderCancel(order_sn) {
// // 待付款 0
// // 待发货 1
// // 已发货 2
// // 已取消 3
// // 已完成 5
// // 已退款 6
// return new Promise((resolve,reject)=>{
// cancelOrderAPI({
// order_sn
// }).then(data => {
// resolve(3)
// }).catch(res=>{
// reject()
// })
// })
// }
}
// 支付功能模块方法类
class PayConfig extends project{
/**
* 支付方法参数说明
* @param {String} order_sn订单号
* @param {Number} type订单类型
* @param {String} redirect_url回调地址(查询支付状态完成之后的回调地址,并非请求支付接口时的回调地址)
*
* 使用方法
* 每一个@payment都为一步
* 注意:请求接口H5环境请求接口时redirect_url为拉取支付之后的回跳地址(该地址并不会在用户支付完成或者失败之后跳转,而是在用户拉起支付之后4-5秒之后自动跳转)
*
* @payment 调用支付方法时先判断是否是微信环境,还是H5环境
*
* @payment 微信环境则需要调用后台微信的支付接口拿取微信支付参数,然后使用wx.miniProgram.navigateTo跳转至微信的支付页面调起支付
* 其中在拿取到微信支付参数之后miniPayRequest对象中除了微信支付参数以外,必要参数分别是
* order_sn:订单号
* return_url:回调地址(用来在支付页面支付完成之后跳转订单查询页面查询订单状态完毕之后要前往哪个页面)
* type:当前支付的类型(后台返回)
*
* @payment H5环境直接拿取后台返回的地址使用location.href跳转即可
*/
payment(data) {
uni.showLoading({
title: '支付中...'
});
let {
type = 1,
order_sn = '',
redirect_url = '',
} = data;
const isWechat =
console.log(data, '新支付方法参数');
console.log(this['environment'],'是否微信环境');
if (this['environment']) {
this._H5WXPAY(data).then(res => {
uni.hideLoading();
console.log(res['data'], '微信支付参数');
const miniPayRequest = {
timeStamp: encodeURIComponent(res['data']['result']['timestamp']),
nonceStr: encodeURIComponent(res['data']['result']['nonceStr']),
package: encodeURIComponent(res['data']['result']['package']),
signType: encodeURIComponent(res['data']['result']['signType']),
paySign: encodeURIComponent(res['data']['result']['paySign']),
order_sn: res['data']['out_trade_no'],
type,
business: 'restaurant',
// 微信结算付款页面需要return_url字段
return_url: redirect_url
};
console.log(encodeURIComponent(JSON.stringify(miniPayRequest)), '编码');
// return
wx.miniProgram.navigateTo({
url: `/pages/wxpay/wxpay?data=${encodeURIComponent(JSON.stringify(miniPayRequest))}&isencodeURL=true`
});
})
} else {
// 测试
// location.href = `/pages/pay/index?order_sn=${order_sn}&type=${type}&redirect_url=${redirect_url}`;
// return
WXpayH5API({
order_sn,
type,
redirect_url: `${getApp()['globalData']['urlfileName']}/pages/pay/index?order_sn=${order_sn}&type=${type}&redirect_url=${redirect_url}`
}).then(res => {
uni.hideLoading();
location.href = res['data']['redirect_url'];
})
}
}
// H5在小程序环境下支付时每个接口不同所以封装为统一方法
_H5WXPAY(PayPara) {
// 点餐微信支付接口
if (PayPara['type'] == 3) {
let { order_sn: out_order_num, money } = PayPara;
return WXpayAPI({ out_order_num, money });
};
// 电影票微信支付接口
if (PayPara['type'] == 4) {
let { order_sn: orderNo } = PayPara;
return WXpayDYPAPI({ orderNo });
}
// DIY微信支付接口
if (PayPara['type'] == 5) {
let { order_sn, type} = PayPara;
return WXpayDIYAPI({order_sn, type});
}
}
/**
* @支付回调统一管理方法
* @查询订单状态完成之后调用该方法来跳转指定页面
*/
payRedirectUrl(parameters, redirect_url) {
// console.log(order_sn,'pay_statepage方法参数');
let url = '';
url += redirect_url;
// 拼接参数
console.log('拼接参数')
if (typeof parameters !== 'undefined') {
for (let key in parameters) {
if (url.indexOf('?') == -1) {
url += `?${key}=${parameters[key]}`;
continue;
};
url += `&${key}=${parameters[key]}`
}
};
if (redirect_url) {
uni.redirectTo({
url
})
}
}
// 再次支付方法
// AgainPayment(order_sn,type,money = 0) {
// console.log('再次支付');
// let redirect_url;
// // 肯德基/麦当劳再次支付回跳地址
// if (this['Brand'] == 1 || this['Brand'] == 5) {
// redirect_url = `/pages/restaurant/order/order-status/order-status`;
// } else if (this['Brand'] == 10 || this['Brand'] == 13) {
// // 瑞幸/星巴克再次支付回跳地址
// redirect_url = `/pages/restaurant/order/order-details/details`
// }else if(this['Brand'] == 30){
// // DIY定制再次支付回跳地址
// redirect_url = `/pages/diy/orders/order-infor/order-infor`
// };
// this.payment({
// order_sn,
// type,
// redirect_url,
// money,
// });
// // 小程序再次支付
// if(this['isWechat']){
// this.payment({
// order_sn,
// type,
// redirect_url,
// money,
// });
// }else{
// // H5再次支付
// agOrderPayAPI({
// order_sn,
// type,
// redirect_url: `${getApp()['globalData']['urlfileName']}/pages/pay/index?order_sn=${order_sn}&type=${type}&redirect_url=${redirect_url}`
// }).then(data => {
// location.href = data['data']['redirect_url'];
// })
// }
// }
}
const install = (Vue) => {
Vue.prototype.$project = new project();
Vue.prototype.$Order = new OrderConfig();
Vue.prototype.$PayConfig = new PayConfig();
}
export default {
install
};

View File

@ -0,0 +1,122 @@
import { gminiPayAPI } from "@/api/card/index"
class Payment{
// 微信支付类型
WeChat = 1;
// 支付宝支付类型
Alipay = 2;
// 开始支付
/**
* @param {String} order_sn 订单编号 必传
* @param {String} OrderType 订单类型 必传
* @param {String} pending 支付时需要做什么 选填
* @param {String} payType 支付类型 APP中内嵌H5必填-支付宝支付还是微信支付
* @param {Object} parameters 其余参数 需要携带的其余参数
*/
_Payment_(data){
const {order_sn,OrderType,pending=()=>{},payType = 1,parameters = {}} = data;
/**
* 对付款前做什么处理
* 因为有前车之鉴不同场景的微信支付需要调用不同的支付接口
* 比如:
* 场景A需要调用 /chwl.pay/api1 接口, 场景B景需要调用 /chwl.pay/api2 接口, 传入的参数也不同,
* 所以如果存在以上情况则可以在_beforePayment_函数中对支付前判断做一些处理
* 若不存在以上情况则可以直接在_beforePayment_中直接处理即可
*/
// this._beforePayment_({order_sn,OrderType,pending,payType,...parameters}).then(res => {
// 检查是否是微信支付还时内嵌内嵌H5
if (getApp()['globalData']['parameters']?.isWechat) {
const miniPayRequest = {
// timeStamp: encodeURIComponent(res['data']['miniPayRequest']?.timestamp || res['data']['miniPayRequest']?.timeStamp),
// nonceStr: encodeURIComponent(res['data']['miniPayRequest']['nonceStr']),
// package: encodeURIComponent(res['data']['miniPayRequest']['package']),
// signType: encodeURIComponent(res['data']['miniPayRequest']['signType']),
// paySign: encodeURIComponent(res['data']['miniPayRequest']['paySign']),
// 订单号
order_sn,
OrderType,
...parameters
};
// console.log(res,getApp()['globalData']['parameters']?.isWechat,wx.miniProgram,miniPayRequest,'支付前参数')
// 带着支付参数进入微信支付页面
wx.miniProgram.navigateTo({
url: `/pages/wxpay/h5pay/newpay?data=${encodeURIComponent(JSON.stringify({ order_sn, OrderType}))}`
});
// 延迟n秒后H5内部跳转
// 延迟两秒后执行一些逻辑,就是在跳转微信调起微信支付的过程中执行什么,
// 一般都是在调起微信支付的时候先跳转至支付失败或者成功的页面,然后微信中的支付方法会在支付完成或者失败后退页,
// 或者在调起微信支付的时候先跳转至订单详情页面然后再页面onshow生命周期中执行重新获取订单信息方法来更新支付状态
setTimeout(()=>{
pending();
},2000)
} else {
// 打开微信
openMiniProgram({
path: `pages/wxpay/h5pay/newpay?data=${encodeURIComponent(JSON.stringify({ order_sn, OrderType}))}`,
id: 'gh_faaea9b90759',
// type: 'release',
type: 'preview'
});
}
}
// 付款前需要做什么处理
_beforePayment_(data){
console.log('进入_beforePayment_');
console.log(data['order_sn'],'支付参数order_sn');
console.log(data['OrderType'],'支付参数OrderType');
console.log(data['pending'],'支付参数pending');
console.log(data['payType'],'支付参数payType');
console.log(data['parameters'],'支付参数parameters');
console.log(getApp()['globalData']['parameters']?.isWechat,'支付参数isWechat');
if(getApp()['globalData']['parameters']?.isWechat){
// return gminiPayAPI({order_sn:data['order_sn'],type:data['OrderType']})
return Promise.resolve()
}else{
// console.log(data['payType'],'支付方法');
// // APP中的微信支付与微信支付
// // 微信支付参数
// const paypara = {
// order_no:data['order_sn'],
// type:data['type'],
// redirect_url: `${getApp()['globalData']['urlfileName']}/pages/pay/index?order_sn=${data['order_sn']}&type=${data['type']}&redirect_url=${data['redirect_url']}`
// };
// if(data['payType'] == this['WeChat']) return pay_wechat_h5API(paypara);
// // 支付宝可以直接跳转请求的后台接口,也可以请求后台接口获取表单然后提交提交
// if(data['payType'] == this['Alipay']) return Promise.resolve({
// data:{redirect_url:`https://mall.agrimedia.cn/api/pay_alipay_h5?order_no=${data['order_sn']}&redirect_url=${this.pay_statepage(paypara,`${getApp()['globalData']['urlfileName']}/pages/pay/index`)}`}
// })
}
}
/**
* @支付回调统一管理方法
* @查询订单状态完成之后的回调地址redirect_url
*/
pay_statepage(parameters, redirect_url) {
// console.log(order_sn,'pay_statepage方法参数');
let url = '';
url += redirect_url;
console.log(url, '判断跳转链接');
/**
* @拼接参数
*/
console.log('拼接参数')
if (typeof parameters !== 'undefined') {
for (let key in parameters) {
if (url.indexOf('?') == -1) {
url += `?${key}=${parameters[key]}`;
continue;
};
url += `&${key}=${parameters[key]}`
}
};
console.log(url, '地址');
return url;
}
}
export default new Payment();

File diff suppressed because it is too large Load Diff

View File

@ -0,0 +1,88 @@
/**
* @BaseUR 请求域名
* @HEADERTOKENNAME 请求token键名
* @Bearer 是否需要在token前拼接 Bearer字符
* */
class Request {
constructor({
BaseUR = '',
HEADERTOKENNAME = 'token',
Bearer = false
} = {}) {
this['BaseUR'] = BaseUR;
this['HEADERTOKENNAME'] = HEADERTOKENNAME;
this['Bearer'] = Bearer;
}
// URL拼接方法
url(value) {
return /http(s)?:\/\/([\w-]+\.)+[\w-]+(\/[\w-.\/?%&=]*)?/.test(value)
}
Request(config = {}) {
// 是否存在url
try {
if (!url) {
throw '请求缺少URL参数';
}
} catch (e) {
throw new Error(e);
};
// 创建请求头对象
let header = {}
// 请类型
config['method'] = config['method'] ? config['method'].toUpperCase() : 'GET';
// 正常情况下
// GET请求使用 'application/x-www-form-urlencoded'
// POST请求使用 'application/json'
// 列外情况下会与之相反,所以将Content-Type写为根据手动传输或根据请求类型判断目前只写入GET与POST后续可扩展
header['Content-Type'] = header['Content-Type'] ? header['Content-Type'] : this.method(
config['method']);
config['header'] = header;
// url判断部分项目中不仅要调用本公司的接口还要调用其他方的接口这时候就会不使用当前公司的url端口所以将端口拼接写活
if (!this.url(config['url'])) {
url = `${this['BaseUR']}${config['url']}`
};
config['complete'] = (infor) => {
this.responseintercept(infor);
}
let Requestconfig = this.Requestintercept(config);
console.log(Requestconfig);
// 请求体
return new Promise((resolve, reject) => {
uni.request(Requestconfig)
})
}
// 请求拦截
Requestintercept(config) {
// 请求时所携带的token名称目前会存在 Authorization/ token
config['header'][this['HEADERTOKENNAME']] = `${this['Bearer']?'Bearer':''}`;
return config
}
// 响应拦截
responseintercept(infor) {
}
// 请求类型过滤
method(method) {
switch (method) {
case 'GET':
return 'application/x-www-form-urlencoded';
case 'POST':
return 'application/json';
}
}
}
const request = new Request({
BaseUR: "http://119.3.107.201:8100/prod-api/", // 测试
});
export default request;

View File

@ -0,0 +1 @@
import request from '../request'

View File

@ -0,0 +1,10 @@
// 电费充值客服链接
export const SERVICEELECTRICITY = 'https://work.weixin.qq.com/kfid/kfc2f4d0cb26562ffe1';
// 肯德基客服链接
export const KFCSERVICE = 'https://work.weixin.qq.com/kfid/kfc2f4d0cb26562ffe1';
// 瑞幸客服链接
export const RXSERVICE = 'https://work.weixin.qq.com/kfid/kfc2f4d0cb26562ffe1';
// 城市经理/招商中心立即申请客服连接
export const APPLY = 'https://work.weixin.qq.com/kfid/kfc30293d2605058aa2';
// 电影票连接
export const DYPCHAT = 'https://work.weixin.qq.com/kfid/kfc2f4d0cb26562ffe1';

View File

@ -0,0 +1,76 @@
import {
infoAPI,
} from '@/request/recharge/index.js';
// 获取用户信息(包含邀请码)
export let GetUserInvitationCode = async () => {
let Info = await infoAPI();
console.log(Info['data'],'Info')
return Info['data'];
}
// 分享配文数据
export const consumerCard = async function() {
let code = await GetUserInvitationCode();
console.log(code)
return {
title: '我在白马晶选领到了消费补贴卡,话费充值和购物都补贴优惠了,真香,分享给你也点进来领一张!',
path: `/sub_card/index/index?bm_yq_code=${code['userInfo']['invite_code']}`,
imageUrl: 'https://img.agrimedia.cn/chwl/newsh.jpg'
}
};
// 肯德基分享配文数据
export const KFCrestaurant = async function() {
let code = await GetUserInvitationCode();
console.log(code)
return {
title: '这里有一份超值肯德基补贴券,分享给你哦!生活好滋味,尽在肯德基。',
path: `/pages/restaurant/index/index_kdj?bm_yq_code=${code['userInfo']['invite_code']}&brand_id=1&brand_name=肯德基`,
imageUrl: 'https://img.agrimedia.cn/chwl/v2/KFC_share.jpg'
}
};
// 瑞幸分享配文数据
export const RXrestaurant = async function() {
let code = await GetUserInvitationCode();
console.log(code)
return {
title: `美好时光一起小蓝杯一起瑞幸点击这里尽享5折哦`,
path: `/pages/restaurant/index/index_rx?bm_yq_code=${code['userInfo']['invite_code']}&brand_id=13&brand_name=瑞幸`,
imageUrl: 'https://img.agrimedia.cn/chwl/rx/RX_share.jpg'
}
};
// 星巴克分享配文数据
export const XBKSharing = async function() {
let code = await GetUserInvitationCode();
console.log(code)
return {
title: '和你一起来享受星巴克时光 ,美好生活快来点这里有折扣哦',
path: `/pages/restaurant/index/index_xbk?bm_yq_code=${code['userInfo']['invite_code']}&brand_id=10&brand_name=星巴克`,
imageUrl: 'https://img.agrimedia.cn/chwl/xbk/xbk_sharing.jpg'
}
}
// 团队分享配文数据
export const TeamSharing = async function() {
let code = await GetUserInvitationCode();
console.log(code)
return {
title: '我发现了一个超多折扣补贴的小程序,线上线下啥都有,快点开领取吧',
path: `/pages/index/index?bm_yq_code=${code['userInfo']['invite_code']}`,
imageUrl: 'https://img.agrimedia.cn/chwl/v2/Team_sharing.jpg'
}
}
//转赠分享
export const subgiftSharing = async function(value) {
console.log(value,"value")
return {
title: '好友喊你领取消费补贴啦',
path: `/pages/pages-recharge/shareRedEnvelopes/index?code=${value}`,
imageUrl: 'https://img.agrimedia.cn/chwl/newsh.jpg',
desc:"消费补贴卡权益覆盖餐饮、话费、电商、影音娱乐、外卖打车等多种消费场景,消费补贴当钱花,快来领取吧!"
}
}

View File

@ -0,0 +1,87 @@
// import {} from '@/request/index/index.js'
const Tool = {
// getUpToken:() => {
// return new Promise((resolve, reject) => {
// store.dispatch('api/getUpToken').then(res => {
// resolve(res)
// })
// })
// },
/**
* @上传图片
*/
uploadFile: async function({
formData = {},
filePath,
url = `https://up-z1.qiniup.com`,
header = {}
} = {}) {
let Up = await this.getUpToken();
formData['key'] = Up['key'];
formData['token'] = Up['uptoken'];
return new Promise((resolve, erject) => {
// 单图上传
if (filePath.length <= 1) {
uni.uploadFile({
url,
filePath: filePath[0],
name: 'file',
formData,
header,
success: uploadFileRes => {
resolve(JSON.parse(uploadFileRes.data))
},
fail: err => {
}
});
} else {
// 多图上传
let imgs = [];
for (let i = 0; i < filePath.length; i++) {
uni.uploadFile({
url,
filePath: filePath[i],
name: 'file',
formData,
header,
success: uploadFileRes => {
let img = JSON.parse(uploadFileRes.data).data;
imgs.push(img);
if (i === filePath.length - 1) {
console.log('完成');
resolve(imgs)
};
},
fail: err => {
erject(err)
}
});
}
}
})
},
/**
* @手机号格式化方法
*/
phone:function(phone){
let s = 3;
let e = 7;
phone = phone.split('');
console.log(phone.map(item=>{
if(item >= s && item<= e){
item = '*';
}
return item;
}));
// for(let i = 0; i<phone['length'];i++){
// if(i >= s && <= e){
// }
// }
return
}
}
export default Tool

View File

@ -0,0 +1,12 @@
String.prototype.phone = function () {
let s = 3;
let e = 7;
let r;
r = this.split('').map((item, index) => {
if (index >= s && index <= e) {
item = '*';
}
return item;
}).join('');
return r;
}

View File

@ -0,0 +1,119 @@
<!DOCTYPE html>
<html lang="zh">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title></title>
<style type="text/css">
html,
body,
canvas {
padding: 0;
margin: 0;
width: 100%;
height: 100%;
overflow-y: hidden;
background-color: transparent;
}
</style>
</head>
<body>
<canvas id="lime-painter"></canvas>
<script type="text/javascript" src="./uni.webview.1.5.3.js"></script>
<script type="text/javascript" src="./painter.js"></script>
<script>
var cache = [];
var painter = null;
var canvas = null;
var context = null;
var timer = null;
var pixelRatio = 1;
console.log = function (...args) {
postMessage(args);
};
// function stringify(key, value) {
// if (typeof value === 'object' && value !== null) {
// if (cache.indexOf(value) !== -1) {
// return;
// }
// cache.push(value);
// }
// return value;
// };
function emit(event, data) {
postMessage({
event,
data: (typeof data !== 'object' && data !== null ? data : JSON.stringify(data))
});
cache = [];
};
function postMessage(data) {
uni.postMessage({
data
});
};
function init(dpr) {
canvas = document.querySelector('#lime-painter');
context = canvas.getContext('2d');
pixelRatio = dpr || window.devicePixelRatio;
painter = new Painter({
id: 'lime-painter',
context,
canvas,
pixelRatio,
width: canvas.offsetWidth,
height: canvas.offsetHeight,
listen: {
onProgress(v) {
emit('progressChange', v);
},
onEffectFail(err) {
//console.error(err)
emit('fail', err);
}
}
});
emit('inited', true);
};
function save(args) {
delete args.success;
delete args.fail;
clearTimeout(timer);
timer = setTimeout(() => {
const path = painter.save(args);
if (typeof path == 'string') {
const index = Math.ceil(path.length / 8);
for (var i = 0; i < 8; i++) {
if (i == 7) {
emit('success', path.substr(i * index, index));
} else {
emit('file', path.substr(i * index, index));
}
};
} else {
// console.log('canvas no data')
emit('fail', 'canvas no data');
};
}, 30);
};
async function source(args) {
let size = await painter.source(args);
emit('layoutChange', size);
if(!canvas.height) {
console.log('canvas no size')
emit('fail', 'canvas no size');
}
painter.render().catch(err => {
// console.error(err)
emit('fail', err);
});
};
</script>
</body>
</html>

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

1
unpackage/dist/dev/app-plus/view.css vendored Normal file

File diff suppressed because one or more lines are too long

File diff suppressed because one or more lines are too long

View File

@ -9,3 +9,44 @@ export const isMiniPrograms = () => {
}); });
return isMiniprogram; return isMiniprogram;
} }
export const launchWechatMiniProgram = (id, type, path) => {
if (typeof plus === 'undefined') {
reject(new Error('当前环境不支持plus API'));
return;
}
plus.share.getServices((res) => {
// 查找微信服务
const wxService = res.find(s => s.id === 'weixin');
if (!wxService) {
plus.nativeUI.alert('当前环境不支持微信操作!');
reject(new Error('未找到微信服务'));
return;
}
if (!wxService.nativeClient) {
uni.showToast({
title: '请安装微信',
icon: 'none'
});
reject(new Error('未安装微信客户端'));
return;
}
// 调起微信小程序
uni.showToast({ title: '跳转支付中…', icon: 'none' });
wxService.launchMiniProgram({
id,
type,
path
},(success) => {
console.log(success)
},
(err) => {
return uni.showToast({
title: err,
icon: 'none',
})
})
})
}