|
|
@@ -83,134 +83,110 @@
|
|
|
</template>
|
|
|
|
|
|
<script setup lang="ts">
|
|
|
-import { ref, computed } from 'vue';
|
|
|
+import { ref, computed, onMounted } from 'vue';
|
|
|
+import { useRoute } from 'vue-router';
|
|
|
import { ArrowRight, ArrowDown, Document, ArrowLeft } from '@element-plus/icons-vue';
|
|
|
+import { helpCategoryList, helpCenterList } from '@/api/pc/organization';
|
|
|
+
|
|
|
+const route = useRoute();
|
|
|
|
|
|
const expandedCategory = ref<number | null>(null);
|
|
|
-const currentCategory = ref<number>(2);
|
|
|
-const currentChild = ref<number>(1);
|
|
|
+const currentCategory = ref<number>(0);
|
|
|
+const currentChild = ref<number>(0);
|
|
|
const currentDetailContent = ref<string>('');
|
|
|
const currentDetailTitle = ref<string>('');
|
|
|
|
|
|
-const categories = [
|
|
|
- {
|
|
|
- id: 1,
|
|
|
- name: '采购指南',
|
|
|
- children: [
|
|
|
- { id: 1, name: '注册流程' },
|
|
|
- { id: 2, name: '实名认证' },
|
|
|
- { id: 3, name: '资质审核' }
|
|
|
- ]
|
|
|
- },
|
|
|
- {
|
|
|
- id: 2,
|
|
|
- name: '关于结算',
|
|
|
- children: [
|
|
|
- { id: 1, name: '支付方式' },
|
|
|
- { id: 2, name: '发票管理' },
|
|
|
- { id: 3, name: '信用管理' },
|
|
|
- { id: 4, name: '退款管理' }
|
|
|
- ]
|
|
|
- },
|
|
|
- {
|
|
|
- id: 3,
|
|
|
- name: '配送服务',
|
|
|
- children: [
|
|
|
- { id: 1, name: '配送政策' },
|
|
|
- { id: 2, name: '配送时效' },
|
|
|
- { id: 3, name: '服务标准' },
|
|
|
- { id: 4, name: '签收管理' }
|
|
|
- ]
|
|
|
- },
|
|
|
- {
|
|
|
- id: 4,
|
|
|
- name: '售后服务',
|
|
|
- children: [
|
|
|
- { id: 1, name: '退换货政策' },
|
|
|
- { id: 2, name: '维修服务' },
|
|
|
- { id: 3, name: '投诉建议' }
|
|
|
- ]
|
|
|
- },
|
|
|
- {
|
|
|
- id: 5,
|
|
|
- name: '对账管理',
|
|
|
- children: [
|
|
|
- { id: 1, name: '账单查询' },
|
|
|
- { id: 2, name: '对账流程' }
|
|
|
- ]
|
|
|
+const categories = ref<any[]>([]);
|
|
|
+const helpList = ref<any[]>([]);
|
|
|
+const detailData = ref<Record<string, string>>({});
|
|
|
+
|
|
|
+const loadHelpByType = async (helpType: string) => {
|
|
|
+ try {
|
|
|
+ const helpRes = await helpCenterList({ helpType });
|
|
|
+ if (helpRes.code === 200 || helpRes.code === 0) {
|
|
|
+ const list = helpRes.rows || helpRes.data || [];
|
|
|
+ helpList.value = list.map((item: any) => ({
|
|
|
+ id: item.id || item.helpId,
|
|
|
+ title: item.title || item.helpTitle || item.label || '',
|
|
|
+ content: item.content || item.helpContent || item.description || ''
|
|
|
+ }));
|
|
|
+ detailData.value = {};
|
|
|
+ helpList.value.forEach((item: any) => {
|
|
|
+ detailData.value[item.title] = item.content || '暂无详细内容';
|
|
|
+ });
|
|
|
+ }
|
|
|
+ } catch (e) {
|
|
|
+ console.error('获取帮助列表失败:', e);
|
|
|
}
|
|
|
-];
|
|
|
-
|
|
|
-const contentData: Record<string, string[]> = {
|
|
|
- '2-1': ['平台主要的支付方式', '信用支付实施方案', '在线支付操作指南'],
|
|
|
- '2-2': ['发票申请流程', '发票类型说明', '电子发票下载'],
|
|
|
- '2-3': ['信用额度申请', '信用支付条件', '信用记录查询'],
|
|
|
- '2-4': ['退款申请条件', '退款流程说明', '退款进度查询'],
|
|
|
- '3-1': ['配送范围说明', '运费计算规则', '特殊地区配送'],
|
|
|
- '3-2': ['标准配送时效', '加急配送服务', '配送时间查询'],
|
|
|
- '3-3': ['服务质量标准', '验货流程', '异常处理'],
|
|
|
- '3-4': ['签收注意事项', '代签收规定', '拒收处理'],
|
|
|
- '4-1': ['退换货条件', '退换货流程', '运费承担规则'],
|
|
|
- '4-2': ['维修申请流程', '维修周期说明', '保修政策'],
|
|
|
- '4-3': ['投诉渠道', '建议反馈', '处理时效']
|
|
|
};
|
|
|
|
|
|
-const detailData: Record<string, string> = {
|
|
|
- '平台主要的支付方式':
|
|
|
- '本平台支持多种支付方式,包括在线支付、信用支付、线下转账等。在线支付支持支付宝、微信支付、银联卡等多种渠道,方便快捷。信用支付适用于已通过信用审核的企业用户,可享受先使用后付款的便利。',
|
|
|
- '信用支付实施方案':
|
|
|
- '信用支付需要企业完成实名认证和资质审核,审核通过后可获得相应的信用额度。信用额度根据企业资质、交易记录等因素综合评定,最高可达100万元。使用信用支付时,系统会自动冻结相应额度,确认收货后扣除。',
|
|
|
- '在线支付操作指南':
|
|
|
- '1. 选择商品并加入购物车\n2. 进入结算页面,选择"在线支付"\n3. 选择支付方式(支付宝/微信/银联)\n4. 点击"立即支付"按钮\n5. 扫码或输入账号密码完成支付\n6. 支付成功后可在订单详情中查看状态',
|
|
|
- '发票申请流程':
|
|
|
- '1. 登录账户,进入"我的订单"\n2. 找到需要开票的订单\n3. 点击"申请发票"按钮\n4. 填写发票信息(抬头、税号、地址等)\n5. 选择发票类型(增值税专用发票/普通发票)\n6. 提交申请,等待审核\n7. 审核通过后,电子发票将发送至指定邮箱',
|
|
|
- '发票类型说明':
|
|
|
- '本平台提供两种发票类型:增值税专用发票和普通发票。增值税专用发票适用于一般纳税人企业,可用于抵扣进项税额;普通发票适用于小规模纳税人和个人用户。申请时需准确填写相关信息,确保发票能够正常使用。',
|
|
|
- '电子发票下载':
|
|
|
- '电子发票申请审核通过后,系统会发送至您预留的邮箱。您也可以登录账户,在"发票管理"页面查看和下载已开具的电子发票。电子发票与纸质发票具有同等法律效力,可直接用于报销和记账。',
|
|
|
- '信用额度申请':
|
|
|
- '申请信用额度需要准备以下材料:营业执照、税务登记证、开户许可证、法人身份证等。登录账户后进入"信用管理"页面,上传相关材料并提交申请。审核周期一般为3-5个工作日,审核结果会通过站内信和短信通知。',
|
|
|
- '信用支付条件':
|
|
|
- '使用信用支付需满足以下条件:1. 已完成企业认证;2. 信用额度审核通过;3. 当前可用额度充足;4. 无逾期未还订单。系统会在结算时自动判断是否符合信用支付条件,符合条件时会显示信用支付选项。',
|
|
|
- '信用记录查询':
|
|
|
- '您可以在"信用管理"页面查看完整的信用记录,包括:历史信用额度、使用情况、还款记录、逾期情况等。良好的信用记录有助于提升信用额度,建议按时还款,保持良好的信用状况。',
|
|
|
- '退款申请条件':
|
|
|
- '申请退款需满足以下条件:1. 订单未确认收货或未超过售后期限;2. 商品存在质量问题或与描述不符;3. 未使用优惠券或积分兑换的商品;4. 定制类商品不支持无理由退款。申请时需提供相关证明材料,如照片、视频等。',
|
|
|
- '退款流程说明':
|
|
|
- '1. 进入"我的订单",找到需要退款的订单\n2. 点击"申请退款"按钮\n3. 选择退款原因,填写详细说明\n4. 上传相关凭证(照片/视频)\n5. 提交申请,等待商家审核\n6. 审核通过后,退款将在1-3个工作日内原路返回',
|
|
|
- '退款进度查询':
|
|
|
- '您可以在"我的订单"或"退款管理"页面查看退款进度。退款状态包括:待审核、审核中、审核通过、退款中、已完成。如有疑问,可联系客服咨询具体进度和处理情况。'
|
|
|
+const loadData = async () => {
|
|
|
+ const categoryNo = route.query.parentNo as string;
|
|
|
+
|
|
|
+ // 加载帮助分类
|
|
|
+ try {
|
|
|
+ const catRes = await helpCategoryList({});
|
|
|
+ if (catRes.code === 200 || catRes.code === 0) {
|
|
|
+ const list = catRes.rows || catRes.data || [];
|
|
|
+ categories.value = list.map((item: any) => ({
|
|
|
+ id: item.id || item.helpCategoryId,
|
|
|
+ categoryNo: item.categoryNo || item.id || item.helpCategoryId,
|
|
|
+ name: item.name || item.categoryName || item.label || '',
|
|
|
+ children: (item.children || []).map((child: any) => ({
|
|
|
+ id: child.id || child.helpCategoryId,
|
|
|
+ categoryNo: child.categoryNo || child.id || child.helpCategoryId,
|
|
|
+ parentNo: child.parentNo || '',
|
|
|
+ name: child.name || child.categoryName || child.label || ''
|
|
|
+ }))
|
|
|
+ }));
|
|
|
+ }
|
|
|
+ } catch (e) {
|
|
|
+ console.error('获取分类失败:', e);
|
|
|
+ }
|
|
|
+
|
|
|
+ // 加载帮助列表
|
|
|
+ if (categoryNo) {
|
|
|
+ await loadHelpByType(categoryNo);
|
|
|
+ }
|
|
|
+
|
|
|
+ // 默认展开对应分类
|
|
|
+ if (categories.value.length > 0 && categoryNo) {
|
|
|
+ const matched = categories.value.find((c: any) => String(c.categoryNo) === categoryNo);
|
|
|
+ currentCategory.value = matched ? matched.id : categories.value[0].id;
|
|
|
+ expandedCategory.value = currentCategory.value;
|
|
|
+ } else if (categories.value.length > 0) {
|
|
|
+ currentCategory.value = categories.value[0].id;
|
|
|
+ expandedCategory.value = categories.value[0].id;
|
|
|
+ }
|
|
|
};
|
|
|
|
|
|
const currentCategoryName = computed(() => {
|
|
|
- const category = categories.find((c) => c.id === currentCategory.value);
|
|
|
+ const category = categories.value.find((c) => c.id === currentCategory.value);
|
|
|
return category ? category.name : '';
|
|
|
});
|
|
|
|
|
|
const currentChildName = computed(() => {
|
|
|
- const category = categories.find((c) => c.id === currentCategory.value);
|
|
|
+ const category = categories.value.find((c) => c.id === currentCategory.value);
|
|
|
if (!category || !category.children) return '';
|
|
|
- const child = category.children.find((ch) => ch.id === currentChild.value);
|
|
|
+ const child = category.children.find((ch: any) => ch.id === currentChild.value);
|
|
|
return child ? child.name : '';
|
|
|
});
|
|
|
|
|
|
const currentContent = computed(() => {
|
|
|
- const key = `${currentCategory.value}-${currentChild.value}`;
|
|
|
- return contentData[key] || null;
|
|
|
+ if (helpList.value.length === 0) return null;
|
|
|
+ return helpList.value.map((item: any) => item.title);
|
|
|
});
|
|
|
|
|
|
const toggleCategory = (categoryId: number) => {
|
|
|
- const category = categories.find((c) => c.id === categoryId);
|
|
|
+ const category = categories.value.find((c) => c.id === categoryId);
|
|
|
if (category && category.children && category.children.length > 0) {
|
|
|
expandedCategory.value = expandedCategory.value === categoryId ? null : categoryId;
|
|
|
currentCategory.value = categoryId;
|
|
|
- // 重置详情状态
|
|
|
currentDetailContent.value = '';
|
|
|
currentDetailTitle.value = '';
|
|
|
} else {
|
|
|
currentCategory.value = categoryId;
|
|
|
currentChild.value = 0;
|
|
|
- // 重置详情状态
|
|
|
currentDetailContent.value = '';
|
|
|
currentDetailTitle.value = '';
|
|
|
}
|
|
|
@@ -220,14 +196,22 @@ const selectChild = (categoryId: number, childId: number) => {
|
|
|
currentCategory.value = categoryId;
|
|
|
currentChild.value = childId;
|
|
|
expandedCategory.value = categoryId;
|
|
|
- // 重置详情状态
|
|
|
currentDetailContent.value = '';
|
|
|
currentDetailTitle.value = '';
|
|
|
+ const category = categories.value.find((c: any) => c.id === categoryId);
|
|
|
+ helpList.value = [];
|
|
|
+ if (category) {
|
|
|
+ const child = category.children?.find((ch: any) => ch.id === childId);
|
|
|
+ if (child) {
|
|
|
+ const helpType = child.categoryNo;
|
|
|
+ if (helpType) loadHelpByType(String(helpType));
|
|
|
+ }
|
|
|
+ }
|
|
|
};
|
|
|
|
|
|
const selectDetail = (item: string) => {
|
|
|
currentDetailTitle.value = item;
|
|
|
- currentDetailContent.value = detailData[item] || '暂无详细内容';
|
|
|
+ currentDetailContent.value = detailData.value[item] || '暂无详细内容';
|
|
|
};
|
|
|
|
|
|
const backToList = () => {
|
|
|
@@ -235,10 +219,9 @@ const backToList = () => {
|
|
|
currentDetailTitle.value = '';
|
|
|
};
|
|
|
|
|
|
-// 默认展开第一个有子项的分类
|
|
|
-if (categories[0].children && categories[0].children.length > 0) {
|
|
|
- expandedCategory.value = categories[0].id;
|
|
|
-}
|
|
|
+onMounted(() => {
|
|
|
+ loadData();
|
|
|
+});
|
|
|
</script>
|
|
|
|
|
|
<style scoped lang="scss">
|