Skip to content

M
member
Commit 61ccec16 by huaying
Options

Merge branch 'feature/9月基础迭代' 

# Conflicts:
#	src/components/allCustomers/order-list/order-table.vue
parents cf4ef4ae aa71758b
Showing with 708 additions and 306 deletions
config/authCode.js
......@@ -24,6 +24,14 @@ const authCode = {
memberInteractionSwitch: 'memberInteractionSwitch', // 会员成就互动类-开关
memberInteractionSetAmount: 'memberInteractionSetAmount', // 会员成就互动类-配置额度
memberInteractionSetAward: 'memberInteractionSetAward', // 会员成就互动类-配置奖励
//客户列表页面 批量导入中的下拉框数据
importMember: 'importMember', //会员导入
importIncreaseOfPoints: 'importIncreaseOfPoints', //积分增加
importPointDeduction: 'importPointDeduction', //积分扣除
importGradeAdjustment: 'importGradeAdjustment', //等级调整
importServiceStore: 'importServiceStore', //服务门店/专属导购调整
importMappingFreeze: 'importMappingFreeze', //批量冻结会员
importMappingUnfreeze: 'importMappingUnfreeze', //批量解冻会员
};
export default authCode;
elethem/index.css
......@@ -3971,11 +3971,12 @@
.el-dialog__headerbtn:focus .el-dialog__close, .el-dialog__headerbtn:hover .el-dialog__close {
color: #2F54EB; }
.el-dialog__title {
line-height: 24px;
font-size: 18px;
line-height: 22px;
font-size: 16px !important;
font-weight: 500;
color: #303133; }
.el-dialog__body {
padding: 20px 20px 10px 20px;
padding: 10px 20px 10px 20px;
color: #606266;
font-size: 14px; }
.el-dialog__footer {
......@@ -28288,7 +28289,7 @@
left: 0;
bottom: 0;
width: 100%;
height: 2px;
height: 1px;
background-color: #e4e7ed;
z-index: 1; }
.el-tabs__nav-wrap.is-scrollable {
index.html
......@@ -4,6 +4,7 @@
<meta charset="utf-8" />
<link rel="shortcut icon" href="./favicon.ico" />
<style href="//at.alicdn.com/t/font_2996579_ubjq74uy5wj.css"></style><!--GIC3.0 客户 -->
<script src="//at.alicdn.com/t/font_2996579_ubjq74uy5wj.js"></script><!--GIC3.0 客户 -->
<!-- 3.0 组件库 -->
<script src="//at.alicdn.com/t/font_2859043_ckil7xvsqi.js"></script>
<!-- <link rel="stylesheet" href="//web-1251519181.file.myqcloud.com/simple-style.1.0.2.css"></link> -->
......
src/common/filters/custom.js
......@@ -55,9 +55,17 @@ let fomatFloat = val => {
}
}
let fomatFloatN = val => {
if (val || val == 0) {
return parseFloat(val).toFixed(2)
} else {
return '';
}
}
let defaultImg = val => {
if(!val) {
return './static/img/default.png'
}
}
export { formatTime,fomatNumber,fomatText,formatYMD,fomatFloat,defaultImg,formatHMS }
export { formatTime,fomatNumber,fomatText,formatYMD,fomatFloat,fomatFloatN,defaultImg,formatHMS }
src/components/allCustomers/allCustomersList.vue
......@@ -64,7 +64,7 @@
/>
</template>
</el-select>
<el-button v-if="getCodeAuth('memberBatchImport')" :limit-code="getCode('memberBatchImport')" type="primary" @click="batchImport" style="margin-right:5px">批量导入修改</el-button>
<el-button v-if="getCodeAuth('memberBatchImport')" :limit-code="getCode('memberBatchImport')" type="primary" @click="batchImport" style="margin-right:5px">批量导入</el-button>
</el-form-item>
</el-form>
<!-- <div class="action-wrap">
......@@ -137,6 +137,7 @@
</div>
<div class="list-section-table">
<el-table
:max-height="maxHeight"
v-loading="loading"
:data="tableData"
tooltip-effect="dark"
......@@ -153,7 +154,7 @@
:label="memberFieldsName[colum]"
:prop="colum"
show-overflow-tooltip
:min-width="colum==='name' ? 210 : colum == 'status' ? 170 : 150"
:min-width="colum==='name' ? 200 : (colum == 'status' || colum == 'lastCostPaid') ? 170 : (colum == 'lastCostTime' || colum == 'allChannelLastCostTime' || colum == 'costFeePaid' || colum == 'lastCost' || colum == 'allChannelDiscountRate') ? 180 : colum == 'allChannelCostTimes' ? 160 : (colum == 'costAll' || colum == 'allChannelCostAllPaid' || colum == 'allChannelHighCostPaid' || colum == 'highCost' || colum == 'highCostPaid') ? 190 : 150"
:fixed="colum==='name'"
:sortable="['name','grade','status','channel','createCardStoreName','cardNo','forzenStatus','mainStoreName'].includes(colum)?false:isExist[colum]?'custom':false"
>
......@@ -166,7 +167,11 @@
class="basic-info-table"
@click.native="linkDetail(row.memberId)"
>
<img :src="row.thirdImgUrl || defaultImg" class="basic-img" />
<img v-if="row.thirdImgUrl" :src="row.thirdImgUrl" class="basic-img" />
<svg v-else aria-hidden="true" class="basic-img">
<use xlink:href="#icon-user-default"></use>
</svg>
<div>
<div class="member-name">
......@@ -247,6 +252,11 @@
<div>{{ row.createTime.split(' ')[0] }}</div>
<div>{{ row.createTime.split(' ')[1] }}</div>
</div>
<!-- 最近消费时间(全渠道) -->
<!-- <div v-else-if="colum == 'allChannelLastCostTime'">
<div>{{ row.allChannelLastCostTime.split(' ')[0] }}</div>
<div>{{ row.allChannelLastCostTime.split(' ')[1] }}</div>
</div> -->
<!-- 关注时间 -->
<div v-else-if="colum == 'attentionDate'">
<div>{{ row.attentionTime.split(' ')[0] }}</div>
......
src/components/allCustomers/components/importDialog.vue
......@@ -18,17 +18,22 @@
>
<el-form-item label="导入类型" prop="importValue">
<el-select
style="width: 460px"
v-model="formByImport.importValue"
placeholder="请选择导入类型"
@change="handleChangeType"
:disabled="importList.length < 2"
>
<template v-for="item in importList">
<el-option
:label="item.importValue"
:value="item.importType"
v-for="item in importList"
:key="item"
></el-option>
v-if="getCodeAuth(item.btnCode)"
:limit-code="getCode(item.btnCode)"
:key="item">
</el-option>
</template>
</el-select>
</el-form-item>
<el-form-item label="选择文件" prop="file" required>
......@@ -39,21 +44,10 @@
<div class="dialogTips">
<h3><i class="el-icon-info"></i><span>导入规则</span></h3>
<p>
1. 通过导入Excel表格的形式变更GIC已存在的会员信息；不支持导入新会员数据
</p>
<p>
2. 仅支持.xlsx 文件的导入；每次导入数据量最多为10000条；文件大小不超过1M
</p>
<p>
3.
导入类型不同，文件模板也不同，请严格按照模板内容填入会员数据，否则将会报错
</p>
<p>
4. 请仔细核对需要变更的会员数据是否准确，否则GIC校验不通过将无法执行成功
</p>
<p>
5.
超管账号支持导入变更全部会员信息，已分权商户的子管理员账号仅可修改管辖范围内的会员信息
1. 不同的导入类型，请下载对应的导入模板，按照模板要求填充内容进行导入。<br/>
2. 每次导入数据最多10000条，文件大小不超过1M。<br/>
3. 请仔细核对需要导入/变更的会员数据是否准确，否则GIC校验不通过将无法执行成功。<br/>
4. 超管账号支持导入/变更全部会员信息，已分权商户的子管理员账号仅可导入/变更管辖范围内的会员信息。
</p>
</div>
<span slot="footer" class="dialog-footer">
......@@ -68,8 +62,10 @@
import url from "@/components/axios/url";
import { checkFalse } from "../../../../static/js/checkStatus";
import { doFetch } from "@/components/axios/api";
import authMethods from "@/mixins/auth";
export default {
mixins: [authMethods],
props: {
dialogVisible: {
type: Boolean,
......@@ -82,11 +78,13 @@ export default {
{
importType: 15,
importValue: "批量冻结会员",
btnCode: 'memberBatchImport'
},
{
importType: 16,
importValue: "批量解冻会员",
},
btnCode: 'memberBatchImport'
}
],
},
},
......@@ -130,6 +128,7 @@ export default {
watch: {
importList:{
handler(n){
n = n.filter(item=> item.btnCode);
let value = '';
if(n && n.length){
value = n[0].importType;
......@@ -167,9 +166,10 @@ export default {
},
// 确认导入
importTable() {
if (this.load) return;
this.$refs.formByImport.validateField("importValue", (err) => {
if (!err) {
// console.log(this.formByImport.fileList);
console.log(this.formByImport.fileList);
let {fileList,importValue} = this.formByImport;
if (fileList.length) {
this.load = true;
......@@ -190,7 +190,9 @@ export default {
this.onDialogImportClosed();
}
}).finally(()=>{
this.load = false;
setTimeout(() => {
this.load = false;
}, 50)
})
} else {
checkFalse("请上传文件");
......@@ -206,8 +208,8 @@ export default {
border: none;
}
.dialogTips {
padding-bottom: 8px;
padding-top: 22px;
padding-bottom: 24px;
padding-top: 20px;
border-top: 1px dashed #DCDFE6;
color: #909399;
h3 {
......@@ -225,6 +227,10 @@ export default {
}
p {
font-size: 12px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #909399;
line-height: 20px;
}
}
.success_icon {
......
src/components/allCustomers/components/tableColumDialog.vue
......@@ -85,7 +85,7 @@ export default {
.table-colum-wrap {
display: flex;
flex-wrap: wrap;
width: 100%;
width: 105%;
.table-colum-item {
flex: 25%;
line-height: 35px;
......
src/components/allCustomers/components/wxToPosDialog.vue 0 → 100644
<template>
<el-dialog title="微信转POS" :visible.sync="dialogVisible" custom-class="customer-dialog" @close="cancel" width="420px">
<p style="margin-bottom: 8px">确认将此客户的微信信息删除吗？删除后：</p>
<p style="margin-bottom: 8px">
1、此客户的客户类型将从微信会员转为POS会员；<br/>
2、该客户与微信侧的关联信息将被清除（公众号和小程序）；<br/>
3、与该客户相关的数据统计将产生影响如微信会员数、POS转微信会员数等
</p>
<p>删除后不可恢复，请谨慎操作！</p>
<span slot="footer" class="dialog-footer">
<el-button @click="cancel">取消</el-button>
<el-button type="primary" @click="okBtn">确定</el-button>
</span>
</el-dialog>
</template>
<script>
import { doFetchGet } from '../../axios/api';
import url from '../../axios/url';
export default {
props: {
dialogVisible: {
type: Boolean,
default: false,
},
memberId: {
type: String,
default: ''
}
},
data() {
return {
};
},
methods: {
cancel() {
this.$emit('update:dialogVisible', false);
},
okBtn() {
doFetchGet(url.weChantToPos,{mid: this.memberId}).then((res)=>{
if(res.data.errorCode == 0){
this.cancel();
this.$emit('refresh');
this.$message.success('操作成功');
}else{
this.$message.error(res.data.message);
}
})
}
}
};
</script>
<style lang="less">
.customer-dialog {
/deep/.el-dialog__header{
font-size: 16px !important;
}
}
</style>
<style lang="less" scoped>
.customer-dialog {
background: #000000;
opacity: 0.5;
p {
font-size: 14px;
font-family: PingFangSC-Regular, PingFang SC;
font-weight: 400;
color: #303133;
line-height: 20px;
}
}
</style>
\ No newline at end of file
src/components/allCustomers/customerDetail.vue
......@@ -6,10 +6,13 @@
<h2 class="item-title">
<i class="vertical-line" /><span>{{ section.title }}</span>
</h2>
<el-button type="text" v-if="section.name==='basic' && getCodeAuth('memberEditInfo')"
<div>
<el-button type="text" v-if="section.name==='basic' && getCodeAuth('memberEditInfo')"
@click="baseinfoDialogVisible=true" :limit-code="getCode('memberEditInfo')">
编辑
</el-button>
<el-button type="text" v-if="section.name==='basic' && getCodeAuth('wxToPOS') && member.customerType == 'wxOpenCarMember'" :limit-code="getCode('wxToPOS')" style="margin-left:12px" @click="weChantDialogVisible=true">微信转POS</el-button>
</div>
</div>
<div :class="[section.class]">
<!-- 基本信息 -->
......@@ -29,12 +32,16 @@
<el-image
fit="cover"
class="user-avatar-img"
:src="member.thirdImgUrl ? member.thirdImgUrl : defaultImg"
v-if="member.thirdImgUrl"
:src="member.thirdImgUrl"
>
<div slot="error" class="image-slot">
<img width="120" :src="require('../../../static/img/broke-img.png')" alt="">
</div>
</el-image>
<svg v-else aria-hidden="true" class="user-avatar-img" width="120px" height="120px">
<use xlink:href="#icon-user-default"></use>
</svg>
</div>
</div>
<div class="right">
......@@ -813,6 +820,9 @@
:memberId="memberId"
@refresh="initData"
/>
<!-- 微信转POS弹窗 -->
<wxToPosDialog :dialogVisible.sync="weChantDialogVisible" :memberId="memberId"
@refresh="initData"></wxToPosDialog>
</div>
</template>
<script>
......
src/components/allCustomers/index.js
......@@ -10,7 +10,6 @@ import { doFetch,doFetchGet } from "../../components/axios/api";
import url from "../../components/axios/url";
import { mapState } from "vuex";
import { formatLongTime, paddingBorth } from "@/utils/utils";
import defaultImg from "../../../static/img/default.png";
import authMethods from "@/mixins/auth";
import {
checkFalse,
......@@ -21,6 +20,7 @@ export default {
name: "allCustomersList",
data() {
return {
maxHeight: '',
selectChannelValue: '',
selectChannelList: {
selectOptions: {
......@@ -37,6 +37,7 @@ export default {
// disabled: false
// },
],
showExpandIcon: false,
props: {
label: 'label',
children: 'children',
......@@ -46,30 +47,42 @@ export default {
searchAble: false,
multipleAble: true
},
isShowClique: '',
importList:[
{
importType: 18,
importValue: "会员导入",
btnCode: 'importMember'
},
{
importType: 11,
importValue: "积分增加",
btnCode: 'importIncreaseOfPoints'
},
{
importType: 12,
importValue: "积分扣除",
btnCode: 'importPointDeduction'
},
{
importType: 13,
importValue: "等级调整",
btnCode: 'importGradeAdjustment'
},
{
importType: 14,
importValue: "服务门店/专属导购调整",
btnCode: 'importServiceStore'
},
{
importType: 15,
importValue: "批量冻结会员",
btnCode: 'importMappingFreeze'
},
{
importType: 16,
importValue: "批量解冻会员",
btnCode: 'importMappingUnfreeze'
},
],
sceneValue: "member", // 人群筛选器场景值
......@@ -115,7 +128,6 @@ export default {
{ value: "mainstore", label: "修改服务门店", code: "memberBatchSetService" },
{ value: "store", label: "修改协管门店", code: "memberBatchSetCustomer" }
],
defaultImg,
integralFlag: "", // 积分调整权限
memberGrade: [], // 商户等级列表
cliqueMemberGrade: [], // 集团等级列表
......@@ -237,22 +249,54 @@ export default {
}
},
created() {
this.$store.commit("mutations-slide", true);
this.initialize();
this.getGradeList();
this.getCliqueGradeList();
this.getMemberSourceList();
let screenHeight = document.documentElement.clientHeight - 293 + 'px';
this.$nextTick(() => {
this.maxHeight = screenHeight;
});
},
mounted() {
this.getcliqueMemberRelation();
this.getFindMemberFields();
this.getAjaxMembers();
this.getEnterpriseInfo();
const that = this;
window.onresize = () => {
return (() => {
let screenHeight = document.documentElement.clientHeight - 293 + 'px';
that.maxHeight = screenHeight;
})();
};
},
activated(){
this.getAjaxMembers();
},
beforUpdate() {},
methods: {
getcliqueMemberRelation() {
doFetchGet(url.cliqueMemberRelation, {}).then((res)=>{
let {errorCode,result} = res.data;
if(errorCode == 0){
this.isShowClique = result || 2;
this.importList = this.importList.map((item, index)=>{
if(this.getCodeAuth(item.btnCode)){
if(item.btnCode == 'importMember' && this.isShowClique == 1) {
return {};
}else {
return item;
}
}else{
return {};
}
})
}
})
},
onSelectTreeChange(data) {
this.customerType = data;
},
......@@ -336,10 +380,14 @@ export default {
tableData = resultData.map(ele => ({
...ele,
avgNumber: ele.avgNumber.toFixed(2),
allChannelLastCostTime:
ele.allChannelLastCostTime != -1
? formatLongTime(ele.allChannelLastCostTime, 2)
: "--", // 最近消费时间(全渠道)
lastCostTime:
ele.lastCostTime != -1
? formatLongTime(ele.lastCostTime, 2)
: "--", // 最近消费时间
: "--", // 最近消费时间(线下)
createTime:
ele.createTime != -1
? formatLongTime(ele.createTime, 1)
......
src/components/allCustomers/info.js
......@@ -5,12 +5,12 @@ import customermainstoreDialog from './components/customermainstoreDialog.vue';
import customersubstoreDialog from './components/customersubstoreDialog.vue';
import customerlabelDialog from './components/customerlabelDialog.vue';
import IconLabelValue from './components/icon-label-value.vue';
import defaultImg from '../../../static/img/default.png';
import { mapState } from 'vuex';
import url from '../../components/axios/url';
import { doFetch, doFetchqs, doFetchGet } from '../../components/axios/api';
import authMethods from '@/mixins/auth';
import CustomerLog from './components/customerLog.vue';
import wxToPosDialog from './components/wxToPosDialog.vue';
import {
checkFalse,
checkStatus,
......@@ -72,7 +72,6 @@ export default {
// currentPage: 1,
// },
// totalCount: 0,
defaultImg,
labelTabsActive: 'memberTagGroup',
fullscreenLoading: false, // 全局loading
// tableLoading: false, // 用户日志列表loading
......@@ -176,7 +175,9 @@ export default {
},
// { title: '客户日志', name: 'log', class: 'log-info-contain' },
],
marketingRecordNum: 0
marketingRecordNum: 0,
// 微信转POS
weChantDialogVisible: false,
};
},
watch: {
......@@ -517,6 +518,7 @@ export default {
customersubstoreDialog,
customerlabelDialog,
IconLabelValue,
CustomerLog
CustomerLog,
wxToPosDialog,
},
};
src/components/allCustomers/order-list.vue
<template>
<el-tabs v-model="activeName" class="order-tab">
<!-- <el-tab-pane label="全部订单(61)" name="all">用户管理</el-tab-pane> -->
<el-tab-pane :label="`门店订单(${orderCount.numOfSale || 0})`" name="store">
<div class="order-report">
<div class="order-report-item" v-for="(el, index) in storeOrderReport" :key="index">
<div class="order-report-label">{{ el.label }}</div>
<div class="order-report-value" v-if="el.type == 'int'">{{ el.value || 0 }}</div>
<div class="order-report-value" v-else-if="el.type == 'date'">{{ el.value | formatYMD }}</div>
<div class="order-report-value" v-else>{{ el.value | fomatFloat }}</div>
<div class="orderListBox" :style="activeName != 'store' ? 'margin-top: -20px;' : ''">
<div class="orderListTop" v-if="activeName == 'store'">
<div class="order-report-content">
<div class="order-content-left">
<div class="order-report-title">消费数据概览</div>
<p style="margin-bottom: 13px;">
<img src="../../../static/img/编组 3@2x(1).png" alt="">
<span>全渠道</span>
</p>
<p>
<img src="../../../static/img/编组 3@2x.png" alt="">
<span>门店订单</span>
</p>
</div>
<div class="order-content-right">
<!-- 上 -->
<div class="order-report-box">
<div class="order-report-item">
<div class="order-report-label" style="width:118px">消费总额/实付</div>
<div class="order-report-label" style="width:96px">消费次数</div>
<div class="order-report-label" style="width:124px">最近消费时间</div>
<div class="order-report-label" style="width:82px">客单价</div>
<div class="order-report-label" style="width:82px">连带率</div>
<div class="order-report-label" style="width:131px">最高单笔/实付</div>
<div class="order-report-label" style="width:87px">平均折扣</div>
<div class="order-report-label" style="width:130px">消费总额/应收</div>
<div class="order-report-label" style="width:70px">件单价</div>
<div class="order-report-label" style="width:91px">最高单笔/应收</div>
</div>
</div>
<div style="display:flex;padding-top:3px">
<!-- 中 -->
<div class="order-report-middle">
<div class="order-report-value" style="width:118px">{{ allOrderReport[0].value | fomatFloat }}</div>
<div class="order-report-value" style="width:96px">{{ allOrderReport[1].value || 0 }}</div>
<div class="order-report-value" style="width:124px">{{ allOrderReport[2].value | formatYMD }}</div>
<div class="order-report-value" style="width:82px">{{ allOrderReport[3].value | fomatFloat }}</div>
<div class="order-report-value" style="width:82px">{{ allOrderReport[4].value | fomatFloat }}</div>
<div class="order-report-value" style="width:131px">{{ allOrderReport[5].value | fomatFloat }}</div>
<div class="order-report-value" style="width:87px">{{ allOrderReport[6].value | fomatFloat }}</div>
<div class="order-report-value" style="width:130px">{{ allOrderReport[7].value | fomatFloatN }}</div>
<div class="order-report-value" style="width:70px">{{ allOrderReport[8].value | fomatFloatN }}</div>
<div class="order-report-value" style="width:91px">{{ allOrderReport[9].value | fomatFloatN }}</div>
</div>
</div>
<div style="display:flex">
<!-- 下 -->
<div class="order-report-bottom">
<div class="order-report-value" style="width:118px">{{ storeOrderReport[0].value | fomatFloat }}</div>
<div class="order-report-value" style="width:96px">{{ storeOrderReport[1].value || 0 }}</div>
<div class="order-report-value" style="width:124px">{{ storeOrderReport[2].value | formatYMD }}</div>
<div class="order-report-value" style="width:82px">{{ storeOrderReport[3].value | fomatFloat }}</div>
<div class="order-report-value" style="width:82px">{{ storeOrderReport[4].value | fomatFloat }}</div>
<div class="order-report-value" style="width:131px">{{ storeOrderReport[5].value | fomatFloat }}</div>
<div class="order-report-value" style="width:87px">{{ storeOrderReport[6].value | fomatFloat }}</div>
<div class="order-report-value" style="width:130px">{{ storeOrderReport[7].value | fomatFloat }}</div>
<div class="order-report-value" style="width:70px">{{ storeOrderReport[8].value | fomatFloat }}</div>
<div class="order-report-value" style="width:91px">{{ storeOrderReport[9].value | fomatFloat }}</div>
</div>
</div>
</div>
<!-- <div class="order-report">
<div class="order-report-item" v-for="(el, index) in storeOrderReport" :key="index">
<div class="order-report-label">{{ el.label }}</div>
<div class="order-report-value" v-if="el.type == 'int'">{{ el.value || 0 }}</div>
<div class="order-report-value" v-else-if="el.type == 'date'">{{ el.value | formatYMD }}</div>
<div class="order-report-value" v-else>{{ el.value | fomatFloat }}</div>
</div>
</div> -->
</div>
<order-table tab="store"></order-table>
</el-tab-pane>
<el-tab-pane :label="`达摩微商城(${orderCount.wechatMallNum || 0})`" name="demo">
<order-table tab="demo"></order-table>
</el-tab-pane>
<el-tab-pane :label="`微盟订单(${orderCount.weimobMallNum || 0})`" name="weimob">
<order-table tab="weimob"></order-table>
</el-tab-pane>
<el-tab-pane :label="`天猫订单(${orderCount.numOfTmall || 0})`" name="tmall">
<order-table tab="tmall"></order-table>
</el-tab-pane>
<el-tab-pane :label="`抖音订单(${orderCount.numOfDouYin || 0})`" name="douyin">
<order-table tab="douyin"></order-table>
</el-tab-pane>
<el-tab-pane :label="`其他订单(${orderCount.otherMallNum || 0})`" name="other">
<order-table tab="other"></order-table>
</el-tab-pane>
</el-tabs>
</div>
<el-tabs v-model="activeName" class="order-tab">
<!-- <el-tab-pane label="全部订单(61)" name="all">用户管理</el-tab-pane> -->
<el-tab-pane :label="`门店订单(${orderCount.numOfSale || 0})`" name="store">
<order-table tab="store"></order-table>
</el-tab-pane>
<el-tab-pane :label="`达摩微商城(${orderCount.wechatMallNum || 0})`" name="demo">
<order-table tab="demo"></order-table>
</el-tab-pane>
<el-tab-pane :label="`微盟订单(${orderCount.weimobMallNum || 0})`" name="weimob">
<order-table tab="weimob"></order-table>
</el-tab-pane>
<el-tab-pane :label="`天猫订单(${orderCount.numOfTmall || 0})`" name="tmall">
<order-table tab="tmall"></order-table>
</el-tab-pane>
<el-tab-pane :label="`抖音订单(${orderCount.numOfDouYin || 0})`" name="douyin">
<order-table tab="douyin"></order-table>
</el-tab-pane>
<el-tab-pane :label="`其他订单(${orderCount.otherMallNum || 0})`" name="other">
<order-table tab="other"></order-table>
</el-tab-pane>
</el-tabs>
</div>
</template>
<script>
......@@ -59,15 +123,27 @@ export default {
},
storeOrderReport: [
{ label: '消费总额(实付)', key: 'costFeePaid', type: 'amount', value: 0 },
{ label: '消费总额(应收)', key: 'costFee', type: 'amount', value: 0 },
{ label: '消费次数', key: 'costTimes', type: 'int', value: 0 },
{ label: '最近消费时间', key: 'lastCostTime', type: 'date', value: '' },
{ label: '客单价', key: 'avgCost', type: 'amount', value: 0 },
{ label: '连带率', key: 'relatedPercent', type: 'float', value: 0 },
{ label: '件单价', key: 'avgGoodsCost', type: 'amount', value: 0 },
{ label: '最高单笔(实付)', key: 'highCostPaid', type: 'amount', value: 0 },
{ label: '平均折扣', key: 'avgDiscount', type: 'float', value: 0 },
{ label: '消费总额(应收)', key: 'costFee', type: 'amount', value: 0 },
{ label: '件单价', key: 'avgGoodsCost', type: 'amount', value: 0 },
{ label: '最高单笔(应收)', key: 'highCost', type: 'amount', value: 0 },
],
allOrderReport: [
{ label: '消费总额(实付)', key: 'costFeePaid', type: 'amount', value: 0 },
{ label: '消费次数', key: 'costTimes', type: 'int', value: 0 },
{ label: '最近消费时间', key: 'lastCostTime', type: 'date', value: '' },
{ label: '客单价', key: 'avgCost', type: 'amount', value: 0 },
{ label: '连带率', key: 'relatedPercent', type: 'float', value: 0 },
{ label: '最高单笔(实付)', key: 'highCostPaid', type: 'amount', value: 0 },
{ label: '平均折扣', key: 'avgDiscount', type: 'float', value: 0 },
{ label: '消费总额(应收)', key: 'costFee', type: 'amount', value: 0 },
{ label: '件单价', key: 'avgGoodsCost', type: 'amount', value: 0 },
{ label: '最高单笔(应收)', key: 'highCost', type: 'amount', value: 0 },
]
}
},
......@@ -76,6 +152,7 @@ export default {
this.memberId = this.$route.query.memberId;
this.getMemberInfo();
this.getStoreReportData();
this.getAllReportData();
},
methods: {
getMemberInfo() {
......@@ -86,6 +163,17 @@ export default {
this.orderCount = { numOfCustomer, numOfSale, wechatMallNum, weimobMallNum, numOfTmall, numOfDouYin, otherMallNum };
})
},
// 全渠道
getAllReportData() {
doFetch(url.ajaxMembersInfo, { memberId: this.memberId, orderType: 0 }).then(res => {
const { result } = res.data || {};
const memberInfo = result.memberInfo || {};
this.allOrderReport.forEach(el => {
el.value = memberInfo[el.key];
});
});
},
// 门店
getStoreReportData() {
doFetch(url.ajaxMembersInfo, { memberId: this.memberId }).then(res => {
const { result } = res.data || {};
......@@ -100,48 +188,132 @@ export default {
</script>
<style lang="scss" scoped>
.orderListBox {
background: #FFFFFF;
.orderListTop {
background: #F7F8FA;
margin: 20px;
margin-bottom: -10px;
.order-report-content {
display: flex;
.order-content-left {
box-sizing: border-box;
padding: 18px 0 16px 12px;
width: 110px;
border-right: 1px solid #DCDFE6;
.order-report-title {
padding-bottom: 14px;
font-size: 14px;
font-family: PingFangSC-Medium, PingFang SC;
font-weight: 600;
color: #303133;
}
p {
display: flex;
height: 24px;
img {
width: 24px;
height: 24px;
margin-right: 6px;
}
span {
font-size: 14px;
font-family: PingFangSC-Semibold, PingFang SC;
font-weight: 600;
color: #303133;
line-height: 24px;
}
}
}
.order-content-right {
flex: 1;
margin: 16px 27px 18px 18px;
.order-report-box {
flex: 1;
line-height: 20px;
margin-bottom: 10px;
.order-report-item {
display: flex;
justify-content: space-between;
align-items: center;
.order-report-label {
font-size: 14px;
font-weight: 400;
color: #606266;
line-height: 20px;
}
}
}
.order-report-middle {
margin-bottom: 16px;
}
.order-report-middle, .order-report-bottom {
flex: 1;
display: flex;
justify-content: space-between;
align-items: center;
// .order-report-item {
// flex-shrink: 0;
.order-report-value {
// margin-top: 12px;
font-size: 18px;
font-family: DIN Alternate;
font-weight: bold;
color: #303133;
line-height: 21px;
}
// }
}
}
}
}
}
.order-tab {
height: 100%;
/deep/ .el-tabs__header {
margin-bottom: 20px;
margin: 20px;
.el-tabs__nav-wrap {
padding: 0 20px;
// padding: 0 20px;
}
}
/deep/ .el-tabs__content {
padding: 0 20px 20px;
padding-bottom: 10px;
height: calc(100% - 60px);
overflow-y: auto;
box-sizing: border-box;
}
}
.order-report {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 20px;
padding: 20px 15px;
height: 86px;
background: #F7F8FA;
border-radius: 4px;
box-sizing: border-box;
.order-report-item {
flex-shrink: 0;
.order-report-label {
font-size: 14px;
font-weight: 400;
color: #606266;
line-height: 20px;
}
.order-report-value {
margin-top: 5px;
font-size: 20px;
font-weight: bold;
color: #303133;
line-height: 26px;
font-family: DIN Alternate;
}
}
}
// .order-report {
// flex: 1;
// display: flex;
// justify-content: space-between;
// align-items: center;
// margin-bottom: 20px;
// padding: 20px 15px;
// height: 86px;
// // background: #F7F8FA;
// border-radius: 4px;
// box-sizing: border-box;
// .order-report-item {
// flex-shrink: 0;
// .order-report-label {
// font-size: 14px;
// font-weight: 400;
// color: #606266;
// line-height: 20px;
// }
// .order-report-value {
// margin-top: 12px;
// font-size: 18px;
// font-weight: bold;
// color: #303133;
// line-height: 21px;
// font-family: DIN Alternate;
// }
// }
// }
</style>
src/components/allCustomers/order-list/order-table.vue
<template>
<div>
<div v-loading="loadings">
<div class="search-bar">
<el-input v-model="params.orderNumber" @change="onSearch" prefix-icon="el-icon-search" clearable placeholder="请输入订单/退款/退换单号" style="width: 260px"></el-input>
<el-select v-model="params.orderType" @change="onSearch" clearable placeholder="全部订单类型" style="margin-left: 10px;width: 160px">
......@@ -38,183 +38,184 @@
<el-table-column label="订单金额(元)" min-width="210px"></el-table-column>
<el-table-column label="收货/导购信息" min-width="244px"></el-table-column>
</el-table>
<!-- 有数据时列表展示 -->
<div class="order-list" v-for="el in tableData" :key="el">
<!-- 订单号、订单时间、门店等信息 -->
<el-table class="order-info-box" :data="[{}]" :span-method="orderInfoSpan" :show-header="false">
<el-table-column label="商品信息" min-width="350px" >
<div class="order-info">
<!-- orderType 订单类型 -1 所有，1 销售，2.退货，4.退换货 -->
<!-- 购买单、销售单为绿色背景 order-buy -->
<!-- 退款单背景色为红色 order-refund -->
<!-- 退换单背景色为黄色 order-exchange -->
<!-- 线下订单orderType=1时为销售单 -->
<div v-if="el.orderType == 1" class="order-type-tag order-buy">{{ el.channelType == 3 ? '销售单' : '购买单' }}</div>
<div v-if="el.orderType == 2" class="order-type-tag order-refund">退款单</div>
<div v-if="el.orderType == 4" class="order-type-tag order-exchange">退换单</div>
<!-- 购买单、销售单为订单号 -->
<!-- 退款单为退款单号 -->
<!-- 退换单为退换单号 -->
<div class="order-num-box">
<div v-if="el.orderType == 4" class="order-num">退换单号：{{ el.orderNumber }}</div>
<div v-else-if="el.orderType == 2" class="order-num">退款单号：{{ el.orderNumber }}</div>
<div v-else class="order-num">订单号：{{ el.orderNumber }}</div>
<!-- 退款单、退换单才有原始单号 -->
<div class="connect-order-num">{{ el.orderType == 2 || el.orderType == 4 ? `原始订单号：${ el.oorderNumber }` : ''}}</div>
</div>
</div>
</el-table-column>
<el-table-column label="吊牌价/应收(元)" min-width="130px">abc</el-table-column>
<el-table-column label="数量" min-width="70px">
<div class="order-time-info">
<div class="time-info-box">
<div class="order-create-time">创建时间：{{ el.orderCreateTime | formatTime }}</div>
<div class="order-sync-time">订单同步时间：{{ el.createTime | formatTime }}</div>
</div>
<div class="store-info">
<!-- 天猫、微盟、抖音、门店 -->
<div v-if="formatChannelType(el.channelType)" class="store-type-tag">{{ formatChannelType(el.channelType) }}</div>
<div class="store-name">
{{ el.storeName }}
<br />
<template v-if="el.channelType == 3">{{ el.storeCode }}</template>
<div :style="{maxHeight: maxHeight}" style="overflow-y:scroll">
<!-- 有数据时列表展示 -->
<div class="order-list" v-for="el in tableData" :key="el">
<!-- 订单号、订单时间、门店等信息 -->
<el-table class="order-info-box" :data="[{}]" :span-method="orderInfoSpan" :show-header="false">
<el-table-column label="商品信息" min-width="350px" >
<div class="order-info">
<!-- orderType 订单类型 -1 所有，1 销售，2.退货，4.退换货 -->
<!-- 购买单、销售单为绿色背景 order-buy -->
<!-- 退款单背景色为红色 order-refund -->
<!-- 退换单背景色为黄色 order-exchange -->
<!-- 线下订单orderType=1时为销售单 -->
<div v-if="el.orderType == 1" class="order-type-tag order-buy">{{ el.channelType == 3 ? '销售单' : '购买单' }}</div>
<div v-if="el.orderType == 2" class="order-type-tag order-refund">退款单</div>
<div v-if="el.orderType == 4" class="order-type-tag order-exchange">退换单</div>
<!-- 购买单、销售单为订单号 -->
<!-- 退款单为退款单号 -->
<!-- 退换单为退换单号 -->
<div class="order-num-box">
<div v-if="el.orderType == 4" class="order-num">退换单号：{{ el.orderNumber }}</div>
<div v-else-if="el.orderType == 2" class="order-num">退款单号：{{ el.orderNumber }}</div>
<div v-else class="order-num">订单号：{{ el.orderNumber }}</div>
<!-- 退款单、退换单才有原始单号 -->
<div class="connect-order-num">{{ el.orderType == 2 || el.orderType == 4 ? `原始订单号：${ el.oorderNumber }` : ''}}</div>
</div>
</div>
</div>
</el-table-column>
<el-table-column label="小计金额(元)" min-width="120px">abc</el-table-column>
<el-table-column label="订单金额(元)" min-width="210px">abc</el-table-column>
<el-table-column label="收货/导购信息" min-width="244px">abc</el-table-column>
</el-table>
<!-- 订单商品、价格等信息 -->
<el-table :data="el.orderItems" :show-header="false" :span-method="({ rowIndex, columnIndex }) => goodsInfoSpan(el, rowIndex, columnIndex)" class="order-detail">
<el-table-column label="商品信息" min-width="350px" show-overflow-tooltip>
<div class="goods-info-box" slot-scope="{ row }">
<div class="goods-logo">
<!-- <img class="goods-logo-icon" :src="row.imageUrl ? row.imageUrl : defaultGoodsIcon" alt=""> -->
<el-image class="goods-logo-icon" :src="row.imageUrl ? row.imageUrl : defaultGoodsIcon" alt="">
<div slot="error" class="image-slot">
<!-- <i class="iconfont-components3 icon-cp-pic-error errorimage"></i> -->
<svg aria-hidden="true" width="60px" height="60px" style="border-radius:4px;">
<use xlink:href="#icon-cp-pic-error"></use>
</svg>
</div>
</el-image>
<!-- productType 商品类型 1正常 2赠品 3换购 -->
<div v-if="row.productType == 2" class="goods-type-icon gift">赠品</div>
<div v-if="row.productType == 3" class="goods-type-icon swap">换购</div>
</div>
<div class="goods-info">
<p class="goods-name">{{ row.productName }}</p>
<p class="goods-num">{{ row.productCode }}</p>
<p class="goods-sku">{{ getSKU(row.skuValue) }}</p>
</div>
</div>
</el-table-column>
<el-table-column label="吊牌价/应收(元)" min-width="130px">
<div slot-scope="{ row }" class="tag-price">
<del v-if="el.channelType == 3" class="del-price">{{ row.unitPrice | fomatFloat }}</del>
<div class="sale-price">{{ row.payPrice | fomatFloat }}</div>
</div>
</el-table-column>
<el-table-column label="数量" prop="skuNum" min-width="70px"></el-table-column>
<el-table-column label="小计金额(元)" min-width="120px">
<div slot-scope="{ row }">{{ row.payPrice * Math.abs(row.skuNum) | fomatFloat }}</div>
</el-table-column>
<el-table-column label="订单金额(元)" class-name="order-amount" min-width="210px">
<div class="order-descript">
<!-- 购买单、退换单、销售单显示应收金额 -->
<!-- 退款单不显示商品合计 -->
<div v-if="el.orderType != 2" class="order-descript-item gray">
<div class="order-descript-label">
<div class="order-descript-label-text">商品合计</div>：
</el-table-column>
<el-table-column label="吊牌价/应收(元)" min-width="130px">abc</el-table-column>
<el-table-column label="数量" min-width="70px">
<div class="order-time-info">
<div class="time-info-box">
<div class="order-create-time">创建时间：{{ el.orderCreateTime | formatTime }}</div>
<div class="order-sync-time">订单同步时间：{{ el.createTime | formatTime }}</div>
</div>
<div class="order-descript-content">{{ el.paidAmount - el.deliveryPaymentAmount | fomatFloat }}</div>
</div>
<div v-if="el.deliveryPaymentAmount" class="order-descript-item gray">
<div class="order-descript-label">
<div class="order-descript-label-text">运费</div>：
<div class="store-info">
<!-- 天猫、微盟、抖音、门店 -->
<div v-if="formatChannelType(el.channelType)" class="store-type-tag">{{ formatChannelType(el.channelType) }}</div>
<div class="store-name">
{{ el.storeName }}
<br />
<template v-if="el.channelType == 3">{{ el.storeCode }}</template>
</div>
</div>
<div class="order-descript-content">{{ el.deliveryPaymentAmount | fomatFloat }}</div>
</div>
<!-- 退款单显示应退金额 -->
<div class="order-descript-item gray">
<div class="order-descript-label">
<div class="order-descript-label-text">{{ el.orderType == 2 ? '应退金额' : '应收金额'}}</div>：
</el-table-column>
<el-table-column label="小计金额(元)" min-width="120px">abc</el-table-column>
<el-table-column label="订单金额(元)" min-width="210px">abc</el-table-column>
<el-table-column label="收货/导购信息" min-width="244px">abc</el-table-column>
</el-table>
<!-- 订单商品、价格等信息 -->
<el-table :data="el.orderItems" :show-header="false" :span-method="({ rowIndex, columnIndex }) => goodsInfoSpan(el, rowIndex, columnIndex)" class="order-detail">
<el-table-column label="商品信息" min-width="350px" show-overflow-tooltip>
<div class="goods-info-box" slot-scope="{ row }">
<div class="goods-logo">
<!-- <img class="goods-logo-icon" :src="row.imageUrl ? row.imageUrl : defaultGoodsIcon" alt=""> -->
<el-image class="goods-logo-icon" :src="row.imageUrl ? row.imageUrl : defaultGoodsIcon" alt="">
<div slot="error" class="image-slot">
<!-- <i class="iconfont-components3 icon-cp-pic-error errorimage"></i> -->
<svg aria-hidden="true" width="60px" height="60px" style="border-radius:4px;">
<use xlink:href="#icon-cp-pic-error"></use>
</svg>
</div>
</el-image>
<!-- productType 商品类型 1正常 2赠品 3换购 -->
<div v-if="row.productType == 2" class="goods-type-icon gift">赠品</div>
<div v-if="row.productType == 3" class="goods-type-icon swap">换购</div>
</div>
<div class="order-descript-content">
<div>{{ el.paidAmount | fomatFloat }}</div>
<div class="goods-info">
<p class="goods-name">{{ row.productName }}</p>
<p class="goods-num">{{ row.productCode }}</p>
<p class="goods-sku">{{ getSKU(row.skuValue) }}</p>
</div>
</div>
<!-- 购买单、退换单显示优惠 -->
<div class="order-descript-item gray" v-if="el.promotionAmount > 0">
<div class="order-descript-label">
<div class="order-descript-label-text">支付优惠</div>：
</div>
<div class="order-descript-content">{{ el.promotionAmount | fomatFloat }}</div>
</el-table-column>
<el-table-column label="吊牌价/应收(元)" min-width="130px">
<div slot-scope="{ row }" class="tag-price">
<del v-if="el.channelType == 3" class="del-price">{{ row.unitPrice | fomatFloat }}</del>
<div class="sale-price">{{ row.payPrice | fomatFloat }}</div>
</div>
<!-- 购买单、销售单显示实付金额 -->
<!-- 退款单、退换单显示实退金额 -->
<div class="order-descript-item">
<div class="order-descript-label">
<div class="order-descript-label-text">{{ el.orderType == 2 ? '实退金额' : '实付金额'}}</div>：
</el-table-column>
<el-table-column label="数量" prop="skuNum" min-width="70px"></el-table-column>
<el-table-column label="小计金额(元)" min-width="120px">
<div slot-scope="{ row }">{{ row.payPrice * Math.abs(row.skuNum) | fomatFloat }}</div>
</el-table-column>
<el-table-column label="订单金额(元)" class-name="order-amount" min-width="210px">
<div class="order-descript">
<!-- 购买单、退换单、销售单显示应收金额 -->
<!-- 退款单不显示商品合计 -->
<div v-if="el.orderType != 2" class="order-descript-item gray">
<div class="order-descript-label">
<div class="order-descript-label-text">商品合计</div>：
</div>
<div class="order-descript-content">{{ el.paidAmount - el.deliveryPaymentAmount | fomatFloat }}</div>
</div>
<div class="order-descript-content">
{{ el.payAmount | fomatFloat }}
<el-popover v-if="Array.isArray(el.payInfo) && el.payInfo.length > 0" placement="top" title="支付方式" width="200" trigger="hover">
<div>
<p v-for="(item, index) in el.payInfo" :key="index">{{ item.name }}：￥{{ item.value | fomatFloat }}</p>
</div>
<span slot="reference" class="payment-type">
<i class="payment-type-icon iconfont icon-chakanxiangqing-copy"></i>
</span>
</el-popover>
<div v-if="el.deliveryPaymentAmount" class="order-descript-item gray">
<div class="order-descript-label">
<div class="order-descript-label-text">运费</div>：
</div>
<div class="order-descript-content">{{ el.deliveryPaymentAmount | fomatFloat }}</div>
</div>
</div>
</div>
</el-table-column>
<el-table-column label="收货/导购信息" min-width="244px">
<div class="order-descript">
<!-- 门店订单单只显示导购，其他单显示收货信息 -->
<div v-if="el.channelType == 3" class="order-descript-item">
<div class="order-descript-label">
<div class="order-descript-label-text">导购</div>：
<!-- 退款单显示应退金额 -->
<div class="order-descript-item gray">
<div class="order-descript-label">
<div class="order-descript-label-text">{{ el.orderType == 2 ? '应退金额' : '应收金额'}}</div>：
</div>
<div class="order-descript-content">
<div>{{ el.paidAmount | fomatFloat }}</div>
</div>
</div>
<div class="order-descript-content">
<div v-if="!Array.isArray(el.clerks) || el.clerks.length == 0">--</div>
<template v-else>
<div v-for="(item, index) in el.clerks" :key="index">{{ item.clerkName }}({{ item.clerkCode }})</div>
</template>
<!-- 购买单、退换单显示优惠 -->
<div class="order-descript-item gray" v-if="el.promotionAmount > 0">
<div class="order-descript-label">
<div class="order-descript-label-text">支付优惠</div>：
</div>
<div class="order-descript-content">{{ el.promotionAmount | fomatFloat }}</div>
</div>
<!-- 购买单、销售单显示实付金额 -->
<!-- 退款单、退换单显示实退金额 -->
<div class="order-descript-item">
<div class="order-descript-label">
<div class="order-descript-label-text">{{ el.orderType == 2 ? '实退金额' : '实付金额'}}</div>：
</div>
<div class="order-descript-content">
{{ el.payAmount | fomatFloat }}
<el-popover v-if="Array.isArray(el.payInfo) && el.payInfo.length > 0" placement="top" title="支付方式" width="200" trigger="hover">
<div>
<p v-for="(item, index) in el.payInfo" :key="index">{{ item.name }}：￥{{ item.value | fomatFloat }}</p>
</div>
<span slot="reference" class="payment-type">
<i class="payment-type-icon iconfont icon-chakanxiangqing-copy"></i>
</span>
</el-popover>
</div>
</div>
</div>
<template v-else>
<!-- 收货人、手机号、收货地址都无数据时，只显示一个-- -->
<template v-if="!el.receiverName && !el.phoneNumber && !el.receiverAddress">--</template>
</el-table-column>
<el-table-column label="收货/导购信息" min-width="244px">
<div class="order-descript">
<!-- 门店订单单只显示导购，其他单显示收货信息 -->
<div v-if="el.channelType == 3" class="order-descript-item">
<div class="order-descript-label">
<div class="order-descript-label-text">导购</div>：
</div>
<div class="order-descript-content">
<div v-if="!Array.isArray(el.clerks) || el.clerks.length == 0">--</div>
<template v-else>
<div v-for="(item, index) in el.clerks" :key="index">{{ item.clerkName }}({{ item.clerkCode }})</div>
</template>
</div>
</div>
<template v-else>
<div class="order-descript-item">
<div class="order-descript-label">
<div class="order-descript-label-text">收件人</div>：
<!-- 收货人、手机号、收货地址都无数据时，只显示一个-- -->
<template v-if="!el.receiverName && !el.phoneNumber && !el.receiverAddress">--</template>
<template v-else>
<div class="order-descript-item">
<div class="order-descript-label">
<div class="order-descript-label-text">收件人</div>：
</div>
<div class="order-descript-content">{{ el.receiverName || '--' }}</div>
</div>
<div class="order-descript-content">{{ el.receiverName || '--' }}</div>
</div>
<div class="order-descript-item">
<div class="order-descript-label">
<div class="order-descript-label-text">手机号</div>：
<div class="order-descript-item">
<div class="order-descript-label">
<div class="order-descript-label-text">手机号</div>：
</div>
<div class="order-descript-content">{{ el.phoneNumber || '--' }}</div>
</div>
<div class="order-descript-content">{{ el.phoneNumber || '--' }}</div>
</div>
<div class="order-descript-item">
<div class="order-descript-label">
<div class="order-descript-label-text">收货地址</div>：
<div class="order-descript-item">
<div class="order-descript-label">
<div class="order-descript-label-text">收货地址</div>：
</div>
<div class="order-descript-content">{{ el.receiverAddress || '--' }}</div>
</div>
<div class="order-descript-content">{{ el.receiverAddress || '--' }}</div>
</div>
</template>
</template>
</template>
</div>
</el-table-column>
</el-table>
</div>
</div>
</el-table-column>
</el-table>
</div>
<el-pagination
v-if="params.total > 0"
:page-sizes="[20, 40, 60, 80]"
......@@ -228,6 +229,7 @@
style="margin-top: 20px; text-align: right"
></el-pagination>
</div>
</div>
</template>
<script>
......@@ -241,6 +243,7 @@ export default {
},
data() {
return {
maxHeight: '',
defaultGoodsIcon,
params: {
memberId: '', // 会员id
......@@ -254,6 +257,7 @@ export default {
dateRange: [],
total: 0
},
loadings: false,
tableData: [
// {
// orderNumber: '单号（订单/退款单）',
......@@ -305,6 +309,35 @@ export default {
const channel = { store: 3, demo: 1, weimob: 9, tmall: 8, douyin: 11, other: 10 };
this.params.channelType = channel[this.tab];
this.getTableData();
// if(this.params.channelType == 3) {
// let screenHeight = document.documentElement.clientHeight - 540 + 'px';
// this.$nextTick(() => {
// this.maxHeight = screenHeight;
// });
// }else {
let screenHeight = document.documentElement.clientHeight - 325 + 'px';
this.$nextTick(() => {
this.maxHeight = screenHeight;
});
// }
},
mounted() {
const that = this;
// if(this.params.channelType == 3) {
// window.onresize = () => {
// return (() => {
// let screenHeight = document.documentElement.clientHeight - 540 + 'px';
// that.maxHeight = screenHeight;
// })();
// };
// }else{
window.onresize = () => {
return (() => {
let screenHeight = document.documentElement.clientHeight - 325 + 'px';
that.maxHeight = screenHeight;
})();
};
// }
},
methods: {
orderInfoSpan({rowIndex, columnIndex}) {
......@@ -343,6 +376,7 @@ export default {
return result;
},
getTableData() {
this.loadings = true;
const { memberId, pageSize, currentPage, orderType, channelType, dateRange, orderNumber } = this.params;
const params = { memberId, pageSize, currentPage, orderType, channelType, orderNumber };
if (Array.isArray(dateRange) && dateRange.length > 0) {
......@@ -359,6 +393,7 @@ export default {
return el;
});
this.params.total = page.totalCount;
this.loadings = false;
});
},
onSearch() {
......
src/components/axios/url.js
......@@ -119,6 +119,9 @@ const urlConfig = {
getFrozenWhiteList: '/api-member/white-member-list',//获取冻结白名单列表
removeFrozenWhiteMember:'/api-member//white-member-remove',// 移出白名单
frozenMemberExportExcel: '/api-admin/frozen-member-export-excel',// 异常会员搜索结果导出
cliqueMemberRelation: '/api-member/clique-member-relation',//判断是否有展示会员导入的权限 1不可，2，null可
weChantToPos: '/api-member/member-change-wechat-member-pos'
}
const defaultUrl = Object.assign({}, urlConfig);
......
src/components/memberlist/memberReturn.vue
......@@ -72,7 +72,10 @@
> </el-table-column>
<el-table-column label="基本信息">
<div slot-scope="{ row }" class="customer-info-cell">
<img :src="row.thirdImgUrl||require('../../../static/img/default.png')" alt="">
<img v-if="row.thirdImgUrl" :src="row.thirdImgUrl" class="customer-icon" alt="">
<svg v-else aria-hidden="true" class="customer-icon">
<use xlink:href="#icon-user-default"></use>
</svg>
<p class="memberName">
{{ row.memberName | formatMember }}
</p>
......@@ -179,7 +182,7 @@ export default { ...memberReturn };
.customer-info-cell {
display: flex;
align-items: center;
img {
.customer-icon {
display: block;
width: 60px;
height: 60px;
......
src/components/posmembers/posmemberDetail.js
......@@ -141,9 +141,6 @@ export default {
}
},
filters: {
defaultImg: val => {
if(!val) return './static/img/default.png';
},
formatColorSize: val => {
let temp = '';
if(val) {
......
src/components/posmembers/posmemberDetail.vue
......@@ -108,7 +108,12 @@
<el-table-column prop="clerkImageUrl" label="导购信息" width="260px">
<template slot-scope="scope">
<div class="record-clerk">
<span class="record-clerkimg"><img style="vertical-align: middle" width="60" height="60" :src="scope.row.clerkImageUrl | defaultImg" alt=""></span>
<span class="record-clerkimg">
<img v-if="scope.row.clerkImageUrl" style="vertical-align: middle" width="60" height="60" :src="scope.row.clerkImageUrl" alt="">
<svg v-else aria-hidden="true" width="60px" height="60px">
<use xlink:href="#icon-user-default"></use>
</svg>
</span>
<span class="record-clerkname">{{ scope.row.clerkName }}<br>{{ scope.row.clerkCode }}</span>
</div>
</template>
......@@ -164,7 +169,11 @@
<el-table-column prop="productName" label="商品信息" width="200px">
<template slot-scope="scope">
<div class="record-info">
<div class="record-infoimg"><img width="60" height="60" src="/static/img/default.png" alt=""></div>
<div class="record-infoimg">
<svg aria-hidden="true" width="60px" height="60px">
<use xlink:href="#icon-user-default"></use>
</svg>
</div>
<div class="record-infocontent">
<div>{{ scope.row.productName }}</div>
<div>{{ scope.row.productCode }}</div>
......
src/components/wechatmembers/abnormal-member-option.vue
......@@ -60,12 +60,12 @@
>
<div class="pointer">
<div class="singelinfo">
<div class="singelinfo-img"><img
width="100"
height="100"
:src="scope.row.thirdImgUrl ? scope.row.thirdImgUrl : './static/img/default.png'"
alt=""
></div>
<div class="singelinfo-img">
<img v-if="scope.row.thirdImgUrl" width="100" height="100" :src="scope.row.thirdImgUrl" alt="">
<svg v-else aria-hidden="true" width="100px" height="100px">
<use xlink:href="#icon-user-default"></use>
</svg>
</div>
<div class="singelinfo-content pLeft10 pRight10">
<span class="lheigth0">{{ scope.row.memberName }}
<span
......@@ -104,13 +104,12 @@
<a class="singelinfo-jlitem">卡券记录 ({{ singleInfo.couponCount }})</a>
</div>
</div>
<span slot="reference" class="member-span"><img
class="tablecontent-cellimg mr6"
width="60"
height="60"
:src="scope.row.thirdImgUrl ? scope.row.thirdImgUrl : './static/img/default.png'"
alt=""
></span>
<span slot="reference" class="member-span">
<img v-if="scope.row.thirdImgUrl" class="tablecontent-cellimg mr6" width="60" height="60" :src="scope.row.thirdImgUrl" alt="">
<svg v-else aria-hidden="true" class="tablecontent-cellimg mr6" width="60px" height="60px">
<use xlink:href="#icon-user-default"></use>
</svg>
</span>
</el-popover>
<span class="fix-block">{{scope.row.memberName}}</span>
</div>
......@@ -159,10 +158,10 @@
:key="index"
>
<div class="basic-info">
<img
:src="item.thirdImgUrl ? item.thirdImgUrl : './static/img/default.png'"
class="list-img"
>
<img v-if="item.thirdImgUrl" :src="item.thirdImgUrl" class="list-img">
<svg v-else aria-hidden="true" class="list-img">
<use xlink:href="#icon-user-default"></use>
</svg>
<span class="txt">{{item.memberName}}</span>
</div>
<i
......
src/components/wechatmembers/abnormal-member/abnormal-member-list/abnormal-member.js
......@@ -5,7 +5,6 @@ import {
checkSuccess
} from "../../../../../static/js/checkStatus";
import authMethods from "@/mixins/auth";
import defaultImg from "../../../../../static/img/default.png";
import { formatLongTime, paddingBorth } from "@/utils/utils";
import FreezeDialog from "../../components/dialog/freeze.vue";
import MemberFieldsDialog from "../../components/dialog/fieldsSettingDialog.vue";
......@@ -76,7 +75,6 @@ export default {
},
dialogMemberFieldVisible: false,
dialogExportFieldVisible: false,
defaultImg,
settingType: 0, // 0未查询 1已设置 2未设置
selectPage: {
type: 0,
......
src/components/wechatmembers/abnormal-member/abnormal-member-list/abnormal-member.vue
......@@ -114,7 +114,10 @@
class="basic-info-table"
@click.native="linkDetail(row.memberId)"
>
<img :src="row.thirdImgUrl || defaultImg" class="basic-img" />
<img v-if="row.thirdImgUrl" :src="row.thirdImgUrl" class="basic-img" />
<svg v-else aria-hidden="true" class="basic-img">
<use xlink:href="#icon-user-default"></use>
</svg>
<div>
<div class="member-name">
......@@ -227,6 +230,10 @@
<div v-else-if="colum.code == 'lastCostTime'">
<div>{{ row.lastCostTime | formatDate("ymd") }}</div>
</div>
<!-- 最近消费时间（全渠道） -->
<div v-else-if="colum.code == 'allChannelLastCostTime'">
<div>{{ row.allChannelLastCostTime | formatDate("ymd") }}</div>
</div>
<!-- 生日 -->
<div v-else-if="colum.code == 'birthday'">
<div>{{ row.birthdayMD | formatBirth() }}</div>
......
src/components/wechatmembers/ajaxmembersinfo.vue
......@@ -263,12 +263,12 @@
>
<template slot-scope="scope">
<div class="record-info">
<div class="record-infoimg"><img
width="60"
height="60"
:src="scope.row.imageUrl ? scope.row.imageUrl : './static/img/default.png'"
alt=""
></div>
<div class="record-infoimg">
<img v-if="scope.row.imageUrl" width="60" height="60" :src="scope.row.imageUrl" alt="">
<svg v-else aria-hidden="true" width="60px" height="60px">
<use xlink:href="#icon-user-default"></use>
</svg>
</div>
<div class="record-infocontent">
<div>{{ scope.row.productName }}</div>
<div>{{ scope.row.productCode }}</div>
......
src/components/wechatmembers/components/dialog/fieldsSettingDialog.vue
......@@ -93,7 +93,7 @@ export default {
.table-colum-wrap {
display: flex;
flex-wrap: wrap;
width: 100%;
width: 105%;
.table-colum-item {
flex: 25%;
line-height: 35px;
......
src/components/wechatmembers/frozen-member/frozen-list/frozen-list.js
......@@ -5,7 +5,6 @@ import {
checkSuccess
} from "../../../../../static/js/checkStatus";
import authMethods from "@/mixins/auth";
import defaultImg from "../../../../../static/img/default.png";
import { formatLongTime,paddingBorth } from "@/utils/utils";
import FreezeDialog from "../../components/dialog/freeze.vue";
import MemberFieldsDialog from "../../components/dialog/fieldsSettingDialog.vue";
......@@ -53,7 +52,6 @@ export default {
},
dialogMemberFieldVisible: false,
dialogExportFieldVisible: false,
defaultImg,
settingType: 0, // 0未查询 1已设置 2未设置
selectPage: {
type: 0,
......
src/components/wechatmembers/frozen-member/frozen-list/frozen-list.vue
......@@ -110,7 +110,10 @@
class="basic-info-table"
@click.native="linkDetail(row.memberId)"
>
<img :src="row.thirdImgUrl || defaultImg" class="basic-img" />
<img v-if="row.thirdImgUrl" :src="row.thirdImgUrl" class="basic-img" />
<svg v-else aria-hidden="true" class="basic-img">
<use xlink:href="#icon-user-default"></use>
</svg>
<div>
<div class="member-name">
......@@ -222,6 +225,10 @@
<div v-else-if="colum.code == 'lastCostTime'">
<div>{{ row.lastCostTime | formatDate("ymd") }}</div>
</div>
<!-- 最近消费时间（全渠道） -->
<div v-else-if="colum.code == 'allChannelLastCostTime'">
<div>{{ row.allChannelLastCostTime | formatDate("ymd") }}</div>
</div>
<!-- 生日 -->
<div v-else-if="colum.code == 'birthday'">
<div>{{ row.birthdayMD | formatBirth }}</div>
......
src/components/wechatmembers/frozen-member/frozen-member/frozen-member.js
......@@ -5,7 +5,6 @@ import {
checkSuccess
} from "../../../../../static/js/checkStatus";
import authMethods from "@/mixins/auth";
import defaultImg from "../../../../../static/img/default.png";
import ImportDialog from "@/components/allCustomers/components/importDialog.vue";
import { formatLongTime } from "@/utils/utils";
export default {
......@@ -23,7 +22,6 @@ export default {
data() {
return {
dialogImportVisible: false,
defaultImg,
searchData: {
pageSize: 20,
currentPage: 1,
......
src/components/wechatmembers/frozen-member/frozen-member/frozen-member.vue
......@@ -41,7 +41,10 @@
<!-- 基本信息 -->
<el-row type="flex" align="middle" class="basic-info-table"
@click.native="linkDetail(row.memberId)">
<img :src="row.thirdImgUrl || defaultImg" class="basic-img" />
<img v-if="row.thirdImgUrl" :src="row.thirdImgUrl" class="basic-img" />
<svg v-else aria-hidden="true" class="basic-img">
<use xlink:href="#icon-user-default"></use>
</svg>
<div>
<div class="member-name">
<span v-if="row.memberName">{{ row.memberName }}</span>
......@@ -98,7 +101,10 @@
</el-row>
<div class="selected-list">
<div class="selected-item" v-for="item in multipleList" :key="item">
<img :src="item.thirdImgUrl || defaultImg" class="user-header" />
<img v-if="item.thirdImgUrl" :src="item.thirdImgUrl || defaultImg" class="user-header" />
<svg v-else aria-hidden="true" class="user-header">
<use xlink:href="#icon-user-default"></use>
</svg>
<div class="user-name">
<span v-if="item.memberName">{{ item.memberName }}</span>
<span class="nick-name" v-if="item.nickName"
......
src/components/wechatmembers/frozen-member/white-list/white-list.js
......@@ -5,7 +5,6 @@ import {
checkSuccess
} from "../../../../../static/js/checkStatus";
import authMethods from "@/mixins/auth";
import defaultImg from "../../../../../static/img/default.png";
import ImportDialog from "@/components/allCustomers/components/importDialog.vue";
import { formatLongTime, paddingBorth } from "@/utils/utils";
import {dateformat} from '@/utils/formatTime';
......@@ -65,7 +64,6 @@ export default {
}
],
dialogImportVisible: false,
defaultImg,
searchData: {
pageSize: 20,
currentPage: 1,
......
src/components/wechatmembers/frozen-member/white-list/white-list.vue
......@@ -48,7 +48,10 @@
class="basic-info-table"
@click.native="linkDetail(row.memberId)"
>
<img :src="row.thirdImgUrl || defaultImg" class="basic-img" />
<img v-if="row.thirdImgUrl" :src="row.thirdImgUrl" class="basic-img" />
<svg v-else aria-hidden="true" class="basic-img">
<use xlink:href="#icon-user-default"></use>
</svg>
<div>
<div class="member-name">
<span v-if="row.memberName">{{ row.memberName }}</span>
......
static/css/index.css
......@@ -3975,8 +3975,9 @@
.el-dialog__headerbtn:focus .el-dialog__close, .el-dialog__headerbtn:hover .el-dialog__close {
color: #2F54EB; }
.el-dialog__title {
line-height: 24px;
font-size: 18px;
line-height: 22px;
font-size: 16px !important;
font-weight: 500;
color: #303133; }
.el-dialog__body {
padding: 20px 20px 10px 20px;
......@@ -28292,7 +28293,7 @@
left: 0;
bottom: 0;
width: 100%;
height: 2px;
height: 1px;
background-color: #e4e7ed;
z-index: 1; }
.el-tabs__nav-wrap.is-scrollable {
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment