xg_total_process_master_cloud_h5/pages/cw/invoice/InvoiceFormTask.vue

<template>
    <view>
        <cu-custom :backUrl="'/pages/index/index'" :isBack="true" bgColor="bg-gradual-blue" >
            <block slot="content">发票申请</block>
        </cu-custom>
        <u--form :model="inputForm" labelWidth="100px" class="u-form" labelPosition="left" :rules="rules" ref="inputForm" v-if="!nodeFlag">


            <el-row  :gutter="15" :key="index_experience" v-for="(item,index_experience) in this.inputForm.financeInvoiceBaseDTOList">
                <el-col :span="24">
                    <u-form-item label="" >
                        <el-divider content-position="left"> 基本信息详情 {{index_experience + 1}}</el-divider>
                    </u-form-item>
                </el-col>

                <el-col :span="24">
                    <u-form-item label="项目名称" :prop="'financeInvoiceBaseDTOList[' + index_experience + '].programName'"
                                 :rules="[
				     ]">
                        <u--input v-model="inputForm.financeInvoiceBaseDTOList[index_experience].programName" placeholder="请选择项目名称" @focus="showProject(index_experience)" clearable></u--input>
                    </u-form-item>
                    <u-form-item label="合同名称" :prop="'financeInvoiceBaseDTOList[' + index_experience + '].contractName'"
                                 :rules="[
				     ]">
                        <u--input v-model="inputForm.financeInvoiceBaseDTOList[index_experience].contractName" :readonly="true"  placeholder="请填写合同名称" clearable></u--input>
                    </u-form-item>
                    <u-form-item label="项目编号" :prop="'financeInvoiceBaseDTOList[' + index_experience + '].programNo'"
                                 :rules="[
				     ]">
                        <u--input v-model="inputForm.financeInvoiceBaseDTOList[index_experience].programNo" :readonly="true" placeholder="请填写项目编号" clearable></u--input>
                    </u-form-item>
                    <u-form-item label="报告号" :prop="'financeInvoiceBaseDTOList[' + index_experience + '].reportNo'"
                                 :rules="[
				     ]">
                        <u--input v-model="inputForm.financeInvoiceBaseDTOList[index_experience].reportNo" :readonly="true" placeholder="请填写报告号" clearable></u--input>
                    </u-form-item>
                    <u-form-item label="发票金额(元)" :prop="'financeInvoiceBaseDTOList[' + index_experience + '].account'" :required="true"
                                 :rules="[
				     ]">
                        <u--input v-model="inputForm.financeInvoiceBaseDTOList[index_experience].account" @blur="onInputCode(index_experience, $event,'account')" placeholder="请填写发票金额(元)" clearable></u--input>
                    </u-form-item>
                </el-col>

                <el-col :span="24" style="text-align: center">
                    <u-form-item label="" >
                        <el-button style="width: 100%" type="danger" @click="removeRow(index_experience)" plain>删除基本信息 {{index_experience + 1}}</el-button>
                    </u-form-item>
                </el-col>
            </el-row>
            <u-form-item label="" >
                <el-button style="width: 100%" type="primary" @click="addRow()" plain>新增基本信息</el-button>
            </u-form-item>
            <u-form-item label="" >
                <el-divider content-position="left"> 发票详情</el-divider>
            </u-form-item>
            <u-form-item label="发票类型" borderBottom prop="type" :required="true">
                <u-radio-group v-model="inputForm.type" >
                    <u-radio
                            :disabled="testFlag"
                            :customStyle="{marginRight: '16px'}"
                            v-for="(item, index) in typeList"
                            :key="index"
                            :label="item.name"
                            :name="item.value"
                    ></u-radio>
                </u-radio-group>
            </u-form-item>
            <u-form-item label="发票申请编号" prop="no"
                         :rules="[
				     ]">
                <u--input v-model="inputForm.no" :disabled="true" placeholder="请填写发票申请编号" clearable></u--input>
            </u-form-item>
            <u-form-item label="开票类型" borderBottom prop="billingType" :required="true">
                <u-radio-group v-model="inputForm.billingType" >
                    <u-radio
                            :disabled="testFlag"
                            :customStyle="{marginRight: '16px'}"
                            v-for="(item, index) in billingTypeList"
                            :key="index"
                            :label="item.name"
                            :name="item.value"
                            @change="reimbursementTypeChange"
                    ></u-radio>
                </u-radio-group>
            </u-form-item>
            <u-form-item label="实际开票单位" prop="billingWorkplaceReal" v-if="inputForm.billingType === '1'" :required="true"
                         :rules="[
				     ]">
                <u--input v-model="inputForm.billingWorkplaceReal" @focus="showWorkplace()" placeholder="请填写实际开票单位" clearable></u--input>
            </u-form-item>
            <template v-if="inputForm.type === '1'">
                <u-form-item label="纳税人识别号" prop="taxpayerIdentificationNo" v-if="inputForm.billingType === '1'" :required="true"
                             :rules="[
				     ]">
                    <u--input v-model="inputForm.taxpayerIdentificationNo"  placeholder="请填写纳税人识别号" clearable></u--input>
                </u-form-item>

                <u-form-item label="地址" prop="address" v-if="inputForm.billingType === '1'" :required="true"
                             :rules="[
				     ]">
                    <u--input v-model="inputForm.address"  placeholder="请填写地址" clearable></u--input>
                </u-form-item>
                <u-form-item label="电话" prop="telPhone" v-if="inputForm.billingType === '1'" :required="true"
                             :rules="[
				     ]">
                    <u--input v-model="inputForm.telPhone"  placeholder="请填写电话" clearable></u--input>
                </u-form-item>

                <u-form-item label="开户银行" borderBottom v-if="inputForm.billingType === '1'" prop="openBank" :required="true">
                    <jp-picker v-model="inputForm.openBank" @input="changeBank" rangeKey="label" rangeValue="value" :range=bankList ></jp-picker>
                </u-form-item>


                <u-form-item label="银行账号" borderBottom v-if="inputForm.billingType === '1'" prop="bankAccount" :required="true">
                    <u--input v-model="inputForm.bankAccount" :disabled="true" placeholder="请填写银行账号" clearable></u--input>
                </u-form-item>

            </template>
            <template v-if="inputForm.type !== '1'">
                <u-form-item label="纳税人识别号" v-if="inputForm.billingType === '1'" prop="taxpayerIdentificationNo"
                             :rules="[
				     ]">
                    <u--input v-model="inputForm.taxpayerIdentificationNo"  placeholder="请填写纳税人识别号" clearable></u--input>
                </u-form-item>
                <u-form-item label="地址" prop="address" v-if="inputForm.billingType === '1'"
                             :rules="[
				     ]">
                    <u--input v-model="inputForm.address"  placeholder="请填写地址" clearable></u--input>
                </u-form-item>
                <u-form-item label="电话" prop="telPhone" v-if="inputForm.billingType === '1'"
                             :rules="[
				     ]">
                    <u--input v-model="inputForm.telPhone"  placeholder="请填写电话" clearable></u--input>
                </u-form-item>
                <u-form-item label="开户银行" borderBottom v-if="inputForm.billingType === '1'" prop="openBank" >
                    <jp-picker v-model="inputForm.openBank" @input="changeBank" rangeKey="label" rangeValue="value" :range=bankList ></jp-picker>
                </u-form-item>
                <u-form-item label="银行账号" v-if="inputForm.billingType === '1'" borderBottom prop="bankAccount" >
                    <u--input v-model="inputForm.bankAccount" :disabled="true" placeholder="请填写银行账号" clearable></u--input>
                </u-form-item>

            </template>

            <u-form-item label="姓名" v-if="inputForm.billingType === '2'" prop="nameShow" :required="true"
                         :rules="[
				     ]">
                <u--input v-model="inputForm.nameShow" placeholder="请选择" @focus="openUserPullForm('','姓名')" clearable></u--input>
            </u-form-item>

            <u-form-item label="收款类型" borderBottom prop="receivablesType" :required="true">
                <jp-picker v-model="inputForm.receivablesType" rangeKey="label" rangeValue="value" :range="[
                    { label: '单一收费', value: '1' },
                    { label: '合并收费', value: '2' },
                ]" ></jp-picker>
            </u-form-item>
            <u-form-item label="开票内容" borderBottom prop="billingContent" :required="true">
                <jp-picker v-model="inputForm.billingContent" rangeKey="label" rangeValue="value" :range="[
                    { label: '审计费', value: '1' },
                    { label: '工程审核费', value: '2' },
                    { label: '咨询费', value: '3' },
                    { label: '预算编制费', value: '4' },
                    { label: '招标代理费', value: '5' },
                    { label: '司法鉴定费', value: '6' },
                    { label: '其他', value: '8' },
                    { label: '技术服务费', value: '9' },
                    { label: '鉴证咨询服务*评估费', value: '10' },
                    { label: '其他咨询服务*专家咨询费', value: '11' },
                    { label: '会计服务', value: '12' },
                    { label: '竣工决算编制费', value: '13' },
                    { label: '*信息技术服务*技术服务费', value: '14' },
                ]" ></jp-picker>
            </u-form-item>
            <u-form-item label="发票金额(元)" borderBottom prop="accountTotal" :required="true">
                <u--input v-model="inputForm.accountTotal" :disabled="true" placeholder="请填写发票金额" clearable></u--input>
            </u-form-item>
            <u-form-item label="报备类型" borderBottom prop="reportType" :required="true">
                <jp-picker v-model="inputForm.reportType" rangeKey="label" rangeValue="value" :range="[
                    { label: '上市公司审计', value: '1' },
                    { label: '国有大型企业审计', value: '2' },
                    { label: '新三板企业审计', value: '3' },
                    { label: '一般企业审计', value: '4' },
                    { label: '事业单位审计', value: '5' },
                    { label: '民间非营利组织等其他单位审计', value: '6' },
                    { label: '内控审计报告', value: '7' },
                    { label: '内控鉴证报告', value: '8' },
                    { label: '其他报告', value: '9' },
                    { label: '专项审计业务', value: '10' },
                    { label: '验资业务', value: '11' },
                ]" ></jp-picker>
            </u-form-item>
            <u-form-item label="是否多张开票" borderBottom prop="isMultiple" :required="true">
                <u-radio-group v-model="inputForm.isMultiple" >
                    <u-radio
                            :disabled="testFlag"
                            :customStyle="{marginRight: '16px'}"
                            v-for="(item, index) in yesNoFlag"
                            :key="index"
                            :label="item.name"
                            :name="item.value"
                    ></u-radio>
                </u-radio-group>
            </u-form-item>
            <u-form-item label="开票内容要求" borderBottom prop="billingContentTerms">
                <u--textarea  placeholder='开票内容要求' :maxlength="500" v-model="inputForm.billingContentTerms" ></u--textarea>
            </u-form-item>
            <u-form-item label="开票人" borderBottom prop="billingPeople" >
                <u--input v-model="inputForm.billingPeople" :disabled="true" placeholder="请选择开票人" clearable></u--input>
            </u-form-item>
            <u-form-item label="开票时间" prop="billingDate" :required="true"
                         :rules="[
				     ]">
                <el-date-picker
                        :disabled="true"
                        v-model="inputForm.billingDate"
                        type="date"
                        style="width:100%"
                        size="default"
                        placement="bottom-start"
                        clearable>
                </el-date-picker>
            </u-form-item>
            <u-form-item label="领票时间" prop="collectDate"
                         :rules="[
				     ]">
                <el-date-picker
                        :disabled="true"
                        v-model="inputForm.collectDate"
                        type="date"
                        style="width:100%"
                        size="default"
                        placement="bottom-start"
                        clearable>
                </el-date-picker>
            </u-form-item>
            <u-form-item label="实际开票人" prop="billingPeopleRealName" :required="true"
                         :rules="[
				     ]">
                <u--input v-model="inputForm.billingPeopleRealName" placeholder="请选择实际开票人" @focus="openUserPullForm('','实际')" clearable></u--input>
            </u-form-item>
            <u-form-item label="接收邮箱" prop="actualDrawerEmailAddress"
                         :rules="[
				     ]">
                <u--input v-model="inputForm.actualDrawerEmailAddress" placeholder="请输入接收邮箱"  clearable></u--input>
                <view class="button-container">
                    <button @click="openDia">完善邮箱</button>
                </view>
            </u-form-item>
            <u-form-item label="对账人" prop="reconciliationPeopleName" :required="true"
                         :rules="[
				     ]">
                <u--input v-model="inputForm.reconciliationPeopleName" placeholder="请选择对账人" @focus="openUserPullForm('','对账')" clearable></u--input>
            </u-form-item>
            <u-form-item label="对账地区" borderBottom prop="reconciliationArea" :required="true">
                <jp-area-select v-model="inputForm.reconciliationArea"></jp-area-select>
            </u-form-item>
            <u-form-item label="备注" borderBottom prop="remarks">
                <u--textarea  placeholder='请填写备注' :maxlength="500" v-model="inputForm.remarks" ></u--textarea>
            </u-form-item>

            <u-form-item label="附件">
                <el-upload
                        class="upload-demo"
                        :action="`http://5hrd5v.natappfree.cc/api/public-modules-server/oss/file/webUpload/upload`"
                        :on-remove="(file, fileList) => handleRemove(file, fileList)"
                        :file-list="inputForm.files"
                        :on-success="(response, file, fileList) => handleUploadSuccess(response, file, fileList)"
                        :limit="3">
                    <el-button size="small" type="primary">点击上传</el-button>
                    <div slot="tip" class="el-upload__tip">只能上传不超过 3 个文件</div>
                    <template slot="file" slot-scope="{ file }" v-if="shouldShowFile(file) || testFlag">
                        <span @click="handleFileClick(file)">{{ file.name }}</span>
                        <el-button type="text" icon="el-icon-close" @click="handleDelete(file)">✕</el-button>
                    </template>
                </el-upload>
            </u-form-item>
        </u--form>
        <user-select ref="userPicker" @input="handleEvent"></user-select>
        <InvoiceProjectChoose ref="invoiceProjectChoose" @input="selectProjectChange" title="报告项目选择"/>
        <WorkPlaceChoose ref="workPlaceChoose" @input="getWorkClient" title="客户选择"/>
        <EmailForm ref="emailForm" @input="emailForm" title="完善邮箱"/>
    </view>
