提交 68e8aad1 authored 作者: lihuihui's avatar lihuihui

Merge branch 'master' of https://gitlab.ezijing.com/webapp/finance-admin

# Conflicts: # src/components/base/AppList.vue # src/components/layout/Main.vue
This source diff could not be displayed because it is too large. You can view the blob instead.
......@@ -34,19 +34,22 @@
<el-form-item class="filter-buttons">
<el-button type="primary" icon="el-icon-search" @click="search">搜索</el-button>
<el-button icon="el-icon-refresh-left" @click="reset">重置</el-button>
<el-button @click="showMoreFilter" v-if="hasMoreFilter">更多筛选</el-button>
</el-form-item>
</el-form>
</div>
<div class="table-list-hd-aside"><slot name="header-aside" /></div>
</div>
<slot></slot>
<!-- 主体 -->
<div class="table-list-bd">
<slot name="body" v-bind="{ data: dataList }">
<el-table
:data="dataList"
v-loading="loading"
v-bind="$attrs"
v-on="$listeners"
style="width: 100%; height: 100%"
style="height: 100%"
ref="table"
>
<template v-for="item in columns">
......@@ -58,9 +61,11 @@
</el-table-column>
</template>
</el-table>
</slot>
</div>
<!-- 底部 -->
<div class="table-list-ft">
<div>
<div style="padding: 10px 0">
<slot name="footer"></slot>
</div>
<el-pagination
......@@ -77,6 +82,46 @@
>
</el-pagination>
</div>
<!-- 更多筛选 -->
<el-drawer title="更多筛选" :visible.sync="moreFilterVisible" ref="drawer">
<div class="more-filter-drawer">
<div class="more-filter">
<el-form :model="params" ref="moreFilterForm">
<template v-for="item in moreFilters">
<el-form-item :label="item.label" :prop="item.prop" :key="item.prop">
<template v-if="item.slots">
<slot :name="item.slots" v-bind="{ params }"></slot>
</template>
<template v-else>
<!-- input -->
<el-input v-model="params[item.prop]" v-bind="item" clearable v-if="item.type === 'input'" />
<!-- select -->
<el-select
v-model="params[item.prop]"
clearable
v-bind="item"
v-if="item.type === 'select'"
style="width: 100%"
>
<template v-for="(option, index) in item.options">
<el-option
:label="option[item.labelKey] || option.label"
:value="option[item.valueKey] || option.value"
:key="index"
></el-option>
</template>
</el-select>
</template>
</el-form-item>
</template>
</el-form>
</div>
<div class="more-filter-buttons">
<el-button @click="cancelMoreFilter">取 消</el-button>
<el-button type="primary" @click="primaryMoreFilter">确定</el-button>
</div>
</div>
</el-drawer>
</div>
</template>
......@@ -88,6 +133,8 @@ export default {
remote: { type: Object, default: () => ({}) },
// 筛选
filters: { type: Array, default: () => [] },
// 更多筛选
moreFilters: { type: Array, default: () => [] },
// 列表项
columns: { type: Array, default: () => [] },
// 列表数据
......@@ -102,7 +149,8 @@ export default {
loading: false,
params: this.remote.params || {},
dataList: this.data,
page: { total: 0, size: this.limit, currentPage: 1 }
page: { total: 0, size: this.limit, currentPage: 1 },
moreFilterVisible: false
}
},
watch: {
......@@ -122,6 +170,9 @@ export default {
computed: {
table() {
return this.$refs.table
},
hasMoreFilter() {
return !!this.moreFilters.length
}
},
methods: {
......@@ -175,6 +226,8 @@ export default {
reset() {
// 清空筛选条件
this.$refs.filterForm && this.$refs.filterForm.resetFields()
// 清空更多筛选条件
this.hasMoreFilter && this.$refs.moreFilterForm && this.$refs.moreFilterForm.resetFields()
// 初始化页码
this.page.currentPage = 1
// 刷新列表
......@@ -192,6 +245,21 @@ export default {
},
visible(item) {
return Object.prototype.hasOwnProperty.call(item, 'visible') ? item.visible : true
},
// 显示更多筛选
showMoreFilter() {
this.moreFilterVisible = true
},
// 取消更多筛选
cancelMoreFilter() {
this.moreFilterVisible = false
// 清空筛选条件
this.$refs.moreFilterForm && this.$refs.moreFilterForm.resetFields()
},
// 确定更多筛选
primaryMoreFilter() {
this.moreFilterVisible = false
this.search()
}
},
beforeMount() {
......@@ -228,4 +296,21 @@ export default {
.el-table-column--selection .cell {
padding: 0 14px !important;
}
.more-filter-drawer {
height: 100%;
display: flex;
flex-direction: column;
padding: 0 20px 20px;
box-sizing: border-box;
}
.more-filter {
flex: 1;
overflow-y: auto;
}
.more-filter-buttons {
display: flex;
.el-button {
flex: 1;
}
}
</style>
......@@ -28,7 +28,6 @@ export default {
position: relative;
flex: 1;
padding: 24px;
box-sizing: border-box;
overflow: hidden;
}
.app-main-inner {
......
import httpRequest from '@/utils/axios'
/**
* 获取商品列表
* 获取渠道列表
*/
export function getGoodsList(data) {
return httpRequest.post('/api/shop/commodity/spu/search', data).then({})
export function getChannelList(params) {
// return httpRequest.get('/api/finance/v1/channels/list', { params })
return new Promise((resolve, reject) => {
resolve({
data: [
{ channel_code: '渠道编码1', channel_name: '渠道名称1' },
{ channel_code: '渠道编码2', channel_name: '渠道名称2' },
{ channel_code: '渠道编码3', channel_name: '渠道名称3' }
]
})
})
}
/**
* 获取渠道详情
*/
export function getChannel(params) {
return httpRequest.get('/api/finance/v1/channels/details', { params })
}
/**
* 获取渠道列表
*/
export function changeChanelStatus(data) {
return httpRequest.post('/api/finance/v1/channels/confirm', data)
}
<template>
<app-card>
<app-list v-bind="tableOptions" ref="list" @selection-change="handleSelectionChange">
<template v-slot:table-x="{ row }">
<router-link :to="{ name: 'invoiceView', params: { id: row.id } }">
<el-button type="text">查看</el-button>
</router-link>
<template #table-x="{ row }">
<el-button type="text" @click="handleChangeStatus(row)">审核</el-button>
<el-button type="text" @click="handleChangeStatus(row)">驳回</el-button>
</template>
<template #footer>
已选中{{ selectionLength }}
<el-button type="primary" size="small" @click="handleExport">导出</el-button>
</template>
</app-list>
</app-card>
......@@ -15,111 +18,94 @@
import AppList from '@/components/base/AppList.vue'
import AppCard from '@/components/base/AppCard.vue'
// 接口
// import { getGoodsList } from '../api'
import { getChannelList } from '../api'
export default {
components: { AppCard, AppList },
data() {
return {}
return {
// 已选中的数据
multipleSelection: []
}
},
computed: {
// 列表配置
tableOptions() {
return {
// remote: {
// httpRequest: getGoodsList,
// params: { shop_id: this.shopId, spu_id: '', spu_name: '', group_id: '', price_min: '', price_max: '' },
// beforeRequest: this.beforeRequest
// },
filters: [
{
type: 'select',
prop: 'group_id',
options: this.groupList,
labelKey: 'group_name',
valueKey: 'group_id',
placeholder: '项目'
},
{
type: 'input',
prop: 'spu_name',
placeholder: '客户姓名'
remote: {
httpRequest: getChannelList,
params: { channel_code: '', channel_status: '', channel_type: '', contract_code: '', contract_status: '' }
},
filters: [
{
type: 'input',
prop: 'spu_name',
placeholder: '手机号码'
prop: 'channel_code',
placeholder: '渠道编码'
},
{
type: 'select',
prop: 'group_id',
options: this.groupList,
labelKey: 'group_name',
valueKey: 'group_id',
placeholder: '发票状态'
prop: 'channel_status',
options: [
{ label: '待审核', value: '1' },
{ label: '已审核', value: '2' }
],
placeholder: '渠道状态'
},
{
type: 'select',
prop: 'group_id',
options: this.groupList,
labelKey: 'group_name',
valueKey: 'group_id',
placeholder: '发票类型'
}
prop: 'channel_type',
options: [
{ label: '线上', value: '1' },
{ label: '线下', value: '2' }
],
columns: [
{ label: '发票代码', prop: 'date', minWidth: 140 },
{ label: '发票号码', prop: 'name', align: 'center', minWidth: 140 },
{ label: '地址', prop: 'address', minWidth: 120 },
{ label: '操作', slots: 'table-x', align: 'right', width: 150 }
placeholder: '渠道类型'
}
],
data: [
moreFilters: [
{
id: '1',
date: '2016-05-02',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
},
{
id: '2',
date: '2016-05-04',
name: '王小虎',
address: '上海市普陀区金沙江路 1517 弄'
},
{
id: '3',
date: '2016-05-01',
name: '王小虎',
address: '上海市普陀区金沙江路 1519 弄'
label: '合同编码',
type: 'input',
prop: 'contract_code',
placeholder: '合同编码'
},
{
id: '4',
date: '2016-05-03',
name: '王小虎',
address: '上海市普陀区金沙江路 1516 弄'
}
label: '合同状态',
type: 'select',
prop: 'contract_status',
options: [
{ label: '未上传', value: '1' },
{ label: '已上传', value: '2' }
]
}
],
columns: [
{ type: 'selection', width: '55' },
{ type: 'index', label: '序号', width: '50', align: 'center' },
{ label: '渠道编码', prop: 'channel_code' },
{ label: '渠道名称', prop: 'channel_name' },
{ label: '渠道类型', prop: 'channel_type' },
{ label: '创建人', prop: 'creater' },
{ label: '渠道状态', prop: 'channel_status' },
{ label: '合同状态', prop: 'contract_status' },
{ label: '合同编码', prop: 'contract_code' },
{ label: '更新时间', prop: 'update_date' },
{ label: '操作', slots: 'table-x', align: 'right', width: 120 }
]
}
},
methods: {
beforeRequest(params, isReset) {
// 重置
if (isReset) {
params.price_min = ''
params.price_max = ''
// 已选中多少条数据
selectionLength() {
return this.multipleSelection.length
}
params.status = this.activeName === '0' ? '' : this.activeName
params.price_zone = `${params.price_min || ''},${params.price_max || ''}`
return params
},
// 编辑
handleUpdate(row) {
this.$router.push({ name: 'goodsEdit', params: { id: row.spu_id } })
},
methods: {
// 选择
handleSelectionChange(value) {
this.multipleSelection = value
},
// 导出
handleExport() {
console.log(this.multipleSelection)
}
}
}
......
......@@ -4,7 +4,8 @@ import { Message } from 'element-ui'
const httpRequest = axios.create({
timeout: 60000,
withCredentials: true
withCredentials: true,
headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
})
// 请求拦截
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论