<template>
<div id="IntelligentReimbursement" class="scroll-container" style="padding-left: 16px;">
<div class="container">
<div class="title">
<div class="title1">
<span><img src="../../assets/fangan@2x.png" alt="" srcset=""></span>
<span class="titleRight">差旅报销信息</span>
</div>
<div class="title2">
<!-- <span><img src="../../assets/fangan.png" alt="" srcset=""> -->
<!-- <el-upload v-model="fileLists">
<el-button link type="primary" @click="uploadFile()" style=" margin-right: 8px;">附件上传</el-button>
</el-upload> -->
<!-- <img :src="srcUrl" alt="" srcset="" style="width: 100%;height: 100%;"> -->
<!-- </span> -->
</div>
</div>
<div class="content">
<el-form :model="searchParams"
ref="FormInfoData">
<el-row>
<el-col :span="8">
<el-form-item label="经办人:"><span>{{ searchParams.oaEmployeeName }}</span></el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="经办人工号:"><span>{{ searchParams.oaEmployeeID }}</span></el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="代报销人工号:">
<el-input v-model="searchParams.proxyReimbursementTravelerJobId" placeholder="请输入报销人工号"/>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item label="差旅选项:">
<el-checkbox-group v-model="searchParams.checkRadioGroup">
<el-checkbox v-for="city in searchParams.radioGroup" :key="city" :label="city" :value="city">{{ city }}</el-checkbox>
<!-- <el-radio :value="3">关联商旅平台</el-radio>
<el-radio :value="6">申请差旅补助</el-radio>
<el-radio :value="9">出差住宿报销</el-radio>
<el-radio :value="10">新员工入职出差</el-radio> -->
</el-checkbox-group>
</el-form-item>
</el-col>
</el-row>
<!-- <el-row>-->
<!-- <el-col :span="8">-->
<!-- <el-form-item label="出发地点:">-->
<!-- <el-input v-model="searchParams.departure" placeholder="请输入出发地点"/>-->
<!-- </el-form-item>-->
<!-- </el-col>-->
<!-- <el-col :span="8"></el-col>-->
<!-- <el-col :span="8">-->
<!-- <el-form-item label="到达地点:">-->
<!-- <el-input v-model="searchParams.arriTripLocation" placeholder="请输入到达地点"/>-->
<!-- </el-form-item>-->
<!-- </el-col>-->
<!-- </el-row>-->
<el-row>
<el-col :span="8">
<el-form-item label="起始时间:">
<el-input type="date" v-model="searchParams.startTime" placeholder="请输入起始时间"/>
<!-- <p style=" color: #606266;">（例：日期格式为2024-11-28）</p> -->
</el-form-item>
</el-col>
<el-col :span="8">
</el-col>
<el-col :span="8">
<el-form-item label="结束时间:">
<el-input type="date" v-model="searchParams.endTime" placeholder="请输入结束时间"/>
</el-form-item>
</el-col>
</el-row>
<!-- <el-row>
<el-col :span="18">
<el-form-item
label="请仿照示例描述差旅信息:"
:label-width="labelText + 'px'"
>
<el-input
class="placeholderTextarea"
v-model="searchParams.desInformation"
placeholder="本人报销2024年11月3日至11月9日由北京去重庆市出差的差旅票据，本次报销交通费、住宿费用及7天的补助、走部门费用-制造费用、请帮我识别票据信息。"
type="textarea"
/>
<p style="color: red;" v-show="isShow">请语音输入需要报销的项目号</p>
</el-form-item>
</el-col>
<el-col :span="1">
<img src="../../assets/yuyinshibie@2x.png" alt="" @click="initVoice()" srcset="" style="margin-top: 32px;">
</el-col>
</el-row> -->
<el-row class="myBottom">
<el-col :span="5">
<!-- <el-upload
v-model:file-list="fileList"
class="upload-demo"
action="https://run.mocky.io/v3/9d059bf9-4660-45f2-925d-ce80ad6c4d15"
multiple
:on-preview="handlePreview"
:on-remove="handleRemove"
:before-remove="beforeRemove"
:limit="3"
:on-exceed="handleExceed"
>
<el-button type="primary">Click to upload</el-button>
<template #tip>
<div class="el-upload__tip">
jpg/png files with a size less than 500KB.
</div>
</template>
</el-upload> -->
<!-- <el-upload ref="ocrupimgupload" action="#" -->
<!-- list-type="text"-->
<!-- :multiple="false"-->
<!-- :on-change="uploadimgChange"-->
<!-- :on-remove="handleRemove"-->
<!-- :on-preview="handlePictureCardPreview"-->
<!-- :auto-upload="false"-->
<!-- :on-success="handleSuccess"-->
<!-- :file-list="imgfileList"-->
<!-- :show-file-list="false"-->
<!-- :before-upload="beforeimglistUpload"-->
<!-- accept=".jpg,.jpeg,.png,.bmp">-->
<!-- -->
<!-- <el-button type="primary">-->
<!-- <img src="../../assets/piaoju@2x.png" alt="" srcset="" class="img-size">-->
<!-- 票据上传-->
<!-- </el-button>-->
<!-- </el-upload>-->
<!-- <div style="position: relative;">
<input id="default-btn" type="file" @change="onSelectFile" class="upload-input" style="width: 230px;">
<img src="../../assets/piaoju@2x.png" alt="" style="position: absolute; bottom: 28%; right: 78%;">
</div> -->
<input id="default-btn" type="file" @change="onSelectFile" class="upload-input" style="display: none;">
<el-button type="primary" @click="triggerFileInput">
<img src="../../assets/piaoju@2x.png" alt="" srcset="" class="img-size" style="margin-bottom: 2px;">
票据上传
</el-button>
</el-col>
<el-col :span="3"></el-col>
<el-col :span="5">
<el-button type="primary" @click="infoConfirm"
>
<img src="../../assets/gongdanqueren@2x.png" alt="" srcset="" class="img-size" >
信息确认</el-button
>
</el-col>
</el-row>
</el-form>
</div>
</div>
<div class="container">
<div class="title">
<div class="title1">
<span><img src="../../assets/guanlianshengchengpingzheng@2x.png" alt="" srcset=""></span>
<span class="titleRight">OA考勤信息</span>
</div>
</div>
<div class="content2" style="padding: 28px 30px;">
<el-table
:data="OAtableDatas"
style="width: 100%"
:header-cell-style="{
background: '#ECF3FF',
color: '#027DDD',
height: '35px',
}"
:row-style="{ height: 12 + 'px' }"
border
>
<!-- applicant -->
<el-table-column
prop="post_NAME"
label="申请人"
align="center"
></el-table-column>
<!-- <el-table-column
prop="xxx"
label="出发城市"
align="center"
></el-table-column> -->
<el-table-column
prop="trip_CITY"
label="出差地点"
align="center"
></el-table-column>
<el-table-column
prop="trip_REASON"
label="出差目的"
align="center"
></el-table-column>
<!-- <el-table-column-->
<!-- prop="form_TITLE"-->
<!-- label="出差单位"-->
<!-- align="center"-->
<!-- ></el-table-column>-->
<el-table-column
prop="transport_NAME"
label="交通工具"
align="center"
>
<!-- <template #default="scope">
<span>{{ scope.row.transportation }}</span>
</template> -->
</el-table-column>
<!-- <el-table-column
prop="original_START_TIME"
label="预计起始时间"
align="center"
></el-table-column>
<el-table-column
prop="estimatedEndTime"
label="预计结束时间"
align="center"
></el-table-column> -->
<el-table-column
prop="start_DATE.genericDateValue"
label="实际开始时间"
align="center"
></el-table-column>
<el-table-column
prop="end_DATE.genericDateValue"
label="实际结束时间"
align="center"
></el-table-column>
<!-- <el-table-column-->
<!-- prop="end_DATE.genericDateValue"-->
<!-- label="实际结束时间"-->
<!-- align="center"-->
<!-- ></el-table-column>-->
</el-table>
</div>
</div>
<div class="container">
<div class="title">
<div class="title1">
<span><img src="../../assets/guanlianshengchengpingzheng@2x.png" alt="" srcset=""></span>
<span class="titleRight">商旅出差申请单详情</span>
</div>
</div>
<div class="content2" style="padding: 28px 30px;">
<el-table
:data="tableDatas"
style="width: 100%"
:header-cell-style="{
background: '#ECF3FF',
color: '#027DDD',
height: '35px',
}"
:row-style="{ height: 12 + 'px' }"
border
>
<el-table-column
prop="recode"
label="单据编号"
align="center"
></el-table-column>
<el-table-column
prop="orderid"
label="商旅订单号"
align="center"
></el-table-column>
<el-table-column
prop="ctkd2"
label="出差城市"
align="center"
></el-table-column>
<el-table-column
prop="starttime"
label="出发日期"
align="center"
></el-table-column>
<el-table-column
prop="endtime"
label="返回日期"
align="center"
></el-table-column>
<el-table-column
prop="feedetailname"
label="票据类型"
align="center"
>
</el-table-column>
<!-- <el-table-column
prop="xxx"
label="出差类别"
align="center"
></el-table-column> -->
<!-- <el-table-column-->
<!-- prop="purpose"-->
<!-- label="出差事由"-->
<!-- align="center"-->
<!-- width="270"-->
<!-- ></el-table-column>-->
</el-table>
</div>
</div>
<div class="container">
<div class="title">
<div class="title1">
<span><img src="../../assets/xinxitianxie@2x.png" alt="" srcset=""></span>
<span class="titleRight">报销项目信息详情</span>
</div>
</div>
<div class="content2" style="padding: 28px 23px;">
<el-form :model="searchParams2" >
<el-row >
<el-col>
<el-form-item label="出差目的：" :label-width="labelText + 'px'" >
<el-input placeholder="出差目的" v-model="searchParams2.PurBusTrip" type="textarea"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row style="margin-top: 15px;">
<el-col :span="10">
<el-form-item label="WBS编号：" :label-width="labelText + 'px'" >
<el-select v-model="searchParams2.WbsNumber" placeholder="WBS编号" @change="changeWBS">
<el-option
v-for="item in wbsLists"
:key="item"
:label="item"
:value="item"
/>
</el-select>
</el-form-item>
</el-col>
<el-col :span="4"></el-col>
<el-col :span="10">
<el-form-item label="订单号：" :label-width="labelText + 'px'" >
<el-select v-model="searchParams2.OrderNo" placeholder="订单号" @change="changeDDH">
<el-option
v-for="item in ddLists"
:key="item"
:label="item"
:value="item"
/>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row style="margin-top: 15px;">
<el-col :span="10">
<el-form-item label="成本中心：" :label-width="labelText + 'px'" >
<!-- <el-input placeholder="成本中心" v-model="searchParams2.costCenter"></el-input> -->
<el-select v-model="searchParams2.costCenter" placeholder="成本中心" @change="changecb">
<el-option
v-for="item in cbLists"
:key="item"
:label="item"
:value="item"
/>
</el-select>
</el-form-item>
</el-col>
<el-col :span="4"></el-col>
<el-col :span="10">
<el-form-item label="利润中心：" :label-width="labelText + 'px'" >
<!-- <el-input placeholder="利润中心" v-model="searchParams2.profitCenter"></el-input> -->
<el-select v-model="searchParams2.profitCenter" placeholder="利润中心" @change="changelr">
<el-option
v-for="item in lrLists"
:key="item"
:label="item"
:value="item"
/>
</el-select>
</el-form-item>
</el-col>
</el-row>
</el-form>
</div>
</div>
<div class="container" style="height: 729px;">
<div class="title">
<div class="title1">
<span><img src="../../assets/mingxi@2x.png" alt="" srcset=""></span>
<span class="titleRight">差旅费用明细</span>
</div>
</div>
<div class="content2" style="padding: 28px 23px;height: 620px;">
<el-table
:data="tableLists"
:expand-row-keys="expandRowKeys"
:row-key="getRowKeys"
max-height="560"
style="width: 100%"
:header-cell-style="{ background: '#ECF3FF', color: '#027DDD',height: '45px', }"
:row-style="{ height: 12 + 'px' }"
@cell-dblclick="tableDbEdit"
:row-class-name="tableRowClassName"
>
<!-- 拓展展开开始 -->
<el-table-column type="expand" width="0">
<template #default="scope">
<div class="m4_con" v-for="msg in scope.row.msgs" :key="msg">
<p m="t-0 b-2" >
<span class="m_20_error">x</span>
<span class="ml_20">
{{ msg.msg }}
</span>
</p>
<!-- <p m="t-0 b-2" ><span id="errorText">x</span>发票抬头错误。-->
<!-- <span class="ml_20">-->
<!-- <!– {{ props.row.city }} –>-->
<!-- 建议：请重新开具住宿费发票并上传。-->
<!-- </span>-->
<!-- </p>-->
</div>
</template>
</el-table-column>
<!-- 拓展展开结束 -->
<el-table-column type="index" width="80" align="center" label="序号" />
<el-table-column prop="originalImage" width="120" align="center" label="票据预览">
<template #default="scope">
<div style="display: flex; align-items: center">
<!-- <a :href="scope.row.originalImage" target="_blank"> -->
<img :src="'data:image/jpeg;base64,'+scope.row.originalImage" alt="" srcset="" slot="reference" style="width: 107px;"/>
<!-- </a> -->
</div>
</template>
</el-table-column>
<el-table-column align="center" prop="invoiceType" width="160" show-overflow-tooltip label="发票类型">
<template #default="scope">
<el-input
v-if="scope.row.edit"
v-model="scope.row.invoiceType"
placeholder="发票类型"
></el-input>
<span v-else>{{ scope.row.invoiceType }}</span>
</template>
</el-table-column>
<el-table-column
prop="ticketAmount"
align="center"
width="160"
label="费用金额 (元)"
>
<template #default="scope">
<el-input
v-if="scope.row.edit"
v-model="scope.row.ticketAmount"
placeholder="费用金额"
></el-input>
<span v-else>{{ scope.row.ticketAmount }}</span>
</template>
</el-table-column>
<el-table-column prop="invoiceAmount" width="160" align="center" label="发票金额 (元)">
<template #default="scope">
<el-input
v-if="scope.row.edit"
v-model="scope.row.invoiceAmount"
placeholder="发票金额"
></el-input>
<span v-else>{{ scope.row.invoiceAmount }}</span>
</template>
</el-table-column>
<el-table-column prop="invoiceTotalAmountIncludingTax" width="160" align="center" label="合计金额 (元)">
<template #default="scope">
<el-input
v-if="scope.row.edit"
v-model="scope.row.invoiceTotalAmountIncludingTax"
placeholder="合计金额"
></el-input>
<span v-else>{{ scope.row.invoiceTotalAmountIncludingTax }}</span>
</template>
</el-table-column>
<el-table-column prop="deductibleInvoiceAmountExcludingTax" align="center" width="180" label="抵扣发票的不含税金额 (元)">
<template #default="scope">
<el-input
v-if="scope.row.edit"
v-model="scope.row.deductibleInvoiceAmountExcludingTax"
placeholder="抵扣发票的不含税金额"
></el-input>
<span v-else>{{ scope.row.deductibleInvoiceAmountExcludingTax }}</span>
</template>
</el-table-column>
<el-table-column prop="civilAviationDevelopmentFund" align="center" width="160" label="民航发展基金">
<template #default="scope">
<el-input
v-if="scope.row.edit"
v-model="scope.row.civilAviationDevelopmentFund"
placeholder="民航发展基金"
></el-input>
<span v-else>{{ scope.row.civilAviationDevelopmentFund }}</span>
</template>
</el-table-column>
<el-table-column prop="deductibleInvoiceTaxAmount" align="center" width="160" label="抵扣发票的税额 (元)">
<template #default="scope">
<el-input
v-if="scope.row.edit"
v-model="scope.row.deductibleInvoiceTaxAmount"
placeholder="抵扣发票的税额"
></el-input>
<span v-else>{{ scope.row.deductibleInvoiceTaxAmount }}</span>
</template>
</el-table-column>
<el-table-column prop="fuelSurcharge" align="center" width="160" label="燃油附加费 (元)">
<template #default="scope">
<el-input
v-if="scope.row.edit"
v-model="scope.row.fuelSurcharge"
placeholder="燃油附加费"
></el-input>
<span v-else>{{ scope.row.fuelSurcharge }}</span>
</template>
</el-table-column>
<el-table-column prop="invoiceId" width="160" align="center" label="发票号码">
<template #default="scope">
<el-input
v-if="scope.row.edit"
v-model="scope.row.invoiceId"
placeholder="发票号码"
></el-input>
<span v-else>{{ scope.row.invoiceId }}</span>
</template>
</el-table-column>
<el-table-column prop="invoiceCode" width="160" align="center" label="发票代码">
<template #default="scope">
<el-input
v-if="scope.row.edit"
v-model="scope.row.invoiceCode"
placeholder="发票代码"
></el-input>
<span v-else>{{ scope.row.invoiceCode }}</span>
</template>
</el-table-column>
<el-table-column prop="invoiceTaxCode" align="center" width="160" label="税码">
<template #default="scope">
<el-input
v-if="scope.row.edit"
v-model="scope.row.invoiceTaxCode"
placeholder="税码"
></el-input>
<span v-else>{{ scope.row.invoiceTaxCode }}</span>
</template>
</el-table-column>
<el-table-column prop="invoiceTaxRate" align="center" width="160" label="税率">
<template #default="scope">
<el-input
v-if="scope.row.edit"
v-model="scope.row.invoiceTaxRate"
placeholder="税率"
></el-input>
<span v-else>{{ scope.row.invoiceTaxRate }}</span>
</template>
</el-table-column>
<el-table-column prop="deductibleInvoiceTaxAmount" align="center" width="160" label="税额">
<template #default="scope">
<el-input
v-if="scope.row.edit"
v-model="scope.row.deductibleInvoiceTaxAmount"
placeholder="税额"
></el-input>
<span v-else>{{ scope.row.deductibleInvoiceTaxAmount }}</span>
</template>
</el-table-column>
<el-table-column prop="billingUnit" align="center" width="160" label="开票单位">
<template #default="scope">
<el-input
v-if="scope.row.edit"
v-model="scope.row.billingUnit"
placeholder="开票单位"
></el-input>
<span v-else>{{ scope.row.billingUnit }}</span>
</template>
</el-table-column>
<el-table-column prop="invoiceNumber" align="center" width="160" label="发票联次">
<template #default="scope">
<el-input
v-if="scope.row.edit"
v-model="scope.row.invoiceNumber"
placeholder="发票联次"
></el-input>
<span v-else>{{ scope.row.invoiceNumber }}</span>
</template>
</el-table-column>
<el-table-column prop="invoiceTitle" align="center" width="160" label="纳税人名称">
<template #default="scope">
<el-input
v-if="scope.row.edit"
v-model="scope.row.invoiceTitle"
placeholder="纳税人名称"
></el-input>
<span v-else>{{ scope.row.invoiceTitle }}</span>
</template>
</el-table-column>
<el-table-column prop="taxpayerIdNumber" align="center" width="160" label="纳税人识别号">
<template #default="scope">
<el-input
v-if="scope.row.edit"
v-model="scope.row.taxpayerIdNumber"
placeholder="纳税人识别号"
></el-input>
<span v-else>{{ scope.row.taxpayerIdNumber }}</span>
</template>
</el-table-column>
<el-table-column prop="startDate" align="center" width="160" label="开始日期">
<template #default="scope">
<el-input
v-if="scope.row.edit"
v-model="scope.row.startDate"
placeholder="开始日期"
></el-input>
<span v-else>{{ scope.row.startDate }}</span>
</template>
</el-table-column>
<el-table-column prop="departureLocation" align="center" width="160" label="出发地点">
<template #default="scope">
<el-input
v-if="scope.row.edit"
v-model="scope.row.departureLocation"
placeholder="出发地点"
></el-input>
<span v-else>{{ scope.row.departureLocation }}</span>
</template>
</el-table-column>
<el-table-column prop="endDate" align="center" width="160" label="结束日期">
<template #default="scope">
<el-input
v-if="scope.row.edit"
v-model="scope.row.endDate"
placeholder="结束日期"
></el-input>
<span v-else>{{ scope.row.endDate }}</span>
</template>
</el-table-column>
<el-table-column prop="arrivalLocation" align="center" width="160" label="到达地点">
<template #default="scope">
<el-input
v-if="scope.row.edit"
v-model="scope.row.arrivalLocation"
placeholder="到达地点"
></el-input>
<span v-else>{{ scope.row.arrivalLocation }}</span>
</template>
</el-table-column>
<el-table-column prop="seat" align="center" width="160" label="座次">
<template #default="scope">
<el-input
v-if="scope.row.edit"
v-model="scope.row.seat"
placeholder="座次"
></el-input>
<span v-else>{{ scope.row.seat }}</span>
</template>
</el-table-column>
<el-table-column prop="distance" align="center" width="160" label="距离（公里）">
<template #default="scope">
<el-input
v-if="scope.row.edit"
v-model="scope.row.distance"
placeholder="距离（公里）"
></el-input>
<span v-else>{{ scope.row.distance }}</span>
</template>
</el-table-column>
<!-- 按照系统新增字段属性值开始 -->
<!-- <el-table-column prop="endDate" align="center" width="160" label="交通工具">-->
<!-- <template #default="scope">-->
<!-- <el-input-->
<!-- v-if="scope.row.edit"-->
<!-- v-model="scope.row.fuelSurcharge"-->
<!-- placeholder="交通工具"-->
<!-- ></el-input>-->
<!-- <span v-else>{{ scope.row.fuelSurcharge }}</span>-->
<!-- </template>-->
<!-- </el-table-column>-->
<!-- <el-table-column prop="endDate" align="center" width="160" label="报销天数">-->
<!-- <template #default="scope">-->
<!-- <el-input-->
<!-- v-if="scope.row.edit"-->
<!-- v-model="scope.row.fuelSurcharge"-->
<!-- placeholder="费用项目"-->
<!-- ></el-input>-->
<!-- <span v-else>{{ scope.row.fuelSurcharge }}</span>-->
<!-- </template>-->
<!-- </el-table-column>-->
<!-- <el-table-column prop="endDate" align="center" width="160" label="住宿城市">-->
<!-- <template #default="scope">-->
<!-- <el-input-->
<!-- v-if="scope.row.edit"-->
<!-- v-model="scope.row.fuelSurcharge"-->
<!-- placeholder="费用项目"-->
<!-- ></el-input>-->
<!-- <span v-else>{{ scope.row.fuelSurcharge }}</span>-->
<!-- </template>-->
<!-- </el-table-column>-->
<!-- <!– 按照系统新增字段属性值结束 –>-->
<el-table-column prop="Remarks" label="*特殊情况说明" align="center" min-width="280" >
<template #default="scope">
<!-- <div @click="showOverflowTooltip"> -->
<!-- scope.row.edit -->
<el-input
v-if="scope.row.edit"
v-model="scope.row.Remarks"
style="width: 220px"
placeholder="请填写异常信息"
/>
<!-- <span id="bzTextInfo" v-else>{{showEditTextContent}}</span> -->
<span id="bzTextInfo" v-if="showEditTextContent">{{scope.row.Remarks}}</span>
<!-- <el-button link type="primary" size="small" @click="addFaceDB('edit',scope.row)"></el-button>
<el-button link type="primary" size="small" @click="deleteItem(scope.row)"></el-button> -->
<!-- </div> -->
</template>
</el-table-column>
<!-- 按照系统新增末尾字段属性值开始 -->
<!-- <el-table-column prop="endDate" align="center" width="160" label="成本中心"></el-table-column>
<el-table-column prop="endDate" align="center" width="160" label="业务类型"></el-table-column>
<el-table-column prop="endDate" align="center" width="160" label="内部订单"></el-table-column>
<el-table-column prop="endDate" align="center" width="160" label="WBS元素"></el-table-column>
<el-table-column prop="endDate" align="center" width="160" label="报销标准"></el-table-column>
<el-table-column prop="endDate" align="center" width="160" label="是否超标"></el-table-column>
<el-table-column prop="endDate" align="center" width="160" label="是否关联商旅"></el-table-column> -->
<!-- 按照系统新增末尾字段属性值结束 -->
<el-table-column label="操作栏" align="center" fixed="right" min-width="180" >
<template #default="scope">
<!-- <el-button type="primary" :icon="Edit" @click="editInfoCon(scope.$index,scope.row,'编辑')">{{ textBtn }}</el-button> -->
<el-button type="primary" :icon="Edit" circle :disabled="scope.row.edit" @click="editInfoCon(scope.$index,scope.row)"></el-button>
<el-button type="primary" :icon="Check" circle :disabled="!scope.row.edit" @click="saveInfoCon(scope.$index,scope.row)"></el-button>
<!-- <el-popconfirm title="确定删除吗?">
<template #reference>
<el-button type="danger" :icon="Delete" circle @click="deleteInfoCon(scope.$index,scope.row)"></el-button>
</template>
</el-popconfirm> -->
<el-button type="danger" :icon="Delete" circle @click="deleteInfoCon(scope.$index,scope.row)"></el-button>
</template>
</el-table-column>
</el-table>
<el-row style="margin-top: 28px;">
<el-col>
<!-- <el-button @click="cancelAllPageCon">取消</el-button> -->
<el-button type="primary" @click="beginCheck" style="margin-left: 65px;">校验</el-button>
<el-button type="primary" @click="confirmAllPageCon" style="margin-left: 65px;">提交</el-button>
</el-col>
</el-row>
</div>
</div>
<div class="dialog">
<el-dialog title="请确认报销信息" v-model="dialogVisible">
<el-table
v-loading="loadingTable"
element-loading-text="AI正在根据您的描述生成中，请稍等..."
:element-loading-spinner="svg"
element-loading-svg-view-box="-10, -10, 50, 50"
element-loading-background="rgba(236, 243, 255, 0.8)"
:data="confirmInfoLists"
default-expand-all
height="380"
style="width: 100%"
:header-cell-style="{ background: '#ECF3FF', color: '#027DDD',height: '45px', }"
:row-style="{ height: 12 + 'px' }"
>
<el-table-column type="index" width="120" align="center" label="序号" />
<el-table-column prop="startTime" width="160" align="center" label="开始日期">
<template #default="scope">
<el-input
v-if="scope.row.edit"
v-model="scope.row.startTime"
placeholder="费用项目"
></el-input>
<span v-else>{{ scope.row.startTime }}</span>
</template>
</el-table-column>
<el-table-column prop="endTime" align="center" width="160" label="结束日期">
<template #default="scope">
<el-input
v-if="scope.row.edit"
v-model="scope.row.endTime"
placeholder="费用项目"
></el-input>
<span v-else>{{ scope.row.endTime }}</span>
</template>
</el-table-column>
<el-table-column prop="invoiceType" align="center" width="160" label="票据类型">
<!-- <template #default="scope">
<el-tag effect="dark" type="primary">{{ scope.row.invoiceType }}</el-tag>
</template> -->
<template #default="scope">
<el-input
v-if="scope.row.edit"
v-model="scope.row.invoiceType"
placeholder="费用项目"
></el-input>
<span v-else>{{ scope.row.invoiceType }}</span>
</template>
</el-table-column>
<el-table-column prop="destination" align="center" width="160" label="地点">
<template #default="scope">
<el-input
v-if="scope.row.edit"
v-model="scope.row.destination"
placeholder="费用项目"
></el-input>
<span v-else>{{ scope.row.destination }}</span>
</template>
</el-table-column>
<el-table-column prop="expenseType" align="center" width="160" label="费用类型">
<template #default="scope">
<el-input
v-if="scope.row.edit"
v-model="scope.row.expenseType"
placeholder="费用项目"
></el-input>
<span v-else>{{ scope.row.expenseType }}</span>
</template>
</el-table-column>
<el-table-column label="操作栏" align="center" min-width="180" fixed="right">
<template #default="scope">
<!-- <el-button type="primary" :icon="Edit" @click="editInfoCon(scope.$index,scope.row,'编辑')">{{ textBtn }}</el-button> -->
<el-button type="primary" :icon="Edit" circle :disabled="scope.row.edit" @click="editDiaInfo(scope.$index,scope.row)"></el-button>
<el-button type="primary" :icon="Check" circle :disabled="!scope.row.edit" @click="saveDiaInfo(scope.$index,scope.row)"></el-button>
<el-button type="danger" :icon="Delete" circle @click="deletediaInfo(scope.$index,scope.row)"></el-button>
</template>
</el-table-column>
</el-table>
<el-row>
<el-col :span="12" type="cancel">取消</el-col>
<el-col :span="12" type="primary" @click="submitCon">确认</el-col>
</el-row>
<!-- <el-form :model="searchParams_info"
ref="FormInfoData" class="dialog-form">
<el-row>
<el-col :span="24" style="margin-top: 14px;">
<el-form-item
label="报销起始时间:"
:label-width="dialogLabelText + 'px'"
>
<el-date-picker
v-model="searchParams_info.startTime"
type="date"
placeholder="请选择"
size="large"
/>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="24">
<el-form-item
label="报销结束时间:"
:label-width="dialogLabelText + 'px'"
>
<el-date-picker
v-model="searchParams_info.endTime"
type="date"
placeholder="请选择"
size="large"
/>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="18">
<el-form-item
label="出差地点:"
:label-width="dialogLabelText + 'px'"
>
<el-input
v-model="searchParams_info.destination"
placeholder="请输入出差地点（例如：上海）"
size="large"
clearable
/>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="18">
<el-form-item
label="票据类型:"
:label-width="dialogLabelText + 'px'"
>
<el-select v-model="searchParams2.destination" placeholder="请选择票据类型" @change="changeDes" size="large">
<el-option
v-for="item in destinationLists"
:key="item.dep"
:label="item.dep"
:value="item.dep"
/>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="18">
<el-form-item
label="费用类型:"
:label-width="dialogLabelText + 'px'"
>
<el-select v-model="searchParams2.expenseType" placeholder="请选择费用类型" @change="changeExp" size="large">
<el-option
v-for="item in expenseTypeLists"
:key="item.dep"
:label="item.dep"
:value="item.dep"
/>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row style="margin-top: 28px;">
<el-col>
<el-button>取消</el-button>
<el-button type="primary" style="margin-left: 65px;">确定</el-button>
</el-col>
</el-row>
</el-form> -->
</el-dialog>
</div>
</div>
</template>
<script setup>
import {
Check,
Delete,
Edit,
Message,
Search,
Star,
} from '@element-plus/icons-vue'
import { reactive, ref, onBeforeMount, onMounted, watch, nextTick } from "vue";
import { ElMessage } from "element-plus";
import axios from 'axios';
import { useStore } from 'vuex'
const store = useStore()
const loginData = {
username: "admin",
password: "admin",
}
const loginHandle=(loginData)=>{
axios({
method:"POST",
url:'http://10.54.69.212:8083/api/system/mLogin',
data:loginData,
headers: {
'Content-Type': 'application/json'
}
}).then(res=>{
console.log(res, "res");
store.commit('getUserInfo',res.data.result)
sessionStorage.setItem('userInfo',JSON.stringify(res.data.result))
})
}
loginHandle(loginData)
</script>
<script>
//import noAttUploadRecognition from "./../noAttUploadRecognition/index.vue";
// import voice from '../../apis/commons/ai_voice.adv'
import VoiceStreamer from "../../../public/ai_voice.adv.es6.js";
import { fa } from "element-plus/es/locale/index.mjs";
import { useStore } from 'vuex'
const store = useStore()
export default {
name: "IntelligentReimbursement",
components: { },
props:{
prop:{
type: String,
default: "这是外部属性没传时的默认值",
required: false
}
},
watch: {
// // 监听内部属性的变化
// inside_prop:{
// handler(inside_prop_new){
// // 将外部的属性更新
// this.$emit('update:prop',inside_prop_new);
// },
// deep: true,
// immediate: true
// },
// 监听外部属性的变化
prop: {
handler(jsonString) {
// 更新内部的属性
try {
let jsonObj = JSON.parse(jsonString);
if(jsonObj.type === 1) {//差旅报销信息
var searchParam = jsonObj.aireply;
//
this.searchParams.departure = searchParam.departure;//出发地点
this.searchParams.arriTripLocation = searchParam.destination;//到达地点
this.searchParams.startTime = searchParam.startTime;//起始时间
this.searchParams.endTime = searchParam.endTime;//结束时间
//
this.searchParams.checkRadioGroup = [];
if (searchParam.isLinkedToBusinessTravelPlatform) {//是否关联商旅平台
this.searchParams.checkRadioGroup.push("关联商旅平台");
}
if (searchParam.isApplyingForTravelAllowance) {//是否申请差旅补助
this.searchParams.checkRadioGroup.push("申请差旅补助");
}
if (searchParam.isOvernightStayReimbursement) {//是否为加班住宿报销 原为：出差住宿报销
this.searchParams.checkRadioGroup.push("加班住宿报销");
}
if (searchParam.isNewEmployeeOnboardingTrip) {//是否为新员工入职出差
this.searchParams.checkRadioGroup.push("新员工入职出差");
}
if (searchParam.isProxyReimbursement) {//是否代报销
this.searchParams.proxyReimbursementTravelerJobId = searchParam.proxyReimbursementTravelerJobId;
} else {
this.searchParams.proxyReimbursementTravelerJobId = "";
}
}
else if(jsonObj.type === 2) {//OA单项选择后的一条OA数据
var oadatas = jsonObj.oadatas;
this.OAtableDatas = oadatas;
//商旅查询接口
this.slSearch();
//报销项目信息查询
this.projectSearch();
}
}
catch (e) {
}
},
deep: true,
immediate: true
},
},
data() {
return {
// backendip : "http://10.16.56.138:8083",//后端服务器IP
backendip: this.$store.state.requestUrl,
loadingTable:true, //请确认报销信息Loading
confirmInfoLists:[], //二次弹窗-请确认报销信息数据
srcUrl:'',
textBtn:'编辑',//编辑按钮
tableLists:[],//差旅费用明细
dialogLabelText:230,
searchParams_info:{},
dialogVisible:false,//弹窗
isShow:false, //是否显示重新识别（red）
// fileLists:[],//上传文件地址
labelText:180,
// voiceStreamer:null, //音频播放器
// InfoFilling:{}, //报销项目信息详情
rand:1,
showTable: false,
OAtableDatas:[],//oa信息情况
tableDatas: [], // 出差申请单详情
expandRowKeys:[], //默认展开行数
submitCount: 0, //提交次数
// acticeText_sl: "否", //是否关联商旅平台
// ApplyTravelAllowance: "否", //申请差旅补助
// acticeText_dbx: "否", //是否为代报销
// active_OveAccReim: "否", //是否为加班住宿报销
// active_newPerson: "否", //是否为新员工入职出差
searchParams: {
oaEmployeeName: '陈鑫江', //经办人
oaEmployeeID:'E0096584', //经办人工号
RealReimAgenumber:'', //提交到后台实际报销人工号
// radioGroup:3,
checkRadioGroup:[],
radioGroup:['关联商旅平台','申请差旅补助','加班住宿报销','新员工入职出差'], //原为出差住宿报销
departure:'' ,//出发地点
arriTripLocation:'', //到达地点
startTime:'', //起始时间
endTime:'', //结束时间
proxyReimbursementTravelerJobId:''
// desInformation: "这是2023年1月3日至1月8日去天津和北京出差的差旅票据，本次报销北京3日和5日的火车票、4日的打车票，天津6日和8日的火车票、6日到7日的住宿票，请帮我识别", //描述差旅信息
// isRelated: false, //是否关联商旅平台
// isReiAgent: false, //请选择是否代报销
// ActBusReimbursementName: "", //实际出差报销人员姓名
// applyTravelSubsidy: false, //是否申请差旅游补助
// OveAccReimbursement: false, // 加班住宿报销
// NewEmBusinessTripsJoining: false, // 新员工入职出差
},
searchParams2:{
PurBusTrip:'',//出差目的
WbsNumber:'1',//WBS编号
OrderNo:'', //订单号
costCenter:'', //成本中心
profitCenter:'', //利润中心
},
wbsLists:[],
ddLists:[],
cbLists:[], //成本中心
lrLists:[], //利润中心
status: false,
imgfileList:[], //上传文件图片地址
};
},
mounted(){
// setTimeout(()=>{
// this.getTableData()
// },3000)
},
created(){
},
methods: {
getRowKeys (row) {
return row.serialId;
},
triggerFileInput() {
const fileInput = document.getElementById('default-btn');
fileInput.click();
},
submitCon() {
},
tableRowClassName({row, rowIndex}) {
// console.log(row,rowIndex,'aaaa');
if (rowIndex == 0) {
// this.tableLists
return 'warning-row'
}
},
//报销项目信息查询
projectSearch() {
//提交表单 接口数据信息 接口文档中-八、查询数据湖/BW财务数据（WBS编号和订单号、一个接口包含项目信息5个字段值）
// let url='http://10.129.182.23:8080/api/dataLake/1'
let url = this.backendip + '/api/dataLake/' + this.searchParams2.WbsNumber
axios({
method: "GET",
url: url,
// params:this.searchParams
}).then(res => {
if (res.status == 200 && res.data) {
//出差目的 WBS编号 订单号 成本中心 利润中心
// this.searchParams2={
this.searchParams2.PurBusTrip = res.data.purpose //出差目的
this.searchParams2.WbsNumber = res.data.wbsids[0]//WBS编号
this.searchParams2.OrderNo = res.data.internalOrderIds[0] //订单号
this.searchParams2.costCenter = res.data.travelerCostCenters[0] //成本中心
this.searchParams2.profitCenter = res.data.travelerProfitCenters[0] //利润中心
// }
this.wbsLists = res.data.wbsids
this.ddLists = res.data.internalOrderIds
this.cbLists = res.data.travelerCostCenters //成本中心
this.lrLists = res.data.travelerProfitCenters //利润中心
}else{
ElMessage.error('请求出现问题，请稍后重试！')
}
})
},
//商旅查询接口
slSearch(){
let oaParams = {
pernr: this.searchParams.RealReimAgenumber,
startTime: this.convertPODate2DotDate(this.OAtableDatas[0].start_DATE.genericDateValue),
endTime: this.convertPODate2DotDate(this.OAtableDatas[0].end_DATE.genericDateValue)
}
axios({
method: "POST",
// url:'http://10.16.56.158:8083/api/context_re/getShangLv', //博民ip
// url:'http://10.54.69.212:8083/api/context_re/getShangLv',
url: this.backendip + '/api/context_re/getShangLv', //书磊本地10.16.57.166:8080
data: oaParams,
}).then(res => {
console.log(res.data, '商旅接口信息');
if (res.data.code == 200) {
this.tableDatas = res.data.result.shangLvLst
//todo:测试过滤
this.tableDatas = this.tableDatas.slice(0, 5)
console.log(this.tableDatas, '商旅接口信息2222');
}else{
ElMessage.error('请求出现问题，请稍后重试！')
}
// if(res.data.code!=200){
// ElMessage({
// message:res.data.message,
// type:'error',
// duration:5000,
// showClose:true
// })
// }
})
},
convertPODate2DotDate(dateString) {
//YYYYMMDD----YYYY-MM-DD
try {
if (dateString === null || dateString === '') {
return '';
}
var year = dateString.substring(0, 4);
var month = dateString.substring(4, 6);
var day = dateString.substring(6, 8);
return `${year}-${month}-${day}`;
}catch{
return '';
}
},
//todo:信息确认新逻辑
// 点击信息确认按钮，从后台接口返回OA，如果OA数据存在多条，则将数据发送到左侧AI导航，进行单项选择问询，
//问询只处理一条OA信息。
doInformationAcked(oadatas){
var retData = {
//oa数据
"oadatas":oadatas,
"rand" : ++this.rand
}
if( retData.oadatas == null || retData.oadatas.length === 0 ) {
ElMessage({
message:"未找到考勤信息，请再次确认差旅报销信息。",
type:'error',
duration:5000,
showClose:true
})
}
else if(retData.oadatas.length > 1){
//1.判断是有OA是否任何一个数据是否有多条，有则发到左侧AI导航问询。
const jsonString = JSON.stringify(retData);
this.$emit('informationacked-event', jsonString);
//this.$store.commit('informationacked',retData.oadatas);
}
else {
//2.没有则直接绑定到OAtableDatas，并调用商旅接口获取商旅数据
this.OAtableDatas = oadatas;
//商旅查询接口
this.slSearch();
//报销项目信息查询
this.projectSearch();
}
},
//获取实际报销人工号
setRealReimAgenumber() {
var reimAgenumber = this.searchParams.oaEmployeeID;
if (this.searchParams.proxyReimbursementTravelerJobId != null
&& this.searchParams.proxyReimbursementTravelerJobId != "") {
reimAgenumber = this.searchParams.proxyReimbursementTravelerJobId;
}
this.searchParams.RealReimAgenumber = reimAgenumber;
},
//oa查询接口
oaSearch() {
let oaParams = {
//现在查询有用的字段
//经办人工号
agentPersonId: this.searchParams.oaEmployeeID,
//代报销人工号
reimAgenumber: this.searchParams.proxyReimbursementTravelerJobId,
startTime: this.searchParams.startTime,
endTime: this.searchParams.endTime,
//是否代报销
isProxyReimbursement: (this.searchParams.proxyReimbursementTravelerJobId != ""),
// //这些字段在界面上有啥用？？？？
//实际出差人工号
businessTravelerJobId: this.searchParams.RealReimAgenumber,
departure: this.searchParams.departure,
destination: this.searchParams.departure,
//是否关联商旅平台
isLinkedToBusinessTravelPlatform: this.isParamContains("关联商旅平台"),
//是否为加班住宿报销
isOvernightStayReimbursement: this.isParamContains("加班住宿报销"),
//是否申请差旅补助
isApplyingForTravelAllowance: this.isParamContains("申请差旅补助"),
//是否为新员工入职出差
isNewEmployeeOnboardingTrip: this.isParamContains("新员工入职出差") //新员工入职出差
}
axios({
method:"POST",
// url:'http://10.16.56.158:8083/api/context_re/cr1', //博民哥
// url:'http://10.54.69.212:8083/api/context_re/cr1', //IP
url: this.backendip + '/api/context_re/cr1', //书磊本地IP 10.16.57.166:8080
data:oaParams,
}).then(res=>{
if(res.data.code==200){
this.doInformationAcked(res.data.result.oaLst);
}else{
ElMessage.error('请求出现问题，请稍后重试！')
}
})
},
isParamContains(param) {
for (var i = 0; i < this.searchParams.checkRadioGroup.length; i++) {
var d = this.searchParams.checkRadioGroup[i];
if (d === param)
return true;
}
return false;
},
string2number(str) {
if(str === null || str === '') {
return 0;
}
var ret = 0;
try {
ret = Number(str);
} catch (err) {
ret = 0;
}
return ret;
},
extractNumber(str) {
if(str === null || str === ''){
return 0;
}
// 正则表达式匹配数字，包括小数点和货币符号
var match = str.match(/[\d.]+/);
return match ? parseFloat(match[0]) : 0;
},
convertChineDateString(dateStr) {
if(dateStr === null || dateStr === '')
return '';
const parts = dateStr.match(/(\d{4})年(\d{2})月(\d{2})日/);
if (parts) {
const year = parts[1];
const month = parts[2].padStart(2, '0'); // 确保月份为两位数
const day = parts[3].padStart(2, '0'); // 确保日期为两位数
return `${year}-${month}-${day}`;
}
return dateStr; // 如果格式不匹配，返回 dateStr
},
convertToISODateFormat(dateString) {
if(dateString === null || dateString === '')
return '';
// 尝试解析日期字符串
var retDateStr = '';
const date = new Date(dateString);
// 检查日期是否有效
if (isNaN(date.getTime())) {
// 如果无效，返回 null 或抛出错误
retDateStr = this.convertChineDateString(dateString); // 或者 throw new Error('无效的日期字符串');
} else {
// 使用Date的toISOString方法，然后切割前10个字符
retDateStr = date.toISOString().split('T')[0];
}
return retDateStr;
},
convertToISODateTimeFormat(dateTimeString) {
if(dateTimeString === null || dateTimeString === '')
return '';
var retDateStr = this.convertToISODateFormat(dateTimeString);
if (retDateStr === null || retDateStr === '') {
return '';
}
var timeStr = '';
var pos = dateTimeString.indexOf(':');
if (pos != -1) {
pos = pos - 2;
timeStr = dateTimeString.substring(pos, pos + 8);
} else {
timeStr = "00:00:00";
}
return retDateStr + "T" + timeStr;
},
// convertToISODateTimeFormat(dateString) {
// try {
// dateString = dateString.replace("年", "-");
// dateString = dateString.replace("月", "-");
// dateString = dateString.replace("日", "T");
// dateString = dateString + ":00";
// return dateString;
// }
// catch (e) {
// dateString = '';
// }
// return dateString;
// },
convertToYYYYMMDDFormat(dateString) {
if(dateString === null || dateString === '')
return '';
try {
dateString = dateString.replace("年", "");
dateString = dateString.replace("月", "");
dateString = dateString.replace("日", "");
dateString = dateString.replace("-", "");
dateString = dateString.replace("/", "");
dateString = dateString.substring(0, 8);
} catch (e) {
dateString = '';
}
return dateString;
},
//类型判断函数--输出(01,02) 是否增值税专用发票
//出租车发票、打车费定额发票、网约车发票、飞机发票、飞机行程单、过路费定额发票、火车票、住宿费普票、住宿费专票
IsSFZPCheck(invoiceType) {
if(!invoiceType || invoiceType === '')
return '';
try {
if (invoiceType == "住宿费普票" || invoiceType == "住宿费专票") {
return "01";
}
} catch (e) {
}
return "02";
},
getPOJiaoTongMode(invoiceType){
if(!invoiceType || invoiceType === '')
return '';
try {
if (invoiceType.indexOf("飞机") != -1) {
return "飞机";
}
else if (invoiceType.indexOf("火车") != -1) {
return "火车";
}
else if (invoiceType.indexOf("车") != -1) {
return "出租车";
}
else if (invoiceType.indexOf("过路费") != -1) {
return "出租车";
}
} catch (e) {
}
return "";
},
//指定行扩展的消息，格式为:rowid\tmsg
getVerifMessage(rowid, msg) {
//rowid 行号（从0开始）
var findsub = rowid.toString() + '\t';
var pos = msg.indexOf(findsub);
if (pos != -1) {
var errmsg = msg.substr(pos + findsub.length);
return errmsg;
}
return '';
},
//更新票据表单校验结果.
updateVerifMessages(messages) {
for (var i = 0; i < this.tableLists.length; i++) {
var d = this.tableLists[i];
d.msgs = [];//reset
if (messages === null)
continue;
for (var j = 0; j < messages.length; j++) {
var msg = messages[j];
var errmsg = this.getVerifMessage(i, msg);
if (errmsg != null && errmsg != '') {
var msg = {
"msg": errmsg,
};
d.msgs.push(msg);
}
}
}
},
//清空所有票据msgs
cleanInvoicMsgs() {
for (var i = 0; i < this.tableLists.length; i++) {
var s = this.tableLists[i];
s.msgs = [];//reset
}
},
//票据表单行有错误信息，则展开表单行.并返回true
isInvoicMsgs(){
this.expandRowKeys = [];
var ret = false;
for (var i = 0; i < this.tableLists.length; i++) {
var s = this.tableLists[i];
if(s.msgs != null && s.msgs.length > 0) {
ret = true;
//展开
this.expandRowKeys.push( s.serialId );
}
}
return ret;
},
//前端检测入参住宿车票数据是否符合要求
verifyHotelInvoice(i, d){
var s = this.tableLists[i];
if(!s.msgs) {
s.msgs = [];//reset
}
//城市
if(!d.city || d.city === '') {
var msg = {
"msg" : "'城市'" + "不能为空，请填写。",
};
s.msgs.push(msg);
}
//出发日期
if(!d.startTime || d.startTime === ''){
var msg = {
"msg" : "'出发日期'" + "不能为空，请填写。",
};
s.msgs.push(msg);
}
//到达日期
if(!d.endTime || d.endTime === ''){
var msg = {
"msg" : "'到达日期'" + "不能为空，请填写。",
};
s.msgs.push(msg);
}
//票价金额
if(!d.amount || d.amount <= 0){
var msg = {
"msg" : "'票价金额'" + "不能为空，请填写。",
};
s.msgs.push(msg);
}
},
//前端检测入参火车车票数据是否符合要求
verifyTrainTicketInvoice(i, d){
var s = this.tableLists[i];
if(!s.msgs) {
s.msgs = [];//reset
}
//座次
if(!d.level || d.level === '') {
var msg = {
"msg" : "'座次'" + "不能为空，请填写。",
};
s.msgs.push(msg);
}
//出发日期
if(!d.startTime || d.startTime === ''){
var msg = {
"msg" : "'出发日期'" + "不能为空，请填写。",
};
s.msgs.push(msg);
}
//票价金额
if(!d.amount || d.amount <= 0){
var msg = {
"msg" : i.toString() + '\t' + "'票价金额'" + "不能为空，请填写。",
};
s.msgs.push(msg);
}
},
//前端检测入参出租车票数据是否符合要求
verifyTaxiTicketInvoice(i, d){
var s = this.tableLists[i];
if(!s.msgs) {
s.msgs = [];//reset
}
if((s.invoiceType === "出租车发票"
|| s.invoiceType === "打车费定额发票"
|| s.invoiceType === "网约车发票"
)) {
//出发日期
if(!d.startTime || d.startTime === ''){
var msg = {
"msg" : "'出发日期'" + "不能为空，请填写。",
};
s.msgs.push(msg);
}
}
// //到达日期
// if(!d.endTime || d.endTime === ''){
// var msg = {
// "msg" : "'到达日期'" + "不能为空，请填写。",
// };
// s.msgs.push(msg);
// }
//票价金额
if(!d.amount || d.amount <= 0){
var msg = {
"msg" : i.toString() + '\t' + "'票价金额'" + "不能为空，请填写。",
};
s.msgs.push(msg);
}
if(s.invoiceType === "出租车发票"
|| s.invoiceType === "打车费定额发票"
|| s.invoiceType === "网约车发票"
){
if(!d.distance || d.distance <= 0){
var msg = {
"msg" : i.toString() + '\t' + "'距离'" + "不能为空，请填写。",
};
s.msgs.push(msg);
}
}
},
verifyAirTicketInvoice(i, d){
var s = this.tableLists[i];
if(!s.msgs) {
s.msgs = [];//reset
}
//座次
if(!d.level || d.level === '') {
var msg = {
"msg" : "'座次'" + "不能为空，请填写。",
};
s.msgs.push(msg);
}
//出发日期
if(!d.startTime || d.startTime === ''){
var msg = {
"msg" : "'出发日期'" + "不能为空，请填写。",
};
s.msgs.push(msg);
}
},
testCheckMessage(){
//测试校验返回
//test begin
for(var i = 0; i < 9; i++) {
var data = {
"invoiceType": i.toString(),
"msgs" : []
};
// if( (i % 2) === 1 ){
// var msg = {
// "msg" : "msg" + i.toString(),
// };
// data.msgs.push(msg);
// msg = {
// "msg" : "测试2" + i.toString(),
// };
// data.msgs.push(msg);
// }
this.tableLists.push(data);
}
//
var dto = {
subsidy: 100, //补贴
"messages": [
"1\t测试1错误1。",
"2\t测试2错误1。",
"1\t测试1错误2。",
"2\t测试2错误2。",
]
}
this.updateVerifMessages(dto.messages);
//test end
},
//开始校验
beginCheck() {
//test begin
// this.testCheckMessage();
// return;
//test end
if (this.OAtableDatas.length != 1) {
alert("没有考勤记录，请先进行信息填报和确认操作。");
return;
}
if (this.tableDatas.length === 0) {
alert("没有商旅记录，请先进行信息填报和确认操作。");
return;
}
//清空所有票据msgs
this.cleanInvoicMsgs();
let TravelDetailDto = {
employeeId: this.searchParams.RealReimAgenumber,//报销人工号
startTime: this.convertPODate2DotDate(this.OAtableDatas[0].start_DATE.genericDateValue),
endTime: this.convertPODate2DotDate(this.OAtableDatas[0].end_DATE.genericDateValue),
applySubsidy: this.isParamContains("申请差旅补助"), //是否申请差旅补助
// hotelInvoices:this.OAtableDatas,//商旅
//airTickets:this.tableDatas, //差旅
// trainTickets:[
// {id:'143253',type:'火车发票', distance:1, from:'北京',to:'天津', startTime:'2024-11-30T14:30:00', endTime:'2024-11-30T16:09:08', amount:400 } //出租车发票
// ],//火车
// taxiInvoices:this.tableLists //出租车发票
// taxiInvoices:[
// {id:'143253',type:'出租车发票', distance:1, from:'北京',to:'天津', startTime:'2024-11-30T14:30:00', endTime:'2024-11-30T16:09:08', amount:400 } //出租车发票
// ]
hotelInvoices: [], //住宿发票
airTickets: [], //飞机(飞机发票、飞机行程单、)
trainTickets: [],//火车
taxiInvoices: [],//出租
};
//住宿发票
for (var i = 0; i < this.tableLists.length; i++) {
//先要判断是住宿发票
var s = this.tableLists[i];
if (!(s.invoiceType === "住宿费专票" || s.invoiceType === "住宿费普票"))
continue;
var d = {
"id": (i).toString(), //这里为这个票在表单中的行号，从0开始的行号
"type": s.invoiceType, //发票类型 s.invoiceType
"province": "", //todo:省份,这个OCR没有这个字段值，由后台通过city找到所属省份
"city": this.OAtableDatas[0].trip_CITY,//s.arrivalLocation, //城市
//住宿发票没有时间
// "startTime": this.convertToISODateTimeFormat(s.startDate), //出发日期
// "endTime": this.convertToISODateTimeFormat(s.endDate), //到达日期
startTime: this.convertToISODateTimeFormat(this.OAtableDatas[0].start_DATE.genericDateValue),
endTime: this.convertToISODateTimeFormat(this.OAtableDatas[0].end_DATE.genericDateValue),
"days": 0, //todo:后台不需要这个参数，
"amount": this.extractNumber(s.ticketAmount), //票价金额
}
//前端检测入参值是否符合要求
this.verifyHotelInvoice(i, d);
//
TravelDetailDto.hotelInvoices.push(d);
}
//火车
for (i = 0; i < this.tableLists.length; i++) {
//todo: 先要判断是火车发票
var s = this.tableLists[i];
if(s.invoiceType != "火车票")
continue;
var d = {
"id": (i).toString(), //这里为这个票在表单中的行号，从0开始的行号
"type": s.invoiceType, //发票类型
"level": s.seat, //座次
"from": s.departureLocation, //出发地点
"to": s.arrivalLocation, //到达城市
"startTime": this.convertToISODateTimeFormat(s.startDate), //出发日期
"amount": this.extractNumber(s.ticketAmount), //票价金额
}
//前端检测入参值是否符合要求
this.verifyTrainTicketInvoice(i, d);
//
TravelDetailDto.trainTickets.push(d);
}
//出租(出租车发票、打车费定额发票、网约车发票、过路费定额发票)
for (i = 0; i < this.tableLists.length; i++) {
//先要判断是出租发票
var s = this.tableLists[i];
if(!(s.invoiceType === "出租车发票"
|| s.invoiceType === "打车费定额发票"
|| s.invoiceType === "网约车发票"
|| s.invoiceType === "过路费定额发票"))
continue;
var d = {
"id": (i).toString(), //这里为这个票在表单中的行号，从0开始的行号
"type": s.invoiceType, //发票类型
// "level": s.seat, //座次
"from": s.departureLocation, //出发地点
"to": s.arrivalLocation, //到达城市
"distance": s.distance,//todo:距离（单位：公里）,
"startTime": this.convertToISODateTimeFormat(s.startDate), //出发日期（出租车发票、网约车发票、网约车发票）
// "endTime": this.convertToISODateTimeFormat(s.endDate), //到达日期
"amount": this.extractNumber(s.ticketAmount), //票价金额
}
//前端检测入参值是否符合要求
this.verifyTaxiTicketInvoice(i, d);
//
TravelDetailDto.taxiInvoices.push(d);
}
//飞机票
for (i = 0; i < this.tableLists.length; i++) {
var s = this.tableLists[i];
if(!(s.invoiceType === "飞机票"
|| s.invoiceType === "飞机行程单"
|| s.invoiceType === "飞机发票"
))
continue;
var d = {
"id": (i).toString(), //这里为这个票在表单中的行号，从0开始的行号
"type": s.invoiceType, //发票类型
"level": s.seat, //座次
"from": s.departureLocation, //出发地点
"to": s.arrivalLocation, //到达城市
"startTime": this.convertToISODateTimeFormat(s.startDate), //出发日期（出租车发票、网约车发票、网约车发票）
// "endTime": this.convertToISODateTimeFormat(s.endDate), //到达日期
"ticketAmount" : 0, //todo:票价(后台暂未用)
"civilAvitationDevelopmentFund": 0, //todo:民航发展基金
"fuelSurcharge": 0, //todo:燃油附加费
"otherTaxes": 0, //todo:其他税费
"insuranceFee": 0, //todo:保险费
"totalAmount": 0, //todo:总价
"adjustedTicketAmount": 0, //todo:报销费 = 总价-保险费
}
//前端检测入参值是否符合要求
this.verifyAirTicketInvoice(i, d);
//
TravelDetailDto.taxiInvoices.push(d);
}
//票据表单行有错误信息，则展开表单行.并返回true
if( this.isInvoicMsgs()){
ElMessage.error('票据表单行有错误信息，请修改。')
return;
}
axios({
method: "POST",
url: this.backendip + '/api/travel-form/verify',
data: TravelDetailDto,
}).then(res => {
if (res.data.code === 200){
this.updateVerifMessages(res.data.result.messages);
}else{
ElMessage.error(res.data.message);
}
})
console.log(TravelDetailDto, 'TravelDetailDto');
},
//本次支付金额,所有发票税前和
calcSumTicketAmount(){
var sum = 0;
for(var i = 0; i < this.tableLists.length; i++) {
var s = this.tableLists[i];
var amount = this.extractNumber(s.ticketAmount); //票价金额
sum += amount;
}
return sum;
},
//入参-增值税票和交通发票对应PO接口的发票类型(前端判断)
getPOInvoiceType(s){
if (!s && !s.invoiceType && s.invoiceType.indexOf("专票") != -1 )
return "s";
return "c";
},
//前端检测入参-头信息是否符合要求
submitHeaderInfoCheck(d){
//利润中心
if(!d.prctr || d.prctr === ''){
var msg = {
"msg" : "'利润中心'" + "不能为空，请填写。",
};
alert(msg.msg);
return true;
}
return false;
},
//前端检测入参-行项目是否符合要求
submitIt_ItemCheck(i, d){
var s = this.tableLists[i];
if(!s.msgs) {
s.msgs = [];//reset
}
//出发日期
if(!d.cfrq || d.cfrq === ''){
var msg = {
"msg" : "'出发日期'" + "不能为空，请填写。",
};
s.msgs.push(msg);
}
//到达日期
if(!d.ddrq || d.ddrq === ''){
var msg = {
"msg" : "'到达日期'" + "不能为空，请填写。",
};
s.msgs.push(msg);
}
// //城市
// if(!d.ctkd || d.ctkd === ''){
// var msg = {
// "msg" : "'城市'" + "不能为空，请填写。",
// };
// s.msgs.push(msg);
// }
//发票金额
if(!d.zfpje || d.zfpje === '' ){
var msg = {
"msg" : "'发票金额'" + "不能为空，请填写。",
};
s.msgs.push(msg);
}
//成本中心
if(!d.kostl || d.kostl === ''){
var msg = {
"msg" : "'成本中心'" + "不能为空，请填写。",
};
s.msgs.push(msg);
}
//订单编号
if(!d.aufnr || d.aufnr === '' ){
var msg = {
"msg" : "'订单编号'" + "不能为空，请填写。",
};
s.msgs.push(msg);
}
//WBS
if(!d.posid || d.posid === ''){
var msg = {
"msg" : "'WBS'" + "不能为空，请填写。",
};
s.msgs.push(msg);
}
//出发地点
if(!d.ctkd1 || d.ctkd1 === ''){
var msg = {
"msg" : "'出发地点'" + "不能为空，请填写。",
};
s.msgs.push(msg);
}
//到达地点
if(!d.ctkd2 || d.ctkd2 === ''){
var msg = {
"msg" : "'到达地点'" + "不能为空，请填写。",
};
s.msgs.push(msg);
}
// //交通工具
// if(!d.vektp || d.vektp === '' ){
// var msg = {
// "msg" : "'交通工具'" + "不能为空，请填写。",
// };
// s.msgs.push(msg);
// }
//仓位席别
if( s.invoiceType == "火车票"
|| s.invoiceType === "飞机票"
|| s.invoiceType === "飞机行程单"
|| s.invoiceType === "飞机发票"
) {
if (!d.sps || d.sps === '') {
var msg = {
"msg": "'仓位席别'" + "不能为空，请填写。",
};
s.msgs.push(msg);
}
}
},
//前端检测入参-增值税票和交通发票是否符合要求
submitIt_zzspsCheck(i, d){
var s = this.tableLists[i];
if(!s.msgs) {
s.msgs = [];//reset
}
//发票号码
if(!d.inno || d.inno === '' ){
var msg = {
"msg" : "'发票号码'" + "不能为空，请填写。",
};
s.msgs.push(msg);
}
//发票代码
if(!d.incode || d.incode === '' ){
var msg = {
"msg" : "'发票代码'" + "不能为空，请填写。",
};
s.msgs.push(msg);
}
//税率
if ((s.invoiceType === "住宿费专票" ||
s.invoiceType === "住宿费普票")
) {
if (!d.taxrate || d.taxrate === '') {
var msg = {
"msg": "'税率'" + "不能为空，请填写。",
};
s.msgs.push(msg);
}
//税额
if(!d.taxamount || d.taxamount === '' ){
var msg = {
"msg" : "'税额'" + "不能为空，请填写。",
};
s.msgs.push(msg);
}
}
//发票金额
if(!d.awotax || d.awotax === '' ){
var msg = {
"msg" : "'发票金额'" + "不能为空，请填写。",
};
s.msgs.push(msg);
}
//发票价税合计
if(!d.awtax || d.awtax === '' ){
var msg = {
"msg" : "'发票价税合计'" + "不能为空，请填写。",
};
s.msgs.push(msg);
}
//发票开票日期
if(!d.pddate || d.pddate === '' ){
var msg = {
"msg" : "'发票开票日期'" + "不能为空，请填写。",
};
s.msgs.push(msg);
}
//开票单位
if(!d.sellername || d.sellername === '' ) {
var msg = {
"msg" : "'开票单位'" + "不能为空，请填写。",
};
s.msgs.push(msg);
}
// //发票联次
// if(!d.liantype || d.liantype === '' ){
// var msg = {
// "msg" : "'发票联次'" + "不能为空，请填写。",
// };
// s.msgs.push(msg);
// }
},
submitIt_zzspsCheck2(i, d){
var s = this.tableLists[i];
if(!s.msgs) {
s.msgs = [];//reset
}
//发票号码
if(!d.inno || d.inno === '' ){
var msg = {
"msg" : "'发票号码'" + "不能为空，请填写。",
};
s.msgs.push(msg);
}
//发票代码
if(!d.incode || d.incode === '' ){
var msg = {
"msg" : "'发票代码'" + "不能为空，请填写。",
};
s.msgs.push(msg);
}
//发票开票日期
if(!d.pddate || d.pddate === '' ){
var msg = {
"msg" : "'发票开票日期'" + "不能为空，请填写。",
};
s.msgs.push(msg);
}
if( s.invoiceType === "网约车发票" ) {
//纳税人识别号
if (!d.nsrsbh || d.nsrsbh === '' ) {
var msg = {
"msg": "'纳税人识别号'" + "不能为空，请填写。",
};
s.msgs.push(msg);
//纳税人名称
if (!d.nsrmc || d.nsrmc === '' ) {
var msg = {
"msg": "'纳税人名称'" + "不能为空，请填写。",
};
s.msgs.push(msg);
}
}
}
},
submit_travel_form(isHeader, itGlslsq, itItems, itZzsp){
//入参-头信息 header_data,
//入参-商旅 sl_datas
//入参-行项目 it_items
//入参-增值税票和交通发票 it_zzsps
var tjdata = {
"inZczlx" : "1", //创建 默认1
//入参-头信息
"isHeader" : isHeader,
//入参-商旅
"itGlslsq" : itGlslsq,
//入参-行项目
"itItems" : itItems,
//入参-增值税票和交通发票
"itZzsp" : itZzsp
};
axios({
method:"POST",
url: this.backendip +'/api/travel-form/submit',
data:tjdata,
}).then(res=>{
if(res.data.code==200){
ElMessage.info(res.data.result.message)
}
else {
ElMessage.error(res.data.message)
}
})
// console.log(TravelDetailDto,'TravelDetailDto');
},
//确认提交报销单据
confirmAllPageCon(){
//清空所有票据msgs
this.cleanInvoicMsgs();
//入参-头信息
var isHeader = {
"bukes" : "9200",
"pernr" : this.searchParams.RealReimAgenumber, //经办人编号
"prctr" : this.searchParams2.profitCenter, //利润中心
"fjzs" : this.tableLists.length, //实际附件张数
"waers" : "CNY",
"bczfje" : this.calcSumTicketAmount(), //本次支付金额,所有发票税前和
"etkd" : "CL001",
"note" : this.searchParams2.PurBusTrip,
"sfbs" : "2",//付款
"zsysfrom" : "31",
"zglsl" : this.isParamContains("关联商旅平台") ? "X" : null,
};
//前端检测入参值是否符合要求
if(this.submitHeaderInfoCheck(isHeader) )
return;
//入参-商旅
var sl_datas = [];
for(var i = 0; i < this.tableDatas.length; i++){
var s = this.tableDatas[i];
var d = {
"recode": s.recode,
"doctype": s.doctype,
"posnr": s.posnr,
"id": s.id,
}
sl_datas.push(d);
}
//入参-行项目
var it_items = [];
for(i = 0; i < this.tableLists.length; i++){
var s = this.tableLists[i];
var startDate = this.convertToYYYYMMDDFormat(s.startDate); //出发日期,格式要求：YYYYMMDD
var endDate = this.convertToYYYYMMDDFormat(s.endDate); //到达日期,格式要求：YYYYMMDD
if ((s.invoiceType === "住宿费专票" || s.invoiceType === "住宿费普票")) {
//住宿发票没有时间
startDate = this.convertToYYYYMMDDFormat(this.OAtableDatas[0].start_DATE.genericDateValue);
endDate = this.convertToYYYYMMDDFormat(this.OAtableDatas[0].end_DATE.genericDateValue);
}
var d = {
"pernrb" : this.searchParams.RealReimAgenumber, //报销人编号
"cfrq" : startDate, //出发日期,格式要求：YYYYMMDD
"ddrq" : endDate, //到达日期,格式要求：YYYYMMDD
"ctkd" : s.arrivalLocation, //todo:城市编码,用导出的编码表
"wrbtr" : this.string2number(s.invoiceTotalAmountIncludingTax), //凭证货币金额 合计金额
"sfzp" : this.IsSFZPCheck(s.invoiceType),//类型判断函数--输出(01,02) 是否增值税专用发票
"zfpje" : this.string2number(s.invoiceAmount), //发票金额
"kostl" : this.searchParams2.profitCenter, //成本中心
"aufnr" : this.searchParams2.OrderNo, //订单编号
"posid" : this.searchParams2.WbsNumber, //工作分解结构元素 (WBS 元素) ---》WBS编号
"posnr" : (i + 1).toString(), //行号（计算总行数）?票据行号，从1开始
//todo: ctkd1 ctkd2 .....??
"ctkd1" : s.departureLocation, //出发地点
"ctkd2" : s.arrivalLocation, //到达地点
"vektp" : this.getPOJiaoTongMode(s.invoiceType), //todo:交通工具
"sps" : s.seat, //仓位席别(火车、飞机)
"zsxf" : 0, //手续费
}
//前端检测入参值是否符合要求
this.submitIt_ItemCheck(i, d);
//
it_items.push(d);
}
//入参-增值税票和交通发票
var it_zzsps = [];
//入参-增值税票
for(i = 0; i < this.tableLists.length; i++){
var s = this.tableLists[i];
//todo: 先要判断是增值税票
if (!(s.invoiceType === "住宿费专票" || s.invoiceType === "住宿费普票"))
continue;
var d = {
"invoiceid": "", //todo:票据上传到影像接口会返回提供影像ID。故前端传""
"posnr": (i + 1).toString(), //单据行项目 票据行号，从1开始
"inno": s.invoiceId, //发票号码
"intype": this.getPOInvoiceType(s.invoiceType), //PO接口发票类型
"intypetrue": "", //todo:票据上传到影像接口会返回提供发票类型(外部影像系统)。故前端传""
"incode": s.invoiceCode, //发票代码(现在电子票没有这个)
"verifystatus": "", //todo:票据上传到影像接口会返回提供发票验真标志。故前端传""
"vtext": "", //todo:票据上传到影像接口会返回提供验真状态描述。故前端传""
"taxrate": this.string2number(s.invoiceTaxRate), //税率
"awotax": this.string2number(s.invoiceAmount),//不含税金额 --->发票金额
"taxamount": this.string2number(s.deductibleInvoiceTaxAmount), //税额
"awtax": this.string2number(s.invoiceTotalAmountIncludingTax), //含税金额---->发票价税合计
"zbcje": this.string2number(s.invoiceTotalAmountIncludingTax), //本次报销金额
"zbcse": this.string2number(s.deductibleInvoiceTaxAmount), //本次报销税额
"pddate": this.convertToYYYYMMDDFormat(s.startDate), //发票开票日期
"sellername": s.billingUnit, //todo:开票单位billingUnit??不能为空？问题
"imageid": s.originalImage, //todo:s.originalImage票据上传到影像接口会返回提供影像返回的唯一id。故前端传传IMAGE BASE64，后端需要替换成影像接口的imageid
"liantype": s.invoiceNumber, //todo:发票联次???
}
//前端检测入参值是否符合要求
this.submitIt_zzspsCheck(i, d);
//
it_zzsps.push(d);
}
//入参-交通发票
for(i = 0; i < this.tableLists.length; i++){
var s = this.tableLists[i];
if (!
(
s.invoiceType === "出租车发票"
|| s.invoiceType === "打车费定额发票"
|| s.invoiceType === "网约车发票"
|| s.invoiceType === "过路费定额发票"
|| s.invoiceType === "火车票"
)
)
continue;
var d = {
"invoiceid": "1", //todo:票据上传到影像接口会返回提供影像ID。故前端传""
"posnr": (i + 1).toString(), //单据行项目 票据行号，从1开始
"inno": s.invoiceId, //发票号码
"intype": "汽车",//this.getPOInvoiceType(s.invoiceType), //PO接口发票类型,默认为汽车
"intypetrue": "汽车", //todo:票据上传到影像接口会返回提供发票类型(外部影像系统)。故前端传""
"incode": s.invoiceCode, //发票代码
"zbcje": this.string2number(s.invoiceTotalAmountIncludingTax), //本次报销金额
"pddate": this.convertToYYYYMMDDFormat(s.startDate), //发票开票日期
"imageid": "", //todo:s.originalImage票据上传到影像接口会返回提供影像返回的唯一id。故前端传""
"nsrsbh": s.taxpayerIdNumber, //纳税人识别号
"nsrmc": s.invoiceTitle //纳税人名称
}
//前端检测入参值是否符合要求
this.submitIt_zzspsCheck2(i, d);
//
it_zzsps.push(d);
}
//票据表单行有错误信息，则展开表单行.并返回true
if(++this.submitCount < 2 && this.isInvoicMsgs()){
ElMessage.error('票据表单行有错误信息，请修改。')
return;
}
//
this.submit_travel_form(isHeader, sl_datas, it_items, it_zzsps);
this.submitCount = 0;
},
//二次确定操作栏
deletediaInfo(index,row){
this.confirmInfoLists.splice(index, 1)
},
saveDiaInfo(index,row){
row.edit = false
},
editDiaInfo(index,row){
row.edit = true
},
/**
*
* @param index 以下为费用明细操作栏处理
* @param row
*/
//删除某条数据
deleteInfoCon(index,row){
this.tableLists.splice(index, 1)
},
//保存数据
saveInfoCon(index,row){
row.edit = false
// this.tableLists={
// ...row
// }
console.log(index,row,this.tableLists,'看看保存状态');
},
//编辑行数据
editInfoCon(index,row){
row.edit = true
console.log(index,row,'看看编辑状态');
},
//编辑表格
tableDbEdit(row, column, cell, event){
},
//上传成功后的函数
// handleSuccess(response, file, fileList){
// // 如果需要上传
// this.getTableData()
// console.log(file);
//
// this.convertToBase64(file.raw).then(base64 => {
// console.log(base64);
// // 在这里你可以使用base64数据，例如可以将其设置到某个数据属性上
// });
// },
// //预览图片
// handlePictureCardPreview(file){
// alert(file)
// // file.url 复制给预览图img
// // this.srcUrl = file.url
// },
//获取差旅费用明细数据
getTableData(img){
axios({
method:"POST",
url:this.backendip + '/api/ocr/base64',
data:{image_base64:img.image_baae64},
headers: {
'Content-Type': 'application/json'
}
})
.then(res=> {
//this.$nextTick(()=>{
if(res.status === 200){
res.data.serialId = this.tableLists.length;
this.tableLists.push(res.data);
// this.tableLists.forEach((item)=>{
// item.originalImage = "data:image/jpeg;base64,"+item.originalImage
// })
console.log(this.tableLists, 'lokkkkk');
}else{
}
})
.catch(error => {
if (error.response) {
// 服务器返回了错误状态码
const status = error.response.status;
const data = error.response.data;
alert("服务器返回错误状态码:" + status);
// 根据状态码进行相应的处理
} else if (error.request) {
// 网络错误或请求超时等
console.error('请求出现问题，请稍后重试');
alert('请求出现问题，请稍后重试');
} else {
// 一些未知错误
console.error('发生了未知错误');
alert('发生了未知错误');
}
})
},
//票据上传
onSelectFile(event) {
const file = event.target.files[0];
if (!file) {
return;
}
const reader = new FileReader();
reader.onload = (e) => {
var face64 = e.target.result;
var pos = face64.indexOf(';base64,');
face64 = face64.substr(pos + ';base64,'.length)
var image = {
"image_baae64": face64
};
this.getTableData(image);
//
const fileInput = document.getElementById('default-btn');
fileInput.value = ''; // 重置文件输入
};
reader.readAsDataURL(file);
},
// change事件 每次选择文件后触发的事件
uploadimgChange(file, fileList){
this.imgfileList.push(file)
},
// 删除某个已上传的图片
handleRemove(file, fileList){
this.imgfileList.splice(index, 1)
},
infoConfirm() {
//信息确认
//出发地点
// if(this.searchParams.departure === ""){
// ElMessage({
// message: "请填写出发地点",
// type: "error",
// duration: 5000,
// showClose: true,
// });
// return ;
// }
//到达地点
// if(this.searchParams.destination === ""){
// ElMessage({
// message: "请填写到达地点",
// type: "error",
// duration: 5000,
// showClose: true,
// });
// return ;
// }
//起始时间
if(this.searchParams.startTime === ""){
ElMessage.error('请填写起始时间。')
return ;
}
//结束时间
if(this.searchParams.endTime === ""){
ElMessage.error('请填写结束时间。')
return ;
}
//获取实际报销人工号
this.setRealReimAgenumber();
//先做OA查询,再做商旅查询，最后是报销项目信息查询
this.oaSearch();
//提交成功后显示表格
// this.showTable=!this.showTable
},
},
};
</script>
<style scoped lang="less">
#bzTextInfo{
color: red;
}
.m4_con p{
font-weight: 400;
}
.ml_20{
margin-left: 20px;
}
.m_20_error{
width: 18px;
height: 18px;
background-color: red;
color: #ffffff;
font-size: 14px;
margin: 0 20px;
font-weight: 800;
display: inline-block;
border-radius: 50%;
text-align: center;
line-height: 18px;
}
#default-btn::file-selector-button{
padding: 6px 42px;
/*padding-left: 8px;*/
background-color: #0B6CF8;
border: 1px solid #0B6CF8;
border-radius: 3px;
cursor: pointer;
color: #fff;
font-size: 16px;
font-weight: 500;
width:130px;
}
#default-btn{
font-size: 0;
}
.m4_con{
// padding:20px 68px;
padding: 0 92px;
// background-color: #FFF1F1;
border: 2px solid #ED1D1D;
}
.scroll-container{
// height: 1800px; /* 模拟长内容 */
overflow-y: scroll;
}
.container {
background-color: #fff;
margin: 18px 13px;
// height: 2308px;
border-radius: 7px;
}
.title{
display: flex;
justify-content: space-between;
border-bottom: 1px solid #E8E8E8;
height: 48px;
line-height: 48px;
}
.content{
// padding: 54px 48px;
padding: 35px 48px;
}
.title1{
// display: flex;
display: flex;
.titleRight{
font-weight: 800;
font-size: 15px;
}
}
img{
width: 18px;
margin-right: 10px;
margin-top: 14px;
margin-left: 24px;
}
.myBottom{
margin-left: 328px;
// margin-top: 38px;
// display: flex;
// justify-content: center;
// margin-top: 38px;
button{
// width: 240px;
// height: 38px;
// font-size: 18px;
// width: 156px;
height: 36px;
font-size: 16px;
// margin-left: 265px;
background: #0B6CF8;
border: 1px solid #0B6CF8;
}
}
// .dialog {
// background-color: pink;
// // background: url(../../assets/bg.png) no-repeat center !important;
// // background-size: cover;
// // background-position: center;
// }
// 文件管理对话框
/deep/ .el-dialog {
background: transparent;
background-image: url("../../assets/bg.png");
background-size: cover;
height: 60vh;
}
/deep/ .el-dialog__title, .el-dialog__headerbtn .el-dialog__close{
color: #027DDD;
font-weight: 800;
font-size: 20px;
}
.dialog-form{
// border: 1px solid #027DDD;
border-radius: 8px;
padding-top: 10px 48px;
}
.el-table .borderColor{
border:1px solid red !important;
}
.img-size{
margin-left: 0;
margin-top: 0;
}
</style>
扫一扫
03-26
5928
5928
10-25
4660
4660
10-13
8710
8710
06-21
1万+
1万+
02-28
5203
5203
12-21
8822
8822
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
