|
@@ -0,0 +1,303 @@
|
|
|
|
+<template>
|
|
|
|
+ <div>
|
|
|
|
+ <a-spin :spinning="spinning" tip="Loading...">
|
|
|
|
+ <a-tabs default-active-key="1" @change="handleChange" :tabBarStyle="{'background':'#fff'}">
|
|
|
|
+ <a-tab-pane key="1" tab="轮胎销售报表(经销商)">
|
|
|
|
+ <dealerList></dealerList>
|
|
|
|
+ </a-tab-pane>
|
|
|
|
+ <a-tab-pane key="2" tab="轮胎销售报表(区域/分区)" force-render>
|
|
|
|
+ <subareaList></subareaList>
|
|
|
|
+ </a-tab-pane>
|
|
|
|
+ </a-tabs>
|
|
|
|
+ <!-- 导出提示框 -->
|
|
|
|
+ <reportModal :visible="showExport" @close="showExport=false"></reportModal>
|
|
|
|
+ </a-spin>
|
|
|
|
+ </div>
|
|
|
|
+</template>
|
|
|
|
+
|
|
|
|
+<script>
|
|
|
|
+import { commonMixin } from '@/utils/mixin'
|
|
|
|
+import { STable, VSelect } from '@/components'
|
|
|
|
+import reportModal from '@/views/common/reportModal.vue'
|
|
|
|
+import { salesPromoReportList, salesPromoReportQueryCount, exportSalesPromoReport } from '@/api/reportData'
|
|
|
|
+import { hdExportExcel } from '@/libs/exportExcel'
|
|
|
|
+import subareaList from './subareaList'
|
|
|
|
+import dealerList from './dealerList'
|
|
|
|
+import rangeDate from '@/views/common/rangeDate.vue'
|
|
|
|
+import getDate from '@/libs/getDate.js'
|
|
|
|
+import subarea from '@/views/common/subarea.js'
|
|
|
|
+import AreaList from '@/views/common/areaList.js'
|
|
|
|
+// import moment from 'moment'
|
|
|
|
+export default {
|
|
|
|
+ name: 'PriceDifferenceDetailReportList',
|
|
|
|
+ mixins: [commonMixin],
|
|
|
|
+ components: { STable, VSelect, subareaList, dealerList, reportModal, AreaList, rangeDate, subarea },
|
|
|
|
+ data () {
|
|
|
|
+ const _this = this
|
|
|
|
+ return {
|
|
|
|
+ advanced: true, // 高级搜索 展开/关闭
|
|
|
|
+ time: undefined,
|
|
|
|
+ spinning: false,
|
|
|
|
+ queryParam: {
|
|
|
|
+ salesDate: [
|
|
|
|
+ getDate.getCurrMonthDays().starttime,
|
|
|
|
+ getDate.getCurrMonthDays().endtime
|
|
|
|
+ ],
|
|
|
|
+ beginAuditDate: getDate.getCurrMonthDays().starttime, // 审核开始时间
|
|
|
|
+ endAuditDate: getDate.getCurrMonthDays().endtime, // 审核结束时间
|
|
|
|
+ promoRuleReport: {
|
|
|
|
+ promotionDateStart: undefined, // 促销时间-开始
|
|
|
|
+ promotionDateEnd: undefined, // 促销时间-结束
|
|
|
|
+ title: '', // 促销名称
|
|
|
|
+ promotionRuleType: undefined, // 促销类型
|
|
|
|
+ ruleInfo: ''// 规则
|
|
|
|
+ },
|
|
|
|
+ salesBillNo: '', // 销售单号
|
|
|
|
+ buyerLevel: undefined, // 客户级别
|
|
|
|
+ buyerName: '', // 客户名称
|
|
|
|
+ subareaArea: {
|
|
|
|
+ subareaSn: '',
|
|
|
|
+ subareaAreaSn: ''
|
|
|
|
+ },
|
|
|
|
+ dealerProvinceSn: undefined, // 省份编码
|
|
|
|
+ dealerCitySn: undefined, // 城市编码
|
|
|
|
+ dealerDistrictSn: undefined // 区域编码
|
|
|
|
+ },
|
|
|
|
+ rules: {
|
|
|
|
+ salesDate: [{ required: true, message: '请选择销售审核时间', trigger: 'change' }]
|
|
|
|
+ },
|
|
|
|
+ dateFormat: 'YYYY-MM-DD',
|
|
|
|
+ tabVal: 1,
|
|
|
|
+ disabled: false,
|
|
|
|
+ tableHeight: 0,
|
|
|
|
+ totalData: null, // 合计
|
|
|
|
+ exportLoading: false,
|
|
|
|
+ showExport: false,
|
|
|
|
+ columns: [
|
|
|
|
+ { title: '促销名称', dataIndex: 'promotion.title', width: '160px', align: 'left', customRender: function (text) { return text || '--' }, fixed: 'left', ellipsis: true },
|
|
|
|
+ { title: '促销时间', scopedSlots: { customRender: 'promotionTime' }, width: '130px', align: 'center', fixed: 'left' },
|
|
|
|
+ { title: '费用所属部门', dataIndex: 'departmentName', width: '160px', align: 'center', customRender: function (text) { return text || '--' }, ellipsis: true, fixed: 'left' },
|
|
|
|
+ { title: '促销类型', dataIndex: 'promotionRule.promotionRuleTypeDictValue', width: '100px', align: 'center', customRender: function (text) { return text || '--' }, fixed: 'left' },
|
|
|
|
+ { title: '规则', dataIndex: 'promotionRule.ruleInfo', width: '180px', align: 'left', customRender: function (text) { return text || '--' }, fixed: 'left' },
|
|
|
|
+ { title: '销售单号', dataIndex: 'salesBillNo', width: '120px', align: 'center', customRender: function (text) { return text || '--' }, fixed: 'left' },
|
|
|
|
+ { title: '区域', dataIndex: 'subareaArea.subareaName', width: '80px', align: 'center', customRender: function (text) { return text || '--' } },
|
|
|
|
+ { title: '分区', dataIndex: 'subareaArea.subareaAreaName', width: '80px', align: 'center', customRender: function (text) { return text || '--' } },
|
|
|
|
+ { title: '地区', dataIndex: 'provinceName', width: '160px', align: 'center', scopedSlots: { customRender: 'addressInfo' } },
|
|
|
|
+ { title: '客户名称', dataIndex: 'buyerName', width: '140px', align: 'center', customRender: function (text) { return text || '--' }, ellipsis: true },
|
|
|
|
+ { title: '客户级别', dataIndex: 'buyerLevelDictValue', width: '80px', align: 'center', customRender: function (text) { return text || '--' } },
|
|
|
|
+ { title: '销售审核时间', dataIndex: 'auditDate', width: '120px', align: 'center', customRender: function (text) { return text || '--' } },
|
|
|
|
+ { title: '数量(非促)', dataIndex: 'notGiftQty', width: '100px', align: 'center', customRender: function (text) { return ((text || text == 0) ? text : '--') } },
|
|
|
|
+ { title: '数量(促)', dataIndex: 'giftQty', width: '100px', align: 'center', customRender: function (text) { return ((text || text == 0) ? text : '--') } },
|
|
|
|
+ { title: '实售金额', dataIndex: 'totalRealAmount', width: '100px', align: 'center', customRender: function (text) { return ((text || text == 0) ? _this.toThousands(text) : '--') } },
|
|
|
|
+ { title: '开单金额', dataIndex: 'totalAmount', width: '100px', align: 'center', customRender: function (text) { return ((text || text == 0) ? _this.toThousands(text) : '--') } },
|
|
|
|
+ { title: '成本金额', dataIndex: 'totalRealCost', width: '100px', align: 'center', customRender: function (text) { return ((text || text == 0) ? _this.toThousands(text) : '--') } },
|
|
|
|
+ { title: '损失成本', dataIndex: 'lossCost', width: '100px', align: 'center', customRender: function (text) { return ((text || text == 0) ? _this.toThousands(text) : '--') } },
|
|
|
|
+ { title: '损失费用', dataIndex: 'lossAmount', width: '100px', align: 'center', customRender: function (text) { return ((text || text == 0) ? _this.toThousands(text) : '--') } },
|
|
|
|
+ { title: '采购额结余', dataIndex: 'surplusPromoGiftsAmount', width: '100px', align: 'center', customRender: function (text) { return ((text || text == 0) ? _this.toThousands(text) : '--') } },
|
|
|
|
+ { title: '采购额超出', dataIndex: 'outPromoGiftsAmount', width: '100px', align: 'center', customRender: function (text) { return ((text || text == 0) ? _this.toThousands(text) : '--') } },
|
|
|
|
+ { title: '促销品费用归属品牌', dataIndex: 'promoProductBrandName', width: '120px', align: 'center', customRender: function (text) { return text || '--' } },
|
|
|
|
+ { title: '促销品费用归属分类', dataIndex: 'promoProductTypeName', width: '120px', align: 'center', customRender: function (text) { return text || '--' } }
|
|
|
|
+ ],
|
|
|
|
+ // 加载数据方法 必须为 Promise 对象
|
|
|
|
+ loadData: parameter => {
|
|
|
|
+ this.disabled = true
|
|
|
|
+ const params = Object.assign(parameter, this.queryParam)
|
|
|
|
+ const newParams = JSON.parse(JSON.stringify(params))
|
|
|
|
+ delete newParams.salesDate
|
|
|
|
+ this.spinning = true
|
|
|
|
+ return salesPromoReportList(newParams).then(res => {
|
|
|
|
+ let data
|
|
|
|
+ if (res.status == 200) {
|
|
|
|
+ data = res.data
|
|
|
|
+ const no = (data.pageNo - 1) * data.pageSize
|
|
|
|
+ for (var i = 0; i < data.list.length; i++) {
|
|
|
|
+ data.list[i].no = no + i + 1
|
|
|
|
+ }
|
|
|
|
+ this.disabled = false
|
|
|
|
+ }
|
|
|
|
+ this.spinning = false
|
|
|
|
+ return data
|
|
|
|
+ })
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ methods: {
|
|
|
|
+ salesDateChange (date) {
|
|
|
|
+ if (date[0] && date[1]) {
|
|
|
|
+ this.queryParam.salesDate = date
|
|
|
|
+ } else {
|
|
|
|
+ this.queryParam.salesDate = []
|
|
|
|
+ }
|
|
|
|
+ this.queryParam.beginAuditDate = date[0] || ''
|
|
|
|
+ this.queryParam.endAuditDate = date[1] || ''
|
|
|
|
+ },
|
|
|
|
+ dateChange (date, dateString) {
|
|
|
|
+ this.time = date
|
|
|
|
+ if (dateString[0] != '' && dateString[1] != '') {
|
|
|
|
+ this.queryParam.promoRuleReport.promotionDateStart = dateString[0] + ' 00:00:00'
|
|
|
|
+ this.queryParam.promoRuleReport.promotionDateEnd = dateString[1] + ' 23:59:59'
|
|
|
|
+ } else {
|
|
|
|
+ this.$set(this.queryParam.promoRuleReport, 'promotionDateStart', undefined)
|
|
|
|
+ this.$set(this.queryParam.promoRuleReport, 'promotionDateEnd', undefined)
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ // // 不可选日期
|
|
|
|
+ // disabledDate (date, dateStrings) {
|
|
|
|
+ // return date && date.valueOf('day') < moment().subtract(1, 'day') // 今天以后,包含今天
|
|
|
|
+ // },
|
|
|
|
+ // 统计
|
|
|
|
+ getCount (params) {
|
|
|
|
+ salesPromoReportQueryCount(params).then(res => {
|
|
|
|
+ if (res.status == 200) {
|
|
|
|
+ this.totalData = res.data
|
|
|
|
+ } else {
|
|
|
|
+ this.totalData = null
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+ },
|
|
|
|
+ subareaChange (val) {
|
|
|
|
+ this.queryParam.subareaArea.subareaSn = val[0] ? val[0] : undefined
|
|
|
|
+ this.queryParam.subareaArea.subareaAreaSn = val[1] ? val[1] : undefined
|
|
|
|
+ },
|
|
|
|
+ // tab
|
|
|
|
+ handleChange (val) {
|
|
|
|
+ this.tabVal = val
|
|
|
|
+ },
|
|
|
|
+ // 导出
|
|
|
|
+ handleExport () {
|
|
|
|
+ const _this = this
|
|
|
|
+ const params = this.queryParam
|
|
|
|
+ _this.exportLoading = true
|
|
|
|
+ _this.spinning = true
|
|
|
|
+ const ajaxUrl = _this.tabVal == 1 ? exportSalesPromoReport : exportSalesPromoRealReport
|
|
|
|
+ const ajaxName = _this.tabVal == 1 ? '促销销售单报表导出' : '促销销售单实时报表导出'
|
|
|
|
+ hdExportExcel(ajaxUrl, params, ajaxName, function () {
|
|
|
|
+ _this.exportLoading = false
|
|
|
|
+ _this.spinning = false
|
|
|
|
+ _this.showExport = true
|
|
|
|
+ })
|
|
|
|
+ },
|
|
|
|
+ // 验证表单 type值 search查询 export导出
|
|
|
|
+ testForm (type) {
|
|
|
|
+ const _this = this
|
|
|
|
+ if (!_this.queryParam.salesDate[0] || !_this.queryParam.salesDate[1]) {
|
|
|
|
+ _this.$message.error('请选择销售审核时间')
|
|
|
|
+ return
|
|
|
|
+ }
|
|
|
|
+ _this.$refs.ruleForm.validate(valid => {
|
|
|
|
+ if (valid) {
|
|
|
|
+ if (type == 'search') {
|
|
|
|
+ _this.handleSearch()
|
|
|
|
+ } else {
|
|
|
|
+ _this.handleExport()
|
|
|
|
+ }
|
|
|
|
+ } else {
|
|
|
|
+ _this.$message.error('请选择销售审核时间')
|
|
|
|
+ return false
|
|
|
|
+ }
|
|
|
|
+ })
|
|
|
|
+ },
|
|
|
|
+ areaChange (val) {
|
|
|
|
+ this.queryParam.dealerProvinceSn = val[0] ? val[0] : ''
|
|
|
|
+ this.queryParam.dealerCitySn = val[1] ? val[1] : ''
|
|
|
|
+ this.queryParam.dealerDistrictSn = val[2] ? val[2] : ''
|
|
|
|
+ },
|
|
|
|
+ // 查询
|
|
|
|
+ handleSearch () {
|
|
|
|
+ const _this = this
|
|
|
|
+ // 总计
|
|
|
|
+ const paramData = JSON.parse(JSON.stringify(this.queryParam))
|
|
|
|
+ delete paramData.salesDate
|
|
|
|
+ _this.getCount(paramData)
|
|
|
|
+ _this.$refs.table.refresh(true)
|
|
|
|
+ },
|
|
|
|
+ // 重置
|
|
|
|
+ resetSearchForm () {
|
|
|
|
+ this.$refs.ruleForm.resetFields()
|
|
|
|
+ this.queryParam = {
|
|
|
|
+ salesDate: [
|
|
|
|
+ getDate.getCurrMonthDays().starttime,
|
|
|
|
+ getDate.getCurrMonthDays().endtime
|
|
|
|
+ ],
|
|
|
|
+ beginAuditDate: getDate.getCurrMonthDays().starttime, // 审核开始时间
|
|
|
|
+ endAuditDate: getDate.getCurrMonthDays().endtime, // 审核结束时间
|
|
|
|
+ promoRuleReport: {
|
|
|
|
+ promotionDateStart: undefined, // 促销时间-开始
|
|
|
|
+ promotionDateEnd: undefined, // 促销时间-结束
|
|
|
|
+ title: '', // 促销名称
|
|
|
|
+ promotionRuleType: undefined, // 促销类型
|
|
|
|
+ ruleInfo: ''// 规则
|
|
|
|
+ },
|
|
|
|
+ salesBillNo: '', // 销售单号
|
|
|
|
+ buyerLevel: undefined, // 客户级别
|
|
|
|
+ buyerName: '', // 客户名称
|
|
|
|
+ subareaArea: {
|
|
|
|
+ subareaSn: '',
|
|
|
|
+ subareaAreaSn: ''
|
|
|
|
+ },
|
|
|
|
+ dealerProvinceSn: undefined, // 省份编码
|
|
|
|
+ dealerCitySn: undefined, // 城市编码
|
|
|
|
+ dealerDistrictSn: undefined // 区域编码
|
|
|
|
+ }
|
|
|
|
+ this.time = undefined
|
|
|
|
+ this.$refs.subarea.clearData()
|
|
|
|
+ this.$refs.areaList.clearData()
|
|
|
|
+ this.$refs.rangeDate.resetDate(this.queryParam.salesDate)
|
|
|
|
+ this.$refs.table.clearTable()
|
|
|
|
+ this.totalData = null
|
|
|
|
+ },
|
|
|
|
+ pageInit () {
|
|
|
|
+ const _this = this
|
|
|
|
+ this.$nextTick(() => { // 页面渲染完成后的回调
|
|
|
|
+ _this.setTableH()
|
|
|
|
+ })
|
|
|
|
+ },
|
|
|
|
+ setTableH () {
|
|
|
|
+ const tableSearchH = this.$refs.tableSearch.offsetHeight
|
|
|
|
+ this.tableHeight = window.innerHeight - tableSearchH - 260
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ watch: {
|
|
|
|
+ advanced (newValue, oldValue) {
|
|
|
|
+ const _this = this
|
|
|
|
+ this.$nextTick(() => { // 页面渲染完成后的回调
|
|
|
|
+ _this.setTableH()
|
|
|
|
+ })
|
|
|
|
+ },
|
|
|
|
+ '$store.state.app.winHeight' (newValue, oldValue) { // 窗口变更时,需同时更改表格高度
|
|
|
|
+ this.setTableH()
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ mounted () {
|
|
|
|
+ if (!this.$store.state.app.isNewTab) { // 页签刷新时调用
|
|
|
|
+ this.pageInit()
|
|
|
|
+ }
|
|
|
|
+ },
|
|
|
|
+ activated () {
|
|
|
|
+ // 如果是新页签打开,则重置当前页面
|
|
|
|
+ if (this.$store.state.app.isNewTab) {
|
|
|
|
+ this.pageInit()
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+}
|
|
|
|
+
|
|
|
|
+</script>
|
|
|
|
+
|
|
|
|
+<style lang="less" scoped>
|
|
|
|
+ .monthBox{
|
|
|
|
+ /deep/.ant-calendar-picker-icon{
|
|
|
|
+ display:none !important;
|
|
|
|
+ }
|
|
|
|
+ /deep/.ant-calendar-picker input{
|
|
|
|
+ text-align:center;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ .promotionSalesRealTimeReport-wrap{
|
|
|
|
+ /deep/ .ant-card-body:first-child{
|
|
|
|
+ padding-bottom: 0;
|
|
|
|
+ }
|
|
|
|
+ }
|
|
|
|
+ .ant-tabs-tabpane.ant-tabs-tabpane-active{
|
|
|
|
+ margin-top:-11px !important;
|
|
|
|
+ }
|
|
|
|
+</style>
|