修复订单商品页面

src/views/shop/shopOrder/components/bszxPayEdit.vue

@@ -1,249 +0,0 @@
-<!-- 编辑弹窗 -->
-<template>
-  <ele-modal
-    :width="800"
-    :visible="visible"
-    :maskClosable="false"
-    :maxable="maxable"
-    :title="isUpdate ? '编辑捐款记录' : '添加捐款记录'"
-    :body-style="{ paddingBottom: '28px' }"
-    @update:visible="updateVisible"
-    @ok="save"
-  >
-    <a-form
-      ref="formRef"
-      :model="form"
-      :rules="rules"
-      :label-col="styleResponsive ? { md: 4, sm: 5, xs: 24 } : { flex: '90px' }"
-      :wrapper-col="
-        styleResponsive ? { md: 19, sm: 19, xs: 24 } : { flex: '1' }
-      "
-    >
-      <a-form-item label="年龄" name="age">
-        <a-input
-          allow-clear
-          placeholder="请输入年龄"
-          v-model:value="form.age"
-        />
-      </a-form-item>
-      <a-form-item label="姓名" name="name">
-        <a-input
-          allow-clear
-          placeholder="请输入姓名"
-          v-model:value="form.name"
-        />
-      </a-form-item>
-      <a-form-item label="性别 1男 2女" name="sex">
-        <a-input
-          allow-clear
-          placeholder="请输入性别 1男 2女"
-          v-model:value="form.sex"
-        />
-      </a-form-item>
-      <a-form-item label="手机号码" name="phone">
-        <a-input
-          allow-clear
-          placeholder="请输入手机号码"
-          v-model:value="form.phone"
-        />
-      </a-form-item>
-      <a-form-item label="班级" name="className">
-        <a-input
-          allow-clear
-          placeholder="请输入班级"
-          v-model:value="form.className"
-        />
-      </a-form-item>
-      <a-form-item label="年级" name="gradeName">
-        <a-input
-          allow-clear
-          placeholder="请输入年级"
-          v-model:value="form.gradeName"
-        />
-      </a-form-item>
-      <a-form-item label="居住地址" name="address">
-        <a-input
-          allow-clear
-          placeholder="请输入居住地址"
-          v-model:value="form.address"
-        />
-      </a-form-item>
-      <a-form-item label="工作单位" name="workUnit">
-        <a-input
-          allow-clear
-          placeholder="请输入工作单位"
-          v-model:value="form.workUnit"
-        />
-      </a-form-item>
-      <a-form-item label="职务" name="position">
-        <a-input
-          allow-clear
-          placeholder="请输入职务"
-          v-model:value="form.position"
-        />
-      </a-form-item>
-      <a-form-item label="捐赠证书" name="certificate">
-        <a-input
-          allow-clear
-          placeholder="请输入捐赠证书"
-          v-model:value="form.certificate"
-        />
-      </a-form-item>
-      <a-form-item label="排序(数字越小越靠前)" name="sortNumber">
-        <a-input-number
-          :min="0"
-          :max="9999"
-          class="ele-fluid"
-          placeholder="请输入排序号"
-          v-model:value="form.sortNumber"
-        />
-      </a-form-item>
-      <a-form-item label="备注" name="comments">
-        <a-textarea
-          :rows="4"
-          :maxlength="200"
-          placeholder="请输入描述"
-          v-model:value="form.comments"
-        />
-      </a-form-item>
-      <a-form-item label="状态" name="status">
-        <a-radio-group v-model:value="form.status">
-          <a-radio :value="0">显示</a-radio>
-          <a-radio :value="1">隐藏</a-radio>
-        </a-radio-group>
-      </a-form-item>
-    </a-form>
-  </ele-modal>
-</template>
-
-<script lang="ts" setup>
-  import { ref, reactive, watch } from 'vue';
-  import { Form, message } from 'ant-design-vue';
-  import { assignObject, uuid } from 'ele-admin-pro';
-  import { addBszxPay, updateBszxPay } from '@/api/bszx/bszxPay';
-  import { BszxPay } from '@/api/bszx/bszxPay/model';
-  import { useThemeStore } from '@/store/modules/theme';
-  import { storeToRefs } from 'pinia';
-  import { ItemType } from 'ele-admin-pro/es/ele-image-upload/types';
-  import { FormInstance } from 'ant-design-vue/es/form';
-  import { FileRecord } from '@/api/system/file/model';
-
-  // 是否是修改
-  const isUpdate = ref(false);
-  const useForm = Form.useForm;
-  // 是否开启响应式布局
-  const themeStore = useThemeStore();
-  const { styleResponsive } = storeToRefs(themeStore);
-
-  const props = defineProps<{
-    // 弹窗是否打开
-    visible: boolean;
-    // 修改回显的数据
-    data?: BszxPay | null;
-  }>();
-
-  const emit = defineEmits<{
-    (e: 'done'): void;
-    (e: 'update:visible', visible: boolean): void;
-  }>();
-
-  // 提交状态
-  const loading = ref(false);
-  // 是否显示最大化切换按钮
-  const maxable = ref(true);
-  // 表格选中数据
-  const formRef = ref<FormInstance | null>(null);
-  const images = ref<ItemType[]>([]);
-
-  // 用户信息
-  const form = reactive<BszxPay>({
-    id: undefined,
-    age: undefined,
-    name: undefined,
-    sex: undefined,
-    phone: undefined,
-    className: undefined,
-    gradeName: undefined,
-    address: undefined,
-    workUnit: undefined,
-    position: undefined,
-    number: undefined,
-    extra: undefined,
-    dateTime: undefined,
-    certificate: undefined,
-    formData: undefined,
-    formId: undefined,
-    userId: undefined,
-    comments: undefined,
-    status: undefined,
-    deleted: undefined,
-    tenantId: undefined,
-    createTime: undefined,
-    sortNumber: 100
-  });
-
-  /* 更新visible */
-  const updateVisible = (value: boolean) => {
-    emit('update:visible', value);
-  };
-
-  // 表单验证规则
-  const rules = reactive({
-    appBszxPayName: [
-      {
-        required: true,
-        type: 'string',
-        message: '请填写应用-百色中学-捐款记录名称',
-        trigger: 'blur'
-      }
-    ]
-  });
-
-  const { resetFields } = useForm(form, rules);
-
-  /* 保存编辑 */
-  const save = () => {
-    if (!formRef.value) {
-      return;
-    }
-    formRef.value
-      .validate()
-      .then(() => {
-        loading.value = true;
-        const formData = {
-          ...form
-        };
-        const saveOrUpdate = isUpdate.value ? updateBszxPay : addBszxPay;
-        saveOrUpdate(formData)
-          .then((msg) => {
-            loading.value = false;
-            message.success(msg);
-            updateVisible(false);
-            emit('done');
-          })
-          .catch((e) => {
-            loading.value = false;
-            message.error(e.message);
-          });
-      })
-      .catch(() => {});
-  };
-
-  watch(
-    () => props.visible,
-    (visible) => {
-      if (visible) {
-        images.value = [];
-        if (props.data) {
-          assignObject(form, props.data);
-          isUpdate.value = true;
-        } else {
-          isUpdate.value = false;
-        }
-      } else {
-        resetFields();
-      }
-    },
-    { immediate: true }
-  );
-</script>

