erp_fans/src/components/process/SF/CostControl.vue

<template>
  <div style="width: 100%; padding: 0px 15px">
    <byForm :formConfig="formConfig" :formOption="formOption" v-model="formData.data" :rules="rules" ref="formDom">
      <template #commodity>
        <div style="width: 100%">
          <el-button type="primary" @click="clickAdd()" plain :disabled="getBtnDisabled()" style="margin-bottom: 16px"
                     v-if="!judgeStatus()">添加</el-button>
          <el-table :data="formData.data.costControlDetailList" style="width: 100%; ">
            <el-table-column prop="remark" label="收付款说明" min-width="250" v-if="isShowAtt('remark','detailObj')" fixed="left">
              <template #default="{ row, $index }">
                <el-form-item :prop="'costControlDetailList.' + $index + '.remark'" :rules="rules.remark" :inline-message="true" class="margin-b-0">
                  <el-input v-model="row.remark" placeholder="请输入" type="textarea" disabled />
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column prop="applyRemark" label="申请事由" min-width="250" v-if="isShowAtt('applyRemark','detailObj')">
              <template #default="{ row, $index }">
                <el-form-item :prop="'costControlDetailList.' + $index + '.applyRemark'" :rules="rules.applyRemark" :inline-message="true"
                              class="margin-b-0">
                  <el-input v-model="row.applyRemark" placeholder="请输入" type="textarea" @change="handleGetRemark($index)" />
                </el-form-item>
              </template>
            </el-table-column>
            <!-- v-if="['20'].includes(formData.data.selectType)" -->
            <el-table-column prop="deductionMonth" label="抵扣工资月份" width="150" v-if="isShowAtt('deductionMonth','detailObj')">
              <template #default="{ row, $index }">
                <el-form-item :prop="'costControlDetailList.' + $index + '.deductionMonth'" :rules="rules.deductionMonth" :inline-message="true"
                              class="margin-b-0">
                  <el-date-picker v-model="row.deductionMonth" type="month" placeholder="请选择" style="width: 100%" value-format="YYYY-MM" />
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column prop="logisticsCompanyId" label="快递公司" width="150" v-if="isShowAtt('logisticsCompanyId','detailObj')">
              <template #default="{ row, $index }">
                <el-form-item :prop="'costControlDetailList.' + $index + '.logisticsCompanyId'" :rules="rules.logisticsCompanyId"
                              :inline-message="true" class="margin-b-0">
                  <el-select v-model="row.logisticsCompanyId" placeholder="请选择" style="width: 100%" filterable
                             @change="(val)=>changeSelectData(val,$index,'1')">
                    <el-option v-for="item in logisticsCompanyData" :key="item.value" :label="item.label" :value="item.value" />
                  </el-select>
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column prop="supplierId" label="供应商" width="150" v-if="isShowAtt('supplierId','detailObj')">
              <template #default="{ row, $index }">
                <el-form-item :prop="'costControlDetailList.' + $index + '.supplierId'" :rules="rules.supplierId" :inline-message="true"
                              class="margin-b-0">
                  <el-select v-model="row.supplierId" placeholder="请选择" style="width: 100%" filterable
                             @change="(val)=>changeSelectData(val,$index,'3')">
                    <el-option v-for="item in supplierList" :key="item.value" :label="item.label" :value="item.value" />
                  </el-select>
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column prop="payeeAccountId" label="收款单位" width="150" v-if="isShowAtt('payeeAccountId','detailObj')">
              <template #default="{ row, $index }">
                <el-form-item :prop="'costControlDetailList.' + $index + '.payeeAccountId'" :rules="rules.payeeAccountId" :inline-message="true"
                              class="margin-b-0">
                  <el-select v-model="row.payeeAccountId" placeholder="请选择" style="width: 100%" filterable
                             @change="(val)=>changeSelectData(val,$index,'4')">
                    <el-option v-for="item in payeeData" :key="item.value" :label="item.label" :value="item.value" />
                  </el-select>
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column prop="invoiceTaxPoint" label="开票税点" width="100" v-if="isShowAtt('invoiceTaxPoint','detailObj')">
              <template #default="{ row, $index }">
                <el-form-item :prop="'costControlDetailList.' + $index + '.invoiceTaxPoint'" :rules="rules.invoiceTaxPoint" :inline-message="true"
                              class="margin-b-0">
                  <el-input-number onmousewheel="return false;" v-model="row.invoiceTaxPoint" placeholder="请输入" style="width: 100%" :precision="2"
                                   :controls="false" :min="0" :max="100" disabled />
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column prop="balancePrepaidTax" label="结存预付款(含税)" width="140" v-if="isShowAtt('balancePrepaidTax','detailObj')">
              <template #default="{ row, $index }">
                <el-form-item :prop="'costControlDetailList.' + $index + '.balancePrepaidTax'" :rules="rules.balancePrepaidTax" :inline-message="true"
                              class="margin-b-0">
                  <el-input-number onmousewheel="return false;" v-model="row.balancePrepaidTax" placeholder="请输入" style="width: 100%" :precision="2"
                                   :controls="false" :min="0" disabled />
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column prop="balancePrepaid" label="结存预付款(不含税)" width="150" v-if="isShowAtt('balancePrepaid','detailObj')">
              <template #default="{ row, $index }">
                <el-form-item :prop="'costControlDetailList.' + $index + '.balancePrepaid'" :rules="rules.balancePrepaid" :inline-message="true"
                              class="margin-b-0">
                  <el-input-number onmousewheel="return false;" v-model="row.balancePrepaid" placeholder="请输入" style="width: 100%" :precision="2"
                                   :controls="false" :min="0" disabled />
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column prop="currentPrepaidTax" label="本期预付款(含税)" width="140" v-if="isShowAtt('currentPrepaidTax','detailObj')">
              <template #default="{ row, $index }">
                <el-form-item :prop="'costControlDetailList.' + $index + '.currentPrepaidTax'" :rules="rules.currentPrepaidTax" :inline-message="true"
                              class="margin-b-0">
                  <el-input-number onmousewheel="return false;" v-model="row.currentPrepaidTax" placeholder="请输入" style="width: 100%" :precision="2"
                                   :controls="false" :min="0" @change="(val)=>handleChangeMoney(val,$index,'currentPrepaidTax')" />
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column prop="currentPrepaid" label="本期预付款(不含税)" width="150" v-if="isShowAtt('currentPrepaid','detailObj')">
              <template #default="{ row, $index }">
                <el-form-item :prop="'costControlDetailList.' + $index + '.currentPrepaid'" :rules="rules.currentPrepaid" :inline-message="true"
                              class="margin-b-0">
                  <el-input-number onmousewheel="return false;" v-model="row.currentPrepaid" placeholder="请输入" style="width: 100%" :precision="2"
                                   :controls="false" :min="0" @change="(val)=>handleChangeMoney(val,$index,'currentPrepaid')" />
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column prop="accountPeriod" label="账期" width="150" v-if="isShowAtt('accountPeriod','detailObj')">
              <template #default="{ row, $index }">
                <el-form-item :prop="'costControlDetailList.' + $index + '.accountPeriod'" :rules="rules.accountPeriod" :inline-message="true"
                              class="margin-b-0">
                  <el-date-picker v-model="row.accountPeriod" type="month" placeholder="请选择" style="width: 100%" value-format="YYYY-MM"
                                  :disabled-date="disabledFn" />

                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column prop="accountPeriodAmountTax" label="本账期金额(含税)" width="140" v-if="isShowAtt('accountPeriodAmountTax','detailObj')">
              <template #default="{ row, $index }">
                <el-form-item :prop="'costControlDetailList.' + $index + '.accountPeriodAmountTax'" :rules="rules.accountPeriodAmountTax"
                              :inline-message="true" class="margin-b-0">
                  <el-input-number onmousewheel="return false;" v-model="row.accountPeriodAmountTax" placeholder="请输入" style="width: 100%"
                                   :precision="2" :controls="false" :min="0" disabled />
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column prop="accountPeriodAmount" label="本账期金额(不含税)" width="150" v-if="isShowAtt('accountPeriodAmount','detailObj')">
              <template #default="{ row, $index }">
                <el-form-item :prop="'costControlDetailList.' + $index + '.accountPeriodAmount'" :rules="rules.accountPeriodAmount"
                              :inline-message="true" class="margin-b-0">
                  <el-input-number onmousewheel="return false;" v-model="row.accountPeriodAmount" placeholder="请输入" style="width: 100%" :precision="2"
                                   :controls="false" :min="0" disabled />
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column prop="accountPeriodAdjustAmount" label="本账期调整金额" width="140" v-if="isShowAtt('accountPeriodAdjustAmount','detailObj')">
              <template #default="{ row, $index }">
                <el-form-item :prop="'costControlDetailList.' + $index + '.accountPeriodAdjustAmount'" :rules="rules.accountPeriodAdjustAmount"
                              :inline-message="true" class="margin-b-0">
                  <el-input-number onmousewheel="return false;" v-model="row.accountPeriodAdjustAmount" placeholder="请输入" style="width: 100%"
                                   :precision="2" :controls="false" :min="0" disabled />
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column prop="deductionPrepaidTax" label="抵扣预付款(含税)" width="140" v-if="isShowAtt('deductionPrepaidTax','detailObj')">
              <template #default="{ row, $index }">
                <el-form-item :prop="'costControlDetailList.' + $index + '.deductionPrepaidTax'" :rules="rules.deductionPrepaidTax"
                              :inline-message="true" class="margin-b-0">
                  <el-input-number onmousewheel="return false;" v-model="row.deductionPrepaidTax" placeholder="请输入" style="width: 100%" :precision="2"
                                   :controls="false" :min="0" />
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column prop="deductionPrepaid" label="抵扣预付款(不含税)" width="150" v-if="isShowAtt('deductionPrepaid','detailObj')">
              <template #default="{ row, $index }">
                <el-form-item :prop="'costControlDetailList.' + $index + '.deductionPrepaid'" :rules="rules.deductionPrepaid" :inline-message="true"
                              class="margin-b-0">
                  <el-input-number onmousewheel="return false;" v-model="row.deductionPrepaid" placeholder="请输入" style="width: 100%" :precision="2"
                                   :controls="false" :min="0" />
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column prop="taxation" label="税费" width="140" v-if="isShowAtt('taxation','detailObj')">
              <template #default="{ row, $index }">
                <el-form-item :prop="'costControlDetailList.' + $index + '.taxation'" :rules="rules.taxation" :inline-message="true"
                              class="margin-b-0">
                  <el-input-number onmousewheel="return false;" v-model="row.taxation" placeholder="请输入" style="width: 100%" :precision="2"
                                   :controls="false" :min="0" />
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column prop="invoiceFileList" label="发票附件" width="200" v-if="isShowAtt('invoiceFileList','detailObj')">
              <template #default="{ row, $index }">
                <el-form-item :prop="'costControlDetailList.' + $index + '.invoiceFileList'" :rules="rules.invoiceFileList" :inline-message="true"
                              class="margin-b-0">
                  <el-upload :file-list="row.invoiceFileList" :action="uploadUrl" :data="row.uploadData" :limit="5" :list-type="'text'"
                             :before-upload="(file)=>handleBeforeUploadOne(file,$index,'invoiceFileList')"
                             :on-success="()=>handleSuccessOne($index,'invoiceFileList')"
                             :on-remove="(file)=>handleRemoveFile(file,$index,'invoiceFileList')" :on-preview="onPreviewFile"
                             :on-exceed="()=>msgTip(`上传文件数量不可大于5`, 2)">
                    <el-button text type="primary">上传</el-button>
                  </el-upload>
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column prop="fileList" label="非发票附件" width="200" v-if="isShowAtt('fileList','detailObj')">
              <template #default="{ row, $index }">
                <el-form-item :prop="'costControlDetailList.' + $index + '.fileList'" :rules="rules.fileList" :inline-message="true"
                              class="margin-b-0">
                  <el-upload :file-list="row.fileList" :action="uploadUrl" :data="row.uploadData" :limit="5" :list-type="'text'"
                             :before-upload="(file)=>handleBeforeUploadOne(file,$index,'fileList')"
                             :on-success="()=>handleSuccessOne($index,'fileList')" :on-remove="(file)=>handleRemoveFile(file,$index,'fileList')"
                             :on-preview="onPreviewFile" :on-exceed="()=>msgTip(`上传文件数量不可大于5`, 2)">
                    <el-button text type="primary">上传</el-button>
                  </el-upload>
                </el-form-item>
              </template>
            </el-table-column>
            <!-- <el-table-column prop="invoiceFileList" label="归还转账截图" width="140" v-if="isShowAtt('invoiceFileList','detailObj')">
              <template #default="{ row, $index }">
                <el-form-item :prop="'costControlDetailList.' + $index + '.invoiceFileList'" :rules="rules.invoiceFileList" :inline-message="true"
                              class="margin-b-0">
                  <el-upload :file-list="row.invoiceFileList" :action="uploadUrl" :data="row.uploadData" :limit="5" :list-type="'text'"
                             :before-upload="(file)=>handleBeforeUploadOne(file,$index,'invoiceFileList')"
                             :on-success="()=>handleSuccessOne($index,'invoiceFileList')"
                             :on-remove="(file)=>handleRemoveFile(file,$index,'invoiceFileList')" :on-preview="onPreviewFile"
                             :on-exceed="()=>msgTip(`上传文件数量不可大于5`, 2)">
                    <el-button text type="primary">上传</el-button>
                  </el-upload>
                </el-form-item>
              </template>
            </el-table-column> -->

            <el-table-column prop="shopId" label="店铺名称" width="150" v-if="isShowAtt('shopId','detailObj')">
              <template #default="{ row, $index }">
                <el-form-item :prop="'costControlDetailList.' + $index + '.shopId'" :rules="rules.shopId" :inline-message="true" class="margin-b-0">
                  <el-select v-model="row.shopId" placeholder="请选择" style="width: 100%" filterable @change="(val)=>changeSelectData(val,$index,'2')">
                    <el-option v-for="item in shopList" :key="item.value" :label="item.label" :value="item.value" />
                  </el-select>
                </el-form-item>
              </template>
            </el-table-column>

            <el-table-column prop="costType" label="费用类型" width="150" v-if="isShowAtt('costType','detailObj')">
              <template #default="{ row, $index }">
                <el-form-item :prop="'costControlDetailList.' + $index + '.costType'" :rules="rules.costType" :inline-message="true"
                              class="margin-b-0">
                  <el-select v-model="row.costType" placeholder="请选择" style="width: 100%" filterable>
                    <el-option v-for="item in expenseType" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey" />
                  </el-select>
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column label="刷单时间/推广费类别" width="160" v-if="isShowAtt('brushingTime','detailObj') || isShowAtt('promotionFeeType','detailObj')">
              <template #default="{ row, $index }">
                <el-form-item :prop="'costControlDetailList.' + $index + '.brushingTime'" :rules="rules.brushingTime" :inline-message="true"
                              class="margin-b-0" v-if="row.costType=='1'">
                  <el-date-picker v-model="row.brushingTime" type="date" placeholder="请选择" style="width: 100%" value-format="YYYY-MM-DD" />
                </el-form-item>
                <el-form-item :prop="'costControlDetailList.' + $index + '.promotionFeeType'" :rules="rules.promotionFeeType" :inline-message="true"
                              class="margin-b-0" v-else-if="row.costType=='2'">
                  <el-select v-model="row.promotionFeeType" placeholder="请选择" style="width: 100%" filterable>
                    <el-option v-for="item in promotionFeeType" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey" />
                  </el-select>
                </el-form-item>
                <div v-else>-</div>
              </template>
            </el-table-column>
            <!-- <el-table-column prop="brushingTime" label="刷单时间" width="150" v-if="isShowAtt('brushingTime','detailObj')">
              <template #default="{ row, $index }">
                <el-form-item :prop="'costControlDetailList.' + $index + '.brushingTime'" :rules="rules.brushingTime" :inline-message="true"
                              class="margin-b-0">
                  <el-date-picker v-model="row.brushingTime" type="date" placeholder="请选择" style="width: 100%" value-format="YYYY-MM-DD" />
                </el-form-item>
              </template>
            </el-table-column> -->
            <!-- <el-table-column prop="promotionFeeType" label="推广费类别" width="150" v-if="isShowAtt('promotionFeeType','detailObj')">
              <template #default="{ row, $index }">
                <el-form-item :prop="'costControlDetailList.' + $index + '.promotionFeeType'" :rules="rules.promotionFeeType" :inline-message="true"
                              class="margin-b-0">
                  <el-select v-model="row.promotionFeeType" placeholder="请选择" style="width: 100%" filterable>
                    <el-option v-for="item in promotionFeeType" :key="item.dictKey" :label="item.dictValue" :value="item.dictKey" />
                  </el-select>
                </el-form-item>
              </template>
            </el-table-column> -->
            <!-- <el-table-column prop="currentPayable" label="本期应付(抵扣)" width="140" v-if="isShowAtt('currentPayable','detailObj')">
              <template #default="{ row, $index }">
                <el-form-item :prop="'costControlDetailList.' + $index + '.currentPayable'" :rules="rules.currentPayable" :inline-message="true"
                              class="margin-b-0">
                  <el-input-number onmousewheel="return false;" v-model="row.currentPayable" placeholder="请输入" style="width: 100%" :precision="2"
                                   :controls="false" :min="0" />
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column prop="currentPayable" label="本期应付(抵扣前)" width="140" v-if="isShowAtt('currentPayable','detailObj')">
              <template #default="{ row, $index }">
                <el-form-item :prop="'costControlDetailList.' + $index + '.currentPayable'" :rules="rules.currentPayable" :inline-message="true"
                              class="margin-b-0">
                  <el-input-number onmousewheel="return false;" v-model="row.currentPayable" placeholder="请输入" style="width: 100%" :precision="2"
                                   :controls="false" :min="0" />
                </el-form-item>
              </template>
            </el-table-column> -->
            <el-table-column prop="currentPayableDeduction" label="本期应付(抵扣后)" width="140" v-if="isShowAtt('currentPayableDeduction','detailObj')">
              <template #default="{ row, $index }">
                <el-form-item :prop="'costControlDetailList.' + $index + '.currentPayableDeduction'" :rules="rules.currentPayableDeduction"
                              :inline-message="true" class="margin-b-0">
                  <el-input-number onmousewheel="return false;" v-model="row.currentPayableDeduction" placeholder="请输入" style="width: 100%"
                                   :precision="2" :controls="false" :min="0" />
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column prop="currentPayable" label="本期应付" width="140" v-if="isShowAtt('currentPayable','detailObj')">
              <template #default="{ row, $index }">
                <el-form-item :prop="'costControlDetailList.' + $index + '.currentPayable'" :rules="rules.currentPayable" :inline-message="true"
                              class="margin-b-0">
                  <el-input-number onmousewheel="return false;" v-model="row.currentPayable" placeholder="请输入" style="width: 100%" :precision="2"
                                   :controls="false" :min="0" @change="handleGetRemark($index)" />
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column prop="returnAmount" label="归还金额" width="140" v-if="isShowAtt('returnAmount','detailObj')">
              <template #default="{ row, $index }">
                <el-form-item :prop="'costControlDetailList.' + $index + '.returnAmount'" :rules="rules.returnAmount" :inline-message="true"
                              class="margin-b-0">
                  <el-input-number onmousewheel="return false;" v-model="row.returnAmount" placeholder="请输入" style="width: 100%" :precision="2"
                                   :controls="false" :min="0" @change="handleGetRemark($index)" />
                </el-form-item>
              </template>
            </el-table-column>
            <el-table-column prop="accountSubjectsId" label="记账科目" width="200" v-if="isShowAtt('accountSubjectsId','detailObj')">
              <template #default="{ row, $index }">
                <div style="width: 100%">
                  <el-form-item :prop="'costControlDetailList.' + $index + '.accountSubjectsId'" :rules="rules.accountSubjectsId"
                                :inline-message="true" class="margin-b-0">
                    <el-tree-select v-model="row.accountSubjectsId" :data="accountSubjectsData" check-strictly :render-after-expand="false"
                                    node-key="id" :props="defaultProps" style="width:100%" disabled />
                  </el-form-item>
                </div>
              </template>
            </el-table-column>
            <el-table-column label="核算项目名称" width="110" prop="accountSubjectsName" v-if="isShowAtt('accountSubjectsId','detailObj')" />
            <el-table-column label="核算项目" width="100" prop="accountSubjectsName" v-if="isShowAtt('accountSubjectsId','detailObj')" />
            <el-table-column label="记账金额" width="100" prop="money" v-if="isShowAtt('money','detailObj')" />
            <el-table-column label="操作" width="60" align="center" fixed="right" v-if="!judgeStatus()">
              <template #default="{ $index }">
                <el-button type="primary" link @click="handleDelete($index)">删除</el-button>
              </template>
            </el-table-column>
          </el-table>
        </div>
      </template>
    </byForm>
  </div>
