工会报销移动端
This commit is contained in:
=
+942
@@ -0,0 +1,942 @@
|
||||
<!--#
|
||||
layout("/layouts/platform_h5.html"){
|
||||
#-->
|
||||
|
||||
<style >
|
||||
|
||||
</style>
|
||||
<div id="app" v-cloak>
|
||||
<van-nav-bar title="报销申请" left-text="返回" left-arrow @click-left="historyBack" placeholder fixed z-index="999"
|
||||
class="custom-nav"></van-nav-bar>
|
||||
|
||||
<div class="form-container">
|
||||
<van-form ref="formRef" >
|
||||
<!-- 子女信息 -->
|
||||
<van-cell-group title="子女信息" class="form-section">
|
||||
<van-field label="经办人" v-model="formData.userName" placeholder="从信息中心获取" readonly></van-field>
|
||||
<van-field label="工号" v-model="formData.loginName" placeholder="从信息中心获取" readonly></van-field>
|
||||
|
||||
<!-- 报销类别 -->
|
||||
<van-field
|
||||
v-model="formData.reimburseTypeName"
|
||||
name="reimburseTypeName"
|
||||
label="报销类别"
|
||||
readonly
|
||||
placeholder="请选择报销类别"
|
||||
@click="showReimburseTypePicker = true"
|
||||
clickable
|
||||
:rules="[{ required: true }]"
|
||||
required
|
||||
></van-field>
|
||||
<van-popup position="bottom" round v-model:show="showReimburseTypePicker">
|
||||
<van-picker :columns="reimburseTypeColumns" @cancel="showReimburseTypePicker = false" @confirm="onReimburseTypeConfirm" show-toolbar></van-picker>
|
||||
</van-popup>
|
||||
|
||||
<!-- 支付方式 -->
|
||||
<van-field
|
||||
v-model="formData.paymentWayName"
|
||||
name="paymentWayName"
|
||||
label="支付方式"
|
||||
readonly
|
||||
placeholder="请选择支付方式"
|
||||
@click="showPaymentWayPicker = true"
|
||||
clickable
|
||||
:rules="[{ required: true }]"
|
||||
required
|
||||
></van-field>
|
||||
<van-popup position="bottom" round v-model:show="showPaymentWayPicker">
|
||||
<van-picker :columns="paymentWayColumns" @cancel="showPaymentWayPicker = false" @confirm="onPaymentWayConfirm" show-toolbar></van-picker>
|
||||
</van-popup>
|
||||
|
||||
<!-- 报销项目 -->
|
||||
<van-field
|
||||
v-model="formData.reimburseProjectName"
|
||||
name="reimburseProjectName"
|
||||
label="报销项目"
|
||||
readonly
|
||||
placeholder="请选择报销项目"
|
||||
@click="showReimburseProjectPicker = true"
|
||||
clickable
|
||||
:rules="[{ required: true }]"
|
||||
required
|
||||
></van-field>
|
||||
<van-popup position="bottom" round v-model:show="showReimburseProjectPicker">
|
||||
<van-picker :columns="reimburseProjectColumns" @cancel="showReimburseProjectPicker = false" @confirm="onReimburseProjectConfirm" show-toolbar></van-picker>
|
||||
</van-popup>
|
||||
|
||||
<!-- 报销经费来源 -->
|
||||
<van-field
|
||||
v-model="formData.reimburseFundSourceName"
|
||||
name="reimburseFundSourceName"
|
||||
label="报销经费来源"
|
||||
readonly
|
||||
placeholder="请选择报销经费来源"
|
||||
@click="showReimburseFundSourcePicker = true"
|
||||
clickable
|
||||
:rules="[{ required: true }]"
|
||||
required
|
||||
></van-field>
|
||||
<van-popup position="bottom" round v-model:show="showReimburseFundSourcePicker">
|
||||
<van-picker :columns="reimburseFundSourceColumns" @cancel="showReimburseFundSourcePicker = false" @confirm="onReimburseFundSourceConfirm" show-toolbar></van-picker>
|
||||
</van-popup>
|
||||
|
||||
<!-- 联系方式 -->
|
||||
<van-field label="联系方式" v-model="formData.mobile" placeholder="请输入联系方式"></van-field>
|
||||
|
||||
<!-- 所属社团 (当经费来源为社团时显示) -->
|
||||
<van-field
|
||||
v-if="formData.reimburseFundSource === 'UNION_REIMBURSE_FUND_SOURCE_3'"
|
||||
label="所属社团"
|
||||
v-model="formData.clubName"
|
||||
placeholder="请选择所属社团"
|
||||
readonly
|
||||
@click="showClubPicker = true"
|
||||
clickable
|
||||
></van-field>
|
||||
<van-popup position="bottom" round v-model:show="showClubPicker">
|
||||
<van-picker :columns="clubColumns" @cancel="showClubPicker = false" @confirm="onClubConfirm" show-toolbar></van-picker>
|
||||
</van-popup>
|
||||
|
||||
<!-- 经费余额 -->
|
||||
<van-field label="经费余额" v-model="formData.fundBalance" readonly></van-field>
|
||||
|
||||
<!-- 银行信息 -->
|
||||
<van-field label="户名"
|
||||
v-model="formData.bankUserName"
|
||||
placeholder="请输入户名"
|
||||
:rules="[{ required: true }]"
|
||||
required>
|
||||
|
||||
</van-field>
|
||||
<van-field label="银行账号"
|
||||
v-model="formData.bankCardNumber"
|
||||
placeholder="请输入银行账号"
|
||||
:rules="[{ required: true }]"
|
||||
required>
|
||||
|
||||
</van-field>
|
||||
<van-field label="开户行"
|
||||
v-model="formData.bankOfDeposit"
|
||||
placeholder="请输入开户行"
|
||||
:rules="[{ required: true }]"
|
||||
required>
|
||||
|
||||
</van-field>
|
||||
|
||||
<!-- 将原有的慰问对象字段替换为以下代码 -->
|
||||
<van-field
|
||||
v-if="formData.reimburseProject === 'UNION_REIMBURSE_PROJECT_1'"
|
||||
label="慰问对象"
|
||||
v-model="formData.condolenceName"
|
||||
placeholder="请输入姓名或工号搜索"
|
||||
readonly
|
||||
@click="showCondolenceSearch = true"
|
||||
clickable
|
||||
></van-field>
|
||||
|
||||
<!-- 添加搜索弹窗 -->
|
||||
<van-popup v-model:show="showCondolenceSearch" position="bottom" round style="height: 80%;">
|
||||
<van-search
|
||||
v-model="condolenceSearchKeyword"
|
||||
placeholder="请输入姓名或工号"
|
||||
show-action
|
||||
@search="searchCondolence"
|
||||
>
|
||||
<template #action>
|
||||
<div @click="searchCondolence">搜索</div>
|
||||
</template>
|
||||
</van-search>
|
||||
|
||||
<van-list finished-text="没有更多了">
|
||||
<van-cell
|
||||
v-for="item in condolenceSearchResults"
|
||||
:key="item.id"
|
||||
:title="item.userName+'（'+item.loginName+'）'"
|
||||
:label="item.unitName+' '+item.sex"
|
||||
@click="selectCondolence(item)"
|
||||
/>
|
||||
</van-list>
|
||||
|
||||
<div style="padding: 10px;">
|
||||
<van-button block @click="showCondolenceSearch = false">取消</van-button>
|
||||
</div>
|
||||
</van-popup>
|
||||
|
||||
<van-field label="联系方式" v-if="formData.reimburseProject === 'UNION_REIMBURSE_PROJECT_1'" v-model="formData.condolenceMobile" placeholder="请输入联系方式"></van-field>
|
||||
|
||||
<van-field
|
||||
v-if="formData.reimburseProject === 'UNION_REIMBURSE_PROJECT_1'"
|
||||
v-model="formData.condolenceTypeName"
|
||||
name="condolenceTypeName"
|
||||
label="慰问类型"
|
||||
readonly
|
||||
placeholder="请选择慰问类型"
|
||||
@click="showCondolenceTypePicker = true"
|
||||
clickable
|
||||
></van-field>
|
||||
<van-popup position="bottom" round v-model:show="showCondolenceTypePicker">
|
||||
<van-picker :columns="condolenceTypeColumns" @cancel="showCondolenceTypePicker = false" @confirm="onCondolenceTypeConfirm" show-toolbar></van-picker>
|
||||
</van-popup>
|
||||
|
||||
<van-field label="慰问金额" v-if="formData.reimburseProject === 'UNION_REIMBURSE_PROJECT_1'" v-model="formData.money" readonly></van-field>
|
||||
<van-field
|
||||
label="慰问时间"
|
||||
v-if="formData.reimburseProject === 'UNION_REIMBURSE_PROJECT_1'"
|
||||
v-model="formData.condolenceTime"
|
||||
placeholder="请选择慰问时间"
|
||||
readonly
|
||||
@click="showCondolenceTimePicker = true"
|
||||
clickable
|
||||
:rules="[{ required: true }]"
|
||||
required
|
||||
></van-field>
|
||||
<van-popup position="bottom" round v-model:show="showCondolenceTimePicker">
|
||||
<van-datetime-picker
|
||||
type="date"
|
||||
:min-date="minDate"
|
||||
:max-date="maxDate"
|
||||
@confirm="onCondolenceTimeConfirm"
|
||||
@cancel="showCondolenceTimePicker = false"
|
||||
show-toolbar
|
||||
/>
|
||||
</van-popup>
|
||||
</template>
|
||||
<!-- 活动相关字段 (当报销项目不为慰问时显示) -->
|
||||
<template v-if="formData.reimburseProject !== 'UNION_REIMBURSE_PROJECT_1'">
|
||||
<van-field label="活动名称" v-model="formData.activityName" placeholder="请输入活动名称"></van-field>
|
||||
|
||||
<!-- 活动类型 (当报销项目为活动时显示) -->
|
||||
<van-field
|
||||
v-if="formData.reimburseProject === 'UNION_REIMBURSE_PROJECT_2'"
|
||||
label="活动类型"
|
||||
v-model="formData.activityType"
|
||||
placeholder="请选择活动类型"
|
||||
readonly
|
||||
@click="showActivityTypePicker = true"
|
||||
clickable
|
||||
></van-field>
|
||||
<van-popup position="bottom" round v-model:show="showActivityTypePicker">
|
||||
<van-picker :columns="activityTypeColumns" @cancel="showActivityTypePicker = false" @confirm="onActivityTypeConfirm" show-toolbar></van-picker>
|
||||
</van-popup>
|
||||
|
||||
<!-- 活动人数 (当报销项目为活动时显示) -->
|
||||
<van-field
|
||||
v-if="formData.reimburseProject === 'UNION_REIMBURSE_PROJECT_2'"
|
||||
label="活动人数"
|
||||
v-model="formData.activityNumber"
|
||||
placeholder="请输入活动人数"
|
||||
type="number"
|
||||
></van-field>
|
||||
|
||||
<van-field label="活动地点" v-if="formData.reimburseProject !== 'UNION_REIMBURSE_PROJECT_1'" v-model="formData.activityPlace" placeholder="请输入活动地点"></van-field>
|
||||
<van-field label="报销金额" v-if="formData.reimburseProject !== 'UNION_REIMBURSE_PROJECT_1'" v-model="formData.money" placeholder="请输入报销金额" type="number"></van-field>
|
||||
<van-field
|
||||
label="活动时间"
|
||||
v-if="formData.reimburseProject !== 'UNION_REIMBURSE_PROJECT_1'"
|
||||
v-model="formData.activityTime"
|
||||
placeholder="请选择活动时间"
|
||||
readonly
|
||||
@click="showActivityTimePicker = true"
|
||||
clickable
|
||||
></van-field>
|
||||
<van-popup position="bottom" round v-model:show="showActivityTimePicker">
|
||||
<van-datetime-picker
|
||||
type="date"
|
||||
:min-date="minDate"
|
||||
:max-date="maxDate"
|
||||
@confirm="onActivityTimeConfirm"
|
||||
@cancel="showActivityTimePicker = false"
|
||||
show-toolbar
|
||||
/>
|
||||
</van-popup>
|
||||
</template>
|
||||
|
||||
<!-- 发票信息 (当报销类别为发票时显示) -->
|
||||
<template v-if="formData.reimburseType === 'UNION_REIMBURSE_TYPE_1'">
|
||||
<van-field label="发票张数"
|
||||
v-model="formData.invoiceNumber"
|
||||
placeholder="请输入发票张数"
|
||||
type="number"
|
||||
:rules="[{ required: true }]"
|
||||
required
|
||||
>
|
||||
</van-field>
|
||||
<van-field label="发票号码"
|
||||
v-model="formData.invoice"
|
||||
placeholder="请填写发票号码，如有多个请用逗号分隔"
|
||||
:rules="[{ required: true }]"
|
||||
required>
|
||||
|
||||
</van-field>
|
||||
</template>
|
||||
|
||||
<!-- 支付内容 -->
|
||||
<van-field
|
||||
label="支付内容"
|
||||
v-model="formData.paymentNotes"
|
||||
placeholder="请填写支付内容"
|
||||
type="textarea"
|
||||
autosize
|
||||
:rules="[{ required: true }]"
|
||||
required
|
||||
></van-field>
|
||||
|
||||
<van-field class="more-text" name="files"
|
||||
label="附件" >
|
||||
<template #input>
|
||||
<h5-file-upload
|
||||
slot="input"
|
||||
:value.sync="formData.files"
|
||||
:upload_number="10"
|
||||
upload_mode="file"
|
||||
upload_result_category="array"
|
||||
upload_result_type="url"
|
||||
complete_result
|
||||
></h5-file-upload>
|
||||
</template>
|
||||
</van-field>
|
||||
</van-cell-group>
|
||||
</van-cell-group>
|
||||
|
||||
<!-- 提交按钮 -->
|
||||
<div class="form-actions">
|
||||
<van-button plain @click="onSave" type="info">保存</van-button>
|
||||
<van-button @click="onSubmit" type="primary" v-if="!taskId">提交</van-button>
|
||||
<van-button @click="onSubmitAgain" type="primary" v-else>提交1</van-button>
|
||||
</div>
|
||||
</van-form>
|
||||
</div>
|
||||
</div>
|
||||
<script>
|
||||
new Vue({
|
||||
store,
|
||||
el: '#app',
|
||||
dicts: ["UNION_REIMBURSE_TYPE","UNION_REIMBURSE_PROJECT","UNION_REIMBURSE_PAYMENT_WAY","UNION_REIMBURSE_FUND_SOURCE"],
|
||||
data() {
|
||||
return {
|
||||
bizId: GetQueryString("bizId"),
|
||||
taskId: GetQueryString("taskId"),
|
||||
formData: {
|
||||
username: '',
|
||||
loginName: '',
|
||||
userId: '',
|
||||
unitId: '',
|
||||
unitName: '',
|
||||
unionId: '',
|
||||
unionName: '',
|
||||
mobile: '',
|
||||
reimburseType: '', // 存储字典值
|
||||
reimburseTypeName: '', // 存储显示名称
|
||||
paymentWay: '', // 存储字典值
|
||||
paymentWayName: '', // 存储显示名称
|
||||
reimburseProject: '', // 存储字典值
|
||||
reimburseProjectName: '',// 存储显示名称
|
||||
reimburseFundSource: '', // 存储字典值
|
||||
reimburseFundSourceName: '',// 存储显示名称
|
||||
clubName: '',
|
||||
clubId: '',
|
||||
fundBalance: '',
|
||||
bankUserName: '',
|
||||
bankCardNumber: '',
|
||||
bankOfDeposit: '',
|
||||
condolenceName: '',
|
||||
condolenceId: '',
|
||||
condolenceMobile: '',
|
||||
condolenceType: '',
|
||||
condolenceTypeName: '',
|
||||
money: '',
|
||||
condolenceTime: '',
|
||||
activityName: '',
|
||||
activityType: '',
|
||||
activityTypeText: '',
|
||||
activityNumber: '',
|
||||
activityPlace: '',
|
||||
activityTime: '',
|
||||
invoiceNumber: '',
|
||||
invoice: '',
|
||||
paymentNotes: '',
|
||||
files: ''
|
||||
},
|
||||
// 报销类别
|
||||
showReimburseTypePicker: false,
|
||||
reimburseTypeColumns: [],
|
||||
// 支付方式
|
||||
showPaymentWayPicker: false,
|
||||
paymentWayColumns: [],
|
||||
// 报销项目
|
||||
showReimburseProjectPicker: false,
|
||||
reimburseProjectColumns: [],
|
||||
// 报销经费来源
|
||||
showReimburseFundSourcePicker: false,
|
||||
reimburseFundSourceColumns: [],
|
||||
// 所属社团
|
||||
showClubPicker: false,
|
||||
clubColumns: [],
|
||||
// 慰问对象
|
||||
showCondolencePicker: false,
|
||||
condolenceColumns: [],
|
||||
// 慰问对象搜索相关
|
||||
showCondolenceSearch: false,
|
||||
condolenceSearchKeyword: '',
|
||||
condolenceSearchResults: [],
|
||||
// 慰问类型
|
||||
showCondolenceTypePicker: false,
|
||||
condolenceTypeColumns: [],
|
||||
// 活动类型
|
||||
showActivityTypePicker: false,
|
||||
activityTypeColumns: [
|
||||
{ text: '分工会活动', value: '分工会活动' },
|
||||
{ text: '校工会活动', value: '校工会活动' },
|
||||
{ text: '协会(社团)活动', value: '协会(社团)活动' }
|
||||
],
|
||||
// 其他数据
|
||||
clubOptions: [],
|
||||
condolenceOptions: [],
|
||||
typeOptions: [],
|
||||
// 添加报销项目原始数据列表
|
||||
reimburseProjectList: [],
|
||||
// 添加日期选择器相关变量
|
||||
showCondolenceTimePicker: false,
|
||||
showActivityTimePicker: false,
|
||||
minDate: new Date(2020, 0, 1), // 设置最小日期为2000年1月1日
|
||||
maxDate: new Date(2030, 11, 31) // 设置最大日期为2030年12月31日
|
||||
}
|
||||
},
|
||||
// 监听报销类别发生变化，报销项目联动改变
|
||||
// 修复 watch 中的监听器
|
||||
watch: {
|
||||
"formData.reimburseType"(newVal) {
|
||||
// 根据报销类别过滤可选的报销项目
|
||||
if (newVal === 'UNION_REIMBURSE_TYPE_1') {
|
||||
// 发票类型的报销项目
|
||||
this.reimburseProjectColumns = this.reimburseProjectList.filter((o) => {
|
||||
return ['1', 'UNION_REIMBURSE_TYPE_1'].includes(o.remark)
|
||||
}).map(item => {
|
||||
return {value: item.code, text: item.name}
|
||||
});
|
||||
} else {
|
||||
// 其他类型的报销项目
|
||||
this.reimburseProjectColumns = this.reimburseProjectList.filter((o) => {
|
||||
return ['1', 'UNION_REIMBURSE_TYPE_2'].includes(o.remark)
|
||||
}).map(item => {
|
||||
return {value: item.code, text: item.name}
|
||||
});
|
||||
}
|
||||
},
|
||||
// 添加对社团选择的监听
|
||||
"formData.clubId"(newVal) {
|
||||
// 当经费来源是社团且选择了具体社团时，重新查询余额
|
||||
if (this.formData.reimburseFundSource === 'UNION_REIMBURSE_FUND_SOURCE_3' && newVal) {
|
||||
this.queryFundBalance();
|
||||
}
|
||||
},
|
||||
// 添加对经费来源的监听
|
||||
"formData.reimburseFundSource"(newVal) {
|
||||
// 经费来源改变时查询余额
|
||||
this.queryFundBalance();
|
||||
}
|
||||
},
|
||||
|
||||
|
||||
methods: {
|
||||
async onSave() {
|
||||
// 余额校验
|
||||
if (this.formData.money && this.formData.fundBalance) {
|
||||
const balance = parseFloat(this.formData.fundBalance);
|
||||
const money = parseFloat(this.formData.money);
|
||||
if (balance < money) {
|
||||
this.$message.warning("经费余额不足");
|
||||
return;
|
||||
}
|
||||
}
|
||||
// 表单验证
|
||||
try {
|
||||
await this.$refs.formRef.validate();
|
||||
|
||||
this.$toast.loading({
|
||||
message: '保存中...',
|
||||
forbidClick: true,
|
||||
});
|
||||
|
||||
this.$axios.post("/platform/unionReimburse/apply/save", {data: JSON.stringify(this.formData)})
|
||||
.then((res) => {
|
||||
this.$toast.clear();
|
||||
if (res.code === 0) {
|
||||
this.$toast.success(res.msg);
|
||||
pjaxReplace('/platform/unionReimburse/mine/h5')
|
||||
} else {
|
||||
this.$toast.fail(res.msg || '保存失败');
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
this.$toast.clear();
|
||||
this.$toast.fail('网络错误，请稍后重试');
|
||||
});
|
||||
} catch (error) {
|
||||
// 表单验证失败
|
||||
console.log('表单验证失败', error);
|
||||
}
|
||||
},
|
||||
// 提交
|
||||
async onSubmit(){
|
||||
// 余额校验
|
||||
if (this.formData.money && this.formData.fundBalance) {
|
||||
const balance = parseFloat(this.formData.fundBalance);
|
||||
const money = parseFloat(this.formData.money);
|
||||
if (balance < money) {
|
||||
this.$message.warning("经费余额不足");
|
||||
return;
|
||||
}
|
||||
}
|
||||
try {
|
||||
await this.$refs.formRef.validate();
|
||||
|
||||
this.$dialog.confirm({
|
||||
title: '提示',
|
||||
message: '您确定要提交吗？',
|
||||
}).then(() => {
|
||||
this.$toast.loading({
|
||||
message: '提交中...',
|
||||
forbidClick: true,
|
||||
});
|
||||
|
||||
this.$axios.post('/platform/unionReimburse/apply/submit', {data: JSON.stringify(this.formData)})
|
||||
.then(res => {
|
||||
this.$toast.clear();
|
||||
if (res.code === 0) {
|
||||
this.$toast.success("提交成功");
|
||||
pjaxReplace('/platform/unionReimburse/mine/h5')
|
||||
} else {
|
||||
this.$toast.fail(res.msg || '提交失败');
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
this.$toast.clear();
|
||||
this.$toast.fail('网络错误，请稍后重试');
|
||||
});
|
||||
}).catch(() => {
|
||||
// 取消提交
|
||||
});
|
||||
} catch (error) {
|
||||
// 表单验证失败
|
||||
console.log('表单验证失败', error);
|
||||
}
|
||||
},
|
||||
// 再次提交
|
||||
async onSubmitAgain() {
|
||||
// 余额校验
|
||||
if (this.formData.money && this.formData.fundBalance) {
|
||||
const balance = parseFloat(this.formData.fundBalance);
|
||||
const money = parseFloat(this.formData.money);
|
||||
if (balance < money) {
|
||||
this.$message.warning("经费余额不足");
|
||||
return;
|
||||
}
|
||||
}
|
||||
try {
|
||||
await this.$refs.formRef.validate();
|
||||
|
||||
this.$dialog.confirm({
|
||||
title: '提示',
|
||||
message: '您确定要提交吗？',
|
||||
}).then(() => {
|
||||
this.$toast.loading({
|
||||
message: '提交中...',
|
||||
forbidClick: true,
|
||||
});
|
||||
|
||||
this.$axios.post('/platform/unionReimburse/apply/submitAgain', {
|
||||
data: JSON.stringify(this.formData),
|
||||
taskId: GetQueryString("taskId")
|
||||
}).then(res => {
|
||||
this.$toast.clear();
|
||||
if (res.code === 0) {
|
||||
this.$toast.success("提交成功");
|
||||
setTimeout(() => {
|
||||
pjaxReplace('/platform/unionReimburse/mine/h5')
|
||||
}, 1500);
|
||||
} else {
|
||||
this.$toast.fail(res.msg || '提交失败');
|
||||
}
|
||||
}).catch(err => {
|
||||
this.$toast.clear();
|
||||
this.$toast.fail('网络错误，请稍后重试');
|
||||
});
|
||||
}).catch(() => {
|
||||
// 取消提交
|
||||
});
|
||||
} catch (error) {
|
||||
// 表单验证失败
|
||||
console.log('表单验证失败', error);
|
||||
}
|
||||
},
|
||||
onReimburseTypeConfirm(o) {
|
||||
this.$set(this.formData, "reimburseTypeName", o.text); // 显示名称
|
||||
this.$set(this.formData, "reimburseType", o.value); // 字典值
|
||||
this.showReimburseTypePicker = false;
|
||||
},
|
||||
onPaymentWayConfirm(o) {
|
||||
this.$set(this.formData, "paymentWayName", o.text); // 显示名称
|
||||
this.$set(this.formData, "paymentWay", o.value); // 字典值
|
||||
this.showPaymentWayPicker = false;
|
||||
},
|
||||
onReimburseProjectConfirm(o) {
|
||||
this.$set(this.formData, "reimburseProjectName", o.text); // 显示名称
|
||||
this.$set(this.formData, "reimburseProject", o.value); // 字典值
|
||||
this.showReimburseProjectPicker = false;
|
||||
},
|
||||
onReimburseFundSourceConfirm(o) {
|
||||
this.$set(this.formData, "reimburseFundSourceName", o.text); // 显示名称
|
||||
this.$set(this.formData, "reimburseFundSource", o.value); // 字典值
|
||||
this.showReimburseFundSourcePicker = false;
|
||||
},
|
||||
onClubConfirm(o) {
|
||||
this.$set(this.formData, "clubName", o.text);
|
||||
this.$set(this.formData, "clubId", o.value);
|
||||
this.showClubPicker = false;
|
||||
// 选择社团后查询经费余额
|
||||
this.queryFundBalance();
|
||||
},
|
||||
onCondolenceConfirm(o) {
|
||||
this.$set(this.formData, "condolenceName", o.text);
|
||||
this.$set(this.formData, "condolenceId", o.value);
|
||||
this.showCondolencePicker = false;
|
||||
// 设置联系方式
|
||||
const selectedUser = this.condolenceOptions.find(user => user.id === o.value);
|
||||
if (selectedUser) {
|
||||
this.$set(this.formData, "condolenceMobile", selectedUser.mobile);
|
||||
}
|
||||
},
|
||||
onCondolenceTypeConfirm(o) {
|
||||
this.$set(this.formData, "condolenceTypeName", o.text);
|
||||
this.$set(this.formData, "condolenceType", o.value);
|
||||
this.showCondolenceTypePicker = false;
|
||||
// 设置慰问金额
|
||||
const selectedType = this.typeOptions.find(type => type.id === o.value);
|
||||
if (selectedType) {
|
||||
this.$set(this.formData, "money", selectedType.money);
|
||||
}
|
||||
},
|
||||
onActivityTypeConfirm(o) {
|
||||
this.$set(this.formData, "activityTypeText", o.text);
|
||||
this.$set(this.formData, "activityType", o.value);
|
||||
this.showActivityTypePicker = false;
|
||||
},
|
||||
async initDictOptions() {
|
||||
// 报销类别
|
||||
const reimburseTypeData = await this.$businessTool.getDictOptions('UNION_REIMBURSE_TYPE')
|
||||
this.reimburseTypeColumns = reimburseTypeData.map(item => {
|
||||
return {value: item.code, text: item.name}
|
||||
})
|
||||
|
||||
// 支付方式
|
||||
const paymentWayData = await this.$businessTool.getDictOptions('UNION_REIMBURSE_PAYMENT_WAY')
|
||||
this.paymentWayColumns = paymentWayData.map(item => {
|
||||
return {value: item.code, text: item.name}
|
||||
})
|
||||
|
||||
// 报销项目
|
||||
const reimburseProjectData = await this.$businessTool.getDictOptions('UNION_REIMBURSE_PROJECT')
|
||||
this.reimburseProjectColumns = reimburseProjectData.map(item => {
|
||||
return {value: item.code, text: item.name}
|
||||
})
|
||||
this.reimburseProjectList = reimburseProjectData; // 保存原始数据
|
||||
|
||||
// 报销经费来源
|
||||
const reimburseFundSourceData = await this.$businessTool.getDictOptions('UNION_REIMBURSE_FUND_SOURCE')
|
||||
this.reimburseFundSourceColumns = reimburseFundSourceData.map(item => {
|
||||
return {value: item.code, text: item.name}
|
||||
})
|
||||
// 添加经费来源区分
|
||||
await this.filterReimburseFundSources();
|
||||
},
|
||||
|
||||
// 查询慰问对象
|
||||
queryCondolence(keyword) {
|
||||
this.$axios.post("/platform/UnionReimburse/apply/listUser", {keyword: keyword}).then((res) => {
|
||||
if (res.code === 0) {
|
||||
this.condolenceOptions = res.data;
|
||||
this.condolenceColumns = res.data.map(item => {
|
||||
return {
|
||||
text: item.userName+'（'+item.loginName+'）'+'（'+item.unitName+'）'+'（'+item.sex+'）',
|
||||
value: item.id
|
||||
}
|
||||
});
|
||||
}
|
||||
})
|
||||
},
|
||||
// 搜索慰问对象
|
||||
searchCondolence() {
|
||||
if (!this.condolenceSearchKeyword) {
|
||||
this.condolenceSearchResults = [];
|
||||
return;
|
||||
}
|
||||
|
||||
this.$axios.post("/platform/UnionReimburse/apply/listUser", {
|
||||
keyword: this.condolenceSearchKeyword
|
||||
}).then((res) => {
|
||||
if (res.code === 0) {
|
||||
this.condolenceSearchResults = res.data;
|
||||
}
|
||||
});
|
||||
},
|
||||
|
||||
// 选择慰问对象
|
||||
selectCondolence(user) {
|
||||
this.$set(this.formData, "condolenceName", user.userName);
|
||||
this.$set(this.formData, "condolenceId", user.id);
|
||||
this.$set(this.formData, "condolenceMobile", user.mobile);
|
||||
this.showCondolenceSearch = false;
|
||||
},
|
||||
// 查询慰问类型
|
||||
queryCondolenceType() {
|
||||
this.$axios.post("/platform/unionReimburse/apply/queryCondolenceType")
|
||||
.then((resp) => {
|
||||
this.typeOptions = resp.data;
|
||||
this.condolenceTypeColumns = resp.data.map(item => {
|
||||
return {text: item.name, value: item.id}
|
||||
});
|
||||
})
|
||||
},
|
||||
// 慰问时间确认事件
|
||||
onCondolenceTimeConfirm(value) {
|
||||
// 格式化日期为 YYYY-MM-DD 格式
|
||||
this.$set(this.formData, "condolenceTime", this.$moment(value).format("YYYY-MM-DD"));
|
||||
this.showCondolenceTimePicker = false;
|
||||
},
|
||||
|
||||
// 活动时间确认事件
|
||||
onActivityTimeConfirm(value) {
|
||||
// 格式化日期为 YYYY-MM-DD 格式
|
||||
this.$set(this.formData, "activityTime", this.$moment(value).format("YYYY-MM-DD"));
|
||||
this.showActivityTimePicker = false;
|
||||
},
|
||||
|
||||
// 查询社团
|
||||
queryClubs() {
|
||||
this.$businessTool.listClub().then((res) => {
|
||||
this.clubOptions = res;
|
||||
this.clubColumns = res.map(item => {
|
||||
return {text: item.clubName, value: item.id}
|
||||
});
|
||||
})
|
||||
},
|
||||
// 查询经费余额
|
||||
queryFundBalance() {
|
||||
if (!this.formData.reimburseFundSource) {
|
||||
this.$set(this.formData, 'fundBalance', '');
|
||||
return;
|
||||
}
|
||||
|
||||
// 如果是社团经费来源，但没有选择具体社团，则不查询
|
||||
if (this.formData.reimburseFundSource === 'UNION_REIMBURSE_FUND_SOURCE_3' && !this.formData.clubId) {
|
||||
this.$set(this.formData, 'fundBalance', '');
|
||||
return;
|
||||
}
|
||||
|
||||
// 定义API映射关系
|
||||
const apiMap = {
|
||||
'UNION_REIMBURSE_FUND_SOURCE_1': {
|
||||
url: "/platform/unionReimburse/apply/getSchoolBudget",
|
||||
},
|
||||
'UNION_REIMBURSE_FUND_SOURCE_2': {
|
||||
url: "/platform/unionReimburse/apply/getUnionBalance",
|
||||
},
|
||||
'UNION_REIMBURSE_FUND_SOURCE_3': {
|
||||
url: "/platform/unionReimburse/apply/getClubBudget",
|
||||
}
|
||||
};
|
||||
|
||||
const fundSource = this.formData.reimburseFundSource;
|
||||
const apiInfo = apiMap[fundSource];
|
||||
|
||||
// 如果没有匹配的API，清空经费余额并返回
|
||||
if (!apiInfo) {
|
||||
this.$set(this.formData, 'fundBalance', '');
|
||||
return;
|
||||
}
|
||||
|
||||
// 构造请求参数
|
||||
const params = {
|
||||
reimburseFundSource: fundSource
|
||||
};
|
||||
|
||||
// 如果是社团经费，需要传递社团ID
|
||||
if (fundSource === 'UNION_REIMBURSE_FUND_SOURCE_3' && this.formData.clubId) {
|
||||
params.clubId = this.formData.clubId;
|
||||
}
|
||||
|
||||
// 显示加载状态
|
||||
this.$set(this.formData, 'fundBalance', '查询中...');
|
||||
|
||||
// 发送请求
|
||||
this.$axios.post(apiInfo.url, params)
|
||||
.then(response => {
|
||||
if (response.code === 0) {
|
||||
// 显示经费余额（只显示数字，不显示"元"）
|
||||
this.$set(this.formData, 'fundBalance', response.data || '0.00');
|
||||
} else {
|
||||
this.$set(this.formData, 'fundBalance', '查询失败');
|
||||
}
|
||||
})
|
||||
.catch(error => {
|
||||
console.error("经费余额查询失败:", error);
|
||||
this.$set(this.formData, 'fundBalance', '查询失败');
|
||||
this.$toast.fail("经费余额查询失败");
|
||||
});
|
||||
},
|
||||
// 添加经费来源区分
|
||||
async filterReimburseFundSources() {
|
||||
// 如果是系统管理员或校工会管理员，可以使用所有经费来源
|
||||
if (this.$auth.hasRoleOr(["SYSADMIN", "SCHOOL_UNION_ADMIN"])) {
|
||||
// 不需要过滤，使用所有选项
|
||||
return;
|
||||
}
|
||||
|
||||
const filteredSources = [];
|
||||
|
||||
// 根据用户角色过滤经费来源选项
|
||||
if (this.$auth.hasRoleOr(["SCHOOL_OUTLAY_ADMIN", "SCHOOL_UNION_ADMIN"])) {
|
||||
this.reimburseFundSourceColumns.map(item => {
|
||||
if (item.value === "UNION_REIMBURSE_FUND_SOURCE_1") {
|
||||
filteredSources.push(item);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
if (this.$auth.hasRoleOr(["BRANCH_UNION_CHAIRMAN", "BRANCH_UNION_ADMIN"])) {
|
||||
this.reimburseFundSourceColumns.map(item => {
|
||||
if (item.value === "UNION_REIMBURSE_FUND_SOURCE_2") {
|
||||
filteredSources.push(item);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
if (this.$auth.hasRoleOr(["CLUB_MANAGER", "CLUB_PRESIDENT"])) {
|
||||
this.reimburseFundSourceColumns.map(item => {
|
||||
if (item.value === "UNION_REIMBURSE_FUND_SOURCE_3") {
|
||||
filteredSources.push(item);
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
// 更新经费来源选项
|
||||
this.reimburseFundSourceColumns = filteredSources;
|
||||
},
|
||||
init() {
|
||||
this.bizId = GetQueryString("bizId")
|
||||
if (this.bizId) {
|
||||
this.$axios.post("/platform/unionReimburse/apply/info", { id: this.bizId }).then((res) => {
|
||||
if (res.code === 0) {
|
||||
// 先保存原始数据
|
||||
const originalData = {...res.data};
|
||||
this.formData = res.data;
|
||||
|
||||
// 处理报销类别显示
|
||||
if (this.reimburseTypeColumns.length > 0 ) {
|
||||
const matchedReimburseType = this.reimburseTypeColumns.find(item =>
|
||||
item.value === originalData.reimburseType
|
||||
)
|
||||
if (matchedReimburseType) {
|
||||
this.$set(this.formData, "reimburseTypeName", matchedReimburseType.text)
|
||||
this.$set(this.formData, "reimburseType", matchedReimburseType.value)
|
||||
}
|
||||
}
|
||||
|
||||
// 处理支付方式显示
|
||||
if (this.paymentWayColumns.length > 0) {
|
||||
const matchedPaymentWay = this.paymentWayColumns.find(item =>
|
||||
item.value === originalData.paymentWay
|
||||
)
|
||||
if (matchedPaymentWay) {
|
||||
this.$set(this.formData, "paymentWayName", matchedPaymentWay.text)
|
||||
this.$set(this.formData, "paymentWay", matchedPaymentWay.value)
|
||||
}
|
||||
}
|
||||
|
||||
// 处理报销项目显示
|
||||
if (this.reimburseProjectColumns.length > 0 ) {
|
||||
const matchedReimburseProject = this.reimburseProjectColumns.find(item =>
|
||||
item.value === originalData.reimburseProject
|
||||
)
|
||||
if (matchedReimburseProject) {
|
||||
this.$set(this.formData, "reimburseProjectName", matchedReimburseProject.text)
|
||||
this.$set(this.formData, "reimburseProject", matchedReimburseProject.value)
|
||||
}
|
||||
}
|
||||
|
||||
// 处理报销经费来源显示
|
||||
if (this.reimburseFundSourceColumns.length > 0 ) {
|
||||
const matchedReimburseFundSource = this.reimburseFundSourceColumns.find(item =>
|
||||
item.value === originalData.reimburseFundSource
|
||||
)
|
||||
if (matchedReimburseFundSource) {
|
||||
this.$set(this.formData, "reimburseFundSourceName", matchedReimburseFundSource.text)
|
||||
this.$set(this.formData, "reimburseFundSource", matchedReimburseFundSource.value)
|
||||
}
|
||||
}
|
||||
|
||||
// 处理活动类型显示
|
||||
if (this.activityTypeColumns.length > 0 ) {
|
||||
const matchedActivityType = this.activityTypeColumns.find(item =>
|
||||
item.value === originalData.activityType
|
||||
)
|
||||
if (matchedActivityType) {
|
||||
this.$set(this.formData, "activityTypeText", matchedActivityType.text)
|
||||
this.$set(this.formData, "activityType", matchedActivityType.value)
|
||||
}
|
||||
}
|
||||
|
||||
// 处理社团显示
|
||||
if (this.clubColumns.length > 0 ) {
|
||||
const matchedClub = this.clubColumns.find(item =>
|
||||
item.value === originalData.clubId
|
||||
)
|
||||
if (matchedClub) {
|
||||
this.$set(this.formData, "clubName", matchedClub.text)
|
||||
}
|
||||
}
|
||||
|
||||
// 处理慰问类型显示
|
||||
if (this.condolenceTypeColumns.length > 0 ) {
|
||||
const matchedCondolenceType = this.condolenceTypeColumns.find(item =>
|
||||
item.value === originalData.condolenceType
|
||||
)
|
||||
if (matchedCondolenceType) {
|
||||
this.$set(this.formData, "condolenceTypeName", matchedCondolenceType.text)
|
||||
}
|
||||
}
|
||||
|
||||
// 查询经费余额
|
||||
if (this.formData.reimburseFundSource) {
|
||||
this.queryFundBalance();
|
||||
}
|
||||
}
|
||||
})
|
||||
} else {
|
||||
const user = this.$store.state.user
|
||||
this.$set(this.formData, "userName", user.username)
|
||||
this.$set(this.formData, "loginName", user.loginname)
|
||||
this.$set(this.formData, "mobile", user.mobile)
|
||||
this.$set(this.formData, "userId", user.id)
|
||||
this.$set(this.formData, "unitId", user.unitId)
|
||||
this.$set(this.formData, "unitName", user.unit.name)
|
||||
this.$set(this.formData, "unionId", user.union.id)
|
||||
this.$set(this.formData, "unionName", user.union.name)
|
||||
}
|
||||
}
|
||||
|
||||
},
|
||||
|
||||
|
||||
async created() {
|
||||
await this.initDictOptions();
|
||||
await this.init();
|
||||
this.queryCondolenceType();
|
||||
this.queryClubs();
|
||||
}
|
||||
});
|
||||
</script>
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
+149
@@ -0,0 +1,149 @@
|
||||
<!--#
|
||||
layout("/layouts/platform_h5.html"){
|
||||
#-->
|
||||
|
||||
<div id="app" v-cloak>
|
||||
<van-nav-bar @click-left="historyBack" left-arrow left-text="返回" title="报销统计" placeholder fixed></van-nav-bar>
|
||||
<van-sticky offset-top="46px">
|
||||
<van-search
|
||||
:reverse-color="false"
|
||||
:show-action="false"
|
||||
@search="doSearch"
|
||||
input-align="left"
|
||||
placeholder="请输入经办人搜索"
|
||||
v-model="pageForm.userName"
|
||||
></van-search>
|
||||
<van-dropdown-menu :close-on-click-outside="false" :close-on-click-overlay="false">
|
||||
<van-dropdown-item :options="yearList" @change="doSearch" v-model="pageForm.year"></van-dropdown-item>
|
||||
</van-dropdown-menu>
|
||||
</van-sticky>
|
||||
|
||||
|
||||
<table-list api="/platform/unionReimburse/collect/pageData" :page_form.sync="pageForm" ref="tableListRef"
|
||||
@ready="doSearch" title="taskName">
|
||||
<template v-slot="{index,row}">
|
||||
<table-column label="经办人">{{row.userName}}</table-column>
|
||||
<table-column label="所属工会">{{row.unionName}}</table-column>
|
||||
<table-column label="所属单位">{{row.unitName}}</table-column>
|
||||
<table-column label="报销类别">
|
||||
<dict-tag :options="dict.type.UNION_REIMBURSE_TYPE"
|
||||
:value="row.reimburseType">
|
||||
</dict-tag>
|
||||
</table-column>
|
||||
<table-column label="报销项目">
|
||||
<dict-tag :options="dict.type.UNION_REIMBURSE_PROJECT"
|
||||
:value="row.reimburseProject">
|
||||
</dict-tag>
|
||||
</table-column>
|
||||
<table-column label="金额">{{row.money}}</table-column>
|
||||
|
||||
</template>
|
||||
<template #actions="{index,row}">
|
||||
<div class="action-btn" @click="onView(row)">
|
||||
<i class="fa fa-eye"></i>
|
||||
<span>查看</span>
|
||||
</div>
|
||||
<div class="action-btn" @click="onEdit(row)" v-if="row.taskKey === 'startTask' || !row.instanceId">
|
||||
<i class="fa fa-edit"></i>
|
||||
<span>编辑</span>
|
||||
</div>
|
||||
<div class="action-btn delete" v-if="row.canRevoke" @click="onRevoke(item)">
|
||||
<i class="fa fa-undo"></i>
|
||||
<span>撤回</span>
|
||||
</div>
|
||||
<div class="action-btn delete" @click="onDelete(row)" v-if="row.taskKey === 'startTask' || !row.instanceId">
|
||||
<i class="fa fa-trash"></i>
|
||||
<span>删除</span>
|
||||
</div>
|
||||
</template>
|
||||
</table-list>
|
||||
|
||||
<union-reimburse-info ref="unionReimburseInfoRef"></union-reimburse-info>
|
||||
|
||||
</div>
|
||||
<script>
|
||||
<!--#include('../info.js'){}#-->
|
||||
const vue = new Vue({
|
||||
el: "#app",
|
||||
store,
|
||||
dicts: ["UNION_REIMBURSE_TYPE","UNION_REIMBURSE_PROJECT"],
|
||||
components: {
|
||||
"union-reimburse-info":UNION_REIMBURSE_INFO
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
viewShow: false,
|
||||
yearList: [],
|
||||
pageForm: {
|
||||
pageNumber: 1,
|
||||
pageSize: 10,
|
||||
totalCount: 0,
|
||||
searchKeyword: "",
|
||||
year: "",
|
||||
},
|
||||
infoShow: false
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onView(row) {
|
||||
this.showApprovalForm = false
|
||||
this.$refs.unionReimburseInfoRef.onOpen(row)
|
||||
},
|
||||
onEdit(row) {
|
||||
this.$pjaxReplace("/platform/unionReimburse/apply/h5?bizId=" + row.id + "&taskId=" + row.startTaskId)
|
||||
},
|
||||
|
||||
onRevoke(row){
|
||||
this.$dialog
|
||||
.confirm({
|
||||
title: "提示",
|
||||
message: "您确定要撤销申请吗？"
|
||||
})
|
||||
.then(() => {
|
||||
this.$axios.post("/flow/common/revokeTask", {taskId: row.startTaskId}).then((resp) => {
|
||||
this.$toast.success(resp.msg)
|
||||
this.doSearch()
|
||||
})
|
||||
})
|
||||
},
|
||||
onDelete(row) {
|
||||
this.$dialog
|
||||
.confirm({
|
||||
title: "提示",
|
||||
message: "您确定要删除吗？"
|
||||
})
|
||||
.then(() => {
|
||||
this.$axios.post("/platform/unionReimburse/mine/delete", {id: row.id}).then((resp) => {
|
||||
if (resp.code === 0) {
|
||||
this.$toast.success(resp.msg)
|
||||
this.doSearch()
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
doSearch() {
|
||||
this.$nextTick(() => {
|
||||
this.pageForm.pageNumber = 1
|
||||
this.pageForm.totalCount = 0
|
||||
this.$refs.tableListRef.doSearch()
|
||||
})
|
||||
},
|
||||
initData() {
|
||||
for (let i = new Date().getFullYear() - 10; i <= new Date().getFullYear(); i++) {
|
||||
this.yearList.unshift({value: i, text: i + "年"})
|
||||
}
|
||||
this.$set(this.pageForm, "year", this.yearList[0].value)
|
||||
},
|
||||
|
||||
},
|
||||
created() {
|
||||
this.initData()
|
||||
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
@@ -0,0 +1,163 @@
|
||||
const UNION_REIMBURSE_INFO = {
|
||||
template:
|
||||
/*language=HTML*/`
|
||||
<van-action-sheet v-model="visible" title="查看详情">
|
||||
<div class="detail-container">
|
||||
<van-cell-group title="报销申请">
|
||||
<van-cell title="经办人">{{ viewData.userName }}</van-cell>
|
||||
<van-cell title="工号">{{ viewData.loginName }}</van-cell>
|
||||
<van-cell title="单位">{{ viewData.unitName }}</van-cell>
|
||||
<van-cell title="工会">{{ viewData.unionName }}</van-cell>
|
||||
<van-cell title="报销类别">
|
||||
<dict-tag :options="dict.type.UNION_REIMBURSE_TYPE"
|
||||
:value="viewData.reimburseType">
|
||||
</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="报销项目">
|
||||
<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_FUND_SOURCE"
|
||||
:value="viewData.reimburseFundSource">
|
||||
</dict-tag></van-cell>
|
||||
<van-cell title="联系方式">{{ viewData.mobile }}</van-cell>
|
||||
<van-cell title="所属社团" v-if="viewData.reimburseFundSource === 'UNION_REIMBURSE_FUND_SOURCE_3'">{{ viewData.clubName }}</van-cell>
|
||||
<van-cell title="经费余额">{{ viewData.fundBalance }}</van-cell>
|
||||
<van-cell title="户名">{{ viewData.bankUserName }}</van-cell>
|
||||
<van-cell title="银行账号">{{ viewData.bankCardNumber }}</van-cell>
|
||||
<van-cell title="开户行">{{ viewData.bankOfDeposit }}</van-cell>
|
||||
<van-cell title="慰问对象" v-if="viewData.reimburseProject === 'UNION_REIMBURSE_PROJECT_1'">{{ viewData.condolenceName }}</van-cell>
|
||||
<van-cell title="联系方式" v-if="viewData.reimburseProject === 'UNION_REIMBURSE_PROJECT_1'">{{ viewData.condolenceMobile }}</van-cell>
|
||||
<van-cell title="慰问类型" v-if="viewData.reimburseProject === 'UNION_REIMBURSE_PROJECT_1'">{{ viewData.typeName }}</van-cell>
|
||||
<van-cell title="慰问金额" v-if="viewData.reimburseProject === 'UNION_REIMBURSE_PROJECT_1'">{{ viewData.money }}</van-cell>
|
||||
<van-cell title="慰问时间" v-if="viewData.reimburseProject === 'UNION_REIMBURSE_PROJECT_1'">{{ viewData.condolenceTime }}</van-cell>
|
||||
<van-cell title="活动名称" v-if="viewData.reimburseProject !== 'UNION_REIMBURSE_PROJECT_1'">{{ viewData.activityName }}</van-cell>
|
||||
<van-cell title="活动类型" v-if="viewData.reimburseProject === 'UNION_REIMBURSE_PROJECT_2'">{{ viewData.activityType }}</van-cell>
|
||||
<van-cell title="活动人数" v-if="viewData.reimburseProject === 'UNION_REIMBURSE_PROJECT_2'">{{ viewData.activityNumber }}</van-cell>
|
||||
<van-cell title="活动地点" v-if="viewData.reimburseProject !== 'UNION_REIMBURSE_PROJECT_1'">{{ viewData.activityPlace }}</van-cell>
|
||||
<van-cell title="报销金额" v-if="viewData.reimburseProject !== 'UNION_REIMBURSE_PROJECT_1'">{{ viewData.money }}</van-cell>
|
||||
<van-cell title="活动时间" v-if="viewData.reimburseProject !== 'UNION_REIMBURSE_PROJECT_1'">{{ viewData.activityTime }}</van-cell>
|
||||
<van-cell title="发票张数" v-if="viewData.reimburseType === 'UNION_REIMBURSE_TYPE_1'">{{ viewData.invoiceNumber }}</van-cell>
|
||||
<van-cell title="发票号码" v-if="viewData.reimburseType === 'UNION_REIMBURSE_TYPE_1'">{{ viewData.invoice }}</van-cell>
|
||||
<van-cell title="支付内容">{{ viewData.paymentNotes }}</van-cell>
|
||||
<van-cell title="附件">
|
||||
<div style="display: flex; flex-wrap: wrap;">
|
||||
<template v-for="(item,index) in viewData.files">
|
||||
<div v-if="item.url" :key="index" @click="previewOptionImg(viewData.files,index)" style="margin-right: 10px; margin-bottom: 10px;">
|
||||
<van-icon name="description" /> {{ getFileName(item.name) }}
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
</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="申请时间">
|
||||
{{ 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="办理时间">
|
||||
{{ 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>
|
||||
</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>
|
||||
|
||||
</div>
|
||||
<slot></slot>
|
||||
</van-action-sheet>
|
||||
`,
|
||||
dicts: ["UNION_REIMBURSE_TYPE", "UNION_REIMBURSE_PAYMENT_WAY", "UNION_REIMBURSE_FUND_SOURCE","UNION_REIMBURSE_PROJECT","PROCESS_TASK_SUBMIT_TYPE"],
|
||||
data() {
|
||||
return {
|
||||
visible:false,
|
||||
viewData: {},
|
||||
doneTasks: [],
|
||||
row: null,
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 获取文件名
|
||||
getFileName(url) {
|
||||
if (!url) return '';
|
||||
const fileName = url.split('/').pop();
|
||||
return fileName.length > 15 ? fileName.substring(0, 15) + '...' : fileName;
|
||||
},
|
||||
|
||||
//预览文件
|
||||
previewOptionImg(files, index) {
|
||||
const file = files[index];
|
||||
if (!file || !file.url) return;
|
||||
|
||||
// 所有文件都在新窗口打开
|
||||
window.open(file.url, '_blank');
|
||||
},
|
||||
onOpen(row) {
|
||||
this.row = row
|
||||
this.visible = true
|
||||
this.getInfo()
|
||||
this.getDoneTasks()
|
||||
},
|
||||
// 关闭
|
||||
onClose(){
|
||||
this.visible = false
|
||||
},
|
||||
// 获取申请信息
|
||||
getInfo() {
|
||||
this.$axios.post("/platform/unionReimburse/apply/info", {id: this.row.id}).then((res) => {
|
||||
if (res.code === 0) {
|
||||
this.viewData = res.data
|
||||
}
|
||||
})
|
||||
},
|
||||
// 查看
|
||||
openView(id) {
|
||||
this.$nextTick(() => {
|
||||
this.$refs.infoDialogRef.onOpen(id)
|
||||
})
|
||||
},
|
||||
// 获取已办任务审批记录
|
||||
getDoneTasks() {
|
||||
this.$axios.post("/flow/common/doneTasks", {bizId: this.row.id}).then((res) => {
|
||||
if (res.code === 0) {
|
||||
this.doneTasks = res.data
|
||||
}
|
||||
})
|
||||
},
|
||||
},
|
||||
|
||||
}
|
||||
+141
@@ -0,0 +1,141 @@
|
||||
<!--#
|
||||
layout("/layouts/platform_h5.html"){
|
||||
#-->
|
||||
|
||||
<div id="app" v-cloak>
|
||||
<van-nav-bar @click-left="historyBack" left-arrow left-text="返回" title="我的报销" placeholder fixed></van-nav-bar>
|
||||
<van-sticky offset-top="46px">
|
||||
<van-dropdown-menu :close-on-click-outside="false" :close-on-click-overlay="false">
|
||||
<van-dropdown-item :options="yearList" @change="doSearch" v-model="pageForm.year"></van-dropdown-item>
|
||||
</van-dropdown-menu>
|
||||
</van-sticky>
|
||||
|
||||
|
||||
<table-list api="/platform/unionReimburse/mine/pageData" :page_form.sync="pageForm" ref="tableListRef"
|
||||
@ready="doSearch" title="taskName">
|
||||
<template v-slot="{index,row}">
|
||||
<table-column label="经办人">{{row.userName}}</table-column>
|
||||
<table-column label="所属工会">{{row.unionName}}</table-column>
|
||||
<table-column label="所属单位">{{row.unitName}}</table-column>
|
||||
<table-column label="报销类别">
|
||||
<dict-tag :options="dict.type.UNION_REIMBURSE_TYPE"
|
||||
:value="row.reimburseType">
|
||||
</dict-tag>
|
||||
</table-column>
|
||||
<table-column label="报销项目">
|
||||
<dict-tag :options="dict.type.UNION_REIMBURSE_PROJECT"
|
||||
:value="row.reimburseProject">
|
||||
</dict-tag>
|
||||
</table-column>
|
||||
<table-column label="金额">{{row.money}}</table-column>
|
||||
|
||||
</template>
|
||||
<template #actions="{index,row}">
|
||||
<div class="action-btn" @click="onView(row)">
|
||||
<i class="fa fa-eye"></i>
|
||||
<span>查看</span>
|
||||
</div>
|
||||
<div class="action-btn" @click="onEdit(row)" v-if="row.taskKey === 'startTask' || !row.instanceId">
|
||||
<i class="fa fa-edit"></i>
|
||||
<span>编辑</span>
|
||||
</div>
|
||||
<div class="action-btn delete" v-if="row.canRevoke" @click="onRevoke(row)">
|
||||
<i class="fa fa-undo"></i>
|
||||
<span>撤回</span>
|
||||
</div>
|
||||
<div class="action-btn delete" @click="onDelete(row)" v-if="row.taskKey === 'startTask' || !row.instanceId">
|
||||
<i class="fa fa-trash"></i>
|
||||
<span>删除</span>
|
||||
</div>
|
||||
</template>
|
||||
</table-list>
|
||||
|
||||
<union-reimburse-info ref="unionReimburseInfoRef"></union-reimburse-info>
|
||||
|
||||
</div>
|
||||
<script>
|
||||
<!--#include('../info.js'){}#-->
|
||||
const vue = new Vue({
|
||||
el: "#app",
|
||||
store,
|
||||
dicts: ["UNION_REIMBURSE_TYPE","UNION_REIMBURSE_PROJECT"],
|
||||
components: {
|
||||
"union-reimburse-info":UNION_REIMBURSE_INFO
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
viewShow: false,
|
||||
yearList: [],
|
||||
pageForm: {
|
||||
pageNumber: 1,
|
||||
pageSize: 10,
|
||||
totalCount: 0,
|
||||
searchKeyword: "",
|
||||
year: "",
|
||||
},
|
||||
infoShow: false
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onView(row) {
|
||||
this.showApprovalForm = false
|
||||
this.$refs.unionReimburseInfoRef.onOpen(row)
|
||||
},
|
||||
onEdit(row) {
|
||||
this.$pjaxReplace('/platform/unionReimburse/apply/h5?taskId=' + (row.startTaskId || '') + "&bizId=" + row.id)
|
||||
},
|
||||
|
||||
onRevoke(row){
|
||||
this.$dialog
|
||||
.confirm({
|
||||
title: "提示",
|
||||
message: "您确定要撤销申请吗？"
|
||||
})
|
||||
.then(() => {
|
||||
this.$axios.post("/flow/common/revokeTask", {taskId: row.startTaskId}).then((resp) => {
|
||||
this.$toast.success(resp.msg)
|
||||
this.doSearch()
|
||||
})
|
||||
})
|
||||
},
|
||||
onDelete(row) {
|
||||
this.$dialog
|
||||
.confirm({
|
||||
title: "提示",
|
||||
message: "您确定要删除吗？"
|
||||
})
|
||||
.then(() => {
|
||||
this.$axios.post("/platform/unionReimburse/mine/delete", {id: row.id}).then((resp) => {
|
||||
if (resp.code === 0) {
|
||||
this.$toast.success(resp.msg)
|
||||
this.doSearch()
|
||||
}
|
||||
})
|
||||
})
|
||||
},
|
||||
doSearch() {
|
||||
this.$nextTick(() => {
|
||||
this.pageForm.pageNumber = 1
|
||||
this.pageForm.totalCount = 0
|
||||
this.$refs.tableListRef.doSearch()
|
||||
})
|
||||
},
|
||||
initData() {
|
||||
for (let i = new Date().getFullYear() - 10; i <= new Date().getFullYear(); i++) {
|
||||
this.yearList.unshift({value: i, text: i + "年"})
|
||||
}
|
||||
this.$set(this.pageForm, "year", this.yearList[0].value)
|
||||
},
|
||||
|
||||
},
|
||||
created() {
|
||||
this.initData()
|
||||
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
+175
@@ -0,0 +1,175 @@
|
||||
<!--#
|
||||
layout("/layouts/platform_h5.html"){
|
||||
#-->
|
||||
|
||||
<div id="app" v-cloak>
|
||||
<van-nav-bar @click-left="historyBack" left-arrow left-text="返回" title="报销审核" placeholder fixed></van-nav-bar>
|
||||
<van-sticky offset-top="46px">
|
||||
<van-search
|
||||
:reverse-color="false"
|
||||
:show-action="false"
|
||||
@search="doSearch"
|
||||
input-align="left"
|
||||
placeholder="请输入经办人搜索"
|
||||
v-model="pageForm.userName"
|
||||
></van-search>
|
||||
<van-tabs v-model="pageForm.approvalText"
|
||||
@change="(val)=>{this.pageForm.approval = val==='1';this.doSearch();}">
|
||||
<van-tab title="已审核" name="1"></van-tab>
|
||||
<van-tab title="未审核" name="0"></van-tab>
|
||||
</van-tabs>
|
||||
</van-sticky>
|
||||
|
||||
|
||||
<table-list api="/platform/unionReimburse/review/pageData" :page_form.sync="pageForm" ref="tableListRef"
|
||||
@ready="doSearch" title="curTaskName">
|
||||
<template v-slot="{index,row}">
|
||||
<table-column label="经办人">{{row.userName}}</table-column>
|
||||
<table-column label="所属工会">{{row.unionName}}</table-column>
|
||||
<table-column label="所属单位">{{row.unitName}}</table-column>
|
||||
<table-column label="报销类别">
|
||||
<dict-tag :options="dict.type.UNION_REIMBURSE_TYPE"
|
||||
:value="row.reimburseType">
|
||||
</dict-tag>
|
||||
</table-column>
|
||||
<table-column label="报销项目">
|
||||
<dict-tag :options="dict.type.UNION_REIMBURSE_PROJECT"
|
||||
:value="row.reimburseProject">
|
||||
</dict-tag>
|
||||
</table-column>
|
||||
<table-column label="金额">{{row.money}}</table-column>
|
||||
|
||||
</template>
|
||||
<template #actions="{index,row}">
|
||||
<div class="action-btn" @click="onView(row)">
|
||||
<i class="fa fa-eye"></i>
|
||||
<span>查看</span>
|
||||
</div>
|
||||
<div class="action-btn" v-if="row.taskState === 10" @click="onAudit(row)">
|
||||
<i class="fa fa-edit"></i>
|
||||
<span>审核</span>
|
||||
</div>
|
||||
</template>
|
||||
</table-list>
|
||||
|
||||
<union-reimburse-info ref="unionReimburseInfoRef">
|
||||
<div v-if="showApprovalForm">
|
||||
<div class="process-title">
|
||||
校工会审核
|
||||
</div>
|
||||
<div class="form-container">
|
||||
<van-form ref="formRef">
|
||||
<van-cell-group title="审批意见">
|
||||
<van-field label=""
|
||||
:rules="[{ required: true,message:'请填审批意见' }]"
|
||||
v-model="formData.tf_opinion"
|
||||
required
|
||||
type="textarea"
|
||||
name="tf_opinion"
|
||||
rows="4"
|
||||
autosize
|
||||
class="more-text"
|
||||
placeholder="请填审批意见"></van-field>
|
||||
</van-cell-group>
|
||||
<van-cell-group title="电子签名" class="form-section">
|
||||
<van-field class="more-text" name="tf_userSign" label="">
|
||||
<template #input>
|
||||
<h5-signature v-model="formData.tf_userSign" slot="input"></h5-signature>
|
||||
</template>
|
||||
</van-field>
|
||||
</van-cell-group>
|
||||
<!-- 按钮区域 -->
|
||||
<div class="form-actions">
|
||||
<van-button @click="handleTaskAction(6)">退回到发起人</van-button>
|
||||
<van-button type="danger" @click="handleTaskAction(2)">拒绝申请</van-button>
|
||||
<van-button type="primary" @click="handleTaskAction(1)">同意申请</van-button>
|
||||
</div>
|
||||
</van-form>
|
||||
</div>
|
||||
</div>
|
||||
</union-reimburse-info>
|
||||
|
||||
</div>
|
||||
<script>
|
||||
<!--#include('../info.js'){}#-->
|
||||
const vue = new Vue({
|
||||
el: "#app",
|
||||
store,
|
||||
dicts: ["UNION_REIMBURSE_TYPE","UNION_REIMBURSE_PROJECT"],
|
||||
components: {
|
||||
"union-reimburse-info":UNION_REIMBURSE_INFO
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
pageForm: {
|
||||
pageNumber: 1,
|
||||
pageSize: 10,
|
||||
totalCount: 0,
|
||||
searchKeyword: "",
|
||||
approvalText: "0",
|
||||
approval: false,
|
||||
year: new Date().getFullYear(),
|
||||
},
|
||||
formData: {},
|
||||
showApprovalForm: false,
|
||||
infoShow: false
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
handleTaskAction(val) {
|
||||
this.$refs.formRef.validate().then(() => {
|
||||
this.$dialog.confirm({
|
||||
title: '温馨提示',
|
||||
message: '您确定要提交吗？',
|
||||
}).then(() => {
|
||||
this.$axios.post('/flow/common/executeTask', {
|
||||
data: JSON.stringify({
|
||||
...this.formData,
|
||||
submitType: val
|
||||
})
|
||||
}).then(res => {
|
||||
if (res.code === 0) {
|
||||
this.$toast.success("提交成功")
|
||||
this.doSearch()
|
||||
this.$refs.unionReimburseInfoRef.onClose()
|
||||
}
|
||||
})
|
||||
}).catch(() => {
|
||||
// on cancel
|
||||
});
|
||||
}).catch();
|
||||
},
|
||||
onView(row) {
|
||||
this.showApprovalForm = false
|
||||
this.$refs.unionReimburseInfoRef.onOpen(row)
|
||||
},
|
||||
onAudit(row) {
|
||||
this.showApprovalForm = true
|
||||
this.formData = {
|
||||
tf_opinion: null,
|
||||
tf_userSign: null,
|
||||
processTaskId: row.taskId,
|
||||
taskName: row.curTaskName
|
||||
}
|
||||
this.$refs.unionReimburseInfoRef.onOpen(row)
|
||||
},
|
||||
|
||||
doSearch() {
|
||||
this.$nextTick(() => {
|
||||
this.pageForm.pageNumber = 1
|
||||
this.pageForm.totalCount = 0
|
||||
this.$refs.tableListRef.doSearch()
|
||||
})
|
||||
},
|
||||
|
||||
},
|
||||
created() {
|
||||
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
|
||||
<!--#
|
||||
}
|
||||
#-->
|
||||
Reference in New Issue
Block a user