4 changed files with 113 additions and 198 deletions
@ -1,160 +0,0 @@ |
|||||
<template> |
|
||||
<div class="main-content12"> |
|
||||
<!-- page header --> |
|
||||
<div class="pageheader"> |
|
||||
<span class="pagetitle">OCPC订单</span> |
|
||||
</div> |
|
||||
|
|
||||
<!-- page content --> |
|
||||
<div class="elementWrap"> |
|
||||
<div> |
|
||||
<el-form> |
|
||||
<div class="flex"> |
|
||||
<GuipInput :label="`ID：`" v-model="searchSaleid" @blur="changeSearchSaleid()" placeholder="" ref="GuipInput" class="searchId" /> |
|
||||
|
|
||||
<GuipSelect label="站点" v-model="searchUid" :options="siteList" valueKey="uid" labelKey="name" @change="changeSearchSite()" defaultValue="" placeholder="不限" clearable class="searchSite" /> |
|
||||
</div> |
|
||||
|
|
||||
<GuipTable :tableData="orderList" ref="multipleTable" autoColumn="true" :loading="tableLoading"> |
|
||||
<el-table-column prop="sitename" label="站点"></el-table-column> |
|
||||
<el-table-column prop="sale_id" label="ID"></el-table-column> |
|
||||
<el-table-column prop="ocpc_type" label="渠道"></el-table-column> |
|
||||
<el-table-column prop="type_desc" label="类型"></el-table-column> |
|
||||
<el-table-column prop="money" label="销售金额"></el-table-column> |
|
||||
<el-table-column prop="sale_date" label="销售日期"></el-table-column> |
|
||||
</GuipTable> |
|
||||
<el-pagination background @size-change='handleSizeChange' @current-change='handleCurrentChange' |
|
||||
:current-page="orderListCurrentPage" |
|
||||
:page-size="orderListPageSize" |
|
||||
:total="orderListTotal" |
|
||||
layout="prev, pager, next,jumper"> |
|
||||
</el-pagination> |
|
||||
</el-form> |
|
||||
</div> |
|
||||
</div> |
|
||||
</div> |
|
||||
</template> |
|
||||
|
|
||||
<script> |
|
||||
|
|
||||
import GuipTable from '@/components/GuipTable.vue'; |
|
||||
import GuipSelect from '@/components/GuipSelect.vue'; |
|
||||
import GuipInput from '@/components/GuipInput.vue'; |
|
||||
|
|
||||
export default { |
|
||||
name: 'siteList', |
|
||||
components: { |
|
||||
GuipTable, |
|
||||
GuipSelect, |
|
||||
GuipInput, |
|
||||
}, |
|
||||
data() { |
|
||||
return { |
|
||||
// AUTH |
|
||||
token: 'eyJ0eXAiOiJKV1QiLCJhbGciOiJIUzI1NiJ9.eyJpYXQiOjE3NTI2NDY1NDUsIm5iZiI6MTc1MjY0NjU0NSwiZXhwIjoxNzU1MjM4NTQ1LCJ1c2VyIjoic3VidXNlciIsImxvZ2luX3R5cGUiOjAsImFpZCI6IjEifQ.G-Is-x9qPMiV_urOlDPQVRjfAIozySxL5EK2k82d46k', |
|
||||
// 表格加载 |
|
||||
tableLoading: true, |
|
||||
// 订单列表 |
|
||||
orderList: [], |
|
||||
orderListTotal: 0, |
|
||||
orderListCurrentPage: 1, |
|
||||
orderListPageSize: 20, |
|
||||
|
|
||||
siteList: [], |
|
||||
|
|
||||
searchUid: 0, |
|
||||
searchSaleid: 0, |
|
||||
} |
|
||||
}, |
|
||||
mounted() { |
|
||||
this.getOcpcList() |
|
||||
}, |
|
||||
methods: { |
|
||||
getOcpcList() { |
|
||||
this.tableLoading = true |
|
||||
const that = this |
|
||||
that.orderList = [] |
|
||||
this.$http('POST', '/agentnew/ajax_get_ocpc_order_list', { |
|
||||
page: this.orderListCurrentPage, |
|
||||
pagesize: this.orderListPageSize, |
|
||||
uid: this.searchUid, |
|
||||
saleid: this.searchSaleid, |
|
||||
},{ |
|
||||
headers:{ |
|
||||
'Auth': this.token |
|
||||
} |
|
||||
}).then(response => { |
|
||||
this.tableLoading = false |
|
||||
this.$nextTick(() => { |
|
||||
that.orderList = response.data.list |
|
||||
this.orderListTotal = response.data.total |
|
||||
this.siteList = response.data.sitelist |
|
||||
}) |
|
||||
}).catch(error => { |
|
||||
console.error(error, 'error') |
|
||||
}) |
|
||||
}, |
|
||||
handleSizeChange(val) { |
|
||||
this.orderListPageSize = val |
|
||||
this.getOcpcList() |
|
||||
}, |
|
||||
handleCurrentChange(val) { |
|
||||
this.orderListCurrentPage = val |
|
||||
this.getOcpcList() |
|
||||
}, |
|
||||
changeSearchSite() { |
|
||||
console.log(this.searchUid) |
|
||||
this.getOcpcList() |
|
||||
}, |
|
||||
changeSearchSaleid() { |
|
||||
console.log(this.searchSaleid) |
|
||||
this.getOcpcList() |
|
||||
}, |
|
||||
}, |
|
||||
computed: { |
|
||||
|
|
||||
}, |
|
||||
} |
|
||||
</script> |
|
||||
<style lang="scss" scoped> |
|
||||
.pageheader { |
|
||||
display: flex; |
|
||||
justify-content: space-between; |
|
||||
/* 关键属性 */ |
|
||||
align-items: center; |
|
||||
margin: 0px 0px 16px 0px; |
|
||||
} |
|
||||
|
|
||||
.pagetitle { |
|
||||
font-size: 16px; |
|
||||
font-weight: bold; |
|
||||
line-height: normal; |
|
||||
letter-spacing: 0.08em; |
|
||||
color: #1E2226; |
|
||||
margin-top: 8px; |
|
||||
} |
|
||||
|
|
||||
.elementWrap { |
|
||||
padding: 32px 36px; |
|
||||
background: #fff; |
|
||||
} |
|
||||
|
|
||||
.searchId { |
|
||||
margin-right: 24px; |
|
||||
width: 200px; |
|
||||
} |
|
||||
|
|
||||
.searchSite { |
|
||||
width: 300px; |
|
||||
} |
|
||||
|
|
||||
::v-deep .custom-popover { |
|
||||
position: fixed !important; |
|
||||
// max-height: 290px; |
|
||||
// overflow-y: auto; |
|
||||
margin-top: 0 !important; |
|
||||
margin-left: 0 !important; |
|
||||
transform: none !important; |
|
||||
} |
|
||||
|
|
||||
</style> |
|
||||
Loading…
Reference in new issue