Skip to content

C
center-finance
提交 f0b526a7 authored 作者: lihuihui's avatar lihuihui
浏览文件
操作

feat: 新增发票管理，项目列表

上级 dbf7a586
隐藏空白字符变更
内嵌 并排
正在显示 包含 403 行增加 和 54 行删除
src/components/base/AppList.vue
浏览文件 @ f0b526a7
......@@ -41,7 +41,14 @@
</div>
<slot></slot>
<div class="table-list-bd">
<el-table :data="dataList" v-loading="loading" v-bind="$attrs" v-on="$listeners" style="height: 100%" ref="table">
<el-table
:data="dataList"
v-loading="loading"
v-bind="$attrs"
v-on="$listeners"
style="width: 100%; height: 100%"
ref="table"
>
<template v-for="item in columns">
<el-table-column v-bind="item" :key="item.prop" v-if="visible(item)">
<template v-slot:default="scope" v-if="item.slots || item.computed">
......
src/components/layout/Aside.vue
浏览文件 @ f0b526a7
......@@ -38,6 +38,11 @@ export default {
name: '渠道管理',
path: '/channel',
icon: 'el-icon-box'
},
{
name: '项目列表',
path: '/project',
icon: 'el-icon-box'
}
]
}
......
src/components/layout/Main.vue
浏览文件 @ f0b526a7
......@@ -16,7 +16,10 @@ import AppBreadcrumb from './Breadcrumb.vue'
export default {
name: 'AppMain',
props: { hasBreadcrumb: { type: Boolean, default: true } },
components: { AppBreadcrumb }
components: { AppBreadcrumb },
mounted() {
// document.getElementsByClassName('app-main')[0].style.width = `${document.documentElement.clientWidth - 240}px`
}
}
</script>
......@@ -25,6 +28,8 @@ export default {
position: relative;
flex: 1;
padding: 24px;
box-sizing: border-box;
overflow: hidden;
}
.app-main-inner {
margin: 0 auto;
......
src/modules/invoice/components/DistributionDialog.vue 0 → 100644
浏览文件 @ f0b526a7
<template>
<div>
<el-dialog title="分配票据跟进人" center :visible.sync="visible" :before-close="modalClose">
<el-form :model="form">
<el-form-item label="票据跟进人">
<el-select v-model="form.region" placeholder="请选择活动区域">
<el-option label="区域一" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
</el-select>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="$emit('dialogHide')">取 消</el-button>
<el-button type="primary" @click="$emit('dialogHide')">确 定</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
export default {
props: {
visible: {
type: Boolean,
default: false
}
},
data() {
return {
form: {
name: '',
region: '',
date1: '',
date2: '',
delivery: false,
type: [],
resource: '',
desc: ''
}
}
},
methods: {
modalClose() {
this.$emit('update:visible', false)
}
}
}
</script>
<style lang="scss" scoped>
</style>
src/modules/invoice/views/List.vue
浏览文件 @ f0b526a7
<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>
</app-list>
</app-card>
<div>
<app-card style="max-width: 100%">
<app-list v-bind="tableOptions" ref="list" @selection-change="handleSelectionChange">
<!-- 筛选 -->
<template v-slot:invoice-type="{ params }">
<el-select v-model="params.invoice_type" multiple collapse-tags placeholder="发票类型">
<el-option v-for="item in invoiceTypeOption" :key="item.value" :label="item.label" :value="item.value">
</el-option>
</el-select>
</template>
<el-row>
<el-button type="primary">表头</el-button>
<el-button type="primary">更多筛选</el-button>
<el-button type="primary" @click="isShowdialog = true">分配票据跟进人</el-button>
</el-row>
<template v-slot:billing-type="{ params }">
<el-select v-model="params.billing_type" multiple collapse-tags placeholder="开票类型">
<el-option v-for="item in billingTypeOption" :key="item.value" :label="item.label" :value="item.value">
</el-option>
</el-select>
</template>
<template v-slot:table-x="{ row }">
<router-link :to="{ name: 'invoiceView', params: { id: row.id } }">
<el-button type="text">查看</el-button>
</router-link>
</template>
</app-list>
</app-card>
<distribution-dialog @dialogHide="dialogHide" :visible.sync="isShowdialog"></distribution-dialog>
</div>
</template>
<script>
// 组件
import AppList from '@/components/base/AppList.vue'
import AppCard from '@/components/base/AppCard.vue'
import DistributionDialog from '../components/DistributionDialog.vue'
// 接口
// import { getGoodsList } from '../api'
export default {
components: { AppCard, AppList },
components: { AppCard, AppList, DistributionDialog },
data() {
return {}
return {
invoiceTypeOption: [
{ value: '1', label: '1' },
{ value: '2', label: '2' },
{ value: '3', label: '3' }
],
billingTypeOption: [{ value: '1', label: '1' }],
isShowdialog: false
}
},
computed: {
// 列表配置
......@@ -33,76 +63,99 @@ export default {
// },
filters: [
{
type: 'select',
prop: 'group_id',
options: this.groupList,
labelKey: 'group_name',
valueKey: 'group_id',
placeholder: '项目'
type: 'input',
prop: 'invoice_code',
placeholder: '发票号码'
},
{
type: 'input',
prop: 'spu_name',
prop: 'name',
placeholder: '客户姓名'
},
{
type: 'input',
prop: 'spu_name',
placeholder: '手机号码'
},
{
type: 'select',
prop: 'group_id',
options: this.groupList,
labelKey: 'group_name',
valueKey: 'group_id',
placeholder: '发票状态'
prop: 'flow_num',
placeholder: '交易流水号'
},
{
type: 'select',
prop: 'group_id',
options: this.groupList,
labelKey: 'group_name',
valueKey: 'group_id',
placeholder: '发票类型'
}
{ prop: 'invoice_type', slots: 'invoice-type' },
{ prop: 'billing_type', slots: 'billing-type' }
],
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 }
{ label: '发票代码', prop: 'invoice_code', minWidth: 120 },
{ label: '发票号码', prop: 'invoice_num', minWidth: 120 },
{ label: '客户姓名', prop: 'name', minWidth: 100 },
{ label: '客户编号', prop: 'number', minWidth: 100 },
{ label: '订单编号', prop: 'order', minWidth: 100 },
{ label: '交易流水号', prop: 'data', minWidth: 100 },
{ label: '项目', prop: 'data1', minWidth: 100 },
{ label: '税率', prop: 'data1', minWidth: 100 },
{ label: '税额', prop: 'data1', minWidth: 100 },
{ label: '不含税金额', prop: 'data1', minWidth: 100 },
{ label: '含税金额', prop: 'data1', minWidth: 100 },
{ label: '缴费时间', prop: 'data1', minWidth: 100 },
{ label: '发票类型', prop: 'data1', minWidth: 100 },
{ label: '抬头类型', prop: 'data1', minWidth: 100 },
{ label: '开票类型', prop: 'data1', minWidth: 100 },
{ label: '原发票号码', prop: 'data1', minWidth: 100 },
{ label: '原发票代码', prop: 'data1', minWidth: 100 },
{ label: '纳税人名称', prop: 'data1', minWidth: 100 },
{ label: '纳税人识别号', prop: 'data1', minWidth: 100 },
{ label: '地址', prop: 'data1', minWidth: 100 },
{ label: '电话', prop: 'data1', minWidth: 100 },
{ label: '开户行', prop: 'data1', minWidth: 100 },
{ label: '银行账号', prop: 'data1', minWidth: 100 },
{ label: '备注', prop: 'data1', minWidth: 100 },
{ label: '邮寄地址', prop: 'data1', minWidth: 100 },
{ label: '收件人姓名', prop: 'data1', minWidth: 100 },
{ label: '收件人手机号', prop: 'data1', minWidth: 100 },
{ label: '邮箱地址', prop: 'data1', minWidth: 100 },
{ label: '票据跟进人', prop: 'data1', minWidth: 100 },
{ label: '发票申请日期', prop: 'data1', minWidth: 100 },
{ label: '开票时间', prop: 'data1', minWidth: 100 },
{ label: '开票状态', prop: 'data1', minWidth: 100 },
{ label: '操作', slots: 'table-x', align: 'center', width: 150, fixed: 'right' }
],
data: [
{
id: '1',
date: '2016-05-02',
invoice_code: '1',
invoice_num: '2016-05-02',
data1: '2016-05-02',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄'
address: '上海市普陀区金沙江路 1518 弄',
order: '99832459873849'
},
{
id: '2',
date: '2016-05-04',
invoice_code: '2',
invoice_num: '2016-05-04',
data1: '2016-05-02',
name: '王小虎',
address: '上海市普陀区金沙江路 1517 弄'
address: '上海市普陀区金沙江路 1517 弄',
order: '99832459873849'
},
{
id: '3',
date: '2016-05-01',
invoice_code: '3',
invoice_num: '2016-05-01',
data1: '2016-05-02',
name: '王小虎',
address: '上海市普陀区金沙江路 1519 弄'
address: '上海市普陀区金沙江路 1519 弄',
order: '99832459873849'
},
{
id: '4',
date: '2016-05-03',
invoice_code: '4',
invoice_num: '2016-05-03',
data1: '2016-05-02',
name: '王小虎',
address: '上海市普陀区金沙江路 1516 弄'
address: '上海市普陀区金沙江路 1516 弄',
order: '99832459873849'
}
]
}
}
},
methods: {
dialogHide() {
this.isShowdialog = false
},
beforeRequest(params, isReset) {
// 重置
if (isReset) {
......
src/modules/project/api.js 0 → 100644
浏览文件 @ f0b526a7
import httpRequest from '@/utils/axios'
/**
* 获取商品列表
*/
export function getGoodsList(data) {
return httpRequest.post('/api/shop/commodity/spu/search', data).then({})
}
src/modules/project/components/DistributionDialog.vue 0 → 100644
浏览文件 @ f0b526a7
<template>
<div>
<el-dialog title="分配票据跟进人" center :visible.sync="visible" :before-close="modalClose">
<el-form :model="form">
<el-form-item label="票据跟进人">
<el-select v-model="form.region" placeholder="请选择活动区域">
<el-option label="区域一" value="shanghai"></el-option>
<el-option label="区域二" value="beijing"></el-option>
</el-select>
</el-form-item>
</el-form>
<div slot="footer" class="dialog-footer">
<el-button @click="$emit('dialogHide')">取 消</el-button>
<el-button type="primary" @click="$emit('dialogHide')">确 定</el-button>
</div>
</el-dialog>
</div>
</template>
<script>
export default {
props: {
visible: {
type: Boolean,
default: false
}
},
data() {
return {
form: {
name: '',
region: '',
date1: '',
date2: '',
delivery: false,
type: [],
resource: '',
desc: ''
}
}
},
methods: {
modalClose() {
this.$emit('update:visible', false)
}
}
}
</script>
<style lang="scss" scoped>
</style>
src/modules/project/index.js 0 → 100644
浏览文件 @ f0b526a7
const routes = [
{
path: '/project',
component: () => import('@/components/layout/Index.vue'),
meta: { title: '项目列表' },
children: [
{
path: '',
component: () => import('./views/List.vue'),
meta: { title: '发票记录' }
},
{
name: 'invoiceView',
path: 'invoice/:id',
component: () => import('./views/Detail.vue'),
meta: { title: '发票详情' }
}
]
}
]
export { routes }
src/modules/project/views/Detail.vue 0 → 100644
浏览文件 @ f0b526a7
<template>
<div>12312</div>
</template>
<script>
export default {}
</script>
<style></style>
src/modules/project/views/List.vue 0 → 100644
浏览文件 @ f0b526a7
<template>
<div>
<app-card style="max-width: 100%">
<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>
</app-list>
</app-card>
</div>
</template>
<script>
// 组件
import AppList from '@/components/base/AppList.vue'
import AppCard from '@/components/base/AppCard.vue'
// 接口
// import { getGoodsList } from '../api'
export default {
components: { AppCard, AppList },
data() {
return {
invoiceTypeOption: [
{ value: '1', label: '1' },
{ value: '2', label: '2' },
{ value: '3', label: '3' }
],
billingTypeOption: [{ value: '1', label: '1' }]
}
},
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: 'select',
prop: 'group_id2',
options: this.groupList,
labelKey: 'group_name',
valueKey: 'group_id',
placeholder: '请选择'
},
{
type: 'select',
prop: 'group_id3',
options: this.groupList,
labelKey: 'group_name',
valueKey: 'group_id',
placeholder: '请选择'
}
],
columns: [
{ label: '项目编号', prop: 'invoice_code', minWidth: 120 },
{ label: '项目名称', prop: 'invoice_num', minWidth: 120 },
{ label: '显示别名', prop: 'name', minWidth: 100 },
{ label: '项目类型', prop: 'number', minWidth: 100 },
{ label: '状态', prop: 'order', minWidth: 100 },
{ label: '更新时间', prop: 'data', minWidth: 100 }
],
data: [
{
invoice_code: '1',
invoice_num: '2016-05-02',
data1: '2016-05-02',
name: '王小虎',
address: '上海市普陀区金沙江路 1518 弄',
order: '99832459873849'
},
{
invoice_code: '2',
invoice_num: '2016-05-04',
data1: '2016-05-02',
name: '王小虎',
address: '上海市普陀区金沙江路 1517 弄',
order: '99832459873849'
},
{
invoice_code: '3',
invoice_num: '2016-05-01',
data1: '2016-05-02',
name: '王小虎',
address: '上海市普陀区金沙江路 1519 弄',
order: '99832459873849'
},
{
invoice_code: '4',
invoice_num: '2016-05-03',
data1: '2016-05-02',
name: '王小虎',
address: '上海市普陀区金沙江路 1516 弄',
order: '99832459873849'
}
]
}
}
},
methods: {
dialogHide() {
this.isShowdialog = false
},
beforeRequest(params, isReset) {
// 重置
if (isReset) {
params.price_min = ''
params.price_max = ''
}
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 } })
},
// 选择
handleSelectionChange(value) {
this.multipleSelection = value
}
}
}
</script>
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论