</template>

<script setup>
import byForm from "@/components/byForm/index";
import moment from "moment";
const route = useRoute();
// 接收父组件的传值
const props = defineProps({
  queryData: Object,
});
const { proxy } = getCurrentInstance();
const checkBoxMap = ref({});
const currentCostTypeData = ref({});
const uploadData = ref({});
const promotionFeeType = computed(
  () => proxy.useUserStore().allDict["promotion_fee_type"]
);
const expenseType = computed(
  () => proxy.useUserStore().allDict["expense_type"]
);
const paymentMethod = computed(
  () => proxy.useUserStore().allDict["payment_method"]
);
const logisticsCompanyData = ref([]);
const payeeData = ref([]);
const accountSubjectsData = ref([]);
const accountSubjectsList = ref([]);

const defaultProps = {
  children: "children",
  label: "subjectsName",
};
const paymentTypeData = ref([]);
const treeData = ref([]);
const deptData = ref([]);
const userList = ref([]);
const accountList = ref([]);
const shopList = ref([]);
const supplierList = ref([]);
const isAfterSubmit = ref([
  {
    label: "是",
    value: "1",
  },
  {
    label: "否",
    value: "0",
  },
]);
const isAfterSubmitOne = ref([
  {
    label: "店铺充值",
    value: 1,
  },
  {
    label: "转账",
    value: 0,
  },
]);

