修改关联

wujianwei

2025-08-15 252905374177e0d8d98430cb33cf79840479a3fe

 ui/admin-ui3/src/views/cwgl/estimatedReceivableBill/index.vue

@@ -1,174 +1,541 @@
<template>
  <basicContainer >
    <avue-crud
        :option="option"
        :table-loading="pageF.loading"
        :data="tableData"
        :page="page"
        :permission="permissionList"
        :before-open="beforeOpen"
        v-model="form"
        ref="crudRef"
        @row-update="rowUpdate"
        @row-save="rowSave"
        @refresh-change="refreshChange"
        @row-del="rowDel"
        @search-change="searchChange"
        @search-reset="searchReset"
        @selection-change="selectionChange"
        @current-change="currentChange"
        @size-change="sizeChange"
        @on-load="onLoad"
    >
  <basicContainer>
    <avue-crud :option="option" :table-loading="pageF.loading" :data="tableData" :page="page"
      :permission="permissionList" :before-open="beforeOpen" v-model="form" ref="crudRef" @row-update="rowUpdate"
      @row-save="rowSave" @refresh-change="refreshChange" @row-del="rowDel" @search-change="searchChange"
      @search-reset="searchReset" @selection-change="selectionChange" @current-change="currentChange"
      @size-change="sizeChange" @on-load="onLoad">
      <template #menu-left>
        <el-button
            type="success"
            icon="Edit"
            :disabled="pageF.single"
            v-hasPermi="['cwgl:estimatedReceivableBill:edit']"
            @click="handleUpdate">修改
        <!-- <el-button type="success" icon="Edit" :disabled="pageF.single"
          v-hasPermi="['cwgl:estimatedReceivableBill:edit']" @click="handleUpdate">修改
        </el-button> -->
        <!-- <el-button type="danger" icon="Delete" :disabled="pageF.multiple" @click="handleDelete"
          v-hasPermi="['cwgl:estimatedReceivableBill:remove']">删除
        </el-button>
        <el-button
            type="danger"
            icon="Delete"
            :disabled="pageF.multiple"
            @click="handleDelete"
            v-hasPermi="['cwgl:estimatedReceivableBill:remove']"
        >删除
        </el-button>
        <el-button
            type="warning"
            plain
            icon="Download"
            @click="handleExport"
            v-hasPermi="['cwgl:estimatedReceivableBill:export']"
        >导出
        </el-button>
        <el-button type="warning" plain icon="Download" @click="handleExport"
          v-hasPermi="['cwgl:estimatedReceivableBill:export']">导出
        </el-button> -->
      </template>
      <template #billSystemNo="{ size, row, index }">

        <el-link class="link-btn" type="primary" :underline="false" plain @click="handleBillSystemNo(row)">
          {{ row.billSystemNo }}
        </el-link>
      </template>


      <template #menu="{ size, row, index }">

        <el-link class="link-btn" type="primary" v-if="[0, 1].includes(row.status)" :underline="false" plain
          @click="handleclose(row)" v-hasPermi="['cwgl:estimatedReceivableBill:confirm']"> 结算
        </el-link>
        <el-link class="link-btn" type="primary" v-if="[0].includes(row.status)" :underline="false" plain
          @click="handleAmend(row)" v-hasPermi="['cwgl:estimatedReceivableBill:invalid']"> 修改
        </el-link>
        <el-link class="link-btn" type="primary" :underline="false" plain @click="handleFlow(row)"
          v-hasPermi="['cwgl:estimatedReceivableBill:flog']"> 日志
        </el-link>
      </template>
    </avue-crud>
  </basicContainer>


  <el-dialog v-model="dialog.visible" :title="dialog.title" width="1200px">
    <el-form ref="newFormRef" v-if="!dispIshow && noIshow" :model="newForm" :rules="rules" label-width="120px">
      <el-row :gutter="20">
        <el-col :span="12">
          <el-form-item label="本次结算金额" prop="settlementAmount">
            <el-input v-model="newForm.settlementAmount" placeholder="请输入本次结算金额" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="备注" prop="remark">
            <el-input v-model="newForm.remark" :rows="2" type="textarea" placeholder="请输入备注" />
          </el-form-item>
        </el-col>
        <el-col :span="12">
          <el-form-item label="附件" prop="attachment">
            <FileUpload v-model="newForm.attachment" :isShowTip="false"
              :fileType="['pdf', 'bmp', 'gif', 'jpg', 'jpeg', 'png']"></FileUpload>
            &nbsp;支持文件类型： pdf，bmp，gif，jpg，jpeg，png'
          </el-form-item>
        </el-col>

      </el-row>

    </el-form>

    <div v-if="!dispIshow && noIshow" style="text-align: center;margin-top: 20px;">
      <el-button @click="cancel">取 消</el-button>
      <el-button type="primary" @click="submitForm">确 定</el-button>
    </div>


    <h2 style="margin: 15px;font-size: 15px;">
      账单基本信息
    </h2>
    <el-form ref="storagesTransferRef" :model="newObjForm" label-width="120px">
      <el-descriptions class="margin-top" title="" :column="3" border>
        <el-descriptions-item label="账单系统编号" align="center">
          {{ importForm.billSystemNo }}
        </el-descriptions-item>
        <el-descriptions-item label="账单名称" align="center">
          <el-input v-if="dispIshow" v-model="importForm.billName" placeholder="请输入账单名称" />
          <span v-if="!dispIshow"> {{ importForm.billName }}</span>
        </el-descriptions-item>
        <el-descriptions-item label="客户名称" align="center">
          {{ importForm.customerName }}
        </el-descriptions-item>

        <el-descriptions-item label="应结算金额" align="center">
          {{ importForm.totalAmount }}
        </el-descriptions-item>

        <el-descriptions-item v-if="!dispIshow" label="已结算金额" align="center">
          {{ importForm.settledAmount }}
        </el-descriptions-item>

        <el-descriptions-item v-if="!dispIshow" label="待结算金额" align="center">
          <span v-if="importForm.totalAmount == 0">0</span>
          <span v-else>{{ (importForm.totalAmount - importForm.settledAmount).toFixed(2) }}</span>
        </el-descriptions-item>

        <el-descriptions-item v-if="dispIshow" label="" align="center">
        </el-descriptions-item>

        <el-descriptions-item v-if="dispIshow" label="" align="center">
        </el-descriptions-item>

      </el-descriptions>
    </el-form>

    <div v-if="dispIshow" style="text-align: center;margin-top: 20px;">
      <el-button @click="cancel">取 消</el-button>
      <el-button type="primary" @click="submitFormTow">确 定</el-button>
    </div>
    <h2 style="margin: 15px;font-size: 15px;">
      关联明细
    </h2>
    <avue-crud :option="newOption" :data="newTableData" v-model:search="newFormData" :page="newPageF"
      :table-loading="itemTableLoading2" @search-change="newSearchChange" ref="newTableRef"
      @search-reset="newRsetChange" @current-change="handleAttachmentCurrentChange"
      @size-change="handleAttachmentSizeChange" @on-load="newOnLoad">

      <template #menu="{ size, row, index }">
        <el-link class="link-btn" type="primary" :underline="false" plain @click="handleRelevance(row)"
          v-hasPermi="['cwgl:estimatedReceivableBill:relevancy']"> 取消关联
        </el-link>
      </template>

    </avue-crud>


    <div v-if="!noIshow" style="text-align: right;margin-top: 20px;">
      <el-button @click="cancel">取 消</el-button>
    </div>

  </el-dialog>

  <flowLog ref="flowLogIshow" :fileNameIshow="true" :flowParams="flowParams"></flowLog>


