|
|
|
@ -38,7 +38,8 @@
|
|
|
|
|
</a-modal>
|
|
|
|
|
<a-modal @cancel="nameFlag = false" width="700px" :visible="nameFlag" title="提取发票备注" @ok="handleRender">
|
|
|
|
|
<a-select v-model:value="tempNameId" style="width: 80%">
|
|
|
|
|
<a-select-option :value="item.id" v-for="(item,index) in tempList" :key="index" >{{ item.name }}</a-select-option>
|
|
|
|
|
<a-select-option :value="item.id" v-for="(item, index) in tempList" :key="index">{{ item.name
|
|
|
|
|
}}</a-select-option>
|
|
|
|
|
</a-select>
|
|
|
|
|
</a-modal>
|
|
|
|
|
</a-spin>
|
|
|
|
@ -48,11 +49,312 @@
|
|
|
|
|
import { ref, onMounted, unref } from 'vue'
|
|
|
|
|
import { BasicForm, useForm } from '/@/components/Form/index'
|
|
|
|
|
import { AutoComplete } from 'ant-design-vue'
|
|
|
|
|
import { detailForm } from '../columns'
|
|
|
|
|
import feeTable from './feeTable.vue';
|
|
|
|
|
import { InvoiceApplicationSave, InvoiceApplicationGet, GetTemplateFields, SaveTemplate, GetTemplateList,RenderTemplate } from '../api'
|
|
|
|
|
import { InvoiceApplicationSave, InvoiceApplicationGet, GetTemplateFields, SaveTemplate, GetTemplateList, RenderTemplate, GetClientBankList, GetOrgList } from '../api'
|
|
|
|
|
import { useMessage } from '/@/hooks/web/useMessage'
|
|
|
|
|
import { useRoute } from 'vue-router'
|
|
|
|
|
import {
|
|
|
|
|
GetControllerClientList, GetCustomerServiceList
|
|
|
|
|
} from '/@/views/operation/seaexport/api/BookingLedger'
|
|
|
|
|
import { GetFeeCurrencySelectList, GetClientListByCode } from '/@/api/common'
|
|
|
|
|
import dayjs from 'dayjs'
|
|
|
|
|
const CategoryData = [
|
|
|
|
|
{ value: 0, label: '普通发票' },
|
|
|
|
|
{ value: 1, label: '电子发票' },
|
|
|
|
|
{ value: 2, label: '纸质发票' },
|
|
|
|
|
]
|
|
|
|
|
const bankList = ref([]) as any
|
|
|
|
|
const customerList = ref([]) as any
|
|
|
|
|
const detailForm = [
|
|
|
|
|
{
|
|
|
|
|
field: 'id',
|
|
|
|
|
label: 'id',
|
|
|
|
|
component: 'Input',
|
|
|
|
|
show: false,
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
field: 'applicationNO',
|
|
|
|
|
label: '申请单号',
|
|
|
|
|
component: 'Input',
|
|
|
|
|
dynamicDisabled: true,
|
|
|
|
|
colProps: { span: 4 },
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
field: 'statusText',
|
|
|
|
|
label: '状态',
|
|
|
|
|
component: 'Input',
|
|
|
|
|
dynamicDisabled: true,
|
|
|
|
|
colProps: { span: 4 },
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
field: 'createByName',
|
|
|
|
|
label: '申请人',
|
|
|
|
|
component: 'Input',
|
|
|
|
|
dynamicDisabled: true,
|
|
|
|
|
colProps: { span: 4 },
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
field: 'applyDate',
|
|
|
|
|
label: '申请开票日期',
|
|
|
|
|
component: 'DatePicker',
|
|
|
|
|
colProps: { span: 4 },
|
|
|
|
|
defaultValue: dayjs().format('YYYY-MM-DD'),
|
|
|
|
|
componentProps: {
|
|
|
|
|
valueFormat: 'YYYY-MM-DD',
|
|
|
|
|
format: 'YYYY-MM-DD',
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
field: 'invoiceNO',
|
|
|
|
|
label: '发票号',
|
|
|
|
|
component: 'Input',
|
|
|
|
|
colProps: { span: 4 },
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
field: 'AcutalInvoiceNO',
|
|
|
|
|
label: '实际发票号',
|
|
|
|
|
dynamicDisabled: true,
|
|
|
|
|
component: 'Input',
|
|
|
|
|
colProps: { span: 4 },
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
field: 'invoiceHeader',
|
|
|
|
|
label: '发票抬头',
|
|
|
|
|
component: 'Input',
|
|
|
|
|
colProps: { span: 12 },
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
field: 'taxID',
|
|
|
|
|
label: '纳税人识别号',
|
|
|
|
|
component: 'Input',
|
|
|
|
|
colProps: { span: 12 },
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
field: 'customerAddTel',
|
|
|
|
|
label: '地址电话',
|
|
|
|
|
component: 'Input',
|
|
|
|
|
colProps: { span: 12 },
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
field: 'customerBank',
|
|
|
|
|
label: '开户行及账号',
|
|
|
|
|
component: 'Input',
|
|
|
|
|
show: false,
|
|
|
|
|
colProps: { span: 12 },
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
field: 'customerBankId',
|
|
|
|
|
label: '开户行及账号',
|
|
|
|
|
colProps: { span: 12 },
|
|
|
|
|
component: 'Select',
|
|
|
|
|
componentProps: ({ formModel }) => {
|
|
|
|
|
return {
|
|
|
|
|
options: bankList.value,
|
|
|
|
|
fieldNames: {
|
|
|
|
|
label: 'name',
|
|
|
|
|
value: 'id',
|
|
|
|
|
},
|
|
|
|
|
onChange: (e, obj) => {
|
|
|
|
|
if (obj) {
|
|
|
|
|
bankList.value.forEach(item => {
|
|
|
|
|
if (item.id == e) {
|
|
|
|
|
formModel.customerBank = item
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
if (!obj && !e) {
|
|
|
|
|
formModel.customerBank = {}
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
field: 'currency',
|
|
|
|
|
label: '币别',
|
|
|
|
|
defaultValue: 'CNY',
|
|
|
|
|
component: 'ApiSelect',
|
|
|
|
|
colProps: { span: 4 },
|
|
|
|
|
componentProps: () => {
|
|
|
|
|
return {
|
|
|
|
|
api: GetFeeCurrencySelectList,
|
|
|
|
|
labelField: 'name',
|
|
|
|
|
valueField: 'codeName',
|
|
|
|
|
resultField: 'data',
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
field: 'category',
|
|
|
|
|
label: '申请类型',
|
|
|
|
|
component: 'Select',
|
|
|
|
|
colProps: { span: 4 },
|
|
|
|
|
componentProps: {
|
|
|
|
|
options: CategoryData,
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
field: 'invoiceCurrency',
|
|
|
|
|
label: '发票币别',
|
|
|
|
|
defaultValue: 'CNY',
|
|
|
|
|
component: 'ApiSelect',
|
|
|
|
|
colProps: { span: 4 },
|
|
|
|
|
componentProps: () => {
|
|
|
|
|
return {
|
|
|
|
|
api: GetFeeCurrencySelectList,
|
|
|
|
|
labelField: 'name',
|
|
|
|
|
valueField: 'codeName',
|
|
|
|
|
resultField: 'data',
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
field: 'customer',
|
|
|
|
|
label: '委托单位',
|
|
|
|
|
component: 'Input',
|
|
|
|
|
show: false,
|
|
|
|
|
colProps: { span: 12 },
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
field: 'customerId',
|
|
|
|
|
label: '委托单位',
|
|
|
|
|
component: 'Input',
|
|
|
|
|
show: false,
|
|
|
|
|
colProps: { span: 12 },
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
label: '委托单位',
|
|
|
|
|
field: 'customerName',
|
|
|
|
|
required: true,
|
|
|
|
|
component: 'ApiSelect',
|
|
|
|
|
colProps: { span: 4 },
|
|
|
|
|
componentProps: ({ formModel }) => {
|
|
|
|
|
return {
|
|
|
|
|
api: GetClientListByCode,
|
|
|
|
|
params: { code: 'controller' },
|
|
|
|
|
labelField: 'pinYinCode',
|
|
|
|
|
valueField: 'shortName',
|
|
|
|
|
showName: 'shortName',
|
|
|
|
|
resultField: 'data',
|
|
|
|
|
immediate: false,
|
|
|
|
|
onChange: (e, obj) => {
|
|
|
|
|
if (obj) {
|
|
|
|
|
const queryStr = [{
|
|
|
|
|
FieldName: 'ClientId',
|
|
|
|
|
FieldValue: obj.id,
|
|
|
|
|
ConditionalType: '0'
|
|
|
|
|
}]
|
|
|
|
|
const data = {
|
|
|
|
|
pageCondition: {
|
|
|
|
|
"pageIndex": 1,
|
|
|
|
|
"pageSize": 20,
|
|
|
|
|
"sortConditions": []
|
|
|
|
|
},
|
|
|
|
|
queryCondition: JSON.stringify(queryStr)
|
|
|
|
|
}
|
|
|
|
|
GetClientBankList(data).then(res => {
|
|
|
|
|
res.data.forEach(item => {
|
|
|
|
|
item.name = item.bankName + ' ' + item.bankAgentName
|
|
|
|
|
})
|
|
|
|
|
bankList.value = res.data
|
|
|
|
|
})
|
|
|
|
|
formModel.customerId = obj.id
|
|
|
|
|
customerList.value.forEach(item => {
|
|
|
|
|
if (item.id == e) {
|
|
|
|
|
formModel.customer = item
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
if (!obj && !e) {
|
|
|
|
|
bankList.value = []
|
|
|
|
|
formModel.customer = {}
|
|
|
|
|
formModel.customerId = ''
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
label: '代开客户',
|
|
|
|
|
field: 'autualCustomerName',
|
|
|
|
|
component: 'ApiSelect',
|
|
|
|
|
required: false,
|
|
|
|
|
dynamicDisabled: false,
|
|
|
|
|
colProps: { span: 4 },
|
|
|
|
|
componentProps: () => {
|
|
|
|
|
return {
|
|
|
|
|
api: () => {
|
|
|
|
|
return new Promise((resolve) => {
|
|
|
|
|
GetControllerClientList().then((res) => {
|
|
|
|
|
resolve(res)
|
|
|
|
|
})
|
|
|
|
|
})
|
|
|
|
|
},
|
|
|
|
|
immediate: false,
|
|
|
|
|
labelField: 'shortName',
|
|
|
|
|
valueField: 'shortName',
|
|
|
|
|
resultField: 'data',
|
|
|
|
|
filterOption: (input: string, option: any) => {
|
|
|
|
|
return option.label.toLowerCase().indexOf(input.toLowerCase()) >= 0
|
|
|
|
|
},
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
field: 'applyAmount',
|
|
|
|
|
label: '申请金额',
|
|
|
|
|
component: 'InputNumber',
|
|
|
|
|
colProps: { span: 4 },
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
field: 'invoiceAmount',
|
|
|
|
|
label: '开票金额',
|
|
|
|
|
component: 'InputNumber',
|
|
|
|
|
colProps: { span: 4 },
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
field: 'taxRate',
|
|
|
|
|
label: '开票税率',
|
|
|
|
|
component: 'InputNumber',
|
|
|
|
|
colProps: { span: 4 },
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
field: 'otherCurrencyAmount',
|
|
|
|
|
label: '外币金额',
|
|
|
|
|
component: 'InputNumber',
|
|
|
|
|
colProps: { span: 4 },
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
field: 'saleDeptId',
|
|
|
|
|
label: '所属分部',
|
|
|
|
|
component: 'ApiSelect',
|
|
|
|
|
colProps: { span: 4 },
|
|
|
|
|
componentProps: () => {
|
|
|
|
|
return {
|
|
|
|
|
api: GetOrgList,
|
|
|
|
|
resultField: 'data',
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
field: 'note',
|
|
|
|
|
label: '',
|
|
|
|
|
component: 'InputTextArea',
|
|
|
|
|
colProps: { span: 12 },
|
|
|
|
|
slot: 'note',
|
|
|
|
|
},
|
|
|
|
|
{
|
|
|
|
|
field: 'invoiceRemark',
|
|
|
|
|
label: '开票要求',
|
|
|
|
|
component: 'InputTextArea',
|
|
|
|
|
colProps: { span: 12 },
|
|
|
|
|
componentProps: () => {
|
|
|
|
|
return {
|
|
|
|
|
autoSize: { minRows: 4, maxRows: 7 }
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
},
|
|
|
|
|
]
|
|
|
|
|
const route = useRoute()
|
|
|
|
|
const { createMessage } = useMessage()
|
|
|
|
|
const id = ref(route.query.id)
|
|
|
|
@ -145,8 +447,28 @@ function getDetail() {
|
|
|
|
|
InvoiceApplicationGet({ id: id.value }).then(res => {
|
|
|
|
|
if (res.succeeded) {
|
|
|
|
|
setFieldsValue(res.data)
|
|
|
|
|
const queryStr = [{
|
|
|
|
|
FieldName: 'ClientId',
|
|
|
|
|
FieldValue: res.data.customerId,
|
|
|
|
|
ConditionalType: '0'
|
|
|
|
|
}]
|
|
|
|
|
const data = {
|
|
|
|
|
pageCondition: {
|
|
|
|
|
"pageIndex": 1,
|
|
|
|
|
"pageSize": 20,
|
|
|
|
|
"sortConditions": []
|
|
|
|
|
},
|
|
|
|
|
queryCondition: JSON.stringify(queryStr)
|
|
|
|
|
}
|
|
|
|
|
GetClientBankList(data).then(res => {
|
|
|
|
|
res.data.forEach(item => {
|
|
|
|
|
item.name = item.bankName + ' ' + item.bankAgentName
|
|
|
|
|
})
|
|
|
|
|
bankList.value = res.data
|
|
|
|
|
})
|
|
|
|
|
}
|
|
|
|
|
})
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
function openTempName() {
|
|
|
|
|
nameFlag.value = true
|
|
|
|
|