src/views/shop/shopOrder/components/orderInfo.vue

@@ -97,7 +97,7 @@
               已核销
             </a-tooltip>
           </a-tag>
-          <a-tag v-if="form.deliveryStatus == 30" color="bule">部分核销</a-tag>
+          <a-tag v-if="form.deliveryStatus == 30" color="blue">部分核销</a-tag>
         </a-descriptions-item>
         <!-- 第五排-->
         <a-descriptions-item
@@ -178,6 +178,13 @@
                 <IdcardOutlined class="tag-icon"/>
                 IC季卡
               </a-tag>
+              <a-tag v-if="form.payType == 18">
+                <IdcardOutlined class="tag-icon"/>
+                代付
+              </a-tag>
+            </template>
+            <template v-else>
+              <span class="text-gray-400">未支付</span>
             </template>
           </a-tooltip>
         </a-descriptions-item>
@@ -219,7 +226,7 @@
     <a-card class="order-card" :bordered="false">
       <a-spin :spinning="loading">
         <a-table
-          :data-source="orderInfo"
+          :data-source="orderGoods"
           :columns="columns"
           :pagination="false"
         />
@@ -236,13 +243,16 @@ import {ColumnItem} from 'ele-admin-pro/es/ele-pro-table/types';
 import {
   CheckOutlined,
   CloseOutlined,
-  CoffeeOutlined
+  CoffeeOutlined,
+  WechatOutlined,
+  AlipayCircleOutlined,
+  IdcardOutlined
 } from '@ant-design/icons-vue';
 import {ShopOrder} from '@/api/shop/shopOrder/model';
 import {BszxPay} from '@/api/bszx/bszxPay/model';
-import {pageBszxPay} from '@/api/bszx/bszxPay';
 import {toDateString} from 'ele-admin-pro';
 import {copyText} from "@/utils/common";