</template>

<script setup name="estimatedReceivableBill" lang="ts">
  import {EstimatedReceivableBillI,addEstimatedReceivableBill, delEstimatedReceivableBill, exportEstimatedReceivableBill, getEstimatedReceivableBill, listEstimatedReceivableBill, updateEstimatedReceivableBill} from "@/api/cwgl/estimatedReceivableBill";
  import useCurrentInstance from "@/utils/useCurrentInstance";
  import {computed,reactive, ref, toRefs} from "vue";
  import {PagesInterface, PageQueryInterface} from "@/utils/globalInterface";
  import {usePagePlus} from "@/hooks/usePagePlus";
  import {hasPermission} from "@/utils/permissionUtils";
import {
  EstimatedReceivableBillI, addEstimatedReceivableBill, delEstimatedReceivableBill, exportEstimatedReceivableBill, getEstimatedReceivableBill, listEstimatedReceivableBill, updateEstimatedReceivableBill,
  estimatedReceivableBillSettlement, addEstimatedReceivableLog, cancelRelevancy, listEstimatedReceivableBillLog, updateEstimatedReceivableBillNmae
} from "@/api/cwgl/estimatedReceivableBill";
import useCurrentInstance from "@/utils/useCurrentInstance";
import { computed, reactive, ref, toRefs } from "vue";
import { PagesInterface, PageQueryInterface } from "@/utils/globalInterface";
import { usePagePlus } from "@/hooks/usePagePlus";
import { hasPermission } from "@/utils/permissionUtils";
import {
  getPendingSettlementBusiness, listPendingSettlementBusiness
} from "@/api/cwgl/pendingSettlementBusiness";
const { proxy } = useCurrentInstance();
const crudRef = ref();

  const { proxy } = useCurrentInstance();
  const crudRef = ref();