const formData = reactive({
  data: {
    applyTime: moment().format("yyyy-MM-DD"),
    companyId: proxy.useUserStore().user.companyId,
    companyIdSet: [],
    deptId: proxy.useUserStore().user.dept.deptId,
    applyUserId: proxy.useUserStore().user.userId,
    costControlDetailList: [
      {
        remark: "",
        supplierId: "",
        payeeAccountId: "",
        applyRemark: "",
        deductionMonth: "",
        accountSubjectsId: "",
        logisticsCompanyId: "",
        invoiceTaxPoint: "",
        currentPayable: null,
        currentPayableDeduction: null,
        money: null,
        balancePrepaidTax: null,
        balancePrepaid: null,
        accountPeriod: null,
        accountPeriodAmount: null,
        accountPeriodAmountTax: null,
        accountPeriodAdjustAmount: null,
        currentPrepaidTax: null,
        currentPrepaid: null,
        deductionPrepaidTax: null,
        deductionPrepaid: null,
        shopId: "",
        costType: "",
        brushingTime: "",
        promotionFeeType: "",
        taxation: null,
      },
    ],
    fileList: [],
    invoiceFileList: [],
  },
});

const formDom = ref(null);
const judgeStatus = () => {
  if (route.query.processType == 20 || route.query.processType == 10) {
    return true;
  }
  if (props.queryData.recordList && props.queryData.recordList.length > 0) {
    let data = props.queryData.recordList.filter(
      (item) => item.status === 2 && item.nodeType !== 1
    );
    if (data && data.length > 0) {
      return true;
    }
  }
  return false;
};
const formOption = reactive({
  inline: true,
  labelWidth: 110,
  itemWidth: 100,
  disabled: false,
});
const formConfig = computed(() => {
  return [
    {
      type: "title",
      title: "基本信息",
      haveLine: false,
    },
    {
      type: "select",
      label: "收付款类型",
      prop: "costType",
      itemWidth: 25,
      data: paymentTypeData.value,
      // clearable: true,
      fn: (val) => {
        changeCostType(val);
      },
    },
    {
      type: "input",
      prop: "voucherNo",
      label: "记账凭证号",
      itemType: "text",
      disabled: false,
      itemWidth: 25,
      isShow: isShowAtt("voucherNo", "mainObj"),
    },
    {
      type: "select",
      label: "是否预付",
      prop: "isAdvance",
      itemWidth: 25,
      data: isAfterSubmit.value,
      isShow: isShowAtt("isAdvance", "mainObj"),
      disabled: true,
    },
    {
      type: "date",
      itemType: "date",
      prop: "applyTime",
      label: "申请日期",
      disabled: false,
      itemWidth: 25,
      isShow: isShowAtt("applyTime", "mainObj"),
      disabled: true,
    },
    {
      type: "input",
      prop: "code",
      label: "流水号",
      itemType: "text",
      disabled: true,
      itemWidth: 25,
      isShow: isShowAtt("code", "mainObj"),
    },
    {
      type: "select",
      label: "快递公司",
      prop: "logisticsCompanyId",
      itemWidth: 25,
      data: logisticsCompanyData.value,
      isShow: isShowAtt("logisticsCompanyId", "mainObj"),
    },
    {
      type: "input",
      prop: "invoiceTaxPoint",
      label: "开票税点",
      itemType: "text",
      disabled: false,
      itemWidth: 25,
      isShow: isShowAtt("invoiceTaxPoint", "mainObj"),
    },

    {
      type: "select",
      label: "是否后提交凭证",
      prop: "isVoucher",
      itemWidth: 25,
      data: isAfterSubmit.value,
      isShow: isShowAtt("isVoucher", "mainObj"),
    },
    {
      type: "treeSelect",
      prop: "companyId",
      label: "业务公司",
      data: treeData.value,
      propsTreeLabel: "deptName",
      propsTreeValue: "deptId",
      itemWidth: 25,
      fn: (val) => {
        getDeptData(val);
      },
      disabled: true,
      isShow:
        isShowAtt("companyId", "mainObj") &&
        currentCostTypeData.value.name != "采购货款",
    },
    {
      type: "treeSelect",
      prop: "companyIdSet",
      label: "业务公司",
      data: treeData.value,
      propsTreeLabel: "deptName",
      propsTreeValue: "deptId",
      itemWidth: 25,
      // fn: (val) => {
      //   getDeptData(val);
      // },
      multiple: true,
      isShow:
        isShowAtt("companyId", "mainObj") &&
        currentCostTypeData.value.name == "采购货款",
    },

    {
      type: "treeSelect",
      prop: "deptId",
      label: "业务部门",
      data: deptData.value,
      propsTreeLabel: "deptName",
      propsTreeValue: "deptId",
      itemWidth: 25,
      disabled: true,
      isShow: isShowAtt("deptId", "mainObj"),
    },
    {
      type: "select",
      prop: "applyUserId",
      label: "申请人",
      required: true,
      filterable: true,
      data: userList.value,
      itemWidth: 25,
      fn: (val) => {
        changApplyUserId(val);
      },
      // disabled: true,
      isShow: isShowAtt("applyUserId", "mainObj"),
    },
    {
      type: "title",
      title: "收付款明细",
      haveLine: true,
    },
    {
      type: "slot",
      slotName: "commodity",
      label: "",
    },
    {
      type: "title",
      title: "付款信息",
      haveLine: true,
      isShow:
        isShowAtt("isPublicTransfer", "mainObj") ||
        isShowAtt("paymentMethod", "mainObj"),
    },
    {
      type: "select",
      label: "是否公户转出",
      prop: "isPublicTransfer",
      itemWidth: 25,
      data: isAfterSubmit.value,
      fn: (val) => {
        formData.data.paymentAccountId = "";
        formData.data.paymentAccountName = "";
        formData.data.paymentAccountBank = "";
        formData.data.paymentAccountNumber = "";
        proxy
          .post("/accountManagement/page", {
            pageNum: 1,
            pageSize: 999,
            type: val == 1 ? "10" : "20",
          })
          .then((res) => {
            accountList.value = res.rows.map((item) => {
              return {
                ...item,
                label: item.alias,
                value: item.id,
              };
            });
          });

        if (
          currentCostTypeData.value &&
          currentCostTypeData.value.name.indexOf("快递") != -1
        ) {
          for (let i = 0; i < formData.data.costControlDetailList.length; i++) {
            const row = formData.data.costControlDetailList[i];
            row.currentPayable =
              val == "1" ? row.currentPrepaidTax : row.currentPrepaid;
            handleGetRemark(i);
          }
        }
      },
      isShow: isShowAtt("isPublicTransfer", "mainObj"),
    },
    {
      type: "select",
      label: "付款方式",
      prop: "paymentMethod",
      itemWidth: 25,
      data: paymentMethod.value,
      isShow: isShowAtt("paymentMethod", "mainObj"),
      fn: (val) => {
        if (
          val == 1 &&
          formData.data.costControlDetailList &&
          formData.data.costControlDetailList.length > 0
        ) {
          formData.data.shopName =
            formData.data.costControlDetailList[0].labelName;
        }
      },
    },
    {
      type: "input",
      prop: "shopName",
      label: "充值店铺名称",
      itemWidth: 25,
      disabled: true,
      isShow:
        isShowAtt("paymentMethod", "mainObj") &&
        formData.data.paymentMethod == "1",
    },
    {
      type: "select",
      prop: "paymentAccountId",
      label: "公司账户",
      data: accountList.value,
      itemWidth: 25,
      fn: (val) => {
        changeShroffAccount(val);
      },
      isShow: isShowAtt("paymentAccountId", "mainObj"),
    },
    {
      type: "input",
      prop: "paymentAccountBank",
      label: "开户行",
      placeholder: "请输入开户行",
      itemWidth: 25,
      isShow: isShowAtt("paymentAccountId", "mainObj"),
    },
    {
      type: "input",
      prop: "paymentAccountName",
      label: "开户名",
      placeholder: "请输入开户名",
      itemWidth: 25,
      isShow: isShowAtt("paymentAccountId", "mainObj"),
    },
    {
      type: "input",
      prop: "paymentAccountNumber",
      label: "账号",
      placeholder: "请输入账号",
      itemWidth: 25,
      isShow: isShowAtt("paymentAccountId", "mainObj"),
    },
    {
      type: "title",
      title: "收款信息",
      haveLine: true,
      isShow: getIsShowData("accountBank"),
    },
    {
      type: "input",
      prop: "accountBank",
      label: "开户行",
      placeholder: "请输入开户行",
      itemWidth: 25,
      // isShow:  isShowAtt("accountBank", "mainObj"),
      isShow: getIsShowData("accountBank"),
    },
    {
      type: "input",
      prop: "accountName",
      label: "开户名",
      placeholder: "请输入开户名",
      itemWidth: 25,
      // isShow: isShowAtt("accountName", "mainObj"),
      isShow: getIsShowData("accountName"),
    },
    {
      type: "input",
      prop: "accountNumber",
      label: "账号",
      placeholder: "请输入账号",
      itemWidth: 25,
      // isShow: isShowAtt("accountNumber", "mainObj"),
      isShow: getIsShowData("accountNumber"),
    },
  ];
});