</template>

<script>
    import financeInvoiceService from '@/api/cw/invoice/CwFinanceInvoiceService'
    var  graceChecker = require("@/common/graceChecker.js");
    import workClientService from '@/api/cw/workClientInfo/WorkClientService'
    import InvoiceProjectChoose from './InvoiceProjectChoose'
    import WorkPlaceChoose from './WorkPlaceChoose'
    import EmailForm from './EmailForm'
    import userSelect from '@/components/user-select/user-select-radio.vue'
    import OSSService from "@/api/sys/OSSService"
    import MaterialTypeService from '@/api/materialManagement/MaterialTypeService'
    import WareHouseService from '@/api/materialManagement/WareHouseService'
    import CommonApi from '@/api/common/CommonApi'
    import {mapState, mapMutations, mapActions} from 'vuex'
    export default {
        components: {
            EmailForm,
            userSelect,
            InvoiceProjectChoose,
            WorkPlaceChoose,
        },
        computed: mapState({
            userInfo: (state) => state.user.userInfo,
            avatar: (state) => state.user.avatar
        }),
        data () {
            return {
                isPreInvoice: '',
                yesNoFlag: [{name: '否', value: '0'}, {name: '是', value: '1'}],
                bj1: "",
                areaList: [],
                typeList: [{
                    name: '专票',
                    value: '1',
                    disabled: false
                },{
                    name: '普票',
                    value: '2',
                    disabled: false
                }],
                billingTypeList: [{
                    name: '企业开票',
                    value: '1',
                    disabled: false
                },{
                    name: '个人开票',
                    value: '2',
                    disabled: false
                }],
                showFileList: [], // 控制每个文件是否显示的数组
                testFlag: false,
                nodeFlag: false,
                bankList: [],
                inputForm: {
                    account: '',
                    accountTotal: '',//发票汇总金额
                    financeInvoiceBaseDTOList: [],
                    files: [], // 附件信息
                    procInsId: '',
                    type: '1',
                    no: '',
                    billingType: '1',
                    billingWorkplaceReal: '',
                    billingWorkplaceRealId: '',
                    taxpayerIdentificationNo: '',
                    address: '',
                    telPhone: '',
                    billingId: '',
                    openBank: '',
                    bankAccount: '',
                    receivablesType: '',
                    billingContent: '',
                    reportType: '',
                    isMultiple: '0',
                    billingContentTerms: '',
                    billingPeople: '',
                    billingPeopleRealName: '',
                    billingPeopleReal: '',
                    actualDrawerEmailAddress: '',
                    reconciliationPeopleName: '',
                    reconciliationPeople: '',
                    reconciliationArea: '',
                    remarks: '',
                    name: '',
                    nameShow: '',
                    billingDate: '',
                    collectDate: '',
                    programId: '',
                },
                rules: {
                    'telPhone': [
                        {
                            required: true,
                            message: '电话不能为空',
                            trigger: ['blur', 'change']
                        },
                        {
                            validator: (rule, value, callback) => this.validatePhone(value, callback),
                            trigger: ['blur', 'change']
                        }
                    ],
                    'actualDrawerEmailAddress': [
                        {
                            validator: (rule, value, callback) => this.checkEmail(value, callback),
                            trigger: ['blur']
                        }
                    ],
                }
            }
        },
        ossService: null,
        materialTypeService: null,
        wareHouseService: null,
        commonApi: null,
        // 页面加载时执行
        created() {
            this.ossService = new OSSService()
            this.commonApi = new CommonApi()
            this.materialTypeService = new MaterialTypeService()
            this.wareHouseService = new WareHouseService()

            this.inputForm.actualDrawerEmailAddress = this.userInfo.email
            this.inputForm.handledBy = this.userInfo.name
            this.inputForm.handledById = this.userInfo.id
            this.inputForm.handledByOffice = this.userInfo.officeDTO.id
            this.inputForm.handledByOfficeName = this.userInfo.officeDTO.name

        },
        props: {
            businessId: {
                type: String,
                default: ''
            },
            formReadOnly: {
                type: Boolean,
                default: false
            }
        },
        watch: {
            'businessId': {
                handler (newVal) {
                    if (this.businessId) {
                        this.init(this.businessId)
                    } else {
                        this.$nextTick(() => {
                            // this.$refs.inputForm.reset()
                        })
                    }
                },
                immediate: true,
                deep: false
            }
        },
        methods: {
            init (id) {
                this.nodeFlag = true
                this.inputForm.id = id
                if (id) {
                    financeInvoiceService.queryById(id).then((data) => {

                        this.commonApi.getTaskNameByProcInsId(data.procInsId).then((data) => {
                            if (this.isNotEmpty(data)) {
                                if (data === '发起人重新申请' || this.isEmpty(data)) {
                                    this.nodeFlag = false
                                } else {
                                    this.nodeFlag = true
                                }
                            }
                        })
                        this.inputForm = this.recover(this.inputForm, data)

                        if (this.inputForm.files) {
                            this.inputForm.files.forEach( (item,index) => {
                                this.$set(this.showFileList, index, true);
                            })
                        }
                    })
                    if (!this.isEmpty(this.inputForm.billingWorkplaceRealId)) {
                        this.bankList = []
                        workClientService.queryById(this.inputForm.billingWorkplaceRealId).then((data) => {
                            if (this.isNotEmpty(data.cwWorkClientBillingDTOList)) {
                                data.cwWorkClientBillingDTOList.forEach(i => {
                                    i.ourBank = i.accountHolder
                                    this.bankList.push(i)
                                    this.inputForm.openBank = i.ourBank
                                })
                            } else {
                                this.bankList = []
                            }
                        })
                    }
                }
            },
            formatDate(date) {
                const dateNew = new Date(date); // 将日期字符串转换为 Date 对象
                const year = dateNew.getFullYear();
                const month = (dateNew.getMonth() + 1).toString().padStart(2, '0');
                const day = dateNew.getDate().toString().padStart(2, '0');
                return `${year}-${month}-${day}`;
            },
            isEmpty(value) {
                let result = false;
                if (value == null || value == undefined) {
                    result = true;
                }
                if (typeof value == 'string' && (value.replace(/\s+/g, "") == "" || value == "")) {
                    result = true;
                }
                if (typeof value == "object" && value instanceof Array && value.length === 0) {
                    result = true;
                }
                return result;
            },
            isNotEmpty (value) {
                return !this.isEmpty(value)
            },
            /**
             * 判断是否为空
             */
            isNull(val) {
                if (val instanceof Array) {
                    if (val.length === 0) return true;
                } else if (val instanceof Object) {
                    if (JSON.stringify(val) === "{}") return true;
                } else {
                    if (
                        val === "null" ||
                        val == null ||
                        val === "undefined" ||
                        val === undefined ||
                        val === ""
                    )
                        return true;
                    return false;
                }
                return false;
            },
            addRow() {
                if (this.inputForm.financeInvoiceBaseDTOList.length === 0) {
                    this.inputForm.financeInvoiceBaseDTOList.push({ recipientAgent: this.userInfo.name,
                            recipientAgentId: this.userInfo.id, recipientOffice: this.userInfo.officeDTO.name });
                } else {
                    if (this.isNotEmpty(this.inputForm.financeInvoiceBaseDTOList[0].programName)) {
                        this.inputForm.financeInvoiceBaseDTOList.push({ recipientAgent: this.userInfo.name,
                            recipientAgentId: this.userInfo.id, recipientOffice: this.userInfo.officeDTO.name });
                    } else {
                        uni.showToast({
                            title: '非项目,只能有一条非项目数据',
                            icon: 'none',
                            duration: 2000
                        });
                    }
                }
                // 点击新增按钮时，向表格中添加一行空数据
                // this.inputForm.financeInvoiceBaseDTOList.push({ recipientAgent: this.userInfo.name,
                //     recipientAgentId: this.userInfo.id, recipientOffice: this.userInfo.officeDTO.name });

            },
            removeRow(index) {
                // 点击删除按钮时，从表格中移除指定行
                this.inputForm.financeInvoiceBaseDTOList.splice(index, 1);

                let currentAccountTotal = 0; // 初始化为 0

                // 遍历 financeInvoiceBaseDTOList，累加每一行的 account
                this.inputForm.financeInvoiceBaseDTOList.forEach(item => {
                    currentAccountTotal += parseFloat(item.account || 0); // 获取当前行的 account，若为空则设为 0
                });

                // 设置新的 accountTotal
                this.$set(this.inputForm, 'accountTotal', currentAccountTotal);
            },

            formatDateNew(date) {
                const year = date.getFullYear();
                const month = (date.getMonth() + 1).toString().padStart(2, '0');
                const day = date.getDate().toString().padStart(2, '0');
                const hours = date.getHours().toString().padStart(2, '0');
                const minutes = date.getMinutes().toString().padStart(2, '0');
                const seconds = date.getSeconds().toString().padStart(2, '0');

                return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}`;
            },
            handleUploadSuccess (res, file, fileList) {

                // 将 fileList 转换为你期望的格式
                const formattedFiles = fileList.map(fileItem => {
                    return {
                        name: fileItem.name,
                        size: fileItem.size,
                        url: fileItem.response ? '/' + fileItem.response.url : fileItem.url,
                        lsUrl: fileItem.response ? fileItem.response.lsUrl : fileItem.lsUrl, // 如果没有 lsUrl，可以根据需要设置为空字符串或其他默认值
                        createBy: this.userInfo,
                        by: this.userInfo.id,
                        createTime: this.formatDateNew(new Date())
                    };
                });
                this.inputForm.files = formattedFiles
                fileList.forEach((item, index) => {
                    if (item === file) {
                        this.$set(this.showFileList, index, true);
                    }
                });

                // 强制更新视图
                this.$forceUpdate();
            },
            handleRemove(file, fileList) {
                // 处理移除文件逻辑
                // file 是移除的文件
                // fileList 是当前文件列表
                const formattedFiles = fileList.map(fileItem => {
                    return {
                        name: fileItem.name,
                        size: fileItem.size,
                        url: '/' + fileItem.response.url,
                        createBy: this.userInfo,
                        by: this.userInfo.id,
                        createTime: this.formatDateNew(new Date())
                    };
                });
                this.inputForm.files = formattedFiles
            },
            saveForm(callback) {
                return new Promise((resolve, reject) => {
                    // 表单规则验证
                    // ...

                    let errors = [];

                    if (this.isEmpty(this.inputForm.financeInvoiceBaseDTOList)) {
                        errors.push('至少新增一条基本信息');
                    } else {
                        let i = this.inputForm.financeInvoiceBaseDTOList.length;
                        for (let j = 0; j < i; j++) {
                            let k = j + 1;
                            if (this.isEmpty(this.inputForm.financeInvoiceBaseDTOList[j].account)) {
                                errors.push('第' + k + '行的发票金额不能为空');
                            }

                        }
                    }


                    //验证邮箱

                    if (this.isNotEmpty(this.inputForm.actualDrawerEmailAddress)) {
                        var reg = /^\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/;
                        if (!reg.test(this.inputForm.actualDrawerEmailAddress)) {
                            errors.push('请输入正确的邮箱地址');
                        }
                    }


                    if (errors.length > 0) {
                        // 存在错误，显示提示信息
                        errors.forEach(error => {
                            uni.showToast({
                                title: error,
                                icon: 'none',
                                duration: 2000
                            });
                        });
                        reject('Form validation failed');
                    } else {
                        this.inputForm.account = this.inputForm.accountTotal
                        // 所有验证通过，执行保存操作
                        this.$refs.inputForm.validate().then(() => {
                            uni.showLoading();
                            this.inputForm.status = '2';
                            financeInvoiceService.saveForm(this.inputForm).then(data => {
                                callback(data.businessTable, data.businessId);
                                resolve('Form saved successfully');
                            }).catch(error => {
                                reject('Save operation failed');
                            });
                        }).catch(() => {
                            reject('Form validation failed');
                        });
                    }
                });
            },

            // 修改状态
            async updateStatusById (type, callback) {
                if (type === 'reject' || type === 'reback') {
                    financeInvoiceService.queryById(this.inputForm.id).then((data) => {
                        if (data.status !== '2') { // status的值不等于“审核中”，就弹出提示
                            this.loading = false
                            this.$message.error('任务数据已发生改变或不存在，请在待办任务中确认此任务是否存在')
                            throw new Error()
                        } else {
                            if (type === 'reject') {
                                // 驳回
                                this.inputForm.status = '4'
                            }
                            if (type === 'reback') {
                                // 撤回
                                this.inputForm.status = '3'
                            }
                            if (type === 'reject' || type === 'reback') {
                                let param = {status: this.inputForm.status, id: this.inputForm.id}
                                financeInvoiceService.updateStatusById(param).then(() => {
                                    this.loading = false
                                    callback()
                                })
                            }
                        }
                    })
                } else if (type === 'hold') {
                    financeInvoiceService.queryById(this.inputForm.id).then((data) => {
                        if (data.status !== '4') { // status的值不等于“驳回”就弹出提示
                            this.loading = false
                            this.$message.error('任务数据已发生改变或不存在，请在待办任务中确认此任务是否存在')
                            throw new Error()
                        } else {
                            // 终止
                            let param = {status: '1', id: this.inputForm.id}
                            financeInvoiceService.updateStatusById(param).then(() => {
                                this.loading = false
                                callback()
                            })
                        }
                    })
                }
            },
            reapplyForm (callback) {
                this.loading = true
                financeInvoiceService.queryById(this.inputForm.id).then((data) => {
                    if (data.status !== '4') { // 审核状态不是“驳回”，就弹出提示
                        this.loading = false
                        this.$message.error('任务数据已发生改变或不存在，请在待办任务中确认此任务是否存在')
                        throw new Error('任务数据已发生改变或不存在，请在待办任务中确认此任务是否存在')
                    } else {
                        this.startFormTrue(callback)
                    }
                })
            },
            // 送审
            async startFormTrue (callback) {
                this.$refs.inputForm.validate().then(res => {
                    this.inputForm.status = '2'
                    financeInvoiceService.saveForm(this.inputForm).then((data) => {
                        this.inputForm.id = data.businessId
                        callback(data.businessTable, data.businessId, this.inputForm)
                        this.$refs.inputForm.resetFields()
                        this.loading = false
                    }).catch(() => {
                        this.$refs.inputForm.resetFields()
                    }).catch((e) => {

                    })
                })
            },
            // 通过
            async agreeForm (callback) {
                this.$refs.inputForm.validate().then(res => {
                    this.inputForm.status = '5'
                    financeInvoiceService.saveForm(this.inputForm).then((data) => {
                        callback(data.businessTable, data.businessId, this.inputForm)
                        this.$refs.inputForm.resetFields()
                        this.loading = false
                    }).catch(() => {
                        this.loading = false
                        this.$refs.inputForm.resetFields()
                    })
                })
            },
            shouldShowFile(file) {
                if (this.inputForm.files && this.inputForm.files.length > 0) {
                    // 返回一个布尔值，确定是否显示上传成功后的文件
                    return this.showFileList[this.inputForm.files.indexOf(file)];
                }
                return false; // 默认返回 false 或者其他适当的
            },
            async handleFileClick(file) {
                await this.ossService.getTemporaryUrl(file.url).then((data) => {
                    file.lsUrl = data
                })
                if (this.isImage(file.name)) {
                    // 如果是图片文件，则执行放大显示图片的逻辑
                    this.handleImageClick(file);
                } else {
                    // window.open(file.lsUrl, '_blank')
                    window.location.href = file.lsUrl
                    // 如果不是图片文件，则执行其他操作，比如下载文件等
                }
            },
            handleImageClick(file) {
                // 在点击图片时执行放大显示的逻辑
                this.$alert(`<img src="${file.lsUrl}" style="max-width: 100%; max-height: 100%;" />`, '图片详情', {
                    dangerouslyUseHTMLString: true,
                    customClass: 'custom-alert'
                });
            },
            // 判断文件是否是图片类型
            isImage(fileName) {
                const ext = fileName.toLowerCase().split('.').pop(); // 获取文件的后缀名
                return ['jpg', 'jpeg', 'png', 'gif', 'bmp'].includes(ext); // 判断后缀名是否是图片类型
            },
            handleDelete(file) {
                // 处理删除文件的逻辑
                // 从文件列表中移除文件
                const index = this.inputForm.files.indexOf(file);
                if (index !== -1) {
                    this.inputForm.files.splice(index, 1);
                    this.showFileList.splice(index, 1); // 从showFileList中移除对应的元素
                }

            },
            // 输入值改变事件处理程序
            onInputCode(index, event,type) {
                const inputValue = event
                const formattedValue = this.formatInput(inputValue);
                if (type === 'account') {
                    this.$set(this.inputForm.financeInvoiceBaseDTOList[index], 'account', formattedValue)
                    // 计算 accountTotal 的新值
                    const currentAccountTotal = parseFloat(this.inputForm.accountTotal || 0); // 获取当前 accountTotal，若为空则设为 0
                    const newAccountTotal = currentAccountTotal + parseFloat(formattedValue);

                    // 设置新的 accountTotal
                    this.$set(this.inputForm, 'accountTotal', newAccountTotal);
                }
            },
            // 通用的输入限制和格式化方法
            formatInput(inputValue, decimalLimit = 2) {
                // 如果输入值不是数字或者不是有效的小数，则返回空字符串
                if (!/^\d*\.?\d*$/.test(inputValue)) {
                    return '';
                }

                // 只保留数字和一个小数点
                let value = inputValue.replace(/[^\d.]/g, '');
                // 只允许一个小数点
                const dotIndex = value.indexOf('.');
                if (dotIndex !== -1) {
                    const substr = value.substr(dotIndex + 1);
                    if (substr.indexOf('.') !== -1) {
                        value = value.substr(0, dotIndex + 1) + substr.replace(/\./g, '');
                    }
                }
                // 限制小数位数为指定的decimalLimit位数
                if (dotIndex !== -1) {
                    const integerPart = value.substring(0, dotIndex);
                    const decimalPart = value.substring(dotIndex + 1);
                    value = integerPart + '.' + decimalPart.slice(0, decimalLimit);
                }
                return value;
            },
            reimbursementTypeChange(value) {
                this.inputForm.address = ''
                this.inputForm.telPhone = ''
                this.inputForm.billingId = ''
                this.inputForm.billingWorkplaceReal = ''
                this.inputForm.billingWorkplaceRealId = ''
                this.inputForm.taxpayerIdentificationNo = ''
                this.bankList = []
                this.inputForm.bankAccount = ''
                this.inputForm.openBank = ''
                this.inputForm.name = ''
            },
            openUserPullForm(index,type) {
                // 点击 "采购人" 输入框时打开userPullForm页面，传入index用于区分不同的行
                // uni.navigateTo({
                //     url: '/pages/materialManagement/collect/UserPullForm?index=' + index // userPullForm页面的路径
                // });
                this.$refs.userPicker.open(index,type);
            },
            handleEvent(data,index,type) {
                if (type === '实际') {
                    this.inputForm.billingPeopleRealName = data.label
                    this.inputForm.billingPeopleReal = data.id
                } else if (type === '对账') {
                    this.inputForm.reconciliationPeopleName = data.label
                    this.inputForm.reconciliationPeople = data.id
                } else if (type === '姓名') {
                    this.inputForm.nameShow = data.label
                    this.inputForm.name = data.id
                }

            },
            // 显示  项目选择器
            showProject(index) {
                if (this.inputForm.financeInvoiceBaseDTOList.length > 0 && this.isNotEmpty(this.inputForm.financeInvoiceBaseDTOList[0].programName)){
                    if (this.isNotEmpty(this.inputForm.financeInvoiceBaseDTOList[0].reportNo)) {
                        this.$refs.invoiceProjectChoose.init(index,'2');
                    } else {
                        this.$refs.invoiceProjectChoose.init(index,'1');

                    }
                } else {
                    this.$refs.invoiceProjectChoose.init(index);
                }

            },
            // 实际开票单位选择
            showWorkplace() {
                this.$refs.workPlaceChoose.init();

            },
            selectProjectChange(rows, index) {
                if (rows.length > 0) {
                    rows.forEach((item, rowIndex) => {
                        this.inputForm.programId = item.id;
                        if (rowIndex === 0) {
                            let r = this.inputForm.financeInvoiceBaseDTOList[index];
                            if (!r) {
                                r = {};
                            }
                            r.programName = item.projectName;
                            r.contractName = item.contractName;
                            r.programNo = item.projectNumber;
                            r.contractId = item.contractId;
                            r.programId = item.id;
                            r.reportNo = item.reportNo;
                            r.reportType = item.reportType;
                            r.isPreInvoice = item.isPreInvoice;
                            this.$set(this.inputForm.financeInvoiceBaseDTOList, index, r);
                        } else {
                            let r = {
                                programName: item.projectName,
                                contractName: item.contractName,
                                programNo: item.projectNumber,
                                contractId: item.contractId,
                                programId: item.id,
                                reportNo: item.reportNo,
                                reportType: item.reportType,
                                isPreInvoice: item.isPreInvoice
                            }
                            this.inputForm.financeInvoiceBaseDTOList.push(r);
                        }
                    });
                } else {
                    let r = {
                        programName: rows.projectName,
                        contractName: rows.contractName,
                        programNo: rows.projectNumber,
                        contractId: rows.contractId,
                        programId: rows.id,
                        reportNo: rows.reportNo,
                        reportType: rows.reportType,
                        isPreInvoice: rows.isPreInvoice
                    }
                    if (!this.inputForm.detailInfoReports) {
                        this.$set(this.inputForm, 'detailInfoReports', []);
                    }
                    this.$set(this.inputForm.detailInfoReports, index, r);
                    this.isPreInvoice = rows.isPreInvoice;
                    this.inputForm.programId = rows.id;
                }
            },
            getWorkClient(row) {
                this.bankList = []
                this.inputForm.billingWorkplaceReal = row.name // 实际开票单位姓名
                this.inputForm.billingWorkplaceRealId = row.id // 实际开票单位id ‘客户id’
                this.inputForm.taxpayerIdentificationNo = this.isEmpty(row.uscCode) ? '' : row.uscCode // 纳税人识别号 ‘统一社会信用代码’
                this.inputForm.address = this.isEmpty(row.address) ? '' : row.address // 地址
                this.inputForm.telPhone = this.isEmpty(row.mobile) ? '' : row.mobile // 电话
                this.inputForm.billingId = '' // 实际开票单位的开票信息id
                // this.inputForm.telPhone = '' // 电话
                for (let i=0;i<row.cwWorkClientBillingDTOList.length;i++) {
                    row.cwWorkClientBillingDTOList[i].ourBank = row.cwWorkClientBillingDTOList[i].accountHolder
                    let test = {label: row.cwWorkClientBillingDTOList[i].ourBank, value: row.cwWorkClientBillingDTOList[i].id, account: row.cwWorkClientBillingDTOList[i].account}
                    this.bankList.push(test)
                }
                // row.cwWorkClientBillingDTOList.forEach(item => {
                //     item.ourBank = item.accountHolder
                //     this.bankList.push(item)
                // })
                this.inputForm.bankAccount = ''
                this.inputForm.openBank = ''
                this.$forceUpdate()
            },
            changeBank(value) {
                this.bankList.forEach(item => {
                    if (item.value === value) {
                        this.inputForm.bankAccount = item.account
                    }
                })
            },
            validatePhone (str,callback) {
                const phone = /(^(\d{3,4}-)?\d{6,8}$)|(^(\d{3,4}-)?\d{6,8}(-\d{1,5})?$)|(^(((13[0-9]{1})|(15[0-9]{1})|(16[0-9]{1})|(18[0-9]{1})|(17[0-9]{1})|(19[0-9]{1}))+\d{8})$)/
                if (str && !phone.test(str)) {
                    callback(new Error('请输入正确的电话号码'))
                } else {
                    callback()
                }
            },
            checkEmail(str,callback) {
                if (!this.isNotEmpty(str)) {
                    callback(); // 输入框为空时不进行验证，直接清除错误提示
                    return;
                }

                var reg = /^\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/;
                if (!reg.test(str)) {
                    callback(new Error('请输入正确的邮箱地址'))
                } else {
                    callback()
                }
            },
            openDia() {
                let id = this.userInfo.id
                let userEmail = this.inputForm.actualDrawerEmailAddress
                this.$refs.emailForm.init(id,userEmail);
            },
            emailForm(row) {
                this.inputForm.actualDrawerEmailAddress=row
            },
        }
    }
</script>

<style>
    .cu-form-group .title {
        min-width: calc(4em + 40px);
    }

    /* 样式示例，您可能需要根据实际情况调整 */
    .upload-demo {
        width: 40%;
    }
    .button-container {
        margin-top: 10px;
        text-align: right;
    }
</style>