@agile-team/wl-skills-kit 1.0.0

package/files/demo/produce/aiflow/mmwr-customer-apply-change-history/data.ts

@@ -0,0 +1,196 @@
+import { getAction } from "@jhlc/common-core/src/api/action";
+import { useRouter } from "vue-router";
+import { createChangeMockData } from "@/components/local/c_customerTabs/data";
+import type {
+  BasicInfoForm,
+  BusinessInfoRow
+} from "@/components/local/c_customerTabs/data";
+
+export const API_CONFIG = {
+  changeHistoryList: "/sale/customerApply/changeHistory/list",
+  getById: "/sale/customerApply/changeHistory/getById",
+  getDiffById: "/sale/customerApply/changeHistory/getDiffById"
+} as const;
+
+export interface HistoryRecord {
+  id: string;
+  changeType: string;
+  changeTime: string;
+  changePerson: string;
+}
+
+/** 变更历史记录 mock 数据（对齐原型截图，首条为"数据变更"以便立即展示比对效果） */
+function createHistoryListMock(): HistoryRecord[] {
+  return [
+    {
+      id: "h001",
+      changeType: "数据变更",
+      changeTime: "2025/12/15 13:48:07",
+      changePerson: "变更人姓名"
+    },
+    {
+      id: "h002",
+      changeType: "数据新增",
+      changeTime: "2025/12/15 13:48:07",
+      changePerson: "新增人姓名"
+    },
+    {
+      id: "h003",
+      changeType: "数据新增",
+      changeTime: "2025/12/15 13:48:07",
+      changePerson: "新增人姓名"
+    },
+    {
+      id: "h004",
+      changeType: "数据变更",
+      changeTime: "2025/12/15 13:48:07",
+      changePerson: "变更人姓名"
+    },
+    {
+      id: "h005",
+      changeType: "数据变更",
+      changeTime: "2025/12/15 13:48:07",
+      changePerson: "变更人姓名"
+    },
+    {
+      id: "h006",
+      changeType: "数据新增",
+      changeTime: "2025/12/15 13:48:07",
+      changePerson: "新增人姓名"
+    },
+    {
+      id: "h007",
+      changeType: "数据新增",
+      changeTime: "2025/12/15 13:48:07",
+      changePerson: "新增人姓名"
+    }
+  ];
+}
+
+/** 变更比对 mock：旧版数据（对齐原型截图中的上下比对效果）
+ *  使用显示标签（非值码），以便 diff-old-value 直接展示中文。
+ *  - basicInfo.taxCategory:   "小规模纳税人"（旧）vs "一级纳税人"（新）
+ *  - basicInfo.relationType:  "02-合并关系人"（旧）vs "03-非关系人"（新）
+ *  - businessInfoList[0]:     salesType "外销"（旧）vs "内销"（新），customerLevel "B3" vs "B1"
+ */
+function createDiffMockData(): {
+  basicInfo: BasicInfoForm;
+  businessInfoList: BusinessInfoRow[];
+} {
+  const current = createChangeMockData();
+  return {
+    basicInfo: {
+      ...current.basicInfo,
+      taxCategory: "小规模纳税人",
+      relationType: "02-合并关系人"
+    },
+    businessInfoList: current.businessInfoList.map((row, idx) => {
+      if (idx === 0) {
+        return { ...row, salesType: "外销", customerLevel: "B3" };
+      }
+      return { ...row };
+    })
+  };
+}
+
+export function useChangeHistory(tabsRef: any) {
+  const router = useRouter();
+  const loading = ref(false);
+  const historyLoading = ref(false);
+  const historyList = ref<HistoryRecord[]>([]);
+  const selectedId = ref<string>("");
+  const isMockMode = ref(false);
+
+  // ─── 真实接口模式（有 id 时调用） ───
+
+  async function loadHistoryList(applyId: string) {
+    isMockMode.value = false;
+    historyLoading.value = true;
+    try {
+      const res = await getAction(API_CONFIG.changeHistoryList, { applyId });
+      if (res?.data?.length) {
+        historyList.value = res.data;
+      }
+    } finally {
+      historyLoading.value = false;
+      if (historyList.value.length > 0) {
+        await loadHistoryDetail(historyList.value[0].id);
+      }
+    }
+  }
+
+  async function loadHistoryDetail(id: string) {
+    selectedId.value = id;
+    loading.value = true;
+    const currentRecord = historyList.value.find((r) => r.id === id);
+    const isChangeType = currentRecord?.changeType.includes("变更");
+    try {
+      const res = await getAction(API_CONFIG.getById, { id });
+      if (res?.data) {
+        tabsRef.value?.loadData(res.data);
+        if (isChangeType) {
+          const diffRes = await getAction(API_CONFIG.getDiffById, { id }).catch(
+            () => null
+          );
+          if (diffRes?.data) {
+            tabsRef.value?.loadDiffData(diffRes.data);
+          } else {
+            tabsRef.value?.clearDiffData?.();
+          }
+        } else {
+          tabsRef.value?.clearDiffData?.();
+        }
+      }
+    } finally {
+      loading.value = false;
+    }
+  }
+
+  // ─── Mock 模式（无 id 时调用，纯本地数据，零接口请求） ───
+
+  function loadMockData() {
+    isMockMode.value = true;
+    historyList.value = createHistoryListMock();
+    if (historyList.value.length > 0) {
+      nextTick(() => selectMockDetail(historyList.value[0].id));
+    }
+  }
+
+  function selectMockDetail(id: string) {
+    selectedId.value = id;
+    const currentRecord = historyList.value.find((r) => r.id === id);
+    const isChangeType = currentRecord?.changeType.includes("变更");
+    tabsRef.value?.loadData(createChangeMockData());
+    if (isChangeType) {
+      tabsRef.value?.loadDiffData(createDiffMockData());
+    } else {
+      tabsRef.value?.clearDiffData?.();
+    }
+  }
+
+  // ─── 公共 ───
+
+  function handleSelectHistory(item: HistoryRecord) {
+    if (item.id === selectedId.value) return;
+    if (isMockMode.value) {
+      selectMockDetail(item.id);
+    } else {
+      loadHistoryDetail(item.id);
+    }
+  }
+
+  function handleCancel() {
+    router.back();
+  }
+
+  return {
+    loading,
+    historyLoading,
+    historyList,
+    selectedId,
+    loadHistoryList,
+    loadMockData,
+    handleSelectHistory,
+    handleCancel
+  };
+}