const rules = ref({
  costType: [
    { required: true, message: "请选择收付款类型", trigger: "change" },
  ],
  // voucherNo: [{ required: true, message: "请输入记账凭证号", trigger: "blur" }],
  isAdvance: [{ required: true, message: "请选择是否预付", trigger: "change" }],
  applyTime: [{ required: true, message: "请选择申请日期", trigger: "change" }],
  // code: [{ required: true, message: "请输入流水号", trigger: "blur" }],
  logisticsCompanyId: [
    { required: true, message: "请选择快递公司", trigger: "change" },
  ],
  applyUserId: [{ required: true, message: "请选择申请人", trigger: "change" }],
  isVoucher: [
    { required: true, message: "请选择是否后提交凭证", trigger: "change" },
  ],
  companyIdSet: [
    { required: true, message: "请选择业务公司", trigger: "change" },
  ],
  companyId: [{ required: true, message: "请选择业务公司", trigger: "change" }],
  deptId: [{ required: true, message: "请选择业务部门", trigger: "change" }],
  invoiceTaxPoint: [
    { required: true, message: "请输入开票税点", trigger: "blur" },
  ],
  isPublicTransfer: [
    { required: true, message: "请选择是否公出转出", trigger: "change" },
  ],
  paymentMethod: [
    { required: true, message: "请选择付款方式", trigger: "change" },
  ],
  accountBank: [{ required: true, message: "请输入开户行", trigger: "blur" }],
  accountName: [{ required: true, message: "请输入开户名", trigger: "blur" }],
  accountNumber: [{ required: true, message: "请输入账号", trigger: "blur" }],
  paymentAccountBank: [
    { required: true, message: "请输入开户行", trigger: "blur" },
  ],
  paymentAccountName: [
    { required: true, message: "请输入开户名", trigger: "blur" },
  ],
  paymentAccountNumber: [
    { required: true, message: "请输入账号", trigger: "blur" },
  ],

  // 明细
  remark: [{ required: true, message: "请输入收付款说明", trigger: "blur" }],
  applyRemark: [{ required: true, message: "请输入申请事由", trigger: "blur" }],
  deductionMonth: [
    { required: true, message: "请选择抵扣工资月份", trigger: "change" },
  ],
  // balancePrepaidTax: [
  //   { required: true, message: "请输入结存预付款(含税)", trigger: "blur" },
  // ],
  // balancePrepaid: [
  //   { required: true, message: "请输入结存预付款(不含税)", trigger: "blur" },
  // ],
  currentPrepaidTax: [
    { required: true, message: "请输入本期预付款(含税)", trigger: "blur" },
  ],
  currentPrepaid: [
    { required: true, message: "请输入本期预付款(不含税)", trigger: "blur" },
  ],
  accountPeriod: [{ required: true, message: "请输入账期", trigger: "blur" }],
  accountPeriodAmountTax: [
    { required: true, message: "请输入本账期金额(含税)", trigger: "blur" },
  ],
  accountPeriodAmount: [
    { required: true, message: "请输入本账期金额(不含税)", trigger: "blur" },
  ],
  accountPeriodAdjustAmount: [
    { required: true, message: "请输入本账期调整金额", trigger: "blur" },
  ],
  deductionPrepaidTax: [
    { required: true, message: "请输入抵扣预付款(含税)", trigger: "blur" },
  ],
  deductionPrepaid: [
    { required: true, message: "请输入抵扣预付款(不含税)", trigger: "blur" },
  ],
  invoiceTaxPoint: [
    { required: true, message: "请输入开票税点", trigger: "blur" },
  ],
  taxation: [{ required: true, message: "请输入税费", trigger: "blur" }],
  // invoiceFileList: [
  //   { required: true, message: "请上传发票附件", trigger: "change" },
  // ],
  // fileList: [
  //   { required: true, message: "请上传非发票附件", trigger: "change" },
  // ],
  payeeAccountId: [
    { required: true, message: "请输入收款单位", trigger: "blur" },
  ],
  shopId: [{ required: true, message: "请选择店铺名称", trigger: "change" }],
  supplierId: [{ required: true, message: "请选择供应商", trigger: "change" }],
  costType: [{ required: true, message: "请选择费用类型", trigger: "change" }],
  brushingTime: [
    { required: true, message: "请选择刷单时间", trigger: "change" },
  ],
  promotionFeeType: [
    { required: true, message: "请选择推广费类别", trigger: "change" },
  ],
  //  currentPayable: [
  //   { required: true, message: "请输入本期应付(抵扣)", trigger: "blur" },
  // ],
  currentPayable: [
    { required: true, message: "请输入本期应付", trigger: "blur" },
  ],
  currentPayableDeduction: [
    { required: true, message: "请输入本期应付(抵扣后)", trigger: "blur" },
  ],
  returnAmount: [
    { required: true, message: "请输入归还金额", trigger: "blur" },
  ],
  accountSubjectsId: [
    { required: true, message: "请选择记账科目", trigger: "change" },
  ],
  money: [{ required: true, message: "请输入记账金额", trigger: "blur" }],
});

