You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
bsdgy-front/src/pages/shop/IncreaseDataStore.vue

307 lines
12 KiB
Vue

<template>
<div>
<Row class="search-row">
<i-col span="24" class="search-col">
<Row class="row-style">
<span class="search-span">选择日期</span>
<DatePicker @on-change="onChangeDateLister" :value="selectDate" type="daterange" split-panels
placeholder="请选择日期" class="date-picker"></DatePicker>
<span class="search-span">零售公司</span>
<Select v-model="selectedCompany" filterable class="search-select" @on-change="storeOfCompany">
<Option v-for="item in companyList" :value="item.id" :key="item.id">{{ item.name }}</Option>
</Select>
<span class="search-span">店铺</span>
<Select v-model="selectedStore" filterable class="search-select">
<Option v-for="item in storeList" :value="item.id" :key="item.id">{{ item.name }}</Option>
</Select>
<Button type="primary" @click="generalizeOfStore" class="search-btn">查询</Button>
<div class="search-div-btn">
<Button :loading="loading" type="primary" @click="exportZeroExtend">导出数据</Button>
</div>
</Row>
</i-col>
</Row>
<Table :loading="tableLoading" :columns="columns1" :data="data1" style="margin-top: 20px;" ref="table"
size="small"></Table>
<Page :total="totalSize" :current="pageNum" :page-size="pageSize" show-elevator show-total
placement="top" @on-change="handlePage" class-name="ks-page"></Page>
</div>
</template>
<script>
import IncreaseData from "../../services/generalize/IncreaseData";
export default {
name: "IncreaseDataStore",
data() {
return {
selectDate: [],
selectedCompany: null,
companyList: [],
selectedStore: null,
storeList: [],
columns1: [
{
title: '序号',
key: 'index',
width: '80px'
},
{
title: '店铺',
key: 'shopName',
width: '250px'
},
{
title: '店铺编号',
key: 'shopCode'
},
{
title: '所属零售公司',
key: 'companyName',
width: '250px'
},
{
title: '总好友数',
key: 'allCustomer'
},
{
title: '总好友数(去重)',
key: 'effectiveCustomer'
},
{
title: '新增好友数',
key: 'newCustomer'
},
{
title: '新增好友数(去重)',
key: 'newEffectiveCustomer'
},
{
title: '日增好友平均',
key: 'avgNewCustomer'
},
{
title: '日增好友平均(去重)',
key: 'avgNewEffectiveCustomer'
},
{
title: '删除/拉黑成员客户数(累计)',
key: 'delCustomer'
},
{
title: '拉黑率(累计)',
key: 'delRate'
}
],
data1: [],
//分页内容
totalSize: 0,
pageNum: 1,
pageSize: 10,
loading: false,
tableLoading: false,
}
},
mounted: function () {
let startDate = this.$moment(new Date()).add(-29, "day").format("YYYY-MM-DD");
let endDate = this.$moment(new Date()).format("YYYY-MM-DD");
this.selectDate.push(startDate);
this.selectDate.push(endDate);
this.allCompany();
this.storeInit();
this.generalizeOfStore();
},
methods: {
allCompany() {
let that = this;
let request = {
userId: JSON.parse(sessionStorage.getItem("loginInfo")).userId
};
this.companyList = [];
IncreaseData.listOfRetailCompany(request, function (data) {
data = data.data;
if (data.code === '0001') {
that.$Message.error("查询零售公司出错!");
return;
}
if (data.code === '0000') {
that.companyList.push({id: '-1', name: "全部"});
that.selectedCompany = "-1";
data.results.forEach(da => {
that.companyList.push(da);
})
}
})
},
storeInit() {
let that = this;
let request = {
userId: JSON.parse(sessionStorage.getItem("loginInfo")).userId
};
this.storeList = [];
IncreaseData.storeInit(request, function (data) {
data = data.data;
if (data.code === '0001') {
that.$Message.error("查询零售公司的店铺出错!");
return;
}
if (data.code === '0000') {
that.storeList.push({
id: '-1',
name: "全部"
});
that.selectedStore = '-1';
data.results.forEach(da => {
that.storeList.push(da);
})
}
})
},
storeOfCompany() {
this.selectedStore = null;
let that = this;
let orgId = this.selectedCompany;
if (this.selectedCompany === "-1") {
orgId = null;
}
let request = {
orgId: orgId
};
this.storeList = [];
IncreaseData.listOfStoreByCompany(request, function (data) {
data = data.data;
if (data.code === '0001') {
that.$Message.error("查询零售公司的店铺出错!");
return;
}
if (data.code === '0000') {
that.storeList.push({
id: '-1',
name: "全部"
});
that.selectedStore = '-1';
data.results.forEach(da => {
that.storeList.push(da);
})
}
})
},
generalizeOfStore() {
this.pageNum = 1;
this.tableLoading = true;
if (this.selectDate[0] === "") {
this.$Message.info("请选择日期");
return
}
let orgId = this.selectedCompany;
if (this.selectedCompany === "-1") {
orgId = null;
}
let shopId = this.selectedStore;
if (this.selectedStore === "-1") {
shopId = null;
}
let request = {
startTime: this.selectDate[0],
endTime: this.selectDate[1],
orgId: orgId,
shopId: shopId,
pageNum: this.pageNum,
pageSize: this.pageSize,
userId: JSON.parse(sessionStorage.getItem("loginInfo")).userId
};
let that = this;
IncreaseData.generalizeOfStore(request, function (data) {
that.data1 = [];
that.tableLoading = false;
data = data.data;
if (data.code === '0001') {
that.$Message.info("查询门店推广数据失败!");
return;
}
if (data.code === '0000') {
that.data1 = data.results.dataVOS;
for (let i = 0; i < that.data1.length; i++) {
that.data1[i].index = (that.pageNum - 1) * that.pageSize + i + 1;
}
that.totalSize = data.results.sizeNum;
}
})
},
//切页处理
handlePage: function (value) {
this.pageNum = value;
this.generalizeOfStore();
},
onChangeDateLister(date) {
this.selectDate = date;
},
//零推广导出
exportZeroExtend: function () {
this.loading = true;
if (this.selectDate[0] === "") {
this.$Message.info("请选择日期");
return
}
let orgId = this.selectedCompany;
if (this.selectedCompany === "-1") {
orgId = null;
}
let shopId = this.selectedStore;
if (this.selectedStore === "-1") {
shopId = null;
}
let request = {
startTime: this.selectDate[0],
endTime: this.selectDate[1],
orgId: orgId,
shopId: shopId,
pageNum: this.pageNum,
pageSize: this.totalSize,
userId: JSON.parse(sessionStorage.getItem("loginInfo")).userId
};
let that = this;
let originAllData = [];
IncreaseData.generalizeOfStore(request, function (data) {
if (data.data.code !== "0000") {
that.$Message.error("系统异常");
}
data = data.data.results.dataVOS;
if (data && data.length > 0) {
that.loading = false;
for (let i = 0; i < data.length; i++) {
let entity = data[i];
entity.index = i + 1;
originAllData.push(entity);
}
let title = "店铺推广情况" + that.selectDate[0] + '-' + that.selectDate[1];
require.ensure([], () => {
const {export_json_to_excel} = require('../../excel/Export2Excel');
const tHeader = ['序号', '店铺', '店铺编号', '所属零售公司', '总好友数', '总好友数(去重)', '新增好友数', '新增好友数(去重)', '日增好友平均', '日增好友平均(去重)', '删除/拉黑成员客户数(累计)', '拉黑率(累计)'];
// 属性名
const filterVal = ['index', 'shopName', 'shopCode', 'companyName', 'allCustomer', 'effectiveCustomer', 'newCustomer', 'newEffectiveCustomer', 'avgNewCustomer', 'avgNewEffectiveCustomer', 'delCustomer', 'delRate'];
// 数据
//把data里的tableData存到list
const data = that.formatJson(filterVal, originAllData);
export_json_to_excel(tHeader, data, title);
});
}
if (!data || data.length === 0) {
that.$Message.info("暂无数据");
}
});
},
formatJson(filterVal, jsonData) {
return jsonData.map(v => filterVal.map(j => v[j]))
},
}
}
</script>
<style scoped>
</style>