+import {listShopOrderGoods} from "@/api/shop/shopOrderGoods";
 
 const useForm = Form.useForm;
 
@@ -264,7 +274,7 @@ const isUpdate = ref(false);
 // 是否显示最大化切换按钮
 const maxAble = ref(true);
 // 订单信息
-const orderInfo = ref<BszxPay[]>([]);
+const orderGoods = ref<BszxPay[]>([]);
 
 // 步骤条
 const steps = ref<step[]>([
@@ -447,15 +457,26 @@ const updateVisible = (value: boolean) => {
 const columns = ref<ColumnItem[]>([
   {
     title: '商品名称',
-    dataIndex: 'formName',
-    key: 'formName',
+    dataIndex: 'goodsName',
+    key: 'goodsName',
     align: 'center',
     width: 280
   },
   {
     title: '金额',
     dataIndex: 'price',
-    align: 'center'
+    align: 'center',
+    customRender: ({ record }) => {
+      return `￥${record.price || 0}`;
+    }
+  },
+  {
+    title: '数量',
+    dataIndex: 'quantity',
+    align: 'center',
+    customRender: ({ record }) => {
+      return record.quantity || 1;
+    }
   },
   {
     title: '备注',
@@ -464,9 +485,12 @@ const columns = ref<ColumnItem[]>([
     align: 'center'
   },
   {
-    title: '操作',
+    title: '是否免费',
     dataIndex: 'isFree',
-    align: 'center'
+    align: 'center',
+    customRender: ({ record }) => {
+      return record.isFree ? '是' : '否';
+    }
   }
 ]);
 
@@ -532,7 +556,7 @@ const loadSteps = (order) => {
 // const getOrderInfo = () => {
 //   const orderId = props.data?.orderId;
 //   listOrderInfo({ orderId }).then((data) => {
-//     orderInfo.value = data.filter((d) => d.totalNum > 0);
+//     orderGoods.value = data.filter((d) => d.totalNum > 0);
 //   });
 // };
 
@@ -547,16 +571,29 @@ watch(
       if (props.data) {
         loading.value = true;
         assignObject(form, props.data);
-        pageBszxPay({orderNo: form.orderNo}).then((res) => {
-          if (res?.list) {
-            orderInfo.value = res?.list;
-          }
+
+        // 加载订单商品
+        if (form.orderId) {
+          listShopOrderGoods({orderId: form.orderId})
+            .then((data) => {
+              orderGoods.value = data || [];
+            })
+            .catch((error) => {
+              console.error('加载订单商品失败:', error);
+              orderGoods.value = [];
+            })
+            .finally(() => {
+              loading.value = false;
+            });
+        } else {
           loading.value = false;
-        });
+        }
+
         loadSteps(props.data);
       }
     } else {
       resetFields();
+      orderGoods.value = [];
     }
   }
 );

src/views/shop/shopOrder/index.vue

@@ -1,8 +1,5 @@
 <template>
   <a-page-header :title="getPageTitle()" @back="() => $router.go(-1)">
-    <template #extra>
-      <Extra/>
-    </template>
     <a-card :bordered="false" :body-style="{ padding: '16px' }">
       <ele-pro-table
         ref="tableRef"
@@ -106,12 +103,9 @@ import type {
 } from 'ele-admin-pro/es/ele-pro-table/types';
 import Search from './components/search.vue';
 import {getPageTitle} from "@/utils/common";
-import Extra from "@/views/bszx/extra.vue";
-import {pageBszxOrder} from "@/api/bszx/bszxOrder";
 import OrderInfo from './components/orderInfo.vue';
 import {ShopOrder, ShopOrderParam} from "@/api/shop/shopOrder/model";
-import {repairOrder, updateShopOrder} from "@/api/shop/shopOrder";
-import {message} from "ant-design-vue";
+import {pageShopOrder, repairOrder} from "@/api/shop/shopOrder";
 import {updateUser} from "@/api/system/user";
 import {getPayType} from '@/utils/shop';
 
@@ -140,7 +134,7 @@ const datasource: DatasourceFunction = ({
   if (filters) {
     where.status = filters.status;
   }
-  return pageBszxOrder({
+  return pageShopOrder({
     ...where,
     ...orders,
     page,
@@ -157,18 +151,6 @@ const columns = ref<ColumnItem[]>([
     align: 'center',
     width: 200,
   },
-  {
-    title: '姓名',
-    dataIndex: 'realName',
-    key: 'realName',
-    align: 'center'
-  },
-  {
-    title: '手机号码',
-    dataIndex: 'phone',
-    key: 'phone',
-    align: 'center'
-  },
   {
     title: '实付金额',
     dataIndex: 'payPrice',