package/files/demo/produce/aiflow/mmwr-customer-apply-change-history/index.scss

@@ -0,0 +1,150 @@
+.change-history-page {
+  display: flex !important;
+  padding: 0 !important;
+  height: 100%;
+  overflow: hidden;
+
+  /* ─── 左侧：变更记录面板 ─── */
+  .history-panel {
+    width: 200px;
+    flex-shrink: 0;
+    border-right: 1px solid #e4e7ed;
+    display: flex;
+    flex-direction: column;
+    overflow: hidden;
+    background: #fff;
+
+    &__header {
+      padding: 12px 16px;
+      font-size: 14px;
+      font-weight: 600;
+      color: #303133;
+      border-bottom: 1px solid #e4e7ed;
+      flex-shrink: 0;
+    }
+
+    &__list {
+      flex: 1;
+      overflow-y: auto;
+      padding: 4px 0;
+    }
+  }
+
+  .history-card {
+    display: flex;
+    align-items: flex-start;
+    padding: 10px 16px;
+    cursor: pointer;
+    border-left: 3px solid transparent;
+    transition: background 0.15s;
+    gap: 8px;
+
+    &:hover {
+      background: #f5f7fa;
+    }
+
+    &.is-active {
+      background: #ecf5ff;
+      border-left-color: #409eff;
+    }
+
+    &__dot {
+      width: 8px;
+      height: 8px;
+      border-radius: 50%;
+      margin-top: 5px;
+      flex-shrink: 0;
+
+      &.is-add {
+        background: #409eff;
+      }
+      &.is-change {
+        background: #e6a23c;
+      }
+    }
+
+    &__content {
+      flex: 1;
+      min-width: 0;
+    }
+
+    &__type {
+      font-size: 13px;
+      font-weight: 500;
+      color: #303133;
+      line-height: 18px;
+    }
+
+    &__date {
+      font-size: 12px;
+      color: #909399;
+      line-height: 18px;
+    }
+
+    &__person {
+      font-size: 12px;
+      color: #606266;
+      line-height: 18px;
+    }
+  }
+
+  .history-empty {
+    padding: 32px 16px;
+    text-align: center;
+    color: #909399;
+    font-size: 13px;
+  }
+
+  /* ─── 右侧：变更详情面板 ─── */
+  .detail-panel {
+    flex: 1;
+    overflow: hidden;
+    display: flex;
+    flex-direction: column;
+    background: #fff;
+
+    &__body {
+      flex: 1;
+      overflow-y: auto;
+      padding: 0 16px 16px;
+    }
+  }
+
+  .page-header {
+    display: flex;
+    align-items: center;
+    padding: 10px 16px;
+    flex-shrink: 0;
+
+    .page-title {
+      font-size: 16px;
+      font-weight: 600;
+      margin-right: 10px;
+    }
+
+    .page-tag {
+      display: inline-block;
+      padding: 1px 8px;
+      font-size: 12px;
+      border-radius: 4px;
+      margin-right: 8px;
+
+      &--change {
+        background-color: var(--el-color-primary-light-9);
+        color: var(--el-color-primary);
+        border: 1px solid var(--el-color-primary-light-7);
+      }
+
+      &--status {
+        background-color: var(--el-color-warning-light-9);
+        color: var(--el-color-warning);
+        border: 1px solid var(--el-color-warning-light-7);
+      }
+    }
+  }
+
+  .page-toolbar {
+    padding: 0 16px 8px;
+    flex-shrink: 0;
+  }
+}

