提交 e1d3ee78 authored 作者: 王鹏飞's avatar 王鹏飞

调整发票列表和支付列表中的列宽和样式

上级 19bfba02
......@@ -20,7 +20,7 @@ export default {
</script>
<style lang="scss">
.app-breadcrumb {
padding: 18px 0 32px;
padding: 10px 0 22px;
.el-breadcrumb {
font-size: 20px;
......
......@@ -225,7 +225,7 @@ export default {
columns: [
{ type: 'selection', align: 'center', minWidth: '200px', fixed: 'left' },
{ label: '发票代码', prop: 'invoice_daima', align: 'center', minWidth: '150px' },
{ label: '发票号码', prop: 'invoice_haoma', align: 'center', minWidth: '150px' },
{ label: '发票号码', prop: 'invoice_haoma', align: 'center', minWidth: '160px' },
{ label: '客户姓名', prop: 'name', align: 'center', minWidth: '200px' },
{ label: '客户编号', prop: 'customer_id', align: 'center', minWidth: '200px' },
{ label: '订单编号', prop: 'payment_id', align: 'center', minWidth: '300px' },
......@@ -241,7 +241,7 @@ export default {
{ label: '开票类型', prop: 'invoiceColorTypeViewName', align: 'center', minWidth: '100px' },
{ label: '原发票号码', prop: 'old_invoice_haoma', align: 'center', minWidth: '150px' },
{ label: '原发票代码', prop: 'old_invoice_daima', align: 'center', minWidth: '150px' },
{ label: '纳税人名称', prop: 'taxpayer_name', align: 'center', minWidth: '100px' },
{ label: '纳税人名称', prop: 'taxpayer_name', align: 'center', minWidth: '200px' },
{ label: '纳税人识别号', prop: 'taxpayer_identifier', align: 'center', minWidth: '200px' },
{ label: '地址', prop: 'taxpayer_address', align: 'center', minWidth: '200px' },
{ label: '电话', prop: 'taxpayer_mobile', align: 'center', minWidth: '100px' },
......
......@@ -18,8 +18,7 @@
end-placeholder="结束日期"
value-format="yyyy-MM-dd"
size="small"
style="width: 360px"
>
style="width: 360px">
</el-date-picker>
</template>
<!-- 末次缴费时间 -->
......@@ -32,8 +31,7 @@
end-placeholder="结束日期"
value-format="yyyy-MM-dd"
size="small"
style="width: 360px"
>
style="width: 360px">
</el-date-picker>
</template>
<!-- 状态 -->
......@@ -43,8 +41,7 @@
active-value="1"
inactive-value="2"
@change="handleStatus(row)"
:disabled="row.refund_time !== null"
></el-switch>
:disabled="row.refund_time !== null"></el-switch>
</template>
<!-- 操作 -->
<template v-slot:table-x="{ row }">
......@@ -79,8 +76,7 @@
:id="id"
@close="ticketVisible = false"
@createTicket="handleCreateTicket"
:row="row"
/>
:row="row" />
<el-drawer
size="30%"
title="历史开票信息"
......@@ -89,8 +85,7 @@
append-to-body
:destroy-on-close="true"
center
:modal="false"
>
:modal="false">
<History v-if="historyVisible" :hasSearch="true" @select="handleSelect" />
</el-drawer>
</el-drawer>
......@@ -129,13 +124,13 @@ export default {
invoice_type: [], // 发票类型
confirm_status: [], // 确认状态
taxpayer_type: [], // 纳税人类型
invoice_color_type: [] // 发票开票状态
invoice_color_type: [], // 发票开票状态
},
disabledTicketVisible: false, // 发票状态弹框
ticketVisible: false, // 开具发票
codeVisible: false, // 发票二维码
multipleSelection: [],
payDetailList: {} // 支付详情列表invoice_type
payDetailList: {}, // 支付详情列表invoice_type
}
},
computed: {
......@@ -163,16 +158,16 @@ export default {
sort: '',
related_id: '',
class_name: '',
product_name: ''
product_name: '',
},
beforeRequest: this.beforeRequest
beforeRequest: this.beforeRequest,
},
filters: [
// 客户姓名
{
type: 'input',
prop: 'product_name',
placeholder: '产品名称'
placeholder: '产品名称',
},
// 项目
{
......@@ -183,13 +178,13 @@ export default {
valueKey: 'project_id',
placeholder: '项目',
filterable: true,
remote: true
remote: true,
},
// 客户姓名
{
type: 'input',
prop: 'name',
placeholder: '客户姓名'
placeholder: '客户姓名',
},
// 渠道
{
......@@ -200,7 +195,7 @@ export default {
valueKey: 'channel_id',
placeholder: ' 渠道',
filterable: true,
remote: true
remote: true,
},
// 申请状态
{
......@@ -211,7 +206,7 @@ export default {
valueKey: 'key',
multiple: true,
allowCreate: true,
placeholder: '支付状态'
placeholder: '支付状态',
},
// 费用类型
{
......@@ -222,7 +217,7 @@ export default {
valueKey: 'key',
multiple: true,
allowCreate: true,
placeholder: '费用类型'
placeholder: '费用类型',
},
// 发票状态
{
......@@ -233,20 +228,20 @@ export default {
valueKey: 'key',
placeholder: '发票状态',
filterable: true,
remote: true
remote: true,
},
// 交易流水号
{
type: 'input',
prop: 'related_id',
placeholder: '交易流水号'
placeholder: '交易流水号',
},
{
type: 'select',
options: this.conditionList.classes,
prop: 'class_name',
placeholder: '班级名称'
}
placeholder: '班级名称',
},
],
moreFilters: [
{
......@@ -258,30 +253,31 @@ export default {
labelKey: 'user_name',
valueKey: 'user_id',
filterable: true,
remote: true
remote: true,
},
{
label: '允许开具发票',
prop: 'can_add_invoice',
slots: 'can_add_invoice'
slots: 'can_add_invoice',
},
{
label: '首次缴费时间',
prop: 'first_payment_time',
slots: 'firstDate'
slots: 'firstDate',
},
{
label: '末次缴费时间',
prop: 'final_payment_time',
slots: 'lastDate'
}
slots: 'lastDate',
},
],
columnsOptions: { key: 'payments' },
height: 'calc(100vh - 400px)',
columns: [
{ type: 'selection', minWidth: '50px', fixed: 'left' },
{ label: '客户名称', prop: 'name', minWidth: 150 },
{ label: '客户名称', prop: 'name', minWidth: 90, fixed: 'left' },
{ label: '项目', prop: 'project_id_name', align: 'center', minWidth: 150 },
{ label: '产品名称', prop: 'product_name', align: 'center', minWidth: 100 },
{ label: '产品名称', prop: 'product_name', align: 'center', minWidth: 300 },
{ label: '支付状态', prop: 'payment_status_name', align: 'center', minWidth: 100 },
{ label: '费用类型', prop: 'type_name', align: 'center', minWidth: 100 },
{
......@@ -296,7 +292,7 @@ export default {
} else {
return row.first_payment_time
}
}
},
},
{
label: '末次缴费时间',
......@@ -310,7 +306,7 @@ export default {
} else {
return row.final_payment_time
}
}
},
},
{ label: '应缴金额', prop: 'bill_total', align: 'center', minWidth: 100 },
{ label: '实缴金额', prop: 'amount_need_to_pay', align: 'center', minWidth: 100 },
......@@ -345,7 +341,7 @@ export default {
}
} else {
if (row.secondary_service_charge_ratio) {
const radio = JSON.parse(row.secondary_service_charge_ratio).map(item => {
const radio = JSON.parse(row.secondary_service_charge_ratio).map((item) => {
item.ratio = '范围从' + item.start + '到' + item.end + '的比例为 ' + item.value + '%'
return item.ratio
})
......@@ -355,29 +351,29 @@ export default {
} else if (row.secondary_service_fee_rules_type === '' || row.secondary_service_fee_rules_type === '0') {
return row.secondary_service_charge_ratio
}
}
},
},
{
label: '二级渠道不含税销售金额',
prop: 'secondary_sales_amount_excluding_tax',
align: 'center',
minWidth: 300
minWidth: 300,
},
{
label: '二级渠道渠道代理费提基数',
prop: 'secondary_channel_agent_fee_base',
align: 'center',
minWidth: 300
minWidth: 300,
},
{ label: '二级渠道代理服务费', prop: 'secondary_agency_service_fee', align: 'center', minWidth: 200 },
{
label: '二级渠道代理服务费(不含税金额)',
prop: 'secondary_agency_service_fee_excluding_tax',
align: 'center',
minWidth: 300
minWidth: 300,
},
{ label: '二级渠道渠道税率', prop: 'secondary_channel_tax_rate', align: 'center', minWidth: 200 },
{ label: '二级渠道户名', prop: 'secondary_channel_account_name', align: 'center', minWidth: 100 },
{ label: '二级渠道户名', prop: 'secondary_channel_account_name', align: 'center', minWidth: 200 },
{ label: '二级渠道账号', prop: 'secondary_channel_account', align: 'center', minWidth: 100 },
{ label: '二级渠道开户行', prop: 'secondary_channel_bank_of_deposit', align: 'center', minWidth: 200 },
......@@ -400,7 +396,7 @@ export default {
}
} else {
if (row.service_charge_ratio) {
const radio = JSON.parse(row.service_charge_ratio).map(item => {
const radio = JSON.parse(row.service_charge_ratio).map((item) => {
item.ratio = '范围从' + item.start + '到' + item.end + '的比例为 ' + item.value + '%'
return item.ratio
})
......@@ -410,7 +406,7 @@ export default {
} else if (row.service_fee_rules_type === '' || row.service_fee_rules_type === '0') {
return row.service_charge_ratio
}
}
},
},
{ label: '不含税销售金额', prop: 'sales_amount_excluding_tax', align: 'center', minWidth: 150 },
{ label: '渠道代理提基数', prop: 'channel_agent_fee_base', align: 'center', minWidth: 150 },
......@@ -419,7 +415,7 @@ export default {
label: '代理服务费(不含税金额)',
prop: 'agency_service_fee_excluding_tax',
align: 'center',
minWidth: 300
minWidth: 200,
},
{ label: '渠道税率', prop: 'channel_tax_rate', align: 'center', minWidth: 100 },
{ label: '户名', prop: 'channel_account_name', align: 'center', minWidth: 100 },
......@@ -431,10 +427,10 @@ export default {
prop: 'bill_customer_class_start_time',
align: 'center',
minWidth: 200,
sortable: 'custom'
sortable: 'custom',
},
{ label: '学制期限', prop: 'bill_customer_class_length_of_schooling', align: 'center', minWidth: 100 },
{ label: '客户编号', prop: 'customer_id', align: 'center', minWidth: 300 },
{ label: '客户编号', prop: 'customer_id', align: 'center', minWidth: 200 },
{
label: '退费状态',
prop: 'refund_time',
......@@ -442,27 +438,27 @@ export default {
minWidth: 100,
computed({ row }) {
return row.refund_time === null ? '未退费' : '已退费'
}
},
},
{
label: '发票状态',
prop: 'invoice_status_name',
align: 'center',
minWidth: 100
minWidth: 100,
},
{
label: '发票申请日期',
prop: 'invoice_application_time',
align: 'center',
minWidth: 200,
sortable: 'custom'
minWidth: 140,
sortable: 'custom',
},
{ label: '允许开具发票', prop: 'can_add_invoice', slots: 'status', align: 'center', minWidth: 200 },
{ label: '操作', slots: 'table-x', align: 'center', minWidth: 300, fixed: 'right' }
]
}
{ label: '允许开具发票', prop: 'can_add_invoice', slots: 'status', align: 'center', minWidth: 100 },
{ label: '操作', slots: 'table-x', align: 'center', minWidth: 260, fixed: 'right' },
],
}
},
},
created() {
window.localStorage.getItem('customColumns')
this.fetchCondition() // 获取过滤条件
......@@ -503,7 +499,7 @@ export default {
this.$confirm('确定要作废此发票吗?作废后不可恢复,注意:开具的纸质发票需要您登录税控服务器上作废', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
type: 'warning',
}).then(() => {
this.fetchDisabled(row)
})
......@@ -527,7 +523,7 @@ export default {
},
// 获取过滤条件
fetchCondition() {
getCondition().then(res => {
getCondition().then((res) => {
this.conditionList = res.data
})
},
......@@ -552,7 +548,7 @@ export default {
this.$message.success('更新状态成功')
this.$refs.list.refetch() // 刷新订单列表
})
.catch(error => {
.catch((error) => {
this.$message.error(error.message)
})
},
......@@ -564,7 +560,7 @@ export default {
this.$message.success('发票已作废')
this.$refs.list.refetch() // 刷新订单列表
})
.catch(error => {
.catch((error) => {
this.$message.error(error.message)
})
},
......@@ -574,7 +570,7 @@ export default {
this.$confirm('您确定要退费吗?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
type: 'warning',
}).then(() => {
this.fetchDrawBack(row)
})
......@@ -587,22 +583,22 @@ export default {
this.$refs.list.refetch() // 刷新订单列表
this.$message.success('退费成功')
})
.catch(error => {
.catch((error) => {
this.$message.error(error.message)
})
},
// 导出
exportSelect() {
const list = this.tableOptions.columns.filter(item => {
const list = this.tableOptions.columns.filter((item) => {
return item.prop && item.prop !== 'head_img'
})
const headList = list.map(item => item.label)
const propList = list.map(item => item.prop)
const headList = list.map((item) => item.label)
const propList = list.map((item) => item.prop)
const excelList = []
excelList.push(headList)
this.multipleSelection.forEach(item => {
this.multipleSelection.forEach((item) => {
const rowValArr = []
propList.forEach(key => {
propList.forEach((key) => {
let val = item[key]
if (key === 'can_add_invoice') val = val === '1' ? '允许' : '不允许'
if (key === 'refund_time') val = val === null ? '' : '已退费'
......@@ -642,7 +638,7 @@ export default {
{ wpx: 200 },
{ wpx: 200 },
{ wpx: 200 },
{ wpx: 200 }
{ wpx: 200 },
]
const wb = XLSX.utils.book_new()
wb.SheetNames.push('Worksheet')
......@@ -654,7 +650,7 @@ export default {
},
// 导出全部
exportAll() {
Object.keys(this.tableOptions.remote.params).forEach(key => {
Object.keys(this.tableOptions.remote.params).forEach((key) => {
if (this.tableOptions.remote.params[key] === '') delete this.tableOptions.remote.params[key]
})
const params = queryString.stringify(this.tableOptions.remote.params)
......@@ -673,7 +669,7 @@ export default {
this.tableOptions.remote.params.sort = columns.prop
}
this.$refs.list.refetch()
}
}
},
},
}
</script>
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论