Skip to content

M
member
Commit 55ed6620 by caoyanzhi
Options

Merge branch 'feature/6月迭代-抖音' into test

parents 8a659f5a 6df72b93
Showing with 412 additions and 118 deletions
src/components/allCustomers/allCustomersList.vue
......@@ -124,6 +124,7 @@
<img class="channel-icon" v-if="channel.parentSourceCode == 1700" src="../../../static/img/channel-icon/qiyeweixin-1.png" alt="">
<img class="channel-icon" v-if="channel.parentSourceCode == 1303" src="../../../static/img/channel-icon/weimen-1.png" alt="">
<img class="channel-icon" v-if="channel.parentSourceCode == 1302" src="../../../static/img/channel-icon/tianmao-1.png" alt="">
<img class="channel-icon" v-if="channel.parentSourceCode == 1304" src="../../../static/img/channel-icon/douyin-1.png" alt="">
</template>
<template v-if="channel.highlight == 2">
<img class="channel-icon" v-if="channel.parentSourceCode == 1100" src="../../../static/img/channel-icon/weixin-2.png" alt="">
......@@ -131,6 +132,7 @@
<img class="channel-icon" v-if="channel.parentSourceCode == 1700" src="../../../static/img/channel-icon/qiyeweixin-2.png" alt="">
<img class="channel-icon" v-if="channel.parentSourceCode == 1303" src="../../../static/img/channel-icon/weimen-2.png" alt="">
<img class="channel-icon" v-if="channel.parentSourceCode == 1302" src="../../../static/img/channel-icon/tianmao-2.png" alt="">
<img class="channel-icon" v-if="channel.parentSourceCode == 1304" src="../../../static/img/channel-icon/douyin-2.png" alt="">
</template>
</span>
</template>
......
src/components/allCustomers/components/icon-label-value.vue 0 → 100644
<template>
<div class="icon-label-value">
<slot name="icon"></slot>
<div class="icon-info">
<div class="info-label">
<slot name="label">{{ label }}</slot>
</div>
<div class="info-value">{{ value }}</div>
</div>
</div>
</template>
<script>
export default {
name: 'IconLabelValue',
props: {
label: String,
value: String
}
}
</script>
<style lang="scss" scoped>
.icon-label-value {
display: inline-flex;
justify-content: flex-start;
align-items: stretch;
.icon-info {
display: flex;
flex-direction: column;
justify-content: space-between;
align-items: flex-start;
margin-left: 20px;
.info-label {
font-size: 14px;
font-weight: 400;
color: #303133;
line-height: 20px;
}
.info-value {
font-size: 20px;
font-weight: bold;
color: #303133;
line-height: 24px;
}
}
}
</style>
src/components/allCustomers/customerDetail.less
.max1600 {
max-width: 1600px;
}
.fz12{
font-size: 12px;
}
.fz14{
font-size: 14px;
}
.customer-contain-wrap {
padding: 20px;
background: #fff;
......@@ -252,6 +246,177 @@
margin: 0 20px;
}
}
// 客户记录-积分相关
.scores {
flex-shrink: 0;
margin-right: 20px;
width: 420px;
.score-icon, .card-icon, .balance-icon {
display: flex;
justify-content: center;
align-items: center;
width: 56px;
height: 56px;
border-radius: 6px;
i {
font-size: 30px;
}
}
&.is-clique {
padding: 17px 13px 17px 18px;
border-radius: 8px;
border: 1px solid #E4E7ED;
.score-icon, .card-icon, .balance-icon {
width: 48px;
height: 48px;
}
.scores-clique {
margin-bottom: 22px;
.score-icon {
color: #FF9D1A;
background: #FFF5E9;
}
}
.scores-box {
margin-bottom: 22px;
}
}
&:not(.is-clique) .scores-box, &:not(.is-clique) .cards-box {
padding: 25px 13px 25px 18px;
border-radius: 8px;
border: 1px solid #E4E7ED;
}
.scores-box {
display: flex;
justify-content: space-between;
align-items: center;
margin-bottom: 8px;
cursor: pointer;
.score-icon {
color: #FFCB48;
background: rgba(255, 203, 72, 0.15);
}
.scores-info {
display: flex;
justify-content: space-between;
align-items: center;
flex-shrink: 0;
width: 326px;
.score-detail {
.score-detail-item {
&+.score-detail-item {
margin-top: 9px;
}
.score-detail-label {
display: inline-block;
margin-right: 16px;
width: 84px;
font-size: 13px;
font-weight: 400;
color: #606266;
line-height: 18px;
vertical-align: middle;
}
.score-detail-value {
font-size: 16px;
font-weight: bold;
color: #303133;
line-height: 19px;
vertical-align: middle;
}
}
}
}
}
.cards-box {
display: flex;
justify-content: flex-start;
align-items: center;
.card-item, .balance-item {
display: flex;
justify-content: space-between;
align-items: center;
width: 50%;
}
.card-item {
margin-right: 30px;
cursor: pointer;
.card-icon {
color: #26DAD0;
background: #ECF8FE;
}
}
.balance-item {
&.has-balance {
cursor: pointer;
}
.balance-icon {
color: #5C89FF;
background: #ECF8FE;
}
}
}
}
// 客户记录-订单相关
.orders {
display: flex;
flex-wrap: wrap;
justify-content: flex-start;
align-items: center;
flex-shrink: 0;
width: 420px;
.order-total {
margin-bottom: 11px;
display: flex;
justify-content: space-between;
align-items: center;
flex-shrink: 0;
width: 100%;
cursor: pointer;
.order-total-icon {
display: flex;
justify-content: center;
align-items: center;
width: 56px;
height: 56px;
color: #597EF7;
background: #ECF8FE;
border-radius: 6px;
i {
font-size: 30px;
}
}
}
.order-item {
margin: 0 6px 4px 0;
padding: 4px 4px 8px;
width: 114px;
border-radius: 4px;
cursor: pointer;
&:nth-child(3n + 1) {
margin-right: 0;
}
&:hover {
background: #F2F3F5;
.order-item-count {
color: #2F54EB;
}
}
.order-item-label {
font-size: 13px;
font-weight: 400;
color: #606266;
line-height: 18px;
}
.order-item-count {
margin-top: 8px;
font-size: 20px;
font-weight: bold;
color: #303133;
line-height: 24px;
}
}
}
.flex-item {
display: flex;
......@@ -288,23 +453,6 @@
color: #5c89ff;
}
}
&.coupon {
background: #ecf8fe;
.icon-01_kaquanguanli {
font-size: 40px;
color: #26dad0;
}
}
&.balance {
background: #ecf8fe;
.icon-chuzhizhanghu {
font-size: 32px;
color: #5c89ff;
}
}
}
.middle {
......@@ -357,24 +505,6 @@
height: 26px;
}
&.integral_clique {
background: #FFF5E9;
.icon-jifenjiabei {
font-size: 20px;
color: #FF9D1A;
}
}
&.integral {
background: #FFF7E3;
.icon-jifenduihuan {
font-size: 32px;
color: #ffcb48;
}
}
.iconfont {
......@@ -408,10 +538,6 @@
line-height: 28px;
vertical-align: middle;
}
&.transaction-item .icon-wrap {
background: #ecf8fe;
}
}
}
......
src/components/allCustomers/info.js
import nav from '../../common/navbar/navbar.vue';
import baseinfoDialog from './components/baseinfoDialog.vue';
import babyinfoDialog from './components/babyinfoDialog.vue';
import customergradeDialog from './components/customergradeDialog.vue';
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';
......@@ -20,11 +20,6 @@ export default {
mixins: [authMethods],
data () {
return {
navpath: [
{ name: '首页', path: '' },
{ name: '客户列表', path: '/allCustomers' },
{ name: '客户详情', path: '' },
],
pageName: 'allCustomer', // 请求参数
memberId: '',
member: {
......@@ -108,67 +103,39 @@ export default {
name: 'customerRecord',
class: 'customer-record-contain max1600',
childrenList: {
//积分
point:[
{
label: '集团积分',
icon: 'icon-jifenjiabei',
iconTheme: 'integral_clique',
key: 'cliqueMemberIntegral',
path: '',
},
{
label: '商户积分',
icon: 'icon-jifenduihuan',
iconTheme: 'integral',
key: 'totalPoint',
path: '/integralDataPage',
},
],
// 资产信息
assets: [
{
label: '卡券',
icon: 'icon-01_kaquanguanli',
iconTheme: 'coupon',
key: 'couponCount',
path: '/cardvoucher',
},
{
label: '储值余额',
icon: 'icon-chuzhizhanghu',
iconTheme: 'balance',
key: 'storedValue',
path: '',
},
],
// 交易记录
transaction: [
{
label: '门店订单',
icon: 'icon-mendianbaojiadan',
key: 'numOfSale',
path: '/consumption',
},
{
label: '微盟订单',
icon: 'icon-a-weimeng2',
key: 'weimobMallNum',
path: '/wmDetail',
},
{
label: '达摩商城订单',
icon: '',
key: 'wechatMallNum',
path: '/infoMall',
},
{
label: '其他订单',
icon: 'icon-dingdan-copy',
key: 'otherMallNum',
path: '/otherDetail',
},
{ label: '客户订单', key: 'numOfCustomer', path: '/order-list?tab=store&memberId=' + this.memberId, icon: 'icon-mendianbaojiadan' },
{ label: '门店订单', key: 'numOfSale', path: '/order-list?tab=store&memberId=' + this.memberId },
{ label: '达摩微商城', key: 'wechatMallNum', path: '/order-list?tab=demo&memberId=' + this.memberId },
{ label: '微盟订单', key: 'weimobMallNum', path: '/order-list?tab=weimob&memberId=' + this.memberId },
{ label: '天猫订单', key: 'numOfTmall', path: '/order-list?tab=tmall&memberId=' + this.memberId },
{ label: '抖音订单', key: 'numOfDouYin', path: '/order-list?tab=douyin&memberId=' + this.memberId },
{ label: '其它订单', key: 'otherMallNum', path: '/order-list?tab=other&memberId=' + this.memberId },
// {
// label: '门店订单',
// icon: 'icon-mendianbaojiadan',
// key: 'numOfSale',
// path: '/consumption',
// },
// {
// label: '微盟订单',
// icon: 'icon-a-weimeng2',
// key: 'weimobMallNum',
// path: '/wmDetail',
// },
// {
// label: '达摩商城订单',
// icon: '',
// key: 'wechatMallNum',
// path: '/infoMall',
// },
// {
// label: '其他订单',
// icon: 'icon-dingdan-copy',
// key: 'otherMallNum',
// path: '/otherDetail',
// },
],
// 交互记录
interactive: [
......@@ -511,12 +478,12 @@ export default {
}
},
components: {
'v-nav': nav,
baseinfoDialog,
babyinfoDialog,
customergradeDialog,
customermainstoreDialog,
customersubstoreDialog,
customerlabelDialog,
IconLabelValue
},
};
src/components/allCustomers/order-list.vue 0 → 100644
<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>
</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>
</template>
<script>
import url from '../axios/url.js';
import { doFetch } from '../../components/axios/api';
import OrderTable from './order-list/order-table.vue';
export default {
name: 'OrderList',
components: { OrderTable },
data() {
return {
activeName: 'store',
memberId: '',
orderCount: {
// 客户订单
numOfCustomer: '',
// 门店订单
numOfSale: '',
// 达摩微商城
wechatMallNum: '',
// 微盟订单
weimobMallNum: '',
// 天猫订单
numOfTmall: '',
// 抖音订单
numOfDouYin: '',
// 其它订单
otherMallNum: ''
},
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: 'highCost', type: 'amount', value: 0 },
{ label: '平均折扣', key: 'avgDiscount', type: 'float', value: 0 },
]
}
},
created() {
this.activeName = this.$route.query.tab || 'store';
this.memberId = this.$route.query.memberId;
this.getMemberInfo();
this.getStoreReportData();
},
methods: {
getMemberInfo() {
const param = { memberId: this.memberId, pageName: 'allCustomer' };
doFetch(url.memberLoadmemberInfo, param).then(res => {
const { result } = res.data;
const { numOfCustomer, numOfSale, wechatMallNum, weimobMallNum, numOfTmall, numOfDouYin, otherMallNum } = result.memberInfo || {};
this.orderCount = { numOfCustomer, numOfSale, wechatMallNum, weimobMallNum, numOfTmall, numOfDouYin, otherMallNum };
})
},
getStoreReportData() {
doFetch(url.ajaxMembersInfo, { memberId: this.memberId }).then(res => {
const { result } = res.data || {};
const memberInfo = result.memberInfo || {};
this.storeOrderReport.forEach(el => {
el.value = memberInfo[el.key];
});
});
}
}
}
</script>
<style lang="scss" scoped>
.order-tab {
/deep/ .el-tabs__header {
margin-bottom: 20px;
.el-tabs__nav-wrap {
padding: 0 20px;
}
}
/deep/ .el-tabs__content {
padding: 0 20px 20px;
}
}
.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: 22px;
font-weight: bold;
color: #303133;
line-height: 26px;
}
}
}
</style>
src/components/axios/url.js
......@@ -95,7 +95,8 @@ const urlConfig = {
messageLogPage: '/api-marketing/member/sms-log-page',
wechatLogPage: '/api-marketing/member/wechat-log-page',
getMarketingRecordNum: '/api-marketing/member/marketing-count',
aiLogPage: '/api-marketing/member/page-ai-member-log'
aiLogPage: '/api-marketing/member/page-ai-member-log',
getOrderList: '/api-member/member-all-order-page'
}
const defaultUrl = Object.assign({}, urlConfig);
......
src/components/wechatmembers/integralDataPage.vue
......@@ -248,7 +248,8 @@ export default {
{ label: 'ERP同步', value: 2 },
{ label: 'API同步', value: 3 },
{ label: '批处理导入', value: 4 },
{ label: '天猫会员通', value: 5 }
{ label: '天猫会员通', value: 5 },
{ label: '抖音', value: 7 }
],
frozenStatusList:[
{label:'冻结积分',value:1},
......
src/components/wechatmembers/storedValue.vue
......@@ -250,3 +250,9 @@ export default ({
}
})
</script>
<style lang="scss" scoped>
.wechat-point-details {
padding: 20px;
}
</style>
src/router/index.js
......@@ -53,6 +53,13 @@ export const constantRouterMap = [
},
},
{
path: '/order-list',
component: _import('allCustomers', 'order-list'),
meta: {
title: '订单详情'
}
},
{
path: '/consumption',
component: _import('allCustomers', 'consumption'),
meta: {
......
static/css/index.styl
......@@ -139,8 +139,6 @@ span {
background-color #7366ba
.bgcolor-blue
background-color #23b7e5
.el-table th, .el-table tr.curheader
background #f5f5f8
.footwrap
position: fixed;
z-index: 1000;
......@@ -393,8 +391,6 @@ span {
.fooconsole.logo-text
margin 0
.el-table th, .el-table tr.curheader
background-color #f1f3f7 !important
.el-table::before
height 0
......@@ -556,7 +552,6 @@ span {
padding: 0
.el-table th>.cell
color: #9d9fa5
font-size: 14px
.is-focus .el-input__inner
......
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