package/files/demo/produce/aiflow/mmwr-customer-apply-change-history/index.vue

@@ -0,0 +1,79 @@
+<template>
+  <div class="app-container change-history-page">
+    <!-- 左侧：变更历史记录面板 -->
+    <div class="history-panel" v-loading="historyLoading">
+      <div class="history-panel__header">变更记录</div>
+      <div class="history-panel__list">
+        <div
+          v-for="item in historyList"
+          :key="item.id"
+          class="history-card"
+          :class="{ 'is-active': item.id === selectedId }"
+          @click="handleSelectHistory(item)"
+        >
+          <span
+            class="history-card__dot"
+            :class="item.changeType.includes('新增') ? 'is-add' : 'is-change'"
+          ></span>
+          <div class="history-card__content">
+            <div class="history-card__type">{{ item.changeType }}</div>
+            <div class="history-card__date">{{ item.changeTime }}</div>
+            <div class="history-card__person">{{ item.changePerson }}</div>
+          </div>
+        </div>
+        <div
+          v-if="!historyList.length && !historyLoading"
+          class="history-empty"
+        >
+          暂无变更记录
+        </div>
+      </div>
+    </div>
+
+    <!-- 右侧：变更详情面板 -->
+    <div class="detail-panel" v-loading="loading">
+      <div class="page-header">
+        <span class="page-title">客户变更详情</span>
+        <span class="page-tag page-tag--change">变更</span>
+        <span class="page-tag page-tag--status">未审核</span>
+      </div>
+      <div class="page-toolbar">
+        <el-button @click="handleCancel">取消</el-button>
+      </div>
+      <div class="detail-panel__body">
+        <c_customerTabs ref="tabsRef" mode="view" />
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup lang="ts">
+import { useRoute } from "vue-router";
+import { useChangeHistory } from "./data";
+import c_customerTabs from "@/components/local/c_customerTabs/index.vue";
+
+const tabsRef = ref<InstanceType<typeof c_customerTabs>>();
+const route = useRoute();
+
+const {
+  loading,
+  historyLoading,
+  historyList,
+  selectedId,
+  loadHistoryList,
+  loadMockData,
+  handleSelectHistory,
+  handleCancel
+} = useChangeHistory(tabsRef);
+
+onMounted(() => {
+  // TODO: 后端接口就绪后，启用真实接口：
+  // const id = route.query.id as string;
+  // if (id) { loadHistoryList(id); } else { loadMockData(); }
+  loadMockData();
+});
+</script>
+
+<style scoped lang="scss">
+@import "./index.scss";
+</style>