const isShowAtt = (formAtt, att = "mainObj") => {
  if (checkBoxMap.value[att]) {
    return checkBoxMap.value[att][formAtt] != undefined;
  } else {
    return true;
  }
};

const getIsShowData = (formAtt, att = "mainObj") => {
  if (
    currentCostTypeData.value &&
    currentCostTypeData.value.name &&
    currentCostTypeData.value.name.indexOf("店铺") != -1
  ) {
    if (
      formData.data &&
      formData.data.paymentMethod &&
      formData.data.paymentMethod == "2"
    ) {
      return true;
    }
    return false;
  } else {
    return isShowAtt(formAtt, att);
  }
};

const changeShroffAccount = (val) => {
  if (val) {
    let data = accountList.value.find((item) => item.value == val);
    if (data) {
      formData.data.paymentAccountName = data.name;
      formData.data.paymentAccountBank = data.openingBank;
      formData.data.paymentAccountNumber = data.accountOpening;
    }
  }
};

const changApplyUserId = (val) => {
  if (
    !(
      currentCostTypeData.value.name.indexOf("备用金") != -1 ||
      currentCostTypeData.value.name.indexOf("借款") != -1 ||
      currentCostTypeData.value.name.indexOf("采购") != -1
    )
  ) {
    return;
  }
  const current = userList.value.find((x) => x.value == val);
  if (current) {
    formData.data.accountBank = current.accountBank;
    formData.data.accountName = current.accountName;
    formData.data.accountNumber = current.accountNumber;
  }
};

