更新发票申请
parent
42aa4ca14e
commit
b5adb9da27
@ -1,53 +1,180 @@
|
|||||||
<template>
|
<template>
|
||||||
<div class="main">
|
<div class="main">
|
||||||
|
<a-spin :spinning="loading">
|
||||||
<div>
|
<div>
|
||||||
<a-button type="link" @click="handleSave" > <i class="iconfont icon-zhcc_tidan"></i>保存</a-button>
|
<a-button type="link" @click="handleSave"> <i class="iconfont icon-zhcc_tidan"></i>保存</a-button>
|
||||||
<a-button type="link" ><i class="iconfont icon-return"></i>撤销审核</a-button>
|
<a-button type="link"><i class="iconfont icon-return"></i>撤销审核</a-button>
|
||||||
</div>
|
</div>
|
||||||
<BasicForm @register="registerForm" />
|
<BasicForm @register="registerForm">
|
||||||
<feeTable @updateAmount="updateAmount" ref="feeTableRef"></feeTable>
|
<template #note="{ model, field }">
|
||||||
|
<div style="display: flex;align-items: center;height: 22px;line-height: 22px;">
|
||||||
|
备注:
|
||||||
|
<a-button @click="openTempName" style="margin: 0 15px 0 20px;" type="link"> <i class="icon-a-17Btuichu iconfont"></i>
|
||||||
|
提取备注</a-button>
|
||||||
|
<a-button type="link" @click="openTemp"><i class="icon-jichupeizhi iconfont"></i>模板设置</a-button>
|
||||||
|
</div>
|
||||||
|
<a-textarea v-model:value="model[field]" :auto-size="{ minRows: 4, maxRows: 7 }" />
|
||||||
|
</template>
|
||||||
|
</BasicForm>
|
||||||
|
<feeTable @updateListSave=updateListSave @updateAmount="updateAmount" ref="feeTableRef"></feeTable>
|
||||||
|
<a-modal @cancel="open = false" width="700px" :visible="open" title="模板设置" @ok="handleSaveTemp">
|
||||||
|
<div style="display: flex;">
|
||||||
|
<div class="label-list">
|
||||||
|
<div class="label-item" @click="handleAddLabel(item)" v-for="item in labelList"
|
||||||
|
:key="item.fieldName">{{
|
||||||
|
item.displayName }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div style="width: 80%;margin-left: 10px">
|
||||||
|
<a-textarea style="height: 90%;" v-model:value="tempContent" />
|
||||||
|
<div style="margin-top: 15px;">
|
||||||
|
<span>发票备注模板</span>
|
||||||
|
<el-autocomplete v-model="tempName" style="width: 81%;margin-left: 10px;"
|
||||||
|
:fetch-suggestions="querySearch" clearable @select="handleSelect" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</a-modal>
|
||||||
|
</a-spin>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<script lang="ts" setup>
|
<script lang="ts" setup>
|
||||||
import { ref, onMounted, unref } from 'vue'
|
import { ref, onMounted, unref } from 'vue'
|
||||||
import { BasicForm, useForm } from '/@/components/Form/index'
|
import { BasicForm, useForm } from '/@/components/Form/index'
|
||||||
|
import { AutoComplete } from 'ant-design-vue'
|
||||||
import { detailForm } from '../columns'
|
import { detailForm } from '../columns'
|
||||||
import feeTable from './feeTable.vue';
|
import feeTable from './feeTable.vue';
|
||||||
import { InvoiceApplicationSave } from '../api'
|
import { InvoiceApplicationSave, InvoiceApplicationGet, GetTemplateFields, SaveTemplate, GetTemplateList } from '../api'
|
||||||
|
import { useMessage } from '/@/hooks/web/useMessage'
|
||||||
|
import { useRoute } from 'vue-router'
|
||||||
|
const route = useRoute()
|
||||||
|
const { createMessage } = useMessage()
|
||||||
|
const id = ref(route.query.id)
|
||||||
const [registerForm, { resetFields, setFieldsValue, validate }] = useForm({
|
const [registerForm, { resetFields, setFieldsValue, validate }] = useForm({
|
||||||
labelWidth: 100,
|
labelWidth: 100,
|
||||||
schemas: detailForm,
|
schemas: detailForm,
|
||||||
showActionButtonGroup: false,
|
showActionButtonGroup: false,
|
||||||
})
|
})
|
||||||
const feeTableRef = ref(null) as any
|
const feeTableRef = ref(null) as any
|
||||||
async function handleSave(){
|
const open = ref(false)
|
||||||
|
async function handleSave() {
|
||||||
const values = await validate()
|
const values = await validate()
|
||||||
const data = {
|
const data = {
|
||||||
...values,
|
...values,
|
||||||
invoiceDetails: feeTableRef.value.list
|
invoiceDetails: feeTableRef.value.list
|
||||||
}
|
}
|
||||||
InvoiceApplicationSave(data).then(res=>{
|
loading.value = true
|
||||||
|
InvoiceApplicationSave(data).then(res => {
|
||||||
|
if (res.succeeded) {
|
||||||
|
createMessage.success('保存成功')
|
||||||
|
} else {
|
||||||
|
createMessage.error(res.message)
|
||||||
|
}
|
||||||
|
loading.value = false
|
||||||
|
}).catch(err => {
|
||||||
|
loading.value = false
|
||||||
})
|
})
|
||||||
console.log(feeTableRef.value.list)
|
|
||||||
}
|
}
|
||||||
function updateAmount(val){
|
const loading = ref(false)
|
||||||
|
function updateAmount(val) {
|
||||||
setFieldsValue({
|
setFieldsValue({
|
||||||
invoiceAmount:val
|
invoiceAmount: val
|
||||||
|
})
|
||||||
|
}
|
||||||
|
const tempContent = ref('')
|
||||||
|
function handleSaveTemp() {
|
||||||
|
const data = {
|
||||||
|
name: tempName.value,
|
||||||
|
content: tempContent.value,
|
||||||
|
id: ''
|
||||||
|
}
|
||||||
|
if (tempId.value) {
|
||||||
|
data.id = tempId.value
|
||||||
|
}
|
||||||
|
SaveTemplate([data]).then(res => {
|
||||||
|
if (res.succeeded) {
|
||||||
|
createMessage.success('保存成功')
|
||||||
|
GetTemplateList().then(res => {
|
||||||
|
tempList.value = res.data
|
||||||
|
tempList.value.forEach(item => {
|
||||||
|
item.value = item.name
|
||||||
|
})
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
createMessage.error(res.message)
|
||||||
|
}
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
init()
|
init()
|
||||||
})
|
})
|
||||||
function init(){
|
const labelList = ref([]) as any
|
||||||
|
const tempList = ref([]) as any
|
||||||
|
function openTemp() {
|
||||||
|
open.value = true
|
||||||
|
GetTemplateFields().then(res => {
|
||||||
|
labelList.value = res.data
|
||||||
|
})
|
||||||
|
GetTemplateList().then(res => {
|
||||||
|
tempList.value = res.data
|
||||||
|
tempList.value.forEach(item => {
|
||||||
|
item.value = item.name
|
||||||
|
})
|
||||||
|
})
|
||||||
|
}
|
||||||
|
function init() {
|
||||||
|
if (id.value) {
|
||||||
|
getDetail()
|
||||||
|
} else {
|
||||||
setFieldsValue({
|
setFieldsValue({
|
||||||
statusText:'未提交'
|
statusText: '未提交'
|
||||||
})
|
})
|
||||||
|
}
|
||||||
|
}
|
||||||
|
function handleAddLabel(val) {
|
||||||
|
tempContent.value += '[' + val.displayName + ']'
|
||||||
|
}
|
||||||
|
function getDetail() {
|
||||||
|
InvoiceApplicationGet({ id: id.value }).then(res => {
|
||||||
|
if (res.succeeded) {
|
||||||
|
setFieldsValue(res.data)
|
||||||
|
}
|
||||||
|
})
|
||||||
|
}
|
||||||
|
function openTempName(){
|
||||||
|
|
||||||
|
}
|
||||||
|
function updateListSave() {
|
||||||
|
|
||||||
|
}
|
||||||
|
const tempName = ref('')
|
||||||
|
const tempId = ref('')
|
||||||
|
const querySearch = (queryString: string, cb: any) => {
|
||||||
|
cb(tempList.value)
|
||||||
|
}
|
||||||
|
function handleSelect(value) {
|
||||||
|
tempId.value = value.id
|
||||||
|
tempContent.value = value.content
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
<style lang="less" scoped >
|
<style lang="less" scoped>
|
||||||
.main{
|
.main {
|
||||||
padding: 20px;
|
padding: 20px;
|
||||||
padding-top: 5px;
|
padding-top: 5px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/deep/ .ant-btn-link {
|
||||||
|
padding: 0px !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.label-list {
|
||||||
|
max-height: 400px;
|
||||||
|
width: 20%;
|
||||||
|
overflow-y: scroll;
|
||||||
|
|
||||||
|
.label-item {
|
||||||
|
margin-bottom: 5px;
|
||||||
|
cursor: pointer;
|
||||||
|
}
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
Loading…
Reference in New Issue