|
@@ -0,0 +1,253 @@
|
|
|
|
|
+<script lang="ts" setup>
|
|
|
|
|
+import { computed, ref } from 'vue';
|
|
|
|
|
+
|
|
|
|
|
+import { useVbenModal } from '@vben/common-ui';
|
|
|
|
|
+
|
|
|
|
|
+import { ElTag } from 'element-plus';
|
|
|
|
|
+
|
|
|
|
|
+import { getCoupon2DetailApi } from '#/api/coupon/coupon2';
|
|
|
|
|
+
|
|
|
|
|
+const data = ref<any>(null);
|
|
|
|
|
+const loading = ref(false);
|
|
|
|
|
+
|
|
|
|
|
+// 申请人信息
|
|
|
|
|
+const applicantInfo = computed(() => {
|
|
|
|
|
+ if (!data.value) return [];
|
|
|
|
|
+ return [
|
|
|
|
|
+ { label: '姓名', value: data.value.usersname },
|
|
|
|
|
+ { label: '手机号', value: data.value.usersphone },
|
|
|
|
|
+ { label: '身份证号', value: data.value.usersidcardnumber },
|
|
|
|
|
+ { label: '用户类型', value: data.value.userstype },
|
|
|
|
|
+ { label: '用户性质', value: data.value.usersnature },
|
|
|
|
|
+ { label: '邮箱', value: data.value.usersemail },
|
|
|
|
|
+ { label: '地址', value: data.value.usersaddress },
|
|
|
|
|
+ { label: '注册时间', value: data.value.usersdate },
|
|
|
|
|
+ { label: '银行名称', value: data.value.usersbankname },
|
|
|
|
|
+ { label: '银行账号', value: data.value.usersbanknumber },
|
|
|
|
|
+ { label: '社会统一信用代码', value: data.value.usersshtyxydm },
|
|
|
|
|
+ ];
|
|
|
|
|
+});
|
|
|
|
|
+
|
|
|
|
|
+// 产品信息
|
|
|
|
|
+const productInfo = computed(() => {
|
|
|
|
|
+ if (!data.value) return [];
|
|
|
|
|
+ return [
|
|
|
|
|
+ { label: '产品名称', value: data.value.productsname },
|
|
|
|
|
+ { label: '产品型号', value: data.value.productsmodel },
|
|
|
|
|
+ { label: '产品类别', value: data.value.productscategory },
|
|
|
|
|
+ { label: '机具类型', value: data.value.productsjjlx },
|
|
|
|
|
+ {
|
|
|
|
|
+ label: '产品价格',
|
|
|
|
|
+ value: data.value.productsprice ? `¥${data.value.productsprice}` : '',
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ label: '推广补贴',
|
|
|
|
|
+ value: data.value.productstsxzybt ? `¥${data.value.productstsxzybt}` : '',
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ label: '中央补贴',
|
|
|
|
|
+ value: data.value.productszybt ? `¥${data.value.productszybt}` : '',
|
|
|
|
|
+ },
|
|
|
|
|
+ { label: '产品序列号', value: data.value.productssn },
|
|
|
|
|
+ { label: '发动机编号', value: data.value.productsfdbh },
|
|
|
|
|
+ { label: '发动机名称', value: data.value.productsfdmc },
|
|
|
|
|
+ { label: '生产企业', value: data.value.scqyinfomc },
|
|
|
|
|
+ { label: '企业地址', value: data.value.scqyinfoaddress },
|
|
|
|
|
+ { label: '法人姓名', value: data.value.scqyinfofrmc },
|
|
|
|
|
+ { label: '销售姓名', value: data.value.scqyinfoxsmc },
|
|
|
|
|
+ { label: '销售电话', value: data.value.scqyinfoxsphone },
|
|
|
|
|
+ { label: '统一社会信用代码', value: data.value.scqyinfoshtydm },
|
|
|
|
|
+ {
|
|
|
|
|
+ label: '注册资本',
|
|
|
|
|
+ value: data.value.scqyinfozczb ? `¥${data.value.scqyinfozczb}` : '',
|
|
|
|
|
+ },
|
|
|
|
|
+ ];
|
|
|
|
|
+});
|
|
|
|
|
+
|
|
|
|
|
+// 优惠券状态映射
|
|
|
|
|
+const getCouponStatusTag = (status: number) => {
|
|
|
|
|
+ const statusMap = {
|
|
|
|
|
+ 0: { text: '申请中', type: 'info' },
|
|
|
|
|
+ 1: { text: '审核通过', type: 'success' },
|
|
|
|
|
+ 2: { text: '审核不通过', type: 'danger' },
|
|
|
|
|
+ } as const;
|
|
|
|
|
+ return (
|
|
|
|
|
+ statusMap[status as keyof typeof statusMap] || {
|
|
|
|
|
+ text: '未知',
|
|
|
|
|
+ type: 'warning',
|
|
|
|
|
+ }
|
|
|
|
|
+ );
|
|
|
|
|
+};
|
|
|
|
|
+
|
|
|
|
|
+// 使用状态映射
|
|
|
|
|
+const getUsedStatusTag = (status: number) => {
|
|
|
|
|
+ const statusMap = {
|
|
|
|
|
+ 0: { text: '未使用', type: 'info' },
|
|
|
|
|
+ 1: { text: '已使用', type: 'success' },
|
|
|
|
|
+ } as const;
|
|
|
|
|
+ return (
|
|
|
|
|
+ statusMap[status as keyof typeof statusMap] || {
|
|
|
|
|
+ text: '未知',
|
|
|
|
|
+ type: 'warning',
|
|
|
|
|
+ }
|
|
|
|
|
+ );
|
|
|
|
|
+};
|
|
|
|
|
+
|
|
|
|
|
+// 优惠券信息
|
|
|
|
|
+const couponInfo = computed(() => {
|
|
|
|
|
+ if (!data.value) return [];
|
|
|
|
|
+
|
|
|
|
|
+ return [
|
|
|
|
|
+ { label: '优惠券ID', value: data.value.coupon2sid },
|
|
|
|
|
+ { label: '优惠券代码', value: data.value.coupon2code },
|
|
|
|
|
+ { label: '优惠券名称', value: data.value.coupon2mc },
|
|
|
|
|
+ { label: '申请时间', value: data.value.coupon2adddatetime },
|
|
|
|
|
+ { label: '审核时间', value: data.value.coupon2reviewdatetime || '未审核' },
|
|
|
|
|
+ {
|
|
|
|
|
+ label: '优惠券状态',
|
|
|
|
|
+ value: data.value.coupon2sype,
|
|
|
|
|
+ isTag: true,
|
|
|
|
|
+ tagType: 'couponStatus',
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ label: '使用状态',
|
|
|
|
|
+ value: data.value.coupon2isused,
|
|
|
|
|
+ isTag: true,
|
|
|
|
|
+ tagType: 'usedStatus',
|
|
|
|
|
+ },
|
|
|
|
|
+ // { label: '可用产品ID', value: data.value.coupon2productids },
|
|
|
|
|
+ // { label: '关联主券ID', value: data.value.coupon2coupon1id },
|
|
|
|
|
+ { label: '订单编号', value: data.value.ordersnumber },
|
|
|
|
|
+ {
|
|
|
|
|
+ label: '订单总价',
|
|
|
|
|
+ value: data.value.orderstotalprice
|
|
|
|
|
+ ? `¥${data.value.orderstotalprice}`
|
|
|
|
|
+ : '',
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ label: '优惠价格',
|
|
|
|
|
+ value: data.value.ordersyhprice ? `¥${data.value.ordersyhprice}` : '',
|
|
|
|
|
+ },
|
|
|
|
|
+ {
|
|
|
|
|
+ label: '折扣价格',
|
|
|
|
|
+ value: data.value.ordersdiscountprice
|
|
|
|
|
+ ? `¥${data.value.ordersdiscountprice}`
|
|
|
|
|
+ : '',
|
|
|
|
|
+ },
|
|
|
|
|
+ { label: '下单时间', value: data.value.ordersorderdate },
|
|
|
|
|
+ { label: '经销商名称', value: data.value.jxsname },
|
|
|
|
|
+ ];
|
|
|
|
|
+});
|
|
|
|
|
+
|
|
|
|
|
+const [Modal, modalApi] = useVbenModal({
|
|
|
|
|
+ title: '优惠券详情',
|
|
|
|
|
+ class: 'w-10/12 max-w-8xl',
|
|
|
|
|
+ showCancelButton: false,
|
|
|
|
|
+ confirmText: '关闭',
|
|
|
|
|
+ onConfirm() {
|
|
|
|
|
+ modalApi.close();
|
|
|
|
|
+ },
|
|
|
|
|
+ async onOpenChange(isOpen) {
|
|
|
|
|
+ if (isOpen) {
|
|
|
|
|
+ const modalData = modalApi.getData();
|
|
|
|
|
+
|
|
|
|
|
+ if (modalData?.row?.coupon2sid) {
|
|
|
|
|
+ try {
|
|
|
|
|
+ loading.value = true;
|
|
|
|
|
+ const detailData = await getCoupon2DetailApi({
|
|
|
|
|
+ coupon2sid: modalData.row.coupon2sid,
|
|
|
|
|
+ });
|
|
|
|
|
+ data.value = detailData;
|
|
|
|
|
+ } catch (error) {
|
|
|
|
|
+ console.error('获取优惠券详情失败:', error);
|
|
|
|
|
+ } finally {
|
|
|
|
|
+ loading.value = false;
|
|
|
|
|
+ }
|
|
|
|
|
+ }
|
|
|
|
|
+ } else {
|
|
|
|
|
+ data.value = null;
|
|
|
|
|
+ }
|
|
|
|
|
+ },
|
|
|
|
|
+});
|
|
|
|
|
+
|
|
|
|
|
+function openDetailModal(rowData: any) {
|
|
|
|
|
+ modalApi.setData({ row: rowData });
|
|
|
|
|
+ modalApi.open();
|
|
|
|
|
+}
|
|
|
|
|
+
|
|
|
|
|
+defineExpose({
|
|
|
|
|
+ openDetailModal,
|
|
|
|
|
+});
|
|
|
|
|
+</script>
|
|
|
|
|
+
|
|
|
|
|
+<template>
|
|
|
|
|
+ <Modal>
|
|
|
|
|
+ <div v-loading="loading" class="space-y-6 p-4">
|
|
|
|
|
+ <!-- 申请人信息 -->
|
|
|
|
|
+ <div>
|
|
|
|
|
+ <el-divider content-position="left">
|
|
|
|
|
+ <span class="text-lg font-semibold text-gray-800">申请人信息</span>
|
|
|
|
|
+ </el-divider>
|
|
|
|
|
+ <el-descriptions :column="3" border class="mb-4" label-width="120px">
|
|
|
|
|
+ <el-descriptions-item
|
|
|
|
|
+ v-for="item in applicantInfo"
|
|
|
|
|
+ :key="item.label"
|
|
|
|
|
+ :label="item.label"
|
|
|
|
|
+ width="20%"
|
|
|
|
|
+ >
|
|
|
|
|
+ {{ item.value || '-' }}
|
|
|
|
|
+ </el-descriptions-item>
|
|
|
|
|
+ </el-descriptions>
|
|
|
|
|
+ </div>
|
|
|
|
|
+
|
|
|
|
|
+ <!-- 产品信息 -->
|
|
|
|
|
+ <div>
|
|
|
|
|
+ <el-divider content-position="left">
|
|
|
|
|
+ <span class="text-lg font-semibold text-gray-800">产品信息</span>
|
|
|
|
|
+ </el-divider>
|
|
|
|
|
+ <el-descriptions :column="3" border class="mb-4" label-width="120px">
|
|
|
|
|
+ <el-descriptions-item
|
|
|
|
|
+ v-for="item in productInfo"
|
|
|
|
|
+ :key="item.label"
|
|
|
|
|
+ :label="item.label"
|
|
|
|
|
+ width="20%"
|
|
|
|
|
+ >
|
|
|
|
|
+ {{ item.value || '-' }}
|
|
|
|
|
+ </el-descriptions-item>
|
|
|
|
|
+ </el-descriptions>
|
|
|
|
|
+ </div>
|
|
|
|
|
+
|
|
|
|
|
+ <!-- 优惠券信息 -->
|
|
|
|
|
+ <div>
|
|
|
|
|
+ <el-divider content-position="left">
|
|
|
|
|
+ <span class="text-lg font-semibold text-gray-800">优惠券信息</span>
|
|
|
|
|
+ </el-divider>
|
|
|
|
|
+ <el-descriptions :column="3" border class="mb-4" label-width="120px">
|
|
|
|
|
+ <el-descriptions-item
|
|
|
|
|
+ v-for="item in couponInfo"
|
|
|
|
|
+ :key="item.label"
|
|
|
|
|
+ :label="item.label"
|
|
|
|
|
+ width="20%"
|
|
|
|
|
+ >
|
|
|
|
|
+ <!-- 优惠券状态标签 -->
|
|
|
|
|
+ <ElTag
|
|
|
|
|
+ v-if="item.isTag && item.tagType === 'couponStatus'"
|
|
|
|
|
+ :type="getCouponStatusTag(item.value).type"
|
|
|
|
|
+ >
|
|
|
|
|
+ {{ getCouponStatusTag(item.value).text }}
|
|
|
|
|
+ </ElTag>
|
|
|
|
|
+ <!-- 使用状态标签 -->
|
|
|
|
|
+ <ElTag
|
|
|
|
|
+ v-else-if="item.isTag && item.tagType === 'usedStatus'"
|
|
|
|
|
+ :type="getUsedStatusTag(item.value).type"
|
|
|
|
|
+ >
|
|
|
|
|
+ {{ getUsedStatusTag(item.value).text }}
|
|
|
|
|
+ </ElTag>
|
|
|
|
|
+ <!-- 普通文本 -->
|
|
|
|
|
+ <span v-else>{{ item.value || '-' }}</span>
|
|
|
|
|
+ </el-descriptions-item>
|
|
|
|
|
+ </el-descriptions>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </div>
|
|
|
|
|
+ </Modal>
|
|
|
|
|
+</template>
|