c-chengc1/zhgh_nau
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

commit

Browse Source
This commit is contained in:
c-zhouhf1
2026-07-03 17:10:35 +08:00
parent 2e3c3e87da
commit 6380842b34
21 changed files with 2925 additions and 918 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/main/resources/views/platform/zhghh5/dayofficework/unionReimburse/apply/index.html
+734 -115
View File
File diff suppressed because it is too large Load Diff
src/main/resources/views/platform/zhghh5/dayofficework/unionReimburse/info.js
+592 -144
View File
@@ -2,118 +2,263 @@ const UNION_REIMBURSE_INFO = {
template:
/*language=HTML*/
`
<van-action-sheet v-model="visible" title="查看详情">
<van-action-sheet v-model="visible" class="union-reimburse-info-sheet">
<div class="union-info-header">
<div class="union-info-header-title">查看详情</div>
<div class="union-info-close" @click="onClose">
<van-icon name="cross"></van-icon>
</div>
</div>
<div class="detail-container">
<van-cell-group title="报销申请">
<van-cell title="工号">{{ viewData.loginName }}</van-cell>
<van-cell title="经办人">{{ viewData.userName }}</van-cell>
<van-cell title="联系方式">{{ viewData.mobile }}</van-cell>
<van-cell title="经费来源">
<dict-tag :options="dict.type.UNION_REIMBURSE_FUND_SOURCE"
:value="viewData.reimburseFundSource">
</dict-tag>
</van-cell>
<van-cell title="报销项目">
<dict-tag :options="dict.type.UNION_REIMBURSE_PROJECT"
:value="viewData.reimburseProject">
</dict-tag>
</van-cell>
<van-cell title="支付方式">
<dict-tag :options="dict.type.UNION_REIMBURSE_PAYMENT_WAY"
:value="viewData.paymentWay">
</dict-tag>
</van-cell>
<van-cell title="所属协会" v-if="viewData.reimburseFundSource === 'UNION_REIMBURSE_FUND_SOURCE_3'">
{{ viewData.clubName }}
</van-cell>
<van-cell title="余额" v-if="viewData.reimburseFundSource">{{ formatMoney(viewData.fundBalance) }}</van-cell>
<div class="union-info-scroll">
<div class="union-info-section">
<div class="union-info-section-title">报销申请</div>
<div class="union-info-row">
<div class="union-info-label">工号</div>
<div class="union-info-value">{{ viewData.loginName }}</div>
</div>
<div class="union-info-row">
<div class="union-info-label">经办人</div>
<div class="union-info-value union-info-link">{{ viewData.userName }}</div>
</div>
<div class="union-info-row">
<div class="union-info-label">联系方式</div>
<div class="union-info-value">{{ viewData.mobile }}</div>
</div>
<div class="union-info-row">
<div class="union-info-label">经费来源</div>
<div class="union-info-value">
<dict-tag :options="dict.type.UNION_REIMBURSE_FUND_SOURCE" :value="viewData.reimburseFundSource"></dict-tag>
</div>
</div>
<div class="union-info-row">
<div class="union-info-label">报销项目</div>
<div class="union-info-value">
<dict-tag :options="dict.type.UNION_REIMBURSE_PROJECT" :value="viewData.reimburseProject"></dict-tag>
</div>
</div>
<div class="union-info-row" v-if="viewData.reimburseFundSource === 'UNION_REIMBURSE_FUND_SOURCE_3'">
<div class="union-info-label">所属协会</div>
<div class="union-info-value">{{ viewData.clubName }}</div>
</div>
<div class="union-info-row" v-if="viewData.reimburseFundSource">
<div class="union-info-label">余额</div>
<div class="union-info-value">{{ formatMoney(viewData.fundBalance) }}</div>
</div>
</div>
<template v-if="viewData.paymentWay === 'UNION_REIMBURSE_PAYMENT_WAY_2'">
<van-cell title="付款人">{{ viewData.payerName }}</van-cell>
<van-cell title="户名">{{ viewData.bankUserName }}</van-cell>
<van-cell title="开户行">{{ viewData.bankOfDeposit }}</van-cell>
<van-cell title="银行卡号">{{ viewData.bankCardNumber }}</van-cell>
</template>
<div class="union-info-section">
<div class="union-info-section-title">支付信息</div>
<template v-if="paymentInfoRows.length">
<div class="union-payment-tabs">
<div class="union-payment-tab"
:class="{active: index === currentPaymentIndex}"
v-for="(item, index) in paymentInfoRows"
:key="index"
@click="swipeToPayment(index)">支付信息{{ index + 1 }}</div>
</div>
<van-swipe ref="paymentInfoSwipe" :loop="false" :show-indicators="false" @change="handlePaymentSwipeChange">
<van-swipe-item v-for="(item, index) in paymentInfoRows" :key="index">
<div class="union-info-row">
<div class="union-info-label">支付方式</div>
<div class="union-info-value">{{ getPaymentWayText(item.paymentWay) }}</div>
</div>
<div class="union-info-row">
<div class="union-info-label">金额</div>
<div class="union-info-value">{{ formatMoney(item.money) }}</div>
</div>
<template v-if="item.paymentWay === 'UNION_REIMBURSE_PAYMENT_WAY_2'">
<div class="union-info-row">
<div class="union-info-label">付款人</div>
<div class="union-info-value">{{ item.payerName }}</div>
</div>
<div class="union-info-row">
<div class="union-info-label">户名</div>
<div class="union-info-value">{{ item.bankUserName }}</div>
</div>
<div class="union-info-row">
<div class="union-info-label">开户行</div>
<div class="union-info-value">{{ item.bankOfDeposit }}</div>
</div>
<div class="union-info-row">
<div class="union-info-label">银行卡号</div>
<div class="union-info-value">{{ item.bankCardNumber }}</div>
</div>
</template>
</van-swipe-item>
</van-swipe>
</template>
<div class="union-empty-text" v-else>暂无支付信息</div>
</div>
<template v-if="viewData.reimburseProject === 'UNION_REIMBURSE_PROJECT_1'">
<van-cell title="慰问对象">{{ viewData.condolenceUserName }}</van-cell>
<van-cell title="性别">{{ viewData.condolenceSex }}</van-cell>
<van-cell title="生日">{{ formatDateText(viewData.condolenceBirthday) }}</van-cell>
<van-cell title="身份证号">{{ viewData.condolenceIdCard }}</van-cell>
<van-cell title="联系方式">{{ viewData.condolenceMobile }}</van-cell>
<van-cell title="慰问类型">{{ viewData.typeName || viewData.condolenceTypeName }}</van-cell>
<van-cell title="慰问方式">{{ viewData.way }}</van-cell>
<van-cell title="慰问金额">{{ formatMoney(viewData.condolenceMoney) }}</van-cell>
<van-cell title="慰问时间">{{ formatDateText(viewData.condolenceTime) }}</van-cell>
<van-cell title="结婚时间" v-if="isCondolenceType('cf4ce7af322d464f8f86d818fcc00203')">
{{ formatDateText(viewData.marryTime) }}
</van-cell>
<van-cell title="生育时间" v-if="isCondolenceType('c90cb10dce6542e99ae271bee6fe8cc0')">
{{ formatDateText(viewData.fertilityTime) }}
</van-cell>
<div class="union-info-section" v-if="viewData.reimburseProject === 'UNION_REIMBURSE_PROJECT_1'">
<div class="union-info-section-title">慰问信息</div>
<div class="union-info-row">
<div class="union-info-label">慰问对象</div>
<div class="union-info-value">{{ viewData.condolenceUserName }}</div>
</div>
<div class="union-info-row">
<div class="union-info-label">性别</div>
<div class="union-info-value">{{ viewData.condolenceSex }}</div>
</div>
<div class="union-info-row">
<div class="union-info-label">生日</div>
<div class="union-info-value">{{ formatDateText(viewData.condolenceBirthday) }}</div>
</div>
<div class="union-info-row">
<div class="union-info-label">身份证号</div>
<div class="union-info-value">{{ viewData.condolenceIdCard }}</div>
</div>
<div class="union-info-row">
<div class="union-info-label">联系方式</div>
<div class="union-info-value">{{ viewData.condolenceMobile }}</div>
</div>
<div class="union-info-row">
<div class="union-info-label">慰问类型</div>
<div class="union-info-value">{{ viewData.typeName || viewData.condolenceTypeName }}</div>
</div>
<div class="union-info-row">
<div class="union-info-label">慰问方式</div>
<div class="union-info-value">{{ viewData.way }}</div>
</div>
<div class="union-info-row">
<div class="union-info-label">慰问金额</div>
<div class="union-info-value">{{ formatMoney(viewData.condolenceMoney) }}</div>
</div>
<div class="union-info-row">
<div class="union-info-label">慰问时间</div>
<div class="union-info-value">{{ formatDateText(viewData.condolenceTime) }}</div>
</div>
<div class="union-info-row" v-if="isCondolenceType('cf4ce7af322d464f8f86d818fcc00203')">
<div class="union-info-label">结婚时间</div>
<div class="union-info-value">{{ formatDateText(viewData.marryTime) }}</div>
</div>
<div class="union-info-row" v-if="isCondolenceType('c90cb10dce6542e99ae271bee6fe8cc0')">
<div class="union-info-label">生育时间</div>
<div class="union-info-value">{{ formatDateText(viewData.fertilityTime) }}</div>
</div>
<template v-if="isCondolenceType('4e316737e71047e0b01aea78524c1416')">
<van-cell title="住院病由">{{ viewData.hospitalCausation }}</van-cell>
<van-cell title="住院开始时间">{{ formatDateText(viewData.hospitalizationStartTime) }}</van-cell>
<van-cell title="住院结束时间">{{ formatDateText(viewData.hospitalizationEndTime) }}</van-cell>
<van-cell title="入住医院">{{ viewData.hospital }}</van-cell>
<van-cell title="当年次数">{{ viewData.hospitalCount }}</van-cell>
<div class="union-info-row">
<div class="union-info-label">住院病由</div>
<div class="union-info-value">{{ viewData.hospitalCausation }}</div>
</div>
<div class="union-info-row">
<div class="union-info-label">住院开始时间</div>
<div class="union-info-value">{{ formatDateText(viewData.hospitalizationStartTime) }}</div>
</div>
<div class="union-info-row">
<div class="union-info-label">住院结束时间</div>
<div class="union-info-value">{{ formatDateText(viewData.hospitalizationEndTime) }}</div>
</div>
<div class="union-info-row">
<div class="union-info-label">入住医院</div>
<div class="union-info-value">{{ viewData.hospital }}</div>
</div>
<div class="union-info-row">
<div class="union-info-label">当年次数</div>
<div class="union-info-value">{{ viewData.hospitalCount }}</div>
</div>
</template>
<template v-if="isCondolenceType('60f03a87b62b4823855814afdbf5672a')">
<van-cell title="去逝时间">{{ formatDateText(viewData.deathTime) }}</van-cell>
<van-cell title="与被慰问人关系">{{ viewData.condolenceRelationship }}</van-cell>
<div class="union-info-row">
<div class="union-info-label">去逝时间</div>
<div class="union-info-value">{{ formatDateText(viewData.deathTime) }}</div>
</div>
<div class="union-info-row">
<div class="union-info-label">与被慰问人关系</div>
<div class="union-info-value">{{ viewData.condolenceRelationship }}</div>
</div>
</template>
<van-cell title="参加随行人员">
<div style="white-space: pre-line">{{ viewData.participants }}</div>
</van-cell>
<van-cell title="报销事由">
<div style="white-space: pre-line">{{ viewData.paymentNotes }}</div>
</van-cell>
<van-cell title="备注">
<div style="white-space: pre-line">{{ viewData.notes }}</div>
</van-cell>
</template>
<div class="union-info-row">
<div class="union-info-label">参加随行人员</div>
<div class="union-info-value">{{ viewData.participants }}</div>
</div>
<div class="union-info-row">
<div class="union-info-label">报销事由</div>
<div class="union-info-value">{{ viewData.paymentNotes }}</div>
</div>
<div class="union-info-row">
<div class="union-info-label">备注</div>
<div class="union-info-value">{{ viewData.notes }}</div>
</div>
</div>
<template v-if="viewData.reimburseProject && viewData.reimburseProject !== 'UNION_REIMBURSE_PROJECT_1'">
<van-cell title="活动名称">{{ viewData.activityName }}</van-cell>
<van-cell title="活动人数">{{ viewData.activityNumber }}</van-cell>
<van-cell title="活动地点">{{ viewData.activityPlace }}</van-cell>
<van-cell title="活动时间">{{ formatDateText(viewData.activityTime) }}</van-cell>
<van-cell title="支付内容">
<div style="white-space: pre-line">{{ viewData.paymentNotes }}</div>
</van-cell>
</template>
<div class="union-info-section" v-if="viewData.reimburseProject && viewData.reimburseProject !== 'UNION_REIMBURSE_PROJECT_1'">
<div class="union-info-section-title">活动信息</div>
<div class="union-info-row">
<div class="union-info-label">活动名称</div>
<div class="union-info-value union-info-link">{{ viewData.activityName }}</div>
</div>
<div class="union-info-row">
<div class="union-info-label">活动人数</div>
<div class="union-info-value">{{ viewData.activityNumber }}</div>
</div>
<div class="union-info-row">
<div class="union-info-label">活动地点</div>
<div class="union-info-value">{{ viewData.activityPlace }}</div>
</div>
<div class="union-info-row">
<div class="union-info-label">活动时间</div>
<div class="union-info-value">{{ formatDateText(viewData.activityTime) }}</div>
</div>
<div class="union-info-row">
<div class="union-info-label">支付内容</div>
<div class="union-info-value">{{ viewData.paymentNotes }}</div>
</div>
</div>
<van-cell title="附件">
<template #label>
<file-preview :files="viewData.files" complete_result
v-if="viewData.files && viewData.files.length > 0"></file-preview>
<span v-else>暂无附件</span>
</template>
</van-cell>
</van-cell-group>
<div class="union-info-section">
<div class="union-info-section-title">附件</div>
<div class="union-file-preview" v-if="viewData.files && viewData.files.length > 0">
<file-preview :files="viewData.files" complete_result></file-preview>
</div>
<div class="union-empty-text" v-else>暂无附件</div>
</div>
<van-cell-group title="电子发票" v-if="viewData.reimburseProject">
<van-cell title="报销金额">{{ formatMoney(viewData.money) }}</van-cell>
<van-cell title="发票张数">{{ viewData.invoiceNumber }}</van-cell>
<van-cell title="发票明细列表">
<template #label>
<template v-if="viewData.invoiceDetails && viewData.invoiceDetails.length > 0">
<div style="margin-top: 8px; padding: 10px 12px; border: 1px solid #ebedf0; border-radius: 6px; background: #fafafa;" v-for="(item, index) in viewData.invoiceDetails" :key="index">
<div style="margin-top: 4px; color: #323233;">第{{ index + 1 }}张发票</div>
<div style="margin-top: 4px;">发票号码：{{ item.invoiceNo || '未填写' }}</div>
<div style="margin-top: 4px;">发票金额：{{ formatMoney(item.invoiceAmount) }}</div>
<div style="margin-top: 4px;">销售方信息名称：{{ item.sellerName || '未填写' }}</div>
<div style="margin-top: 4px;">项目名称：{{ item.itemName || '未填写' }}</div>
<div style="margin-top: 4px;" v-if="item.remark">备注：{{ item.remark }}</div>
<file-preview :files="item.invoiceFiles" complete_result
v-if="item.invoiceFiles && item.invoiceFiles.length > 0"></file-preview>
<div style="margin-top: 4px;" v-else>文件：未上传</div>
<div class="union-info-section" v-if="viewData.reimburseProject">
<div class="union-info-section-title">电子发票</div>
<div class="union-info-row">
<div class="union-info-label">报销金额</div>
<div class="union-info-value">{{ formatMoney(viewData.money) }}</div>
</div>
<div class="union-info-row">
<div class="union-info-label">发票张数</div>
<div class="union-info-value">{{ viewData.invoiceNumber }}</div>
</div>
<div class="union-invoice-subtitle">发票明细表</div>
<div class="union-invoice-card-list" v-if="viewData.invoiceDetails && viewData.invoiceDetails.length > 0">
<div class="union-invoice-card" v-for="(item, index) in viewData.invoiceDetails" :key="index">
<div class="union-invoice-card-title">第{{ index + 1 }}张发票</div>
<div class="union-info-row">
<div class="union-info-label">发票号码</div>
<div class="union-info-value">{{ item.invoiceNo || '未填写' }}</div>
</div>
</template>
<van-empty description="暂无发票明细" v-else></van-empty>
</template>
</van-cell>
</van-cell-group>
<div class="union-info-row">
<div class="union-info-label">发票金额</div>
<div class="union-info-value">{{ formatMoney(item.invoiceAmount) }}</div>
</div>
<div class="union-info-row">
<div class="union-info-label">销售方名称</div>
<div class="union-info-value">{{ item.sellerName || '未填写' }}</div>
</div>
<div class="union-info-row">
<div class="union-info-label">项目名称</div>
<div class="union-info-value">{{ item.itemName || '未填写' }}</div>
</div>
<div class="union-info-row">
<div class="union-info-label">备注</div>
<div class="union-info-value">{{ item.remark || '未填写' }}</div>
</div>
<template v-if="item.invoiceFiles && item.invoiceFiles.length > 0">
<div class="union-file-preview union-invoice-file-preview">
<file-preview :files="item.invoiceFiles" complete_result></file-preview>
</div>
</template>
<div class="union-empty-text" v-else>文件：未上传</div>
</div>
</div>
<van-empty description="暂无发票明细" v-else></van-empty>
</div>
<!-- <van-cell-group title="电子签名">-->
<!-- <van-cell title="签字">-->
@@ -126,47 +271,54 @@ const UNION_REIMBURSE_INFO = {
<!-- </van-cell>-->
<!-- </van-cell-group>-->
<template v-for="(task,index) in doneTasks">
<div class="process-title">
{{ task.displayName }}
</div>
<van-cell-group v-if="task.ext.isFirstTaskNode">
<van-cell title="申请用户">
{{ task.ext.initiatorName}}({{task.ext.initiatorAccount}})
</van-cell>
<van-cell title="申请时间">
{{ formatCreateTime(task.finishTime) }}
</van-cell>
<van-cell title="办理结果">
<dict-tag :options="dict.type.PROCESS_TASK_SUBMIT_TYPE"
:value="task.ext.submitType"></dict-tag>
</van-cell>
</van-cell-group>
<van-cell-group v-else>
<van-cell title="办理用户">
{{ task.taskFormData.userName}}({{task.taskFormData.loginName}})
</van-cell>
<van-cell title="办理时间">
{{ formatCreateTime(task.finishTime) }}
</van-cell>
<van-cell title="办理结果">
<dict-tag :options="dict.type.PROCESS_TASK_SUBMIT_TYPE"
:value="task.ext.submitType"></dict-tag>
</van-cell>
<van-cell title="办理意见" v-if="!task.ext.isFirstTaskNode">
<template #label>
{{
task.taskFormData.opinion
}}
<template v-for="(task,index) in doneTasks">
<div class="union-info-section">
<div class="process-title">{{ task.displayName }}</div>
<template v-if="task.ext.isFirstTaskNode">
<div class="union-info-row">
<div class="union-info-label">申请用户</div>
<div class="union-info-value">{{ task.ext.initiatorName}}({{task.ext.initiatorAccount}})</div>
</div>
<div class="union-info-row">
<div class="union-info-label">申请时间</div>
<div class="union-info-value">{{ formatCreateTime(task.finishTime) }}</div>
</div>
<div class="union-info-row">
<div class="union-info-label">办理结果</div>
<div class="union-info-value">
<dict-tag :options="dict.type.PROCESS_TASK_SUBMIT_TYPE" :value="task.ext.submitType"></dict-tag>
</div>
</div>
</template>
</van-cell>
<van-cell title="签字" v-if="!task.ext.isFirstTaskNode">
<van-image :src="task.ext.tf_userSign"
v-if="task.ext.tf_userSign"
class="signature-image"></van-image>
</van-cell>
</van-cell-group>
</template>
<template v-else>
<div class="union-info-row">
<div class="union-info-label">办理用户</div>
<div class="union-info-value">{{ task.taskFormData.userName}}({{task.taskFormData.loginName}})</div>
</div>
<div class="union-info-row">
<div class="union-info-label">办理时间</div>
<div class="union-info-value">{{ formatCreateTime(task.finishTime) }}</div>
</div>
<div class="union-info-row">
<div class="union-info-label">办理结果</div>
<div class="union-info-value">
<dict-tag :options="dict.type.PROCESS_TASK_SUBMIT_TYPE" :value="task.ext.submitType"></dict-tag>
</div>
</div>
<div class="union-info-row" v-if="!task.ext.isFirstTaskNode">
<div class="union-info-label">办理意见</div>
<div class="union-info-value">{{ task.taskFormData.opinion }}</div>
</div>
<div class="union-info-row" v-if="!task.ext.isFirstTaskNode && task.ext.tf_userSign">
<div class="union-info-label">签字</div>
<div class="union-info-value">
<van-image :src="task.ext.tf_userSign" class="signature-image"></van-image>
</div>
</div>
</template>
</div>
</template>
</div>
</div>
<slot></slot>
@@ -178,13 +330,35 @@ const UNION_REIMBURSE_INFO = {
visible: false,
viewData: {},
doneTasks: [],
row: null
row: null,
currentPaymentIndex: 0
}
},
computed: {
paymentInfoRows() {
return this.viewData.paymentDetails || []
}
},
mounted() {
this.injectInfoStyle()
},
methods: {
injectInfoStyle() {
// 当前组件是普通 JS 对象注册，Vue 不会自动注入 style 字段，这里只为本详情弹窗注入一次样式。
const styleId = "union-reimburse-info-style"
if (document.getElementById(styleId) || !this.$options.style) {
return
}
const styleNode = document.createElement("style")
styleNode.id = styleId
styleNode.type = "text/css"
styleNode.appendChild(document.createTextNode(this.$options.style))
document.head.appendChild(styleNode)
},
onOpen(row) {
this.row = row
this.visible = true
this.currentPaymentIndex = 0
this.getInfo()
this.getDoneTasks()
},
@@ -208,11 +382,82 @@ const UNION_REIMBURSE_INFO = {
isCondolenceType(typeId) {
return this.viewData.condolenceTypeId === typeId || this.viewData.condolenceType === typeId
},
getPaymentWayText(paymentWay) {
const matchedPaymentWay = this.dict.type.UNION_REIMBURSE_PAYMENT_WAY.find(item => item.code === paymentWay)
return matchedPaymentWay ? matchedPaymentWay.name : ""
},
buildViewData(data) {
const viewData = Object.assign({
files: [],
invoiceDetails: [],
paymentDetails: []
}, data || {})
if (!Array.isArray(viewData.files)) {
viewData.files = []
}
if (!Array.isArray(viewData.invoiceDetails)) {
viewData.invoiceDetails = []
}
const hasLegacyPayment = viewData.paymentWay || viewData.payer || viewData.bankUserName || viewData.bankCardNumber || viewData.bankOfDeposit
if (Array.isArray(viewData.paymentDetails) && viewData.paymentDetails.length > 0) {
viewData.paymentDetails = viewData.paymentDetails.map(item => this.buildPaymentDetail(item))
} else {
viewData.paymentDetails = hasLegacyPayment ? [this.buildPaymentDetail({
paymentWay: viewData.paymentWay,
money: viewData.money,
payerName: viewData.payerName,
bankUserName: viewData.bankUserName,
bankOfDeposit: viewData.bankOfDeposit,
bankCardNumber: viewData.bankCardNumber
})] : []
}
return viewData
},
buildPaymentDetail(detail) {
const currentDetail = detail || {}
return {
paymentWay: currentDetail.paymentWay || "",
money: currentDetail.money || "",
payerName: currentDetail.payerName || "",
bankUserName: currentDetail.bankUserName || "",
bankOfDeposit: currentDetail.bankOfDeposit || "",
bankCardNumber: currentDetail.bankCardNumber || ""
}
},
handlePaymentSwipeChange(index) {
this.currentPaymentIndex = index
},
swipeToPayment(index) {
if (!this.paymentInfoRows.length) {
this.currentPaymentIndex = 0
return
}
const targetIndex = Math.max(0, Math.min(index, this.paymentInfoRows.length - 1))
this.currentPaymentIndex = targetIndex
this.$nextTick(() => {
if (this.$refs.paymentInfoSwipe && this.$refs.paymentInfoSwipe.swipeTo) {
this.$refs.paymentInfoSwipe.swipeTo(targetIndex)
}
})
},
showPrevPayment() {
if (this.currentPaymentIndex <= 0) {
return
}
this.swipeToPayment(this.currentPaymentIndex - 1)
},
showNextPayment() {
if (this.currentPaymentIndex >= this.paymentInfoRows.length - 1) {
return
}
this.swipeToPayment(this.currentPaymentIndex + 1)
},
// 获取申请信息
getInfo() {
this.$axios.post("/platform/unionReimburse/apply/info", { id: this.row.id }).then((res) => {
if (res.code === 0) {
this.viewData = res.data
this.viewData = this.buildViewData(res.data)
this.currentPaymentIndex = 0
}
})
},
@@ -230,6 +475,209 @@ const UNION_REIMBURSE_INFO = {
}
})
}
}
},
style: /*language=CSS*/ `
.union-reimburse-info-sheet {
height: 92vh;
display: flex;
flex-direction: column;
overflow: hidden;
}
.union-reimburse-info-sheet .van-action-sheet__content {
height: 100%;
display: flex;
flex-direction: column;
overflow: hidden;
}
.union-info-header {
flex: 0 0 auto;
display: flex;
align-items: center;
justify-content: space-between;
height: 56px;
padding: 0 20px;
background: #fff;
border-top: 4px solid #1677ff;
border-bottom: 1px solid #e7ebf0;
}
.union-info-header-title {
color: #111827;
font-size: 16px;
font-weight: 700;
}
.union-info-close {
display: flex;
align-items: center;
justify-content: center;
width: 28px;
height: 28px;
color: #8b95a3;
font-size: 20px;
}
.detail-container {
flex: 1;
overflow: hidden;
background: #f2f4f7;
}
.union-info-scroll {
height: 100%;
overflow-y: auto;
padding-bottom: 16px;
}
.union-info-section {
background: #fff;
margin-bottom: 10px;
}
.union-info-section-title {
display: flex;
align-items: center;
height: 44px;
padding: 0 16px;
color: #1f2937;
font-size: 14px;
font-weight: 700;
background: #f5f7fa;
border-bottom: 1px solid #e7ebf0;
}
.union-info-section-title::before {
content: "";
width: 4px;
height: 16px;
margin-right: 8px;
border-radius: 2px;
background: #1677ff;
}
.union-info-row {
display: flex;
align-items: flex-start;
justify-content: space-between;
min-height: 44px;
padding: 12px 20px;
border-bottom: 1px solid #edf0f4;
box-sizing: border-box;
}
.union-info-row:last-child {
border-bottom: 0;
}
.union-info-label {
flex: 0 0 96px;
color: #8a94a6;
font-size: 14px;
line-height: 20px;
}
.union-info-value {
flex: 1;
min-width: 0;
color: #1f2937;
font-size: 14px;
line-height: 20px;
text-align: right;
word-break: break-all;
white-space: pre-line;
}
.union-info-link {
color: #1677ff;
}
.union-payment-tabs {
display: flex;
flex-wrap: wrap;
gap: 8px;
padding: 12px 20px 4px;
background: #fff;
}
.union-payment-tab {
height: 30px;
padding: 0 13px;
border-radius: 999px;
color: #8a94a6;
background: #f0f2f5;
font-size: 12px;
font-weight: 600;
line-height: 30px;
}
.union-payment-tab.active {
color: #fff;
background: #1677ff;
}
.union-empty-text {
padding: 14px 20px;
color: #9aa3af;
font-size: 13px;
}
.union-file-preview {
padding: 12px 20px 16px;
}
.union-invoice-subtitle {
display: flex;
align-items: center;
height: 40px;
padding: 0 20px;
color: #6b7280;
font-size: 13px;
background: #f5f7fa;
border-top: 1px solid #edf0f4;
border-bottom: 1px solid #edf0f4;
}
.union-invoice-card-list {
padding: 12px 16px 4px;
}
.union-invoice-card {
margin-bottom: 12px;
padding: 14px 14px 12px;
border-radius: 12px;
border: 1px solid #e6ebf2;
background: #fff;
box-shadow: 0 1px 3px rgba(31, 35, 41, 0.05);
}
.union-invoice-card-title {
margin-bottom: 8px;
color: #1677ff;
font-size: 13px;
font-weight: 700;
}
.union-invoice-file-preview {
padding: 12px 0 0;
}
.process-title {
display: flex;
align-items: center;
height: 40px;
padding: 0 20px;
color: #1f2937;
font-size: 14px;
font-weight: 700;
background: #f5f7fa;
}
.signature-image {
width: 100%;
height: 120px;
object-fit: contain;
}
`
}