const getDeptData = (val) => {
  proxy
    .get("/tenantUser/list", {
      pageNum: 1,
      pageSize: 10000,
      tenantId: proxy.useUserStore().user.tenantId,
      companyId: val,
    })
    .then((res) => {
      userList.value = res.rows.map((item) => {
        return {
          ...item,
          label: item.nickName,
          value: item.userId,
        };
      });
    });

  proxy
    .get("/tenantDept/list", {
      pageNum: 1,
      pageSize: 9999,
      keyword: "",
      ancestors: val,
      tenantId: proxy.useUserStore().user.tenantId,
      // type: 2,
    })
    .then((res) => {
      deptData.value = proxy.handleTree(res.data, "deptId");
    });
};

const changeCostType = (val) => {
  currentCostTypeData.value = paymentTypeData.value.find((x) => x.value == val);
  formData.data.tradeType = currentCostTypeData.value.tradeType;
  if (formData.data && formData.data.applyUserId) {
    changApplyUserId(formData.data.applyUserId);
  }
  formData.data.applyTime = moment().format("yyyy-MM-DD");
  formData.data.companyId = proxy.useUserStore().user.companyId;
  formData.data.deptId = proxy.useUserStore().user.dept.deptId;
  formData.data.apapplyUserIdplyTime = proxy.useUserStore().user.userId;
  formData.data.isAdvance = "0";
  formData.data.costControlDetailList = [];
  formData.data.fileList = [];
  formData.data.invoiceFileList = [];
  // formData.data = {
  //   applyTime: moment().format("yyyy-MM-DD"),
  //   companyId: proxy.useUserStore().user.companyId,
  //   deptId: proxy.useUserStore().user.dept.deptId,
  //   applyUserId: proxy.useUserStore().user.userId,
  //   isAdvance: "0",
  //   costControlDetailList: [],
  //   fileList: [],
  //   invoiceFileList: [],
  // };
  getCheckBoxMap(val);
  if (
    currentCostTypeData.value &&
    currentCostTypeData.value.name.indexOf("预付") != -1
  ) {
    formData.data.isAdvance = "1";
  } else {
    formData.data.isAdvance = "0";
  }
};