const permissionList = computed(() => {
  return {
    addBtn: hasPermission(["cwgl:estimatedReceivableBill:add"]),
    delBtn: hasPermission(["cwgl:estimatedReceivableBill:remove"]),
    editBtn: hasPermission(["cwgl:estimatedReceivableBill:edit"]),
    viewBtn: hasPermission(["cwgl:estimatedReceivableBill:query"]),
  }
})
const dispIshow = ref(false)
const data = reactive({
  form: <EstimatedReceivableBillI>{},
  queryParams: <EstimatedReceivableBillI & PageQueryInterface>{},
  page: <PagesInterface>{
    pageSize: 10,
    total: 0,
    currentPage: 1,
  },
  selectionList: [],
  newForm: <EstimatedReceivableI>{
    pageNum: 1,
    pageSize: 10
  },
  importForm: {},
  newTableData: [],
  newFormData: {
    pageNum: 1,
    pageSize: 10
  },
  itemTableLoading2: false,
  rules: {
    settlementAmount: [
      { required: true, message: '请输入本次结算金额', trigger: 'blur' }
    ],

  const permissionList = computed(()=>{
    return {
      addBtn: hasPermission(["cwgl:estimatedReceivableBill:add"]),
      delBtn: hasPermission(["cwgl:estimatedReceivableBill:remove"]),
      editBtn: hasPermission(["cwgl:estimatedReceivableBill:edit"]),
      viewBtn: hasPermission(["cwgl:estimatedReceivableBill:query"]),
    }
  })
  },
})
const { queryParams, form, page, selectionList, newForm, importForm, newTableData, itemTableLoading2, newFormData, rules } = toRefs(data);
const option = ref({
  pageKey: 'EstimatedReceivableBill',
  rowKey: 'id',

  const data = reactive({
    form:<EstimatedReceivableBillI>{},
    queryParams:<EstimatedReceivableBillI&PageQueryInterface>{},
    page: <PagesInterface>{
      pageSize: 10,
      total: 0,
      currentPage: 1,
  searchSpan: 5,
  editDisplay: false,

  addBtn: false,
  editBtn: false,
  delBtn: false,
  viewBtn: false,

  searchLabelWidth: 100,
  labelWidth: 120,

  column: {
    // id: {
    //   label: 'ID',
    // },
    billSystemNo: {
      label: '账单系统编号',
      search: true,
      rules: [
        {
          required: true,
          message: "账单系统编号不能为空", trigger: "blur"
        }
      ],
    },
    selectionList:[],
  })
  const {queryParams,form,page,selectionList} = toRefs(data);
  const option = ref({
    pageKey: 'EstimatedReceivableBill',
    rowKey: 'id',
    column: {
                                id: {
          label: 'ID',
                            },
                                billSystemNo: {
          label: '账单系统编号',
                                rules: [
              {
                required: true,
                message: "账单系统编号不能为空", trigger: "blur" }
            ],                  },
                                billName: {
          label: '账单名称',
                                rules: [
              {
                required: true,
                message: "账单名称不能为空", trigger: "blur" }
            ],                  },
                                customerName: {
          label: '客户名称',
                                rules: [
              {
                required: true,
                message: "客户名称不能为空", trigger: "blur" }
            ],                  },
                                dispatchCount: {
          label: '调度单数量',
                            },
                                totalAmount: {
          label: '应结算金额',
                            },
                                settledAmount: {
          label: '已结算金额',
                            },
                                invoiceStatus: {
          label: '开票状态',
                            },
                                attachment: {
          label: '附件地址',
                      type: 'textarea', minRows: 3, maxRows: 5,
                            },
                                status: {
          label: '状态',
                            },
                                remark: {
          label: '备注',
                      type: 'textarea', minRows: 3, maxRows: 5,
                            },
                                createBy: {
          label: '创建人',
                            },
                                confirmTime: {
          label: '确认时间',
                            },
                                createTime: {
          label: '创建时间',
                            },
                                updateTime: {
          label: '更新时间',
                            },
                                deleted: {
          label: '删除标记(0:正常;1:删除)',
                            },
          }
  })
    billName: {
      label: '账单名称',
      rules: [
        {
          required: true,
          message: "账单名称不能为空", trigger: "blur"
        }
      ],
    },
    customerName: {
      label: '客户名称',
      rules: [
        {
          required: true,
          message: "客户名称不能为空", trigger: "blur"
        }
      ],
      search: true,
    },

  const { tableData,pageF,rowSave,rowUpdate,rowDel,beforeOpen,searchChange,
    searchReset,selectionChange,onLoad,currentChange,sizeChange,handleDelete,handleExport,handleUpdate,refreshChange} = usePagePlus({
    form:form,
    option:option,
    queryParams:queryParams,
    idKey:'id',
    page:page.value,
    getListApi:listEstimatedReceivableBill,
    getDetailApi:getEstimatedReceivableBill,
    exportApi:exportEstimatedReceivableBill,
    deleteApi:delEstimatedReceivableBill,
    addApi:addEstimatedReceivableBill,
    updateApi:updateEstimatedReceivableBill,
    handleUpdateFunc:()=>{
    dispatchCount: {
      label: '调度单数量',
    },
    totalAmount: {
      label: '应结算金额',
    },
    settledAmount: {
      label: '已结算金额',
    },
    invoiceStatus: {
      label: '开票状态',
      search: true,
      dataType: 'string',
      type: 'select',
      dicUrl: '/system/dict/data/type/sys_ticket_status',
    },
    // attachment: {
    //   label: '附件地址',
    //   type: 'textarea', minRows: 3, maxRows: 5,
    // },
    status: {
      label: '状态',
      search: true,
      dataType: 'string',
      type: 'select',
      dicUrl: '/system/dict/data/type/sys_final_statement_status',
    },
    // remark: {
    //   label: '备注',
    //   type: 'textarea', minRows: 3, maxRows: 5,
    // },
    // createBy: {
    //   label: '创建人',
    // },
    // confirmTime: {
    //   label: '确认时间',
    // },
    // createTime: {
    //   label: '创建时间',
    // },
    // updateTime: {
    //   label: '更新时间',
    // },
    // deleted: {
    //   label: '删除标记(0:正常;1:删除)',
    // },
  }
})

const newOption = ref({
  pageKey: 'PendingSettlementBusiness',
  rowKey: 'id',
  searchSpan: 5,
  selectionType: 'single',
  selectType: 'radio',
  editDisplay: false,
  addBtn: false,
  editBtn: false,
  selection: false,
  delBtn: false,
  menu: false,
  viewBtn: false,
  header: false,
  // searchLabelWidth: 100,
  // labelWidth: 120,
  column: {
    projectName: {
      label: '项目名称1',
    },
    dispatchNo: {
      label: '调度单号',
    },
    createdTime: {
      label: '下单时间',
    },
    estimatedTotalIncome: {
      label: '预估应收金额',
    },
    currency: {
      label: '币制',
    },
    // customerName: {
    //   label: '客户名称',
    //   search: true,
    // },


  }
})
const { tableData, pageF, rowSave, rowUpdate, rowDel, beforeOpen, searchChange,
  searchReset, selectionChange, onLoad, currentChange, sizeChange, handleDelete, handleExport, handleUpdate, refreshChange } = usePagePlus({
    form: form,
    option: option,
    queryParams: queryParams,
    idKey: 'id',
    page: page.value,
    getListApi: listEstimatedReceivableBill,
    getDetailApi: getEstimatedReceivableBill,
    exportApi: exportEstimatedReceivableBill,
    deleteApi: delEstimatedReceivableBill,
    addApi: addEstimatedReceivableBill,
    updateApi: updateEstimatedReceivableBill,
    handleUpdateFunc: () => {
      crudRef.value.rowEdit(selectionList.value[0]);
    },
    handleSelectionChangeFunc:(selection:any)=>{
    handleSelectionChangeFunc: (selection: any) => {
      selectionList.value = selection;
    }
  })
const dialog = reactive({
  visible: false,
  title: '',
})
const newTableRef = ref();
const handleclose = (row) => {
  newFormData.value.billId = row.id;
  dispIshow.value = false;
  newOption.value.menu = false;
  noIshow.value = true;
  listPendingSettlementBusiness({ billId: row.id }).then((res) => {
    if (res.code === 200) {
      newForm.value.id = row.id;
      importForm.value = row;
      dialog.visible = true;
      newPageF.value.total = res.total || 0;
      newTableData.value = res.rows || [];
      newTableData.value.map(item => {
        item.currency = '人民币';
      });
      newTableRef.value.refreshTable();
      dialog.title = '应收账单结算';
    }
  })

  // crudRef.value.close();
}

const handleAmend = (row) => {
  newFormData.value.billId = row.id;
  dispIshow.value = true;
  newOption.value.menu = true;
  listPendingSettlementBusiness({ billId: row.id }).then((res) => {
    if (res.code === 200) {
      newForm.value.id = row.id;
      importForm.value = row;
      dialog.visible = true;
      newPageF.value.total = res.total || 0;
      newTableData.value = res.rows || [];
      newTableData.value.map(item => {
        item.currency = '人民币';
      });
      newTableRef.value.refreshTable();
      dialog.title = '应收账单修改';
    }
  })
}
const noIshow = ref(false)
const handleBillSystemNo = (row) => {
  newFormData.value.billId = row.id;
  dispIshow.value = false;
  noIshow.value = false;
  newOption.value.menu = false;
  listPendingSettlementBusiness({ billId: row.id }).then((res) => {
    if (res.code === 200) {
      importForm.value = row;
      dialog.visible = true;
      dialog.title = '账单详情';
      newPageF.value.total = res.total || 0;
      newTableData.value = res.rows || [];
      newTableData.value.map(item => {
        item.currency = '人民币';
      });
      newTableRef.value.refreshTable();
    }
  })
}
const newFormRef = ref();
const submitForm = () => {
  newFormRef.value!.validate(valid => {
    if (valid) {
      let data = {
        billId: newForm.value.id,
        fileName: newForm.value.attachment
      }
      addEstimatedReceivableLog(data).then((res1) => {
        if (res1.code === 200) {
          estimatedReceivableBillSettlement(newForm.value).then((res) => {
            if (res.code === 200) {
              proxy.$message.success('操作成功');
              dialog.visible = false;
              newForm.value = {};

            }
          })
        }
      })
    }
  });



}

const submitFormTow = () => {
  proxy.$modal.confirm(`是否确认修改账单名称?`).then(function () {
    return updateEstimatedReceivableBillNmae(newForm.value);
  }).then((res) => {
    proxy.$modal.msgSuccess(res.msg);
  })

}
const storagesTransferRef = ref();
const cancel = () => {
  newForm.value = {};
  dialog.visible = false;
  proxy.resetForm(storagesTransferRef.value)
}


const newPageF = ref<PagesInterface>({
  total: 0,
  pageSize: 10
})

const newSearchChange = (params, done) => {
  // itemTableLoading2.value = true;
  // listPendingSettlementBusiness(newForm.value).then((res) => {
  //   if (res.code === 200) {
  //     done()
  //     newTableData.value = res.rows || [];
  //     newPageF.value.total = res.total || 0;
  //   }
  //   itemTableLoading2.value = false;
  // })
}
const newRsetChange = (done) => {
  getEstimatedReceivableCancel()
}
// 处理附件分页页码变化
const handleAttachmentCurrentChange = (currentPage: number) => {
  newFormData.value.pageNum = currentPage;
  getEstimatedReceivableCancel();
}
// 处理附件分页大小变化
const handleAttachmentSizeChange = (pageSize: number) => {
  newFormData.value.pageSize = pageSize;
  getEstimatedReceivableCancel();
}
const newOnLoad = (newPageF) => {
  getEstimatedReceivableCancel(newPageF);
}
const getEstimatedReceivableCancel = () => {
  itemTableLoading2.value = true;
  listPendingSettlementBusiness(newFormData.value).then((res) => {
    if (res.code === 200) {
      newTableData.value = res.rows || [];
      newTableData.value.map(item => {
        item.currency = '人民币';
      });
      newTableRef.value.refreshTable();
      newPageF.value.total = res.total || 0;
    }
    itemTableLoading2.value = false;
  })
}

const handleRelevance = (row) => {
  proxy.$modal.confirm(`是否取消关联成功该调度号 ：${row.dispatchNo}?`).then(function () {
    return cancelRelevancy(row.id);
  }).then((res) => {
    newOnLoad(newPageF.value);
    proxy.$modal.msgSuccess(res.msg);
  })

}

const flowLogIshow = ref()
const flowParams = ref([])
const handleFlow = (row: string) => {
  let data = {
    estimatedId: row.id,
  }
  listEstimatedReceivableBillLog(data).then((res) => {
    flowParams.value = res.rows
    flowLogIshow.value.openModel()

  })
}
</script>
<style scoped>
::v-deep .el-descriptions__body .el-descriptions__table.is-bordered .el-descriptions__cell {
  border: var(--el-descriptions-table-border);
  padding: 8px 11px;
  width: 200px;
}
</style>