package/files/demo/produce/aiflow/mmwr-customer-archive/api.md

@@ -0,0 +1,88 @@
+# 客户档案 接口约定
+
+> 服务: sale | 资源: customerArchive
+
+## 1. 分页查询
+
+```
+POST /sale/customerArchive/list
+```
+
+### Request
+
+| 字段                | 类型   | 必填 | 说明                                |
+| ------------------- | ------ | ---- | ----------------------------------- |
+| customerCategory    | string | 是   | 客户分类: formal/temp/pool          |
+| customerName        | string |      | 客户名称（模糊）                    |
+| customerCode        | string |      | 客户编码                            |
+| tempCustomerCode    | string |      | 临时客户编号                        |
+| customerStatus      | string |      | 客户状态(dict: customer_status)     |
+| applicant           | string |      | 申请人                              |
+| conversionStatus    | string |      | 转换状态(dict: conversion_status)   |
+| createDateStart     | string |      | 建立日期-起(YYYY-MM-DD)             |
+| createDateEnd       | string |      | 建立日期-止(YYYY-MM-DD)             |
+| lastFollowDateStart | string |      | 最后跟进-起(YYYY-MM-DD)             |
+| lastFollowDateEnd   | string |      | 最后跟进-止(YYYY-MM-DD)             |
+| productLine         | string |      | 产品别(dict: product_line)          |
+| approvalStatus      | string |      | 审批状态(dict: approval_status)     |
+| verificationStatus  | string |      | 核实状态(dict: verification_status) |
+| enableStatus        | string |      | 启用状态(dict: enable_status)       |
+| current             | number | 是   | 当前页                              |
+| size                | number | 是   | 每页条数                            |
+
+### Response
+
+| 字段              | 类型   | 说明                            |
+| ----------------- | ------ | ------------------------------- |
+| customerName      | string | 客户名称                        |
+| customerShortName | string | 客户简称                        |
+| customerType      | string | 客户类型(dict: customer_type)   |
+| countryRegion     | string | 国家/地区                       |
+| tradeCurrency     | string | 交易币种                        |
+| taxCategory       | string | 纳税类别(dict: tax_category)    |
+| relationType      | string | 关系人分类(dict: relation_type) |
+| parentCustomer    | string | 上级客户                        |
+| groupName         | string | 集团                            |
+| createBy          | string | 建立人                          |
+| createTime        | string | 建立时间                        |
+| applyOrg          | string | 申请组织                        |
+| enableStatus      | string | 启用状态(dict: enable_status)   |
+| disableTime       | string | 停用时间                        |
+
+---
+
+## 2. 删除
+
+```
+DELETE /sale/customerArchive/remove?id={id}
+```
+
+## 3. 详情
+
+```
+GET /sale/customerArchive/getById?id={id}
+```
+
+## 4. 导出
+
+```
+GET /sale/customerArchive/export
+```
+
+支持与分页查询相同的筛选参数。
+
+---
+
+## 字典表
+
+| dictCode            | 值                                                        |
+| ------------------- | --------------------------------------------------------- |
+| customer_status     | 待定义                                                    |
+| conversion_status   | 已转换 / 未转换                                           |
+| product_line        | 热轧 / 盘元 / 冷精 / 汽车                                 |
+| approval_status     | 开立审批中 / 审批完成 / 流程终止 / 驳回                   |
+| verification_status | 已核实 / 未核实                                           |
+| enable_status       | 已启用 / 已停用                                           |
+| customer_type       | SYCSR001-交易客户 / SYCSR002-非交易客户                   |
+| tax_category        | 一般纳税人 / 小规模纳税人 / 海外纳税 / 其他               |
+| relation_type       | 01-关联企业 / 02-合并关系人 / 03-非关系人 / 04-实质关系人 |