|
@@ -0,0 +1,341 @@
|
|
|
+<template>
|
|
|
+ <basic-container>
|
|
|
+ <avue-crud :key="key" ref="crud" :option="option" :data="data" :search.sync="query" @on-load="onLoad"
|
|
|
+ @search-reset="resetChange" :page.sync="page" :cell-style="cellStyle" @search-change="searchChange"
|
|
|
+ @resetColumn="resetColumnTwo('crud', 'option', 'optionList', 369)"
|
|
|
+ @saveColumn="saveColumnTwo('crud', 'option', 'optionList', 369)">
|
|
|
+ <template slot="menuLeft">
|
|
|
+ <el-button type="warning" icon="el-icon-download" size="small" @click="outExport">导出</el-button>
|
|
|
+ </template>
|
|
|
+ <template slot="header">
|
|
|
+ <el-table :data="commodityData" border size="small" @header-click="cellClick" style="width: 100%">
|
|
|
+ <el-table-column v-for="(item, index) in commodityLabel" :key="index" :prop="item.prop"
|
|
|
+ show-overflow-tooltip :label="item.label" />
|
|
|
+ </el-table>
|
|
|
+ </template>
|
|
|
+ <template slot="customerNameSearch">
|
|
|
+ <search-query :datalist="customerData" :selectValue="query.customerName" :filterable="true"
|
|
|
+ :clearable="true" :remote="true" :buttonIf="false"
|
|
|
+ :forParameter="{ key: 'id', label: 'cname', value: 'cname' }" placeholder="请选择客户名称"
|
|
|
+ @remoteMethod="KHgetListfun" @corpFocus="KHgetListfun" @corpChange="corpChange($event, 'customerName')">
|
|
|
+ </search-query>
|
|
|
+ </template>
|
|
|
+ <template slot="storageIdSearch">
|
|
|
+ <search-query :datalist="storageData" :selectValue="query.storageId" :clearable="true" :buttonIf="false"
|
|
|
+ :forParameter="{ key: 'id', label: 'cname', value: 'id' }" placeholder="请选择仓库" @corpFocus="storageIdfun"
|
|
|
+ @corpChange="corpChange($event, 'storageId')">
|
|
|
+ </search-query>
|
|
|
+ </template>
|
|
|
+ <template slot="salerNameSearch">
|
|
|
+ <search-query :datalist="salerData" :selectValue="query.salerName" :clearable="true" :buttonIf="false"
|
|
|
+ :forParameter="{ key: 'id', label: 'name', value: 'name' }" placeholder="请选择业务员"
|
|
|
+ @corpFocus="YWYgetListfun" @corpChange="corpChange($event, 'salerName')">
|
|
|
+ </search-query>
|
|
|
+ </template>
|
|
|
+ </avue-crud>
|
|
|
+ </basic-container>
|
|
|
+</template>
|
|
|
+
|
|
|
+<script>
|
|
|
+
|
|
|
+import { getList, salespersonCustomerSum } from "@/api/tirePartsMall/salesAnalysis";
|
|
|
+import { defaultDate3 } from "@/util/date";
|
|
|
+import { getList as KHgetList } from '@/api/tirePartsMall/basicData/customerInformation/index'
|
|
|
+import SearchQuery from "@/components/iosbasic-data/searchquery.vue";
|
|
|
+import { getToken } from "@/util/auth";
|
|
|
+import { getSalesman } from "@/api/landTransportation";
|
|
|
+import { storageDesc } from "@/api/tirePartsMall/basicData/listingManagement";
|
|
|
+
|
|
|
+export default {
|
|
|
+ components: { SearchQuery },
|
|
|
+ data() {
|
|
|
+ return {
|
|
|
+ key: 0,
|
|
|
+ data: [],
|
|
|
+ total: [],
|
|
|
+ storageData: [],
|
|
|
+ query: {
|
|
|
+ businesDateStart: defaultDate3()[0],
|
|
|
+ businesDateEnd: defaultDate3()[1],
|
|
|
+ bsType: 1
|
|
|
+ },
|
|
|
+ page: {
|
|
|
+ pageSize: 10,
|
|
|
+ currentPage: 1,
|
|
|
+ total: 0,
|
|
|
+ pageSizes: [10, 50, 100, 200, 300]
|
|
|
+ },
|
|
|
+ option: {},
|
|
|
+ optionList: {
|
|
|
+ align: 'center',
|
|
|
+ stripe: true,
|
|
|
+ index: true,
|
|
|
+ menu: false,
|
|
|
+ height: "auto",
|
|
|
+ border: true,
|
|
|
+ searchMenuSpan: 12,
|
|
|
+ addBtn: false,
|
|
|
+ showSummary: true,
|
|
|
+ summaryText: "合计",
|
|
|
+ sumColumnList: [
|
|
|
+ {
|
|
|
+ name: 'salesQuantity',
|
|
|
+ type: 'sum',
|
|
|
+ decimals: 0
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: 'returnQuantity',
|
|
|
+ type: 'sum',
|
|
|
+ decimals: 0
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: 'salesAmount',
|
|
|
+ type: 'sum',
|
|
|
+ decimals: 2
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: 'returnAmount',
|
|
|
+ type: 'sum',
|
|
|
+ decimals: 2
|
|
|
+ },
|
|
|
+ {
|
|
|
+ name: 'salesProfit',
|
|
|
+ type: 'sum',
|
|
|
+ decimals: 2
|
|
|
+ }
|
|
|
+ ],
|
|
|
+ column: [{
|
|
|
+ label: '业务开始',
|
|
|
+ prop: 'businesDateStart',
|
|
|
+ overHidden: true,
|
|
|
+ search: true,
|
|
|
+ hide: true,
|
|
|
+ searchOrder: 1,
|
|
|
+ type: "date",
|
|
|
+ format: "yyyy-MM-dd",
|
|
|
+ valueFormat: "yyyy-MM-dd",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '业务结束',
|
|
|
+ prop: 'businesDateEnd',
|
|
|
+ overHidden: true,
|
|
|
+ search: true,
|
|
|
+ hide: true,
|
|
|
+ searchOrder: 2,
|
|
|
+ type: "date",
|
|
|
+ format: "yyyy-MM-dd",
|
|
|
+ valueFormat: "yyyy-MM-dd",
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '业务员',
|
|
|
+ prop: 'salerName',
|
|
|
+ overHidden: true,
|
|
|
+ search: true,
|
|
|
+ searchslot: true,
|
|
|
+ hide: true,
|
|
|
+ searchOrder: 3
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '客户名称',
|
|
|
+ prop: 'customerName',
|
|
|
+ overHidden: true,
|
|
|
+ search: true,
|
|
|
+ searchslot: true,
|
|
|
+ hide: true,
|
|
|
+ searchOrder: 4
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '仓库',
|
|
|
+ prop: 'storageName',
|
|
|
+ searchProp: "storageId",
|
|
|
+ search: true,
|
|
|
+ overHidden: true,
|
|
|
+ searchslot: true,
|
|
|
+ hide: true,
|
|
|
+ searchOrder: 5
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '业务类型',
|
|
|
+ prop: "bsType",
|
|
|
+ type: 'select',
|
|
|
+ search: true,
|
|
|
+ overHidden: true,
|
|
|
+ searchslot: true,
|
|
|
+ hide: true,
|
|
|
+ searchOrder: 6,
|
|
|
+ dicData: [{
|
|
|
+ label: '客户',
|
|
|
+ value: 1
|
|
|
+ }, {
|
|
|
+ label: '业务员',
|
|
|
+ value: 2
|
|
|
+ }],
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '分析对象',
|
|
|
+ prop: 'customerName',
|
|
|
+ overHidden: true,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '销售数量',
|
|
|
+ prop: 'salesQuantity',
|
|
|
+ overHidden: true,
|
|
|
+ }, {
|
|
|
+ label: '退货数量',
|
|
|
+ prop: 'returnQuantity',
|
|
|
+ overHidden: true,
|
|
|
+ }, {
|
|
|
+ label: '销售金额',
|
|
|
+ prop: 'salesAmount',
|
|
|
+ overHidden: true,
|
|
|
+ }, {
|
|
|
+ label: '退货金额',
|
|
|
+ prop: 'returnAmount',
|
|
|
+ overHidden: true,
|
|
|
+ },
|
|
|
+ {
|
|
|
+ label: '销售利润',
|
|
|
+ prop: 'salesProfit',
|
|
|
+ overHidde: true,
|
|
|
+ }],
|
|
|
+ },
|
|
|
+ customerData: [], // 客户数据
|
|
|
+ salerData: [], // 业务员
|
|
|
+ commodityData: [], // 合计数据
|
|
|
+ // 合计的配置项
|
|
|
+ commodityLabel: [{
|
|
|
+ id: 1,
|
|
|
+ label: '销售数量',
|
|
|
+ prop: 'salesQuantity',
|
|
|
+ }, {
|
|
|
+ id: 2,
|
|
|
+ label: '退货数量',
|
|
|
+ prop: 'returnQuantity'
|
|
|
+ }, {
|
|
|
+ id: 3,
|
|
|
+ label: '销售金额',
|
|
|
+ prop: 'salesAmount',
|
|
|
+ }, {
|
|
|
+ id: 4,
|
|
|
+ label: '退货金额',
|
|
|
+ prop: 'returnAmount'
|
|
|
+ }, {
|
|
|
+ id: 5,
|
|
|
+ label: '销售利润',
|
|
|
+ prop: 'salesProfit'
|
|
|
+ }],
|
|
|
+ }
|
|
|
+ },
|
|
|
+ async created() {
|
|
|
+ this.option = await this.getColumnData(this.getColumnName(369), this.optionList);
|
|
|
+ },
|
|
|
+ methods: {
|
|
|
+ resetChange() {
|
|
|
+ this.query = this.$options.data().query
|
|
|
+ },
|
|
|
+ cellStyle({ row, rowIndex }) {
|
|
|
+ if (row.status == '已取消') {
|
|
|
+ return 'color: red';
|
|
|
+ }
|
|
|
+ return
|
|
|
+ },
|
|
|
+ //导出
|
|
|
+ outExport() {
|
|
|
+ let config = { params: { ...this.query } }
|
|
|
+ if (config.params) {
|
|
|
+ for (const propName of Object.keys(config.params)) {
|
|
|
+ const value = config.params[propName];
|
|
|
+ if (value !== null && typeof (value) !== "undefined") {
|
|
|
+ if (value instanceof Array) {
|
|
|
+ for (const key of Object.keys(value)) {
|
|
|
+ let params = propName + '[' + key + ']';
|
|
|
+ config.params[params] = value[key]
|
|
|
+ }
|
|
|
+ delete config.params[propName]
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ const routeData = this.$router.resolve({
|
|
|
+ path: '/api/blade-sales-part/statistics/salespersonCustomerExport', //跳转目标窗口的地址
|
|
|
+ query: {
|
|
|
+ ...config.params, //括号内是要传递给新窗口的参数,
|
|
|
+ }
|
|
|
+ })
|
|
|
+ window.open(routeData.href.slice(1, routeData.href.length) + '&' + `${this.website.tokenHeader}=${getToken()}`);
|
|
|
+ },
|
|
|
+ storageIdfun() {
|
|
|
+ storageDesc().then(res => {
|
|
|
+ this.storageData = res.data.data
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 获取客户数据
|
|
|
+ KHgetListfun(cname) {
|
|
|
+ KHgetList({ current: 1, size: 20, corpType: 'KH', cname: cname ? cname : null }).then(res => {
|
|
|
+ this.customerData = res.data.data.records
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 获取业务员数据
|
|
|
+ YWYgetListfun(realName) {
|
|
|
+ // YWYgetList(1,10,{realName:realName?realName:null}).then(res=>{
|
|
|
+ // this.salerData = res.data.data.records
|
|
|
+ // })
|
|
|
+ getSalesman().then(res => {
|
|
|
+ this.salerData = res.data.data
|
|
|
+ })
|
|
|
+ },
|
|
|
+ // 下拉回调
|
|
|
+ corpChange(value, name) {
|
|
|
+ this.$set(this.query, name, value)
|
|
|
+ },
|
|
|
+ //搜索
|
|
|
+ searchChange(params, done) {
|
|
|
+ this.query = params;
|
|
|
+ this.onLoad(this.page, params)
|
|
|
+ done();
|
|
|
+ },
|
|
|
+ // 获取列表数据
|
|
|
+ onLoad(page, params = {}) {
|
|
|
+ let queryParams = {
|
|
|
+ size: page.pageSize,
|
|
|
+ current: page.currentPage,
|
|
|
+ ...Object.assign(params, this.query)
|
|
|
+ }
|
|
|
+ console.log(queryParams)
|
|
|
+ getList(queryParams).then(res => {
|
|
|
+ this.data = res.data.data.records
|
|
|
+ this.page.total = res.data.data.total
|
|
|
+ salespersonCustomerSum({ ...Object.assign(params, this.query) }).then(re => {
|
|
|
+ this.commodityData = [re.data.data]
|
|
|
+ })
|
|
|
+ })
|
|
|
+ },
|
|
|
+ //自定义列保存
|
|
|
+ async saveColumnTwo(ref, option, optionBack, code) {
|
|
|
+ /**
|
|
|
+ * 已定义全局方法,直接使用,saveColumnData保存列数据方法,参数传值(表格名称,当前表格的option数据)
|
|
|
+ * 已定义全局方法,直接使用,getColumnName方法用来获取枚举值,参数根据自己定义的code值获取中文名
|
|
|
+ * 一定要执行异步操作,要等接口成功返回,才能执行下一行代码
|
|
|
+ */
|
|
|
+ const inSave = await this.saveColumnData(this.getColumnName(code), this[option]);
|
|
|
+ if (inSave) {
|
|
|
+ this.$message.success("保存成功");
|
|
|
+ //关闭窗口
|
|
|
+ this.$refs[ref].$refs.dialogColumn.columnBox = false;
|
|
|
+ }
|
|
|
+ },
|
|
|
+ //自定义列重置
|
|
|
+ async resetColumnTwo(ref, option, optionBack, code) {
|
|
|
+ this[option] = this[optionBack];
|
|
|
+ const inSave = await this.delColumnData(this.getColumnName(code), this[optionBack]);
|
|
|
+ if (inSave) {
|
|
|
+ this.$message.success("重置成功");
|
|
|
+ this.$refs[ref].$refs.dialogColumn.columnBox = false;
|
|
|
+ }
|
|
|
+ },
|
|
|
+
|
|
|
+ }
|
|
|
+}
|
|
|
+</script>
|
|
|
+
|
|
|
+<style scoped></style>
|