fix:采购付款

src/views/purchase/orderRecord/components/basic-purchase.vue

@@ -47,7 +47,7 @@ function handleAddClick() {
   <el-table :data="purchaseOrderList" size="small">
     <el-table-column label="采购单编号" prop="sequenceNo" width="180" />
     <el-table-column label="采购单信息" show-overflow-tooltip>
-      <el-table-column label="贷款" prop="totalPrice" show-overflow-tooltip />
+      <el-table-column label="货款" prop="totalPrice" show-overflow-tooltip />
       <el-table-column
         label="供货商"
         prop="supplierName"

src/views/purchase/porder/preview-dialog.vue

@@ -1,5 +1,11 @@
 <script setup lang="ts">
 import { ref } from "vue";
+import {
+  inv_status_list,
+  pay_status_list,
+  send_status_list
+} from "/@/utils/status";
+
 import {
   cgd_status,
   preview_columns,
@@ -8,7 +14,7 @@ import {
   product_type,
   send_type
 } from "./columns";
-import { pay_status_list, send_status_list } from "/@/utils/status";
+
 const visible = ref(false);
 const data = ref<any>({});
 
@@ -56,6 +62,10 @@ defineExpose({
           {{ send_status_list.find(c => data[item.field] === c.value)?.label }}
         </el-tag>
 
+        <el-tag v-else-if="item.field === 'inv_status'">
+          {{ inv_status_list.find(c => data[item.field] === c.value)?.label }}
+        </el-tag>
+
         <span v-else>{{ data[item.field] }}</span>
       </el-descriptions-item>
     </el-descriptions>

src/views/purchase/purchPay/component/create-payment/add-order-modal.vue

@@ -1,30 +1,58 @@
 <script setup lang="ts">
-import { ref, watchEffect } from "vue";
+import { onMounted, ref, unref, watchEffect } from "vue";
 import { columns } from "../../config/configs";
 import { ElTable } from "element-plus";
+import { useResponseHandle } from "/@/hooks";
+import { httpList } from "/@/api/purchase/orderRecord";
 
-const props = defineProps<{
-  paymentList: Array<Record<string, string>>;
-}>();
-
+const paymentList = ref<Array<Record<string, string>>>([]);
+const selectOrder = ref<Array<Record<string, string>>>([]);
 const visible = ref(false);
 
-const emit = defineEmits(["change-payment-detail"]);
-const list = ref<Array<Record<string, string>>>([]);
+const emit = defineEmits(["on-add-order"]);
 const tableRef = ref<InstanceType<typeof ElTable>>(null);
+const responseHandle = useResponseHandle();
+
+//初始化订单对账列表
+async function requestPaymentList() {
+  const { code, message, data } = await httpList({});
+
+  responseHandle({
+    code,
+    message,
+    handler: () => {
+      paymentList.value = data.list;
+    }
+  });
+}
+
+function handleConfirm() {
+  visible.value = false;
+  emit("on-add-order", unref(selectOrder));
+}
 
-function handleCurrentChange(value) {
-  value && emit("change-payment-detail", value);
+function handleSelectionChange(values) {
+  if (values.length > 1) {
+    const value = values.pop();
+    tableRef.value.clearSelection();
+    tableRef.value.toggleRowSelection(value, true);
+    selectOrder.value = [value];
+  } else {
+    selectOrder.value = [values[0]];
+  }
 }
 
 //过滤审核成功的对账列表
 watchEffect(
-  () => (list.value = props.paymentList.filter(item => item.status === "3"))
+  () =>
+    (paymentList.value = paymentList.value.filter(item => item.status === "3"))
 );
 
 defineExpose({
   onDisplay: () => (visible.value = true)
 });
+
+onMounted(() => requestPaymentList());
 </script>
 
 <template>
@@ -32,12 +60,12 @@ defineExpose({
     <el-table
       border
       ref="tableRef"
-      row-key="id"
-      :data="list"
-      highlight-current-row
+      :data="paymentList"
       size="small"
-      @current-change="handleCurrentChange"
+      row-key="id"
+      @selection-change="handleSelectionChange"
     >
+      <el-table-column type="selection" width="55" />
       <el-table-column
         v-for="(col, index) in columns"
         :key="index"
@@ -45,5 +73,10 @@ defineExpose({
         show-overflow-tooltip
       />
     </el-table>
+
+    <div w-full flex justify-end mt-2>
+      <el-button type="primary" @click="handleConfirm">确定</el-button>
+      <el-button @click="() => (visible = false)">取消</el-button>
+    </div>
   </el-dialog>
 </template>

src/views/purchase/purchPay/component/create-payment/index.vue

@@ -2,25 +2,29 @@
 import { reactive, ref } from "vue";
 import OrderTable from "./order-table.vue";
 import { create_rules } from "../../config/configs";
-import { ElForm } from "element-plus";
-
-defineProps<{
-  paymentList: Array<Record<string, string>>;
-}>();
+import { ElForm, ElMessage } from "element-plus";
 
 const emit = defineEmits(["createPayment"]);
 const formRef = ref<InstanceType<typeof ElForm>>(null);
 
+const wpay = ref("0");
+
 const formData = reactive<Record<string, string>>({
   payNo: "",
   pay_fee: ""
 });
 
-function changePaymentDetail({ payNo }) {
+function changePaymentDetail({ payNo, wpay_fee }) {
   formData.payNo = payNo;
+  wpay.value = wpay_fee;
+  formRef.value.validateField("payNo");
 }
 
 function handleCreate() {
+  if (Number(formData.pay_fee) > Number(wpay.value)) {
+    return ElMessage.error("付款金额不能超过未付款金额");
+  }
+
   formRef.value.validate(isVaild => isVaild && emit("createPayment", formData));
 }
 </script>
@@ -30,10 +34,7 @@ function handleCreate() {
   <!-- 新建  显示选择的对账列表 -->
   <el-form ref="formRef" :model="formData" :rules="create_rules">
     <el-form-item label="订单对账" prop="payNo">
-      <OrderTable
-        :paymentList="paymentList"
-        @change-payment-detail="changePaymentDetail"
-      />
+      <OrderTable @change-payment-detail="changePaymentDetail" />
     </el-form-item>
     <el-form-item label="付款金额" prop="pay_fee">
       <el-input placeholder="请输入付款金额" v-model="formData.pay_fee" />

src/views/purchase/purchPay/component/create-payment/order-table.vue

@@ -1,42 +1,72 @@
 <script setup lang="ts">
 import { ref } from "vue";
-import { columns } from "../../config/configs";
-import { ElTable } from "element-plus";
+import { httpInfo } from "/@/api/purchase/orderRecord";
 import AddOrderModal from "./add-order-modal.vue";
-
-defineProps<{
-  paymentList: Array<Record<string, string>>;
-}>();
+import BasicPurchase from "../../../orderRecord/components/basic-purchase.vue";
+import { useResponseHandle } from "/@/hooks";
 
 const emit = defineEmits(["change-payment-detail"]);
 const addOrderRef = ref<InstanceType<typeof AddOrderModal>>(null);
-const list = ref<Array<Record<string, string>>>([]);
-const tableRef = ref<InstanceType<typeof ElTable>>(null);
+const detail = ref<Record<string, string> | null>(null);
+const loading = ref(false);
+const responseHandle = useResponseHandle();
 
-function handleAdd() {
+function handleShowAddModal() {
   addOrderRef.value.onDisplay();
 }
+
+async function handleAddOrder(orders) {
+  const currentOrder = orders[0];
+  emit("change-payment-detail", currentOrder);
+  loading.value = true;
+  const { data, message, code } = await httpInfo({
+    payNo: currentOrder.payNo
+  });
+
+  responseHandle({
+    message,
+    code,
+    handler: () => (detail.value = data)
+  });
+
+  loading.value = false;
+}
 </script>
 
 <template>
-  <div flex w-full justify-end mb-2>
-    <el-button type="primary" @click="handleAdd">添加</el-button>
+  <div w-full v-loading="loading">
+    <div flex justify-end mb-2>
+      <el-button type="primary" @click="handleShowAddModal">选择</el-button>
+    </div>
+
+    <el-descriptions :column="2" border size="small" v-if="detail" w-full mb-5>
+      <el-descriptions-item label="供应商">{{
+        detail.supplierName
+      }}</el-descriptions-item>
+
+      <el-descriptions-item label="业务公司">{{
+        detail.companyName
+      }}</el-descriptions-item>
+
+      <el-descriptions-item label="对账总额">{{
+        detail.total_fee
+      }}</el-descriptions-item>
+
+      <el-descriptions-item label="已付款">{{
+        detail.pay_fee
+      }}</el-descriptions-item>
+
+      <el-descriptions-item label="付款中">{{
+        detail.apay_fee
+      }}</el-descriptions-item>
+
+      <el-descriptions-item label="未付款">{{
+        detail.wpay_fee
+      }}</el-descriptions-item>
+    </el-descriptions>
+
+    <BasicPurchase :purchase-order-list="detail?.cgdlist || []" readonly />
   </div>
-  <el-table
-    border
-    ref="tableRef"
-    row-key="id"
-    :data="list"
-    highlight-current-row
-    size="small"
-  >
-    <el-table-column
-      v-for="(col, index) in columns"
-      :key="index"
-      v-bind="col"
-      show-overflow-tooltip
-    />
-  </el-table>
-
-  <AddOrderModal :payment-list="paymentList" ref="addOrderRef" />
+
+  <AddOrderModal @on-add-order="handleAddOrder" ref="addOrderRef" />
 </template>

src/views/purchase/purchPay/config/configs.ts

@@ -1,3 +1,5 @@
+import { FormRules } from "element-plus";
+
 export const statusOptions = [
   {
     label: "待发起流程",
@@ -56,9 +58,9 @@ export const paymentOptions = [
   }
 ];
 
-export const create_rules = {
+export const create_rules: FormRules = {
   pay_fee: [{ required: true, trigger: "change", message: "请输入付款金额" }],
-  payNo: [{ required: true, trigger: "change", message: "请选择付款订单" }]
+  payNo: [{ required: true, trigger: "", message: "请选择付款订单" }]
 };
 
 export const audit_rules = {

src/views/purchase/purchPay/detail.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { computed, onMounted, ref } from "vue";
-import InitiateAudit from "./component/approval-process/Initiate-audit.vue";
+import InitiateAudit from "./component/approval-process/initiate-audit.vue";
 import BusinessAudit from "./component/approval-process/business-audit.vue";
 import FinancialAudit from "./component/approval-process/financial-audit.vue";
 import PaymentReceipt from "./component/approval-process/payment-receipt.vue";
@@ -10,8 +10,6 @@ import { useShowAudit } from "./hooks/use-show-audit";
 import { useRoute, useRouter } from "vue-router";
 import { useResponseHandle } from "/@/hooks";
 
-import { httpList } from "/@/api/purchase/orderRecord";
-
 import { httpStatus, httpAdd, httpInfo } from "/@/api/purchase/orderPay";
 
 const { push } = useRouter();
@@ -20,9 +18,6 @@ const dzNo = computed(() => query.id as string);
 const isCreate = computed(() => !dzNo.value);
 const responseHandle = useResponseHandle();
 
-//对账列表
-const paymentList = ref<Array<Record<string, string>>>([]);
-
 //付款详情
 const purchPayDetail = ref<Record<string, string>>({});
 const handler = () => push("/purchase/purchPay");
@@ -42,19 +37,6 @@ const {
   showPaymentReceipt
 } = useShowAudit(status, isCreate);
 
-//初始化订单对账列表
-async function requestPaymentList() {
-  const { code, message, data } = await httpList({});
-
-  responseHandle({
-    code,
-    message,
-    handler: () => {
-      paymentList.value = data.list;
-    }
-  });
-}
-
 //请求更改付款订单状态
 async function requestStatusPayment(
   status: string,
@@ -99,7 +81,7 @@ async function requesetPaymentDetail() {
 
 //创建选择订单对账列表 详情查询付款单详情 查询采购列表
 async function initalData() {
-  if (isCreate.value) return requestPaymentList();
+  if (!dzNo.value) return;
   //拉取详情
   requesetPaymentDetail();
 }
@@ -111,11 +93,7 @@ onMounted(() => initalData());
 <template>
   <div class="pay__content" bg-white>
     <!-- 创建采购付款订单 -->
-    <CreatePayment
-      v-if="isCreate"
-      :paymentList="paymentList"
-      @create-payment="requesetCreatePayment"
-    />
+    <CreatePayment v-if="isCreate" @create-payment="requesetCreatePayment" />
 
     <!-- 采购付款订单详情 -->
     <ElTabs v-else>