lion 3 years ago
parent 86b274004a
commit 1d97eff3e5

@ -0,0 +1,92 @@
import axios from 'axios'
import { getToken } from '@/utils/auth'
import { Loading, Message } from 'element-ui'
/*
* @params {string} url 请求拼接地址
* @params {object} info 请求参数params或data
*/
let loading;
export async function download(url,method='get',info,filename){
loading = Loading.service({
lock:true,
background:"rgba(0,0,0,0.4)",
text:"文件正在生成中..."
})
let options = {
baseURL:process.env.VUE_APP_BASE_API,
url,
method,
responseType: 'blob',
timeout:10000,
headers: {
Accept: 'application/json','Content-Type':'application/json; charset=utf-8',
withCredentials: true,
Authorization:"Bearer " + getToken()
},
}
if(method === 'get'){
Object.defineProperty(options,'params',{
value:info,
enumerable:true,
writable:false
})
}
if(method === 'post'){
Object.defineProperty(options,'data',{
value:info,
enumerable:true,
writable:false
})
}
try {
const response = await axios.request(options)
loading.close()
// 提取文件名
if(!filename){
filename = response.headers['content-disposition']?.match(
/filename=(.*)/
)[1] || ''
}
// 将二进制流转为blob
const blob = new Blob([response.data], { type: 'application/octet-stream' })
if (typeof window.navigator.msSaveBlob !== 'undefined') {
// 兼容IEwindow.navigator.msSaveBlob以本地方式保存文件
window.navigator.msSaveBlob(blob, decodeURI(filename))
} else {
// 创建新的URL并指向File对象或者Blob对象的地址
const blobURL = window.URL.createObjectURL(blob)
// 创建a标签用于跳转至下载链接
const tempLink = document.createElement('a')
tempLink.style.display = 'none'
tempLink.href = blobURL
tempLink.setAttribute('download', decodeURI(filename))
// 兼容某些浏览器不支持HTML5的download属性
if (typeof tempLink.download === 'undefined') {
tempLink.setAttribute('target', '_blank')
}
// 挂载a标签
document.body.appendChild(tempLink)
tempLink.click()
document.body.removeChild(tempLink)
// 释放blob URL地址
window.URL.revokeObjectURL(blobURL)
}
}catch (err){
console.error(err)
loading.close()
Message({
type:'error',
message:err
})
}
}

