tmp: 部分代码与UnishopV5结合，但是代码有严重缺陷
This commit is contained in:
220
pages_tool/verification/detail.vue
Normal file
220
pages_tool/verification/detail.vue
Normal file
@@ -0,0 +1,220 @@
|
||||
<template>
|
||||
<page-meta :page-style="themeColor"></page-meta>
|
||||
<view class="container">
|
||||
<view class="site-wrap">
|
||||
<view class="site-header">
|
||||
<view class="shu color-base-bg"></view>
|
||||
<view class="order-detail font-size-base">订单明细</view>
|
||||
</view>
|
||||
<view class="xian"></view>
|
||||
<view class="site-body">
|
||||
<block v-for="(goodsItem, goodsIndex) in verifyInfo.item_array" :key="goodsIndex">
|
||||
<view class="goods-wrap">
|
||||
<view class="goods-img"><image :src="$util.img(goodsItem.img)" @error="imageError(goodsIndex)" mode="aspectFill"></image></view>
|
||||
<view class="info-wrap">
|
||||
<view class="goods-info">
|
||||
<text class="goods-name font-size-base">{{ goodsItem.name }}</text>
|
||||
</view>
|
||||
<view class="money-wrap">
|
||||
<view class="align-right">{{ $lang('common.currencySymbol') }}{{ goodsItem.price | abs }}</view>
|
||||
<view class="align-right color-tip">
|
||||
<text class="iconfont icon-close"></text>
|
||||
{{ goodsItem.num }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="all">
|
||||
<view class="all-num">共{{ goodsItem.num }}件商品</view>
|
||||
<view class="all-money color-base-text">
|
||||
<text>合计:</text>
|
||||
￥{{ goodsItem.all | abs }}
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
<view class="xian"></view>
|
||||
<view class="order-cell" v-for="(remarkItem, remarkIndex) in verifyInfo.remark_array" :key="remarkIndex" v-if="remarkItem.value">
|
||||
<text class="tit">{{ remarkItem.title }}：</text>
|
||||
<view class="box">
|
||||
<text class="color-tip">{{ remarkItem.value }}</text>
|
||||
<view class="copy" @click="copy(remarkItem.value)" v-if="remarkItem.title == '订单编号'">复制</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="order-summary">
|
||||
<view class="site-header">
|
||||
<view class="shu color-base-bg"></view>
|
||||
<view class="order-detail">核销明细</view>
|
||||
</view>
|
||||
<view class="xian"></view>
|
||||
<view class="order-cell">
|
||||
<text class="tit">核销类型：</text>
|
||||
<view class="box">
|
||||
<text class="color-tip">{{ verifyInfo.verify_type_name }}</text>
|
||||
</view>
|
||||
</view>
|
||||
<block v-if="verifyInfo.is_verify">
|
||||
<view class="order-cell">
|
||||
<text class="tit">核销状态：</text>
|
||||
<view class="box"><text class="color-tip">已核销</text></view>
|
||||
</view>
|
||||
<view class="order-cell" v-if="verifyInfo.verify_time">
|
||||
<text class="tit">核销人员：</text>
|
||||
<view class="box">
|
||||
<text class="color-tip">{{ verifyInfo.verifier_name }}</text>
|
||||
</view>
|
||||
</view>
|
||||
<view class="order-cell" v-if="verifyInfo.verify_time">
|
||||
<text class="tit">核销时间：</text>
|
||||
<view class="box">
|
||||
<text class="color-tip">{{ $util.timeStampTurnTime(verifyInfo.verify_time) }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
</view>
|
||||
<view class="verify-btn" @click="verify" v-if="verifyInfo.is_verify == 0"><button type="primary">确认使用</button></view>
|
||||
|
||||
<loading-cover ref="loadingCover"></loading-cover>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
code: '',
|
||||
verifyInfo: {
|
||||
verify_content: {
|
||||
item_array: [],
|
||||
remark_array: []
|
||||
}
|
||||
},
|
||||
info: [],
|
||||
isSub: false
|
||||
};
|
||||
},
|
||||
onLoad(option) {
|
||||
if (option.code) this.code = option.code;
|
||||
// 小程序扫码进入
|
||||
if (option.scene) {
|
||||
var sceneParams = decodeURIComponent(option.scene);
|
||||
sceneParams = sceneParams.split('&');
|
||||
if (sceneParams.length) {
|
||||
sceneParams.forEach(item => {
|
||||
if (item.indexOf('code') != -1) this.code = item.split('-')[1];
|
||||
});
|
||||
}
|
||||
}
|
||||
},
|
||||
onShow() {
|
||||
if (this.storeToken) this.checkIsVerifier();
|
||||
else this.$util.redirectTo('/pages/member/index');
|
||||
|
||||
this.getVerifyInfo();
|
||||
},
|
||||
methods: {
|
||||
checkIsVerifier() {
|
||||
this.$api.sendRequest({
|
||||
url: '/api/verify/checkisverifier',
|
||||
success: res => {
|
||||
if (!res.data) {
|
||||
this.$util.showToast({
|
||||
title: '非核销员无此权限'
|
||||
});
|
||||
setTimeout(() => {
|
||||
uni.navigateBack({
|
||||
delta: 1
|
||||
});
|
||||
}, 1000);
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
getVerifyInfo() {
|
||||
this.$api.sendRequest({
|
||||
url: '/api/verify/verifyInfo',
|
||||
data: {
|
||||
verify_code: this.code
|
||||
},
|
||||
success: res => {
|
||||
if (res.code >= 0) {
|
||||
this.verifyInfo = res.data;
|
||||
this.info = this.verifyInfo.remark_array.splice(0, 1);
|
||||
this.verifyInfo.item_array.forEach(item => {
|
||||
item.all = item.num * item.price;
|
||||
});
|
||||
|
||||
if (this.$refs.loadingCover) this.$refs.loadingCover.hide();
|
||||
} else {
|
||||
this.$util.showToast({
|
||||
title: res.message
|
||||
});
|
||||
setTimeout(() => {
|
||||
uni.navigateBack({
|
||||
delta: 1
|
||||
});
|
||||
}, 1000);
|
||||
}
|
||||
},
|
||||
fail: res => {
|
||||
if (this.$refs.loadingCover) this.$refs.loadingCover.hide();
|
||||
}
|
||||
});
|
||||
},
|
||||
verify() {
|
||||
if (this.isSub) return;
|
||||
this.isSub = true;
|
||||
this.$api.sendRequest({
|
||||
url: '/api/verify/verify',
|
||||
data: {
|
||||
verify_code: this.code
|
||||
},
|
||||
success: res => {
|
||||
this.$util.showToast({
|
||||
title: res.message
|
||||
});
|
||||
if (res.code >= 0) {
|
||||
let jump = true;
|
||||
let arr = getCurrentPages().reverse();
|
||||
let jump_url = 'pages_tool/verification/index';
|
||||
for (let i = 0; i < arr.length; i++) {
|
||||
if (jump_url.indexOf(arr[i].route) != -1) {
|
||||
jump = false;
|
||||
setTimeout(() => {
|
||||
uni.navigateBack({
|
||||
delta: i
|
||||
});
|
||||
}, 1000);
|
||||
break;
|
||||
}
|
||||
}
|
||||
if (jump) {
|
||||
this.$util.redirectTo('/pages_tool/verification/index',{},'redirectTo');
|
||||
}
|
||||
} else {
|
||||
this.isSub = false;
|
||||
}
|
||||
}
|
||||
});
|
||||
},
|
||||
imageError(index) {
|
||||
this.verifyInfo.item_array[index].img = this.$util.getDefaultImage().goods;
|
||||
this.$forceUpdate();
|
||||
},
|
||||
copy(str) {
|
||||
this.$util.copy(str);
|
||||
}
|
||||
},
|
||||
filters: {
|
||||
abs(value) {
|
||||
return Math.abs(parseFloat(value)).toFixed(2);
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
@import './public/css/detail.scss';
|
||||
</style>
|
||||
369
pages_tool/verification/index.vue
Normal file
369
pages_tool/verification/index.vue
Normal file
@@ -0,0 +1,369 @@
|
||||
<template>
|
||||
<page-meta :page-style="themeColor"></page-meta>
|
||||
<view class="container">
|
||||
<view class="action-wrap">
|
||||
<view class="record-wrap color-base-text" @click="$util.redirectTo('/pages_tool/verification/list')">
|
||||
<text class="iconfont icon-jilu color-base-text"></text>
|
||||
<text>核销记录</text>
|
||||
</view>
|
||||
|
||||
<view class="sweep-code ns-gradient-otherpages-member-balance-balance-rechange" @click="scanCode" v-show="operationType == 'sweepCode'">
|
||||
<text class="iconfont icon-saoma"></text>
|
||||
</view>
|
||||
<view class="manual-input" v-show="operationType == 'manualInput'">
|
||||
<view class="process-wrap">
|
||||
<view class="wrap">
|
||||
<view class="_icon"><text class="iconfont icon-shurutianxiebi color-base-text"></text></view>
|
||||
<view class="_text">输入核销码</view>
|
||||
</view>
|
||||
<view>
|
||||
<view><text class="iconfont icon-jiang-copy color-tip"></text></view>
|
||||
</view>
|
||||
<view class="wrap">
|
||||
<view class="_icon"><text class="iconfont icon-hexiao color-base-text"></text></view>
|
||||
<view class="_text">核销</view>
|
||||
</view>
|
||||
</view>
|
||||
<input type="text" placeholder="请输入核销码" class="_input" placeholder-class="_placeholder" v-model="verify_code" :focus="isFocus" ref="input" />
|
||||
<view class="_btn" @click="confirm"><button type="primary">确认</button></view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="arc-edge"></view>
|
||||
|
||||
<view class="action-type-wrap">
|
||||
<view class="action" @click="changeOperationType('sweepCode')">
|
||||
<view class="_icon"><text class="iconfont icon-saoma"></text></view>
|
||||
<view class="_text">扫码核销</view>
|
||||
</view>
|
||||
<view class="iconfont icon-tiaoxingmasaomiao ns-gradient-otherpages-member-balance-balance-rechange"></view>
|
||||
<view class="action" @click="changeOperationType('manualInput')">
|
||||
<view class="_icon"><text class="iconfont icon-shuru"></text></view>
|
||||
<view class="_text" @click="focus">手动输入</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<ns-login ref="login"></ns-login>
|
||||
<loading-cover ref="loadingCover"></loading-cover>
|
||||
|
||||
<!-- #ifdef MP-WEIXIN -->
|
||||
<!-- 小程序隐私协议 -->
|
||||
<privacy-popup ref="privacyPopup"></privacy-popup>
|
||||
<!-- #endif -->
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { Weixin } from 'common/js/wx-jssdk.js';
|
||||
import Config from '@/common/js/config.js';
|
||||
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
// #ifdef H5
|
||||
operationType: 'manualInput',
|
||||
// #endif
|
||||
// #ifndef H5
|
||||
operationType: 'sweepCode',
|
||||
// #endif
|
||||
verify_code: '',
|
||||
isFocus: false,
|
||||
detail_path:'/pages_tool/verification/detail',
|
||||
};
|
||||
},
|
||||
onLoad() {},
|
||||
onShow() {
|
||||
if (this.storeToken) {
|
||||
this.checkIsVerifier();
|
||||
} else {
|
||||
this.$nextTick(() => {
|
||||
this.$refs.login.open('/pages_tool/verification/index');
|
||||
});
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
focus() {
|
||||
this.isFocus = !this.isFocus;
|
||||
},
|
||||
scanCode() {
|
||||
// #ifdef MP
|
||||
uni.scanCode({
|
||||
onlyFromCamera: true,
|
||||
success: res => {
|
||||
if (res.errMsg == 'scanCode:ok') {
|
||||
let result = res.result;
|
||||
let code = '';
|
||||
switch(res.scanType){
|
||||
case 'CODE_128':
|
||||
code = result;
|
||||
break;
|
||||
case 'QR_CODE':
|
||||
if(result.indexOf(this.detail_path) > -1){
|
||||
let matchs = result.match(/\?code=(.+)/);
|
||||
if(matchs.length == 2){
|
||||
code = matchs[1];
|
||||
}
|
||||
}
|
||||
break;
|
||||
}
|
||||
if(!code){
|
||||
this.$util.showToast({
|
||||
title: '请扫码正确的条码或二维码'
|
||||
});
|
||||
return;
|
||||
}
|
||||
this.$util.redirectTo(this.detail_path+'?code='+code);
|
||||
} else {
|
||||
this.$util.showToast({
|
||||
title: res.errorMsg
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
// #endif
|
||||
|
||||
// #ifdef H5
|
||||
if (this.$util.isWeiXin()) {
|
||||
if (uni.getSystemInfoSync().platform == 'ios') {
|
||||
var url = uni.getStorageSync('initUrl');
|
||||
} else {
|
||||
var url = location.href;
|
||||
}
|
||||
this.$api.sendRequest({
|
||||
url: '/wechat/api/wechat/jssdkconfig',
|
||||
data: {
|
||||
url: url
|
||||
},
|
||||
success: jssdkRes => {
|
||||
if (jssdkRes.code == 0) {
|
||||
var wxJS = new Weixin();
|
||||
wxJS.init(jssdkRes.data);
|
||||
wxJS.scanQRCode(res => {
|
||||
if (res.resultStr) {
|
||||
let result = res.resultStr;
|
||||
let code = '';
|
||||
if (result.indexOf(this.detail_path) != -1){
|
||||
let matchs = result.match(/\?code=(.+)/);
|
||||
if(matchs.length == 2){
|
||||
code = matchs[1];
|
||||
}
|
||||
}else if(result.indexOf('CODE_128') != -1){
|
||||
code = result.split(',')[1];
|
||||
}
|
||||
if(!code){
|
||||
this.$util.showToast({
|
||||
title: '请扫码正确的条码或二维码'
|
||||
});
|
||||
return;
|
||||
}
|
||||
this.$util.redirectTo(this.detail_path+'?code='+code);
|
||||
}
|
||||
});
|
||||
} else {
|
||||
this.$util.showToast({
|
||||
title: jssdkRes.message
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
// #endif
|
||||
},
|
||||
changeOperationType(type) {
|
||||
// #ifdef H5
|
||||
if (type == 'sweepCode' && !this.$util.isWeiXin()) {
|
||||
this.$util.showToast({
|
||||
title: 'H5端不支持扫码核销'
|
||||
});
|
||||
return;
|
||||
}
|
||||
// #endif
|
||||
this.operationType = type;
|
||||
},
|
||||
checkIsVerifier() {
|
||||
this.$api.sendRequest({
|
||||
url: '/api/verify/checkisverifier',
|
||||
success: res => {
|
||||
if (!res.data) {
|
||||
this.$util.showToast({ title: '非核销员无此权限' });
|
||||
setTimeout(() => {
|
||||
this.$util.redirectTo('/pages/member/index');
|
||||
}, 1000);
|
||||
}
|
||||
if (this.$refs.loadingCover) this.$refs.loadingCover.hide();
|
||||
}
|
||||
});
|
||||
},
|
||||
confirm() {
|
||||
var reg = /[\S]+/;
|
||||
if (!reg.test(this.verify_code)) {
|
||||
this.$util.showToast({ title: '请输入核销码' });
|
||||
return false;
|
||||
}
|
||||
this.$api.sendRequest({
|
||||
url: '/api/verify/verifyInfo',
|
||||
data: {
|
||||
verify_code: this.verify_code
|
||||
},
|
||||
success: res => {
|
||||
if (res.code >= 0) {
|
||||
this.$util.redirectTo('/pages_tool/verification/detail', { code: this.verify_code });
|
||||
} else {
|
||||
this.$util.showToast({ title: res.message });
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
storeToken: function(nVal, oVal) {
|
||||
if (nVal) {
|
||||
this.checkIsVerifier();
|
||||
}
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
.container {
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
|
||||
.action-wrap {
|
||||
padding: 100rpx 0;
|
||||
background: #fff;
|
||||
position: relative;
|
||||
|
||||
.record-wrap {
|
||||
position: absolute;
|
||||
top: 30rpx;
|
||||
right: 30rpx;
|
||||
|
||||
.iconfont {
|
||||
font-size: $font-size-tag;
|
||||
margin-right: 10rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.sweep-code {
|
||||
width: 400rpx;
|
||||
height: 400rpx;
|
||||
box-shadow: 0 8px 8px 0 rgba(0, 0, 0, 0.03), 0 6px 3px 0 rgba(0, 0, 0, 0.02);
|
||||
border-radius: 50%;
|
||||
margin: 0 auto;
|
||||
text-align: center;
|
||||
line-height: 400rpx;
|
||||
background: $base-color;
|
||||
|
||||
.iconfont {
|
||||
color: #fff;
|
||||
font-size: 150rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.manual-input {
|
||||
width: 70%;
|
||||
margin: auto;
|
||||
|
||||
.process-wrap {
|
||||
height: 140rpx;
|
||||
display: flex;
|
||||
padding-top: 60rpx;
|
||||
|
||||
.wrap {
|
||||
flex: 1;
|
||||
text-align: center;
|
||||
|
||||
._icon {
|
||||
width: 60rpx;
|
||||
height: 60rpx;
|
||||
background: #eee;
|
||||
border-radius: 50%;
|
||||
margin: 0 auto;
|
||||
color: $color-tip;
|
||||
|
||||
.iconfont {
|
||||
font-size: $font-size-toolbar;
|
||||
}
|
||||
}
|
||||
|
||||
._text {
|
||||
font-size: $font-size-tag;
|
||||
margin-top: 10rpx;
|
||||
color: $color-tip;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
._input {
|
||||
height: 80rpx;
|
||||
border: 1px solid #eee;
|
||||
border-radius: 8rpx;
|
||||
box-sizing: border-box;
|
||||
padding: 20rpx;
|
||||
font-size: $font-size-base;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
._placeholder {
|
||||
font-size: $font-size-base;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
._btn {
|
||||
margin-top: 40rpx;
|
||||
height: 80rpx;
|
||||
line-height: 80rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.arc-edge {
|
||||
width: 100%;
|
||||
height: 80rpx;
|
||||
background: #fff;
|
||||
border-radius: 400rpx/40rpx; /*上下有弧度的边*/
|
||||
transform: translateY(-50%);
|
||||
}
|
||||
|
||||
.action-type-wrap {
|
||||
width: 70%;
|
||||
height: 90rpx;
|
||||
background: #fff;
|
||||
border-radius: 90rpx;
|
||||
display: flex;
|
||||
position: relative;
|
||||
box-shadow: 0 6px 6px 0 rgba(0, 0, 0, 0.03), 0 4px 2px 0 rgba(0, 0, 0, 0.04);
|
||||
margin: 100rpx auto;
|
||||
|
||||
.action {
|
||||
flex: 1;
|
||||
text-align: center;
|
||||
color: $color-title;
|
||||
|
||||
._icon {
|
||||
line-height: 25px;
|
||||
height: 25px;
|
||||
}
|
||||
|
||||
._text {
|
||||
font-size: $font-size-tag;
|
||||
line-height: 1;
|
||||
}
|
||||
}
|
||||
|
||||
.icon-tiaoxingmasaomiao {
|
||||
width: 110rpx;
|
||||
height: 110rpx;
|
||||
border-radius: 50%;
|
||||
transform: translateY(-10rpx);
|
||||
box-shadow: 0 8px 8px 0 rgba(0, 0, 0, 0.03), 0 6px 3px 0 rgba(0, 0, 0, 0.02);
|
||||
text-align: center;
|
||||
line-height: 110rpx;
|
||||
background: $base-color;
|
||||
color: #fff;
|
||||
font-size: $font-size-toolbar;
|
||||
}
|
||||
}
|
||||
}
|
||||
</style>
|
||||
186
pages_tool/verification/list.vue
Normal file
186
pages_tool/verification/list.vue
Normal file
@@ -0,0 +1,186 @@
|
||||
<template>
|
||||
<page-meta :page-style="themeColor"></page-meta>
|
||||
<view class="verify-container">
|
||||
<view class="type-wrap">
|
||||
<view v-for="(typeItem, typeIndex) in typeList" :key="typeIndex" class="uni-tab-item" :id="typeItem.pickup" :data-current="typeIndex" @click="ontabtap">
|
||||
<text class="uni-tab-item-title" :class="type == typeIndex ? 'uni-tab-item-title-active color-base-text color-base-border' : ''">{{ typeItem.name }}</text>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<swiper :current="type" class="swiper-box" style="flex: 1;" :duration="200" @change="ontabchange">
|
||||
<swiper-item class="swiper-item" :key="typeIndex" v-for="(typeItem, typeIndex) in typeList">
|
||||
<scroll-view scroll-y="true" class="verify-list" @scrolltolower="scrolltolower">
|
||||
<block v-if="verifyList[typeIndex] != undefined && verifyList[typeIndex].list.length > 0">
|
||||
<view class="item" v-for="(item, index) in verifyList[typeIndex].list" :key="index">
|
||||
<view @click="toDetail(item.verify_code)">
|
||||
<view class="header">
|
||||
<view class="color-tip font-size-goods-tag">核销码：{{ item.verify_code }}</view>
|
||||
<view class="color-tip align-right font-size-goods-tag">核销员：{{ item.verifier_name }}</view>
|
||||
</view>
|
||||
<view class="xian"></view>
|
||||
<view class="body">
|
||||
<view class="content-item" v-for="(citem, citemIndex) in item.item_array" :key="citemIndex">
|
||||
<view class="img-wrap">
|
||||
<image :src="$util.img(citem.img)" @error="imageError(typeIndex, index, citemIndex)" mode="aspectFill"></image>
|
||||
</view>
|
||||
<view class="info-wrap">
|
||||
<view class="name-wrap">
|
||||
<view class="goods-name font-size-tag">{{ citem.name }}</view>
|
||||
<view class="font-size-goods-tag color-tip">核销时间：{{ $util.timeStampTurnTime(item.verify_time) }}</view>
|
||||
</view>
|
||||
<view class="money-wrap">
|
||||
<view class="align-right color-tip font-size-goods-tag">
|
||||
<text class="iconfont icon-close font-size-goods-tag"></text>
|
||||
<text>{{ citem.num }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
<view class="money-wrap">
|
||||
<view>
|
||||
<text class="color-base-text font-size-goods-tag">{{ $lang('common.currencySymbol') }}</text>
|
||||
<text class="font-size-base color-base-text">{{ citem.price | abs }}</text>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</block>
|
||||
<block v-else><ns-empty :isIndex="false" text="暂无核销记录!"></ns-empty></block>
|
||||
</scroll-view>
|
||||
</swiper-item>
|
||||
</swiper>
|
||||
<loading-cover ref="loadingCover"></loading-cover>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
scrollInto: '',
|
||||
type: 0,
|
||||
typeList: [],
|
||||
verifyList: [],
|
||||
isShow: false
|
||||
};
|
||||
},
|
||||
onShow() {
|
||||
this.getVerifyType();
|
||||
},
|
||||
methods: {
|
||||
toDetail(id) {
|
||||
this.$util.redirectTo('/pages_tool/verification/detail', {
|
||||
code: id
|
||||
});
|
||||
},
|
||||
ontabtap(e) {
|
||||
let index = e.target.dataset.current || e.currentTarget.dataset.current;
|
||||
this.switchTab(index);
|
||||
this.isShow = false;
|
||||
},
|
||||
switchTab(index) {
|
||||
if (this.type === index) {
|
||||
return;
|
||||
}
|
||||
this.type = index;
|
||||
this.scrollInto = this.typeList[index].type;
|
||||
},
|
||||
ontabchange(e) {
|
||||
let index = e.target.current || e.detail.current;
|
||||
this.switchTab(index);
|
||||
},
|
||||
getVerifyType() {
|
||||
this.$api.sendRequest({
|
||||
url: '/api/verify/getVerifyType',
|
||||
success: res => {
|
||||
if (res.code >= 0) {
|
||||
this.typeList = [];
|
||||
this.verifyList = [];
|
||||
|
||||
Object.keys(res.data).forEach(key => {
|
||||
this.typeList.push({
|
||||
type: key,
|
||||
name: res.data[key].name
|
||||
});
|
||||
this.verifyList.push({
|
||||
page: 1,
|
||||
totalPage: 1,
|
||||
list: [],
|
||||
isLoading: false
|
||||
});
|
||||
this.getVerifyList(key, 1, this.typeList.length - 1);
|
||||
});
|
||||
}
|
||||
},
|
||||
fail: res => {
|
||||
if (this.$refs.loadingCover) this.$refs.loadingCover.hide();
|
||||
}
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 获取核销记录
|
||||
* @param {Object} type
|
||||
* @param {Object} page
|
||||
* @param {Object} index
|
||||
*/
|
||||
getVerifyList(type, page, index) {
|
||||
if (this.verifyList[index].isLoading || (page != 1 && page > this.verifyList[index].totalPage)) return;
|
||||
|
||||
this.verifyList[index].isLoading = true;
|
||||
this.verifyList[index].loadingType = 'loading';
|
||||
this.$api.sendRequest({
|
||||
url: '/api/verify/lists',
|
||||
data: {
|
||||
verify_type: type,
|
||||
page: page
|
||||
},
|
||||
success: res => {
|
||||
this.verifyList[index].page = page;
|
||||
if (page == 1) {
|
||||
this.verifyList[index].list = [];
|
||||
uni.stopPullDownRefresh();
|
||||
}
|
||||
if (res.data.list.length) {
|
||||
res.data.list.forEach(item => {
|
||||
this.verifyList[index].list.push(item);
|
||||
});
|
||||
}
|
||||
this.verifyList[index].totalPage = res.data.page_count;
|
||||
this.verifyList[index].isLoading = false;
|
||||
this.verifyList[index].loadingType = page == this.verifyList[index].totalPage ? 'nomore' : 'more';
|
||||
if (this.$refs.loadingCover) this.$refs.loadingCover.hide();
|
||||
this.isShow = true;
|
||||
}
|
||||
});
|
||||
},
|
||||
/**
|
||||
* 滑到底部加载
|
||||
*/
|
||||
scrolltolower() {
|
||||
let index = this.type;
|
||||
this.getVerifyList(this.typeList[index].type, this.verifyList[index].page + 1, index);
|
||||
},
|
||||
/**
|
||||
* 下拉刷新
|
||||
*/
|
||||
onPullDownRefresh() {
|
||||
let index = this.type;
|
||||
this.getVerifyList(this.typeList[index].type, 1, index);
|
||||
},
|
||||
imageError(typeIndex, index, citemIndex) {
|
||||
this.verifyList[typeIndex].list[index].item_array[citemIndex].img = this.$util.getDefaultImage().goods;
|
||||
this.$forceUpdate();
|
||||
}
|
||||
},
|
||||
filters: {
|
||||
abs(value) {
|
||||
return Math.abs(parseFloat(value)).toFixed(2);
|
||||
}
|
||||
}
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
@import './public/css/list.scss';
|
||||
</style>
|
||||
237
pages_tool/verification/public/css/detail.scss
Normal file
237
pages_tool/verification/public/css/detail.scss
Normal file
@@ -0,0 +1,237 @@
|
||||
@mixin flex-row-center {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
@mixin wrap {
|
||||
margin: $margin-updown $margin-both;
|
||||
padding: $padding;
|
||||
border-radius: $border-radius;
|
||||
background: #fff;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.align-right {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.container {
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
}
|
||||
|
||||
.site-wrap {
|
||||
@include wrap;
|
||||
padding: 0;
|
||||
padding-bottom: 40rpx;
|
||||
|
||||
.site-header {
|
||||
padding: 20rpx 20rpx 20rpx 30rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.shu {
|
||||
width: 6rpx;
|
||||
height: 30rpx;
|
||||
background: rgba(255, 69, 68, 1);
|
||||
margin-right: 14rpx;
|
||||
}
|
||||
|
||||
.icon-dianpu {
|
||||
display: inline-block;
|
||||
line-height: 1;
|
||||
margin-right: 12rpx;
|
||||
font-size: $font-size-base;
|
||||
}
|
||||
}
|
||||
.xian {
|
||||
width: 100%;
|
||||
border: 0.5px solid #e7e7e7;
|
||||
}
|
||||
|
||||
.site-body {
|
||||
margin: 20rpx;
|
||||
.goods-wrap {
|
||||
padding: 0 20rpx 20rpx 20rpx;
|
||||
display: flex;
|
||||
padding-top: 20rpx;
|
||||
|
||||
.goods-img {
|
||||
flex: 2;
|
||||
width: 120rpx;
|
||||
height: 120rpx;
|
||||
|
||||
image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.info-wrap {
|
||||
flex: 8;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
width: 100%;
|
||||
padding-right: 23rpx;
|
||||
.goods-info {
|
||||
flex: 1;
|
||||
padding-left: 23rpx;
|
||||
|
||||
.goods-name {
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: 2;
|
||||
overflow: hidden;
|
||||
line-height: 1.5;
|
||||
font-size: $font-size-goods-tag;
|
||||
color: #000000;
|
||||
}
|
||||
}
|
||||
|
||||
.money-wrap {
|
||||
margin-top: 31rpx;
|
||||
padding: 0 23rpx;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
width: 100%;
|
||||
.align-right {
|
||||
font-weight: normal;
|
||||
font-size: $font-size-tag;
|
||||
margin-right: 2rpx;
|
||||
}
|
||||
|
||||
.iconfont {
|
||||
line-height: 1;
|
||||
font-size: $font-size-tag;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.xian {
|
||||
width: 100%;
|
||||
border: 0.5px solid #e7e7e7;
|
||||
}
|
||||
.xian-other {
|
||||
width: 100%;
|
||||
border: 0.5px solid #e7e7e7;
|
||||
}
|
||||
.all {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
padding: 20rpx;
|
||||
align-items: baseline;
|
||||
.all-num {
|
||||
font-size: $font-size-goods-tag;
|
||||
color: #383838;
|
||||
}
|
||||
.all-money {
|
||||
text {
|
||||
font-size: $font-size-goods-tag;
|
||||
color: #383838;
|
||||
margin-right: 5rpx;
|
||||
}
|
||||
font-size: $font-size-base;
|
||||
font-weight: 500;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.order-cell {
|
||||
display: flex;
|
||||
margin: 28rpx 0;
|
||||
align-items: center;
|
||||
background: #fff;
|
||||
line-height: 40rpx;
|
||||
padding-left: 20rpx;
|
||||
|
||||
.tit {
|
||||
text-align: left;
|
||||
color: #838383;
|
||||
font-size: $font-size-goods-tag;
|
||||
}
|
||||
|
||||
.box {
|
||||
flex: 1;
|
||||
padding: 0 57rpx;
|
||||
line-height: inherit;
|
||||
color: #000000;
|
||||
font-size: $font-size-goods-tag;
|
||||
|
||||
.copy {
|
||||
font-size: $font-size-activity-tag;
|
||||
display: inline-block;
|
||||
background: #f7f7f7;
|
||||
line-height: 1;
|
||||
padding: 6rpx 10rpx;
|
||||
margin-left: 10rpx;
|
||||
border-radius: 18rpx;
|
||||
border: 2rpx solid #d2d2d2;
|
||||
}
|
||||
|
||||
.textarea {
|
||||
height: 40rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.iconfont {
|
||||
color: #bbb;
|
||||
font-size: $font-size-base;
|
||||
}
|
||||
|
||||
.order-pay {
|
||||
padding: 0;
|
||||
|
||||
text {
|
||||
display: inline-block;
|
||||
margin-left: 6rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.order-summary {
|
||||
@include wrap;
|
||||
margin-bottom: 40rpx;
|
||||
.site-header {
|
||||
padding: 20rpx 20rpx 20rpx 30rpx;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
||||
.shu {
|
||||
width: 6rpx;
|
||||
height: 30rpx;
|
||||
margin-right: 14rpx;
|
||||
}
|
||||
|
||||
.icon-dianpu {
|
||||
display: inline-block;
|
||||
line-height: 1;
|
||||
margin-right: 12rpx;
|
||||
font-size: $font-size-base;
|
||||
}
|
||||
}
|
||||
.xian {
|
||||
width: 100%;
|
||||
border: 0.5px solid #e7e7e7;
|
||||
}
|
||||
|
||||
.order-cell {
|
||||
.tit {
|
||||
color: #999;
|
||||
font-size: $font-size-goods-tag;
|
||||
}
|
||||
|
||||
.box {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
color: #000000;
|
||||
font-size: $font-size-goods-tag;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.verify-btn {
|
||||
margin-top: $margin-updown;
|
||||
}
|
||||
140
pages_tool/verification/public/css/list.scss
Normal file
140
pages_tool/verification/public/css/list.scss
Normal file
@@ -0,0 +1,140 @@
|
||||
.verify-container {
|
||||
width: 100vw;
|
||||
height: 100vh;
|
||||
}
|
||||
|
||||
.align-right {
|
||||
text-align: right;
|
||||
}
|
||||
|
||||
.type-wrap {
|
||||
display: flex;
|
||||
background-color: #fff;
|
||||
height: 90rpx;
|
||||
|
||||
& > view {
|
||||
flex: 1;
|
||||
text-align: center;
|
||||
|
||||
text {
|
||||
line-height: 86rpx;
|
||||
border-bottom: 4rpx solid #fff;
|
||||
display: inline-block;
|
||||
font-size: 30rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.swiper-box {
|
||||
width: 100%;
|
||||
height: calc(100vh - 100rpx);
|
||||
|
||||
.swiper-item {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
||||
.verify-list {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.verify-list {
|
||||
.item {
|
||||
margin: 24rpx;
|
||||
border-radius: $border-radius;
|
||||
background: #fff;
|
||||
position: relative;
|
||||
padding: 30rpx;
|
||||
|
||||
.header {
|
||||
display: flex;
|
||||
padding-bottom: 30rpx;
|
||||
|
||||
view {
|
||||
line-height: 1;
|
||||
flex: 1;
|
||||
max-width: 50%;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
}
|
||||
}
|
||||
|
||||
.xian {
|
||||
width: 100%;
|
||||
border: 0.5px solid #eee;
|
||||
}
|
||||
|
||||
.body {
|
||||
.content-item {
|
||||
display: flex;
|
||||
padding-top: 24rpx;
|
||||
|
||||
.img-wrap {
|
||||
width: 120rpx;
|
||||
height: 120rpx;
|
||||
border-radius: $border-radius;
|
||||
overflow: hidden;
|
||||
|
||||
image {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
}
|
||||
|
||||
.info-wrap {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
width: 100%;
|
||||
padding-right: 23rpx;
|
||||
.name-wrap {
|
||||
flex: 1;
|
||||
padding-left: 23rpx;
|
||||
|
||||
.goods-name {
|
||||
display: -webkit-box;
|
||||
-webkit-box-orient: vertical;
|
||||
-webkit-line-clamp: 1;
|
||||
overflow: hidden;
|
||||
line-height: 1.5;
|
||||
color: #000000;
|
||||
font-size: $font-size-base;
|
||||
}
|
||||
}
|
||||
|
||||
.money-wrap {
|
||||
margin-top: 20rpx;
|
||||
padding: 0 23rpx;
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
width: 100%;
|
||||
align-items: center;
|
||||
|
||||
& > view {
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
.unit {
|
||||
font-weight: normal;
|
||||
font-size: $font-size-tag;
|
||||
margin-right: 2rpx;
|
||||
}
|
||||
|
||||
.iconfont {
|
||||
line-height: 1;
|
||||
// font-size: $font-size-tag;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.money-wrap {
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user