feat:采购页面

src/api/InvoiceSales/capitalClaim/index.ts

@@ -8,27 +8,22 @@ interface ResponseType extends Promise<any> {
   code?: number;
   msg?: string;
 }
+
 // 添加
 export const httpAdd = (data: object): ResponseType => {
   return http.request("post", `${yewuApi}orderpayadd`, { data });
 };
+
 // 列表
 export const httpList = (data: object): ResponseType => {
-  return http.request("post", `${yewuApi}tradeList`, { data });
+  return http.request("post", `${yewuApi}orderpaylist`, { data });
 };
-// 详情
+//详情
 export const httpDetail = (data: object): ResponseType => {
   return http.request("post", `${yewuApi}tradeQuery`, { data });
 };
-// 更新
-export const httpUpdate = (data: object): ResponseType => {
-  return http.request("post", `${yewuApi}menusave`, { data });
-};
-// 状态
-export const httpStatus = (data: object): ResponseType => {
-  return http.request("post", `${yewuApi}orderpaystatus`, { data });
-};
-// 删除 (解除认领)
-export const httpDelete = (data: object): ResponseType => {
-  return http.request("post", `${yewuApi}orderpayreturn`, { data });
+
+//上传execl
+export const httpUpload = (data: any): any => {
+  return http.request("post", `${yewuApi}importTrade`, { data });
 };

src/api/parameter/invoiceheader/index.ts

@@ -8,12 +8,8 @@ export const httpList = (data: object): any => {
   return http.request("post", `${yewuApi}involist`, { data });
 };
 
-export const httpDelete = (id: number): any => {
-  return http.request("post", `${yewuApi}invoicedel`, {
-    data: {
-      id
-    }
-  });
+export const httpDelete = (data: object): any => {
+  return http.request("post", `${yewuApi}invoicedel`, { data });
 };
 
 export const httpAdd = (data: Record<string, any>): any => {

src/api/purchase/orderPay/index.ts

@@ -23,3 +23,7 @@ export const httpDelete = (data: object): any => {
 export const httpStatus = (data: object): any => {
   return http.request("post", `${yewuApi}paystatus`, { data });
 };
+
+export const httpUpload = (data: object): any => {
+  return http.request("post", `${yewuApi}uploadimg`, { data });
+};

src/api/purchase/ticketReturn/index.ts

@@ -13,3 +13,8 @@ export const httpList = (data: object): any => {
 export const httpAdd = (data: object): any => {
   return http.request("post", `${yewuApi}/invadd`, { data });
 };
+
+//发票回票审核状态
+export const httpStatus = (data: object): any => {
+  return http.request("post", `${yewuApi}/invstatus`, { data });
+};

src/components/PageContent/src/actions/action-delete.tsx

@@ -21,6 +21,7 @@ const ActionDelete = defineComponent({
 
     async function handleDelete() {
       const { config, row, prop } = props;
+
       const { code, message } = await config.api({
         ...(prop ? { [prop]: row[prop] } : { id: row.id })
       });

src/components/PageContent/src/hooks/use-request.ts

@@ -30,7 +30,7 @@ export function useRequeset(props: PageContentProps) {
    */
   async function onSearch() {
     const { contentConfig } = props;
-    const { apis, isTree } = contentConfig;
+    const { apis, isTree, mockData } = contentConfig;
 
     if (!initRequest.value) return (initRequest.value = true);
 
@@ -50,6 +50,8 @@ export function useRequeset(props: PageContentProps) {
       handler: () => {
         const list = Array.isArray(data) ? data : data.list;
         dataList.value = isTree ? handleTree(list ?? []) : list;
+
+        if (mockData) dataList.value = mockData;
         changePagination("total", data.count);
       }
     });

src/components/PageContent/src/page-content.tsx

@@ -38,11 +38,14 @@ const PageConent = defineComponent({
      */
     function renderOperation(row) {
       const { contentConfig } = props;
-      const { apis } = contentConfig;
+      const { apis, notPreview } = contentConfig;
 
       return (
         <>
-          <Operation.Preview onPreview={() => emit("previewBtnClick", row)} />
+          {slots.custom && slots.custom(row)}
+          {!notPreview && (
+            <Operation.Preview onPreview={() => emit("previewBtnClick", row)} />
+          )}
           {action.update && (
             <Operation.Update
               onUpdate={() => emit("updateBtnClick", row)}

src/components/PageContent/src/types.ts

@@ -15,8 +15,10 @@ export interface ContentConfig {
   columns: any;
   notReuqiredInit?: boolean;
   notPagination?: boolean;
+  notPreview?: boolean;
   statusProp?: string;
   deleteProp?: string;
+  mockData?: Array<any>;
   isTree?: boolean;
 }
 

src/components/PageSearch/src/page-search.vue

@@ -29,7 +29,7 @@ function handleSearchClick() {
   <div class="bg-white w-99/100 pl-8 pt-4">
     <BasicForm v-bind="formConfig" v-model:form-data="formData">
       <template #action>
-        <div style="width: 100%">
+        <div style="width: 100%" flex gap-2>
           <el-button
             type="primary"
             :icon="useRenderIcon('search')"

src/components/RemoteSelect/src/remote-select.tsx

@@ -19,11 +19,11 @@ const RemoteSelect = defineComponent({
 
     async function remoteMethod(val: string) {
       if (!val) return;
-      const { responseLabelProp, responseValProp, api } = props;
+      const { responseLabelProp, responseValProp, requestProp, api } = props;
 
       loading.value = true;
       const { code, data, message } = await api({
-        [responseLabelProp]: val
+        [requestProp ? requestProp : responseLabelProp]: val
       });
 
       responseHandle({

src/components/RemoteSelect/src/types.ts

@@ -6,6 +6,9 @@ export const RemoteSelectProps = {
   value: {
     type: String
   },
+  requestProp: {
+    type: String
+  },
   responseLabelProp: {
     type: String
   },

src/views/InvoiceSales/capitalClaim/components/receipt-payment.vue

@@ -1,17 +1,29 @@
+<script setup lang="ts">
+import { description_columns } from "../config/columns";
+</script>
+
 <template>
   <div flex gap-10>
     <el-descriptions title="付款方" :column="1" border flex-1>
-      <el-descriptions-item label="单位名称">xxxxxx</el-descriptions-item>
-      <el-descriptions-item label="银行账号">xxxxxx</el-descriptions-item>
-      <el-descriptions-item label="银行名称">xxxxx</el-descriptions-item>
-      <el-descriptions-item label="账号">xxxxx</el-descriptions-item>
+      <el-descriptions-item
+        v-for="(item, index) in description_columns"
+        :key="index"
+        :label="item.label"
+      />
     </el-descriptions>
 
     <el-descriptions title="收款方" :column="1" border flex-1>
-      <el-descriptions-item label="单位名称">xxxxx</el-descriptions-item>
-      <el-descriptions-item label="银行账号">xxxxx</el-descriptions-item>
-      <el-descriptions-item label="银行名称">xxxxx</el-descriptions-item>
-      <el-descriptions-item label="账号">xxxxx</el-descriptions-item>
+      <el-descriptions-item
+        v-for="(item, index) in description_columns"
+        :key="index"
+        :label="item.label"
+      />
     </el-descriptions>
   </div>
 </template>
+
+<style lang="scss" scoped>
+:deep(.el-descriptions__label) {
+  width: 80px !important;
+}
+</style>

src/views/InvoiceSales/capitalClaim/components/related-order.vue

@@ -1,22 +1,41 @@
 <script setup lang="ts">
+import { ref } from "vue";
 import { order_columns } from "../config/columns";
-import { httpDetail } from "/@/api/InvoiceSales/capitalClaim";
 
-httpDetail({
-  tradNo: "Sfrrg220610163212"
-});
+const currentWriteOff = ref(0);
 
-const mock_data = [];
+const mock_data = [
+  {
+    payNo: "0",
+    gmfgs: "xxxx",
+    xsfgs: "xxx",
+    productName: "ccc",
+    total: "10000",
+    status: "0",
+    yhx: "0",
+    whx: "1",
+    cchx: "xxx",
+    createTime: "xxxx"
+  }
+];
 </script>
 
 <template>
-  <h1 my-2>关联账单:</h1>
+  <h1 my-4>关联账单:</h1>
 
   <el-table :data="mock_data">
-    <el-table-column
-      v-for="(col, index) in order_columns"
-      :key="index"
-      :label="col.label"
-    />
+    <template v-for="(col, index) in order_columns" :key="index">
+      <el-table-column
+        v-if="col.label !== '此次核销'"
+        :label="col.label"
+        :prop="col.prop"
+      />
+
+      <el-table-column v-else :label="col.label">
+        <template #default>
+          <el-input v-model="currentWriteOff" />
+        </template>
+      </el-table-column>
+    </template>
   </el-table>
 </template>

src/views/InvoiceSales/capitalClaim/config/columns.ts

@@ -7,58 +7,68 @@ export const order_columns = [
   },
   {
     label: "购买方公司",
-    prop: "payNo",
+    prop: "gmfgs",
     minWidth: 180,
     align: "left"
   },
   {
     label: "销售方公司",
-    prop: "payNo",
+    prop: "xsfgs",
     minWidth: 180,
     align: "left"
   },
   {
     label: "商品名称",
-    prop: "payNo",
+    prop: "productName",
     minWidth: 180,
     align: "left"
   },
   {
     label: "订单总金额",
-    prop: "payNo",
+    prop: "total",
     minWidth: 180,
     align: "left"
   },
   {
     label: "资金状态",
-    prop: "payNo",
+    prop: "status",
     minWidth: 180,
     align: "left"
   },
   {
     label: "已核销",
-    prop: "payNo",
+    prop: "yhx",
     minWidth: 180,
     align: "left"
   },
   {
     label: "未核销",
-    prop: "payNo",
+    prop: "whx",
     minWidth: 180,
     align: "left"
   },
   {
     label: "此次核销",
-    prop: "payNo",
+    prop: "cchx",
     minWidth: 180,
     align: "left"
   },
   {
     label: "交易时间",
-    prop: "payNo",
+    prop: "createTime",
     minWidth: 180,
     align: "left"
   }
 ];
 
-export const mock = {};
+export const description_columns = [
+  {
+    label: "单位名称"
+  },
+  {
+    label: "银行账号"
+  },
+  {
+    label: "银行名称"
+  }
+];

src/views/InvoiceSales/capitalClaim/config/content.config.ts

@@ -15,20 +15,19 @@ const columns = [
     width: 70,
     hide: ({ checkList }) => !checkList.includes("序号列")
   },
-
   {
     label: "资金编号",
-    prop: "invoice_title",
-    width: 100
+    prop: "tradNo",
+    width: 150
   },
   {
     label: "付款单位账号",
-    prop: "invoice_people",
-    width: 100
+    prop: "trade_account",
+    width: 120
   },
   {
     label: "付款银行名称",
-    prop: "invoice_addr",
+    prop: "trade_out",
     width: 120
   },
   {
@@ -38,32 +37,32 @@ const columns = [
   },
   {
     label: "汇款金额",
-    prop: "invoice_code",
+    prop: "total_fee",
     width: 140
   },
   {
     label: "收款单位名称",
-    prop: "invoice_bank",
-    width: 120
-  },
-  {
-    label: "收款银行名称",
-    prop: "invoice_bankNo",
+    prop: "trade_in",
     width: 120
   },
-  {
-    label: "收款账号",
-    prop: "apply_name",
-    width: 80
-  },
+  // {
+  //   label: "收款银行名称",
+  //   prop: "invoice_bankNo",
+  //   width: 120
+  // },
+  // {
+  //   label: "收款账号",
+  //   prop: "apply_name",
+  //   width: 100
+  // },
   {
     label: "未核销",
-    prop: "apply_name",
+    prop: "balance",
     width: 80
   },
   {
     label: "已核销",
-    prop: "apply_name",
+    prop: "used_fee",
     width: 80
   },
   {
@@ -83,6 +82,7 @@ const columns = [
 const contentConfig: ContentConfig = {
   title: "资金认领管理",
   columns,
+  notPreview: true,
   apis: {
     httpList
   }

src/views/InvoiceSales/capitalClaim/detail.vue

@@ -1,12 +1,60 @@
 <script setup lang="ts">
+import { computed, onMounted, ref } from "vue";
+import { useRoute } from "vue-router";
 import PaymentReceipt from "./components/receipt-payment.vue";
 import RelatedOrder from "./components/related-order.vue";
+import { httpDetail } from "/@/api/InvoiceSales/capitalClaim";
+import { useResponseHandle } from "/@/hooks";
+import { TreadeDetail } from "./types";
+
+const { query } = useRoute();
+const responseHandle = useResponseHandle();
+const tradNo = computed(() => query.id as string);
+
+const treadeDetail = ref<TreadeDetail>({
+  id: 833,
+  tradNo: "Sc2b8220624161158",
+  trade_bank: "招商银行股份有限公司北京分行营业部",
+  trade_account: "10900319110206",
+  trade_type: 0,
+  trade_time: "2022-06-24 14:15:18",
+  trade_used: "F220492564DN20220620184258505.",
+  trade_out: "泰康保险集团股份有限公司",
+  trade_in: "",
+  trade_remark: "",
+  total_fee: "29462.00",
+  used_fee: "0.00",
+  balance: "29462.00",
+  status: 1,
+  is_del: 0,
+  addtime: "2022-06-24 16:11:58",
+  updatetime: "2022-06-24 16:11:58"
+});
+
+async function requesetTradeDetail() {
+  const { code, message, data } = await httpDetail({
+    tradNo: tradNo.value
+  });
+
+  responseHandle({
+    code,
+    message,
+    handler: () => console.log(data)
+  });
+}
+
+//传入id初始化详情
+onMounted(() => tradNo.value && requesetTradeDetail());
 </script>
 
 <template>
   <div class="invoice__content" bg-white>
     <PaymentReceipt />
     <RelatedOrder />
+
+    <div flex justify-end mt-3>
+      <el-button type="primary">保存</el-button>
+    </div>
   </div>
 </template>
 

src/views/InvoiceSales/capitalClaim/index.vue

@@ -1,4 +1,5 @@
 <script setup lang="ts">
+import { ref } from "vue";
 import { utils, writeFile } from "xlsx";
 import { PageSearch, usePageSearch } from "/@/components/PageSearch";
 import { PageModal, usePageModal } from "/@/components/PageModal";
@@ -6,19 +7,29 @@ import { PageContent } from "/@/components/PageContent";
 import searchFormConfig from "./config/search.config";
 import contentConfig from "./config/content.config";
 import modalConfig from "./config/modal.config";
+import { useRouter } from "vue-router";
+import ExeclUpload from "./components/execl-upload.vue";
 
 defineOptions({
   name: "invoiceheader"
 });
 
+const { push } = useRouter();
+
+const execlUploadRef = ref<InstanceType<typeof ExeclUpload>>(null);
+
 const { pageContentRef, handleResetClick, handleSearchClick } = usePageSearch(
-  ({ create_timer }) => ({
-    result: {
-      start: create_timer[0],
-      end: create_timer[1]
-    },
-    deleteProps: ["create_timer"]
-  })
+  ({ create_timer }) => {
+    const [start, end] = create_timer;
+
+    return {
+      result: {
+        start,
+        end
+      },
+      deleteProps: ["create_timer"]
+    };
+  }
 );
 
 const {
@@ -36,7 +47,7 @@ function onDownloadTemplate() {
   const data: Record<string, string> = {};
 
   columns.forEach(col => {
-    if (col.label) data[col.label] = "";
+    if (col.label && col.label !== "序号") data[col.label] = "";
   });
 
   //创建数据表
@@ -45,10 +56,20 @@ function onDownloadTemplate() {
   utils.book_append_sheet(workBook, workSheet, "sheet");
 
   //导出模板
-  writeFile(workBook, "template.xlsx", {
+  writeFile(workBook, "资金认领模板.xlsx", {
     bookType: "xlsx"
   });
 }
+
+//到详情页
+function toFundClaim(tradNo) {
+  push({
+    path: "/InvoiceSales/capitalClaimDetail",
+    query: {
+      id: tradNo
+    }
+  });
+}
 </script>
 
 <template>
@@ -60,7 +81,9 @@ function onDownloadTemplate() {
     >
       <template #action>
         <el-button @click="onDownloadTemplate">下载模板</el-button>
-        <el-button type="primary">导入数据</el-button>
+        <el-button type="primary" @click="() => execlUploadRef.onDisplay()"
+          >导入数据</el-button
+        >
       </template>
     </PageSearch>
 
@@ -70,7 +93,14 @@ function onDownloadTemplate() {
       @create-btn-click="handleCreateData"
       @update-btn-click="handleUpdateData"
       @preview-btn-click="handlePreviewData"
-    />
+    >
+      <template #custom="{ tradNo }">
+        <el-button link type="primary" @click="toFundClaim(tradNo)"
+          >资金认领</el-button
+        >
+        <el-button link type="primary">认领审核</el-button>
+      </template>
+    </PageContent>
 
     <PageModal
       ref="pageModalRef"
@@ -78,6 +108,8 @@ function onDownloadTemplate() {
       :default-info="defaultInfo"
       @confirm-btn-click="handleConfrim"
     />
+
+    <ExeclUpload ref="execlUploadRef" />
   </div>
 </template>
 
@@ -85,4 +117,13 @@ function onDownloadTemplate() {
 :deep(.el-dropdown-menu__item i) {
   margin: 0;
 }
+
+:deep(.cell) {
+  display: flex;
+  flex-direction: column;
+}
+
+:deep(.el-button + .el-button) {
+  margin-left: 0px !important;
+}
 </style>

src/views/InvoiceSales/capitalClaim/types.ts

@@ -14,3 +14,25 @@ export interface menuType {
   updatetime?: string;
   weight?: number;
 }
+
+export const detaultTreadeDetail = {
+  id: 0,
+  tradNo: "",
+  trade_bank: "",
+  trade_account: "",
+  trade_type: 0,
+  trade_time: "",
+  trade_used: "",
+  trade_out: "",
+  trade_in: "",
+  trade_remark: "",
+  total_fee: "",
+  used_fee: "",
+  balance: "",
+  status: 0,
+  is_del: 0,
+  addtime: "",
+  updatetime: ""
+};
+
+export type TreadeDetail = Partial<typeof detaultTreadeDetail>;

src/views/purchase/inputInvoice/config/content.config.ts

@@ -28,7 +28,7 @@ const columns = [
   },
   {
     label: "发票号码",
-    prop: "invNumber"
+    prop: "invoiceNumber"
   },
   {
     label: "录入方式",

src/views/purchase/inputInvoice/config/search.config.ts

@@ -9,7 +9,7 @@ const searchFormConfig: FormConfig = {
       placeholder: "发票类型"
     },
     {
-      field: "invoiceType",
+      field: "invNumber",
       type: "input",
       placeholder: "发票号码"
     },

src/views/purchase/inputInvoice/invoice-dialog.vue

@@ -19,7 +19,7 @@ defineExpose({
     <div class="InvoiceTmpDiv">
       <el-row>
         <el-col :span="12" :offset="6" class="title no-border"
-          >XX市增值税XX票XX发票</el-col
+          >XX市增值税X票XX发票</el-col
         >
         <el-col :span="6" class="extra no-border">
           <div>
@@ -61,22 +61,38 @@ defineExpose({
         <el-col :span="15">
           <div flex mb-1>
             <span class="label">名称</span>：<span class="content">
-              <el-input size="small" placeholder="请输入名称" />
+              <el-input
+                v-model="invoiceData.buyer_name"
+                size="small"
+                placeholder="请输入名称"
+              />
             </span>
           </div>
           <div flex mb-1>
             <span class="label">纳税人识别号</span>：<span class="content">
-              <el-input size="small" placeholder="请输入纳税识别号" />
+              <el-input
+                v-model="invoiceData.buyer_id"
+                size="small"
+                placeholder="请输入纳税识别号"
+              />
             </span>
           </div>
           <div flex mb-1>
             <span class="label">地址、电话</span>：<span class="content">
-              <el-input size="small" placeholder="请输入地址、电话" />
+              <el-input
+                v-model="invoiceData.buyer_address"
+                size="small"
+                placeholder="请输入地址、电话"
+              />
             </span>
           </div>
           <div flex mb-1>
             <span class="label">开户行及账号</span>：<span class="content">
-              <el-input size="small" placeholder="请输入开户行及账号" />
+              <el-input
+                v-model="invoiceData.buyer_bank"
+                size="small"
+                placeholder="请输入开户行及账号"
+              />
             </span>
           </div>
         </el-col>
@@ -187,22 +203,38 @@ defineExpose({
         <el-col :span="15">
           <div flex mb-1>
             <span class="label">名称</span>：<span class="content">
-              <el-input size="small" placeholder="请输入名称" />
+              <el-input
+                v-model="invoiceData.seller_name"
+                size="small"
+                placeholder="请输入名称"
+              />
             </span>
           </div>
           <div flex mb-1>
             <span class="label">纳税人识别号</span>：<span class="content">
-              <el-input size="small" placeholder="请输入纳税识别号" />
+              <el-input
+                v-model="invoiceData.seller_id"
+                size="small"
+                placeholder="请输入纳税识别号"
+              />
             </span>
           </div>
           <div flex mb-1>
             <span class="label">地址、电话</span>：<span class="content">
-              <el-input size="small" placeholder="请输入地址、电话" />
+              <el-input
+                v-model="invoiceData.seller_address"
+                size="small"
+                placeholder="请输入地址、电话"
+              />
             </span>
           </div>
           <div flex mb-1>
             <span class="label">开户行及账号</span>：<span class="content">
-              <el-input size="small" placeholder="请输入开户行及账号" />
+              <el-input
+                v-model="invoiceData.seller_bank"
+                size="small"
+                placeholder="请输入开户行及账号"
+              />
             </span>
           </div>
         </el-col>

src/views/purchase/orderRecord/components/business-review/index.vue

@@ -74,14 +74,16 @@ watch(
 <template>
   <h1 text-xl py-2 font-bold>业务审核</h1>
 
-  <div flex justify-between>
-    <el-form
-      inline
-      :rules="rules"
-      :model="formData"
-      ref="formRef"
-      :disabled="isFormDisabled"
-    >
+  <el-form
+    inline
+    :rules="rules"
+    :model="formData"
+    ref="formRef"
+    label-width="100px"
+    flex
+    justify-between
+  >
+    <div flex flex-col style="width: 50%">
       <el-form-item label="审核状态" prop="status">
         <el-select placeholder="请选择审核状态" v-model="formData.status">
           <el-option value="2" label="通过" />
@@ -90,12 +92,16 @@ watch(
       </el-form-item>
 
       <el-form-item label="备注" prop="remark">
-        <el-input placeholder="请输入备注" v-model="formData.remark" />
+        <el-input
+          type="textarea"
+          :maxlength="2000"
+          :rows="5"
+          placeholder="请输入备注"
+          v-model="formData.remark"
+        />
       </el-form-item>
-    </el-form>
+    </div>
 
-    <el-button type="primary" @click="resquestAudit" v-if="!isFormDisabled"
-      >提交审核结果</el-button
-    >
-  </div>
+    <el-button type="primary" @click="resquestAudit">提交审核结果</el-button>
+  </el-form>
 </template>

src/views/purchase/orderRecord/components/new-bill/add-order-modal.vue

@@ -96,6 +96,7 @@ defineExpose({
     <el-table
       ref="tableRef"
       row-key="id"
+      size="small"
       :data="tableData"
       v-loading="loading"
       @selection-change="handleSelection"

src/views/purchase/orderRecord/components/new-bill/index.vue

@@ -14,6 +14,7 @@ import { httpList as httpCompanylist } from "/@/api/parameter/finance";
 const emit = defineEmits(["changeStatementDetail"]);
 const props = defineProps<{
   payNo?: string;
+  statementDetail?: Record<string, string>;
 }>();
 
 const { push } = useRouter();
@@ -29,14 +30,14 @@ const formTitle = computed(() => {
 });
 
 //已经审核 禁用表单
-const formDisabled = computed(() => Number(statementDetail.value.status) >= 1);
+const formDisabled = computed(() => Number(statementDetail.value.status) >= 0);
 const purchaseOrderList = ref<Array<any>>([]);
 
 const formRef = ref<InstanceType<typeof ElForm>>(null);
 const formData = reactive<Record<string, any>>({
   cids: "",
-  supplier: "",
-  company: ""
+  supplierNo: "",
+  companyNo: ""
 });
 
 //显示添加采购单的dialog
@@ -109,26 +110,44 @@ onMounted(() => requestStatementDetail());
 
 <template>
   <h1 text-xl py-2 font-bold>{{ formTitle }}</h1>
+
+  <!-- 显示详情详情 -->
+  <div v-if="payNo" mb-5>
+    <el-descriptions :column="2" border>
+      <el-descriptions-item label="业务公司">
+        {{ statementDetail.companyName }}
+      </el-descriptions-item>
+      <el-descriptions-item label="供应商">
+        {{ statementDetail.supplierName }}
+      </el-descriptions-item>
+      <el-descriptions-item label="申请时间">
+        {{ statementDetail.addtime }}
+      </el-descriptions-item>
+    </el-descriptions>
+  </div>
+
   <el-form
     ref="formRef"
     :model="formData"
     :rules="rules"
     :disabled="formDisabled"
   >
-    <div flex gap-10>
-      <el-form-item label="业务公司">
+    <!-- 创建 -->
+    <div flex gap-10 v-if="!payNo">
+      <el-form-item label="业务公司" prop="companyNo">
         <RemoteSelect
-          v-model:value="formData.company"
+          v-model:value="formData.companyNo"
           :api="httpCompanylist"
           placeholder="请选择业务公司"
+          request-prop="companyName"
           response-label-prop="company_name"
           response-val-prop="companyNo"
         />
       </el-form-item>
 
-      <el-form-item label="供应商">
+      <el-form-item label="供应商" prop="supplierNo">
         <RemoteSelect
-          v-model:value="formData.supplier"
+          v-model:value="formData.supplierNo"
           :api="httpSupplierList"
           placeholder="请选择供应商"
           response-label-prop="name"
@@ -141,6 +160,7 @@ onMounted(() => requestStatementDetail());
       <PurchaseOrder
         :purchase-order-list="purchaseOrderList"
         :supplier-no="statementDetail.supplierNo"
+        :company-no="statementDetail.companyNo"
         :is-show-button="!formDisabled"
         @add-btn-click="handleAddPurchaseOrder"
         @del-btn-click="handleDeletepurchaseOrder"

src/views/purchase/orderRecord/components/new-bill/purchase-order.vue

@@ -1,5 +1,5 @@
 <script setup lang="ts">
-import { watch, computed, onMounted } from "vue";
+import { computed, onMounted, watch } from "vue";
 import { httpCgdList } from "/@/api/purchase/orderRecord";
 import { useResponseHandle } from "/@/hooks";
 
@@ -18,6 +18,9 @@ const props = defineProps({
   supplierNo: {
     type: String
   },
+  companyNo: {
+    type: String
+  },
   isShowButton: {
     type: Boolean
   }
@@ -29,10 +32,10 @@ const responseHandle = useResponseHandle();
 const total = computed(() => props.purchaseOrderList.length);
 
 async function requesetSupplierList() {
-  const { supplierNo } = props;
-  if (!supplierNo) return;
+  const { supplierNo, companyNo } = props;
+  if (!companyNo || !supplierNo) return;
 
-  const { code, data, message } = await httpCgdList({ supplierNo });
+  const { code, data, message } = await httpCgdList({ supplierNo, companyNo });
 
   responseHandle({
     code,
@@ -45,10 +48,15 @@ function handleDelete(row) {
   emit("delBtnClick", row);
 }
 
-//拿到采购单列表(根据supplierNo采购单编号)
 watch(
-  () => props.supplierNo,
-  () => props.supplierNo && requesetSupplierList()
+  () => [props.companyNo, props.supplierNo],
+  () => {
+    if (!props.companyNo || !props.supplierNo) return;
+    requesetSupplierList();
+  },
+  {
+    deep: true
+  }
 );
 
 onMounted(() => requesetSupplierList());

src/views/purchase/orderRecord/components/new-bill/remote-select.vue

@@ -1,79 +0,0 @@
-<script setup lang="ts">
-import { computed, ref, watch } from "vue";
-import { httpList as httpFinanceList } from "/@/api/parameter/finance";
-import { httpList as httpClientList } from "/@/api/parameter/clients";
-import { useResponseHandle } from "/@/hooks";
-
-const props = defineProps({
-  type: {
-    type: String as PropType<"finance" | "clinets">,
-    required: true
-  }
-});
-
-const handle = computed(() => {
-  const { type } = props;
-  return {
-    api: type === "clinets" ? httpClientList : httpFinanceList,
-    placeholder: type === "clinets" ? "请输入企业客户" : "请输入业务公司",
-    requestNameProp: type === "clinets" ? "company" : "companyName",
-    responseNameProp: type === "clinets" ? "companyName" : "companyName",
-    responseValProp: "companyNo"
-  };
-});
-
-const value = ref("");
-const loading = ref(false);
-const list = ref<Array<any>>([]);
-
-const responseHandle = useResponseHandle();
-
-async function remoteMethod(val: string) {
-  if (!val) return;
-
-  loading.value = true;
-  const { code, data, message } = await handle.value.api({
-    [handle.value.requestNameProp]: val
-  });
-
-  responseHandle({
-    code,
-    message,
-    handler: () => {
-      list.value = data.list.map(i => ({
-        label: i[handle.value.responseNameProp],
-        value: i[handle.value.responseValProp]
-      }));
-    }
-  });
-
-  loading.value = false;
-}
-
-watch(
-  () => value,
-  () => {
-    console.log(value.value);
-  }
-);
-</script>
-
-<template>
-  <el-select
-    v-model="value"
-    :remote-method="remoteMethod"
-    :placeholder="handle.placeholder"
-    :loading="loading"
-    reserve-keyword
-    filterable
-    clearable
-    remote
-  >
-    <el-option
-      v-for="opt in list"
-      :key="opt.value"
-      :label="opt.label"
-      :value="opt.value"
-    />
-  </el-select>
-</template>

src/views/purchase/orderRecord/components/new-bill/rules.ts

@@ -1,3 +1,5 @@
 export const rules = {
-  cids: { required: true, trigger: "change", message: "请添加采购单信息" }
+  cids: { required: true, trigger: "change", message: "请添加采购单信息" },
+  companyNo: { required: true, trigger: "change", message: "请选择业务公司" },
+  supplierNo: { required: true, trigger: "change", message: "请选择供应商" }
 };

src/views/purchase/orderRecord/config/content.config.ts

@@ -85,7 +85,7 @@ const columns = [
           size: props.size
         },
         {
-          default: () => statusOptions.find(s => row.status === s.value).label
+          default: () => statusOptions.find(s => row.status === s.value)?.label
         }
       )
   },

src/views/purchase/orderRecord/detail.vue

@@ -3,29 +3,28 @@ import { computed, ref } from "vue";
 import NewBill from "./components/new-bill/index.vue";
 import InitiateAudit from "./components/Initiate-audit/index.vue";
 import BusinessReview from "./components/business-review/index.vue";
-import { useDetail } from "/@/hooks/useDetail";
+import FinancialAudit from "./components/financial-audit/index.vue";
+import { useRoute } from "vue-router";
 
-const { initToDetail, id } = useDetail({
-  path: "/purchase/orderRecordDetail",
-  title: "订单对账详情"
-});
+const { query } = useRoute();
 
-const payNo = computed(() => id as string);
+const payNo = computed(() => query.id as string);
 
 //对账单详情
 const statementDetail = ref<Record<string, string>>({});
 
-//更改订单状态
 function changeStatementDetail(value: Record<string, string>) {
   statementDetail.value = value;
 }
-
-initToDetail();
 </script>
 
 <template>
   <div class="porde__content" bg-white>
-    <NewBill :pay-no="payNo" @change-statement-detail="changeStatementDetail" />
+    <NewBill
+      :pay-no="payNo"
+      :statement-detail="statementDetail"
+      @change-statement-detail="changeStatementDetail"
+    />
 
     <!-- 状态为0 且不是新增 -->
     <InitiateAudit
@@ -34,7 +33,13 @@ initToDetail();
     />
 
     <BusinessReview
-      v-if="payNo"
+      v-if="Number(statementDetail.status) === 1 && payNo"
+      :statement-detail="statementDetail"
+      :pay-no="payNo"
+    />
+
+    <FinancialAudit
+      v-if="Number(statementDetail.status) === 2 && payNo"
       :statement-detail="statementDetail"
       :pay-no="payNo"
     />

src/views/purchase/orderRecord/index.vue

@@ -4,7 +4,6 @@ import { PageSearch, usePageSearch } from "/@/components/PageSearch";
 import { useRouter } from "vue-router";
 import contentConfig from "./config/content.config";
 import searchFormConfig from "./config/search.config";
-import { useDetail } from "/@/hooks/useDetail";
 
 const { pageContentRef, handleSearchClick, handleResetClick } = usePageSearch(
   ({ timer }: any) => ({
@@ -16,16 +15,17 @@ const { pageContentRef, handleSearchClick, handleResetClick } = usePageSearch(
   })
 );
 
-const { toDetail } = useDetail({
-  path: "/purchase/orderRecordDetail",
-  title: "订单对账详情"
-});
 const { push } = useRouter();
 
 const handleCreate = () => push("/purchase/orderRecordDetail");
 
 function handlePreview(item) {
-  toDetail(item.payNo);
+  push({
+    path: "/purchase/orderRecordDetail",
+    query: {
+      id: item.payNo
+    }
+  });
 }
 </script>
 

src/views/purchase/purchPay/component/business-audit/index.vue

@@ -1,30 +1,48 @@
 <script setup lang="ts">
 import { ElForm } from "element-plus";
-import { reactive } from "vue";
-import { audit_rules } from "../../config/rules";
 import { useAudit } from "../../hooks/use-audit";
+import { auditProps } from "../../types";
+
+const props = defineProps(auditProps);
 
 const emit = defineEmits(["changeStatus"]);
 
-const { handleAudit, formRef } = useAudit(() =>
-  emit("changeStatus", formData.status)
-);
-const formData = reactive({
-  status: ""
+const { handleAudit, formRef, rules, formData } = useAudit(props, {
+  successStatus: "2",
+  failStatus: "5",
+  callback: () => emit("changeStatus", formData.status)
 });
 </script>
 <template>
   <h1 text-xl font-bold py-2>业务审核</h1>
-  <el-form ref="formRef" :model="formData" :rules="audit_rules">
-    <el-form-item label="审核状态" prop="status">
-      <div flex justify-between w-full>
-        <el-select placeholder="请选择审核状态" v-model="formData.status">
-          <el-option label="通过" value="2" />
-          <el-option label="不通过" value="5" />
-        </el-select>
+  <el-form
+    ref="formRef"
+    :model="formData"
+    :rules="rules"
+    label-width="100px"
+    flex
+  >
+    <div flex justify-between w-full>
+      <div flex flex-col style="width: 50%">
+        <el-form-item label="审核状态" prop="status">
+          <el-select placeholder="请选择审核状态" v-model="formData.status">
+            <el-option label="通过" value="2" />
+            <el-option label="不通过" value="5" />
+          </el-select>
+        </el-form-item>
 
-        <el-button type="primary" @click="handleAudit">提交审核结果</el-button>
+        <el-form-item label="备注" prop="remark">
+          <el-input
+            type="textarea"
+            placeholder="请输入备注"
+            :rows="12"
+            maxlength="2000"
+            show-word-limit
+            v-model="formData.remark"
+          />
+        </el-form-item>
       </div>
-    </el-form-item>
+      <el-button type="primary" @click="handleAudit">提交审核结果</el-button>
+    </div>
   </el-form>
 </template>

src/views/purchase/purchPay/component/financial-audit/index.vue

@@ -1,30 +1,42 @@
 <script setup lang="ts">
 import { ElForm } from "element-plus";
-import { reactive } from "vue";
-import { audit_rules } from "../../config/rules";
 import { useAudit } from "../../hooks/use-audit";
+import { auditProps } from "../../types";
 
 const emit = defineEmits(["changeStatus"]);
+const props = defineProps(auditProps);
 
-const { handleAudit, formRef } = useAudit(() =>
-  emit("changeStatus", formData.status)
-);
-const formData = reactive({
-  status: ""
+const { handleAudit, formRef, formData, rules } = useAudit(props, {
+  failStatus: "6",
+  successStatus: "3",
+  callback: () => emit("changeStatus", formData.status)
 });
 </script>
 <template>
   <h1 text-xl font-bold py-2>财务审核</h1>
-  <el-form ref="formRef" :model="formData" :rules="audit_rules">
-    <el-form-item label="审核状态" prop="status">
-      <div flex justify-between w-full>
-        <el-select placeholder="请选择审核状态" v-model="formData.status">
-          <el-option label="通过" value="3" />
-          <el-option label="不通过" value="6" />
-        </el-select>
+  <el-form ref="formRef" :model="formData" :rules="rules" label-width="100px">
+    <div flex justify-between w-full>
+      <div flex flex-col style="width: 50%">
+        <el-form-item label="审核状态" prop="status">
+          <el-select placeholder="请选择审核状态" v-model="formData.status">
+            <el-option label="通过" value="3" />
+            <el-option label="不通过" value="6" />
+          </el-select>
+        </el-form-item>
 
-        <el-button type="primary" @click="handleAudit">提交审核结果</el-button>
+        <el-form-item label="备注" prop="remark">
+          <el-input
+            type="textarea"
+            placeholder="请输入备注"
+            :rows="12"
+            maxlength="2000"
+            show-word-limit
+            v-model="formData.remark"
+          />
+        </el-form-item>
       </div>
-    </el-form-item>
+
+      <el-button type="primary" @click="handleAudit">提交审核结果</el-button>
+    </div>
   </el-form>
 </template>

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

@@ -1,18 +1,16 @@
 <script setup lang="ts">
-import { reactive } from "vue";
+import { reactive, ref } from "vue";
 import OrderTable from "./order-table.vue";
-import { create_rules } from "../../config/rules";
-import { useAudit } from "../../hooks/use-audit";
-
-const emit = defineEmits(["createPayment"]);
+import { create_rules } from "../../config/configs";
+import { ElForm } from "element-plus";
 
 defineProps<{
   paymentList: Array<Record<string, string>>;
+  readonly: boolean;
 }>();
 
-const { handleAudit: handleCreate, formRef } = useAudit(() =>
-  emit("createPayment", formData)
-);
+const emit = defineEmits(["createPayment"]);
+const formRef = ref<InstanceType<typeof ElForm>>(null);
 
 const formData = reactive<Record<string, string>>({
   payNo: "",
@@ -22,6 +20,10 @@ const formData = reactive<Record<string, string>>({
 function changePaymentDetail({ payNo }) {
   formData.payNo = payNo;
 }
+
+function handleCreate() {
+  formRef.value.validate(isVaild => isVaild && emit("createPayment", formData));
+}
 </script>
 
 <template>
@@ -32,11 +34,11 @@ function changePaymentDetail({ payNo }) {
         @change-payment-detail="changePaymentDetail"
       />
     </el-form-item>
-    <el-form-item label="付款金额" prop="pay_fee">
+    <el-form-item label="付款金额" prop="pay_fee" v-if="readonly">
       <el-input placeholder="请输入付款金额" v-model="formData.pay_fee" />
     </el-form-item>
 
-    <el-form-item pl-20>
+    <el-form-item pl-20 v-if="readonly">
       <el-button type="primary" @click="handleCreate">保存</el-button>
     </el-form-item>
   </el-form>

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

@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { ref } from "vue";
-import { columns } from "../../config/columns";
+import { columns } from "../../config/configs";
 import { ElTable } from "element-plus";
 
 defineProps<{
@@ -21,7 +21,6 @@ function handleCurrentChange(value) {
     ref="tableRef"
     row-key="id"
     :data="paymentList"
-    v-loading="!paymentList.length"
     highlight-current-row
     @current-change="handleCurrentChange"
   >

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

@@ -1,17 +1,31 @@
 <script setup lang="ts">
 import { ElForm, ElMessage, UploadProps } from "element-plus";
-import { reactive, ref } from "vue";
-import { receipt_rules } from "../../config/rules";
+import { computed, reactive, ref } from "vue";
+import { receipt_rules } from "../../config/configs";
+import { httpImageUpload, baseUrl } from "/@/api/other";
+import { useResponseHandle } from "/@/hooks";
+import { useUserStore } from "/@/store/modules/user";
+
+defineProps<{
+  disabled: boolean;
+}>();
+
+console.log(baseUrl);
 
 const emit = defineEmits(["changeStatus"]);
 
 const formData = reactive({
-  return_image: "http://www.baidu.com",
-  retunr_time: ""
+  return_image: "",
+  return_time: ""
 });
 
 const types = ["image/png", "image/jpg", "image/bmp", "image/jpeg"];
+
 const formRef = ref<InstanceType<typeof ElForm>>(null);
+const responseHandle = useResponseHandle();
+const userStore = useUserStore();
+
+const imageSrc = computed(() => baseUrl + "/" + formData.return_image);
 
 const onBeforeReturnImageUpload: UploadProps["beforeUpload"] = ({
   type,
@@ -22,16 +36,29 @@ const onBeforeReturnImageUpload: UploadProps["beforeUpload"] = ({
     return false;
   }
 
-  if (size / 1024 > 1) {
+  if (size / 1024 / 1024 > 1) {
     ElMessage.error("图片大小超过1M");
     return false;
   }
 };
 
+const handleRequeset: UploadProps["httpRequest"] = async ({ file }) => {
+  const _formData = new FormData();
+  _formData.append("img", file);
+  _formData.append("token", userStore.token);
+  const { message, code, data } = await httpImageUpload(_formData);
+
+  responseHandle({
+    message,
+    code,
+    handler: () => (formData.return_image = data[0].url)
+  });
+};
+
 //付款回执 状态为4
 function handlePaymentReceipt() {
   formRef.value.validate(isValid => {
-    if (isValid) emit("changeStatus", "5", formData);
+    if (isValid) emit("changeStatus", "4", formData);
   });
 }
 </script>
@@ -41,14 +68,25 @@ function handlePaymentReceipt() {
   <el-form ref="formRef" :model="formData" :rules="receipt_rules">
     <el-form-item label="回执图片" prop="return_image">
       <div>
-        <el-upload class="upload" :before-upload="onBeforeReturnImageUpload">
-          <div class="icon" />
+        <el-upload
+          class="upload"
+          :before-upload="onBeforeReturnImageUpload"
+          :http-request="handleRequeset"
+          :show-file-list="false"
+        >
+          <img class="avatar" v-if="formData.return_image" :src="imageSrc" />
+          <div class="text" v-else>点击上传</div>
         </el-upload>
         <span>大小:小于1M; 尺寸:100*100; 类型:jpg.png.bmp.jpeg</span>
       </div>
     </el-form-item>
+
     <el-form-item label="回执时间" prop="return_time">
-      <el-date-picker type="datetime" v-model="formData.retunr_time" />
+      <el-date-picker
+        type="datetime"
+        v-model="formData.return_time"
+        placeholder="请输入回执时间"
+      />
     </el-form-item>
 
     <el-form-item w-full flex justify-end>
@@ -64,12 +102,24 @@ function handlePaymentReceipt() {
   display: block;
   border: 1px dashed var(--el-border-color);
 
-  .icon {
+  .text {
     font-size: 28px;
     color: #8c939d;
     width: 178px;
     height: 178px;
     text-align: center;
+    font-size: 22px;
+    line-height: 178px;
+  }
+
+  &:hover {
+    border-color: var(--el-color-primary);
+  }
+
+  .avatar {
+    width: 178px;
+    height: 178px;
+    display: block;
   }
 }
 </style>

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

@@ -1,49 +0,0 @@
-export const columns = [
-  {
-    label: "对账编号",
-    prop: "payNo",
-    minWidth: 180,
-    align: "left"
-  },
-  {
-    label: "供应商编号",
-    prop: "supplierNo",
-    minWidth: 180,
-    align: "left"
-  },
-  {
-    label: "供应商名称",
-    prop: "supplierName",
-    minWidth: 180,
-    align: "left"
-  },
-  {
-    label: "业务公司名称",
-    prop: "companyName",
-    minWidth: 180
-  },
-  {
-    label: "总额款",
-    prop: "total_fee",
-    minWidth: 180,
-    align: "total_fee"
-  },
-  {
-    label: "已付款金额",
-    prop: "apay_fee",
-    minWidth: 180,
-    align: "left"
-  },
-  {
-    label: "已回票金额",
-    prop: "ainv_fee",
-    minWidth: 180,
-    align: "left"
-  },
-  {
-    label: "未回票金额",
-    prop: "winv_fee",
-    minWidth: 180,
-    align: "left"
-  }
-];

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

@@ -4,7 +4,7 @@ import { httpList, httpDelete } from "/@/api/purchase/orderPay";
 import dayjs from "dayjs";
 import { h } from "vue";
 import { ElTag } from "element-plus";
-import { paymentOptions } from "./options";
+import { paymentOptions } from "./configs";
 
 const columns = [
   {

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

@@ -1,57 +0,0 @@
-export const statusOptions = [
-  {
-    label: "待发起流程",
-    value: "0"
-  },
-  {
-    label: "待采购审核",
-    value: "1"
-  },
-  {
-    label: "待财务审核",
-    value: "2"
-  },
-  {
-    label: "审核成功",
-    value: "3"
-  },
-  {
-    label: "采购驳回",
-    value: "4"
-  },
-  {
-    label: "财务驳回",
-    value: "5"
-  }
-];
-
-export const paymentOptions = [
-  {
-    label: "待发起",
-    value: "0"
-  },
-  {
-    label: "待业务审核",
-    value: "1"
-  },
-  {
-    label: "待财务审核",
-    value: "2"
-  },
-  {
-    label: "3待付款回执",
-    value: "3"
-  },
-  {
-    label: "付款回执",
-    value: "4"
-  },
-  {
-    label: "业务驳回",
-    value: "5"
-  },
-  {
-    label: "财务驳回",
-    value: "6"
-  }
-];

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

@@ -1,17 +0,0 @@
-export const create_rules = {
-  pay_fee: [{ required: true, trigger: "change", message: "请输入付款金额" }],
-  payNo: [{ required: true, trigger: "change", message: "请选择付款订单" }]
-};
-
-export const audit_rules = {
-  status: [{ required: true, trigger: "change", message: "请选择审核状态" }]
-};
-
-export const receipt_rules = {
-  return_image: [
-    { required: true, trigger: "change", message: "请选择上传回执图片" }
-  ],
-  return_time: [
-    { required: true, trigger: "change", message: "请选择上传回执时间" }
-  ]
-};

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

@@ -1,5 +1,5 @@
+import { statusOptions } from "./configs";
 import { FormConfig } from "/@/components/PageSearch";
-import { statusOptions } from "./options";
 
 const searchFormConfig: FormConfig = {
   formItems: [

src/views/purchase/purchPay/detail.vue

@@ -1,4 +1,5 @@
 <script setup lang="ts">
+import { computed, onMounted, ref } from "vue";
 import NewPayment from "./component/new-payment/index.vue";
 import InitiateAudit from "./component/Initiate-audit/index.vue";
 import BusinessAudit from "./component/business-audit/index.vue";
@@ -7,26 +8,36 @@ import PaymentReceipt from "./component/payment-receipt/index.vue";
 import { httpStatus, httpAdd } from "/@/api/purchase/orderPay";
 import { useResponseHandle } from "/@/hooks";
 import { useRoute, useRouter } from "vue-router";
-import { computed, onMounted, ref } from "vue";
 import { httpList } from "/@/api/purchase/orderRecord";
-
-/***
- * TODO:详情后续要传入payNo 根据PayNo拿到采购付款申请的详情 根据详情反查采购单
- */
+import { useShowAudit } from "./hooks/use-show-audit";
 
 const responseHandle = useResponseHandle();
 const { push } = useRouter();
 const { query } = useRoute();
 
 const payNo = computed(() => query.id as string);
+const isCreate = computed(() => !payNo.value);
 const paymentList = ref<Array<Record<string, string>>>([]);
+const paymentDetail = ref<Record<string, string>>({});
 const handler = () => push("/purchase/purchPay");
 
+//状态
+const status = computed(() =>
+  paymentDetail.value ? Number(paymentDetail.value.status) : 0
+);
+
+const {
+  showInitiateAudit,
+  showBusinessAudit,
+  showFinancialAudit,
+  showPaymentReceipt
+} = useShowAudit(status, isCreate);
+
 const paymentTitle = computed(() =>
-  payNo.value ? "采购付款申请详情" : "新建采购付款订单"
+  isCreate.value ? "新建采购付款订单" : "采购付款申请详情"
 );
 
-//初始化采购(详情)
+//初始化采购
 async function requestPaymentList() {
   const { code, message, data } = await httpList({
     ...(payNo.value ? { payNo: payNo.value } : {})
@@ -35,7 +46,10 @@ async function requestPaymentList() {
   responseHandle({
     code,
     message,
-    handler: () => (paymentList.value = data.list)
+    handler: () => {
+      paymentList.value = data.list;
+      paymentDetail.value = data.list[0];
+    }
   });
 }
 
@@ -57,6 +71,8 @@ async function requestStatusPayment(
   });
 }
 
+// requestStatusPayment("0");
+
 //请求创建付款订单
 async function requesetCreatePayment(data: Record<string, string>) {
   const { code, message } = await httpAdd(data);
@@ -77,16 +93,38 @@ onMounted(() => requestPaymentList());
     <!-- 创建采购付款订单 -->
     <NewPayment
       :paymentList="paymentList"
+      :readonly="isCreate"
       @create-payment="requesetCreatePayment"
     />
+
     <!-- 发起审核 状态1 -->
-    <InitiateAudit @change-status="requestStatusPayment" />
+    <InitiateAudit
+      v-if="showInitiateAudit"
+      @change-status="requestStatusPayment"
+    />
+
     <!-- 业务审核 状态2 -->
-    <BusinessAudit @change-status="requestStatusPayment" />
+    <BusinessAudit
+      v-if="showBusinessAudit"
+      :disabled="status > 1"
+      :detail="paymentDetail"
+      @change-status="requestStatusPayment"
+    />
+
     <!-- 财务审核 状态3 -->
-    <FinancialAudit @change-status="requestStatusPayment" />
+    <FinancialAudit
+      v-if="showFinancialAudit"
+      :disabled="status > 2"
+      :detail="paymentDetail"
+      @change-status="requestStatusPayment"
+    />
+
     <!-- 付款回执 状态4 -->
-    <PaymentReceipt @change-status="requestStatusPayment" />
+    <PaymentReceipt
+      v-if="showPaymentReceipt"
+      :disabled="status > 3"
+      @change-status="requestStatusPayment"
+    />
   </div>
 </template>
 

src/views/purchase/purchPay/hooks/use-audit.ts

@@ -1,17 +1,61 @@
-import { ElForm } from "element-plus";
-import { ref } from "vue";
+import { ElForm, FormRules } from "element-plus";
+import { reactive, ref, watch } from "vue";
+import { AuditProps } from "../types";
 
-export function useAudit(callback: () => void) {
+type Config = {
+  failStatus: string;
+  successStatus: string;
+  callback: () => void;
+};
+
+export function useAudit(
+  props: AuditProps,
+  { failStatus, successStatus, callback }: Config
+) {
   const formRef = ref<InstanceType<typeof ElForm>>(null);
 
+  let status = "";
+  const remark = props.detail ? props.detail.remark : "";
+
+  if (props.detail) {
+    const _status = Number(props.detail.status);
+
+    if (_status !== Number(successStatus) && _status !== Number(failStatus))
+      status = successStatus;
+    else status = String(_status);
+  }
+
+  const formData = reactive({
+    status,
+    remark
+  });
+
+  const rules = reactive<FormRules>({
+    status: [{ required: true, trigger: "change", message: "请选择审核状态" }],
+    remark: [{ required: false, trigger: "change", message: "请选择审核状态" }]
+  });
+
   function handleAudit() {
     formRef.value.validate(isValid => {
       if (isValid) callback();
     });
   }
 
+  watch(
+    () => formData,
+    () => {
+      console.log(formData.status === failStatus);
+      rules.remark[0].required = formData.status === failStatus;
+    },
+    {
+      deep: true
+    }
+  );
+
   return {
+    rules,
     formRef,
+    formData,
     handleAudit
   };
 }

src/views/purchase/ticketReturn/components/create-ticket-dialog.vue

@@ -1,10 +1,11 @@
 <script setup lang="ts">
 import { ElForm, ElInput, ElMessage, UploadProps } from "element-plus";
-import { ticketAddRules } from "../config/rules";
-import { ticketFormItems } from "../config/form-items";
+import { ticketFormItems, ticketAddRules } from "../config/configs";
 import { computed, ref, watch } from "vue";
 import { httpAdd } from "/@/api/purchase/ticketReturn";
 import { useResponseHandle } from "/@/hooks";
+import { httpImageUpload, baseUrl } from "/@/api/other";
+import { useUserStore } from "/@/store/modules/user";
 
 const visible = ref(false);
 //支持的图片格式
@@ -30,6 +31,9 @@ const formItems = computed(() => ticketFormItems[invType.value] || []);
 const showScanInput = computed(() => invType.value === "1");
 const scanInputValue = ref("");
 const rules = ref({ ...ticketAddRules });
+const userStore = useUserStore();
+
+const imageUrl = computed(() => baseUrl + "/" + formData.value.inv_img);
 
 //图片上传前判断类型大小尺寸
 const onBeforeReturnImageUpload: UploadProps["beforeUpload"] = ({
@@ -41,7 +45,7 @@ const onBeforeReturnImageUpload: UploadProps["beforeUpload"] = ({
     return false;
   }
 
-  if (size / 1024 > 1) {
+  if (size / 1024 / 1024 > 1) {
     ElMessage.error("图片大小超过1M");
     return false;
   }
@@ -95,6 +99,23 @@ function handleScanKeydown(evt: KeyboardEvent) {
   scanInputValue.value = "";
 }
 
+const handleRequeset: UploadProps["httpRequest"] = async ({ file }) => {
+  const _formData = new FormData();
+  _formData.append("img", file);
+  _formData.append("token", userStore.token);
+  const { message, code, data } = await httpImageUpload(_formData);
+
+  responseHandle({
+    message,
+    code,
+    handler: () => {
+      const { url, name } = data[0];
+      formData.value.inv_img = url;
+      formData.value.invName = name;
+    }
+  });
+};
+
 watch(
   () => formItems.value,
   newVal => {
@@ -148,8 +169,11 @@ defineExpose({
             <el-upload
               class="upload"
               :before-upload="onBeforeReturnImageUpload"
+              :http-request="handleRequeset"
+              :show-file-list="false"
             >
-              <div class="icon" />
+              <img class="avatar" :src="imageUrl" v-if="formData[item.prop]" />
+              <div class="text" v-else>点击上传</div>
             </el-upload>
             <span>大小:小于1M; 尺寸:100*100; 类型:jpg.png.bmp.jpeg</span>
           </div>
@@ -191,6 +215,13 @@ defineExpose({
     text-align: center;
   }
 
+  .text {
+    font-size: 28px;
+    line-height: 178px;
+    width: 178px;
+    text-align: center;
+  }
+
   &:hover {
     border-color: #409eff;
   }

src/views/purchase/ticketReturn/components/payment-table.vue

@@ -1,6 +1,6 @@
 <script setup lang="ts">
 import { onMounted, ref } from "vue";
-import { purchase_columns } from "../config/columns";
+import { purchase_columns } from "../config/configs";
 import { ElTable } from "element-plus";
 import { useResponseHandle } from "/@/hooks";
 import { httpList } from "/@/api/purchase/orderRecord";

src/views/purchase/ticketReturn/config/columns.ts

@@ -1,83 +0,0 @@
-export const purchase_columns = [
-  {
-    label: "对账编号",
-    prop: "payNo",
-    minWidth: 180,
-    align: "left"
-  },
-  {
-    label: "供应商编号",
-    prop: "supplierNo",
-    minWidth: 180,
-    align: "left"
-  },
-  {
-    label: "供应商名称",
-    prop: "supplierName",
-    minWidth: 180,
-    align: "left"
-  },
-  {
-    label: "业务公司名称",
-    prop: "companyName",
-    minWidth: 180
-  },
-  {
-    label: "总额款",
-    prop: "total_fee",
-    minWidth: 180,
-    align: "total_fee"
-  },
-  {
-    label: "已付款金额",
-    prop: "apay_fee",
-    minWidth: 180,
-    align: "left"
-  },
-  {
-    label: "已回票金额",
-    prop: "ainv_fee",
-    minWidth: 180,
-    align: "left"
-  },
-  {
-    label: "未回票金额",
-    prop: "winv_fee",
-    minWidth: 180,
-    align: "left"
-  }
-];
-
-export const ticket_columns = [
-  {
-    label: "发票申请类型",
-    prop: "invType",
-    width: 180
-  },
-  {
-    label: "发票号码",
-    prop: "invNumber",
-    width: 180
-  },
-  {
-    label: "发票代码",
-    prop: "invCode",
-    width: 180
-  },
-  {
-    label: "发票金额",
-    type: "inv_fee"
-  },
-  {
-    label: "验票方式",
-    prop: "xxx"
-  },
-  {
-    label: "失败原因",
-    prop: "rason"
-  },
-  {
-    label: "开票时间",
-    prop: "open_time"
-  }
-];

src/views/purchase/ticketReturn/config/content.config.ts

@@ -3,7 +3,8 @@ import { httpList } from "/@/api/purchase/ticketReturn";
 
 import dayjs from "dayjs";
 import { h } from "vue";
-import { ElImage } from "element-plus";
+import { ElImage, ElTag } from "element-plus";
+import { status_options } from "./configs";
 
 const columns = [
   {
@@ -40,7 +41,17 @@ const columns = [
   {
     label: "状态",
     prop: "status",
-    width: 120
+    width: 120,
+    cellRenderer: ({ row, props }) =>
+      h(
+        ElTag,
+        {
+          size: props.size
+        },
+        {
+          default: () => status_options.find(s => row.status === s.value).label
+        }
+      )
   },
   {
     label: "联系人",

src/views/purchase/ticketReturn/config/form-items.ts

@@ -1,36 +0,0 @@
-export const ticketFormItems = {
-  //手工开票
-  "1": [
-    {
-      label: "发票类型",
-      prop: "invName"
-    },
-    {
-      label: "发票代码",
-      prop: "invCode"
-    },
-    {
-      label: "发票号码",
-      prop: "invNumber"
-    },
-    {
-      label: "金额",
-      prop: "gold"
-    },
-    {
-      label: "校验码",
-      prop: "checkNumber"
-    },
-    {
-      label: "开票日期",
-      prop: "open_time"
-    }
-  ],
-  //ocr识别
-  "2": [
-    {
-      label: "发票图片",
-      prop: "inv_img"
-    }
-  ]
-};

src/views/purchase/ticketReturn/config/rules.ts

@@ -1,60 +0,0 @@
-import { FormRules } from "element-plus";
-
-export const ticketAddRules: FormRules = {
-  invType: [
-    {
-      trigger: "blur",
-      message: "请选择申请类型",
-      required: true
-    }
-  ],
-  invNumber: [
-    {
-      trigger: "blur",
-      message: "请输入发票代码",
-      required: true
-    }
-  ],
-  invCode: [
-    {
-      trigger: "blur",
-      message: "请选择发票编码",
-      required: true
-    }
-  ],
-  checkNumber: [
-    {
-      trigger: "blur",
-      message: "请选择校验码",
-      required: true
-    }
-  ],
-  open_time: [
-    {
-      trigger: "blur",
-      message: "请选择开票时间",
-      required: true
-    }
-  ],
-  inv_img: [
-    {
-      trigger: "blur",
-      message: "请上传开票图片",
-      required: true
-    }
-  ],
-  invName: [
-    {
-      trigger: "blur",
-      message: "请输入发票名称",
-      required: true
-    }
-  ],
-  gold: [
-    {
-      trigger: "blur",
-      message: "请选择金额",
-      required: true
-    }
-  ]
-};

src/views/purchase/ticketReturn/index.vue

@@ -4,15 +4,15 @@ import { PageSearch, usePageSearch } from "/@/components/PageSearch";
 import { PageContent } from "/@/components/PageContent";
 import searchFormConfig from "./config/search.config";
 import contentConfig from "./config/content.config";
-import modalConfig from "./config/modal.config";
 import PaymentListDialog from "./components/payment-list-dialog.vue";
-import { usePageModal, PageModal } from "/@/components/PageModal";
+import { useRouter } from "vue-router";
 
 defineOptions({
   name: "finance"
 });
 
 const PaymentDialog = ref<InstanceType<typeof PaymentListDialog>>(null);
+const { push } = useRouter();
 
 function searchCallback({ timer }: any) {
   const [start, end] = timer;
@@ -25,13 +25,18 @@ function searchCallback({ timer }: any) {
 const { pageContentRef, handleResetClick, handleSearchClick } =
   usePageSearch(searchCallback);
 
-const { handlePreviewData, pageModalRef, defaultInfo } = usePageModal({
-  pageContentRef
-});
-
 function handleCreate() {
   PaymentDialog.value.onDisplay();
 }
+
+function toDetail({ hpNo }) {
+  push({
+    path: "/purchase/ticketReturnDetail",
+    query: {
+      id: hpNo
+    }
+  });
+}
 </script>
 
 <template>
@@ -43,7 +48,7 @@ function handleCreate() {
     />
     <PageContent
       ref="pageContentRef"
-      @preview-btn-click="handlePreviewData"
+      @preview-btn-click="toDetail"
       :content-config="contentConfig"
     >
       <template #create>
@@ -53,12 +58,6 @@ function handleCreate() {
 
     <!-- 展示对账列表数据 根据对账列表payNo创建采购回单数据 -->
     <PaymentListDialog ref="PaymentDialog" />
-
-    <PageModal
-      ref="pageModalRef"
-      :default-info="defaultInfo"
-      :modal-config="modalConfig"
-    />
   </div>
 </template>
 

src/views/system/menuOperator/index.vue

@@ -23,6 +23,7 @@ onMounted(() => {
       @create="handleAddChangeCheck"
       @view="handleAddChangeCheck"
     />
+
     <EditModel ref="modelRef" @reload="actionTableRef.onSearch()" />
   </div>
 </template>