const handleChangeMoney = (val, index, att) => {
  let row = formData.data.costControlDetailList[index];
  if (formData.data.isPublicTransfer) {
    if (formData.data.isPublicTransfer == "1") {
      row.currentPayable = row.currentPrepaidTax;
    } else if (formData.data.isPublicTransfer == "0") {
      row.currentPayable = row.currentPrepaid;
    }
    handleGetRemark(index);
  }
};
const changeSelectData = (val, index, type) => {
  // type 1:快递公司 2:店铺  3:供应商  4:收款单位
  let current = null;
  switch (type) {
    case "1":
      current = logisticsCompanyData.value.find((x) => x.value == val);
      if (current) {
        formData.data.costControlDetailList[index].invoiceTaxPoint =
          current.taxPoints;
        formData.data.costControlDetailList[index].balancePrepaid =
          current.balancePrepaid;
        formData.data.costControlDetailList[index].balancePrepaidTax =
          current.balancePrepaidTax;
        formData.data.costControlDetailList[index].labelName = current.label;
      }
      break;
    case "2":
      current = shopList.value.find((x) => x.value == val);
      if (current) {
        formData.data.costControlDetailList[index].labelName = current.label;
      }
      break;
    case "3":
      current = supplierList.value.find((x) => x.value == val);
      if (current) {
        formData.data.costControlDetailList[index].invoiceTaxPoint =
          current.privTaxPoints;
        formData.data.costControlDetailList[index].balancePrepaid =
          current.balancePrepaid;
        formData.data.costControlDetailList[index].balancePrepaidTax =
          current.balancePrepaidTax;
        formData.data.costControlDetailList[index].labelName = current.label;
      }
      break;

    case "4":
      current = payeeData.value.find((x) => x.value == val);
      if (current) {
        formData.data.costControlDetailList[index].invoiceTaxPoint =
          current.taxPoints;
        formData.data.costControlDetailList[index].labelName = current.label;
      }
      break;
    default:
      break;
  }
  if (current && ["1", "2", "4"].includes(type)) {
    formData.data.accountBank = current.accountBank;
    formData.data.accountName = current.accountName;
    formData.data.accountNumber = current.accountNumber;
  }
  handleGetRemark(index);
};

const getDict = () => {
  proxy
    .post("/accountSubjects/list", { pageNum: 1, pageSize: 999 })
    .then((res) => {
      accountSubjectsList.value = res;
      accountSubjectsData.value = proxy.handleTree(res, "id");
    });

  proxy.post("/payeeInfo/page", { pageNum: 1, pageSize: 999 }).then((res) => {
    payeeData.value = res.rows.map((item) => {
      return {
        ...item,
        label: item.name,
        value: item.id,
      };
    });
  });

  proxy
    .post("/logisticsCompanyInfo/list", { pageNum: 1, pageSize: 999 })
    .then((res) => {
      logisticsCompanyData.value = res.map((item) => {
        return {
          ...item,
          label: item.name,
          value: item.id,
        };
      });
    });

  proxy.post("/paymentType/page", { pageNum: 1, pageSize: 999 }).then((res) => {
    paymentTypeData.value = res.rows.map((item) => {
      return {
        ...item,
        name: item.name,
        label: item.name,
        value: item.id,
      };
    });
    if (res.rows && res.rows.length > 0 && !route.query.businessId) {
      formData.data.costType = res.rows[0].id;
      changeCostType(formData.data.costType);
    }
  });

  // proxy
  //   .post("/accountManagement/page", { pageNum: 1, pageSize: 999 })
  //   .then((res) => {
  //     accountList.value = res.rows.map((item) => {
  //       return {
  //         ...item,
  //         label: item.alias,
  //         value: item.id,
  //       };
  //     });
  //   });

  proxy.post("/shopInfo/page", { pageNum: 1, pageSize: 9999 }).then((res) => {
    shopList.value = res.rows.map((item) => {
      return {
        ...item,
        label: item.name,
        value: item.id,
      };
    });
  });

  proxy
    .post("/supplierInfo/page", { pageNum: 1, pageSize: 9999 })
    .then((res) => {
      supplierList.value = res.rows.map((item) => {
        return {
          ...item,
          label: item.name,
          value: item.id,
        };
      });
    });

  proxy
    .get("/tenantDept/list", {
      pageNum: 1,
      pageSize: 9999,
      keyword: "",
      tenantId: proxy.useUserStore().user.tenantId,
      type: 0,
    })
    .then((res) => {
      treeData.value = proxy.handleTree(res.data, "deptId");
    });
};
getDict();

const getBtnDisabled = () => {
  if (
    formData.data.costControlDetailList &&
    formData.data.costControlDetailList.length < 1
  ) {
    return false;
  } else {
    if (
      currentCostTypeData.value &&
      currentCostTypeData.value.name &&
      currentCostTypeData.value.name.indexOf("快递") != -1
    ) {
      return true;
    } else {
      return false;
    }
  }
};

const handleGetRemark = (index) => {
  let row = formData.data.costControlDetailList[index];
  let money = 0;
  money = parseFloat(Number(row.currentPayable)).toFixed(2);
  // formData.data.costControlDetailList[
  //   index
  // ].remark = `支付${row.applyRemark}${currentCostTypeData.value.name}${money}`;
  formData.data.costControlDetailList[index].money = money;
  if (currentCostTypeData.value.name.indexOf("归还") != -1) {
    formData.data.costControlDetailList[index].money = parseFloat(
      Number(row.returnAmount)
    ).toFixed(2);
    formData.data.costControlDetailList[
      index
    ].remark = `归还备用金${formData.data.costControlDetailList[index].money}`;
  } else if (currentCostTypeData.value.name.indexOf("备用金") != -1) {
    formData.data.costControlDetailList[
      index
    ].remark = `支付${row.applyRemark}备用金${money}`;
  } else if (currentCostTypeData.value.name.indexOf("借款") != -1) {
    formData.data.costControlDetailList[
      index
    ].remark = `支付${row.applyRemark}借款${money}`;
  } else if (currentCostTypeData.value.name.indexOf("快递") != -1) {
    formData.data.costControlDetailList[
      index
    ].remark = `支付${row.labelName}${currentCostTypeData.value.name}${money}`;
  } else if (currentCostTypeData.value.name.indexOf("店铺") != -1) {
    formData.data.costControlDetailList[
      index
    ].remark = `支付${row.labelName}${currentCostTypeData.value.name}${money}`;
  } else if (currentCostTypeData.value.name.indexOf("采购") != -1) {
    formData.data.costControlDetailList[
      index
    ].remark = `支付${row.labelName}供应商${currentCostTypeData.value.name}${money}`;
  }
};

const clickAdd = () => {
  let accountSubjectsId = "";
  let accountSubjectsName = "";
  if (
    currentCostTypeData.value &&
    currentCostTypeData.value.accountSubjectsId
  ) {
    accountSubjectsId = currentCostTypeData.value.accountSubjectsId;
    let currentAccountSubjects = accountSubjectsList.value.find(
      (x) => x.id == accountSubjectsId
    );
    if (currentAccountSubjects) {
      accountSubjectsName = currentAccountSubjects.calculateItemName;
    }
  }
  if (
    formData.data.costControlDetailList &&
    formData.data.costControlDetailList.length > 0
  ) {
    formData.data.costControlDetailList.push({
      remark: "",
      supplierId: "",
      payeeAccountId: "",
      applyRemark: "",
      deductionMonth: "",
      accountSubjectsId: accountSubjectsId,
      accountSubjectsName: accountSubjectsName,
      logisticsCompanyId: "",
      invoiceTaxPoint: "",
      currentPayable: null,
      currentPayableDeduction: null,
      money: null,
      balancePrepaidTax: null,
      balancePrepaid: null,
      accountPeriod: null,
      accountPeriodAmount: null,
      accountPeriodAmountTax: null,
      accountPeriodAdjustAmount: null,
      currentPrepaidTax: null,
      currentPrepaid: null,
      deductionPrepaidTax: null,
      deductionPrepaid: null,
      shopId: "",
      costType: "",
      brushingTime: "",
      promotionFeeType: "",
      taxation: null,
      fileList: [],
      invoiceFileList: [],
    });
  } else {
    formData.data.costControlDetailList = [
      {
        remark: "",
        supplierId: "",
        payeeAccountId: "",
        applyRemark: "",
        deductionMonth: "",
        accountSubjectsId: accountSubjectsId,
        accountSubjectsName: accountSubjectsName,
        logisticsCompanyId: "",
        invoiceTaxPoint: "",
        currentPayable: null,
        currentPayableDeduction: null,
        money: null,
        balancePrepaidTax: null,
        balancePrepaid: null,
        accountPeriod: null,
        accountPeriodAmount: null,
        accountPeriodAmountTax: null,
        accountPeriodAdjustAmount: null,
        currentPrepaidTax: null,
        currentPrepaid: null,
        deductionPrepaidTax: null,
        deductionPrepaid: null,
        shopId: "",
        costType: "",
        brushingTime: "",
        promotionFeeType: "",
        taxation: null,
        fileList: [],
        invoiceFileList: [],
      },
    ];
  }
};