@ -11,13 +11,19 @@ import {
let loading ; let loading ;
// create an axios instance // create an axios instance
let baseUrl = ''
if(window.location.origin.indexOf('localhost')>-1){
baseUrl = process.env.VUE_APP_BASE_API
}else{
baseUrl = window.location.origin + '/'
}
console.log(baseUrl,window.location.origin)
const service = axios.create({ const service = axios.create({
baseURL: process.env.VUE_APP_BASE_API, // url = base url + request url baseURL: baseUrl, // url = base url + request url
// withCredentials: true, // send cookies when cross-domain requests // withCredentials: true, // send cookies when cross-domain requests
timeout: 10000, // request timeout timeout: 100000, // request timeout
isLoading:true isLoading:true
}) })
// request interceptor // request interceptor
service.interceptors.request.use( service.interceptors.request.use(
config => { config => {

@ -1,7 +1,7 @@
<template> <template>
<div> <div>
<!-- <div class="statistics"> <!-- <div class="statistics">
<div style="display: flex;justify-content: flex-end;margin-bottom: 10px;"> <div style="display: flex;justify-content: flex-end;margin-bottom: 10px;">
<el-date-picker v-model="dateMonth" value-format="yyyy-MM" type="month" @change="loadData" placeholder="选择月份"> <el-date-picker v-model="dateMonth" value-format="yyyy-MM" type="month" @change="loadData" placeholder="选择月份">
</el-date-picker> </el-date-picker>
@ -17,71 +17,88 @@
</div> </div>
</div> </div>
<xy-table <xy-table :table-item="table" :list="data" :total="total"
:table-item="table"
:list="data"
:total="total"
@pageSizeChange="e => {select.rows = e;select.page = 1;getList()}" @pageSizeChange="e => {select.rows = e;select.page = 1;getList()}"
@pageIndexChange="e => {select.page = e;getList()}"> @pageIndexChange="e => {select.page = e;getList()}">
<template v-slot:btns><div></div></template> <template v-slot:btns>
<div></div>
</template>
</xy-table> </xy-table>
<!-- <div class="chart">-->
<!-- <div style="display: flex;justify-content: flex-end;margin-bottom: 10px;">--> <div>
<!-- <el-date-picker v-model="year" value-format="yyyy" type="year" @change="getCharData" placeholder="选择年份">--> <div ref="lxHeader">
<!-- </el-date-picker>--> <LxHeader icon="md-apps" text="财务中心" style="margin-bottom: 10px; border: 0px; margin-top: 15px">
<!-- </div>--> <div slot="content"></div>
<!-- <div>-->
</LxHeader>
<!-- <el-row :gutter="16">--> </div>
<!-- <el-col :xs="12" :sm="12" :lg="8">--> </div>
<!-- <div class="chart-wrapper">-->
<!-- <div class="chart-title">--> <xy-table :table-item="fintable" :list="findata" :total="fintotal"
<!-- <router-link to="/toolbox/exception">人员借阅统计</router-link>--> @pageSizeChange="e => {finselect.rows = e;finselect.page = 1;getFinList()}"
<!-- </div>--> @pageIndexChange="e => {finselect.page = e;getFinList()}">
<!-- <ybar-chart :chartData="lineUserData" />--> <template v-slot:btns>
<!-- </div>--> <div></div>
<!-- </el-col>--> </template>
<!-- <el-col :xs="12" :sm="12" :lg="8">--> </xy-table>
<!-- <div class="chart-wrapper">-->
<!-- <div class="chart-title">--> <!-- <div class="chart">-->
<!-- <router-link to="/toolbox/exception">部门借阅统计</router-link>--> <!-- <div style="display: flex;justify-content: flex-end;margin-bottom: 10px;">-->
<!-- </div>--> <!-- <el-date-picker v-model="year" value-format="yyyy" type="year" @change="getCharData" placeholder="选择年份">-->
<!-- <ybar-chart :chartData="lineDeptData" />--> <!-- </el-date-picker>-->
<!-- </div>--> <!-- </div>-->
<!-- </el-col>--> <!-- <div>-->
<!-- <el-col :xs="12" :sm="12" :lg="8">-->
<!-- <div class="chart-wrapper">--> <!-- <el-row :gutter="16">-->
<!-- <div class="chart-title">--> <!-- <el-col :xs="12" :sm="12" :lg="8">-->
<!-- <router-link to="/toolbox/exception">书籍借阅统计</router-link>--> <!-- <div class="chart-wrapper">-->
<!-- </div>--> <!-- <div class="chart-title">-->
<!-- <ybar-chart :chartData="lineBookData" />--> <!-- <router-link to="/toolbox/exception">人员借阅统计</router-link>-->
<!-- </div>--> <!-- </div>-->
<!-- </el-col>--> <!-- <ybar-chart :chartData="lineUserData" />-->
<!-- </el-row>--> <!-- </div>-->
<!-- </div>--> <!-- </el-col>-->
<!-- </div>--> <!-- <el-col :xs="12" :sm="12" :lg="8">-->
<!-- <div class="chart-wrapper">-->
<!-- <div class="chart-title">-->
<!-- <el-row :gutter="16" style="margin-top: 20px;">--> <!-- <router-link to="/toolbox/exception">部门借阅统计</router-link>-->
<!-- </div>-->
<!-- <el-col :xs="12" :sm="12" :lg="8">--> <!-- <ybar-chart :chartData="lineDeptData" />-->
<!-- <div class="chart-wrapper">--> <!-- </div>-->
<!-- <div class="chart-title">--> <!-- </el-col>-->
<!-- <router-link to="/toolbox/exception">类目借阅统计</router-link>--> <!-- <el-col :xs="12" :sm="12" :lg="8">-->
<!-- </div>--> <!-- <div class="chart-wrapper">-->
<!-- <ybar-chart :chartData="lineTypeData" />--> <!-- <div class="chart-title">-->
<!-- </div>--> <!-- <router-link to="/toolbox/exception">书籍借阅统计</router-link>-->
<!-- </el-col>--> <!-- </div>-->
<!-- <el-col :xs="16" :sm="16" :lg="16">--> <!-- <ybar-chart :chartData="lineBookData" />-->
<!-- <div class="chart-wrapper">--> <!-- </div>-->
<!-- <div class="chart-title">--> <!-- </el-col>-->
<!-- <router-link to="/toolbox/exception">月度借阅趋势</router-link>--> <!-- </el-row>-->
<!-- </div>--> <!-- </div>-->
<!-- <line-chart :chartData="lineArr" />--> <!-- </div>-->
<!-- </div>-->
<!-- </el-col>-->
<!-- </el-row>--> <!-- <el-row :gutter="16" style="margin-top: 20px;">-->
<!-- <el-col :xs="12" :sm="12" :lg="8">-->
<!-- <div class="chart-wrapper">-->
<!-- <div class="chart-title">-->
<!-- <router-link to="/toolbox/exception">类目借阅统计</router-link>-->
<!-- </div>-->
<!-- <ybar-chart :chartData="lineTypeData" />-->
<!-- </div>-->
<!-- </el-col>-->
<!-- <el-col :xs="16" :sm="16" :lg="16">-->
<!-- <div class="chart-wrapper">-->
<!-- <div class="chart-title">-->
<!-- <router-link to="/toolbox/exception">月度借阅趋势</router-link>-->
<!-- </div>-->
<!-- <line-chart :chartData="lineArr" />-->
<!-- </div>-->
<!-- </el-col>-->
<!-- </el-row>-->
</div> </div>
</template> </template>
@ -96,8 +113,12 @@
getCounts getCounts
} from "../../api/dashboard.js" } from "../../api/dashboard.js"
import LxHeader from '@/components/LxHeader/index.vue' import LxHeader from '@/components/LxHeader/index.vue'
import {getList} from '@/api/order' import {
getList
} from '@/api/order'
import {
getList as getfinlist
} from '@/api/finance'
export default { export default {
components: { components: {
PanelGroup, PanelGroup,
@ -107,79 +128,123 @@
}, },
data() { data() {
return { return {
select:{ select: {
page:1, page: 1,
rows:10, rows: 10,
show_history:0, show_history: 0,
state:'assigned', state: 'assigned',
keyword:'', keyword: '',
not_state:["pending"], not_state: ["pending"],
sort_name:"updated_at", sort_name: "updated_at",
sort_type:"desc" sort_type: "desc"
},
finselect: {
page: 1,
rows: 10,
}, },
total:0, fintotal: 0,
data:[], findata: [],
table:[ fintable: [{
label: '产生时间',
prop: 'created_at_formatted',
width: 200,
sortable: false
},
{
label: '金额',
align: 'right',
prop: 'money',
width: 160,
sortable: false
},
{
label: '余额',
prop: 'balance',
align: 'right',
width: 160,
sortable: false
},
{
label: '类型',
prop: 'type_name',
width: 160,
sortable: false
},
{ {
label:'订单名称', label: '相关类型',
sortable:false, prop: 'related_type_name',
prop:'order.order_name', width: 160,
width:180, sortable: false
align:'left'
}, },
// {
// label:'',
// prop:'related_id',
// sortable:false
// },
{ {
label:'客户姓名', label: '订单编号',
sortable:false, prop: 'order.serial',
prop:'member_name', sortable: false
width:140 }
],
total: 0,
data: [],
table: [{
label: '订单名称',
sortable: false,
prop: 'order.order_name',
width: 180,
align: 'left'
},
{
label: '客户姓名',
sortable: false,
prop: 'member_name',
width: 140
}, },
{ {
label:'客户电话', label: '客户电话',
sortable:false, sortable: false,
prop:'member_phone', prop: 'member_phone',
width: 180 width: 180
}, },
{ {
label:'区域', label: '区域',
sortable:false, sortable: false,
prop:'member.area', prop: 'member.area',
width: 160 width: 160
}, },
{ {
label:'预产期', label: '预产期',
sortable:false, sortable: false,
prop:'member_due_date', prop: 'member_due_date',
width: 160 width: 160
}, },
{ {
label:'产品类型', label: '产品类型',
sortable:false, sortable: false,
prop:'product_type.name', prop: 'product_type.name',
width: 140 width: 140
}, },
{ {
prop:'order.serial', prop: 'order.serial',
label:'订单编号', label: '订单编号',
width:180, width: 180,
sortable:false, sortable: false,
}, },
{ {
prop:'order.created_at', prop: 'order.created_at',
label:'订单创建时间', label: '订单创建时间',
// width:180, // width:180,
sortable:false, sortable: false,
}, },
{ {
label:'状态', label: '状态',
sortable:false, sortable: false,
prop:'state_name', prop: 'state_name',
width:120 width: 120
}], }
],
dateMonth: "", dateMonth: "",
year: "", year: "",
col: '', col: '',
@ -220,12 +285,18 @@
}, },
watch: {}, watch: {},
methods: { methods: {
async getList(){ async getList() {
let res = await getList(this.select) let res = await getList(this.select)
console.log(res) console.log(res)
this.data = res.data this.data = res.data
this.total = res.total this.total = res.total
}, },
async getFinList() {
let res = await getfinlist(this.finselect)
console.log(res)
this.findata = res.data
this.fintotal = res.total
},
async loadData() { async loadData() {
await getCounts({ await getCounts({
date: this.dateMonth date: this.dateMonth
@ -332,9 +403,10 @@
this.year = this.$moment().format("YYYY"); this.year = this.$moment().format("YYYY");
//this.loadData(); //this.loadData();
//this.getCharData(); //this.getCharData();
this.getList()
this.getFinList()
}, },
mounted() { mounted() {
this.getList()
}, },
destroyed() { destroyed() {

@ -22,6 +22,8 @@
<el-input size="mini" placeholder="请输入关键词" v-model="select.keyword" style="width: 160px;margin-right: 10px;"></el-input> <el-input size="mini" placeholder="请输入关键词" v-model="select.keyword" style="width: 160px;margin-right: 10px;"></el-input>
<el-button size="medium" type="primary" @click="getList" style="margin-left: 10px">查询</el-button> <el-button size="medium" type="primary" @click="getList" style="margin-left: 10px">查询</el-button>
<el-button size="medium" type="primary" @click="downloadExel" style="margin-left: 10px">导出</el-button>
</div> </div>
</slot> </slot>
</LxHeader> </LxHeader>
@ -57,6 +59,9 @@ import operate from '@/views/order/component/operate.vue'
import LxHeader from '@/components/LxHeader/index.vue' import LxHeader from '@/components/LxHeader/index.vue'
import {getList,log} from '@/api/order' import {getList,log} from '@/api/order'
import {
download
} from '@/utils/downloadRequest'
export default { export default {
components: { components: {
LxHeader, LxHeader,
@ -299,6 +304,17 @@ export default {
console.log(res) console.log(res)
this.data = res.data this.data = res.data
this.total = res.total this.total = res.total
},
downloadExel() {
download(
'/api/merchant/order/get-list',
'get', {
is_export: 1,
...this.select
},
'订单列表.xlsx')
} }
}, },
computed: {}, computed: {},

Loading…
Cancel
Save