const handleDelete = (index) => {
  formData.data.costControlDetailList.splice(index, 1);
};

const handleBeforeUploadOne = async (file, index) => {
  const res = await proxy.post("/fileInfo/getSing", { fileName: file.name });
  file.id = res.id;
  file.fileUrl = res.fileUrl;
  formData.data.costControlDetailList[index].uploadData = res.uploadBody;
  formData.data.costControlDetailList[index].fileData = res;
  return true;
};

const handleSuccessOne = (index, att) => {
  if (
    formData.data.costControlDetailList[index].fileData &&
    formData.data.costControlDetailList[index].fileData.fileUrl
  ) {
    let file = formData.data.costControlDetailList[index].fileData;
    formData.data.costControlDetailList[index][att].push({
      id: file.id,
      fileName: file.fileName,
      name: file.fileName,
      url: file.fileUrl,
      fileUrl: file.fileUrl,
    });
    formData.data.costControlDetailList[index].fileData = {};
  }
};

const handleRemoveFile = (file, index, att) => {
  let sonIndex = formData.data.costControlDetailList[index][att].findIndex(
    (x) => x.id == file.id || x.id == file.raw.id
  );
  if (sonIndex > -1) {
    formData.data.costControlDetailList[index][att].splice(sonIndex, 1);
  }
};

const onPreviewFile = (file) => {
  if (file && file.fileUrl) {
    window.open(file.fileUrl, "_blank");
  } else {
    window.open(file.raw.fileUrl, "_blank");
  }
};

const disabledFn = (date) => {
  // 当前日期
  let current = moment(date).format("YYYY-MM");
  // 禁用已选日期和比当前日期小的
  // return moment(current).add(1, "month").isBefore(moment());
  return moment(current).isAfter(moment());
};

const handleSubmit = async (isStag = false) => {
  if (isStag) {
    return true;
  }
  let flag = await formDom.value.handleSubmit(() => {});
  if (flag) {
    if (
      formData.data.costControlDetailList &&
      formData.data.costControlDetailList.length > 0
    ) {
      return true;
    } else {
      proxy.msgTip("请添加收付款明细");
      return false;
    }
  } else {
    setTimeout(() => {
      const errorDiv = document.getElementsByClassName("is-error");
      errorDiv[0].scrollIntoView();
    }, 0);
  }
  return flag;
};

const getFormData = () => {
  return proxy.deepClone(formData.data);
};
// 向父组件暴露
defineExpose({
  getFormData,
  handleSubmit,
});

const getCheckBoxMap = (val) => {
  if (!val) return;
  proxy.post("/paymentType/detail", { id: val }).then((res) => {
    if (res && res.dynamicFieldJson) {
      let obj = JSON.parse(res.dynamicFieldJson);
      obj.mainObj = {};
      obj.detailObj = {};
      if (obj.mainCheckList) {
        obj.mainCheckList.map((x) => (obj.mainObj[x] = true));
      }
      if (obj.detailCheckList) {
        obj.detailCheckList.map((x) => (obj.detailObj[x] = true));
      }
      checkBoxMap.value = obj;
    }
  });
};

const getAllData = (businessId) => {
  proxy.post("/costControl/detail", { id: businessId }).then(async (res) => {
    if (res && res.costControlDetailList && res.costControlDetailList.length) {
      res.costControlDetailList.map((x) => {
        x.fileList = [];
        x.invoiceFileList = [];
      });
    }
    for (const key in res) {
      formData.data[key] = res[key];
    }
    getDeptData(formData.data.companyId);
    getCheckBoxMap(formData.data.costType);
    if (
      formData.data.costControlDetailList &&
      formData.data.costControlDetailList.length > 0
    ) {
      let ids = formData.data.costControlDetailList.map((x) => x.id);
      const productAllFile = await proxy.getFileData({
        businessIdList: ids,
        getAll: true,
      });
      for (let i = 0; i < formData.data.costControlDetailList.length; i++) {
        const ele = formData.data.costControlDetailList[i];
        for (const key in productAllFile) {
          if (
            ele.id == key &&
            productAllFile[ele.id] &&
            productAllFile[ele.id].length > 0
          ) {
            ele.fileList = productAllFile[ele.id]
              .filter((item) => item.businessType == "0")
              .map((item) => {
                return {
                  ...item,
                  name: item.fileName,
                  url: item.fileUrl,
                };
              });
            ele.invoiceFileList = productAllFile[ele.id]
              .filter((item) => item.businessType == "10")
              .map((item) => {
                return {
                  ...item,
                  name: item.fileName,
                  url: item.fileUrl,
                };
              });
            break;
          } else {
            ele.fileList = [];
            ele.invoiceFileList = [];
          }
        }
      }
    }
  });
};

onMounted(() => {
  formData.data.companyIdSet.push(proxy.useUserStore().user.companyId);
  getDeptData(formData.data.companyId);
  formOption.disabled = judgeStatus();
  if (route.query && route.query.businessId && route.query.processType) {
    let businessId = route.query.businessId;
    getAllData(businessId);
  } else if (
    route.query &&
    route.query.businessId &&
    !route.query.processType
  ) {
    let businessId = route.query.businessId;
    getAllData(businessId);
  }
});
</script>

<style lang="scss" scoped>
.table {
  border-collapse: collapse;
  border-spacing: 0;

  td {
    text-align: center;
    padding: 2px 4px;
    // padding: 5px 10px;
  }
}
.small-title {
  padding-left: 15px;
  margin-bottom: 10px;
  color: #3366ff;
  font-size: 14px;
}
:deep(.el-checkbox) {
  margin-right: 0px;
}
// :deep(.el-collapse-item) {
//   margin-bottom: 10px;
// }
:deep(.el-collapse-item__header) {
  background-color: #eee;
}
</style>